:root{--bg:#232832;--panel:#2c323e;--raised:#383f4d;--border:#151a23;--line:#424b5b;--text:#dae1ec;--muted:#929eb2;--mint:#8ed7b2;--mint-ink:#233c32;--accent:#f2ca8b;--left:164px;--right:214px}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:12px 'Segoe UI',sans-serif;height:100vh;height:100dvh;display:flex;flex-direction:column;overflow:hidden}button,input,select{font:inherit}button{color:var(--text);background:var(--raised);border:1px solid var(--border);border-radius:3px;padding:6px 10px;box-shadow:inset 0 1px #ffffff0e;cursor:pointer}button:hover{background:#495365}button:active{transform:translateY(1px)}button:disabled{opacity:.4;cursor:default}button[aria-pressed=true]{background:var(--mint);color:var(--mint-ink);border-color:#17251e}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible{outline:2px solid var(--mint);outline-offset:2px}input,select{color:var(--text);background:#202631;border:1px solid #141923;border-radius:3px;padding:5px;min-width:0}input[type=number]{width:58px}input[type=checkbox]{accent-color:var(--mint)}input[type=range]{padding:0;accent-color:var(--mint);width:100%;height:15px}a{color:inherit}kbd{font:10px ui-monospace,monospace;color:var(--muted);margin-left:24px}.primary{background:var(--mint);color:var(--mint-ink);font-weight:700;border-color:#152b21;box-shadow:0 2px #152b21}.primary:hover{background:#a8e7c8}.titlebar{height:49px;flex-shrink:0;padding:0 14px;display:flex;align-items:center;gap:16px;border-bottom:2px solid var(--border);background:#292f3a}.home{display:flex;align-items:center;gap:9px;text-decoration:none}.home img{height:30px;width:30px}.home strong{font-size:18px;letter-spacing:-.5px}.brand-parent{font-size:10px;color:var(--muted);margin:4px 0 0 2px}.save-state{color:var(--muted);font-size:10px;margin-left:auto;display:flex;align-items:center;gap:6px}.titlebar .primary{margin-left:10px}.menubar{display:flex;height:29px;flex-shrink:0;align-items:stretch;background:#303744;border-bottom:1px solid var(--border);padding:0 8px;gap:0;position:relative;z-index:20}.menubar details{position:relative}.menubar summary{list-style:none;cursor:pointer;padding:6px 12px;font-size:11px}.menubar summary::-webkit-details-marker{display:none}.menubar summary:hover,.menubar details[open] summary{background:#475161}.menu{position:absolute;top:28px;left:0;min-width:255px;background:#343c49;border:1px solid #0f141c;box-shadow:3px 4px #11172080;padding:5px;z-index:30}.menu button{background:transparent;border:0;box-shadow:none;width:100%;text-align:left;display:flex;justify-content:space-between;padding:8px 10px;white-space:nowrap}.menu button:hover{background:#526277}.menu hr{border:0;border-top:1px solid #566071;margin:5px}.help-menu{background:transparent;border:0;box-shadow:none;font-size:11px;padding:0 12px}.menu-hint{margin-left:auto;color:#8793a6;align-self:center;font-size:10px;padding-right:12px}.documentbar{height:33px;flex-shrink:0;background:#1c222c;display:flex;align-items:center;padding:0 12px;gap:6px;border-bottom:1px solid var(--border)}.document-tab{align-self:stretch;background:#353d4b;border:1px solid #111720;border-bottom:2px solid var(--mint);padding:7px 20px 7px 12px;display:flex;align-items:center;gap:8px;min-width:170px}.doc-dot{width:6px;height:6px;background:var(--mint);box-shadow:0 0 0 2px #1b3025}.documentbar button{background:transparent;border:0;font-size:17px}.documentbar>span{margin-left:auto;color:var(--muted);font:10px ui-monospace,monospace}.optionsbar{height:39px;flex-shrink:0;display:flex;gap:12px;align-items:center;background:var(--panel);padding:0 14px;border-bottom:2px solid var(--border)}.tool-label{font-weight:700;color:var(--mint);min-width:65px}.divider{height:20px;width:1px;background:var(--line)}.optionsbar label{display:flex;align-items:center;gap:5px;color:var(--muted);font-size:11px}.optionsbar input[type=number]{width:40px;padding:3px}.optionsbar button{font-size:10px;padding:4px 7px}.option-spacer{flex:1}.workspace{flex:1;min-height:0;display:grid;grid-template-columns:var(--left) minmax(100px,1fr) var(--right);grid-template-rows:minmax(170px,1fr) 181px}.palette-panel{grid-row:1/3;background:var(--panel);border-right:2px solid var(--border);display:flex;flex-direction:column;overflow:auto}.panel-heading{font-size:9px;letter-spacing:1.1px;font-weight:700;color:#b2bdce;display:flex;align-items:center;justify-content:space-between;min-height:30px;padding:0 12px}.panel-heading button{padding:1px 5px;background:transparent;border:0;color:var(--muted);font-size:17px}.color-well{height:58px;position:relative;margin:2px 12px 8px}.color-input{position:absolute;width:50px;height:39px;border:2px solid #121824;box-shadow:inset 0 0 0 1px #ffffff40;display:block;overflow:hidden;cursor:pointer;background:#e77782}.color-input.fg{left:10px;top:0;z-index:2}.color-input.bg{left:42px;top:17px;z-index:1;background:#171c2c}.color-input input{width:60px;height:49px;padding:0;border:0;position:absolute;left:-5px;top:-5px;cursor:pointer}.color-well button{position:absolute;right:0;top:5px;border:0;background:transparent;font-size:18px;padding:3px}.hex-label{margin:0 12px 12px;display:flex;align-items:center;gap:8px;font-size:9px;color:var(--muted)}.hex-label input{width:100%;font:10px ui-monospace,monospace;padding:5px 7px}.palette{display:grid;grid-template-columns:repeat(4,1fr);gap:3px;padding:0 12px}.swatch{aspect-ratio:1;padding:0;border:1px solid #141a22;border-radius:1px;box-shadow:inset 0 1px #ffffff20;position:relative;min-height:18px}.swatch.selected:after{content:'';position:absolute;inset:3px;border:1px solid white;box-shadow:0 0 0 1px #111}.palette-tip{font-size:9px;color:var(--muted);line-height:1.6;padding:0 12px;margin:10px 0 13px}.tool-heading{border-top:1px solid var(--border)}.tool-heading span{font-size:8px;letter-spacing:0;font-weight:400;color:var(--muted)}.tools{display:grid;grid-template-columns:1fr 1fr;gap:5px;padding:2px 12px 12px}.tool{height:39px;display:flex;align-items:center;justify-content:center;gap:9px;padding:5px;position:relative}.tool svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;image-rendering:pixelated}.tool kbd{margin:0;font-size:8px;opacity:.7;color:inherit;position:absolute;bottom:3px;right:5px}.palette-bottom{margin-top:auto;padding:18px 12px;display:flex;align-items:center;gap:9px;color:#778499;font-size:10px;line-height:1.4;border-top:1px solid var(--border)}.tiny-sprite{font-size:26px;color:var(--mint)}.canvas-area{display:flex;flex-direction:column;min-height:0;overflow:hidden;position:relative}.canvas-controls{height:34px;flex-shrink:0;background:#272e39;border-bottom:1px solid var(--border);padding:4px 10px;display:flex;align-items:center;gap:6px}.canvas-controls button{font-size:10px;padding:3px 7px;background:transparent;border-color:#465164;box-shadow:none}.canvas-controls button[aria-pressed=true]{background:var(--mint);color:var(--mint-ink)}.canvas-controls>span{flex:1}.viewport{flex:1;min-height:0;position:relative;overflow:hidden;background-color:#202631;background-image:radial-gradient(#323b4920 1px,transparent 1px);background-size:16px 16px;touch-action:none;user-select:none}.canvas-wrap{position:absolute;left:50%;top:50%;border:1px solid #111720;box-shadow:0 6px 35px #10151c60;background-color:#526071;background-image:linear-gradient(45deg,#606e80 25%,transparent 25%),linear-gradient(-45deg,#606e80 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#606e80 75%),linear-gradient(-45deg,transparent 75%,#606e80 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0}#canvas{display:block;image-rendering:pixelated;touch-action:none;outline-offset:3px;cursor:crosshair}#overlay{position:absolute;inset:0;pointer-events:none}.viewport-tip{position:absolute;bottom:12px;left:0;right:0;text-align:center;font-size:9px;color:#78869b;pointer-events:none;z-index:1}.inspector{border-left:2px solid var(--border);background:var(--panel);overflow:auto}.preview-box{height:128px;margin:0 12px;display:flex;align-items:center;justify-content:center;border:1px solid #17202d;background:repeating-conic-gradient(#333c49 0 25%,#3c4655 0 50%) 0 0/16px 16px}.preview-box canvas{max-width:100%;max-height:100%;image-rendering:pixelated}.preview-buttons{display:flex;justify-content:center;padding:7px 0 11px;gap:6px}.preview-buttons button{font-size:10px;min-width:32px;padding:4px 6px}.inspector-section{border-top:1px solid var(--border);padding-bottom:12px}.inspector-section label{display:flex;flex-direction:column;gap:6px;padding:4px 12px;color:var(--muted);font-size:10px;margin-bottom:3px}.inspector-section .opacity-label{display:grid;grid-template-columns:1fr auto}.opacity-label input{grid-column:1/3}.duration-row{display:flex;align-items:center;gap:7px}.duration-row input{width:100%}.quick-actions button{display:block;width:calc(100% - 24px);margin:4px 12px;text-align:left;font-size:10px;padding:7px}.local-note{display:flex;gap:8px;align-items:flex-start;color:var(--muted);font-size:9px;line-height:1.6;padding:12px;border-top:1px solid var(--border)}.local-dot{width:5px;height:5px;background:var(--mint);margin-top:5px}.local-note small{display:block;font-size:8px;color:#788599}.timeline{grid-column:2/4;min-height:0;background:#282f3a;border-top:2px solid var(--border);display:flex;flex-direction:column;overflow:hidden}.timeline-toolbar{display:flex;align-items:center;gap:6px;min-height:34px;padding:4px 10px;border-bottom:1px solid var(--border);flex-shrink:0}.timeline-toolbar strong{font-size:9px;letter-spacing:1px;margin-right:10px;color:#b2bdce}.timeline-toolbar button{font-size:9px;padding:4px 7px}.timeline-spacer{flex:1}#timeline-info{font-size:9px;color:var(--muted);margin-left:6px}.timeline-scroll{overflow:auto;flex:1;min-height:0}#timeline-grid{display:grid;grid-template-columns:180px repeat(var(--frames,1),42px);width:max-content;min-width:100%}.timeline-corner,.frame-head{height:27px;border-bottom:1px solid #18202b;background:#333c49;color:var(--muted);font-size:10px}.timeline-corner{position:sticky;left:0;z-index:3;padding:7px 12px}.frame-head{border-right:1px solid #19212d;display:grid;place-items:center;cursor:pointer;padding:0;border-radius:0;box-shadow:none}.frame-head.active{color:var(--mint);background:#3e514c;box-shadow:inset 0 -2px var(--mint)}.layer-row{position:sticky;left:0;z-index:2;background:#303845;display:flex;align-items:center;gap:4px;padding:0 7px;height:32px;border-bottom:1px solid #1e2632;border-right:2px solid #17202b;cursor:pointer}.layer-row.active{background:#425449}.layer-row button{font-size:10px;border:0;background:transparent;padding:3px;color:var(--muted);box-shadow:none}.layer-row button.on{color:var(--mint)}.layer-row .name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:10px;margin-left:3px}.cel{height:32px;background:#2c3441;border:0;border-right:1px solid #1c2430;border-bottom:1px solid #1c2430;border-radius:0;box-shadow:none;display:grid;place-items:center;padding:0;cursor:pointer}.cel span{height:6px;width:6px;background:#758396;box-shadow:1px 1px #18202b}.cel.empty span{background:transparent;border:1px solid #69758a;box-shadow:none}.cel.active{background:#50765f;box-shadow:inset 0 0 0 1px var(--mint)}.cel.active span{background:var(--mint)}.statusbar{display:flex;height:25px;flex-shrink:0;align-items:center;gap:22px;font:9px ui-monospace,monospace;color:#9fadc1;padding:0 12px;border-top:2px solid var(--border);background:#303745}.statusbar #status{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.statusbar #cursor-position{min-width:70px}.statusbar #selection-info{min-width:85px}.statusbar #frame-info{min-width:75px}dialog{background:#303846;border:2px solid #141a23;border-radius:6px;color:var(--text);padding:0;width:min(460px,calc(100vw - 30px));box-shadow:8px 10px 0 #10151b55;max-height:90vh}dialog::backdrop{background:#0b111c99}.dialog-head{display:flex;align-items:center;justify-content:space-between;padding:17px 20px;border-bottom:1px solid #18212e;background:#384352}.dialog-head h2{margin:0;font-size:17px}.dialog-head button{background:transparent;border:0;font-size:22px;padding:0;box-shadow:none}.dialog-actions{display:flex;justify-content:flex-end;gap:9px;padding:14px 20px;border-top:1px solid #18212e}#dialog-content{padding:20px;line-height:1.7;color:#b7c2d3}#dialog-content label{display:flex;flex-direction:column;gap:5px;margin-bottom:13px;font-size:11px}#dialog-content input:not([type=checkbox]),#dialog-content select{width:100%;padding:9px}#dialog-content .row{display:flex;gap:15px}#dialog-content .row>*{flex:1}#dialog-content p{margin:0 0 15px;font-size:11px}#dialog-content .check{flex-direction:row;align-items:center}#dialog-content .hint{color:#8c9cb3;font-size:10px}#dialog-content .shortcuts{display:grid;grid-template-columns:1fr 1fr;gap:5px;font-size:11px}#dialog-content .shortcuts span{display:flex;justify-content:space-between;border-bottom:1px solid #424d5f;padding:6px 0}#dialog-content kbd{color:var(--mint);margin-left:8px}#toast{position:fixed;bottom:38px;left:50%;transform:translateX(-50%);background:#18241f;border:1px solid var(--mint);color:#c8f0dc;padding:11px 18px;border-radius:5px;box-shadow:0 4px 20px #0006;z-index:60;max-width:90vw;font-size:12px}[hidden]{display:none!important}@media(max-height:760px){.palette-bottom{display:none}.palette{gap:2px}.palette-tip{margin:6px 0}.tools{gap:3px}.tool{height:32px}.preview-box{height:95px}.quick-actions button{padding:5px}.inspector-section{padding-bottom:6px}.workspace{grid-template-rows:minmax(160px,1fr) 145px}}@media(max-width:1000px){:root{--left:136px;--right:180px}.brand-parent,.menu-hint{display:none}.palette{padding:0 9px}.optionsbar{gap:7px;padding:0 9px}.timeline-toolbar{gap:4px}.timeline-toolbar strong{margin-right:4px}.timeline-toolbar button{padding:4px 5px}#timeline-info{display:none}.tool{gap:3px}.color-well{margin-left:7px;margin-right:7px}.color-input{width:43px}.color-input.bg{left:34px}.color-input.fg{left:4px}}@media(max-width:720px){:root{--left:100px;--right:0px}.inspector{display:none}.workspace{grid-template-columns:var(--left) minmax(100px,1fr);grid-template-rows:minmax(160px,1fr) 151px}.timeline{grid-column:2}.titlebar{padding:0 8px;gap:5px}.titlebar .home strong{font-size:16px}.titlebar .primary{font-size:10px;padding:6px}.save-state{font-size:8px}.menubar summary{padding:6px 8px}.help-menu{font-size:10px;padding:0 8px}.optionsbar{gap:5px}.optionsbar .divider{display:none}.optionsbar button{font-size:8px}.optionsbar .check{font-size:8px}.optionsbar label{font-size:9px}.tool-label{min-width:43px;font-size:10px}.palette{grid-template-columns:repeat(3,1fr)}.panel-heading{padding:0 8px;font-size:8px}.tool-heading span,.palette-tip,.palette-bottom{display:none}.tools{padding:2px 7px;gap:3px}.tool{height:33px}.tool svg{width:16px}.tool kbd{font-size:7px}.hex-label{margin:0 7px 8px;font-size:8px;gap:3px}.hex-label input{font-size:8px;padding:4px}.color-well{height:58px}.color-input.bg{left:25px}.color-well button{right:-2px;top:37px;font-size:14px}.timeline-toolbar{flex-wrap:wrap}.timeline-toolbar strong{display:none}.timeline-spacer{display:none}.timeline-toolbar button{font-size:8px}.statusbar{gap:8px;font-size:8px}.statusbar #selection-info{display:none}.statusbar #cursor-position{min-width:40px}.statusbar #frame-info{min-width:60px}.menu{min-width:230px}.menubar details:nth-child(n+4) .menu{left:auto;right:0}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}

.palette-panel>*{flex-shrink:0}.outline-preview{display:block;margin:10px auto 0;image-rendering:pixelated;border:1px solid #17202d;background:repeating-conic-gradient(#333c49 0 25%,#3c4655 0 50%) 0 0/16px 16px;}#dialog-content input[type=color]{height:38px;padding:2px;}