/* Sapinover brand layer (site build only, generated by sapinover_theme.py). */
:root{color-scheme:dark;--ink:#e4e4e7;--muted:#a1a1aa;--faint:#71717a;--paper:#0a0a0b;--line:#27272a;
--blue:#00c22e;--ice:#0b2413;--navy:#050505;--teal:#00c22e;--mint:#0b2413;--gold:#f59e0b;--amber:#241a06;
--white:#141415;--mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Consolas,monospace;
--shadow:0 8px 32px rgba(0,0,0,.4)}
html,body{background:#0a0a0b;color:#e4e4e7}
body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}
h1,h2,h3,.brand{font-family:Outfit,Inter,system-ui,sans-serif;letter-spacing:-.01em}
.eyebrow,.tag,.env,small,code,pre,kbd,label{font-family:var(--mono)}
.eyebrow{letter-spacing:.2em}
::selection{background:#00c22e;color:#000}
a{color:#7dff9e}
:focus-visible{outline:2px solid #00c22e!important;outline-offset:2px}

/* masthead */
.mast{background:#050505;border-bottom:1px solid rgba(255,255,255,.08);color:#fff}
.mast .brand{color:#fff}
.mast .mast-tag{color:#71717a;border-left-color:#27272a}
.site-home{font:700 13px/1 var(--mono);letter-spacing:.28em;color:#00c22e;padding-right:20px;border-right:1px solid #27272a;white-space:nowrap;text-shadow:0 0 10px rgba(0,194,46,.45)}
.site-home:hover{text-decoration:none;color:#7dff9e}
.mark{background:#00c22e}.mark i{background:#050505}
.env{color:#00c22e}

/* panels: site glass */
.panel,.architecture-explorer,.lock-body{background:linear-gradient(145deg,rgba(255,255,255,.03),rgba(255,255,255,.01)),#0f0f10;border-color:rgba(255,255,255,.08);box-shadow:0 8px 32px rgba(0,0,0,.4)}

/* buttons: site neon primary with black text */
.btn{background:transparent;color:#e4e4e7;border-color:#3f3f46}
.btn:hover{border-color:#00c22e;color:#7dff9e}
.btn.primary,.btn[aria-pressed="true"],.chip.active{background:#00c22e;border-color:#00c22e;color:#000!important;font-weight:700}
.architecture-modes .btn[aria-pressed="true"],.strip .chip.active{background:#00c22e!important;border-color:#00c22e!important;color:#000!important}
.btn.primary:hover{background:#7dff9e;border-color:#7dff9e}
.btn:disabled{opacity:.35}
input,select,textarea{background:#0a0a0b;color:#e4e4e7;border-color:#3f3f46}
input::placeholder,textarea::placeholder{color:#71717a}

/* explorer stage cards + detail */
.architecture-stages button{background:#141415;border-color:#27272a;color:#e4e4e7}
.architecture-stages button[aria-pressed="true"]{background:#0b2413;border-color:#00c22e;box-shadow:0 0 0 1px #00c22e,0 0 18px rgba(0,194,46,.18)}
.architecture-stages button small{color:#71717a;font-family:var(--mono)}
.architecture-detail{background:#141415;border-left-color:#00c22e}
.architecture-note{color:#a1a1aa;border-top-color:#27272a}

/* flow map */
.flow-map svg.fm{background:#050505;border-color:rgba(255,255,255,.08)}
.fm-edge{stroke:#3f3f46}
.fm-edge.done{stroke:#00c22e;filter:drop-shadow(0 0 3px rgba(0,194,46,.55))}
.fm-head{fill:#00c22e}
.fm-node rect{fill:#141415;stroke:#3f3f46}
.fm-node text{fill:#e4e4e7;font-family:Inter,system-ui,sans-serif}
.fm-node.on rect{stroke:#52525b}
.fm-node.visited rect{fill:#0b2413;stroke:#00c22e}
.fm-node.alert.visited rect{fill:#241a06;stroke:#f59e0b}
.fm-node.active text{fill:#fff}
.fm-pulse{stroke:#00c22e!important}
.fm-node.alert .fm-pulse{stroke:#f59e0b!important}
.fm-packet{fill:#7dff9e;stroke:#050505;filter:drop-shadow(0 0 6px rgba(0,194,46,.9))}

/* rail: site nav treatment, long worksheet names wrap */
.rail nav a{white-space:normal;line-height:1.25;color:#a1a1aa}
.rail nav a:hover{background:rgba(255,255,255,.04);color:#fff}
.rail nav a[aria-current=page]{background:#0b2413;color:#7dff9e;box-shadow:inset 2px 0 0 #00c22e}

/* map previews + gallery */
.flow-preview{background:linear-gradient(145deg,rgba(255,255,255,.03),rgba(255,255,255,.01)),#0f0f10;border-color:rgba(255,255,255,.08)}
.flow-preview:hover,.flow-preview:focus-visible{border-color:#00c22e;box-shadow:0 0 0 1px rgba(0,194,46,.35),0 10px 30px rgba(0,0,0,.5)}
.fp-path,.fp-foot{color:#7dff9e}
.fp-title{color:#fff}

/* lock panel */
.lock-icon{color:#f59e0b}
.lock-body h3{color:#fff}
.lock-body p{color:#a1a1aa}
