/* Extracted from Signal Studio systems-dark.css by tools/ingest-signal.mjs.
   The dark re-skin of the process instrument, plus the token block it reads.
   Page chrome (.sys-*) is dropped: the site supplies its own.
   Applied by putting class="sys-dark" on the frame element. */
never layout. */
.sys-dark .in-host{max-width:520px;color:var(--text-primary)}
.sys-dark .in-host *,.sys-dark .in-host *:before,.sys-dark .in-host *:after{transition-property:opacity,transform!important}
.sys-dark .instrument{padding:12px;border-radius:18px;background:var(--surface-shell);border:1px solid var(--border-1);box-shadow:0 2px 4px #0006,0 20px 40px -20px #000a,inset 0 1px 0 #ffffff04}
.sys-dark .in-head{padding:5px 10px 15px;min-height:43px}
.sys-dark .in-head h3{color:var(--text-primary);font-size:15px!important;letter-spacing:-.025em!important}
.sys-dark .in-step-count{background:var(--surface-2);color:var(--text-secondary);font-size:11px;border:1px solid #ffffff04}
.sys-dark .in-surface{background:var(--surface-canvas);border:1px solid #242424;border-radius:10px;padding:18px 18px 14px}
.sys-dark .in-stage{padding-bottom:12px!important}
.sys-dark .in-stage:last-child{padding-bottom:0!important}
.sys-dark .in-artifact{grid-template-rows:1fr;transition:none!important}
.sys-dark .in-artifact-clip{overflow:hidden}
.sys-dark .in-stage-content{position:relative}
.sys-dark .in-stage:not(.is-revealed) .in-description{position:absolute!important;inset:6px 0 auto!important;margin:0!important;width:auto!important;height:auto!important;white-space:normal!important;clip-path:none!important;color:var(--text-secondary)!important;font-size:12px!important;line-height:1.6!important;pointer-events:none;max-width:34ch!important}
.sys-dark .in-stage:not(.is-revealed) .in-artifact{visibility:hidden}
.sys-dark .in-stage-button{min-height:28px;scroll-margin-block:90px 110px}
.sys-dark .in-stage-button strong{font-size:14px;color:var(--text-secondary)}
.sys-dark .in-stage-icon{color:#999;background:#202020;border:1px solid #303030;box-shadow:none;border-radius:6px}
.sys-dark .is-current .in-stage-icon{color:#fff;background:var(--step-color);border-color:#ffffff20;box-shadow:0 0 0 3px var(--step-tint)}
.sys-dark .is-current .in-stage-button strong{color:var(--text-primary)}
.sys-dark .is-done .in-stage-button strong{color:#ccc}
.sys-dark .in-stage-state{color:var(--text-secondary)}
.sys-dark .in-rail{background:#2b2b2b}
.sys-dark .is-done>.in-rail i{background:#555;opacity:1}
.sys-dark .is-current>.in-rail i{opacity:1}
.sys-dark .in-result{color:#d0d0d0;transition:opacity 260ms cubic-bezier(.22,1,.36,1),transform 280ms cubic-bezier(.22,1,.36,1)}
.sys-dark .is-done .in-result{opacity:.8}
.sys-dark .in-document{background:#171717;box-shadow:inset 0 0 0 1px #ffffff0d;border-radius:6px;padding:10px}
.sys-dark .in-file{background:#222;color:#d4a077;box-shadow:0 1px 2px #0005;border:1px solid #333}
.sys-dark .in-document strong{font-size:12px;color:var(--text-primary)}
.sys-dark .in-document>div>span,.sys-dark .in-paper-lines i{color:var(--text-secondary);font-size:11px}
.sys-dark .in-document-corner{background:var(--surface-canvas);box-shadow:0 1px 1px #ffffff12}
.sys-dark .in-visual.document{min-height:87px}
.sys-dark .in-token-label{font-size:11px;color:var(--text-secondary)}
.sys-dark .in-tokens span{background:#221d30;border-color:#373040;color:#c9b8ed;font-size:11px;padding:4px 7px}
.sys-dark .in-visual.tokens{min-height:58px}
.sys-dark .in-check{font-size:11px;color:#c4c4c4;line-height:1.5}
.sys-dark .in-check b{font-size:10px;color:var(--text-secondary)}
.sys-dark .in-check .in-icon{color:var(--warning-text)}
.sys-dark .in-check.ok .in-icon{color:var(--success-text)}
.sys-dark .in-check.blocked .in-icon{color:var(--warning-text)}
.sys-dark .in-visual.checks{min-height:84px}
.sys-dark .in-record{border-color:var(--border-2)}
.sys-dark .in-record>div{font-size:11px;line-height:1.5}
.sys-dark .in-record>div>span{color:var(--text-secondary)}
.sys-dark .in-result code{font-size:11px!important;color:#c9c9c9}
.sys-dark .in-visual.record{min-height:74px}
.sys-dark .in-diff-label{font-size:11px;color:var(--text-secondary)}
.sys-dark .in-diff-values{font-size:12px;gap:8px}
.sys-dark .in-before{color:#cf99a8;text-decoration-color:#865462}
.sys-dark .in-after{color:#8dd8b5;background:#13251c}
.sys-dark .in-preserve{font-size:10px;color:var(--text-secondary)}
.sys-dark .in-visual.diff{min-height:82px}
.sys-dark .is-current .in-after{animation-name:in-record-arrive}
.sys-dark .in-queue-item{font-size:11px;line-height:1.5;color:#c7c7c7}
.sys-dark .in-queue-item b{background:#202020;color:var(--text-secondary);font-size:10px}
.sys-dark .in-queue-item.sent .in-icon{color:var(--success-text)}
.sys-dark .in-queue-item.cancelled{color:var(--text-secondary)}
.sys-dark .in-queue-item .in-icon,.sys-dark .in-queue-item.cancelled .in-icon{color:var(--warning-text)}
.sys-dark .in-visual.queue{min-height:80px}
.sys-dark .in-slots span{background:#171717;border-color:#343434;color:#b3b3b3;font-size:11px;min-height:29px}
.sys-dark .in-slots .chosen{background:#261f39;border-color:#6b5492;color:#d5befd}
.sys-dark .in-slots .unavailable{color:#9a9a9a}
.sys-dark .in-anchor>div:not(.in-anchor-wire){background:#181818;border-color:#323232;padding:8px}
.sys-dark .in-anchor span{color:var(--text-secondary);font-size:11px}
.sys-dark .in-anchor strong{color:#d0d0d0;font-size:11px}
.sys-dark .in-anchor-wire .in-icon{background:var(--surface-canvas)}
.sys-dark .in-anchor.matched .in-anchor-wire{color:#b499e8}
.sys-dark .in-anchor-wire{color:var(--warning-text)}
.sys-dark .in-visual.anchor{min-height:82px}
.sys-dark .in-person>span{background:#24202d;border-color:#35303f;color:#c5b4df;box-shadow:0 1px 3px #0006}
.sys-dark .in-person strong,.sys-dark .in-handoff-path small,.sys-dark .in-handoff-path em{color:#b7b1bf;font-size:11px}
.sys-dark .in-handoff-path>i{background:#3c344a}
.sys-dark .in-handoff-path b{background:#b99bdd;border-color:#1b1622}
.sys-dark .in-visual.handoff{min-height:90px}
.sys-dark .in-layers>div{font-size:11px;color:#ccc}
.sys-dark .in-layers b{font-size:10px;color:var(--text-secondary)}
.sys-dark .in-layers .updated i{background:var(--success-text)}
.sys-dark .in-layers .conflict i{background:var(--warning-text)}
.sys-dark .in-visual.layers{min-height:80px}
.sys-dark .in-merge-labels span{color:#b9b1c5;font-size:11px}
.sys-dark .in-merge-bar i{background:#5878b5}
.sys-dark .in-merge-bar i.override{background:#9874b7}
.sys-dark .in-merge-bar i.new{background:#559a7d}
.sys-dark .in-visual.merge{min-height:62px}
.sys-dark .in-receipt{background:#101e17;border-color:#253b2e;border-radius:6px;padding:10px}
.sys-dark .in-receipt>.in-icon{color:var(--success-text)}
.sys-dark .in-receipt strong{font-size:12px;color:#d2eadc}
.sys-dark .in-receipt span{color:#a6bbae;font-size:11px!important}
.sys-dark .in-receipt code{color:#a3afa7;font-size:9px!important;line-height:1.5!important}
.sys-dark .in-receipt.is-held{background:#231b0f;border-color:#46371f}
.sys-dark .in-receipt.is-held>.in-icon{color:var(--warning-text)}
.sys-dark .in-receipt.is-held strong{color:#e9cb99}
.sys-dark .in-receipt.is-held span{color:#c5ae8a}
.sys-dark .in-visual.receipt{min-height:94px}
.sys-dark .in-stream{color:#c8c8c8;border-color:#3b3b3b;font-size:12px}
.sys-dark .is-current .in-stream{animation-name:in-token-arrive}
.sys-dark .in-visual.stream{min-height:92px}
.sys-dark .in-footer{background:var(--surface-shell)!important;border-radius:0 0 9px 9px;box-shadow:0 -8px 10px -6px var(--surface-shell)!important;padding-top:12px;padding-bottom:1px;bottom:max(12px,env(safe-area-inset-bottom));min-height:59px}
.sys-dark .in-status{color:var(--text-secondary);font-size:11px;font-weight:400}
.sys-dark .in-status>i{background:#9dc6af;box-shadow:0 0 0 3px #9dc6af09}
.sys-dark .is-warning .in-status>i{background:var(--warning-text)}
.sys-dark .in-status>span{max-width:195px}
.sys-dark .in-controls{gap:4px}
.sys-dark .in-controls button{min-height:36px;border-radius:7px;transition:transform 140ms ease}
.sys-dark .in-run{background:var(--text-primary);color:#111;font-size:13px!important;min-width:90px;padding:8px 12px;box-shadow:0 1px 2px #0005;font-weight:500}
.sys-dark .in-run>.in-icon{width:13px;height:13px}
.sys-dark .in-speed,.sys-dark .in-reset{color:#b5b5b5;background:transparent;min-width:30px;font-size:11px!important}
.sys-dark .in-scenario-switch{background:transparent;border:1px solid var(--border-1);border-radius:8px;box-shadow:none;margin-bottom:18px;padding:3px}
.sys-dark .in-scenario-switch button{font-size:12px;min-height:33px;padding-inline:12px;color:var(--text-secondary);border-radius:5px}
.sys-dark .in-scenario-switch button[aria-pressed=true]{background:#242424;color:var(--text-primary);box-shadow:0 1px 3px #0004}
.sys-dark .in-outcome{margin-top:25px;padding-inline:10px}
.sys-dark .in-outcome-label{font-size:11px;color:var(--text-secondary)}
.sys-dark .in-outcome p{font-size:13px!important;line-height:1.7!important;color:#c5c5c5!important}
.sys-dark .in-provenance{font-size:11px!important;color:var(--text-secondary)!important;line-height:1.7!important;margin:16px 10px 0!important}
.sys-dark .in-host button:active{transform:scale(.97)}
@keyframes sys-breathe{0%,100%{opacity:.45}50%{opacity:1}}
@media(hover:hover) and (pointer:fine){.sys-dark .in-controls .in-run:hover{background:#fff;color:#000}
.sys-dark .in-controls .in-reset:hover,.sys-dark .in-controls .in-speed:hover{background:#252525;color:#fff}
.sys-dark .in-stage-button:hover strong{color:#fff}
.sys-dark .in-stage-button:hover .in-stage-icon{border-color:#777;box-shadow:none}
.sys-dark .in-scenario-switch button:not([aria-pressed=true]):hover{color:#fff;background:#1b1b1b}}
@media(max-width:850px){.sys-dark .in-host{max-width:none}}
@media(max-width:600px){.sys-dark .instrument{padding:9px;border-radius:14px}
.sys-dark .in-surface{padding:14px 12px;border-radius:8px}
.sys-dark .in-stage{padding-left:29px;padding-bottom:14px!important}
.sys-dark .in-stage-icon{left:-29px;width:24px;height:24px}
.sys-dark .in-stage-button{min-height:28px}
.sys-dark .in-stage-button:after{content:'';position:absolute;inset:-8px 0;min-height:44px}
.sys-dark .in-stage-button strong{font-size:13px}
.sys-dark .in-rail{left:11px;top:25px}
.sys-dark .in-head{padding-inline:6px;min-height:41px}
.sys-dark .in-head h3{font-size:14px!important}
.sys-dark .in-scenario-switch{max-width:100%;width:100%}
.sys-dark .in-scenario-switch button{min-height:44px;font-size:11px;padding-inline:8px;flex:1}
.sys-dark .in-controls button{min-height:44px;min-width:44px}
.sys-dark .in-run{min-width:83px!important;font-size:12px!important;padding-inline:9px}
.sys-dark .in-footer{padding-inline:0;gap:4px;bottom:max(8px,env(safe-area-inset-bottom));min-height:61px}
.sys-dark .in-status{font-size:10px;gap:5px}
.sys-dark .in-status>span{max-width:124px}
.sys-dark .in-status>i{width:4px;height:4px}
.sys-dark .in-controls{gap:0}
.sys-dark .in-speed{display:none!important}
.sys-dark .in-visual.document{min-height:112px}
.sys-dark .in-visual.tokens{min-height:102px}
.sys-dark .in-visual.checks,.sys-dark .in-visual.record,.sys-dark .in-visual.queue,.sys-dark .in-visual.layers{min-height:110px}
.sys-dark .in-visual.diff{min-height:117px}
.sys-dark .in-visual.anchor{min-height:105px}
.sys-dark .in-visual.handoff{min-height:120px}
.sys-dark .in-visual.receipt{min-height:117px}
.sys-dark .in-visual.slots{min-height:76px}
.sys-dark .in-visual.stream{min-height:128px}
.sys-dark .in-visual.merge{min-height:85px}
.sys-dark .in-result code{font-size:10px!important}
.sys-dark .in-record>div{gap:8px}
.sys-dark .in-handoff{grid-template-columns:52px 1fr 52px;gap:5px}}
@media(prefers-reduced-motion:reduce){.sys-dark .in-host button:active{transform:none}}
.sys-dark .in-visual{height:auto!important;min-height:0!important}
.sys-dark .in-result{height:auto;min-height:40px}
.sys-dark .in-document{height:auto;min-height:72px}
.sys-dark .in-receipt{min-height:0;height:auto}
.sys-dark .in-stage{padding-bottom:14px!important}
.sys-dark .is-done .in-result{opacity:1}
.sys-dark .in-head{padding-bottom:12px;min-height:38px}
.sys-dark .in-surface{padding-top:14px}
.sys-dark .in-stage:not(.is-revealed) .in-description{font-size:11px!important;line-height:1.6!important}
.sys-dark .in-anchor{min-height:65px}
.sys-dark .in-visual.handoff{padding-bottom:6px}
.sys-dark .in-visual.tokens{padding-bottom:5px}
.sys-dark .in-visual.record{padding-bottom:3px}
@media(max-width:600px){.sys-dark .in-artifact{display:block}
.sys-dark .in-stage:not(.is-current) .in-artifact{display:none}
.sys-dark .instrument.is-complete .in-stage:last-child .in-artifact{display:block}
.sys-dark .in-stage:not(.is-current) .in-description{position:static!important;inset:auto!important;width:auto!important;height:auto!important;margin:1px 0 3px!important;clip-path:none!important;white-space:normal!important;font-size:11px!important;line-height:1.45!important;color:var(--text-secondary)!important;max-width:36ch!important}
.sys-dark .in-stage{padding-bottom:12px!important}
.sys-dark .in-stage-button:after{inset:-5px 0 -11px}
.sys-dark .in-head{min-height:37px}
.sys-dark .in-surface{padding-top:12px;padding-bottom:10px}
.sys-dark .in-document{min-height:70px}
.sys-dark .in-handoff{grid-template-columns:48px 1fr 48px}
.sys-dark .in-person strong,.sys-dark .in-handoff-path small,.sys-dark .in-handoff-path em{font-size:10px}
.sys-dark .in-scenario-switch{margin-bottom:14px}
.sys-dark .in-footer{position:relative;bottom:auto!important}
.sys-dark .in-result{min-height:0}
.sys-dark .in-visual{padding-block:0 4px!important}
.sys-dark .in-anchor{min-height:75px}}
@media(prefers-reduced-motion:reduce){.sys-dark .in-stage .in-artifact{display:block!important}
.sys-dark .in-stage .in-description{position:absolute!important;width:1px!important;height:1px!important;clip-path:inset(50%)!important;overflow:hidden!important}
.sys-dark .in-stage{padding-bottom:18px!important}}
@media(max-width:600px){.sys-dark .in-stack{min-height:calc(456px + max(0px, calc(390px - 100vw)))}
.sys-dark .in-handoff{grid-template-columns:64px minmax(0,1fr) 64px}
.sys-dark .in-person strong{overflow-wrap:anywhere}
.sys-dark .instrument.is-complete .in-stage:last-child .in-description{position:absolute!important;width:1px!important;height:1px!important;clip-path:inset(50%)!important;overflow:hidden!important}
.sys-dark .instrument.is-complete .in-stage:last-child .in-artifact{margin-top:4px}}
.sys-dark .is-current .in-receipt>.in-icon path{stroke-dasharray:none;animation:in-token-arrive 500ms cubic-bezier(.22,1,.36,1) both}