:root{color-scheme:light;--canvas: #fafafa;--chrome: #ffffff;--field: #ffffff;--ink: #241f31;--muted: #5e5c64;--tick: #9a9996;--line: #d5d3d0;--stage: #b6b4b0;--stage-ink: #ffffff;--paper: #ffffff;--checker: #d5d3d0;--ruler: #f6f5f4;--selected: #d6e6f8;--accent: #1c71d8;--accent-hover: #1a5fb4;--accent-ink: #ffffff;--hover: #ededeb;--danger: #c01c28;--ok: #1a5c32;--toast: #241f31;--toast-ink: #ffffff;--shadow: 0 10px 28px rgba(36, 31, 49, .14);--font: Cantarell, "Segoe UI", sans-serif;--mono: "Cascadia Mono", Consolas, monospace}html[data-theme=dark]{color-scheme:dark;--canvas: #242424;--chrome: #303030;--field: #1e1e1e;--ink: #ffffff;--muted: #c0bfbc;--tick: #9a9996;--line: #4a4a4a;--stage: #161616;--stage-ink: #deddda;--paper: #2c2c2c;--checker: #3d3d3d;--ruler: #2b2b2b;--selected: #1c4a86;--accent: #3584e4;--accent-hover: #62a0ea;--hover: #3a3a3a;--danger: #e01b24;--ok: #8ff0a4;--toast: #deddda;--toast-ink: #241f31;--shadow: 0 12px 32px rgba(0, 0, 0, .45)}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--canvas);color:var(--ink);font-family:var(--font);font-size:13px;touch-action:manipulation}button,input,select,textarea{font:inherit;color:inherit}button{background:transparent;border:1px solid transparent;border-radius:6px;padding:4px 8px;cursor:pointer}button:hover{background:var(--hover)}button:active{transform:translateY(1px)}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:1px}button:disabled{opacity:.45;cursor:default;transform:none}#app{height:100vh;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto auto}.menubar-row,.statusbar,.tabs,.tool-options,.dock-head,.dialog-actions{display:flex;align-items:center;gap:8px}.menubar-row{justify-content:space-between;padding:0 8px;border-bottom:1px solid var(--line);background:var(--chrome)}.menubar{display:flex;align-items:stretch;gap:0}.menu-wrap{position:relative}.menu-open{padding:6px 10px;border-radius:0}.menu-open[aria-expanded=true]{background:var(--hover)}.menu-panel{position:absolute;top:100%;left:0;z-index:30;min-width:240px;max-height:min(70vh,640px);overflow:auto;padding:4px;background:var(--chrome);border:1px solid var(--line);box-shadow:var(--shadow)}.menu-panel button,.menu-sub button{display:flex;width:100%;justify-content:space-between;gap:16px;text-align:left;border-radius:4px;padding:6px 8px}.menu-panel .sep{height:1px;margin:4px 6px;background:var(--line)}.menu-sub{padding-left:8px}kbd,.shortcut{color:var(--muted);font-family:var(--mono);font-size:11px}.window-title{display:flex;align-items:center;gap:8px;min-width:0;font-weight:600}.mark{width:14px;height:14px;background:linear-gradient(#241f31,#241f31) 0 0 / 6px 6px no-repeat,linear-gradient(var(--accent),var(--accent)) 8px 0 / 6px 6px no-repeat,linear-gradient(#deddda,#deddda) 0 8px / 6px 6px no-repeat,linear-gradient(#9a9996,#9a9996) 8px 8px / 6px 6px no-repeat}#document-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tool-options{min-height:40px;padding:4px 10px;border-bottom:1px solid var(--line);background:var(--chrome)}.option,dialog label{display:flex;align-items:center;gap:8px}.tool-context{margin:0 0 0 auto;color:var(--muted);max-width:42%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#tool-extra{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.workspace{min-height:0;display:grid;grid-template-columns:auto minmax(0,1fr) 240px}.toolbox,.docks{background:var(--chrome);min-height:0;overflow:auto}.toolbox{border-right:1px solid var(--line);width:92px;padding:8px}.tool-list{display:grid;grid-template-columns:1fr 1fr;gap:4px}.tool-button{width:36px;height:36px;padding:0;display:grid;place-items:center;border:1px solid transparent}.tool-button[aria-pressed=true]{background:var(--accent);color:var(--accent-ink)}.tool-button svg{width:18px;height:18px}.colors{margin-top:12px}.swatches{position:relative;height:48px}.color-field{position:absolute;width:28px;height:28px;border:1px solid var(--tick);overflow:hidden;background:var(--field)}.color-field.secondary{left:16px;top:16px}.color-field.primary{left:4px;top:4px;z-index:1}.color-field input{position:absolute;inset:0;opacity:0;cursor:pointer}.swatch-face{display:block;width:100%;height:100%}.swap{position:absolute;right:0;top:0}.palette{margin-top:8px;display:grid;grid-template-columns:repeat(4,1fr);gap:2px}.palette button{width:16px;height:16px;padding:0;border:1px solid rgba(0,0,0,.2);border-radius:2px}.canvas-column{min-width:0;min-height:0;display:grid;grid-template-columns:24px minmax(0,1fr);grid-template-rows:24px minmax(0,1fr);background:var(--stage)}#app[data-rulers="0"] .canvas-column{grid-template-columns:0 minmax(0,1fr);grid-template-rows:0 minmax(0,1fr)}#app[data-rulers="0"] .ruler-corner,#app[data-rulers="0"] #ruler-x,#app[data-rulers="0"] #ruler-y{visibility:hidden}.ruler-corner,#ruler-x,#ruler-y{background:var(--ruler)}#ruler-x,#ruler-y{display:block;width:100%;height:100%}#stage{grid-column:2;grid-row:2;position:relative;overflow:auto;min-height:0}#stage:not(.overflowing){display:grid;place-items:center}#stage.overflowing{display:block;padding:16px}#paper{position:relative;touch-action:none;user-select:none;background-color:var(--paper);background-image:linear-gradient(45deg,var(--checker) 25%,transparent 25%),linear-gradient(-45deg,var(--checker) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--checker) 75%),linear-gradient(-45deg,transparent 75%,var(--checker) 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0;box-shadow:0 1px #00000040}#paper canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;image-rendering:pixelated}#empty-state{position:absolute;inset:0;display:grid;place-items:center;align-content:center;gap:8px;color:var(--stage-ink)}#empty-state[hidden]{display:none}#empty-state button{background:var(--chrome);color:var(--ink)}.docks{border-left:1px solid var(--line);display:flex;flex-direction:column}.dock{min-height:0;display:flex;flex-direction:column;flex:1}.dock+.dock{border-top:1px solid var(--line)}.dock-head{justify-content:space-between;padding:6px 8px}.dock-head h2{margin:0;font-size:12px;font-weight:700}.dock ol{list-style:none;margin:0;padding:0 6px 8px;overflow:auto}.layer,.history-item,.tab{display:flex;align-items:center;gap:6px;width:100%;text-align:left}.layer[data-active=true],.history-item[aria-current=true],.tab[aria-selected=true]{background:var(--selected)}.layer span,.tab span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vis{width:10px;height:10px;border:1.5px solid currentColor;flex:0 0 auto}.vis.on{background:currentColor}.icon-button{width:28px;height:28px;padding:0;display:grid;place-items:center}.icon-button svg{width:16px;height:16px}.tabs{gap:0;overflow:auto;border-top:1px solid var(--line);background:var(--chrome);min-height:32px}#app[data-tabs="0"] .tabs,#app[data-tools="0"] .toolbox,#app[data-toolbar="0"] .tool-options,#app[data-docks="0"] .docks,#app[data-status="0"] .statusbar{display:none}#app[data-tools="0"] .workspace{grid-template-columns:minmax(0,1fr) 240px}#app[data-docks="0"] .workspace{grid-template-columns:auto minmax(0,1fr)}#app[data-tools="0"][data-docks="0"] .workspace{grid-template-columns:minmax(0,1fr)}.tab{border-right:1px solid var(--line);border-radius:0;max-width:180px}.tab button{padding:0 4px}.statusbar{justify-content:flex-start;gap:16px;padding:4px 10px;border-top:1px solid var(--line);background:var(--chrome);color:var(--muted)}#engine-status[data-state=ready]{color:var(--ok)}#engine-status[data-state=error]{color:var(--danger)}#zoom-label{color:var(--muted)}#text-editor{position:fixed;z-index:40;min-width:180px;min-height:72px;padding:6px;background:var(--chrome);border:1px solid var(--accent);box-shadow:var(--shadow);resize:both}#toast{position:fixed;left:50%;bottom:36px;transform:translate(-50%);z-index:50;padding:8px 12px;background:var(--toast);color:var(--toast-ink);border-radius:6px}dialog{border:1px solid var(--line);padding:16px 18px;background:var(--chrome);color:var(--ink);box-shadow:var(--shadow);min-width:min(420px,92vw)}dialog::backdrop{background:#241f3147}dialog h2{margin:0 0 12px;font-size:16px}dialog form{display:grid;gap:10px}dialog label{justify-content:space-between}dialog input[type=text],dialog input[type=number],dialog select{width:180px;padding:4px 6px;border:1px solid var(--line);background:var(--field)}dialog .check{justify-content:flex-start}.dialog-actions{justify-content:flex-end;margin-top:6px}.dialog-actions button[value=ok],#create-canvas,#confirm-export,#adjust-ok,#close-save,#paste-expand{background:var(--accent);color:var(--accent-ink)}.dialog-actions button[value=ok]:hover,#create-canvas:hover,#confirm-export:hover,#adjust-ok:hover,#close-save:hover,#paste-expand:hover{background:var(--accent-hover)}#shortcuts-list{display:grid;grid-template-columns:1fr auto;gap:4px 16px;margin:0;max-height:50vh;overflow:auto}#shortcuts-list dt{margin:0}#shortcuts-list dd{margin:0;color:var(--muted);font-family:var(--mono);font-size:11px}#adjust-fields{display:grid;gap:8px}#adjust-fields label input[type=range]{width:140px}#adjust-fields label input[type=number]{width:72px}