:root{font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#050713}*{box-sizing:border-box}html,body,#app,.game-surface{width:100%;height:100%}body{min-width:320px;min-height:100svh;margin:0;overflow:hidden}#app{--animator-ui-padding:12px;--animator-ui-gap:var(--animator-ui-padding);--animator-ui-tight-gap:calc(var(--animator-ui-padding) / 2)}#app.compact-workspace{--animator-ui-padding:6px}.game-surface{background:#050713;position:fixed;inset:0;overflow:hidden}#webgpu-canvas{background:#0a1022;border:0;border-radius:0;outline:none;width:100vw;height:100svh;display:block}#webgpu-canvas:focus-visible{box-shadow:inset 0 0 0 2px #7dd3fce6}.visually-hidden{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.animator-shell{color:#e5f0ff;background:#070b12;flex-direction:column;height:100svh;min-height:100svh;font-family:Aptos,Segoe UI Variable,Segoe UI,ui-sans-serif,system-ui,sans-serif;display:flex;overflow:hidden}.animator-header{align-items:center;gap:var(--animator-ui-tight-gap) var(--animator-ui-gap);width:100%;min-height:48px;padding:var(--animator-ui-tight-gap) var(--animator-ui-padding) var(--animator-ui-padding);color:#dbe7f7;background:radial-gradient(circle at 20% 0,#7dd3fc1f,#0000 28%),linear-gradient(#111a27,#0d1521);border-bottom:1px solid #263243;flex:none;grid-template-columns:auto minmax(0,1fr) auto;display:grid}.app-identity{align-items:center;gap:8px;min-width:0;font-size:.9rem;display:flex}.app-icon{color:#8ee6ff}.app-name{letter-spacing:.01em;font-weight:700}.workspace-shortcuts{white-space:nowrap;grid-column:2;gap:6px;min-width:0;display:flex;overflow-x:auto}.workspace-chip{color:#cbdaf0;cursor:pointer;background:#111827;border:1px solid #7dd3fc3d;border-radius:999px;flex:none;min-height:30px;padding:4px 10px}.workspace-chip:hover,.workspace-chip.active{color:#06111f;background:#fbbf24;border-color:#fbbf24}.workspace-menu{grid-column:3;justify-self:end;position:relative}.workspace-menu summary{color:#e5f0ff;cursor:pointer;-webkit-user-select:none;user-select:none;background:linear-gradient(#26364b,#172234);border:1px solid #7dd3fc42;border-radius:8px;min-height:30px;padding:5px 10px;list-style:none}.workspace-menu summary::-webkit-details-marker{display:none}.workspace-menu[open] summary,.workspace-menu summary:hover{border-color:#7dd3fc}.workspace-menu-popover{z-index:20;top:calc(100% + var(--animator-ui-tight-gap));gap:calc(var(--animator-ui-tight-gap) * .75);min-width:190px;padding:var(--animator-ui-tight-gap);background:#0b1220;border:1px solid #7dd3fc38;border-radius:10px;display:grid;position:absolute;right:0;box-shadow:0 16px 40px #00000059}.workspace-menu-popover button{color:#dbeafe;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:7px;min-height:32px;padding:0 10px}.workspace-menu-popover hr{border:0;border-top:1px solid #7dd3fc29;width:100%}.workspace-menu-popover button:hover,.workspace-menu-popover button.active{color:#06111f;background:#fbbf24}.hint,.panel-intro{color:#9fb2d2}.panel-intro{max-width:56ch;margin:4px 0 0;font-size:.82rem;line-height:1.35}.workflow-rail{grid-column:1/-1;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none;display:grid}.workflow-rail li{background:#070b1885;border:0;border-radius:0;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:0 9px;min-height:44px;padding:8px 10px;display:grid;position:relative}.workflow-rail span{color:#06111f;background:#fbbf24;border-radius:999px;grid-row:1/3;place-items:center;width:26px;height:26px;font-weight:900;display:grid}.workflow-rail strong,.workflow-rail small{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.workflow-rail strong{font-size:.82rem}.workflow-rail small{color:#8ea1bd;font-size:.72rem}.animator-grid{grid-template-columns:repeat(4,minmax(240px,1fr));gap:16px;max-width:1440px;margin:0 auto;display:grid}.animator-card{gap:var(--animator-ui-gap);min-height:0;padding:calc(var(--animator-ui-padding) + 4px);background:#080d1cd1;border:0;border-radius:0;flex-direction:column;display:flex;box-shadow:0 18px 50px #00000047}.animator-card h2{margin:0;font-size:1rem}.animator-card label{color:#bdd0ed;gap:6px;font-size:.85rem;display:grid}.animator-card input,.animator-card select,.animator-card textarea,.animator-card button{color:#e5f0ff;background:#0d1428;border:1px solid #94a3b847;border-radius:10px}.animator-card input,.animator-card select{min-height:36px;padding:0 10px}.checkline{grid-template-columns:auto 1fr;align-items:center}.field-grid{gap:calc(var(--animator-ui-padding) - 2px);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.panel-heading{justify-content:space-between;align-items:start;gap:12px;display:flex}.compact-heading{align-items:start}.panel-heading h2,.eyebrow{margin:0}.eyebrow,.open-count{color:#7dd3fc;letter-spacing:.08em;text-transform:uppercase;font-size:.72rem;font-weight:800}.open-count{background:#7dd3fc14;border:1px solid #7dd3fc3d;border-radius:999px;padding:4px 8px}.sprite-map-tiles{gap:6px;min-height:0;display:grid;overflow:auto}.sprite-map-tile{color:#dbe7f7;text-align:left;cursor:pointer;background:#0b111cc7;border:1px solid #0000;border-radius:10px;grid-template-columns:52px minmax(0,1fr) auto;align-items:center;gap:10px;width:100%;min-height:64px;padding:8px;display:grid}.sprite-map-tile:hover{background:#101827f5;border-color:#7dd3fc61}.sprite-map-tile.open{border-color:#7dd3fc33}.sprite-map-tile.active{background:#fbbf241a;border-color:#fbbf24d1}.sprite-map-thumb{background-color:#070b18;background-image:linear-gradient(45deg,#94a3b817 25%,#0000 25% 75%,#94a3b817 75%),none;background-position:0 0,0 0;background-repeat:repeat,repeat;background-size:12px 12px;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;border-radius:8px;place-items:center;width:52px;height:48px;display:grid;overflow:hidden}.sprite-map-thumb img{max-width:46px;max-height:40px;image-rendering:pixelated}.sprite-map-copy{gap:4px;min-width:0;display:grid}.sprite-map-title,.sprite-map-path,.sprite-map-tags{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.sprite-map-title{font-size:.86rem;font-weight:800}.sprite-map-path,.sprite-map-tags{color:#8ea1bd;font-size:.72rem}.sprite-map-action{color:#9fb2d2;letter-spacing:.04em;text-transform:uppercase;background:#94a3b81a;border-radius:999px;padding:4px 7px;font-size:.66rem;font-weight:900}.sprite-map-tile.active .sprite-map-action{color:#06111f;background:#fbbf24}.asset-meta{grid-template-columns:max-content 1fr;align-content:start;gap:6px 10px;margin:0;font-size:.8rem;display:grid}.asset-meta dt{color:#7dd3fc}.asset-meta dd{overflow-wrap:anywhere;margin:0}.frame-list,.chosen-frames,.clip-list,.clip-toolbar{flex-wrap:wrap;align-content:start;gap:6px;max-height:260px;display:flex;overflow:auto}#frame-picker-panel{height:100%;padding:0}.frame-list{min-height:0;max-height:none;padding:calc(var(--animator-ui-padding) + 4px);scrollbar-gutter:stable;flex:auto;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));grid-auto-rows:max-content;display:grid}.animation-panel{gap:calc(var(--animator-ui-padding) + 2px);padding:var(--animator-ui-padding)}.clip-library-card{height:100%;padding:0}.clip-library-card .clip-list{min-height:0;max-height:none;padding:calc(var(--animator-ui-padding) + 4px);scrollbar-gutter:stable;flex:auto;grid-auto-rows:max-content;display:grid;overflow:auto}.clip-library-card .clip-toolbar{background:#070b18ad;border-top:1px solid #94a3b829;grid-template-columns:repeat(3,minmax(0,1fr));max-height:none;padding:8px;display:grid}.section-heading{justify-content:space-between;align-items:start;gap:12px;display:flex}.section-heading h2,.section-heading .hint{margin:0}.section-heading .hint{margin-top:3px;font-size:.78rem}.clip-toolbar{flex:none;overflow:visible}.clip-inspector-card{height:100%;padding:calc(var(--animator-ui-padding) + 4px);gap:12px}.clip-field-grid{grid-template-columns:minmax(0,1fr) minmax(82px,.45fr);gap:10px;display:grid}.clip-id-field{grid-column:1/-1}.clip-field-grid label:has(#next-clip-id){grid-column:1/-1}.clip-flags{border-top:1px solid #94a3b824;gap:8px;margin-top:auto;padding-top:10px;display:grid}.frame-pill,.chosen-pill,.clip-pill,.clip-toolbar button,#play-toggle{cursor:pointer;padding:7px 10px}.frame-pill{place-items:center;width:100%;min-width:0;min-height:0;padding:clamp(6px,12%,14px);display:grid;position:relative}.frame-pill:before{content:"";grid-area:1/1;width:0;padding-bottom:100%}.frame-thumbnail{object-fit:contain;width:100%;height:100%;image-rendering:pixelated;grid-area:1/1}.frame-index{color:#06111f;background:#7dd3fc;border-radius:999px;min-width:18px;padding:1px 4px;font-size:.72rem;font-weight:700;line-height:1.25;position:absolute;bottom:4px;right:4px}.frame-pill:hover,.chosen-pill:hover,.clip-pill:hover,.clip-toolbar button:hover,#play-toggle:hover{border-color:#7dd3fc}.frame-pill.selected{border-color:#7dd3fc;box-shadow:inset 0 0 0 1px #7dd3fc,0 0 18px #7dd3fc29}.clip-pill{text-align:left;grid-template-columns:3ch minmax(0,1fr);gap:2px 10px;width:100%;min-height:54px;display:grid}.clip-pill-index{color:#7dd3fc;letter-spacing:.04em;grid-row:1/3;align-self:center;font-size:.72rem;font-weight:900}.clip-pill-name,.clip-pill-meta{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.clip-pill-name{font-size:.84rem;font-weight:850}.clip-pill-meta{color:#8ea1bd;font-size:.72rem}.clip-pill.active{color:#dbeafe;background:#fbbf241a;border-color:#fbbf24d1}.clip-pill.active .clip-pill-index{color:#fbbf24}.chosen-pill{flex:0 0 clamp(48px,9svh,86px);place-items:center;min-width:44px;max-width:100%;height:100%;min-height:0;padding:clamp(3px,1svh,8px) 6px;display:grid;position:relative;color:#dbeafe!important;background:#101827!important}.chosen-pill .frame-thumbnail{width:min(48px,100% - 8px);height:min(48px,100% - 10px)}.chosen-pill:after{content:"";background:#7dd3fc80;width:10px;height:2px;position:absolute;top:50%;right:-8px}.chosen-pill:last-child:after{display:none}.chosen-pill.active{border-color:#fbbf24;box-shadow:inset 0 0 0 1px #fbbf24,0 0 24px #fbbf2429}.chosen-pill.drop-before{box-shadow:inset 4px 0 #7dd3fc,0 0 20px #7dd3fc2e}.chosen-pill.drop-after{box-shadow:inset -4px 0 #7dd3fc,0 0 20px #7dd3fc2e}.timeline-order{color:#06111f;background:#fbbf24;border-radius:999px;min-width:20px;padding:2px 5px;font-size:.7rem;font-weight:900;position:absolute;top:5px;left:5px}.timeline-remove{color:#fecaca;opacity:0;background:#7f1d1db8;border-radius:999px;place-items:center;width:20px;height:20px;font-size:.9rem;font-weight:900;line-height:1;transition:opacity .12s,transform .12s;display:grid;position:absolute;top:5px;right:5px}.chosen-pill:hover .timeline-remove,.chosen-pill:focus-visible .timeline-remove{opacity:1}.timeline-remove:hover{color:#fff;background:#dc2626;transform:scale(1.08)}.preview-card{gap:0;width:100%;min-width:0;height:100%;min-height:0;margin:0;padding:0;overflow:hidden}.playback-timeline-card{align-items:stretch;gap:clamp(var(--animator-ui-padding), 1svh, calc(var(--animator-ui-padding) * 2));height:100%;padding:clamp(var(--animator-ui-tight-gap), 1svh, calc(var(--animator-ui-padding) - 2px)) var(--animator-ui-padding);background:linear-gradient(#141e31f5,#080d1cf5),radial-gradient(circle at 8% 20%,#fbbf2429,#0000 30%);grid-template-columns:auto minmax(0,1fr);display:grid;overflow:hidden;min-height:0!important}.playback-strip{align-content:center;gap:var(--animator-ui-gap);min-width:0;min-height:0;padding-right:var(--animator-ui-padding);border-right:1px solid #94a3b829;display:grid}.playback-controls{align-items:center;gap:calc(var(--animator-ui-padding) - 4px);display:flex}.playback-controls #play-toggle{color:#06111f;background:linear-gradient(#fcd34d,#f59e0b);border-color:#fbbf2473;min-width:74px;height:min(38px,100%);min-height:28px;font-weight:900}.timeline-frames{flex-wrap:nowrap;align-items:stretch;height:100%;min-height:0;max-height:none;padding:2px;overflow:auto hidden}.preview-stage{background-color:#070b18;background-image:linear-gradient(45deg,#94a3b814 25%,#0000 25% 75%,#94a3b814 75%),none;background-position:0 0,0 0;background-repeat:repeat,repeat;background-size:20px 20px;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;border-radius:0;flex:auto;width:100%;min-width:0;height:100%;min-height:0;margin:0;padding:0;display:block;position:relative;overflow:hidden}#preview-canvas{width:100%;height:100%;image-rendering:pixelated;margin:0;padding:0;display:block;position:absolute;inset:0}.export-card{gap:0;height:100%;padding:0;position:relative;overflow:hidden}.export-codeblock{color:#dbeafe;white-space:pre;background:#070b18;border:0;border-radius:0;flex:auto;min-height:0;margin:0;padding:16px;font-family:Cascadia Code,SFMono-Regular,Consolas,monospace;font-size:.78rem;line-height:1.5;overflow:auto}.export-float{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#070b18db;border:1px solid #94a3b838;border-radius:14px;gap:10px;width:min(360px,100% - 24px);padding:10px;display:grid;position:absolute;bottom:12px;right:12px;box-shadow:0 16px 36px #0000005c}.validation-list{gap:4px;max-height:110px;font-size:.78rem;display:grid;overflow:auto}.validation-list p{margin:0}.validation-list .ok{color:#86efac}.validation-list .error{color:#fca5a5}#copy-export{cursor:pointer;min-height:36px}@media (width<=1180px){.animator-grid{grid-template-columns:repeat(2,minmax(260px,1fr))}}@media (width<=680px){.animator-header{grid-template-columns:1fr;align-items:stretch}.workflow-rail{grid-template-columns:1fr}}.animator-dockview-wrap{background:#080d1cb8;border:0;flex:auto;width:100%;min-height:0;margin:0;overflow:hidden}#animator-dockview,.animator-panel-host{width:100%;height:100%}.animator-panel-host{background:#070b18;min-height:0;padding:0;overflow:auto}.animator-panel-host:has(.preview-card){overflow:hidden}.animator-panel-host .animator-card{min-height:100%;box-shadow:none;border-radius:0}.animator-shell .dockview-theme-abyss{--dv-tabs-and-actions-container-font-size:.82rem}#app.layout-editing .animator-dockview-wrap{outline-offset:-2px;outline:2px solid #fbbf24b3}#app.hide-panel-headers .dockview-theme-abyss .dv-tabs-and-actions-container,#app.hide-panel-headers .dockview-theme-abyss .dv-tabs-container,#app.hide-panel-headers .dockview-theme-abyss .dv-tab,#app.hide-panel-headers .panel-heading{display:none!important}.asset-import-placeholder{color:#8ea1bd;background:0 0;border:1px dashed #94a3b83d;border-radius:10px;justify-content:space-between;align-items:center;gap:8px;padding:8px 10px;font-size:.76rem;display:flex}.asset-import-placeholder button{color:#8ea1bd;font:inherit;text-transform:uppercase;background:#0f172a8f;border:1px solid #94a3b838;border-radius:999px;flex:none;padding:4px 8px;font-weight:900}.sprite-map-title{align-items:center;gap:8px;display:flex}.sprite-map-title>span:first-child{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.asset-source-badge{color:#7dd3fc;letter-spacing:.04em;text-transform:uppercase;background:#7dd3fc14;border:1px solid #7dd3fc47;border-radius:999px;flex:none;padding:2px 6px;font-size:.65rem;font-weight:900}.workspace-manager-card{min-height:100%}.workspace-manager-grid{gap:var(--animator-ui-gap);grid-template-columns:minmax(180px,.9fr) minmax(240px,1.2fr);min-height:0;display:grid}.workspace-list{align-content:start;gap:6px;min-height:0;display:grid;overflow:auto}.workspace-row{color:#dbeafe;text-align:left;cursor:pointer;background:#0f172a;border:1px solid #7dd3fc29;border-radius:8px;gap:2px;width:100%;padding:8px 10px;display:grid}.workspace-row span,.workspace-meta,.workspace-status{color:#9fb2d2;font-size:.82rem}.workspace-row.selected{border-color:#7dd3fc}.workspace-row.active{background:linear-gradient(#fbbf2438,#0f172af2)}.workspace-details{align-content:start;gap:10px;display:grid}.workspace-toolbar{flex-wrap:wrap;gap:6px;display:flex}.workspace-toolbar button{color:#e5f0ff;cursor:pointer;background:#172234;border:1px solid #7dd3fc38;border-radius:7px;min-height:30px;padding:4px 9px}.workspace-toolbar button:disabled{opacity:.45;cursor:not-allowed}.workspace-meta{grid-template-columns:auto minmax(0,1fr);gap:4px 10px;margin:0;display:grid}.workspace-meta dd{margin:0}