:root{
  --bg:#05090c;
  --bg-2:#080d11;
  --panel:#0d1418;
  --panel-2:#11191d;
  --edge:#2c373c;
  --edge-strong:#435158;
  --text:#c7d0d3;
  --muted:#77868c;
  --cyan:#35c6ef;
  --green:#7ed79a;
  --amber:#e5b35e;
  --red:#e17368;
  --terminal:#080d10;
  --terminal-text:#d9e0e2;
  --shadow:#0009;
}

*{box-sizing:border-box}
html{background:#05080a;color-scheme:dark}
body{
  margin:0;
  min-height:100vh;
  background:
    radial-gradient(circle at 50% -18%,rgba(36,69,79,.28),transparent 38%),
    linear-gradient(135deg,#080d11,#05090c 58%,#071014);
  color:var(--text);
  font-family:"Courier New",Courier,monospace;
}
button,a{font:inherit}
button{color:inherit}
.skip-link{position:fixed;left:1rem;top:-6rem;z-index:50;background:#fff;color:#000;padding:.8rem 1rem;text-decoration:none}
.skip-link:focus{top:1rem}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}

.lab-shell{max-width:1840px;margin:0 auto;padding:24px}
.lab-header{position:relative;display:grid;grid-template-columns:minmax(420px,.9fr) minmax(620px,1.25fr);gap:36px;align-items:end;margin-bottom:24px;padding-right:112px}
.lab-intro{max-width:690px}
.eyebrow-row{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.eyebrow-row a,.lab-footer a{color:var(--muted);font-size:.72rem;text-decoration:none;letter-spacing:.05em}
.eyebrow-row a:hover,.lab-footer a:hover{color:var(--cyan)}
.exhibit-badge{border:1px solid #7d5728;background:#241b10;color:#ffc46a;border-radius:999px;padding:7px 14px;font-size:.67rem;font-weight:700;letter-spacing:.16em}
.lab-intro h1{margin:16px 0 4px;color:var(--cyan);font-size:clamp(2rem,3.2vw,3rem);letter-spacing:.11em;text-shadow:0 0 16px rgba(0,170,220,.35)}
.lab-hook{margin:.3rem 0;color:#e6ecee;font-weight:700;letter-spacing:.07em}
.lab-dek{margin:.55rem 0 0;font-size:1rem;color:#adb9bd;line-height:1.5}
.lab-disclosure{margin:.65rem 0 0;color:var(--muted);font-size:.72rem;line-height:1.55;max-width:640px}

.lab-topbar{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--edge);border-radius:12px;background:rgba(11,17,21,.9);box-shadow:0 14px 28px #0004;overflow:hidden}
.lab-topbar>div{padding:18px 20px;border-right:1px solid var(--edge);min-width:0}
.lab-topbar>div:last-child{border-right:0}
.lab-topbar span,.micro-label{display:block;color:#849197;font-size:.61rem;letter-spacing:.17em;margin-bottom:9px;text-transform:uppercase}
.lab-topbar strong{display:block;color:#d7e0e2;font-size:.98rem;overflow-wrap:anywhere}
.lab-topbar small{display:block;color:var(--muted);font-size:.65rem;line-height:1.35;margin-top:6px}
.tone-info{color:var(--cyan)!important}.tone-ok{color:var(--green)!important}.tone-warn{color:var(--amber)!important}.tone-fail{color:var(--red)!important}

.language-switch{position:absolute;right:0;top:0;display:grid;grid-template-columns:auto auto;gap:5px;align-items:center}
.language-switch>span{grid-column:1/-1;color:var(--muted);font-size:.58rem;letter-spacing:.15em;text-align:center}
.language-switch button{border:1px solid var(--edge);background:#0b1216;color:#8e9ca1;cursor:pointer;font-size:.68rem;padding:7px 9px}
.language-switch button[aria-pressed="true"]{border-color:var(--cyan);color:#dff8ff;background:rgba(53,198,239,.1)}

.lab-grid{display:grid;grid-template-columns:270px minmax(580px,1fr) 300px;gap:18px;align-items:start}
.left-rail,.right-rail{display:grid;gap:16px}
.panel{background:linear-gradient(145deg,rgba(17,25,29,.96),rgba(10,16,19,.96));border:1px solid var(--edge);border-radius:10px;padding:16px;box-shadow:0 12px 28px #0005}
.panel-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;border-bottom:1px solid var(--edge);padding-bottom:11px;margin-bottom:13px}
.panel h2{margin:0;color:var(--cyan);font-size:.72rem;letter-spacing:.15em;text-transform:uppercase}
.left-rail .panel h2{color:var(--amber)}
.panel-heading>span{color:#607077;font-size:.59rem;letter-spacing:.12em}

.scenario-list{display:grid;gap:9px}
.scenario-option{width:100%;border:1px solid #344047;background:#0a1115;color:var(--text);text-align:left;padding:12px;cursor:pointer;transition:border-color .15s,background .15s,transform .15s}
.scenario-option:hover{border-color:#55656d;background:#0e171b}
.scenario-option[aria-pressed="true"]{border-color:var(--cyan);background:rgba(53,198,239,.07);box-shadow:inset 3px 0 0 var(--cyan)}
.scenario-option strong{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:.76rem;letter-spacing:.05em;color:#e1e7e9}
.scenario-option small{display:block;margin-top:6px;color:var(--muted);font-size:.64rem;line-height:1.4}
.severity-chip{border:1px solid currentColor;padding:2px 5px;font-size:.52rem;font-weight:700;letter-spacing:.08em}
.severity-critical{color:var(--red)}.severity-high{color:var(--amber)}.severity-medium{color:#e8ca72}
.scenario-meta{margin:0}.scenario-meta div{display:flex;justify-content:space-between;gap:10px;margin:10px 0;font-size:.67rem}.scenario-meta dt{color:#98a4a8}.scenario-meta dd{margin:0;color:#d8e0e2;text-align:right}.scenario-summary{margin:12px 0 0;padding-top:12px;border-top:1px solid #273238;color:#87969b;font-size:.68rem;line-height:1.55}

.metrics{display:grid;gap:9px}
.metric-row{display:grid;grid-template-columns:1fr auto;gap:4px 10px;align-items:center}
.metric-row dt{font-size:.65rem;color:#aeb9bd}
.metric-row dd{margin:0;font-size:.65rem;font-weight:700;color:var(--green);text-align:right}
.metric-bar{grid-column:1/-1;height:5px;background:#202a2f;overflow:hidden}
.metric-bar i{display:block;height:100%;width:var(--value,0%);background:currentColor;transition:width .3s ease}
.metric-row.metric-warn dd,.metric-row.metric-warn .metric-bar{color:var(--amber)}
.metric-row.metric-fail dd,.metric-row.metric-fail .metric-bar{color:var(--red)}
.metric-row.metric-info dd,.metric-row.metric-info .metric-bar{color:var(--cyan)}
.metric-row.metric-neutral dd{color:#d8e0e2}

.center-stage{min-width:0;display:grid;gap:0}
.machine-frame{border:1px solid #414d52;background:#070c0f;box-shadow:0 22px 38px var(--shadow),inset 0 0 0 1px #10181c}
.machine-toolbar{min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 14px;border-bottom:1px solid #2a3439;background:linear-gradient(#11191d,#0b1114);color:#88969a;font-size:.62rem;letter-spacing:.04em}
.machine-ident,.machine-flags{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.machine-flags{justify-content:flex-end}.machine-flags span{border:1px solid #344047;padding:4px 6px;color:#9cabaf}.toolbar-divider{color:#4d5b61}
.status-lamp{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 8px rgba(126,215,154,.6)}
.status-lamp.warn{background:var(--amber);box-shadow:0 0 8px rgba(229,179,94,.55)}
.status-lamp.fail{background:var(--red);box-shadow:none}
.status-lamp.off{background:#3d474b;box-shadow:none}
.failure-terminal{position:relative;min-height:610px;max-height:610px;overflow:auto;background:var(--terminal);padding:28px 30px;text-align:left;outline:none;scrollbar-color:#314047 #0a1013;scrollbar-width:thin}
.failure-terminal:focus-visible{box-shadow:inset 0 0 0 2px var(--cyan)}
.failure-terminal pre{position:relative;z-index:2;margin:0;color:var(--terminal-text);font:clamp(.74rem,1vw,.88rem)/1.48 "Courier New",Courier,monospace;white-space:pre-wrap;overflow-wrap:anywhere;text-shadow:0 0 7px rgba(194,224,231,.08)}
.terminal-scanlines{position:absolute;inset:0;z-index:3;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0,transparent 3px,rgba(0,0,0,.14) 4px);opacity:.35}
.terminal-prompt{position:relative;z-index:2;display:flex;gap:7px;margin-top:3px;color:#a8dcb7;font:clamp(.74rem,1vw,.88rem)/1.48 "Courier New",monospace}
.terminal-cursor{color:var(--green);animation:terminal-blink 1s steps(1) infinite}
@keyframes terminal-blink{50%{opacity:0}}
.terminal-line-info{color:#8dcde0}.terminal-line-ok{color:#92d7a3}.terminal-line-warn{color:#e4c179}.terminal-line-fail{color:#e79087}.terminal-line-dim{color:#819095}.terminal-line-command{color:#d9e0e2}.terminal-line-title{color:#57cbea;font-weight:700}.terminal-line-humor{color:#e5b35e;font-weight:700}

.timeline-panel{border:1px solid var(--edge);border-top:0;background:#0d1418;padding:14px 16px 13px}
.timeline-header{display:flex;justify-content:space-between;align-items:end;gap:16px}.timeline-header .micro-label{margin-bottom:5px}.timeline-header strong{color:#d7e0e2;font-size:.73rem;letter-spacing:.1em}.timeline-header output{color:var(--cyan);font-size:.75rem;font-weight:700}
.progress-track{height:4px;background:#243036;margin:11px 0 12px;overflow:hidden}.progress-track i{display:block;width:0;height:100%;background:var(--cyan);transition:width .25s ease}
.stage-timeline{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;list-style:none;margin:0;padding:0}
.stage-timeline li{position:relative;color:#68767c;font-size:.56rem;line-height:1.3;text-align:center;padding-top:9px;text-transform:uppercase;letter-spacing:.06em}
.stage-timeline li::before{content:"";position:absolute;top:0;left:50%;width:5px;height:5px;border-radius:50%;background:#354148;transform:translateX(-50%)}
.stage-timeline li.done{color:#8ba096}.stage-timeline li.done::before{background:var(--green)}.stage-timeline li.active{color:#e5edf0;font-weight:700}.stage-timeline li.active::before{background:var(--cyan);box-shadow:0 0 8px rgba(53,198,239,.6)}

.diagnostic-drawer{border:1px solid var(--edge);border-top:0;background:#10181c;padding:16px;box-shadow:0 16px 24px #0007}
.diagnostic-drawer[hidden]{display:none}.diagnostic-head{display:flex;justify-content:space-between;align-items:start;gap:14px}.diagnostic-head h3{margin:0;color:#e0e7e9;font-size:.8rem}.diagnostic-drawer p{color:#86959a;font-size:.67rem;line-height:1.5;margin:8px 0 12px}.quiet-button{border:1px solid var(--edge);background:transparent;color:#94a2a7;cursor:pointer;font-size:.59rem;padding:7px 9px}.diagnostic-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.diagnostic-action{border:1px solid #364249;background:#0a1115;color:#b9c4c8;cursor:pointer;text-align:left;padding:10px;font-size:.65rem}.diagnostic-action:hover,.diagnostic-action:focus-visible{border-color:var(--cyan);background:rgba(53,198,239,.06)}.diagnostic-action strong{display:block;color:#dce4e6;margin-bottom:3px}.diagnostic-action span{color:#74848a;font-size:.58rem}

.control-deck{display:grid;grid-template-columns:1.2fr .9fr .8fr;border:1px solid #393d38;border-top:0;background:linear-gradient(#1b1d1a,#11130f);box-shadow:0 16px 28px #0008}
.control-group,.control-state{padding:14px 16px;border-right:1px solid #343833;min-width:0}.control-state{border-right:0}.button-row{display:flex;flex-wrap:wrap;gap:6px}.control-button{border:1px solid #3a413e;background:#202421;color:#b7c0bd;cursor:pointer;padding:8px 9px;font-size:.58rem;font-weight:700;letter-spacing:.04em}.control-button.primary{border-color:#3d7784;color:#d8f6ff;background:#15272c}.control-button:hover:not(:disabled),.control-button:focus-visible:not(:disabled){border-color:var(--cyan);color:#fff}.control-button:disabled{cursor:not-allowed;opacity:.38}.state-pill{display:inline-block;border:1px solid #415049;padding:6px 8px;font-size:.63rem;font-weight:700;letter-spacing:.08em}.state-ready{color:var(--green)}.state-running{color:var(--cyan)}.state-warning{color:var(--amber)}.state-failed{color:var(--red)}.control-state small{display:block;color:#77868b;font-size:.59rem;line-height:1.45;margin-top:8px}

.explanation-card p,.evidence-panel p{margin:0;color:#9eaaae;font-size:.68rem;line-height:1.6}.explanation-card.locked{opacity:.53}.explanation-card.revealed{border-color:#3a4b51}.lesson-card.revealed{border-color:rgba(126,215,154,.5)}.lesson-card.revealed h2{color:var(--green)}
.evidence-list{display:grid;gap:8px;list-style:none;margin:0;padding:0}.evidence-list li{border-left:2px solid var(--cyan);padding-left:9px;color:#aab5b9;font-size:.64rem;line-height:1.45}.evidence-list li strong{display:block;color:#d6dfe1;font-size:.62rem;margin-bottom:2px}.muted{color:#66767c!important}

.lab-footer{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-top:18px;padding:15px 18px;border:1px solid #253036;background:rgba(7,12,15,.7);color:#718087;font-size:.64rem;line-height:1.5}.lab-footer p{margin:0}.lab-footer strong{color:#a9b7bb;letter-spacing:.06em}

button:focus-visible,a:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}

@media(max-width:1480px){
  .lab-header{grid-template-columns:.9fr 1.1fr}
  .lab-grid{grid-template-columns:235px minmax(520px,1fr) 265px;gap:14px}
  .panel{padding:14px}.failure-terminal{min-height:570px;max-height:570px;padding:24px}
  .lab-topbar>div{padding:16px 14px}
}

@media(max-width:1180px){
  .lab-shell{padding:18px}
  .lab-header{grid-template-columns:1fr;padding-right:0}
  .language-switch{top:auto;bottom:0}
  .lab-intro{padding-right:100px}
  .lab-grid{grid-template-columns:1fr;grid-template-areas:"center" "left" "right"}
  .center-stage{grid-area:center}.left-rail{grid-area:left;grid-template-columns:1.2fr .8fr 1fr}.right-rail{grid-area:right;grid-template-columns:repeat(3,1fr)}
  .right-rail .explanation-card:nth-child(4),.evidence-panel{grid-column:auto}
  .failure-terminal{min-height:560px;max-height:560px}
}

@media(max-width:820px){
  .lab-shell{padding:12px}
  .lab-intro{padding-right:0}.language-switch{position:static;margin-top:16px;display:flex;justify-content:flex-start}.language-switch>span{grid-column:auto;align-self:center;margin-right:4px}
  .lab-header{display:block}.lab-topbar{grid-template-columns:repeat(2,1fr);margin-top:18px}.lab-topbar>div:nth-child(2){border-right:0}.lab-topbar>div:nth-child(-n+2){border-bottom:1px solid var(--edge)}
  .left-rail,.right-rail{grid-template-columns:1fr 1fr}.scenario-panel,.metrics-panel,.evidence-panel{grid-column:1/-1}
  .control-deck{grid-template-columns:1fr}.control-group,.control-state{border-right:0;border-bottom:1px solid #343833}.control-state{border-bottom:0}
  .diagnostic-actions{grid-template-columns:1fr}
  .failure-terminal{min-height:480px;max-height:480px;padding:20px 18px}
  .machine-toolbar{align-items:flex-start;flex-direction:column}.machine-flags{justify-content:flex-start}
  .lab-footer{align-items:flex-start;flex-direction:column}
}

@media(max-width:560px){
  .lab-topbar{grid-template-columns:1fr}.lab-topbar>div{border-right:0;border-bottom:1px solid var(--edge)!important}.lab-topbar>div:last-child{border-bottom:0!important}
  .left-rail,.right-rail{grid-template-columns:1fr}.scenario-panel,.metrics-panel,.evidence-panel{grid-column:auto}
  .failure-terminal{min-height:440px;max-height:440px;padding:16px 13px}.failure-terminal pre,.terminal-prompt{font-size:.67rem}
  .stage-timeline{grid-template-columns:repeat(4,1fr);row-gap:12px}.control-button{flex:1 1 42%;padding:10px 8px}
  .machine-flags{display:grid;grid-template-columns:1fr}.lab-intro h1{font-size:1.85rem}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition:none!important}
  .terminal-cursor{animation:none}
}