.ss-stage { --ss-gold: #f4b728; --ss-light: #ffdb74; --ss-dim: #7b632d; position: relative; width: 100%; isolation: isolate; background: #050505; }
.ss-stage .ss-svg { display: block; width: 100%; height: auto; overflow: hidden; }
.ss-stage text { font-family: Mono, 'Mona Mono', 'Mona Sans Mono', Consolas, monospace; font-size: 11px; font-weight: 400; letter-spacing: .6px; fill: #8b897f; }
.ss-stage .ss-top-label { fill: var(--ss-light); }
.ss-stage .ss-header-rule { stroke: #332a16; stroke-width: 1; }
.ss-stage .ss-grid { stroke: #282214; stroke-width: .5; }
.ss-stage .ss-board-frame { stroke: var(--ss-gold); stroke-width: 1.5; }
.ss-stage .ss-flow-legend text { fill: #a18b52; font-size: 11px; letter-spacing: .5px; }
.ss-stage .ss-legend-in { fill: var(--ss-light); }
.ss-stage .ss-legend-out { stroke: var(--ss-light); stroke-width: 1; }
.ss-stage .ss-legend-link { stroke: var(--ss-dim); stroke-width: .8; }
.ss-stage .ss-scan-ruler { stroke: #5a4821; stroke-width: .7; }
.ss-stage .ss-ruler-spine { opacity: .45; }
.ss-stage .ss-scan-marker path:first-child { fill: var(--ss-gold); }
.ss-stage .ss-scan-marker path:last-child { stroke: var(--ss-light); stroke-width: 1.3; }
.ss-stage .ss-peripheral-traces { stroke: #483a1c; stroke-width: .7; }
.ss-stage .ss-main-lane { stroke: var(--ss-dim); stroke-width: 1.2; }
.ss-stage .ss-companion-lane { stroke: #302915; stroke-width: .7; }
.ss-stage .ss-vias { fill: var(--ss-gold); opacity: .6; }
.ss-stage .ss-rail-pixel { fill: var(--ss-gold); }
.ss-stage .ss-node { fill: #080806; stroke: var(--ss-dim); stroke-width: 1; }
.ss-stage .ss-node-inner { stroke: #3f3319; stroke-width: .7; }
.ss-stage .ss-node-bit { fill: var(--ss-gold); stroke: none; }
.ss-stage .ss-node-label { stroke: none; font-size: 11px; fill: #8a7b54; }
.ss-stage .ss-chip-pins { stroke: var(--ss-dim); stroke-width: 2; }
.ss-stage .ss-core-outer { fill: #080806; stroke: var(--ss-dim); stroke-width: 1; }
.ss-stage .ss-core-middle { stroke: #4c3e1e; stroke-width: 1; }
.ss-stage .ss-core-inner { stroke: var(--ss-gold); stroke-width: 1.3; }
.ss-stage .ss-core-corners { stroke: var(--ss-gold); stroke-width: 2; }
.ss-stage .ss-core-base { fill: #050505; }
.ss-stage .ss-core-label { fill: var(--ss-dim); font-size: 11px; letter-spacing: 1px; }
.ss-stage .ss-lock-shackle { stroke: var(--ss-gold); stroke-width: 5; stroke-linejoin: bevel; }
.ss-stage .ss-lock-body { fill: var(--ss-gold); }
.ss-stage .ss-lock-hole { fill: #050505; }
.ss-stage .ss-core-state { fill: var(--ss-light); font-size: 11px; letter-spacing: 2px; }
.ss-stage .ss-core-crosshair { stroke: var(--ss-gold); stroke-width: 1; }
.ss-stage .ss-packet rect { fill: var(--ss-light); }
.ss-stage .ss-packet-out rect { fill: #050505; stroke: var(--ss-light); stroke-width: 1; }
.ss-stage .ss-packet path { stroke: var(--ss-gold); stroke-width: 1; }
.ss-stage .ss-scan-line { stroke: var(--ss-gold); stroke-width: .5; opacity: .22; }
.ss-stage .ss-scan-hot { stroke: var(--ss-light); stroke-width: 1.5; opacity: .32; }
.ss-stage .ss-small-circuit { stroke: var(--ss-dim); stroke-width: .8; }
.ss-stage .ss-footer-label, .ss-stage .ss-mode-label { font-size: 11px; letter-spacing: .4px; }
.ss-stage[data-mode="open"] .ss-out-lane, .ss-stage[data-mode="open"] .ss-core-middle { stroke: var(--ss-gold); }
.ss-stage .ss-action { display: flex; justify-content: space-between; align-items: center; width: 150px; position: absolute; bottom: 0; right: 32px; padding: 10px 0 3px; color: var(--ss-gold); background: transparent; border: 0; border-top: 1px solid #4c3e1e; border-radius: 0; font: 11px/1.5 Mono, 'Mona Mono', 'Mona Sans Mono', Consolas, monospace; letter-spacing: .7px; cursor: pointer; }
.ss-stage .ss-action:hover { color: var(--ss-light); border-color: var(--ss-gold); }
.ss-stage .ss-action:focus-visible { outline: 1px solid var(--ss-gold); outline-offset: 5px; }
@media (max-width: 600px) { .ss-stage .ss-action { right: 5%; bottom: -7px; } }
