:root{--bg: #070b12;--panel: #0f1621;--panel-2: #131c2a;--border: #1e2a3c;--text: #e2e8f0;--muted: #8da2bd;--accent: #38bdf8;--accent-2: #22d3ee;--danger: #f87171;--ok: #4ade80;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:Inter,Segoe UI,system-ui,-apple-system,sans-serif;font-size:13px;overflow:hidden}button,select,input{font:inherit;color:inherit}button{background:var(--panel-2);border:1px solid var(--border);border-radius:7px;padding:5px 10px;cursor:pointer;transition:background .12s,border-color .12s,color .12s;white-space:nowrap}button:hover{background:#1b2637;border-color:#2c3d55}button:disabled{opacity:.4;cursor:not-allowed}button.active,button.accent{background:#38bdf829;border-color:var(--accent);color:#cbeeff}button.danger{color:var(--danger);border-color:#f8717159}button.danger:hover{background:#f871711f}select,input[type=text],input[type=number],.eng-input input{background:#0b1220;border:1px solid var(--border);border-radius:7px;padding:5px 8px;min-width:0}input[type=range]{accent-color:var(--accent);width:100%}input[type=checkbox]{accent-color:var(--accent)}kbd{margin-left:6px;padding:1px 4px;border-radius:4px;background:#ffffff12;font-size:10px;color:var(--muted)}.app{height:100%;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto}.app.no-scope{grid-template-rows:auto auto minmax(0,1fr)}.topbar{display:flex;align-items:center;gap:18px;padding:8px 14px;background:linear-gradient(180deg,#101a28,#0c1420);border-bottom:1px solid var(--border);flex-wrap:wrap}.brand{display:flex;align-items:center;gap:9px}.brand .logo{font-size:20px;color:var(--accent);filter:drop-shadow(0 0 8px rgba(56,189,248,.55))}.brand strong{display:block;letter-spacing:.3px}.brand small{color:var(--muted);font-size:10.5px}.group{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.group.transport button{min-width:84px}.slider{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:11.5px}.slider input[type=range]{width:96px}.slider em{font-style:normal;color:var(--text);min-width:46px}.file-button{position:relative;overflow:hidden;display:inline-block;background:var(--panel-2);border:1px solid var(--border);border-radius:7px;padding:5px 10px;cursor:pointer}.file-button input{position:absolute;inset:0;opacity:0;cursor:pointer}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 14px;background:var(--panel);border-bottom:1px solid var(--border);flex-wrap:wrap}.tools,.toggles{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.toggles label{display:flex;align-items:center;gap:5px;color:var(--muted)}.placing{color:var(--accent-2);font-size:11.5px}.workspace{display:grid;grid-template-columns:216px minmax(0,1fr) 296px;min-height:0}.app.no-palette .workspace{grid-template-columns:minmax(0,1fr) 296px}.palette{background:var(--panel);border-right:1px solid var(--border);overflow-y:auto;padding:10px}.palette h3{margin:10px 2px 6px;font-size:10.5px;text-transform:uppercase;letter-spacing:.09em;color:var(--muted)}.palette-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.palette-item{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 3px;background:var(--panel-2);border:1px solid var(--border);border-radius:9px}.palette-item span{font-size:9.5px;color:var(--muted);text-align:center;line-height:1.15;white-space:normal}.palette-item.active{border-color:var(--accent);background:#38bdf824}.palette-item.active span{color:#cbeeff}.center{display:grid;grid-template-rows:minmax(0,1fr) auto;min-width:0}.canvas-wrap{position:relative;min-height:0;overflow:hidden}.canvas-wrap canvas{display:block}.statusbar{display:flex;align-items:center;gap:16px;padding:5px 14px;background:var(--panel);border-top:1px solid var(--border);color:var(--muted);font-size:11.5px}.statusbar .spacer{flex:1}.statusbar .dot{width:8px;height:8px;border-radius:50%;background:var(--muted)}.statusbar.ok .dot{background:var(--ok);box-shadow:0 0 8px #4ade80b3}.statusbar.paused .dot{background:#facc15}.statusbar.error{color:#fca5a5}.statusbar.error .dot{background:var(--danger);box-shadow:0 0 8px #f87171b3}.inspector{background:var(--panel);border-left:1px solid var(--border);overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:12px}.inspector header{display:flex;flex-direction:column;gap:2px}.inspector header small{color:var(--muted)}.label-input{background:transparent;border:none;border-bottom:1px solid var(--border);font-size:15px;font-weight:600;padding:2px 0;width:100%}.label-input:focus{outline:none;border-color:var(--accent)}.readouts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.readout{background:var(--panel-2);border:1px solid var(--border);border-radius:8px;padding:6px 7px;min-width:0}.readout span{display:block;font-size:10px;color:var(--muted)}.readout strong{font-size:12.5px;font-variant-numeric:tabular-nums;word-break:break-word}.fields{display:flex;flex-direction:column;gap:9px}.field{display:flex;flex-direction:column;gap:4px}.field>span{color:var(--muted);font-size:11px;display:flex;justify-content:space-between}.field>span em{font-style:normal;color:var(--text)}.field.checkbox{flex-direction:row;align-items:center;gap:7px}.eng-input{display:flex;align-items:center;gap:6px}.eng-input input{flex:1;font-variant-numeric:tabular-nums}.eng-input .unit{color:var(--muted);min-width:20px}.inspector .row{display:flex;gap:6px;flex-wrap:wrap}.hint{color:var(--muted);font-size:11px;line-height:1.45;margin:0}.warnings{margin:0;padding-left:16px;color:#fcd34d;font-size:11px;line-height:1.4}.scope{border-top:1px solid var(--border);background:var(--panel);display:grid;grid-template-rows:auto 210px}.scope-controls{display:flex;align-items:center;gap:14px;padding:6px 14px;border-bottom:1px solid var(--border);flex-wrap:wrap}.scope-controls label{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:11.5px}.scope-controls label em{font-style:normal;color:var(--text);min-width:56px}.scope-controls input[type=range]{width:110px}.scope-controls input[type=number]{width:74px}.scope-body{display:grid;grid-template-columns:minmax(0,1fr) 230px;min-height:0}.scope-canvas{position:relative;min-height:0;overflow:hidden}.scope-canvas canvas{display:block}.scope-legend{border-left:1px solid var(--border);padding:8px 10px;overflow-y:auto;display:flex;flex-direction:column;gap:8px}.channel{background:var(--panel-2);border:1px solid var(--border);border-radius:8px;padding:6px 8px}.channel-head{display:flex;align-items:center;gap:6px}.channel-head strong{flex:1;font-size:11.5px}.channel-head button{padding:0 6px;line-height:1.5}.channel .dot{width:9px;height:9px;border-radius:50%}.channel dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;margin:6px 0 0}.channel dl div{min-width:0}.channel dt{font-size:9.5px;color:var(--muted)}.channel dd{margin:0;font-size:11px;font-variant-numeric:tabular-nums;word-break:break-word}@media (max-width: 1200px){.workspace{grid-template-columns:190px minmax(0,1fr) 250px}.app.no-palette .workspace{grid-template-columns:minmax(0,1fr) 250px}}@media (max-width: 900px){body{font-size:12.5px}.workspace,.app.no-palette .workspace{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto}.palette{border-right:none;border-bottom:1px solid var(--border);max-height:122px;display:flex;gap:14px;padding:8px 10px}.palette section{min-width:max-content}.palette-grid{grid-template-columns:repeat(auto-fill,62px);grid-auto-flow:column;grid-template-rows:auto}.palette-item{width:62px}.inspector{border-left:none;border-top:1px solid var(--border);max-height:38vh}.scope{grid-template-rows:auto 168px}.scope-body{grid-template-columns:minmax(0,1fr) 158px}.topbar{gap:10px;padding:7px 10px}.brand small{display:none}}