:root{--bg:#eef1f5;--bg-elevated:#fff;--mesa:#d7dee7;--mesa-dot:#b9c3d1;--paper:#fff;--ink:#1a1a1a;--text:#1b2330;--muted:#5c6675;--border:#c3cad4;--accent:#2f5fd1;--accent-soft:#dce6fb;--danger:#c0392b;--danger-soft:#f8ded1}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#12151b;--bg-elevated:#1a1f27;--mesa:#1e232b;--mesa-dot:#333b48;--text:#e5e9f0;--muted:#8a93a3;--border:#2b313c;--accent:#6d95ff;--accent-soft:#22314f;--danger:#e5766a;--danger-soft:#3b2323}}:root[data-theme=dark]{--bg:#12151b;--bg-elevated:#1a1f27;--mesa:#1e232b;--mesa-dot:#333b48;--text:#e5e9f0;--muted:#8a93a3;--border:#2b313c;--accent:#6d95ff;--accent-soft:#22314f;--danger:#e5766a;--danger-soft:#3b2323}*{box-sizing:border-box}html,body,#root{height:100%}body{background:var(--bg);color:var(--text);margin:0;font-family:IBM Plex Sans,system-ui,sans-serif;overflow:hidden}#app{flex-direction:column;height:100%;display:flex}.toolbar{background:var(--bg-elevated);border-bottom:1px solid var(--border);z-index:20;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:9px 14px;display:flex;position:relative}.brand{letter-spacing:.2px;white-space:nowrap;margin-right:6px;font-size:14.5px;font-weight:600}.brand span{color:var(--accent)}.grp{background:var(--bg);border:1px solid var(--border);border-radius:8px;align-items:center;gap:3px;padding:3px;display:flex}.sep{background:var(--border);align-self:stretch;width:1px;margin:2px}button.tool{color:var(--muted);font:inherit;cursor:pointer;white-space:nowrap;background:0 0;border:none;border-radius:6px;align-items:center;gap:6px;padding:6px 10px;font-size:12.5px;font-weight:500;display:flex}button.tool svg{flex:none;width:15px;height:15px}button.tool:hover{background:var(--accent-soft);color:var(--text)}button.tool.active{background:var(--accent);color:#fff}button.tool:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:1px}button.tool[disabled]{opacity:.35;cursor:not-allowed}button.tool[disabled]:hover{color:var(--muted);background:0 0}select.sheetsize{font:inherit;color:var(--text);background:var(--bg-elevated);border:1px solid var(--border);cursor:pointer;border-radius:6px;padding:6px 8px;font-size:12.5px;font-weight:500}button.primary{font:inherit;background:var(--accent);color:#fff;cursor:pointer;white-space:nowrap;border:none;border-radius:6px;align-items:center;gap:6px;padding:7px 11px;font-size:12.5px;font-weight:600;display:flex}button.primary:hover{filter:brightness(1.08)}button.ghost{font:inherit;color:var(--muted);border:1px solid var(--border);cursor:pointer;background:0 0;border-radius:6px;align-items:center;padding:6px 9px;font-size:12.5px;font-weight:500;display:flex}button.ghost:hover{color:var(--text);border-color:var(--muted)}button.ghost[disabled]{opacity:.35;cursor:not-allowed}.spacer{flex:1}.zoomreadout{color:var(--muted);text-align:center;font-variant-numeric:tabular-nums;min-width:44px;font-family:IBM Plex Mono,monospace;font-size:12px}#canvasWrap{background-color:var(--mesa);background-image:radial-gradient(var(--mesa-dot) 1px, transparent 1px);cursor:default;background-size:22px 22px;flex:1;min-height:0;position:relative;overflow:hidden}#canvasWrap.panning{cursor:grabbing}#canvasWrap.tool-draw{cursor:crosshair}svg#stage{-webkit-user-select:none;user-select:none;touch-action:none;width:100%;height:100%;display:block}#overlays{pointer-events:none;position:absolute;inset:0}.sheet-tab{pointer-events:auto;background:var(--bg-elevated);border:1px solid var(--border);color:var(--muted);cursor:grab;white-space:nowrap;border-bottom:none;border-radius:7px 7px 0 0;align-items:center;gap:6px;padding:4px 6px 4px 9px;font-size:11.5px;display:flex;position:absolute;transform:translateY(-100%)}.sheet-tab.selected{border-color:var(--accent);color:var(--text)}.sheet-tab .name{color:var(--text);cursor:text;text-overflow:ellipsis;max-width:34vw;font-weight:600;overflow:hidden}.sheet-tab .rename-input{color:var(--text);background:var(--bg);border:1px solid var(--accent);border-radius:4px;width:12ch;padding:1px 4px;font:600 11.5px IBM Plex Sans,sans-serif}.sheet-tab .size{color:var(--muted);font-family:IBM Plex Mono,monospace;font-size:10.5px}.sheet-tab .badge{background:var(--accent-soft);color:var(--accent);cursor:pointer;border-radius:4px;align-items:center;gap:3px;padding:1px 5px;font-family:IBM Plex Mono,monospace;font-size:10px;font-weight:500;display:flex}.sheet-tab .badge svg{width:10px;height:10px}.sheet-tab .badge:hover{filter:brightness(1.15)}.sheet-tab button.mini{color:var(--muted);cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;width:18px;height:18px;font-size:13px;line-height:1;display:flex}.sheet-tab button.mini:hover{background:var(--danger-soft);color:var(--danger)}.floating-backdrop{z-index:40;pointer-events:auto;background:0 0;position:fixed;inset:0}.floating-box{z-index:41;background:var(--bg-elevated);border:1px solid var(--accent);border-radius:8px;flex-wrap:wrap;align-items:center;gap:6px;max-width:280px;padding:6px;display:flex;position:fixed;box-shadow:0 6px 20px #0000002e}.floating-box input[type=text],.floating-box input[type=number]{color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:5px;width:92px;padding:6px 7px;font:14px/1.2 IBM Plex Mono,monospace}.floating-box textarea{color:var(--text);background:var(--bg);border:1px solid var(--border);resize:none;text-align:center;border-radius:5px;flex-basis:100%;width:220px;min-height:1.4em;padding:7px 8px;font:15px/1.35 IBM Plex Sans Condensed,sans-serif;overflow:hidden}.floating-box textarea:focus{border-color:var(--accent);outline:none}.floating-box .kbdhint{color:var(--muted);flex-basis:100%;font-family:IBM Plex Mono,monospace;font-size:10px}.floating-box select{color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:5px;padding:6px 5px;font:12.5px IBM Plex Sans,sans-serif}.floating-box button{cursor:pointer;border:none;border-radius:5px;padding:6px 9px;font:600 12.5px IBM Plex Sans,sans-serif}.floating-box button.ok{background:var(--accent);color:#fff}.floating-box button.cancel{color:var(--muted);background:0 0}.floating-box .customscale{color:var(--muted);align-items:center;gap:3px;font:12.5px IBM Plex Mono,monospace;display:flex}.floating-box .customscale input{width:48px}.floating-box .fieldlabel{color:var(--muted);flex-basis:100%;margin:2px 0 -3px;font-size:10px}#statusbar{background:var(--bg-elevated);border-top:1px solid var(--border);color:var(--muted);align-items:center;gap:12px;min-height:32px;padding:7px 14px;font-size:11.5px;display:flex}#statusbar.warn{color:var(--danger)}#statusbar .hint{flex:1}#statusbar .coords{font-variant-numeric:tabular-nums;font-family:IBM Plex Mono,monospace}.empty-hint{text-align:center;color:var(--muted);pointer-events:none;font-size:13px;position:absolute;top:44%;left:50%;transform:translate(-50%,-50%)}.empty-hint b{color:var(--text)}.context-menu{z-index:45;background:var(--bg-elevated);border:1px solid var(--border);border-radius:8px;flex-direction:column;min-width:190px;padding:4px;display:flex;position:fixed;box-shadow:0 8px 24px #00000038}.context-item{text-align:left;color:var(--text);cursor:pointer;background:0 0;border:none;border-radius:5px;padding:7px 9px;font:500 12.5px IBM Plex Sans,sans-serif}.context-item:hover:not([disabled]){background:var(--accent-soft)}.context-item.danger{color:var(--danger)}.context-item.danger:hover:not([disabled]){background:var(--danger-soft)}.context-item[disabled]{opacity:.4;cursor:not-allowed}.marquee-box{border:1.5px solid var(--accent);background:var(--accent-soft);opacity:.55;pointer-events:none;position:absolute}.crop-hint{z-index:41;background:var(--bg-elevated);border:1px solid var(--accent);color:var(--muted);border-radius:8px;align-items:center;gap:10px;padding:8px 12px;font-size:12px;display:flex;position:fixed;bottom:52px;left:50%;transform:translate(-50%);box-shadow:0 6px 20px #0000002e}.crop-hint button.ok{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:5px;padding:6px 9px;font:600 12.5px IBM Plex Sans,sans-serif}.tips-modal{z-index:46;background:var(--bg-elevated);border:1px solid var(--border);border-radius:10px;flex-direction:column;width:min(560px,92vw);max-height:80vh;display:flex;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 12px 36px #00000047}.tips-head{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:12px 16px;font-size:14px;font-weight:600;display:flex}.tips-body{flex-direction:column;gap:4px;padding:6px 16px;display:flex;overflow-y:auto}.tips-section{border-bottom:1px solid var(--border);padding:10px 0}.tips-section:last-child{border-bottom:none}.tips-section h4{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:0 0 6px;font-size:11px}.tips-section table{border-collapse:collapse;width:100%}.tips-section td{color:var(--text);vertical-align:top;padding:4px 0;font-size:12.5px}.tips-key{color:var(--accent);white-space:nowrap;width:1%;font-family:IBM Plex Mono,monospace;font-size:11.5px;padding-right:14px!important}.tips-foot{border-top:1px solid var(--border);justify-content:flex-end;padding:12px 16px;display:flex}.tips-foot button.ok{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:7px 12px;font:600 12.5px IBM Plex Sans,sans-serif}