:root{--font-sans: "IBM Plex Sans", -apple-system, sans-serif;--font-mono: "IBM Plex Mono", ui-monospace, monospace;--accent: #c96f3c;--accent-hi: #e08a5a;--accent-lo: #a05628;--accent-tint: rgba(201, 111, 60, .14);--contour-major: #d98c4a;--contour-minor: #7d5a3f;--ok: #6fa96b;--warn: #d4a24a;--err: #c9584a;--t-fast: .12s;--t: .18s}:root,[data-theme=dark]{--bg-0: #0d1013;--bg-1: #14181d;--bg-2: #1a1f26;--bg-3: #232932;--bg-4: #2c333d;--border: #252b33;--border-strong: #333a44;--text: #dde2ea;--text-dim: #9aa2ad;--text-mute: #666c76;--grid: rgba(255,255,255,.04);--grid-strong: rgba(255,255,255,.08);--shadow: 0 8px 24px rgba(0,0,0,.4), 0 2px 6px rgba(0,0,0,.3);--viewport-bg: radial-gradient(ellipse at center, #1a1f26 0%, #0a0c0f 100%)}[data-theme=light]{--bg-0: #ebe7de;--bg-1: #f5f2ec;--bg-2: #ffffff;--bg-3: #ece8df;--bg-4: #d8d3c8;--border: #d5d0c4;--border-strong: #b8b1a2;--text: #1e2126;--text-dim: #55595f;--text-mute: #8a8880;--grid: rgba(0,0,0,.05);--grid-strong: rgba(0,0,0,.09);--shadow: 0 4px 14px rgba(60,50,30,.1), 0 1px 3px rgba(60,50,30,.08);--viewport-bg: radial-gradient(ellipse at center, #f0ece2 0%, #d9d3c4 100%);--contour-major: #9a4a1e;--contour-minor: #7d5a3f}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;width:100%;background:var(--bg-0);color:var(--text);font-family:var(--font-sans);font-size:13px;line-height:1.4;overflow:hidden;-webkit-font-smoothing:antialiased}#root{height:100%;width:100%}.app{display:grid;grid-template-rows:32px 44px 1fr 28px 22px;grid-template-columns:52px 1fr 300px;grid-template-areas:"menu   menu    menu" "tools  tools   tools" "rail   main    props" "cmd    cmd     cmd" "status status  status";height:100vh;width:100vw}.menubar{grid-area:menu;background:var(--bg-1);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 12px;gap:2px;font-size:12px;user-select:none}.menubar .brand{display:flex;align-items:center;gap:8px;padding-right:14px;margin-right:8px;border-right:1px solid var(--border);height:100%}.menubar .brand-mark{width:20px;height:20px;display:block}.menubar .brand-name{font-weight:600;letter-spacing:.12em;font-size:12px;color:var(--text)}.menubar .brand-name .accent{color:var(--accent)}.menu-item{padding:5px 10px;border-radius:3px;color:var(--text-dim);cursor:pointer}.menu-item:hover{background:var(--bg-3);color:var(--text)}.menubar .spacer{flex:1}.menubar .env{display:flex;gap:14px;align-items:center;color:var(--text-mute);font-family:var(--font-mono);font-size:11px}.menubar .env b{color:var(--text-dim);font-weight:500}.theme-toggle{display:flex;align-items:center;gap:6px;padding:4px 10px;border-radius:3px;background:var(--bg-3);border:1px solid var(--border);cursor:pointer;color:var(--text-dim);font-size:11px}.theme-toggle:hover{color:var(--text);border-color:var(--border-strong)}.toolbar{grid-area:tools;background:var(--bg-1);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 8px;gap:4px;overflow-x:auto}.tool-group{display:flex;align-items:center;gap:2px;padding:0 8px;height:28px;border-right:1px solid var(--border)}.tool-group:last-child{border-right:none}.tool-group .label{font-size:10px;letter-spacing:.08em;color:var(--text-mute);text-transform:uppercase;margin-right:6px}.tool-btn{width:30px;height:30px;display:flex;align-items:center;justify-content:center;background:transparent;border:1px solid transparent;border-radius:3px;color:var(--text-dim);cursor:pointer;position:relative}.tool-btn:hover{background:var(--bg-3);color:var(--text);border-color:var(--border)}.tool-btn.active{background:var(--accent-tint);color:var(--accent-hi);border-color:var(--accent)}.tool-btn svg{width:16px;height:16px}.tool-btn .kbd{position:absolute;bottom:1px;right:2px;font-size:8px;font-family:var(--font-mono);color:var(--text-mute)}.rail{grid-area:rail;background:var(--bg-1);border-right:1px solid var(--border);display:flex;flex-direction:column;padding:6px 0}.rail-btn{width:100%;padding:10px 0;display:flex;flex-direction:column;align-items:center;gap:4px;background:transparent;border:none;color:var(--text-mute);cursor:pointer;font-size:9px;letter-spacing:.05em;position:relative;border-left:2px solid transparent}.rail-btn:hover{color:var(--text);background:var(--bg-2)}.rail-btn.active{color:var(--accent);border-left-color:var(--accent);background:linear-gradient(90deg,var(--accent-tint) 0%,transparent 100%)}.rail-btn svg{width:20px;height:20px}.main{grid-area:main;background:var(--viewport-bg);position:relative;overflow:hidden}.viewport-hud{position:absolute;pointer-events:none;font-family:var(--font-mono);font-size:11px;color:var(--text-dim);z-index:5}.viewport-hud.tl{top:12px;left:12px}.viewport-hud.tr{top:12px;right:12px;text-align:right}.viewport-hud.bl{bottom:12px;left:12px}.viewport-hud.br{bottom:12px;right:12px;text-align:right}.hud-block{background:#00000059;backdrop-filter:blur(6px);border:1px solid var(--border);border-radius:3px;padding:6px 10px;display:inline-block}[data-theme=light] .hud-block{background:#ffffffb3}.hud-label{color:var(--text-mute);font-size:9px;letter-spacing:.1em;text-transform:uppercase}.hud-value{color:var(--text);font-size:11px}.hud-value .u{color:var(--text-mute)}.props{grid-area:props;background:var(--bg-1);border-left:1px solid var(--border);display:flex;flex-direction:column;overflow-y:auto}.panel-section{border-bottom:1px solid var(--border)}.panel-header{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-mute);cursor:pointer;user-select:none;background:var(--bg-2)}.panel-header:hover{color:var(--text-dim)}.panel-header .chev{transition:transform var(--t-fast)}.panel-header.collapsed .chev{transform:rotate(-90deg)}.panel-body{padding:10px 12px}.panel-body.collapsed{display:none}.field{display:flex;align-items:center;justify-content:space-between;padding:4px 0;gap:8px}.field label{color:var(--text-dim);font-size:11px;flex:0 0 auto}.field .val{font-family:var(--font-mono);font-size:11px;color:var(--text)}.field input[type=text],.field input[type=number],.field select{background:var(--bg-3);border:1px solid var(--border);color:var(--text);padding:3px 6px;border-radius:2px;font-family:var(--font-mono);font-size:11px;width:90px;text-align:right}.field input:focus,.field select:focus{outline:none;border-color:var(--accent)}.field input[type=range]{width:100%;accent-color:var(--accent)}.layer-row{display:grid;grid-template-columns:18px 18px 1fr auto;align-items:center;gap:8px;padding:5px 4px;border-radius:2px;cursor:pointer;font-size:11px}.layer-row:hover{background:var(--bg-3)}.layer-row.selected{background:var(--accent-tint)}.layer-vis{width:16px;height:16px;display:flex;align-items:center;justify-content:center;color:var(--text-dim);cursor:pointer;border-radius:2px}.layer-vis:hover{color:var(--text)}.layer-vis.off{color:var(--text-mute);opacity:.4}.layer-swatch{width:12px;height:12px;border-radius:2px;border:1px solid rgba(0,0,0,.3)}.layer-name{color:var(--text)}.layer-meta{color:var(--text-mute);font-family:var(--font-mono);font-size:10px}.cmd{grid-area:cmd;background:var(--bg-1);border-top:1px solid var(--border);display:flex;flex-direction:column;font-family:var(--font-mono);font-size:11px;overflow:hidden}.cmd-history{flex:1;overflow-y:auto;padding:2px 12px;color:var(--text-dim);line-height:1.5}.cmd-history .cmd-in{color:var(--text)}.cmd-history .cmd-in:before{content:"> ";color:var(--accent)}.cmd-history .cmd-out{color:var(--text-mute);padding-left:12px}.cmd-history .cmd-err{color:var(--err);padding-left:12px}.cmd-input-row{display:flex;align-items:center;padding:4px 12px;border-top:1px solid var(--border);background:var(--bg-0)}.cmd-prompt{color:var(--accent);margin-right:6px}.cmd-input{flex:1;background:transparent;border:none;color:var(--text);font-family:var(--font-mono);font-size:11px;outline:none}.status{grid-area:status;background:var(--bg-2);border-top:1px solid var(--border);display:flex;align-items:center;padding:0 12px;gap:20px;font-family:var(--font-mono);font-size:10px;color:var(--text-mute)}.status .s-item{display:flex;gap:6px;align-items:center}.status .s-item b{color:var(--text-dim);font-weight:500}.status .s-spacer{flex:1}.status .s-toggle{padding:2px 6px;border-radius:2px;cursor:pointer}.status .s-toggle.on{background:var(--accent-tint);color:var(--accent-hi)}.status .s-toggle:hover{background:var(--bg-3)}.status .s-toggle.on:hover{background:var(--accent-tint)}.chip{display:inline-flex;align-items:center;gap:4px;padding:2px 6px;background:var(--bg-3);border:1px solid var(--border);border-radius:2px;font-size:10px;font-family:var(--font-mono);color:var(--text-dim)}.chip.accent{color:var(--accent-hi);border-color:var(--accent);background:var(--accent-tint)}.btn{padding:6px 12px;background:var(--bg-3);border:1px solid var(--border-strong);border-radius:3px;color:var(--text);font-family:var(--font-sans);font-size:11px;cursor:pointer}.btn:hover{background:var(--bg-4)}.btn.primary{background:var(--accent);border-color:var(--accent-lo);color:#fff}.btn.primary:hover{background:var(--accent-hi)}.btn.ghost{background:transparent}.browser{height:100%;overflow-y:auto;padding:40px 60px;background:var(--bg-0)}.browser h1{font-size:28px;font-weight:300;letter-spacing:-.01em;margin:0 0 4px}.browser h1 b{font-weight:600;color:var(--accent)}.browser .sub{color:var(--text-dim);font-size:13px;margin-bottom:32px}.browser-section-title{font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:var(--text-mute);margin:28px 0 10px;padding-bottom:6px;border-bottom:1px solid var(--border)}.project-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}.project-card{background:var(--bg-1);border:1px solid var(--border);border-radius:4px;overflow:hidden;cursor:pointer;transition:border-color var(--t-fast),transform var(--t-fast)}.project-card:hover{border-color:var(--accent);transform:translateY(-1px)}.project-card .thumb{aspect-ratio:4/3;background:var(--bg-2);position:relative;overflow:hidden}.project-card .meta{padding:10px 12px}.project-card .name{font-size:12px;font-weight:500;color:var(--text);margin-bottom:3px}.project-card .info{font-size:10px;color:var(--text-mute);font-family:var(--font-mono);display:flex;gap:10px}.project-card.new{display:flex;align-items:center;justify-content:center;aspect-ratio:auto;min-height:235px;border-style:dashed;color:var(--text-dim);text-align:center;flex-direction:column;gap:8px}.project-card.new:hover{color:var(--accent)}.overlay{position:absolute;inset:0;background:#0009;z-index:100;display:flex;align-items:center;justify-content:center}.dialog{background:var(--bg-1);border:1px solid var(--border-strong);border-radius:6px;box-shadow:var(--shadow);min-width:480px;max-width:640px}.dialog-header{padding:12px 16px;border-bottom:1px solid var(--border);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim);display:flex;justify-content:space-between;align-items:center}.dialog-body{padding:16px}.dialog-footer{padding:12px 16px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:8px}.section-view{height:100%;display:grid;grid-template-rows:1fr 1fr;gap:1px;background:var(--border)}.section-panel{background:var(--bg-0);position:relative;padding:12px}.section-panel-title{position:absolute;top:8px;left:12px;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-mute);font-family:var(--font-mono);z-index:2}.legend{padding:12px}.legend-scale{height:12px;border-radius:2px;margin:4px 0;border:1px solid var(--border)}.legend-ticks{display:flex;justify-content:space-between;font-family:var(--font-mono);font-size:10px;color:var(--text-dim)}.mono{font-family:var(--font-mono)}.dim{color:var(--text-dim)}.mute{color:var(--text-mute)}.hidden{display:none!important}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--bg-4);border-radius:5px;border:2px solid var(--bg-1)}::-webkit-scrollbar-thumb:hover{background:var(--border-strong)}.analysis-grid{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:1px;background:var(--border);height:100%}.analysis-cell{background:var(--bg-0);position:relative;overflow:hidden}.analysis-cell .label{position:absolute;top:10px;left:12px;z-index:2;background:#00000080;padding:4px 8px;border-radius:3px;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim);border:1px solid var(--border)}[data-theme=light] .analysis-cell .label{background:#ffffffbf}.export-view{padding:32px 48px;overflow-y:auto;height:100%;background:var(--bg-0)}.export-view h2{font-size:22px;font-weight:300;margin:0 0 4px}.export-cols{display:grid;grid-template-columns:1fr 320px;gap:24px;margin-top:24px}.export-format-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.export-format{padding:14px 12px;background:var(--bg-1);border:1px solid var(--border);border-radius:4px;cursor:pointer}.export-format:hover{border-color:var(--border-strong)}.export-format.selected{border-color:var(--accent);background:var(--accent-tint)}.export-format .fmt-name{font-weight:600;font-size:13px;letter-spacing:.05em}.export-format .fmt-desc{font-size:10px;color:var(--text-mute);margin-top:4px}.vol-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:16px}.vol-card{background:var(--bg-1);border:1px solid var(--border);border-left:3px solid var(--accent);padding:14px 16px;border-radius:3px}.vol-card .k{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-mute)}.vol-card .v{font-family:var(--font-mono);font-size:22px;font-weight:500;color:var(--text);margin-top:4px}.vol-card .u{font-size:11px;color:var(--text-dim);margin-left:4px}.vol-card.cut{border-left-color:#c9584a}.vol-card.fill{border-left-color:#6fa96b}.vol-card.net{border-left-color:var(--accent)}.tabstrip{display:flex;gap:2px;padding:8px 12px;background:var(--bg-1);border-bottom:1px solid var(--border)}.tabstrip button{background:transparent;border:1px solid transparent;color:var(--text-dim);padding:4px 10px;border-radius:3px;font-size:11px;cursor:pointer}.tabstrip button:hover{background:var(--bg-3);color:var(--text)}.tabstrip button.active{color:var(--accent);border-color:var(--accent);background:var(--accent-tint)}
