:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#efece5;--panel:#f7f5ef;--border:#d8d3c6;--text:#2c2a26;--text-dim:#6b6759;--accent:#4a90d9}*{box-sizing:border-box}html,body{height:100%;margin:0}body{color:var(--text);background:var(--bg);font-family:system-ui,-apple-system,Segoe UI,sans-serif}button{font:inherit;color:inherit}#app{flex-direction:column;height:100vh;display:flex}#topbar{background:var(--panel);border-bottom:1px solid var(--border);flex:none;align-items:center;gap:12px;height:48px;padding:0 12px;display:flex}#logo{letter-spacing:.01em;-webkit-user-select:none;user-select:none;flex:0 0 209px;align-items:center;gap:7px;font-size:15px;font-weight:700;display:flex}#topbar-nav,#topbar-actions{align-items:center;gap:6px;display:flex}#topbar-actions{margin-left:auto}#palette-strip{flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:12px;display:flex}#palette-select{flex:100%}#topbar button,#palette-select{border:1px solid var(--border);cursor:pointer;background:#fff;border-radius:4px;padding:5px 10px}#topbar button:hover,#palette-select:hover{background:var(--panel)}#topbar button:disabled{opacity:.45;cursor:default}#palette-strip .swatch{border:1px solid var(--border);cursor:pointer;border-radius:50%;width:22px;height:22px;padding:0}#palette-strip .swatch[data-pinned=true]{box-shadow:0 0 0 2px var(--panel), 0 0 0 4px var(--accent)}#palette-strip .swatch-auto{width:auto;height:22px;color:var(--text-dim);background:#fff;border-radius:11px;padding:0 8px;font-size:11px}#palette-strip .swatch-auto[data-active=true]{background:var(--accent);border-color:var(--accent);color:#fff}#body{flex:auto;min-height:0;display:flex}#rail{background:var(--panel);border-right:1px solid var(--border);flex-direction:column;flex:0 0 220px;gap:16px;padding:12px;display:flex;overflow-y:auto}#tools{flex-direction:column;gap:4px;display:flex}#tools button{text-align:left;border:1px solid var(--border);cursor:pointer;background:#fff;border-radius:4px;padding:8px 10px}#tools button[data-active=true]{background:var(--accent);border-color:var(--accent);color:#fff}#tool-icons{justify-content:flex-start;gap:4px;margin-bottom:2px;display:flex}#tools #tool-icons button{text-align:center;place-items:center;width:34px;height:34px;padding:0;display:grid}.rail-divider{border-top:1px solid var(--border);color:var(--text);margin-top:16px;padding-top:12px;font-size:13px;font-weight:700}#rail-footer{border-top:1px solid var(--border);color:var(--text-dim);margin-top:auto;padding-top:12px;font-size:11px;line-height:1.6}#rail-footer a{color:var(--text-dim)}#param-panel{color:var(--text-dim);flex-direction:column;gap:8px;font-size:13px;display:flex}#param-panel h3{color:var(--text);margin:0;font-size:13px}#param-panel .panel-hint{margin:0}#param-panel .panel-note{margin:0;font-style:italic}#param-panel .panel-actions{gap:6px;display:flex}#param-panel .panel-actions button{border:1px solid var(--border);cursor:pointer;color:inherit;background:#fff;border-radius:4px;flex:1;padding:5px 8px}#param-panel .panel-actions button:hover{background:var(--bg)}#param-panel .panel-slider-row{flex-direction:column;gap:4px;display:flex}#param-panel .panel-slider-row input[type=range]{width:100%}#param-panel .panel-slider-row input[type=range]:disabled{opacity:.45}#hand-dial{color:var(--text-dim);flex-direction:column;gap:4px;font-size:13px;display:flex}#hand-dial input[type=range]{width:100%}#stage{background:var(--bg);flex:auto;min-width:0;position:relative;overflow:hidden}#stage.panning-ready{cursor:grab}#stage.panning{cursor:grabbing}svg#sheet{width:100%;height:100%;display:block}svg#sheet rect.paper{filter:drop-shadow(0 4px 14px #0000002e)}svg#sheet g.strokes{pointer-events:none}svg#sheet.tool-select g.strokes{pointer-events:auto}#vintage-banner{background:var(--panel);border:1px solid var(--border);border-radius:6px;align-items:center;gap:10px;padding:6px 12px;font-size:13px;display:flex;position:absolute;top:12px;left:50%;transform:translate(-50%);box-shadow:0 2px 8px #0000001f}#vintage-banner[hidden]{display:none}#vintage-banner button{border:1px solid var(--border);cursor:pointer;background:#fff;border-radius:4px;padding:4px 8px}#new-dialog,#png-dialog{border:1px solid var(--border);background:var(--panel);color:var(--text);border-radius:8px;padding:20px 24px}#new-dialog::backdrop,#png-dialog::backdrop{background:#00000059}#new-dialog h2,#png-dialog h2{margin:0 0 14px;font-size:16px}#new-dialog-options,#png-dialog-options{gap:10px;display:flex}#new-dialog-options button,#png-dialog-options button{border:1px solid var(--border);cursor:pointer;text-align:center;white-space:nowrap;background:#fff;border-radius:6px;flex:1;padding:14px 10px}#new-dialog-options button:hover,#png-dialog-options button:hover{background:var(--bg)}#new-dialog-options small{color:var(--text-dim)}
