/* ═════════════ REMEDIATION LAB — the decontamination line ═════════════
   Extends the Night Docket token system (../workspace.css). */

.grain{ display:none; }
body{ font-family:var(--ws-sans); margin:0; }

/* suite nav — dark chrome (style.css isn't loaded on this page) */
.svc-switch{ display:flex; align-items:center; gap:.35rem; flex-wrap:wrap;
  padding:.7rem clamp(1rem,3vw,2rem); background:rgba(10,15,28,.92);
  border-bottom:1px solid var(--ws-line); backdrop-filter:blur(10px);
  position:sticky; top:0; z-index:40; }
.svc-brand{ display:inline-flex; align-items:center; gap:.5rem; margin-right:1rem;
  text-decoration:none; font-size:1.05rem; letter-spacing:-.02em; }
.svc-mark{ width:26px; height:26px; border-radius:8px; flex:none;
  background:conic-gradient(from 140deg,#f5921e,#ff5d8f,#7b4fc4,#22b8c8,#f5921e); }
.svc-brand .w1{ font-weight:600; color:var(--ws-txt); }
.svc-brand .w2{ font-weight:800; color:var(--ws-brass); }
.svc-brand .dotai{ font-size:.55em; font-weight:800; letter-spacing:.06em;
  color:var(--ws-mut); margin-left:.3em; }
.svc-link{ font:600 .82rem/1 var(--ws-sans); color:var(--ws-soft);
  text-decoration:none; padding:.55rem .85rem; border-radius:999px;
  transition:color .2s,background .2s; }
.svc-link:hover{ color:var(--ws-txt); background:rgba(151,173,222,.08); }
.svc-link.active{ color:#1b1408; background:var(--ws-brass); }

.lab-main{ max-width:1180px; margin:0 auto;
  padding:clamp(1.4rem,3vw,2.2rem) clamp(1rem,3vw,2rem) 4rem; }

.lab-entry{ animation:ws-rise .7s .15s both; }
.lab-depth{ margin:0; padding:.4rem .6rem; }
.lab-how{ list-style:none; margin:0; padding:0; counter-reset:step; }
.lab-how li{ position:relative; padding:.55rem 0 .55rem 2.3rem; counter-increment:step; }
.lab-how li::before{ content:counter(step,decimal-leading-zero); position:absolute;
  left:0; top:.62rem; font:700 .68rem/1 var(--ws-mono); color:var(--ws-brass); }
.lab-how b{ display:block; font-size:.88rem; color:var(--ws-txt); }
.lab-how small{ display:block; margin-top:.15rem; font-size:.76rem;
  line-height:1.45; color:var(--ws-mut); }

/* ── the running instrument ── */
.lab-run{ animation:ws-rise .5s both; }
.lab-instrument{ background:var(--ws-panel); border:1px solid var(--ws-line);
  border-radius:18px; padding:clamp(1.2rem,2.6vw,2rem); }
.lab-file{ display:flex; justify-content:space-between; align-items:center;
  gap:1rem; flex-wrap:wrap; margin-bottom:1.4rem; }
.lf-name{ font:600 .85rem/1 var(--ws-mono); color:var(--ws-soft); }
.lf-cycle{ font:700 .72rem/1 var(--ws-mono); letter-spacing:.14em; color:var(--ws-brass);
  border:1px solid var(--ws-brass-dim); border-radius:999px; padding:.45rem .8rem;
  animation:lab-pulse 2.2s ease-in-out infinite; }
@keyframes lab-pulse{ 50%{ box-shadow:0 0 14px -2px rgba(226,178,99,.55);} }

.lab-dials{ display:grid; grid-template-columns:1fr 1.25fr 1fr;
  gap:clamp(1rem,2.5vw,2rem); align-items:center; }
@media(max-width:880px){ .lab-dials{ grid-template-columns:1fr 1fr; }
  .lab-stagecard{ grid-column:1/-1; order:3; } }

.lab-dial{ position:relative; display:grid; place-items:center; }
.lab-dial svg{ width:min(100%,230px); transform:rotate(-90deg); }
.ld-track{ fill:none; stroke:rgba(151,173,222,.13); stroke-width:7; }
.ld-arc{ fill:none; stroke-width:7; stroke-linecap:round;
  stroke-dasharray:326.7; stroke-dashoffset:326.7;
  transition:stroke-dashoffset 1.1s cubic-bezier(.25,.8,.3,1); }
.lab-dial.sim .ld-arc{ stroke:var(--ws-sim);
  filter:drop-shadow(0 0 8px rgba(255,106,77,.45)); }
.lab-dial.ai .ld-arc{ stroke:var(--ws-ai);
  filter:drop-shadow(0 0 8px rgba(143,123,255,.45)); }
.ld-tick{ stroke:var(--ws-ok); stroke-width:2.5; }
.ld-read{ position:absolute; text-align:center; }
.ld-read b{ display:block; font:600 clamp(1.8rem,4vw,2.6rem)/1 var(--ws-mono);
  color:var(--ws-txt); letter-spacing:-.02em; }
.ld-read small{ display:block; margin-top:.3rem; font:600 .6rem/1 var(--ws-mono);
  letter-spacing:.16em; color:var(--ws-mut); }
.ld-target{ display:block; margin-top:.35rem; font:500 .66rem/1 var(--ws-mono);
  color:var(--ws-ok); }
.ld-target i{ font-style:normal; }
.lab-dial.met .ld-read b{ color:var(--ws-ok); }

.lab-stagecard{ background:var(--ws-panel2); border:1px solid var(--ws-line);
  border-radius:14px; padding:1.1rem 1.2rem; }
.ls-eyebrow{ font:600 .62rem/1 var(--ws-mono); letter-spacing:.2em;
  text-transform:uppercase; color:var(--ws-brass); }
.ls-stage{ font-family:var(--ws-serif); font-size:clamp(1.05rem,1.8vw,1.3rem);
  font-weight:600; color:var(--ws-txt); margin:.5rem 0 .9rem; line-height:1.3; }
.ls-steps{ list-style:none; margin:0; padding:0; }
.ls-steps li{ position:relative; padding:.4rem 0 .4rem 1.7rem;
  font-size:.8rem; color:var(--ws-mut); transition:color .3s; }
.ls-steps li::before{ content:"○"; position:absolute; left:.2rem; color:var(--ws-mut); }
.ls-steps li.done{ color:var(--ws-soft); }
.ls-steps li.done::before{ content:"✓"; color:var(--ws-brass); }
.ls-steps li.on{ color:var(--ws-txt); font-weight:600; }
.ls-steps li.on::before{ content:"●"; color:var(--ws-brass);
  animation:lab-blink 1.1s ease-in-out infinite; }
@keyframes lab-blink{ 50%{ opacity:.25; } }

/* ── trajectory chart ── */
.lab-chart-wrap{ margin-top:1.6rem; }
.lab-chart{ width:100%; height:180px; background:var(--ws-panel2);
  border:1px solid var(--ws-line); border-radius:12px; }
.lab-chart .grid{ stroke:rgba(151,173,222,.08); stroke-width:1; }
.lab-chart .target{ stroke:var(--ws-ok); stroke-width:1.5; stroke-dasharray:6 5; opacity:.8; }
.lab-chart .line-sim{ stroke:var(--ws-sim); stroke-width:2.5; fill:none;
  stroke-linejoin:round; stroke-linecap:round; }
.lab-chart .line-ai{ stroke:var(--ws-ai); stroke-width:2.5; fill:none;
  stroke-linejoin:round; stroke-linecap:round; }
.lab-chart .pt-sim{ fill:var(--ws-sim); } .lab-chart .pt-ai{ fill:var(--ws-ai); }
.lab-chart .xl{ font:500 9px var(--ws-mono); fill:var(--ws-mut); }
.lab-chart-legend{ display:flex; gap:1.2rem; margin-top:.55rem;
  font:500 .7rem/1 var(--ws-mono); color:var(--ws-soft); }
.lab-chart-legend i{ display:inline-block; width:16px; height:3px;
  border-radius:2px; margin-right:.4rem; vertical-align:middle; }
.sw-sim{ background:var(--ws-sim); } .sw-ai{ background:var(--ws-ai); }
.sw-target{ background:var(--ws-ok); }

/* ── live log ── */
.lab-log-wrap{ margin-top:1.6rem; }
.lab-log{ margin:0; height:230px; overflow-y:auto; padding:.9rem 1rem;
  background:#080d18; border:1px solid var(--ws-line); border-radius:12px;
  font:400 .74rem/1.75 var(--ws-mono); color:var(--ws-soft);
  white-space:pre-wrap; word-break:break-word; }
.lab-log .lg-stage{ color:var(--ws-brass); font-weight:600; }
.lab-log .lg-good{ color:var(--ws-ok); font-weight:600; }
.lab-log .lg-warn{ color:var(--ws-warn); }

/* ── result ── */
.lab-done{ margin-top:1.6rem; animation:ws-rise .5s both; }
.lab-verdict{ border-radius:18px; border:1.5px solid; padding:clamp(1.4rem,3vw,2.2rem);
  text-align:center; }
.lab-verdict.ok{ color:var(--ws-ok); border-color:var(--ws-ok);
  background:rgba(49,198,144,.07); }
.lab-verdict.warn{ color:var(--ws-warn); border-color:var(--ws-warn);
  background:rgba(231,177,60,.07); }
.lab-verdict .lv-seal{ display:inline-block; font:700 .9rem/1 var(--ws-mono);
  letter-spacing:.18em; border:2.5px solid currentColor; border-radius:10px;
  padding:.7rem 1.2rem; transform:rotate(-3deg);
  animation:lab-stamp .5s cubic-bezier(.2,1.6,.4,1) both; }
@keyframes lab-stamp{ from{ transform:rotate(-3deg) scale(2.2); opacity:0; }
  to{ transform:rotate(-3deg) scale(1); opacity:1; } }
.lab-verdict h2{ font-family:var(--ws-serif); font-weight:600; color:var(--ws-txt);
  font-size:clamp(1.4rem,3vw,2rem); margin:1rem 0 .4rem; }
.lab-verdict p{ color:var(--ws-soft); font-size:.95rem; line-height:1.65;
  max-width:62ch; margin:0 auto; }
.lab-verdict .lv-nums{ display:flex; justify-content:center;
  gap:clamp(1.4rem,4vw,3rem); margin-top:1.3rem; flex-wrap:wrap; }
.lab-verdict .lv-num b{ display:block; font:600 1.6rem/1 var(--ws-mono); color:var(--ws-txt); }
.lab-verdict .lv-num b .was{ font-size:.85rem; color:var(--ws-mut);
  text-decoration:line-through; margin-right:.45rem; font-weight:500; }
.lab-verdict .lv-num small{ display:block; margin-top:.35rem;
  font:600 .6rem/1 var(--ws-mono); letter-spacing:.14em; color:var(--ws-mut); }

.lab-downloads{ display:flex; justify-content:center; gap:.7rem; flex-wrap:wrap;
  margin-top:1.2rem; }
.lab-again{ display:flex; justify-content:center; gap:.7rem; margin-top:1.2rem; }
.lab-again a{ text-decoration:none; display:inline-flex; align-items:center; }

/* rem-dl on dark canvas (report styles style these for the report view) */
.lab-downloads .rem-dl{ font:600 .84rem/1 var(--ws-sans); border-radius:10px;
  padding:.75rem 1.1rem; border:1px solid var(--ws-line2); color:var(--ws-soft);
  text-decoration:none; transition:color .2s,border-color .2s,background .2s; }
.lab-downloads .rem-dl:hover{ color:var(--ws-txt); border-color:var(--ws-brass);
  background:rgba(226,178,99,.07); }
.lab-downloads .rem-dl.primary{ color:#1b1408; background:var(--ws-brass);
  border-color:var(--ws-brass); font-weight:700; }
.lab-downloads .rem-dl.primary:hover{ background:#f0cd8b; color:#1b1408; }

.colophon{ text-align:center; color:var(--ws-mut); font-size:.75rem;
  padding:2rem 1rem 2.6rem; }

@media (prefers-reduced-motion:reduce){
  .lf-cycle,.ls-steps li.on::before,.lab-verdict .lv-seal{ animation:none; }
  .ld-arc{ transition:none; }
}
