/* NeuroFly page styles (loaded by labs-layout via pageStyles). The page shell,
   type scale, cards and stats come from stackfire-labs.css (.sflp-*); this file
   only holds the live chamber and the sandbox console, scoped to .nf-page. */
.nf-page{--nf-line:#1f3440;--nf-text:#edf7f8;--nf-muted:#8aa4ad;--nf-accent:#1ed889}
.nf-page .nf-status{display:inline-block;letter-spacing:.12em;text-transform:uppercase;font:700 .6rem ui-monospace,monospace;border:1px solid rgba(30,216,137,.25);padding:5px 9px;border-radius:999px;color:var(--nf-accent)}
.nf-controls{display:grid;grid-template-columns:2fr 1fr .7fr auto;gap:12px;align-items:end}
.nf-controls label{font-size:.8rem;color:var(--nf-muted);margin:0}
.nf-controls input,.nf-controls select,.nf-controls button{width:100%;margin-top:7px;border:1px solid var(--sfl-line-strong,#2a4652);border-radius:10px;background:#050708;color:var(--nf-text);padding:12px 13px;font-size:.9rem}
.nf-controls button{background:#fafafa;color:#0b0b0d;font-weight:650;cursor:pointer;border-color:transparent;border-radius:999px}
.nf-controls button:hover{background:#fff}
.nf-controls button:disabled{opacity:.6;cursor:progress}
.nf-results{margin-top:26px;padding:22px;border:1px solid var(--sfl-line,#1f3440);border-radius:16px;background:#050708}
.nf-result-head{display:flex;justify-content:space-between;align-items:center;gap:14px}
.nf-result-head h3{margin:9px 0 0;font-size:1.35rem;font-weight:500;letter-spacing:-.03em}
.nf-result-head>span{color:var(--nf-muted);font-family:ui-monospace,monospace;font-size:.8rem}
.nf-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:22px 0}
.nf-metrics article{border:1px solid var(--sfl-line,#1f3440);border-radius:14px;background:#06090a;padding:17px}
.nf-metrics span{color:var(--nf-muted);font-size:.82rem}
.nf-metrics strong{display:block;font-size:1.6rem;font-weight:500;letter-spacing:-.03em;margin-top:7px;color:#fafafa}
.nf-chart-wrap{overflow:auto;border:1px solid var(--sfl-line,#18313b);border-radius:13px;background:#020405;padding:12px}
.nf-chart-wrap canvas{width:100%;min-width:700px;height:360px}
.nf-page pre{white-space:pre-wrap;max-height:360px;overflow:auto;background:#020405;border:1px solid var(--sfl-line,#18313b);border-radius:12px;padding:16px;margin:16px 0 0;color:#9ed3c7;font-size:.78rem}
@media(max-width:850px){
  .nf-metrics{grid-template-columns:1fr 1fr}
  .nf-controls{grid-template-columns:1fr 1fr}
  .nf-controls button{grid-column:1/-1}
}
@media(max-width:560px){
  .nf-metrics,.nf-controls{grid-template-columns:1fr}
}

/* NeuroFly live chamber ---------------------------------------------------- */
.nf-terminal{border:1px solid #2d414b;border-radius:18px;overflow:hidden;background:linear-gradient(180deg,#090e12,#05090c);box-shadow:0 24px 70px rgba(0,0,0,.32);min-height:390px;align-self:center}
.nf-terminal-bar{height:46px;display:flex;align-items:center;gap:8px;padding:0 13px;border-bottom:1px solid #293740;background:#151719;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.nf-dot{width:11px;height:11px;border-radius:50%;display:block}.nf-dot-red{background:#ff5f57}.nf-dot-yellow{background:#febc2e}.nf-dot-green{background:#28c840}
.nf-terminal-title{margin-left:5px;color:#9aa8ad;font-size:.7rem;letter-spacing:.08em;white-space:nowrap}
.nf-terminal-body{padding:14px}.nf-terminal-log{min-height:126px;font:12px/1.55 ui-monospace,SFMono-Regular,Menlo,monospace;color:#b8c6ca}
.nf-terminal-log>div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nf-prompt{color:#74e0c4}.nf-log-ok{color:#5fe3ad}.nf-log-key{color:#81aeea}
.nf-fly-stage{position:relative;height:300px;cursor:crosshair;touch-action:manipulation;border:1px solid #19313a;border-radius:11px;overflow:hidden;background:radial-gradient(circle at 50% 55%,rgba(49,115,111,.12),transparent 45%),#050b0f}
.nf-stage-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(95,142,153,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(95,142,153,.08) 1px,transparent 1px);background-size:24px 24px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.75),transparent)}
.nf-fly{position:absolute;left:50%;top:50%;width:34px;height:22px;pointer-events:none;color:#88ead3;transform:translate(-50%,-50%) translate(var(--fly-x,0px),var(--fly-y,0px)) rotate(var(--fly-r,0deg));transform-origin:50% 50%;transition:color .3s ease,filter .3s ease;filter:drop-shadow(0 0 9px rgba(72,224,191,.25));will-change:transform}
.nf-fly svg{display:block;width:100%;height:100%;overflow:visible}.nf-fly-wing{transform-origin:62% 48%;animation:nfWingBeat .11s infinite alternate ease-in-out}.nf-fly-wing-b{animation-delay:.055s}.nf-fly-neural{opacity:.9;stroke-dasharray:5 4;animation:nfNeuralPulse 1.15s linear infinite}.nf-fly-node{animation:nfNodePulse 1s infinite alternate}
.nf-fly-shadow{position:absolute;left:50%;top:50%;width:24px;height:6px;pointer-events:none;border-radius:50%;background:rgba(73,215,184,.12);filter:blur(7px);transform:translate(-50%,-50%) translate(var(--shadow-x,0px),var(--shadow-y,0px));transition:opacity .3s}
.nf-fly.is-alert{color:#ffb878;filter:drop-shadow(0 0 12px rgba(255,167,93,.35))}.nf-fly.is-assisted{color:#9bb8ff;filter:drop-shadow(0 0 13px rgba(130,164,255,.35))}.nf-fly.is-alert .nf-fly-wing{animation-duration:.075s}.nf-fly.is-assisted .nf-fly-neural{stroke-dasharray:2 3;animation-duration:.55s}
.nf-stage-label{position:absolute;font:9px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;color:#42606b}.nf-stage-label-a{left:9px;bottom:9px}.nf-stage-label-b{right:9px;top:9px}
.nf-terminal-foot{display:flex;justify-content:space-between;gap:14px;padding-top:10px;font:10px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;color:#72878e}.nf-led{display:inline-block;width:7px;height:7px;border-radius:50%;background:#5fe3ad;box-shadow:0 0 8px rgba(95,227,173,.55);margin-right:6px}
@keyframes nfWingBeat{from{transform:rotate(-4deg) scaleY(.92)}to{transform:rotate(6deg) scaleY(1.08)}}@keyframes nfNeuralPulse{to{stroke-dashoffset:-18}}@keyframes nfNodePulse{from{opacity:.35}to{opacity:1}}
@media(max-width:850px){.nf-terminal{min-height:360px}.nf-fly-stage{height:260px}}
@media(max-width:560px){.nf-terminal-title{display:none}.nf-terminal-log{font-size:10px}.nf-fly-stage{height:240px}.nf-fly{width:30px;height:19px}}
@media(prefers-reduced-motion:reduce){.nf-fly,.nf-fly-shadow{transition:none}.nf-fly-wing,.nf-fly-neural,.nf-fly-node{animation:none}.nf-fly.is-feeding{animation:none}}

/* NF-001.1 connectome stimulus lab and life log ------------------------------ */
/* Series colours: reference categorical slots 1-3 (dark), validated on #050708. */
.nf-page{--nf-s1:#3987e5;--nf-s2:#d95926;--nf-s3:#199e70}
.nf-lab-intro{max-width:760px;color:#90979b;line-height:1.7;font-size:.95rem;margin:0 0 18px}
.nf-engine-status{display:inline-flex;align-items:center;gap:8px;margin:0 0 22px;padding:8px 12px;border:1px solid var(--sfl-line);border-radius:999px;font:600 .74rem ui-monospace,SFMono-Regular,Menlo,monospace;color:#9aa3a7}
.nf-engine-status::before{content:"";width:7px;height:7px;border-radius:50%;background:#687277}
.nf-engine-status[data-tone=ok]::before{background:#5fe3ad;box-shadow:0 0 8px rgba(95,227,173,.6)}
.nf-engine-status[data-tone=wait]::before{background:#ffad43}
.nf-engine-status[data-tone=off]::before{background:#ff7a5c}
.nf-stim-grid{display:flex;flex-wrap:wrap;gap:14px;align-items:flex-end}
.nf-stim-group{display:flex;flex-direction:column;gap:7px;margin:0}
.nf-stim-group>span{font:700 .62rem ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--nf-muted)}
.nf-stim-group>div{display:flex;gap:6px}
.nf-stim,.nf-stim-clear,.nf-stim-group select{min-height:42px;padding:0 16px;border:1px solid var(--sfl-line-strong);border-radius:999px;background:#050708;color:#e8ecee;font-size:.86rem;cursor:pointer}
.nf-stim:hover:not(:disabled),.nf-stim-clear:hover:not(:disabled){border-color:#5fb4ff}
.nf-stim.is-active{background:#123f37;border-color:#235c50}
.nf-stim:disabled,.nf-stim-clear:disabled{opacity:.45;cursor:not-allowed}
.nf-auto{display:flex;align-items:center;gap:8px;min-height:42px;color:#c4cbce;font-size:.86rem;margin:0}
.nf-auto small{color:var(--nf-muted)}
.nf-last{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:22px}
.nf-last article{border:1px solid var(--sfl-line);border-radius:14px;background:#06090a;padding:14px 16px}
.nf-last span{display:block;color:var(--nf-muted);font-size:.78rem}
.nf-last strong{display:block;margin-top:6px;color:#fafafa;font-weight:500;font-size:1.02rem}
.nf-life-stats{grid-template-columns:repeat(7,1fr);padding:0 0 26px;width:auto}
.nf-life-stats .sflp-stat strong{font-size:1.5rem}
.nf-charts{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.nf-chart-card{margin:0;border:1px solid var(--sfl-line);border-radius:16px;background:#050708;padding:16px 16px 12px;min-width:0}
.nf-chart-wide{grid-column:1/-1}
.nf-chart-card figcaption{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;margin-bottom:10px}
.nf-chart-card figcaption strong{color:#fafafa;font-weight:600;font-size:.92rem}
.nf-chart-card figcaption span{color:var(--nf-muted);font-size:.78rem}
.nf-legend{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin:0 0 8px;color:#c4cbce;font-size:.78rem}
.nf-legend i,.nf-tooltip i{display:inline-block;width:12px;height:3px;border-radius:2px;background:var(--c);margin-right:6px;vertical-align:middle}
.nf-canvas-wrap canvas{display:block;width:100%;height:240px}
.nf-tooltip{position:fixed;z-index:50;pointer-events:none;max-width:280px;padding:9px 11px;border:1px solid var(--sfl-line-strong);border-radius:10px;background:#0b0d12;color:#c4cbce;font-size:.78rem;line-height:1.55;box-shadow:0 10px 30px rgba(0,0,0,.45)}
.nf-tooltip strong{color:#fafafa}
.nf-table-wrap{margin-top:18px;overflow-x:auto;border:1px solid var(--sfl-line);border-radius:14px}
.nf-table{width:100%;border-collapse:collapse;font-size:.82rem;color:#c4cbce;min-width:640px}
.nf-table caption{caption-side:top;text-align:left;padding:12px 14px 4px;color:#fafafa;font-weight:600}
.nf-table th,.nf-table td{padding:8px 14px;border-bottom:1px solid var(--sfl-line);text-align:left;white-space:nowrap}
.nf-table th{color:var(--nf-muted);font-weight:600;font-size:.74rem}
.nf-table tbody tr:last-child td{border-bottom:0}
.nf-credit{max-width:none;margin-top:22px;color:#c9b88f}
.nf-credit a{color:#e9c48a}
.nf-credit code{background:none;padding:0;color:inherit;font-size:.92em}
@media(max-width:1024px){.nf-life-stats{grid-template-columns:repeat(4,1fr)}.nf-last{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.nf-charts{grid-template-columns:1fr}.nf-life-stats{grid-template-columns:repeat(2,1fr)}.nf-stim-grid{gap:12px}}
.nf-arena-tools{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 0 10px;font:11px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;color:#8fa3a9}
.nf-arena-hint{margin-right:2px}
.nf-arena-tool{display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:0 11px;border:1px solid #1f3a44;border-radius:999px;background:#071014;color:#c9d6da;font:inherit;cursor:pointer}
.nf-arena-tool:hover{border-color:#3f7f8f}.nf-arena-tool[aria-pressed=true]{background:#123f37;border-color:#2b6b5d;color:#e8f7f2}
.nf-arena-count{margin-left:auto;color:#5d747b}
.nf-obj{position:absolute;transform:translate(-50%,-50%);pointer-events:none}
.nf-fly.is-dead{color:#6b7478;filter:none}.nf-fly.is-dead .nf-fly-wing,.nf-fly.is-dead .nf-fly-neural,.nf-fly.is-dead .nf-fly-node{animation:none}
.nf-auto-tool{cursor:pointer}.nf-auto-tool input{margin:0 2px 0 0;accent-color:#2b6b5d}.nf-auto-tool small{color:#5d747b}
.nf-engine-inline{display:inline;margin:0;padding:0;border:0;font:inherit;color:inherit}.nf-engine-inline::before{display:inline-block;margin-right:6px;vertical-align:middle}
.nf-brain-card{border:1px solid var(--sfl-line);border-radius:16px;background:#04080a;padding:14px 16px 12px;margin-top:6px}
.nf-brain-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;font:12px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;color:#b8c6ca}
.nf-brain-head .nf-legend{margin:0}
.nf-legend .nf-legend-ring{display:inline-block;width:10px;height:10px;border:1.6px solid #c0679a;border-radius:50%;margin:0 6px 0 14px;vertical-align:-1px;background:none!important}
.nf-brain-wrap canvas{display:block;width:100%;height:320px;border-radius:10px;cursor:crosshair}
.nf-brain-note{margin:10px 0 0;font:12px ui-monospace,SFMono-Regular,Menlo,monospace;color:#8fa3a9}
.nf-brain-note[hidden]{display:none}
/* Damage counters inside the brain map card, under the map. */
.nf-damage-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px}
.nf-damage-stats .sflp-stat{min-height:0;padding:11px 13px;border-radius:12px}
.nf-damage-stats .sflp-stat strong{font-size:1.25rem}
.nf-damage-stats .sflp-stat span{margin-top:4px;font-size:.72rem;line-height:1.35}
@media(min-width:641px) and (max-width:1024px){.nf-damage-stats{grid-template-columns:repeat(4,minmax(0,1fr))}}
/* Desktop: the brain map sits beside the intro and the chamber terminal spans
   the full hero width under both, with its controls in a side column so the
   arena gets the room. On one column the terminal comes first, then the map. */
.nf-top-grid{align-items:start}
.nf-side-stack{display:contents}
.nf-side-stack>.nf-terminal{grid-column:1/-1;min-width:0}
@media(min-width:1025px){
  .nf-side-stack>.nf-brain-card{align-self:stretch;display:flex;flex-direction:column;min-width:0}
  .nf-side-stack>.nf-brain-card .nf-brain-wrap{flex:1;min-height:300px}
  .nf-side-stack>.nf-brain-card .nf-brain-wrap canvas{position:absolute;inset:0;height:100%}
  .nf-side-stack>.nf-terminal .nf-terminal-body{display:grid;grid-template-columns:minmax(300px,350px) minmax(0,1fr);grid-template-rows:auto auto auto 1fr auto;grid-template-areas:"log stage" "head stage" "pieces stage" "tools stage" "foot foot";column-gap:18px}
  .nf-side-stack>.nf-terminal .nf-terminal-log{grid-area:log}
  .nf-side-stack>.nf-terminal .nf-terminal-log>div{white-space:normal}
  .nf-side-stack>.nf-terminal .nf-controls-head{grid-area:head}
  .nf-side-stack>.nf-terminal .nf-piece-tools{grid-area:pieces;grid-template-columns:repeat(2,minmax(0,1fr))}
  .nf-side-stack>.nf-terminal .nf-arena-tools{grid-area:tools;align-content:start}
  .nf-side-stack>.nf-terminal .nf-fly-stage{grid-area:stage;height:auto;min-height:540px}
  .nf-side-stack>.nf-terminal .nf-terminal-foot{grid-area:foot}
}
@media(max-width:1024px){.nf-side-stack>.nf-terminal{order:1}.nf-side-stack>.nf-brain-card{order:2}}
/* The /labs specimen photo and overlay under the hero actions: fills the intro column beside the terminal on desktop. */
.nf-specimen{position:relative;margin:34px 0 0;border:1px solid var(--nf-line);border-radius:18px;overflow:hidden;background:#040607}
.nf-specimen-stage{position:relative;top:auto;bottom:auto;right:auto;width:100%;height:auto}
.nf-specimen-tag{position:absolute;top:14px;right:16px;color:var(--nf-accent);font:700 10.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.16em}
.nf-specimen figcaption{position:absolute;left:0;right:0;bottom:0;padding:26px 16px 12px;background:linear-gradient(transparent,rgba(2,4,5,.82));color:#9fb3b9;font:10.5px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.1em;text-shadow:0 1px 6px #000}
@media(max-width:1024px){.nf-specimen{display:none}}
.nf-controls-head{display:flex;align-items:center;gap:8px;margin:12px 0 8px;padding-top:12px;border-top:1px solid #15303a;font:600 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.16em;color:#8fb3bb}
.nf-info{display:inline-grid;place-items:center;width:15px;height:15px;border:1px solid #5d8791;border-radius:50%;font:700 9px/1 ui-monospace,monospace;letter-spacing:0;color:#9fc6cf;cursor:help}
.nf-controls-head .nf-arena-count{margin-left:auto;letter-spacing:.06em}
.nf-piece-tools{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin-bottom:12px}
.nf-piece{display:flex;align-items:center;justify-content:center;gap:9px;min-height:46px;padding:6px 10px;border:1px solid #1f3a44;border-radius:12px;background:linear-gradient(180deg,#081317,#050c0f);color:#dfeef1;font:500 12.5px/1.15 ui-monospace,SFMono-Regular,Menlo,monospace;cursor:pointer;transition:border-color .2s,box-shadow .2s,background .2s}
.nf-piece svg{flex:none;width:26px;height:22px}
.nf-piece:hover{border-color:#2f6b74}
.nf-piece[aria-pressed=true]{border-color:#3fe0c5;background:linear-gradient(180deg,#0c2a28,#071a19);box-shadow:0 0 0 1px rgba(63,224,197,.35),0 0 18px rgba(63,224,197,.25)}
@media(max-width:720px){.nf-piece-tools{grid-template-columns:repeat(3,minmax(0,1fr))}.nf-piece{min-height:42px;font-size:11.5px}}
.nf-obj{position:absolute;transform:translate(-50%,-50%);pointer-events:none;display:grid;place-items:center}
.nf-obj svg{width:100%;height:100%;overflow:visible}
.nf-obj-wall{width:38px;height:30px;filter:drop-shadow(0 0 4px rgba(169,214,223,.25))}
.nf-obj-food{width:28px;height:28px}.nf-obj-food::before,.nf-obj-light::before{content:"";position:absolute;border-radius:50%;pointer-events:none}.nf-obj-food::before{inset:-30px;background:radial-gradient(circle,rgba(255,177,92,.16),rgba(255,177,92,.05) 45%,transparent 70%)}
.nf-obj-food{transform:translate(-50%,-50%) scale(calc(1 - var(--eaten,0) * .8));transition:transform .3s linear}
.nf-obj-poop{width:26px;height:26px;transform:translate(-50%,-50%) scale(calc(1 - var(--eaten,0) * .8));transition:transform .3s linear}.nf-obj-poop::before{content:"";position:absolute;inset:-26px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(160,110,60,.18),rgba(160,110,60,.05) 45%,transparent 70%)}
.nf-fly.is-feeding .nf-fly-wing{animation:none}.nf-fly.is-feeding{animation:nfFeedBob .6s ease-in-out infinite alternate}
@keyframes nfFeedBob{from{filter:drop-shadow(0 0 6px rgba(255,177,92,.25))}to{filter:drop-shadow(0 0 12px rgba(255,177,92,.55))}}
.nf-obj-light{width:30px;height:30px}.nf-obj-light::before{inset:-46px;background:radial-gradient(circle,rgba(255,210,74,.34),rgba(255,210,74,.1) 40%,transparent 70%)}
.nf-brain-card{margin-top:0}
.nf-brain-wrap{position:relative}
.nf-brain-wrap canvas{opacity:0;transition:opacity .6s ease}
.nf-brain-wrap.is-ready canvas{opacity:1;animation:nfMapReveal 1.1s cubic-bezier(.3,.7,.3,1) both}
.nf-brain-concept{position:absolute;inset:0;width:100%;height:100%;transition:opacity .6s ease}
.nf-brain-wrap.is-ready .nf-brain-concept{opacity:0;pointer-events:none}
.nf-concept-dots circle{opacity:.15;animation:nfConceptPulse 2.4s ease-in-out var(--d) infinite}
.nf-concept-sweep{animation:nfConceptSweep 3.2s linear infinite}
.nf-brain-caption{margin:8px 0 0;color:#7f969c;font-size:.78rem;line-height:1.5}
@keyframes nfConceptPulse{0%,100%{opacity:.15}50%{opacity:.95}}
@keyframes nfConceptSweep{from{transform:translateX(-60px)}to{transform:translateX(400px)}}
@keyframes nfMapReveal{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@media(prefers-reduced-motion:reduce){.nf-concept-dots circle,.nf-concept-sweep,.nf-brain-wrap.is-ready canvas{animation:none}.nf-concept-dots circle{opacity:.6}}
/* After the food and dung rules so it wins the cascade: no shrink with reduced motion. */
@media(prefers-reduced-motion:reduce){.nf-obj-food,.nf-obj-poop{transition:none;transform:translate(-50%,-50%)}}
/* Scenario selector (replaces the "simulated agent" badge) and guitar stage. */
.nf-visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.nf-scenario{margin-left:auto;display:inline-flex}
.nf-scenario select{appearance:none;-webkit-appearance:none;background:#0b1a1a url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%237fe6cd' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 10px center;color:#7fe6cd;border:1px solid #31554f;border-radius:999px;padding:6px 28px 6px 11px;font:600 .62rem/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
.nf-scenario select:focus-visible{outline:2px solid #3fe0c5;outline-offset:2px}
.nf-sound-toggle{margin-left:auto;display:inline-flex;align-items:center;gap:5px;letter-spacing:.06em;color:#8fb3bb;cursor:pointer}
.nf-sound-toggle input{margin:0;accent-color:#2b6b5d}
.nf-guitar-controls{display:flex;flex-direction:column;gap:10px;margin-bottom:12px}
.nf-chords{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.nf-chord{min-height:40px;border:1px solid #1f3a44;border-radius:10px;background:linear-gradient(180deg,#081317,#050c0f);color:#dfeef1;font:600 13px ui-monospace,SFMono-Regular,Menlo,monospace;cursor:pointer}
.nf-chord:hover{border-color:#2f6b74}
.nf-chord[aria-pressed=true]{border-color:#ffb15c;color:#ffd9a8;box-shadow:0 0 0 1px rgba(255,177,92,.3),0 0 16px rgba(255,177,92,.2)}
.nf-guitar-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.nf-piece[aria-pressed=true].nf-piece{border-color:#3fe0c5}
.nf-piece:disabled{opacity:.5;cursor:default}
.nf-neurons{border-top:1px solid #15303a;padding:12px 14px 14px;background:#050b0e}
.nf-neurons-head{display:flex;justify-content:space-between;gap:8px;font:600 10px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;color:#8fb3bb;margin-bottom:8px}
.nf-neurons-head span:last-child{letter-spacing:.04em;color:#5f8a92;text-align:right}
.nf-neurons-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px 10px}
@media(max-width:640px){.nf-neurons-list{grid-template-columns:1fr}}
.nf-neurons-list li{margin:0;position:relative;display:flex;justify-content:space-between;gap:8px;padding:4px 7px;border-radius:6px;font:11px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;color:#d6e6ea;overflow:hidden}
.nf-neurons-list li i{position:absolute;inset:0 auto 0 0;width:var(--w);background:linear-gradient(90deg,rgba(127,243,226,.22),rgba(127,243,226,.05));z-index:0}
.nf-neurons-list li span{position:relative;z-index:1}
.nf-neuron-detail{color:#6f8f97}
.nf-neurons-note{margin:8px 0 0;color:#6f8f97;font:10.5px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace}
.nf-guitar-stage{position:relative;border:1px solid #19313a;border-radius:11px;overflow:hidden;background:#050b0f}
/* Rock stage (see neurofly.ejs): the render, plus the head and foreleg
   layers drawn in its 1540 x 1021 pixel grid. The layers stay hidden until
   their images are decoded (.is-ready), so the fly is never seen headless;
   at rest they reproduce the render exactly. */
.nf-rock{position:relative;overflow:hidden;background:#04090c}
.nf-rock-cam{position:relative;transform-origin:62% 42%;animation:nfRockCam 16s ease-in-out infinite alternate;will-change:transform}
.nf-rock-photo{display:block;width:100%;height:auto}
.nf-rock-layers{position:absolute;inset:0;width:100%;height:100%;opacity:0}
.nf-rock.is-ready .nf-rock-layers{opacity:1}
.nf-rock-head{transform-box:view-box;transform-origin:925px 330px}
.nf-rock-leg{transform-box:view-box;transform-origin:597px 440px}
.nf-rock-leg.is-strumming{animation:nfLegStrum .46s cubic-bezier(.3,.7,.35,1)}
.nf-rock.is-nodding .nf-rock-head{animation:nfHeadNod .6s ease-out}
/* After the nod rule, so the riff's beat wins if a nod is still running. */
.nf-rock.is-playing .nf-rock-head{animation:nfHeadBob .8s ease-in-out infinite}
.nf-rock-light{position:absolute;border-radius:50%;pointer-events:none;mix-blend-mode:screen;transform:translate(-50%,-50%)}
.nf-rock-spot{left:85%;top:2.5%;width:46%;aspect-ratio:1;background:radial-gradient(circle,rgba(190,250,255,.55),rgba(80,200,230,.18) 38%,transparent 70%);opacity:.35}
.nf-rock-amp{left:9%;top:90%;width:22%;aspect-ratio:1;background:radial-gradient(circle,rgba(255,190,110,.7),rgba(255,140,60,.2) 40%,transparent 70%);opacity:.3;animation:nfRockAmp 3.2s ease-in-out infinite alternate}
.nf-rock-flash{left:46%;top:60%;width:60%;aspect-ratio:1;background:radial-gradient(circle,rgba(255,200,140,.45),rgba(255,150,80,.12) 40%,transparent 70%);opacity:0}
.nf-rock.is-ringing .nf-rock-spot{animation:nfRockSpot .7s ease-out}
.nf-rock.is-ringing .nf-rock-flash{animation:nfRockFlash .7s ease-out}
.nf-rock-dust{position:absolute;inset:0;pointer-events:none}
.nf-rock-dust i{position:absolute;width:3px;height:3px;border-radius:50%;background:rgba(220,250,255,.85);box-shadow:0 0 6px rgba(160,240,255,.9);opacity:0;animation:nfRockDust var(--d,12s) linear var(--delay,0s) infinite}
@keyframes nfRockCam{0%{transform:scale(1)}100%{transform:scale(1.035) translate(-.6%,.4%)}}
@keyframes nfRockSpot{0%{opacity:.95}100%{opacity:.35}}
@keyframes nfRockFlash{0%{opacity:.85}100%{opacity:0}}
@keyframes nfRockAmp{0%{opacity:.22}100%{opacity:.42}}
@keyframes nfRockDust{0%{opacity:0;transform:translate(0,0)}15%{opacity:.8}85%{opacity:.6}100%{opacity:0;transform:translate(var(--dx,20px),-90px)}}
/* Strum: a short upstroke, then the downstroke across the strings. */
@keyframes nfLegStrum{0%{transform:rotate(0)}18%{transform:rotate(-3deg)}48%{transform:rotate(5deg)}100%{transform:rotate(0)}}
@keyframes nfHeadBob{0%,100%{transform:rotate(0)}50%{transform:rotate(3deg) translate(2px,4px)}}
@keyframes nfHeadNod{0%,100%{transform:rotate(0)}40%{transform:rotate(3.5deg) translate(2px,5px)}}
.nf-guitar-notes{position:absolute;inset:0;pointer-events:none;z-index:4}
.nf-guitar-note{position:absolute;bottom:28%;color:#ffd9a8;font-size:22px;text-shadow:0 0 10px rgba(255,177,92,.7);animation:nfNoteRise 2.2s ease-out forwards}
.nf-guitar-chord{position:absolute;left:14px;top:12px;z-index:4;color:#ffd9a8;font:700 28px/1 ui-monospace,SFMono-Regular,Menlo,monospace;text-shadow:0 0 14px rgba(255,177,92,.5)}
@keyframes nfNoteRise{0%{opacity:0;transform:translateY(0) scale(.8)}15%{opacity:1}100%{opacity:0;transform:translateY(-160px) translateX(20px) scale(1.2)}}
@media(min-width:1025px){
  .nf-side-stack>.nf-terminal .nf-guitar-controls{grid-area:pieces}
  .nf-side-stack>.nf-terminal .nf-guitar-stage{grid-area:stage;align-self:start}
}
@media(max-width:560px){.nf-scenario select{font-size:.55rem;padding-right:24px}.nf-guitar-chord{font-size:20px}}
/* iOS Safari zooms the page when a control under 16px gets focus. */
@media(pointer:coarse){.nf-scenario select{font-size:16px;letter-spacing:.02em}}
@media(prefers-reduced-motion:reduce){.nf-rock-cam,.nf-rock-leg.is-strumming,.nf-rock .nf-rock-head,.nf-rock-light,.nf-guitar-note{animation:none!important}.nf-guitar-note,.nf-rock-dust{display:none}}
.nf-terminal [data-scenario][hidden]{display:none!important}
