:root{--bg:var(--sim-bg);--panel:var(--sim-panel);--line:var(--sim-line);--text:var(--sim-text);--muted:var(--sim-muted);--dim:var(--sim-dim);--cyan:var(--sim-action);--green:var(--sim-green);--amber:var(--sim-value);--red:var(--sim-red);--font:var(--sim-font);--mono:var(--sim-mono)}

.field textarea{width:100%;padding:8px;border:1px solid rgba(148,163,184,.12);border-radius:7px;outline:0;resize:vertical;color:var(--text);background:rgba(10,15,26,.5);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font:10px/1.5 var(--mono);transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}
.field textarea:focus{border-color:#4fd0e6;box-shadow:0 0 0 3px rgba(34,211,238,.08)}
.node-head{touch-action:none}
.node.dragging{z-index:20;cursor:grabbing;will-change:transform;box-shadow:0 28px 60px rgba(0,0,0,.3),0 0 0 2px color-mix(in srgb,var(--node-color),transparent 55%),inset 0 1px rgba(255,255,255,.05);transform:scale(1.02) translateY(-2px)}
.node.dragging .node-head{cursor:grabbing}
.family{margin-bottom:5px;border:1px solid transparent;border-radius:9px;overflow:hidden}
.family.open{border-color:rgba(148,163,184,.12);background:rgba(10,16,26,.5);backdrop-filter:blur(6px)}
.family-head{display:flex;align-items:center;justify-content:space-between;width:100%;padding:9px 8px;border:0;background:transparent;color:var(--muted);font:600 9px var(--mono);letter-spacing:.06em;text-align:left;transition:background .18s ease}
.family-head:hover{color:var(--text);background:rgba(22,32,52,.5)}
.family-head>span:first-child{display:flex;align-items:center;gap:8px}
.family-head i{width:7px;height:7px;border-radius:50%;background:var(--block-color);box-shadow:0 0 9px color-mix(in srgb,var(--block-color),transparent 40%)}
.family-meta{display:flex;align-items:center;gap:8px}.family-meta b{display:grid;place-items:center;min-width:19px;height:17px;padding:0 5px;border-radius:8px;background:#1b2638;color:var(--dim);font-size:8px}.family-meta em{font-style:normal;font-size:15px;transition:transform .18s}.family.open .family-meta em{transform:rotate(90deg)}
.family-body{display:none;padding:0 4px 5px}.family.open .family-body{display:block}
.family .library-item{margin-bottom:2px;padding-left:10px}
#connections{pointer-events:none}.connection{pointer-events:stroke;cursor:pointer;stroke-width:2.5;filter:drop-shadow(0 1px 2px rgba(0,0,0,.2))}.connection:hover{stroke:var(--red)!important;stroke-width:4}
.connection.type-bits{stroke:rgba(167,139,250,.5)}.connection.type-real{stroke:rgba(96,165,250,.5)}.connection.type-complex{stroke:rgba(245,158,11,.5)}.connection.type-any{stroke:rgba(148,163,184,.4)}
.connection.active.type-bits{stroke:#a78bfa;filter:drop-shadow(0 0 4px rgba(167,139,250,.4))}
.connection.active.type-real{stroke:#60a5fa;filter:drop-shadow(0 0 4px rgba(96,165,250,.4))}
.connection.active.type-complex{stroke:#f59e0b;filter:drop-shadow(0 0 4px rgba(245,158,11,.4))}
.port{border-color:var(--port-color)!important}.port.connected,.port:hover{background:var(--port-color)!important;box-shadow:0 0 10px color-mix(in srgb,var(--port-color),transparent 25%)!important}
.toolbar button:disabled{opacity:.3;cursor:not-allowed}
.node.auto-layout{transition:left .34s cubic-bezier(.2,.8,.2,1),top .34s cubic-bezier(.2,.8,.2,1)}
#workspace{cursor:grab;touch-action:none}#workspace.panning{cursor:grabbing}#workspace.panning .node{pointer-events:none}#nodes{will-change:transform}.canvas-hud span{min-width:42px;padding:0;text-align:center}.canvas-hud button{min-width:28px}
#template-menu{max-height:min(76vh,620px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#344158 transparent}
.sample-rate{display:flex;align-items:center;gap:5px;padding:5px 8px;border:1px solid rgba(148,163,184,.12);border-radius:8px;background:rgba(26,34,50,.5);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--dim);font:9px var(--mono);transition:background .18s ease,box-shadow .18s ease}
.sample-rate input{width:76px;border:0;outline:0;background:transparent;color:var(--cyan);font:10px var(--mono);text-align:right}
.sample-rate small{font-size:8px}
.result-card canvas[data-result]{cursor:grab;touch-action:none}
.result-card canvas.plot-panning{cursor:grabbing}
.plot-help{display:block;padding:4px 9px 6px;border-top:1px solid rgba(148,163,184,.08);color:var(--dim);font:8px var(--mono);text-align:center}
.plot-head{height:30px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(148,163,184,.08)}
.plot-head h3{height:auto!important;padding:0 10px!important;border:0!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.plot-head>div{display:flex;gap:3px;padding-right:5px}
.plot-head button{min-width:23px;padding:2px 5px;border:1px solid rgba(148,163,184,.12);border-radius:4px;background:rgba(26,34,50,.5);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);color:var(--muted);font:8px var(--mono);transition:background .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease;box-shadow:0 1px 3px rgba(0,0,0,.1)}
.plot-head button:hover{color:var(--cyan);border-color:rgba(103,232,249,.25);background:rgba(30,42,58,.6);transform:translateY(-1px);box-shadow:0 3px 8px rgba(0,0,0,.12)}
.plot-modal{position:fixed;z-index:100;inset:0;display:grid;place-items:center;padding:4vh 4vw;background:rgba(2,5,12,.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.plot-modal[hidden]{display:none}
.plot-modal-dialog{display:grid;grid-template-rows:46px minmax(0,1fr) 28px;width:min(1120px,92vw);height:min(760px,88vh);overflow:hidden;border:1px solid rgba(148,163,184,.12);border-top-color:rgba(255,255,255,.08);border-radius:14px;background:rgba(12,18,32,.82);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);box-shadow:0 36px 100px rgba(0,0,0,.4),0 12px 36px rgba(0,0,0,.25),inset 0 1px rgba(255,255,255,.04)}
.plot-modal-head{display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid rgba(148,163,184,.08)}
.plot-modal-head h2{font-size:13px}
.plot-modal-head button{display:grid;place-items:center;width:30px;height:30px;border:1px solid rgba(148,163,184,.12);border-radius:7px;background:rgba(26,34,50,.5);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--muted);font-size:20px;transition:background .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease;box-shadow:0 2px 6px rgba(0,0,0,.12)}
.plot-modal-head button:hover{color:var(--red);border-color:rgba(251,113,133,.3);background:rgba(30,42,56,.6);transform:translateY(-1px);box-shadow:0 3px 10px rgba(0,0,0,.15)}
#plot-modal-canvas{display:block;width:100%;height:100%;min-height:0;cursor:grab;touch-action:none}
#plot-modal-canvas.plot-panning{cursor:grabbing}
.plot-modal-dialog>small{display:grid;place-items:center;border-top:1px solid rgba(148,163,184,.08);color:var(--dim);font:8px var(--mono)}
#app{grid-template-rows:58px minmax(0,1fr) var(--results-height,260px)}
#results-panel{position:relative}
#results-resizer{position:absolute;z-index:12;top:-5px;left:0;width:100%;height:10px;cursor:ns-resize;background:transparent}
#results-resizer:hover,#results-panel.resizing #results-resizer{background:linear-gradient(transparent 4px,var(--cyan) 4px,var(--cyan) 6px,transparent 6px)}
.results-actions{display:flex;align-items:center;gap:8px}
#results-toggle{display:grid;place-items:center;width:25px;height:25px;border:1px solid rgba(148,163,184,.12);border-radius:6px;background:rgba(26,34,50,.5);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--muted);font-size:15px;transition:transform .18s,background .18s ease,border-color .18s ease}
#results-toggle:hover{color:var(--cyan);border-color:rgba(103,232,249,.25)}
#results-panel.collapsed #results{display:none}
#results-panel.collapsed #results-toggle{transform:rotate(180deg)}
/* Categorized examples menu */
#template-menu{width:min(680px,calc(100vw - 24px));max-height:calc(100vh - 70px);overflow:auto;padding:12px;columns:2;column-gap:14px;scrollbar-width:thin}
#template-menu[hidden]{display:none}
.template-category{min-width:0;break-inside:avoid;margin-bottom:14px;padding:8px;border:1px solid rgba(148,163,184,.08);border-top-color:rgba(255,255,255,.06);border-radius:9px;background:rgba(8,12,20,.5);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 2px 8px rgba(0,0,0,.12)}
.template-category h3{display:flex;align-items:center;justify-content:space-between;margin:2px 5px 6px;color:var(--cyan);font:600 9px var(--mono);letter-spacing:.09em;text-transform:uppercase}
.template-category h3 span{padding:2px 5px;border-radius:99px;color:var(--dim);background:rgba(10,16,26,.5);backdrop-filter:blur(6px)}
.template-category small{line-height:1.35}
@media(max-width:720px){#template-menu{right:12px;columns:1}}
/* ===== SATELLITE GLASS ===== */
.satellite-modal{position:fixed;z-index:110;inset:0;display:grid;place-items:center;padding:3vh 3vw;background:rgba(2,5,13,.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.satellite-modal[hidden]{display:none}
.satellite-dialog{display:grid;grid-template:58px minmax(0,1fr)/260px minmax(0,1fr);width:min(1380px,95vw);height:min(850px,92vh);overflow:hidden;border:1px solid rgba(148,163,184,.12);border-top-color:rgba(255,255,255,.08);border-radius:16px;background:rgba(12,18,32,.8);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 40px 120px rgba(0,0,0,.4),0 14px 40px rgba(0,0,0,.25),inset 0 1px rgba(255,255,255,.04)}
.satellite-head{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;padding:0 16px;border-bottom:1px solid rgba(148,163,184,.08);background:rgba(10,17,29,.6);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.satellite-head span{color:var(--cyan);font:600 8px var(--mono);letter-spacing:.15em}
.satellite-head h2{margin-top:3px;font-size:14px}
.satellite-head button{display:grid;place-items:center;width:32px;height:32px;border:1px solid rgba(148,163,184,.12);border-radius:8px;background:rgba(26,34,50,.5);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--muted);font-size:21px;transition:background .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease;box-shadow:0 2px 6px rgba(0,0,0,.12)}
.satellite-head button:hover{color:var(--red);border-color:rgba(251,113,133,.3);background:rgba(30,42,56,.6);transform:translateY(-1px);box-shadow:0 3px 10px rgba(0,0,0,.15)}
.satellite-controls{min-height:0;overflow:auto;padding:16px;border-right:1px solid rgba(148,163,184,.08);background:rgba(11,18,30,.5);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.satellite-controls>label{position:relative;display:block;margin-bottom:15px;color:var(--muted);font-size:10px}
.satellite-controls select,.satellite-controls input[type=number]{width:100%;margin-top:6px;padding:8px;border:1px solid rgba(148,163,184,.12);border-radius:8px;outline:0;color:var(--text);background:rgba(10,15,26,.5);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font:10px var(--mono);transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}
.satellite-controls input[type=range]{width:100%;margin-top:12px}
.satellite-controls label small{position:absolute;right:9px;bottom:9px;color:var(--dim);font:8px var(--mono)}
.satellite-controls output{display:block;margin-top:5px;color:var(--cyan);font:10px var(--mono);text-align:right}
.satellite-time{display:grid;grid-template-columns:1fr auto auto;gap:6px;margin-bottom:14px}
.satellite-time button,.satellite-time select{padding:7px;border:1px solid rgba(148,163,184,.12);border-radius:7px;background:rgba(26,34,50,.5);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--muted);font-size:9px;transition:background .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease;box-shadow:0 1px 4px rgba(0,0,0,.1)}
.satellite-controls>p{margin-bottom:14px;color:var(--dim);font-size:9px;line-height:1.5}
.satellite-stats{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.satellite-stat{padding:9px 7px;border:1px solid rgba(148,163,184,.08);border-radius:8px;background:rgba(10,15,26,.4);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);box-shadow:0 2px 6px rgba(0,0,0,.1)}
.satellite-stat span{display:block;color:var(--dim);font:7px var(--mono);letter-spacing:.08em}
.satellite-stat strong{display:block;margin-top:5px;color:var(--cyan);font:600 11px var(--mono)}
.satellite-stat.wide{grid-column:1/-1}
.satellite-stat.visible strong{color:var(--green)}
.satellite-stat.hidden strong{color:var(--red)}
.satellite-source{margin-top:12px;padding:8px;border:1px dashed rgba(148,163,184,.12);border-radius:7px;color:var(--dim);font:8px/1.45 var(--mono);background:rgba(10,15,26,.25);backdrop-filter:blur(6px)}
.satellite-map-wrap{position:relative;min-width:0;min-height:0;overflow:hidden;background:#050b13}
.satellite-map-wrap canvas{display:block;width:100%;height:100%;cursor:crosshair}
.satellite-legend{position:absolute;left:12px;bottom:12px;display:flex;gap:12px;padding:7px 9px;border:1px solid rgba(148,163,184,.1);border-radius:8px;background:rgba(7,16,28,.65);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:var(--muted);font:8px var(--mono);pointer-events:none;box-shadow:0 2px 10px rgba(0,0,0,.2)}
.satellite-legend span{display:flex;align-items:center;gap:5px}
.satellite-legend i{width:16px;height:2px;background:var(--green)}
.satellite-legend i.hidden{background:var(--red)}
.satellite-legend i.orbit{background:var(--cyan)}
@media(max-width:760px){.satellite-dialog{grid-template:54px 220px minmax(300px,1fr)/1fr}.satellite-controls{border-right:0;border-bottom:1px solid rgba(148,163,184,.08)}.satellite-stats{grid-template-columns:repeat(4,1fr)}.satellite-stat.wide{grid-column:auto}.satellite-legend{flex-wrap:wrap}}

/* ===== LIGHT THEME OVERRIDES (extra.css) ===== */
:root[data-theme="light"] .family{border-color:transparent;border-radius:9px;overflow:hidden;background:transparent}
:root[data-theme="light"] .family.open{border-color:rgba(0,0,0,.08);background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
:root[data-theme="light"] .family-head{color:var(--dim);background:transparent}
:root[data-theme="light"] .family-head:hover{color:var(--text);background:#f1f5f9}
:root[data-theme="light"] .family-head>span:first-child{display:flex;align-items:center;gap:8px}
:root[data-theme="light"] .family-head i{width:7px;height:7px;border-radius:50%;background:var(--block-color)}
:root[data-theme="light"] .family-meta{display:flex;align-items:center;gap:8px}
:root[data-theme="light"] .family-meta b{display:grid;place-items:center;min-width:19px;height:17px;padding:0 5px;border-radius:8px;background:#e2e8f0;color:#64748b;font-size:8px}
:root[data-theme="light"] .family-meta em{font-style:normal;font-size:15px;color:#94a3b8}
:root[data-theme="light"] .family.open .family-meta em{transform:rotate(90deg)}
:root[data-theme="light"] .family-body{display:none;padding:0 4px 5px}
:root[data-theme="light"] .family.open .family-body{display:block}
:root[data-theme="light"] .family .library-item{margin-bottom:2px;padding-left:10px}
:root[data-theme="light"] .sample-rate{background:#ffffff;border-color:var(--line);backdrop-filter:none;-webkit-backdrop-filter:none;color:var(--dim)}
:root[data-theme="light"] .sample-rate input{color:var(--cyan)}