/* Motion cards and rows share a poster and one on-demand preview player. */
.sd-bank{container-type:inline-size;container-name:motion-bank}
.sd-bank .sd-result-line{padding:calc(var(--cb-editor-space) * 0.4) calc(var(--cb-editor-space) * 0.6);gap:calc(var(--cb-editor-space) * 0.4);min-height:45px}
.sd-result-controls{display:flex;align-items:center;gap:calc(var(--cb-editor-space) * 0.35);min-width:0}
.sd-bank .sd-result-controls>select{width:83px;max-width:100%;font-size:calc(9px * var(--cb-type-scale))}
.sd-bank-view-switch{display:flex;align-items:center;padding:calc(var(--cb-editor-space) * 0.15);gap:calc(var(--cb-editor-space) * 0.1);border:var(--cb-border-width) solid var(--cb-border);background:var(--cb-raised);border-radius:calc(var(--cb-radius) * 0.58333);flex-shrink:0}
.sd-view-choice{display:flex;align-items:center;justify-content:center;gap:calc(var(--cb-editor-space) * 0.2);border:0;border-radius:calc(var(--cb-radius) * 0.33333);background:transparent;color:var(--cb-muted);min-width:34px;height:27px;padding:calc(var(--cb-editor-space) * 0.25) calc(var(--cb-editor-space) * 0.3);cursor:pointer;font-size:calc(9px * var(--cb-type-scale))}
.sd-view-choice[aria-pressed=true]{background:var(--cb-selected);color:var(--cb-on-selected);box-shadow:var(--cb-shadow)}
.sd-view-choice:hover{color:var(--cb-link);background:var(--cb-hover)}
.sd-preview-toolbar{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--cb-editor-space) * 0.4);padding:calc(var(--cb-editor-space) * 0.1) calc(var(--cb-editor-space) * 0.65) calc(var(--cb-editor-space) * 0.5);flex-shrink:0;font-size:calc(8px * var(--cb-type-scale));line-height:calc(1.5 * var(--cb-leading-scale));color:var(--cb-muted)}
.sd-preview-toolbar>span,.sd-preview-toolbar>label{display:flex;align-items:center;gap:calc(var(--cb-editor-space) * 0.25);min-width:0}
.sd-preview-toolbar>label{flex-shrink:0}
.sd-preview-toolbar select{font-size:calc(10px * var(--cb-type-scale));width:44px;padding:2px 14px 2px 6px;height:24px;min-height:24px;border:var(--cb-border-width) solid var(--cb-border);border-radius:calc(var(--cb-radius) * 0.33333);color:var(--cb-text);background-color:var(--cb-preview-surface)}
.sd-preview-toolbar .sd-touch-hint{display:none}
#sd-bank[data-preview-autoplay="false"] .sd-hover-hint{display:none}
#sd-bank[data-preview-autoplay="false"] .sd-touch-hint{display:inline}
.sd-bank .sd-motion-list.is-cards{--sd-card-min:136px;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,var(--sd-card-min)),1fr));grid-auto-rows:max-content;align-content:start;gap:calc(var(--cb-editor-space) * 0.5);padding:calc(var(--cb-editor-space) * 0.1) calc(var(--cb-editor-space) * 0.5) calc(var(--cb-editor-space) * 0.6)}
.sd-bank .sd-motion-list.sd-cards-small{--sd-card-min:112px}
.sd-bank .sd-motion-list.sd-cards-large{--sd-card-min:200px}
.sd-bank .sd-motion-list.is-list{display:flex;flex-direction:column;gap:calc(var(--cb-editor-space) * 0.35);padding:calc(var(--cb-editor-space) * 0.1) calc(var(--cb-editor-space) * 0.5) calc(var(--cb-editor-space) * 0.6)}
.sd-motion-list>.sd-list-empty{grid-column:1/-1;min-height:180px;width:100%}
.sd-motion-card{position:relative;min-width:0;align-self:start;overflow:hidden;border:var(--cb-border-width) solid var(--cb-border);border-radius:calc(var(--cb-radius) * 0.75);background:var(--cb-surface);transition:border-color calc(var(--cb-motion) * 0.9375),box-shadow calc(var(--cb-motion) * 0.9375)}
.sd-motion-card:hover,.sd-motion-card:focus-within{border-color:var(--cb-focus);box-shadow:var(--cb-shadow)}
.sd-motion-card.is-active{border-color:var(--cb-border-strong);box-shadow:0 0 0 1px var(--cb-focus);background:var(--cb-selected)}
.sd-card-main{display:block;width:100%;padding:0;background:none;border:0;color:var(--cb-text);text-align:left;cursor:pointer}
.sd-card-main:focus-visible{outline-offset:-3px!important}
.sd-preview{position:relative;display:block;overflow:hidden;background:var(--cb-preview-surface);isolation:isolate}
.sd-preview-card{aspect-ratio:4/3;width:100%;border-bottom:var(--cb-border-width) solid var(--cb-border)}
.sd-preview-poster,.sd-preview-video,.sd-preview-gif{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block;border:0;pointer-events:none}
.sd-preview-poster{z-index:0}
.sd-preview-video,.sd-preview-gif{z-index:1;opacity:0}
.sd-preview.is-previewing .sd-preview-video,.sd-preview.is-previewing .sd-preview-gif{opacity:1}
.sd-preview.is-previewing .sd-preview-poster{opacity:0}
.sd-preview-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:calc(var(--cb-editor-space) * 0.35);color:var(--cb-muted);background:linear-gradient(145deg,var(--cb-preview-surface),var(--cb-preview-surface))}
.sd-preview-placeholder small{font-size:calc(9px * var(--cb-type-scale));letter-spacing:.03em;font-weight:400}
.sd-preview-kind,.sd-preview-duration,.sd-preview-live{position:absolute;z-index:2;display:inline-flex;align-items:center;gap:calc(var(--cb-editor-space) * 0.15);line-height:calc(1.2 * var(--cb-leading-scale));pointer-events:none;font-size:calc(8px * var(--cb-type-scale));border-radius:calc(var(--cb-radius) * 0.33333);font-weight:500}
.sd-preview-kind{top:7px;left:7px;padding:calc(var(--cb-editor-space) * 0.2) calc(var(--cb-editor-space) * 0.25);color:var(--cb-text);background:color-mix(in srgb, var(--cb-preview-surface) 92.94118%, transparent);border:var(--cb-border-width) solid color-mix(in srgb, var(--cb-border) 66.66667%, transparent)}
.sd-preview-duration{right:7px;bottom:7px;background:color-mix(in srgb, var(--cb-inverse) 87.45098%, transparent);color:var(--cb-on-inverse);padding:calc(var(--cb-editor-space) * 0.15) calc(var(--cb-editor-space) * 0.25);font-variant-numeric:tabular-nums}
.sd-preview-live{display:none;left:7px;bottom:7px;padding:calc(var(--cb-editor-space) * 0.2) calc(var(--cb-editor-space) * 0.25);color:var(--cb-on-primary);background:color-mix(in srgb, var(--cb-preview-surface) 92.54902%, transparent)}
.sd-preview.is-previewing .sd-preview-live{display:flex}
.sd-preview.is-preview-loading:after{content:'';position:absolute;z-index:3;left:50%;top:50%;width:16px;height:16px;margin:-8px;border:calc(var(--cb-border-width) * 2) solid color-mix(in srgb, var(--cb-border) 65.09804%, transparent);border-top-color:var(--cb-border-strong);border-radius:50%;animation:sd-preview-spin calc(var(--cb-motion) * 4.375) linear infinite}
@keyframes sd-preview-spin{to{transform:rotate(360deg)}}
.sd-card-info{display:flex;flex-direction:column;gap:calc(var(--cb-editor-space) * 0.25);padding:calc(var(--cb-editor-space) * 0.5) calc(var(--cb-editor-space) * 0.5) calc(var(--cb-editor-space) * 0.3);min-width:0}
.sd-card-info strong{font-size:calc(11px * var(--cb-type-scale));line-height:calc(1.5 * var(--cb-leading-scale));font-weight:600;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:33px}
.sd-card-info small{font-size:calc(8px * var(--cb-type-scale));color:var(--cb-info-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:calc(1.6 * var(--cb-leading-scale))}
.sd-card-footer{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--cb-editor-space) * 0.15);min-height:34px;padding:0 calc(var(--cb-editor-space) * 0.4) calc(var(--cb-editor-space) * 0.3)}
.sd-card-footer>span{display:flex;align-items:center;gap:calc(var(--cb-editor-space) * 0.2);min-width:0;color:var(--cb-muted);font-size:calc(8px * var(--cb-type-scale));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sd-card-footer>span>.cb-icon{flex-shrink:0}
.sd-card-footer>div{display:flex;align-items:center;gap:calc(var(--cb-editor-space) * 0.1);flex-shrink:0}
.sd-card-footer .sd-icon-button{width:25px;min-height:25px;height:25px;padding:5px;border-color:transparent;background:transparent;color:var(--cb-muted)}
.sd-card-footer .sd-icon-button:hover{border-color:var(--cb-border-strong);background:var(--cb-hover);color:var(--cb-link)}
.sd-preview-play[aria-pressed=true]{background:var(--cb-selected)!important;border-color:var(--cb-border-strong)!important;color:var(--cb-on-selected)!important}
.sd-card-selected{position:absolute;right:7px;top:7px;display:flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;background:var(--cb-primary);color:var(--cb-on-primary);z-index:3;pointer-events:none;box-shadow:var(--cb-shadow)}
.sd-bank .sd-media-row{display:flex;align-items:center;gap:0;border:var(--cb-border-width) solid var(--cb-border);background:var(--cb-surface);border-radius:calc(var(--cb-radius) * 0.66667);min-height:80px;margin:0;flex-shrink:0;overflow:hidden}
.sd-bank .sd-media-row.is-active{border-color:var(--cb-border-strong);background:var(--cb-selected)}
.sd-bank .sd-media-row:hover{border-color:var(--cb-border-strong);background:var(--cb-hover)}
.sd-bank .sd-media-row>.sd-motion-row,.sd-bank .sd-media-row>.sd-pack-toggle{flex:1;min-width:0;margin:0;min-height:80px;padding:calc(var(--cb-editor-space) * 0.35);gap:calc(var(--cb-editor-space) * 0.45);border:0;background:transparent;border-radius:0}
.sd-bank .sd-media-row .sd-preview-compact{width:64px;height:64px;border:var(--cb-border-width) solid var(--cb-border);border-radius:calc(var(--cb-radius) * 0.41667);flex-shrink:0}
.sd-preview-compact .sd-preview-live{left:3px;bottom:3px;font-size:calc(6px * var(--cb-type-scale));padding:calc(var(--cb-editor-space) * 0.15);gap:calc(var(--cb-editor-space) * 0.1)}
.sd-preview-compact .sd-preview-live .cb-icon{width:8px;height:8px}
.sd-preview-compact .sd-preview-placeholder small{display:none}
.sd-bank .sd-media-row .sd-motion-copy strong{font-size:calc(11px * var(--cb-type-scale));font-weight:550}
.sd-bank .sd-media-row .sd-motion-copy>small{font-size:calc(8px * var(--cb-type-scale));margin-top:4px}
.sd-bank .sd-media-row .sd-motion-copy>span{display:flex;margin-top:5px}
.sd-bank .sd-media-row .sd-motion-copy i{display:flex;align-items:center;gap:calc(var(--cb-editor-space) * 0.15);max-width:85px;font-size:calc(7px * var(--cb-type-scale))}
.sd-bank .sd-media-row .sd-motion-meta{padding-left:calc(var(--cb-editor-space) * 0.15)}
.sd-bank .sd-media-row .sd-motion-meta>b{font-size:calc(10px * var(--cb-type-scale))}
.sd-bank .sd-media-row .sd-motion-meta>small{font-size:calc(7px * var(--cb-type-scale))}
.sd-bank .sd-media-row>.sd-preview-play{margin-right:7px;flex-shrink:0}
.sd-row-actions{display:flex;flex-direction:column;gap:calc(var(--cb-editor-space) * 0.15);padding-right:calc(var(--cb-editor-space) * 0.3);flex-shrink:0}
.sd-bank .sd-media-row .sd-icon-button{width:24px;min-height:24px;height:24px;padding:5px;background:transparent;border-color:transparent}
.sd-bank .sd-media-row .sd-icon-button:hover{background:var(--cb-hover);border-color:var(--cb-border-strong)}
.sd-bank .sd-motion-list.is-list>.sd-media-row{width:100%}
.sd-bank.is-expanded .sd-motion-list.is-list{display:flex;grid-template-columns:none;max-width:none;gap:calc(var(--cb-editor-space) * 0.4)}
.sd-bank.is-expanded .sd-motion-list.is-cards{--sd-card-min:210px;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,var(--sd-card-min)),1fr));gap:calc(var(--cb-editor-space) * 0.7);padding:calc(var(--cb-editor-space) * 0.2) calc(var(--cb-editor-space) * 0.8) calc(var(--cb-editor-space) * 0.8)}
.sd-bank.is-expanded .sd-motion-list.sd-cards-small{--sd-card-min:155px}
.sd-bank.is-expanded .sd-motion-list.sd-cards-large{--sd-card-min:285px}
.sd-bank.is-expanded .sd-card-info strong{font-size:calc(13px * var(--cb-type-scale));min-height:20px;white-space:nowrap;display:block;text-overflow:ellipsis}
.sd-bank.is-expanded .sd-card-info small,.sd-bank.is-expanded .sd-card-footer>span{font-size:calc(10px * var(--cb-type-scale))}
.sd-bank.is-expanded .sd-card-info{padding:calc(var(--cb-editor-space) * 0.6) calc(var(--cb-editor-space) * 0.6) calc(var(--cb-editor-space) * 0.4)}
.sd-bank.is-expanded .sd-card-footer{padding:0 calc(var(--cb-editor-space) * 0.5) calc(var(--cb-editor-space) * 0.4);min-height:37px}
.sd-bank.is-expanded .sd-card-footer .sd-icon-button{width:29px;min-height:29px;height:29px}
.sd-bank.is-expanded .sd-result-line{padding-left:calc(var(--cb-editor-space) * 0.85);padding-right:calc(var(--cb-editor-space) * 0.85)}
.sd-bank.is-expanded .sd-preview-toolbar{padding-left:calc(var(--cb-editor-space) * 0.85);padding-right:calc(var(--cb-editor-space) * 0.85);font-size:calc(10px * var(--cb-type-scale))}
.sd-bank.is-expanded .sd-view-choice{font-size:calc(11px * var(--cb-type-scale));min-width:59px;min-height:32px;padding:calc(var(--cb-editor-space) * 0.3) calc(var(--cb-editor-space) * 0.5)}
.sd-bank.is-expanded .sd-result-controls>select{width:105px;font-size:calc(11px * var(--cb-type-scale));margin-right:8px}
.sd-bank-heading .sd-bank-enlarge{width:auto;padding:calc(var(--cb-editor-space) * 0.25) calc(var(--cb-editor-space) * 0.35);gap:calc(var(--cb-editor-space) * 0.25);font-size:calc(10px * var(--cb-type-scale))}
.sd-bank-control-label{font-size:calc(10px * var(--cb-type-scale));white-space:nowrap}
@media(min-width:1001px){
  .sd-bank.is-expanded{display:grid;grid-template-columns:minmax(220px,1fr) minmax(330px,1.3fr) minmax(235px,.9fr);grid-template-rows:63px 54px 48px minmax(0,1fr) auto}
  .sd-bank.is-expanded>.sd-bank-heading{grid-column:1/-1;grid-row:1;margin:0;height:63px}
  .sd-bank.is-expanded>.sd-source-tabs{grid-column:1/3;grid-row:2;margin:0 0 0 18px;padding:calc(var(--cb-editor-space) * 0.5) 0;border:0;align-items:center}
  .sd-bank.is-expanded>.sd-bank-tools{grid-column:3;grid-row:2;padding:calc(var(--cb-editor-space) * 0.4) calc(var(--cb-editor-space) * 0.8) calc(var(--cb-editor-space) * 0.4) 0;justify-content:flex-end;gap:calc(var(--cb-editor-space) * 0.6)}
  .sd-bank.is-expanded>.sd-search{grid-column:1;grid-row:3;margin:0 0 12px 16px}
  .sd-bank.is-expanded>.sd-categories{grid-column:2;grid-row:3;grid-template-columns:repeat(3,minmax(0,1fr));margin:0 0 12px;padding:0 calc(var(--cb-editor-space) * 0.6);align-items:stretch}
  .sd-bank.is-expanded>.sd-categories>select{height:36px}
  .sd-bank.is-expanded>.sd-tag-row{grid-column:3;grid-row:3;padding:0 calc(var(--cb-editor-space) * 0.8) calc(var(--cb-editor-space) * 0.6) 0;justify-content:space-between}
  .sd-bank.is-expanded>#sd-results{grid-column:1/-1;grid-row:4;overflow:hidden}
  .sd-bank.is-expanded>.sd-bank-footer{grid-column:1/-1;grid-row:5}
}
@container motion-bank (min-width:540px){
  .sd-motion-list.is-list .sd-media-row>.sd-motion-row,.sd-motion-list.is-list .sd-media-row>.sd-pack-toggle{gap:calc(var(--cb-editor-space) * 0.75);padding:calc(var(--cb-editor-space) * 0.45) calc(var(--cb-editor-space) * 0.6)}
  .sd-motion-list.is-list .sd-motion-copy{display:grid;grid-template-columns:minmax(120px,1.2fr) minmax(100px,1fr);align-items:center;gap:calc(var(--cb-editor-space) * 0.3) calc(var(--cb-editor-space) * 0.75)}
  .sd-motion-list.is-list .sd-motion-copy>strong{font-size:calc(12px * var(--cb-type-scale))!important}
  .sd-motion-list.is-list .sd-motion-copy>small{font-size:calc(10px * var(--cb-type-scale))!important;margin:0!important}
  .sd-motion-list.is-list .sd-motion-copy>span{grid-column:1/-1;margin:0!important}
  .sd-motion-list.is-list .sd-motion-copy i{font-size:calc(9px * var(--cb-type-scale))!important;max-width:120px!important}
  .sd-motion-list.is-list .sd-motion-meta{min-width:75px;gap:calc(var(--cb-editor-space) * 0.3)}
  .sd-motion-list.is-list .sd-motion-meta>small{font-size:calc(9px * var(--cb-type-scale))!important}
  .sd-row-actions{flex-direction:row;padding-right:calc(var(--cb-editor-space) * 0.6);gap:calc(var(--cb-editor-space) * 0.4)}
  .sd-bank .sd-media-row .sd-icon-button{width:30px;height:30px;min-height:30px}
  .sd-bank .sd-media-row>.sd-preview-play{margin-right:12px}
  .sd-bank .sd-result-line{font-size:calc(11px * var(--cb-type-scale))}
}
@container motion-bank (max-width:310px){
  .sd-bank-view-switch .sd-view-choice>span{display:none}
  .sd-bank .sd-motion-list.is-cards{--sd-card-min:110px;gap:calc(var(--cb-editor-space) * 0.35);padding-left:calc(var(--cb-editor-space) * 0.35);padding-right:calc(var(--cb-editor-space) * 0.35)}
  .sd-bank .sd-motion-list.sd-cards-large{--sd-card-min:180px}
  .sd-card-info{padding:calc(var(--cb-editor-space) * 0.4) calc(var(--cb-editor-space) * 0.35) calc(var(--cb-editor-space) * 0.25)}
  .sd-card-info strong{font-size:calc(10px * var(--cb-type-scale));min-height:30px}
  .sd-card-footer{padding-left:calc(var(--cb-editor-space) * 0.3);padding-right:calc(var(--cb-editor-space) * 0.25)}
  .sd-card-footer>span>.cb-icon{display:none}
  .sd-card-footer .sd-icon-button{width:22px;height:24px;min-height:24px;padding:4px}
  .sd-bank .sd-media-row .sd-preview-compact{width:50px;height:58px}
  .sd-bank .sd-media-row .sd-motion-meta>small{display:none}
  .sd-bank .sd-media-row .sd-motion-copy strong{font-size:calc(10px * var(--cb-type-scale))}
  .sd-preview-toolbar{padding-left:calc(var(--cb-editor-space) * 0.5);padding-right:calc(var(--cb-editor-space) * 0.5);font-size:calc(7px * var(--cb-type-scale))}
}
@media(max-width:520px){
  .sd-bank .sd-motion-list.is-cards,.sd-bank.is-expanded .sd-motion-list.is-cards{--sd-card-min:135px;gap:calc(var(--cb-editor-space) * 0.5);padding:calc(var(--cb-editor-space) * 0.15) calc(var(--cb-editor-space) * 0.55) calc(var(--cb-editor-space) * 0.6)}
  .sd-bank .sd-motion-list.sd-cards-small{--sd-card-min:110px}
  .sd-bank .sd-motion-list.sd-cards-large{--sd-card-min:210px}
  .sd-bank.is-expanded .sd-card-info strong{font-size:calc(11px * var(--cb-type-scale));white-space:normal;display:-webkit-box;min-height:33px}
  .sd-bank.is-expanded .sd-card-info{padding:calc(var(--cb-editor-space) * 0.5) calc(var(--cb-editor-space) * 0.45) calc(var(--cb-editor-space) * 0.3)}
  .sd-bank.is-expanded .sd-card-info small,.sd-bank.is-expanded .sd-card-footer>span{font-size:calc(8px * var(--cb-type-scale))}
  .sd-bank.is-expanded .sd-view-choice{min-width:40px;font-size:calc(10px * var(--cb-type-scale));padding:calc(var(--cb-editor-space) * 0.25) calc(var(--cb-editor-space) * 0.3)}
  .sd-bank.is-expanded .sd-result-controls>select{width:84px;font-size:calc(9px * var(--cb-type-scale));margin-right:0}
  .sd-preview-play{min-width:30px!important;min-height:30px!important}
  .sd-card-footer .sd-icon-button{min-width:28px;min-height:30px;height:30px}
  .sd-bank .sd-result-line{padding-left:calc(var(--cb-editor-space) * 0.6);padding-right:calc(var(--cb-editor-space) * 0.6)}
}
@media(hover:none),(pointer:coarse){
  .sd-preview-toolbar .sd-hover-hint{display:none}
  .sd-preview-toolbar .sd-touch-hint{display:inline}
  .sd-preview-play{background:var(--cb-preview-surface)!important;border-color:var(--cb-border)!important}
}
@media(prefers-reduced-motion:reduce){
  .sd-motion-card{transition:none}
  .sd-preview.is-preview-loading:after{animation:none}
  .sd-preview-toolbar .sd-hover-hint{display:none}
  .sd-preview-toolbar .sd-touch-hint{display:inline}
}