:root{--bg-workspace:#0d1117;--bg-canvas-void:#090c11;--bg-panel:#161b22;--bg-panel-raised:#1c222b;--bg-input:#0f141b;--bg-hover:#222a35;--bg-active:#2b3441;--border:#262d38;--border-strong:#333c4a;--text:#e6edf3;--text-muted:#9aa7b6;--text-faint:#6e7c8c;--accent:#34d399;--accent-strong:#10b981;--accent-ink:#04231a;--accent-soft:#34d39924;--info:#38bdf8;--danger:#f87171;--warning:#fbbf24;--radius-sm:4px;--radius:6px;--radius-lg:10px;--shadow-panel:0 1px 3px #0006;--shadow-float:0 12px 32px #0000008c;--top-bar-height:46px;--status-bar-height:26px;--rail-width:46px;--panel-width:288px;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg-workspace);color:var(--text);-webkit-font-smoothing:antialiased;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:13px;line-height:1.5;overflow:hidden}h1,h2,h3,h4{letter-spacing:-.01em;margin:0;font-weight:600}h1{font-size:1.25rem}h2{font-size:1.05rem}h3{font-size:.95rem}h4{text-transform:uppercase;letter-spacing:.06em;color:var(--text-faint);font-size:.75rem}p{margin:0}code{font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:.85em}.text-muted{color:var(--text-muted)}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.button{border:1px solid var(--border-strong);border-radius:var(--radius);background:var(--bg-panel-raised);color:var(--text);font:inherit;cursor:pointer;white-space:nowrap;align-items:center;gap:6px;padding:6px 12px;font-weight:500;transition:background .12s,border-color .12s;display:inline-flex}.button:hover:not(:disabled){background:var(--bg-hover);border-color:#3d4859}.button:disabled{opacity:.45;cursor:not-allowed}.button.primary{background:var(--accent);border-color:var(--accent-strong);color:var(--accent-ink);font-weight:600}.button.primary:hover:not(:disabled){background:#4ade9f}.button.ghost{color:var(--text-muted);background:0 0;border-color:#0000}.button.ghost:hover:not(:disabled){background:var(--bg-hover);color:var(--text)}.button.compact{padding:5px 9px}.button.tiny{padding:3px 8px;font-size:.78rem}.button.full{justify-content:center;width:100%}.icon-button{border-radius:var(--radius);width:28px;height:28px;color:var(--text-muted);cursor:pointer;background:0 0;border:1px solid #0000;justify-content:center;align-items:center;padding:0;transition:background .12s,color .12s;display:inline-flex}.icon-button:hover:not(:disabled){background:var(--bg-hover);color:var(--text)}.icon-button:disabled{opacity:.35;cursor:not-allowed}.icon-button.active{background:var(--accent-soft);color:var(--accent);border-color:#34d3994d}.icon-button.tiny{width:22px;height:22px}.icon-button.danger:hover:not(:disabled){color:var(--danger);background:#f8717129}.input{border:1px solid var(--border-strong);border-radius:var(--radius);background:var(--bg-input);width:100%;color:var(--text);font:inherit;padding:5px 8px}.input:focus{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft);outline:none}.input.compact{padding:3px 6px;font-size:.85rem}.select{cursor:pointer}.field{flex-direction:column;gap:4px;margin-bottom:12px;display:flex}.field-label{color:var(--text-muted);font-size:.75rem;font-weight:500}.field-hint,.field-error{font-size:.75rem}.field-hint{color:var(--text-faint)}.field-error{color:var(--danger)}.field-invalid .input{border-color:var(--danger)}.field-row{grid-template-columns:1fr 1fr;gap:10px;display:grid}.input-with-suffix{align-items:center;display:flex;position:relative}.input-suffix{color:var(--text-faint);pointer-events:none;font-size:.72rem;position:absolute;right:8px}.checkbox-row{color:var(--text-muted);cursor:pointer;align-items:center;gap:8px;margin-bottom:10px;font-size:.82rem;display:flex}.checkbox-row input{accent-color:var(--accent)}.form-error{border-radius:var(--radius);color:#fca5a5;background:#f871711a;border:1px solid #f8717159;padding:7px 10px;font-size:.82rem}.inline-error{border-radius:var(--radius);color:#fca5a5;background:#f8717114;border:1px solid #f8717159;margin:12px 0;padding:9px 12px}.slider-field{margin-bottom:12px}.slider-head{color:var(--text-muted);justify-content:space-between;align-items:baseline;margin-bottom:4px;font-size:.75rem;display:flex}.slider-value{font-variant-numeric:tabular-nums;color:var(--text)}.slider{appearance:none;background:var(--bg-active);cursor:pointer;border-radius:2px;width:100%;height:4px}.slider::-webkit-slider-thumb{appearance:none;background:var(--accent);border:2px solid var(--bg-panel);cursor:grab;border-radius:50%;width:13px;height:13px}.slider::-moz-range-thumb{border:2px solid var(--bg-panel);background:var(--accent);cursor:grab;border-radius:50%;width:13px;height:13px}.slider:disabled{opacity:.4}.color-field{margin-bottom:12px}.color-field>label{color:var(--text-muted);margin-bottom:4px;font-size:.75rem;display:block}.color-field-controls{gap:6px;display:flex}.color-swatch{border:1px solid var(--border-strong);border-radius:var(--radius);background:var(--bg-input);cursor:pointer;width:32px;height:28px;padding:2px}.color-hex{flex:1;font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:.8rem}.segmented{border:1px solid var(--border-strong);border-radius:var(--radius);display:flex;overflow:hidden}.segment{border:0;border-right:1px solid var(--border-strong);background:var(--bg-input);color:var(--text-muted);font:inherit;cursor:pointer;flex:1;padding:6px 8px}.segment:last-child{border-right:0}.segment.active{background:var(--accent-soft);color:var(--accent);font-weight:600}.spinner-wrap{color:var(--text-muted);align-items:center;gap:10px;display:flex}.spinner{border:2px solid var(--bg-active);border-top-color:var(--accent);border-radius:50%;animation:.7s linear infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.spinner{animation-duration:2s}*{transition-duration:.01ms!important}}.boot-screen,.crash-screen,.login-screen{background:var(--bg-workspace);place-items:center;height:100%;padding:24px;display:grid}.boot-card,.crash-card,.login-card{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--bg-panel);width:min(100%,380px);box-shadow:var(--shadow-float);text-align:center;flex-direction:column;gap:12px;padding:24px;display:flex}.login-card{text-align:left}.login-card h1{text-align:center}.login-card .text-muted{text-align:center;margin-bottom:4px}.login-logo{object-fit:contain;width:72px;height:72px;margin:0 auto}.login-footnote{color:var(--text-faint);text-align:center;font-size:.75rem}.crash-message{border-radius:var(--radius);background:var(--bg-input);color:#fca5a5;word-break:break-word;padding:8px 10px;font-family:ui-monospace,Menlo,monospace;font-size:.8rem}.crash-actions{justify-content:center;gap:8px;display:flex}.home{height:100%;padding:28px 32px 48px;overflow-y:auto}.home-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:flex-start;gap:16px;padding-bottom:20px;display:flex}.home-brand{align-items:center;gap:14px;display:flex}.home-logo{object-fit:contain;width:52px;height:52px}.home-actions{flex-wrap:wrap;align-items:center;gap:10px;margin:20px 0;display:flex}.home-search{border:1px solid var(--border-strong);border-radius:var(--radius);background:var(--bg-input);color:var(--text-faint);align-items:center;gap:7px;min-width:220px;margin-left:auto;padding:0 9px;display:flex}.home-search .input{background:0 0;border:0;padding-left:0}.home-search .input:focus{box-shadow:none}.section-title{text-transform:uppercase;letter-spacing:.07em;color:var(--text-faint);margin:18px 0 12px;font-size:.78rem}.home-loading{place-items:center;padding:64px 0;display:grid}.project-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;margin:0;padding:0;list-style:none;display:grid}.project-card{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--bg-panel);flex-direction:column;transition:border-color .14s,transform .14s;display:flex;overflow:hidden}.project-card:hover{border-color:var(--border-strong);transform:translateY(-1px)}.project-thumb{border:0;border-bottom:1px solid var(--border);background-color:var(--bg-canvas-void);cursor:pointer;background-image:linear-gradient(45deg,#14181f 25%,#0000 25%),linear-gradient(-45deg,#14181f 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#14181f 75%),linear-gradient(-45deg,#0000 75%,#14181f 75%);background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px;place-items:center;height:148px;padding:0;display:grid;overflow:hidden}.project-thumb img{object-fit:contain;max-width:100%;max-height:100%}.project-thumb-empty{color:var(--text-faint);font-variant-numeric:tabular-nums;font-size:.8rem}.project-meta{padding:10px 12px 6px}.project-name{width:100%;color:var(--text);font:inherit;text-align:left;cursor:pointer;text-overflow:ellipsis;white-space:nowrap;background:0 0;border:0;padding:0;font-weight:600;display:block;overflow:hidden}.project-name:hover{color:var(--accent)}.project-sub{color:var(--text-faint);margin-top:2px;font-size:.75rem}.project-card-actions{gap:2px;padding:4px 8px 8px;display:flex}.empty-state{text-align:center;flex-direction:column;align-items:center;gap:10px;max-width:460px;margin:64px auto;display:flex}.empty-logo{object-fit:contain;opacity:.85;width:110px;height:110px}.empty-actions{gap:10px;margin-top:6px;display:flex}.damaged-panel{border-radius:var(--radius);background:#fbbf2412;border:1px solid #fbbf2459;margin:16px 0;padding:12px 14px}.damaged-panel h2{color:var(--warning);align-items:center;gap:7px;font-size:.85rem;display:flex}.damaged-panel ul{margin:8px 0 0;padding:0;list-style:none}.damaged-panel li{align-items:center;gap:10px;padding:4px 0;font-size:.8rem;display:flex}.damaged-panel li span{flex:1}.editor{flex-direction:column;height:100%;display:flex}.top-bar{height:var(--top-bar-height);border-bottom:1px solid var(--border);background:var(--bg-panel);flex-shrink:0;align-items:center;gap:10px;padding:0 10px;display:flex}.top-bar-group{align-items:center;gap:3px;display:flex}.top-bar-group:nth-child(2){margin:0 auto}.top-bar-logo{object-fit:contain;width:24px;height:24px}.top-bar-sep{background:var(--border);width:1px;height:20px;margin:0 5px}.project-name-input{border-radius:var(--radius);width:190px;color:var(--text);font:inherit;background:0 0;border:1px solid #0000;padding:4px 7px;font-weight:600}.project-name-input:hover{background:var(--bg-input)}.project-name-input:focus{border-color:var(--accent);background:var(--bg-input);outline:none}.zoom-group{gap:1px}.zoom-readout{border-radius:var(--radius);min-width:48px;color:var(--text-muted);font:inherit;font-variant-numeric:tabular-nums;cursor:pointer;background:0 0;border:0;padding:4px 6px}.zoom-readout:hover{background:var(--bg-hover);color:var(--text)}.editor-body{flex:1;min-height:0;display:flex}.rail-column{border-right:1px solid var(--border);background:var(--bg-panel);flex-direction:column;flex-shrink:0;display:flex}.tool-rail{width:var(--rail-width);flex-direction:column;flex:1;gap:2px;padding:6px 5px;display:flex}.tool-rail.collapsed{display:none}.tool-button{border-radius:var(--radius);width:36px;height:34px;color:var(--text-muted);cursor:pointer;background:0 0;border:1px solid #0000;place-items:center;transition:background .12s,color .12s;display:grid}.tool-button:hover{background:var(--bg-hover);color:var(--text)}.tool-button.active{background:var(--accent-soft);color:var(--accent);border-color:#34d39952}.rail-toggle{margin:4px auto 8px}.stage-column{background:var(--bg-canvas-void);flex:1;min-width:0;position:relative}.stage-loading{z-index:3;background:#090c11bf;place-items:center;display:grid;position:absolute;inset:0}.stage{height:100%;position:relative}.stage-scroll{justify-content:safe center;align-items:safe center;height:100%;padding:32px;display:flex;overflow:auto}.canvas-frame{box-shadow:0 0 0 1px var(--border-strong), var(--shadow-float);flex-shrink:0;position:relative}.canvas-checkerboard{pointer-events:none;background-color:#1a1f27;background-image:linear-gradient(45deg,#232a34 25%,#0000 25%),linear-gradient(-45deg,#232a34 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#232a34 75%),linear-gradient(-45deg,#0000 75%,#232a34 75%);background-position:0 0,0 9px,9px -9px,-9px 0;background-size:18px 18px;position:absolute;inset:0}.stage.drag-active .canvas-frame{box-shadow:0 0 0 2px var(--accent), var(--shadow-float)}.drop-hint{border-radius:var(--radius-lg);background:var(--accent);color:var(--accent-ink);pointer-events:none;padding:8px 16px;font-weight:600;position:absolute;bottom:20px;left:50%;transform:translate(-50%)}.crop-overlay{border:1px dashed var(--accent);pointer-events:none;position:absolute;box-shadow:0 0 0 9999px #090c1199}.crop-size{border-radius:var(--radius-sm);background:var(--accent);color:var(--accent-ink);white-space:nowrap;padding:1px 6px;font-size:.72rem;font-weight:600;position:absolute;top:-22px;left:0}.crop-bar{border:1px solid var(--border-strong);border-radius:var(--radius-lg);background:var(--bg-panel-raised);box-shadow:var(--shadow-float);z-index:4;align-items:center;gap:10px;padding:8px 12px;font-size:.82rem;display:flex;position:absolute;bottom:16px;left:50%;transform:translate(-50%)}.side-panel{width:var(--panel-width);border-left:1px solid var(--border);background:var(--bg-panel);flex-direction:column;flex-shrink:0;display:flex}.side-panel.collapsed{width:44px}.side-panel-head{border-bottom:1px solid var(--border);align-items:center;gap:4px;padding:5px 6px;display:flex}.side-panel.collapsed .tab-row{display:none}.tab-row{flex:1;gap:1px;display:flex;overflow:hidden}.tab{border-radius:var(--radius-sm);color:var(--text-faint);font:inherit;cursor:pointer;white-space:nowrap;background:0 0;border:0;flex:1;padding:5px 4px;font-size:.76rem}.tab:hover{background:var(--bg-hover);color:var(--text)}.tab.active{background:var(--bg-active);color:var(--text);font-weight:600}.side-panel-body{flex:1;overflow:hidden auto}.side-panel-foot{border-top:1px solid var(--border);gap:6px;padding:7px 8px;display:flex}.panel-empty{text-align:center;flex-direction:column;gap:7px;padding:24px 16px;font-size:.82rem;display:flex}.panel-stack{padding:12px}.panel-section{border-bottom:1px solid var(--border);margin-bottom:14px;padding-bottom:14px}.panel-section:last-child{border-bottom:0;margin-bottom:0}.panel-section h4{margin-bottom:9px}.panel-section-head{justify-content:space-between;align-items:center;margin-bottom:9px;display:flex}.panel-section-head h4{margin-bottom:0}.subhead{margin-top:12px}.panel-note{color:var(--text-faint);margin-top:8px;font-size:.74rem;line-height:1.45}.panel-note.warning{color:var(--warning)}.button-grid{grid-template-columns:1fr 1fr;gap:5px;display:grid}.button-grid .button{justify-content:flex-start}.icon-row{flex-wrap:wrap;gap:2px;margin-bottom:12px;display:flex}.icon-row-sep{background:var(--border);width:1px;height:20px;margin:4px}.preset-row{flex-wrap:wrap;gap:5px;margin-bottom:10px;display:flex}.layer-list{margin:0;padding:5px;list-style:none}.layer-row{border-radius:var(--radius);cursor:default;border:1px solid #0000;grid-template-columns:auto 1fr auto;align-items:center;gap:4px;padding:4px 5px;display:grid}.layer-row:hover{background:var(--bg-hover)}.layer-row.selected{background:var(--accent-soft);border-color:#34d3994d}.layer-row.drop-target{border-top:2px solid var(--accent)}.layer-row.hidden-layer .layer-name,.layer-row.hidden-layer .layer-thumb{opacity:.42}.layer-main{min-width:0;color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;align-items:center;gap:7px;padding:0;display:flex}.layer-thumb{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-input);width:26px;height:26px;color:var(--text-faint);flex-shrink:0;place-items:center;display:grid;overflow:hidden}.layer-thumb img{object-fit:contain;max-width:100%;max-height:100%}.layer-name{text-overflow:ellipsis;white-space:nowrap;font-size:.82rem;overflow:hidden}.layer-rename{min-width:0}.layer-actions{opacity:0;gap:0;transition:opacity .12s;display:flex}.layer-row:hover .layer-actions,.layer-row.selected .layer-actions{opacity:1}.layer-opacity{color:var(--text-muted);grid-column:1/-1;align-items:center;gap:7px;padding:4px 2px 2px;font-size:.72rem;display:flex}.layer-opacity .slider{flex:1}.layer-opacity span{text-align:right;font-variant-numeric:tabular-nums;min-width:32px}.status-bar{height:var(--status-bar-height);border-top:1px solid var(--border);background:var(--bg-panel);color:var(--text-faint);font-variant-numeric:tabular-nums;flex-shrink:0;align-items:center;gap:10px;padding:0 12px;font-size:.74rem;display:flex}.status-sep{background:var(--border);width:1px;height:12px}.status-selection{text-overflow:ellipsis;white-space:nowrap;margin-left:10px;overflow:hidden}.status-save{white-space:nowrap;margin-left:auto;padding-left:12px}.status-save-saved{color:var(--accent)}.status-save-saving,.status-save-pending{color:var(--warning)}.status-save-error{color:var(--danger)}.modal-backdrop{z-index:50;background:#05080cb3;place-items:center;padding:24px;display:grid;position:fixed;inset:0}.modal-panel{border:1px solid var(--border-strong);border-radius:var(--radius-lg);background:var(--bg-panel);max-width:100%;max-height:88vh;box-shadow:var(--shadow-float);flex-direction:column;display:flex}.modal-head{border-bottom:1px solid var(--border);justify-content:space-between;align-items:flex-start;gap:12px;padding:16px 16px 10px;display:flex}.modal-description{color:var(--text-muted);margin-top:3px;font-size:.8rem}.modal-body{padding:16px;overflow-y:auto}.modal-foot{border-top:1px solid var(--border);justify-content:flex-end;gap:8px;padding:12px 16px;display:flex}.toast-rack{z-index:60;flex-direction:column;gap:7px;max-width:380px;display:flex;position:fixed;bottom:40px;right:16px}.toast{border:1px solid var(--border-strong);border-radius:var(--radius);background:var(--bg-panel-raised);box-shadow:var(--shadow-float);align-items:center;gap:9px;padding:9px 11px;font-size:.82rem;animation:.16s ease-out toast-in;display:flex}.toast span{flex:1}.toast-success{color:var(--accent);border-color:#34d39966}.toast-error{color:#fca5a5;border-color:#f8717166}.toast-info{color:var(--info)}@keyframes toast-in{0%{opacity:0;transform:translateY(6px)}}@media (width<=1180px){:root{--panel-width:244px}}@media (width<=900px){.top-bar-group:nth-child(2){margin:0}.zoom-group{display:none}.side-panel{right:0;top:var(--top-bar-height);bottom:var(--status-bar-height);z-index:5;box-shadow:var(--shadow-float);position:absolute}.home{padding:20px 16px 40px}.home-search{width:100%;margin-left:0}}:root[data-contrast=high]{--border:#4b5563;--border-strong:#6b7280;--text-muted:#cbd5e1;--text-faint:#94a3b8}.stage-inner{display:inline-block;position:relative}.ruler{background:var(--bg-panel);color:var(--text-faint);font-variant-numeric:tabular-nums;-webkit-user-select:none;user-select:none;z-index:2;font-size:9px;position:absolute;overflow:hidden}.ruler-h{border-bottom:1px solid var(--border);height:20px;top:0;left:20px}.ruler-v{border-right:1px solid var(--border);width:20px;top:20px;left:0}.ruler-corner{background:var(--bg-panel);border-right:1px solid var(--border);border-bottom:1px solid var(--border);z-index:3;width:20px;height:20px;position:absolute;top:0;left:0}.ruler-tick{position:absolute}.ruler-h .ruler-tick{height:100%;top:0}.ruler-h .ruler-tick i{background:var(--border-strong);width:1px;height:5px;position:absolute;top:0;left:0}.ruler-h .ruler-tick b{white-space:nowrap;font-weight:500;position:absolute;top:6px;left:3px}.ruler-v .ruler-tick{width:100%;left:0}.ruler-v .ruler-tick i{background:var(--border-strong);width:5px;height:1px;position:absolute;top:0;left:0}.ruler-v .ruler-tick b{writing-mode:vertical-rl;font-weight:500;position:absolute;top:3px;left:6px}.ruler-cursor{background:var(--accent);position:absolute}.ruler-h .ruler-cursor{width:1px;height:100%;top:0}.ruler-v .ruler-cursor{width:100%;height:1px;left:0}.ruler-highlight{background:var(--accent-soft);position:absolute}.ruler-h .ruler-highlight{height:100%;top:0}.ruler-v .ruler-highlight{width:100%;left:0}.canvas-grid{pointer-events:none;z-index:1;position:absolute;inset:0}.guide-overlay{pointer-events:none;z-index:6;position:absolute;inset:0}.guide{position:absolute}.guide-canvas{background:#a78bfa;box-shadow:0 0 3px #a78bfacc}.guide-object{background:var(--accent);box-shadow:0 0 3px #34d399cc}.guide-x{width:1px}.guide-y{height:1px}.spacing{justify-content:center;align-items:center;display:flex;position:absolute}.spacing:before,.spacing:after{content:"";background:#f472b6;position:absolute}.spacing-x:before,.spacing-x:after{width:1px;height:9px;top:-4px}.spacing-x:before{left:0}.spacing-x:after{right:0}.spacing-y:before,.spacing-y:after{width:9px;height:1px;left:-4px}.spacing-y:before{top:0}.spacing-y:after{bottom:0}.spacing b{border-radius:var(--radius-sm);color:#3b0764;white-space:nowrap;background:#f472b6;padding:0 4px;font-size:9px;font-weight:700;line-height:13px}.marquee{border:1px solid var(--accent);pointer-events:none;z-index:5;background:#34d3991f;position:absolute}.history-panel{flex-direction:column;height:100%;display:flex}.history-actions{border-bottom:1px solid var(--border);align-items:center;gap:6px;padding:8px;display:flex}.history-count{margin-left:auto;font-size:.72rem}.history-list{flex:1;margin:0;padding:5px;list-style:none;overflow-y:auto}.history-row{border-radius:var(--radius);width:100%;color:var(--text-muted);font:inherit;text-align:left;cursor:pointer;background:0 0;border:1px solid #0000;align-items:center;gap:8px;padding:5px 7px;font-size:.8rem;transition:background .12s,color .12s;display:flex}.history-row:hover{background:var(--bg-hover);color:var(--text)}.history-row.active{background:var(--accent-soft);color:var(--text);border-color:#34d3994d;font-weight:600}.history-row.future{opacity:.45}.history-dot{background:currentColor;border-radius:50%;flex-shrink:0;width:6px;height:6px}.history-label{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.history-time{color:var(--text-faint);font-variant-numeric:tabular-nums;font-size:.68rem}.color-picker{margin-bottom:12px;position:relative}.color-picker-label{color:var(--text-muted);margin-bottom:4px;font-size:.75rem;display:block}.color-picker-row{align-items:center;gap:6px;display:flex}.color-picker-swatch{border:1px solid var(--border-strong);border-radius:var(--radius);cursor:pointer;background-color:#1a1f27;background-image:linear-gradient(45deg,#2a313c 25%,#0000 25%),linear-gradient(-45deg,#2a313c 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#2a313c 75%),linear-gradient(-45deg,#0000 75%,#2a313c 75%);background-position:0 0,0 4px,4px -4px,-4px 0;background-size:8px 8px;flex-shrink:0;width:32px;height:28px;padding:3px}.color-picker-swatch-fill{border-radius:2px;width:100%;height:100%;display:block}.color-picker-text{flex:1;font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:.8rem}.color-popover{z-index:40;border:1px solid var(--border-strong);border-radius:var(--radius-lg);background:var(--bg-panel-raised);box-shadow:var(--shadow-float);padding:10px;position:absolute;top:calc(100% + 6px);left:0;right:0}.color-mode-row{gap:2px;margin-bottom:10px;display:flex}.color-mode{border-radius:var(--radius-sm);background:var(--bg-input);color:var(--text-faint);font:inherit;cursor:pointer;border:0;flex:1;padding:4px;font-size:.7rem;font-weight:600}.color-mode.active{background:var(--accent-soft);color:var(--accent)}.color-channels{flex-direction:column;gap:7px;display:flex}.color-channel{color:var(--text-muted);grid-template-columns:18px 1fr 46px;align-items:center;gap:7px;font-size:.72rem;display:grid}.color-channel-value{font-variant-numeric:tabular-nums;font-size:.72rem}.color-channel-value.readonly{text-align:right;color:var(--text)}.alpha-channel{border-top:1px solid var(--border);margin-top:9px;padding-top:9px}.hue-slider{background:linear-gradient(90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.recent-colors{border-top:1px solid var(--border);margin-top:10px;padding-top:9px}.recent-colors-label{text-transform:uppercase;letter-spacing:.06em;color:var(--text-faint);margin-bottom:5px;font-size:.68rem;display:block}.recent-colors-grid{grid-template-columns:repeat(6,1fr);gap:4px;display:grid}.recent-swatch{aspect-ratio:1;border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;transition:transform .1s}.recent-swatch:hover{border-color:var(--accent);transform:scale(1.12)}.context-menu{z-index:70;border:1px solid var(--border-strong);border-radius:var(--radius-lg);background:var(--bg-panel-raised);min-width:208px;box-shadow:var(--shadow-float);padding:4px;animation:90ms ease-out context-in;position:fixed}@keyframes context-in{0%{opacity:0;transform:scale(.97)}}.context-item{border-radius:var(--radius);width:100%;color:var(--text);font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;align-items:center;gap:9px;padding:6px 8px;font-size:.82rem;display:flex}.context-item:hover:not(:disabled){background:var(--bg-hover)}.context-item:disabled{opacity:.38;cursor:not-allowed}.context-item.danger:hover:not(:disabled){color:var(--danger);background:#f8717129}.context-icon{width:15px;color:var(--text-faint);display:inline-flex}.context-label{flex:1}.context-shortcut{color:var(--text-faint);font-family:inherit;font-size:.72rem}.context-divider{background:var(--border);height:1px;margin:4px 2px}.align-bar .icon-row{margin-bottom:6px}.layer-bulk{border-bottom:1px solid var(--border);background:var(--accent-soft);color:var(--accent);justify-content:space-between;align-items:center;gap:8px;padding:6px 9px;font-size:.78rem;display:flex}.layer-row{transition:background .12s,transform .12s}.layer-row.drop-target{transform:translateY(2px)}.export-layout{grid-template-columns:1fr 240px;gap:16px;display:grid}.export-preview{flex-direction:column;gap:7px;min-width:0;display:flex}.export-preview-frame{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-canvas-void);place-items:center;min-height:200px;max-height:320px;padding:10px;display:grid;overflow:hidden}.export-preview-frame.checkered{background-color:#1a1f27;background-image:linear-gradient(45deg,#232a34 25%,#0000 25%),linear-gradient(-45deg,#232a34 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#232a34 75%),linear-gradient(-45deg,#0000 75%,#232a34 75%);background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px}.export-preview-frame img{object-fit:contain;max-width:100%;max-height:300px}.export-meta{font-variant-numeric:tabular-nums;font-size:.75rem}.export-controls{min-width:0}@media (width<=620px){.export-layout{grid-template-columns:1fr}}.rail-footer{border-top:1px solid var(--border);flex-direction:column;align-items:center;gap:2px;padding:6px 0 8px;display:flex}.status-pointer{min-width:74px}.button.full{justify-content:center;width:100%;margin-top:8px}.canvas-host{z-index:2;position:absolute;inset:0}.canvas-host .canvas-container{inset:0;position:absolute!important}