/* The preview shell, theme rows and bare face sizing reuse SPECTRA preview CSS. */
.motion-series{color:#aadfff}
.motion-heading{display:flex;justify-content:space-between;align-items:center;gap:20px}
.view-switch,.buttons{display:flex;flex-wrap:wrap;gap:8px}
.view-switch{flex:0 0 auto}
.view-switch button,.buttons button,.playback-row button{background:#19221d;color:#ecede4;border:1px solid #5b6b62;border-radius:3px;padding:10px 14px;font-size:12px}
button[aria-pressed=true]{background:#dbd9ca;color:#142016}
button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #efc898;outline-offset:4px}
.motion-toolbar{display:flex;align-items:center;gap:16px;flex-wrap:wrap;border-block:1px solid #343c3d;padding:18px 0}
.motion-options{display:flex;gap:15px;flex-wrap:wrap;align-items:center}
.motion-options button{font-size:12px}
.motion-surface-label{font-size:12px}
.motion-options label{display:flex;gap:8px;align-items:center;font-size:12px}
.motion-options select{font-size:12px;min-width:0;max-width:100%}
.motion-options input{accent-color:#edbc84}
.playback-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-left:auto}
.playback-row button{min-width:80px}
.sample-time{font-size:12px;color:#a5b0ad;margin:0}
.sample-time output{font-variant-numeric:tabular-nums;letter-spacing:1px;margin-left:10px}
#status{flex-basis:100%;font-size:12px;line-height:1.7;color:#a5b0ad;margin:0}
.atlas-playback-status{flex:1 0 100%;min-width:0;font-size:12px;line-height:1.7;color:#a5b0ad}.atlas-playback-status p{margin:0;font-size:inherit;line-height:inherit}.atlas-playback-status #status,.atlas-playback-status [data-playback-status]{color:#aadfff}.detail-controls .atlas-playback-status{font-size:11px}.detail-controls .atlas-playback-status p{min-height:0}.detail-controls{align-content:safe center}
#all-grid{display:block}
.motion-card{border:0!important;background:transparent!important;padding:0!important;border-radius:0;box-shadow:none!important}
.motion-card>*{pointer-events:none}
.motion-card>.mini-face{display:block;width:100%;height:auto;aspect-ratio:1;margin-top:0;overflow:hidden;border-radius:50%;background:#000}
.mini-face svg,.mini-face img{display:block;width:100%;height:100%}
.motion-card:hover svg{transform:none}
.motion-card-label{color:#eeeae3;font-weight:400}
.embed-stage{display:none!important}
.note{font-size:13px;line-height:1.7;color:#a5b0ad;margin:20px 0}
.grid-hint{color:#edcda5}
.atlas-motion-view{display:grid;grid-template-columns:minmax(270px,1.1fr) 1fr;gap:40px;align-items:center;padding-top:30px;max-width:1000px;margin:auto}
#face,#embed-face{aspect-ratio:1;width:100%;border-radius:50%;overflow:hidden;background:#000}
#face>img,#face svg,#embed-face>img,#embed-face svg{width:100%;height:auto;display:block}
.detail-face #face{width:min(450px,100%,calc(100dvh - 144px));height:auto;flex-shrink:0}
.detail-controls .playback-row{margin-left:0;justify-content:space-between}
.detail-controls .sample-time{font-size:11px}
.detail-controls .atlas-store-badge{justify-self:start}
dialog:not([open]){display:none}
#face-dialog{width:min(1100px,calc(100% - 40px));height:min(640px,calc(100dvh - 32px));max-width:none;max-height:none;padding:0;overflow:hidden}
#face-dialog[open]{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);gap:0;align-items:stretch}
#face-dialog .detail-controls{grid-auto-rows:max-content;align-content:start}
#face-dialog .modal-close:focus-visible{outline-color:#aadfff}
@media(max-width:700px){#face-dialog{width:calc(100% - 24px);height:calc(100dvh - 24px)}#face-dialog .detail-face #face{width:100%}}
.is-detail-embed{overflow:hidden;background:#141c1b;color-scheme:dark}
.is-detail-embed .public-preview>header,.is-detail-embed .motion-heading,.is-detail-embed .motion-toolbar,.is-detail-embed #all-grid,.is-detail-embed .sample-note,.is-detail-embed .note,.is-detail-embed footer{display:none}
.is-detail-embed main{padding:0;margin:0;max-width:none}
.is-detail-embed #face-dialog{position:fixed;inset:0;width:100%;height:100dvh;margin:0;border:0;border-radius:0}
.is-detail-embed #face-dialog::backdrop{background:transparent;backdrop-filter:none}
.atlas-standalone{display:none}
.is-standalone .motion-heading,.is-standalone .motion-toolbar,.is-standalone #all-grid,.is-standalone .sample-note,.is-standalone .note{display:none}
.is-standalone .public-preview>header,.is-standalone main{max-width:1100px}
.is-standalone .atlas-standalone{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:40px;align-items:center;padding:24px 0 36px}
.atlas-standalone .detail-controls{max-height:none;overflow:visible;align-content:start}
.standalone-selection{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.detail-controls .standalone-speed{display:grid;gap:0;align-items:stretch}
.detail-controls .standalone-speed select{width:100%;min-width:0;margin:5px 0 0}
.detail-controls>.preview-motion-toggle{width:100%}
.detail-controls [data-speed]:disabled,.motion-options [data-speed]:disabled{opacity:.55;cursor:not-allowed}
.atlas-standalone .standalone-heading{display:grid;gap:10px}
.atlas-standalone .standalone-brand{color:#aadfff;font-size:10px;line-height:1.65;min-height:0;margin:0}
.atlas-standalone .standalone-heading #name{margin:0}
.atlas-standalone .detail-face #face{width:100%;max-width:490px}
.standalone-note{border-top:1px solid #343c3d;padding:22px 0}
.standalone-note p{font-size:13px;line-height:1.8;color:#a5b0ad;margin:0}
.standalone-compare{display:inline-block;margin-top:14px;border-bottom:1px solid #5b6b62;padding-bottom:7px;color:#aadfff;font-size:13px}
@media(max-width:700px){.is-standalone .atlas-standalone{grid-template-columns:1fr;gap:28px;padding-top:12px}.atlas-standalone .detail-face{width:min(450px,100%);margin:auto}.atlas-standalone .detail-controls{max-width:490px;margin:auto}}
.motion-controls{min-width:0}
.motion-controls h2{font-size:29px;line-height:1.3}
#description{font-size:13px;line-height:1.8;color:#a5b0ad}
.buttons{margin:20px 0}
.is-embed{background:transparent;overflow:hidden}
.is-embed .public-preview>header,.is-embed .motion-heading,.is-embed .motion-toolbar,.is-embed #all-grid,.is-embed .motion-controls,.is-embed .note,.is-embed .sample-note,.is-embed footer{display:none}
.is-embed main{padding:0;margin:0;max-width:none}
.is-embed .atlas-motion-view{display:block!important;padding:0;max-width:none}
.is-embed #embed-face{max-width:none;width:100vw;height:100vw}
@media(max-width:900px){.motion-heading{align-items:flex-start}.view-switch{flex-shrink:1}.playback-row{margin-left:0}}
@media(max-width:670px){.motion-heading{flex-direction:column;gap:12px}.motion-toolbar,.motion-options{gap:12px}.playback-row{width:100%;justify-content:space-between}.sample-time output{margin-left:5px}.atlas-motion-view{grid-template-columns:1fr;gap:20px}#face{max-width:420px;margin:auto}}