:root{--bg: #0c0f13;--workspace-a: #12171e;--workspace-b: #0a0d11;--surface: #151a21;--surface-2: #1a212b;--surface-3: #222b37;--border: #262f3b;--border-soft: #1e2630;--border-strong: #34404f;--text: #e8eef5;--text-dim: #93a0b1;--text-faint: #5d6877;--accent: #cd072e;--accent-strong: #a80624;--accent-hover: #e23150;--accent-ink: #ffffff;--accent-soft: rgba(205, 7, 46, .15);--accent-line: rgba(205, 7, 46, .46);--accent-2: #36b9ed;--accent-2-strong: #00a6e2;--accent-2-soft: rgba(0, 166, 226, .14);--ink: #d7e0ea;--good: #58cf9d;--font-ui: "Archivo", system-ui, "Segoe UI", sans-serif;--font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;--r-sm: 6px;--r: 9px;--r-lg: 13px;--shadow-1: 0 1px 2px rgba(0, 0, 0, .4);--shadow-pop: 0 10px 30px -8px rgba(0, 0, 0, .6);--t: .13s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:var(--font-ui);color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow:hidden}button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}button:disabled{opacity:.34;cursor:default}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:var(--surface-3);border-radius:99px;border:2px solid var(--surface)}::-webkit-scrollbar-thumb:hover{background:var(--border-strong)}::-webkit-scrollbar-track{background:transparent}#app{display:grid;grid-template-columns:60px 1fr 320px;grid-template-rows:54px 1fr 34px;grid-template-areas:"menubar menubar menubar" "rail canvas inspector" "statusbar statusbar statusbar";height:100vh}.menubar{grid-area:menubar;display:flex;align-items:center;gap:14px;padding:0 14px;background:linear-gradient(180deg,#1a212b,#141a22);border-bottom:1px solid var(--border);box-shadow:var(--shadow-1);z-index:4}.brand{display:flex;align-items:center;gap:9px;padding-right:4px;-webkit-user-select:none;user-select:none}.brand-mark{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:7px;background:linear-gradient(150deg,var(--accent),var(--accent-strong));color:#fff;font-size:13px;box-shadow:0 2px 10px -2px #cd072e99,inset 0 1px #ffffff40}.brand-name{font-weight:800;letter-spacing:.14em;font-size:15px}.brand-sub{color:var(--text-dim);font-size:12.5px;font-weight:600;letter-spacing:.03em;padding-left:11px;border-left:1px solid var(--border)}.menu-group{display:flex;align-items:center;gap:4px}.menu-group.history,.menu-group.export{gap:6px}.menu-spacer{flex:1}.mbtn{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 12px;border-radius:var(--r-sm);color:var(--text-dim);font-size:13px;font-weight:600;transition:background var(--t),color var(--t),transform var(--t)}.mbtn svg{width:18px;height:18px}.mbtn:hover{background:var(--surface-3);color:var(--text)}.mbtn:active{transform:translateY(1px)}.mbtn-icon{padding:0;width:34px;justify-content:center}.mbtn-primary{background:linear-gradient(180deg,var(--accent),var(--accent-strong));color:var(--accent-ink);font-weight:700;box-shadow:0 2px 12px -3px #cd072e8c}.mbtn-primary:hover{background:linear-gradient(180deg,var(--accent-hover),var(--accent));color:var(--accent-ink)}.rail{grid-area:rail;display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 0;background:var(--surface);border-right:1px solid var(--border);z-index:3}.rail-group{display:flex;flex-direction:column;gap:6px}.rail-sep{width:26px;height:1px;background:var(--border);margin:4px 0}.rail-btn{position:relative;width:42px;height:42px;display:grid;place-items:center;border-radius:10px;color:var(--text-dim);border:1px solid transparent;transition:background var(--t),color var(--t),border-color var(--t),transform var(--t)}.rail-btn svg{width:21px;height:21px}.rail-btn:hover{background:var(--surface-3);color:var(--text)}.rail-btn:active{transform:scale(.94)}.rail-btn.active{background:var(--accent-soft);color:var(--accent);border-color:var(--accent-line);box-shadow:inset 0 0 0 1px #ff9d4d1a}.rail-key{position:absolute;bottom:2px;right:4px;font-family:var(--font-mono);font-size:8.5px;color:var(--text-faint);pointer-events:none}.rail-btn.active .rail-key{color:var(--accent);opacity:.7}.rail-action{color:var(--text-faint)}.rail-action:hover{color:var(--text)}.canvas-host{grid-area:canvas;position:relative;overflow:hidden;background:radial-gradient(120% 120% at 30% 0%,var(--workspace-a),var(--workspace-b))}.canvas{display:block;width:100%;height:100%;cursor:crosshair}.canvas.is-draw{cursor:crosshair}.canvas.is-pan{cursor:grab}.canvas.is-pan:active{cursor:grabbing}.grid-minor{stroke:#ffffff09;stroke-width:1}.grid-major{stroke:#ffffff13;stroke-width:1}.grid-axis{stroke:#cd072e52;stroke-width:1.2}[data-selected=true]{stroke:var(--accent)!important}text[data-selected=true]{fill:var(--accent)!important}.selection-box{fill:none;stroke:var(--accent);stroke-width:1.2;stroke-dasharray:5 4;opacity:.9}.selection-handle{fill:var(--bg);stroke:var(--accent);stroke-width:1.4}.hud{position:absolute;z-index:5;font-family:var(--font-mono);font-size:12px;color:var(--text-dim);background:#10151cd1;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--border);border-radius:8px;box-shadow:var(--shadow-1)}.hud-coords{left:14px;bottom:14px;padding:6px 11px;letter-spacing:.02em;pointer-events:none}.hud-zoom{right:14px;bottom:14px;display:flex;align-items:center;padding:3px;gap:1px}.hud-zoom button{min-width:30px;height:28px;border-radius:6px;color:var(--text-dim);font-size:15px;display:grid;place-items:center;transition:background var(--t),color var(--t)}.hud-zoom button:hover{background:var(--surface-3);color:var(--text)}.hud-zoom-label{font-family:var(--font-mono);font-size:12px!important;min-width:52px!important;color:var(--text)!important}.inspector{grid-area:inspector;overflow-y:auto;background:var(--surface);border-left:1px solid var(--border);display:flex;flex-direction:column}.panel{padding:14px 16px;border-bottom:1px solid var(--border-soft)}.panel-heading{margin:0 0 12px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.13em;color:var(--text-faint)}.panel-empty{margin:0;color:var(--text-faint);font-size:13px}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.field{display:flex;flex-direction:column;gap:5px;min-width:0}.field-label{font-size:11px;color:var(--text-dim);letter-spacing:.02em}.field-input{width:100%;height:32px;padding:0 10px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);color:var(--text);font-family:var(--font-ui);font-size:13px;transition:border-color var(--t),box-shadow var(--t),background var(--t)}.field-input:hover{border-color:var(--border-strong)}.field-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);background:var(--bg)}.field-input.mono,input.mono{font-family:var(--font-mono);letter-spacing:.01em}select.field-input{-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%2393a0b1' stroke-width='1.4' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:26px}.field-color{padding:3px;height:32px;cursor:pointer}input[type=color].field-color::-webkit-color-swatch{border:none;border-radius:4px}input[type=color].field-color::-webkit-color-swatch-wrapper{padding:0}input[type=number].field-input::-webkit-inner-spin-button{opacity:.4}.panel-add{margin-top:10px;width:100%;height:32px;border:1px dashed var(--border-strong);border-radius:var(--r-sm);color:var(--text-dim);font-size:12.5px;font-weight:600;transition:border-color var(--t),color var(--t),background var(--t)}.panel-add:hover{border-color:var(--accent-line);color:var(--accent);background:var(--accent-soft)}.notes-rows{display:flex;flex-direction:column;gap:10px}.note-card{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:9px;border:1px solid var(--border);border-radius:var(--r);background:var(--surface-2)}.note-card-top{grid-column:1 / 3;display:flex;align-items:center;justify-content:space-between}.note-index{font-family:var(--font-mono);font-size:11px;color:var(--text-faint)}.note-remove{width:20px;height:20px;border-radius:5px;color:var(--text-faint);display:grid;place-items:center;font-size:16px;line-height:1;transition:background var(--t),color var(--t)}.note-remove:hover{background:#ff5a5a29;color:#ff8484}.note-input{height:30px}.note-input:nth-of-type(odd){grid-column:1 / 3}.statusbar{grid-area:statusbar;position:relative;display:flex;align-items:center;justify-content:space-between;padding:0 14px;background:linear-gradient(180deg,#141a22,#10151b);border-top:1px solid var(--border);font-size:12px;z-index:3}.status-left,.status-right{display:flex;align-items:center;gap:8px}.status-credit{position:absolute;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:6px;color:var(--text-faint);font-size:11px;letter-spacing:.02em;pointer-events:none;white-space:nowrap}.status-credit .credit-mark{color:var(--accent);font-size:9px}.snap-toggle{height:22px;padding:0 10px;border-radius:99px;border:1px solid var(--border);color:var(--text-faint);font-size:11px;font-weight:600;transition:all var(--t)}.snap-toggle:hover{color:var(--text-dim);border-color:var(--border-strong)}.snap-toggle.on{background:var(--accent-soft);color:var(--accent);border-color:var(--accent-line)}.status-chip{color:var(--text-faint);font-family:var(--font-mono);font-size:11px}.status-seg{color:var(--text-dim);font-size:11.5px}.status-seg+.status-seg{border-left:1px solid var(--border);padding-left:12px}.status-right .status-seg{font-family:var(--font-mono)}.status-unit{color:var(--text-faint)}.context-menu{position:fixed;z-index:50;min-width:168px;padding:5px;background:var(--surface-2);border:1px solid var(--border-strong);border-radius:var(--r);box-shadow:var(--shadow-pop);display:flex;flex-direction:column;gap:1px}.context-menu-item{display:flex;align-items:center;gap:9px;width:100%;height:32px;padding:0 10px;border-radius:var(--r-sm);color:var(--text);font-size:13px;font-weight:600;text-align:left}.context-menu-item svg{width:17px;height:17px;color:var(--text-dim)}.context-menu-item:hover:not(:disabled){background:var(--accent);color:var(--accent-ink)}.context-menu-item:hover:not(:disabled) svg{color:var(--accent-ink)}.context-menu-item:disabled{color:var(--text-faint);cursor:default}.context-menu-sep{height:1px;margin:4px 6px;background:var(--border)}.field-check{flex-direction:row;align-items:center;justify-content:space-between}.field-check .field-input{width:auto;flex:0 0 auto}.marquee-box{fill:var(--accent-2-soft);stroke:var(--accent-2-strong);stroke-width:1;stroke-dasharray:4 3}