:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#1b1b22;--panel:#24242d;--border:#34343f;--text:#e6e6ee;--muted:#9a9aab;--accent:#5b8cff;color:var(--text);background:var(--bg);font-family:system-ui,-apple-system,Segoe UI,sans-serif;font-size:14px;line-height:1.4}*,:before,:after{box-sizing:border-box}html,body,#app{height:100%;margin:0}.editor{grid-template-columns:220px auto 1fr;height:100%;display:grid}.tool-strip{background:var(--panel);border-right:1px solid var(--border);flex-direction:column;gap:2px;padding:8px 5px;display:flex}.tool-strip .icon-button{width:32px;height:32px}.icon-button[aria-pressed=true].tool-button,.icon-button[aria-pressed=true].toggle-button{color:var(--text);background:var(--bg);border-color:var(--accent)}.sidebar{background:var(--panel);border-right:1px solid var(--border);flex-direction:column;gap:16px;padding:12px;display:flex;overflow-y:auto}.app-title{letter-spacing:.02em;margin:0;font-size:16px}.toolbar{gap:6px;display:flex}.button{font:inherit;color:var(--text);background:var(--bg);border:1px solid var(--border);cursor:pointer;border-radius:4px;flex:1;padding:5px 10px}.button:hover:not(:disabled){border-color:var(--muted)}.button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.button:disabled{color:var(--muted);opacity:.5;cursor:default}.panel-title{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin:0 0 8px;font-size:12px;font-weight:600}.swatches{grid-template-columns:repeat(8,1fr);gap:4px;display:grid}.swatch{aspect-ratio:1;border:1px solid var(--border);cursor:pointer;border-radius:3px;padding:0;position:relative}.swatch.is-secondary:after{content:"";filter:drop-shadow(0 0 1px #000);border-top:0 solid #0000;border-bottom:8px solid #fff;border-left:8px solid #0000;border-right:0 solid #0000;position:absolute;bottom:1px;right:1px}.swatch-transparent,.color-well.is-transparent{background:repeating-conic-gradient(#4a4a55 0 25%, #2e2e37 0 50%) 0 0 / 8px 8px}.swatch.swatch-transparent{flex:none;width:22px;height:22px}.color-wells{flex:none;width:32px;height:28px;position:relative}.color-well{border:1px solid var(--border);width:20px;height:20px;box-shadow:0 0 0 2px var(--panel);border-radius:3px;position:absolute}.color-well.is-primary{z-index:1;top:0;left:0}.color-well.is-secondary{bottom:0;right:0}.field-label.slot-hint{font-size:11px;line-height:1.3}.swatch[aria-pressed=true]{outline:2px solid var(--accent);outline-offset:1px}.swatch:focus-visible{outline:2px solid var(--text);outline-offset:1px}.icon-button.swatch-add{width:auto;height:auto;color:var(--muted);border:1px dashed var(--border)}.color-row,.field-row{align-items:center;gap:6px;margin-top:8px;display:flex}.color-picker{border:1px solid var(--border);cursor:pointer;background:0 0;border-radius:4px;flex:none;width:32px;height:26px;padding:0}.text-input,.select{min-width:0;height:26px;font:inherit;color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:4px;flex:1;padding:0 6px;font-size:13px}.hex-input{font-family:ui-monospace,Cascadia Mono,Consolas,monospace}.text-input:focus-visible,.select:focus-visible,.color-picker:focus-visible{outline:2px solid var(--accent);outline-offset:-1px}.panel>.select{width:100%;margin-top:6px}.field-row .button{flex:none;padding:3px 10px}.panel>.button.is-wide{width:100%;margin-top:8px}.field-label{color:var(--muted);flex:1;font-size:12px}.panel-note{color:var(--muted);margin:6px 0 0;font-size:11px;line-height:1.35}.panel-note[hidden],.field-row[hidden],.checkbox[hidden]{display:none}.stage[data-tool=reference] .stage-canvas{cursor:move}.checkbox-row{flex-wrap:wrap;gap:4px 12px;margin-top:8px;display:flex}.checkbox{color:var(--text);white-space:nowrap;cursor:pointer;align-items:center;gap:5px;font-size:12px;display:inline-flex}.checkbox input{accent-color:var(--accent);margin:0}.checkbox:has(input:disabled){color:var(--muted);cursor:default}.slider-label{flex:none;width:50px}.slider{min-width:0;accent-color:var(--accent);flex:1}.slider-value{width:4.5ch;color:var(--muted);text-align:right;font-variant-numeric:tabular-nums;flex:none;font-size:12px}.button[aria-pressed=true]{color:var(--text);border-color:var(--accent)}.stage.is-drop-target{outline:2px dashed var(--accent);outline-offset:-6px}.icon-button.is-confirming{color:#ff6b6b;border-color:#ff6b6b}.panel-status{color:var(--muted);margin:6px 0 0;font-size:12px}.panel-status:empty{display:none}.workspace{min-width:0;min-height:0;display:flex}.stage{flex:auto;min-width:0;position:relative;overflow:hidden}.view-pane{background:var(--bg);border-left:1px solid var(--border);flex:none;width:30%;min-width:160px;position:relative;overflow:hidden}.view-pane[hidden]{display:none}.model-pane{background:#202029}.pane-canvas{touch-action:none;width:100%;height:100%;display:block;position:absolute;inset:0}.side-canvas{image-rendering:pixelated;cursor:crosshair}.side-canvas.is-locked{cursor:not-allowed}.model-canvas{cursor:grab}.model-canvas:active{cursor:grabbing}.pane-bar{pointer-events:none;align-items:center;gap:4px;display:flex;position:absolute;top:6px;left:10px;right:8px}.pane-bar>*{pointer-events:auto}.pane-title,.pane-readout,.pane-bar .icon-button{background:#1b1b22d9;border-radius:4px}.pane-title{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;padding:3px 7px;font-size:12px;font-weight:600}.pane-readout{font-variant-numeric:tabular-nums;padding:3px 6px;font-size:12px}.pane-readout:empty{display:none}.pane-hint{color:var(--muted)}.pane-bar .pane-close{margin-left:auto}.pane-button{flex:none;padding:2px 8px;font-size:12px}.perspective-bar{flex-wrap:wrap}.perspective-bar .pane-button{background:#1b1b22d9}.perspective-bar .pane-button[aria-pressed=false]{color:var(--muted)}.pane-splitter{cursor:col-resize;touch-action:none;width:5px;position:absolute;top:0;bottom:0;left:0}.pane-splitter:hover,.pane-splitter:active{background:#5b8cff80}.pane-message{color:var(--muted);margin:0;font-size:13px;position:absolute;top:44px;left:16px;right:16px}.pane-message[hidden]{display:none}.panel-header .button{flex:none;padding:2px 8px;font-size:12px}.number-field{flex:1;align-items:center;gap:6px;min-width:0;display:flex}.number-field .field-label{flex:none}.number-input{width:100%}.stage-canvas{width:100%;height:100%;image-rendering:pixelated;touch-action:none;cursor:crosshair;display:block;position:absolute;inset:0}.stage.is-locked .stage-canvas{cursor:not-allowed}.panel-header{justify-content:space-between;align-items:center;margin-bottom:6px;display:flex}.panel-header .panel-title{margin:0}.icon-group{gap:2px;display:flex}.icon-button{width:26px;height:26px;color:var(--muted);cursor:pointer;background:0 0;border:1px solid #0000;border-radius:4px;flex:none;place-items:center;padding:0;display:inline-grid}.icon-button:hover:not(:disabled){color:var(--text);background:var(--bg)}.icon-button:focus-visible{outline:2px solid var(--accent);outline-offset:-1px}.icon-button:disabled{opacity:.35;cursor:default}.layer-list{flex-direction:column;gap:2px;max-height:300px;margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}.layer-row{border:1px solid #0000;border-radius:4px;align-items:center;gap:4px;padding:2px 6px 2px 2px;display:flex}.layer-row.is-active{background:var(--bg);border-color:var(--accent)}.layer-row.is-hidden .layer-thumb,.layer-row.is-hidden .layer-name{opacity:.45}.layer-thumb{object-fit:contain;width:28px;height:28px;image-rendering:pixelated;background:repeating-conic-gradient(#3a3a44 0 25%, #2e2e37 0 50%) 0 0 / 8px 8px;border:1px solid var(--border);border-radius:2px;flex:none}.layer-name{min-width:0;font:inherit;color:var(--text);text-align:left;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;background:0 0;border:0;border-radius:3px;flex:1;padding:5px 4px;overflow:hidden}.layer-name:focus-visible{outline:2px solid var(--accent)}.layer-name-input{min-width:0;font:inherit;color:var(--text);background:var(--panel);border:1px solid var(--accent);border-radius:3px;outline:none;flex:1;padding:4px}.layer-opacity{color:var(--muted);font-variant-numeric:tabular-nums;font-size:11px}.layer-footer{margin-top:6px}.opacity-row{color:var(--muted);align-items:center;gap:8px;margin-top:8px;font-size:12px;display:flex}.opacity-row input{min-width:0;accent-color:var(--accent);flex:1}.opacity-value{text-align:right;font-variant-numeric:tabular-nums;width:4ch}.dialog{width:min(1180px,100vw - 32px);max-width:none;max-height:calc(100vh - 32px);color:var(--text);background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:0;box-shadow:0 16px 48px #00000080}.dialog[open]{flex-direction:column;display:flex}.dialog::backdrop{background:#0a0a0e99}.dialog-header{border-bottom:1px solid var(--border);padding:12px 16px 10px}.dialog-title{margin:0;font-size:15px}.dialog-subtitle{color:var(--muted);margin:2px 0 0;font-size:12px}.dialog-note{border-bottom:1px solid var(--border);background:#5b8cff1f;margin:0;padding:8px 16px;font-size:12px}.dialog-note[hidden]{display:none}.dialog-body{grid-template-columns:minmax(0,1fr) 260px;gap:16px;min-height:0;padding:16px;display:grid;overflow:auto}.dialog-controls{flex-direction:column;gap:16px;display:flex}.dialog-section .panel-note:empty{display:none}.dialog-footer{border-top:1px solid var(--border);flex-wrap:wrap;align-items:center;gap:8px;padding:12px 16px;display:flex}.dialog-status{min-width:0;color:var(--muted);flex:1;margin:0;font-size:12px}.dialog-footer .button{flex:none;padding:5px 14px}.button.is-primary{color:#fff;background:var(--accent);border-color:var(--accent)}.button.is-primary:hover:not(:disabled){border-color:#a8c0ff}.size-times{flex:none}.pixelate-previews{grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:12px;display:grid}.preview{min-width:0;margin:0}.preview-frame{background:repeating-conic-gradient(#3a3a44 0 25%, #2e2e37 0 50%) 0 0 / 16px 16px;border:1px solid var(--border);border-radius:4px;place-items:center;height:min(60vh,520px);display:grid;overflow:hidden}.preview-canvas{object-fit:contain;width:100%;height:100%;display:block}.preview-canvas.is-pixelated{image-rendering:pixelated}.preview-caption{color:var(--muted);font-variant-numeric:tabular-nums;margin-top:6px;font-size:12px}.palette-strip{flex-wrap:wrap;gap:2px;margin-top:8px;display:flex}.palette-strip:empty{display:none}.strip-swatch{border-radius:2px;width:14px;height:14px;box-shadow:inset 0 0 0 1px #ffffff1f}@media (width<=860px){.dialog-body{grid-template-columns:minmax(0,1fr)}.preview-frame{height:36vh}}@media (width<=520px){.pixelate-previews{grid-template-columns:minmax(0,1fr)}.preview-frame{height:30vh}.dialog-status{flex-basis:100%}.dialog-status:empty{display:none}.dialog-footer .button{flex:auto}}