:root{color-scheme:dark;--ink:#e9e5dd;--muted:#97a8bb;--gold:#d4b67c;--line:#263440}*{box-sizing:border-box}body{margin:0;background:#090e16;color:var(--ink);font:14px/1.5 system-ui,sans-serif;background-image:radial-gradient(ellipse at 50% 0,#25324166,transparent 65%)}header,main,footer{max-width:1440px;margin:auto}header{padding:25px 36px;display:flex;justify-content:space-between;border-bottom:1px solid var(--line);font-size:11px;letter-spacing:.12em}a{color:var(--gold);text-decoration:none}main{padding:30px 36px}h1{font:40px/1.1 Georgia,serif;margin:8px 0 12px}p{color:var(--muted);margin:6px 0}.eyebrow{color:var(--gold);font-size:10px;letter-spacing:.22em}.motion-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}button,select{background:#15202c;color:var(--ink);border:1px solid #354250;border-radius:6px;padding:11px 14px;font:inherit;cursor:pointer}button:hover{border-color:var(--gold);background:#22303b}button:focus-visible,select:focus-visible,input:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:3px}#motion-roster{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:9px;margin-bottom:24px}#motion-roster button{padding:6px 3px;overflow:hidden;background:#0e1822;transition:border-color .15s}#motion-roster img{display:block;height:68px;width:100%;object-fit:contain}#motion-roster span{display:block;font-size:10px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;margin-top:4px}#motion-roster .selected{border-color:var(--gold);box-shadow:inset 0 -2px var(--gold);background:#29303a}.motion-workspace{display:grid;grid-template-columns:minmax(0,1fr) 250px;border:1px solid var(--line);border-radius:8px;overflow:hidden}.motion-scene{display:flex;align-items:center;justify-content:center;background:#03070c;min-width:0;aspect-ratio:16/9}.motion-scene:fullscreen{width:100vw;height:100vh;aspect-ratio:auto}#motion-canvas{display:block;width:100%;height:auto;max-height:100%;object-fit:contain;aspect-ratio:16/9}aside{padding:22px;background:#101925;border-left:1px solid var(--line);display:flex;flex-direction:column;gap:15px}label{display:flex;flex-direction:column;gap:6px;color:var(--muted);font-size:12px}select{width:100%;padding:10px;font-size:12px}.check{flex-direction:row;align-items:center}.check input{accent-color:var(--gold)}.motion-buttons{display:flex;gap:8px}.motion-buttons button{flex:1;font-size:12px}.motion-note{font-size:11px;color:#8293a8;line-height:1.65;border-top:1px solid var(--line);padding-top:14px}.motion-timing{margin-top:18px;border:1px solid var(--line);border-radius:7px;padding:18px 22px;background:#101925}.motion-timing div{display:flex;justify-content:space-between}.motion-timing strong{font-weight:500;color:var(--gold)}#motion-time{font-variant-numeric:tabular-nums;color:var(--muted)}#motion-timeline{width:100%;accent-color:var(--gold);margin:15px 0 6px}#motion-data{font-size:12px}footer{text-align:center;color:#758699;font-size:11px;padding:12px 36px 30px}@media(max-width:980px){.motion-workspace{grid-template-columns:1fr}aside{border-left:0;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr}.motion-note{grid-column:1/-1}#motion-roster{grid-template-columns:repeat(5,minmax(0,1fr))}header,main{padding:20px}.motion-heading{gap:15px}h1{font-size:32px}}@media(max-width:500px){header span{display:none}main{padding:16px}aside{padding:16px}.motion-heading button{max-width:110px;font-size:11px}#motion-roster img{height:56px}#motion-roster span{font-size:8px}}

@media(min-width:981px){aside{gap:11px;padding:18px}.motion-note{font-size:10px}.motion-buttons button{padding:9px 5px}.motion-scene{align-self:stretch;aspect-ratio:auto}#motion-canvas{align-self:center}}

.export-strip{max-width:1440px;margin:18px auto 0;padding:20px 24px;border:1px solid #39444f;border-radius:10px;background:#14202b;display:flex;flex-wrap:wrap;align-items:center;gap:16px}.export-strip b{font-size:11px;letter-spacing:.15em;color:#e5cb9d}.export-strip p{font-size:12px;color:#aebdca;margin:6px 0}.export-strip>div:nth-child(2){display:flex;gap:8px;flex-wrap:wrap;margin-left:auto}.export-strip button{padding:10px 13px;border:1px solid #516574;background:#233644;color:#f0e8d7;border-radius:6px;cursor:pointer}.export-strip button:focus-visible{outline:2px solid #dabc8d;outline-offset:3px}.export-strip button:disabled{opacity:.5;cursor:wait}#export-status{flex-basis:100%}
