/* ==========================================================================
   HBF Scientific Lab — interface system 7.5.1
   Purple instrument theme · DIN-style technical typography · motion layer
   Every class name used by the seven laboratories is preserved.
   ========================================================================== */

:root {
  color-scheme: dark;

  /* --- surfaces (HBF purple, matching the laboratory workspaces) --------- */
  --bg: #070512;
  --bg-2: #0b0819;
  --panel: #130d26;
  --panel-2: #181040;
  --panel-3: #21163b;
  --sunken: #0a0718;

  /* --- ink -------------------------------------------------------------- */
  --ink: #ede9f9;
  --ink-2: #cfc7ea;
  --muted: #b7afd6;
  --faint: #928ab0;

  /* --- lines ------------------------------------------------------------ */
  --line: #2a1f52;
  --line-2: #3b2d5e;
  --line-3: #4d3b76;

  /* --- accents ---------------------------------------------------------- */
  --cyan: #a68aff;          /* primary accent — name kept for compatibility */
  --cyan-2: #d5c6ff;
  --violet: #bda6ff;
  --primary: #7c5cff;
  --primary-2: #9578ff;
  /* Filled controls with white text (WCAG AA ≥ 4.5:1 on every stop). */
  --primary-fill: #7657f2;        /* 4.76:1 with #fff */
  --primary-fill-2: #6148c7;      /* 6.44:1 */
  --primary-fill-hover: #6d51e0;  /* 5.38:1 */
  --primary-fill-hover-2: #5a43b8; /* 7.17:1 */
  --accent-dim: rgba(166, 138, 255, .13);
  --blue: #67e6ff;
  --amber: #ffcf70;
  --red: #ff8f9e;
  --green: #7ee9ab;
  --pink: #ff8fd0;

  /* --- elevation -------------------------------------------------------- */
  --shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 14px 34px rgba(0, 0, 0, .42);
  --shadow-lg: 0 2px 6px rgba(0, 0, 0, .4), 0 32px 68px rgba(0, 0, 0, .55);
  --glow: 0 0 0 1px rgba(166, 138, 255, .35), 0 18px 50px rgba(124, 92, 255, .22);

  /* --- geometry --------------------------------------------------------- */
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 14px;
  --r-xl: 20px;
  --shell: 1280px;

  /* --- type ------------------------------------------------------------- */
  /* Technical DIN-style display face. Bahnschrift ships with Windows 10/11,
     DIN Alternate and DIN Condensed with macOS and iOS; the remaining entries
     cover Android, Linux and older systems with a condensed grotesque. */
  --display: "D-DIN", "DIN Alternate", "DIN Next LT Pro", Bahnschrift,
             "Roboto Condensed", "Archivo Narrow", "Helvetica Neue Condensed",
             "Liberation Sans Narrow", "Arial Narrow", "DejaVu Sans Condensed",
             Inter, system-ui, sans-serif;
  --sans: Inter, "Helvetica Neue", ui-sans-serif, system-ui, -apple-system,
          BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  --track-display: .015em;
  --track-caps: .085em;
  --track-wide: .26em;

  font-family: var(--sans);
}

/* --------------------------------------------------------------------------
   Base
   -------------------------------------------------------------------------- */

* { box-sizing: border-box; }

html {
  background: var(--bg);
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  min-height: 100vh;
  color: var(--ink);
  background: var(--bg);
  font-size: 16px;
  line-height: 1.62;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Slow drifting field behind every page. Painted on a fixed pseudo-element so
   it never affects layout and never repaints on scroll. */
body::before {
  content: "";
  position: fixed;
  inset: -20%;
  z-index: -2;
  pointer-events: none;
  background:
    radial-gradient(38rem 30rem at 12% 6%,  rgba(124, 92, 255, .20), transparent 62%),
    radial-gradient(34rem 28rem at 88% 0%,  rgba(103, 230, 255, .10), transparent 60%),
    radial-gradient(40rem 34rem at 70% 92%, rgba(166, 138, 255, .13), transparent 64%);
  animation: hbf-drift 34s ease-in-out infinite alternate;
  will-change: transform;
}

/* Fine technical grid, very low contrast. */
body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .5;
  background-image:
    linear-gradient(rgba(166, 138, 255, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(166, 138, 255, .045) 1px, transparent 1px);
  background-size: 84px 84px;
  mask-image: radial-gradient(ellipse 120% 80% at 50% 0%, #000 35%, transparent 78%);
  -webkit-mask-image: radial-gradient(ellipse 120% 80% at 50% 0%, #000 35%, transparent 78%);
}

@keyframes hbf-drift {
  0%   { transform: translate3d(0, 0, 0) scale(1); }
  50%  { transform: translate3d(-2.2%, 1.6%, 0) scale(1.06); }
  100% { transform: translate3d(1.8%, -1.4%, 0) scale(1.03); }
}

a {
  color: var(--cyan-2);
  text-decoration-color: rgba(213, 198, 255, .4);
  text-underline-offset: 3px;
  transition: color .18s ease;
}
a:hover { color: #fff; text-decoration-color: currentColor; }

button, input, select, textarea { font: inherit; }
img, svg, canvas { max-width: 100%; }

::selection { background: rgba(124, 92, 255, .38); color: #fff; }

:focus-visible {
  outline: 2px solid var(--cyan);
  outline-offset: 3px;
  border-radius: 4px;
}
button, a, input, select, textarea, summary { outline-offset: 3px; }

* { scrollbar-width: thin; scrollbar-color: var(--line-2) transparent; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--line-2); border: 2px solid transparent; background-clip: content-box; border-radius: 99px; }
::-webkit-scrollbar-thumb:hover { background: var(--line-3); background-clip: content-box; }

/* --------------------------------------------------------------------------
   Typography — technical display treatment
   -------------------------------------------------------------------------- */

h1, h2, h3, h4 {
  font-family: var(--display);
  font-weight: 600;
  line-height: 1.06;
  text-wrap: balance;
}

h1 {
  max-width: 20ch;
  margin: 0;
  font-size: clamp(2.15rem, 1.1rem + 4.1vw, 4.9rem);
  font-weight: 600;
  line-height: .98;
  text-transform: uppercase;
  letter-spacing: var(--track-display);
}

h2 {
  font-size: clamp(1.55rem, 1.15rem + 1.35vw, 2.35rem);
  text-transform: uppercase;
  letter-spacing: .04em;
}

h3 {
  font-size: 1rem;
  font-weight: 650;
  text-transform: uppercase;
  letter-spacing: .07em;
}

p { text-wrap: pretty; }

.eyebrow {
  margin: 0 0 1rem;
  color: var(--cyan);
  text-transform: uppercase;
  letter-spacing: var(--track-wide);
  font: 600 .715rem/1.6 var(--mono);
}

.lede {
  max-width: 66ch;
  color: var(--ink-2);
  font-family: var(--sans);
  font-size: clamp(1.05rem, 1rem + .38vw, 1.26rem);
  line-height: 1.66;
  letter-spacing: -.003em;
}

code, .mono { font-family: var(--mono); font-size: .92em; }
code {
  padding: .12em .4em;
  border-radius: 4px;
  background: rgba(166, 138, 255, .13);
  color: var(--cyan-2);
}

/* --------------------------------------------------------------------------
   Layout containers
   -------------------------------------------------------------------------- */

.hero, .labhead, main, footer {
  width: min(var(--shell), calc(100% - 2.5rem));
  margin-inline: auto;
}

.divider { height: 1px; margin: 2.6rem 0; background: linear-gradient(90deg, var(--line-2), transparent); border: 0; }
.two   { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.1rem; }
.three { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.1rem; }

.prose { max-width: 74ch; }
.prose h2 { margin-top: 2.8rem; }
.prose h3 { margin-top: 1.9rem; color: var(--cyan-2); }
.prose p, .prose li { color: var(--ink-2); }
.prose li { margin: .42rem 0; }

/* --------------------------------------------------------------------------
   Site bar
   -------------------------------------------------------------------------- */

.sitebar {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  gap: 1.25rem;
  min-height: 64px;
  padding: .55rem max(1.25rem, calc((100vw - var(--shell)) / 2));
  border-bottom: 1px solid var(--line);
  background: rgba(7, 5, 18, .78);
  backdrop-filter: saturate(170%) blur(18px);
  -webkit-backdrop-filter: saturate(170%) blur(18px);
  transition: min-height .28s ease, background-color .28s ease, box-shadow .28s ease;
}
.sitebar[data-scrolled="true"] {
  min-height: 54px;
  background: rgba(7, 5, 18, .93);
  box-shadow: 0 10px 34px rgba(0, 0, 0, .42);
}

.brand {
  display: flex;
  align-items: center;
  gap: .65rem;
  color: var(--ink);
  text-decoration: none;
  font-family: var(--display);
  font-weight: 650;
  font-size: 1.02rem;
  text-transform: uppercase;
  letter-spacing: .1em;
  white-space: nowrap;
}
.brand img { width: 30px; height: 30px; transition: transform .5s cubic-bezier(.2, .8, .2, 1); }
.brand:hover { color: var(--cyan-2); }
.brand:hover img { transform: rotate(180deg); }

.sitebar nav { display: flex; flex-wrap: wrap; gap: .1rem; margin-left: auto; }
.sitebar nav a {
  position: relative;
  padding: .45rem .72rem;
  border-radius: var(--r-sm);
  color: var(--muted);
  text-decoration: none;
  font-family: var(--display);
  font-size: .84rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: var(--track-caps);
  white-space: nowrap;
  transition: color .18s ease, background-color .18s ease;
}
.sitebar nav a::after {
  content: "";
  position: absolute;
  left: .72rem; right: .72rem; bottom: .16rem;
  height: 1.5px;
  background: var(--cyan);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .28s cubic-bezier(.2, .8, .2, 1);
}
.sitebar nav a:hover { color: var(--ink); }
.sitebar nav a:hover::after { transform: scaleX(1); }
.sitebar nav a[aria-current="page"] {
  color: var(--cyan-2);
  background: var(--accent-dim);
}
.sitebar nav a[aria-current="page"]::after { transform: scaleX(1); }

/* Scroll progress rail under the site bar. */
.scrollrail {
  position: fixed;
  top: 0; left: 0;
  z-index: 30;
  height: 2px;
  width: 100%;
  transform: scaleX(var(--scroll-progress, 0));
  transform-origin: left;
  background: linear-gradient(90deg, var(--primary), var(--cyan), var(--blue));
  pointer-events: none;
}

/* --------------------------------------------------------------------------
   Hero
   -------------------------------------------------------------------------- */

.hero { position: relative; overflow: hidden; padding: clamp(3.6rem, 9vw, 7rem) 0 3.2rem; }
.labhead { padding: 2.5rem 0 1.4rem; }
.labhead h1 { font-size: clamp(2rem, 1.3rem + 2.6vw, 3.4rem); max-width: 24ch; }

.truthline { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: 1.6rem; }

/* Staggered entrance for the hero and page headers. Fill mode "both" means the
   finished state is the visible one, so a blocked animation never hides copy. */
@keyframes hbf-enter { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: none; } }
.hero > .eyebrow    { animation: hbf-enter .7s .05s cubic-bezier(.2,.8,.2,1) both; }
.hero > h1          { animation: hbf-enter .9s .14s cubic-bezier(.2,.8,.2,1) both; }
.hero > .lede       { animation: hbf-enter .9s .26s cubic-bezier(.2,.8,.2,1) both; }
.hero > .statband,
.hero > .buttonrow  { animation: hbf-enter .9s .38s cubic-bezier(.2,.8,.2,1) both; }
.labhead > .eyebrow { animation: hbf-enter .6s .04s ease-out both; }
.labhead > h1       { animation: hbf-enter .7s .12s ease-out both; }
.labhead > .lede    { animation: hbf-enter .7s .2s  ease-out both; }
.labhead > .truthline { animation: hbf-enter .7s .3s ease-out both; }

/* Rotating toroidal field figure behind the hero copy. */
.herofield {
  position: absolute;
  top: 40%; right: -9%;
  z-index: 0;
  width: min(40rem, 52vw);
  aspect-ratio: 1;
  transform: translateY(-50%);
  opacity: .95;
  pointer-events: none;
  /* Fade the edge nearest the copy so the rings never compete with text. */
  mask-image: radial-gradient(closest-side, #000 62%, transparent 100%),
              linear-gradient(90deg, transparent 0%, #000 34%);
  mask-composite: intersect;
  -webkit-mask-image: radial-gradient(closest-side, #000 62%, transparent 100%),
                      linear-gradient(90deg, transparent 0%, #000 34%);
  -webkit-mask-composite: source-in;
  animation: hbf-enter 1.4s .25s cubic-bezier(.2,.8,.2,1) both;
}
/* Hero copy sits above the field. */
.hero > :not(.herofield) { position: relative; z-index: 1; }
.herofield svg { width: 100%; height: 100%; overflow: visible; }
.herofield .ring { fill: none; stroke: var(--cyan); stroke-width: 1.15; opacity: .5; transform-origin: 50% 50%; }
.herofield .ring-a { animation: hbf-spin 46s linear infinite; }
.herofield .ring-b { animation: hbf-spin 62s linear infinite reverse; stroke: var(--blue); opacity: .38; }
.herofield .ring-c { animation: hbf-spin 88s linear infinite; stroke: var(--primary); opacity: .55; }
.herofield .orbit {
  fill: none;
  stroke: var(--cyan-2);
  stroke-width: 2.6;
  stroke-linecap: round;
  stroke-dasharray: 7 190;
  opacity: 1;
  filter: drop-shadow(0 0 5px currentColor);
  transform-origin: 50% 50%;
  animation: hbf-trace 7s linear infinite;
}
.herofield .orbit-2 { animation-duration: 11s; animation-delay: -3s; stroke: var(--blue); }
.herofield .orbit-3 { animation-duration: 9s;  animation-delay: -6s; stroke: var(--pink); }
.herofield .core { fill: var(--primary); opacity: .3; animation: hbf-breathe 6s ease-in-out infinite; transform-origin: 50% 50%; }

@keyframes hbf-spin   { to { transform: rotate(360deg); } }
@keyframes hbf-trace  { to { stroke-dashoffset: -195; } }
@keyframes hbf-breathe{ 0%,100% { opacity: .12; transform: scale(1); } 50% { opacity: .26; transform: scale(1.08); } }

/* --------------------------------------------------------------------------
   Badges
   -------------------------------------------------------------------------- */

.badge {
  display: inline-flex;
  align-items: center;
  gap: .42rem;
  padding: .28rem .68rem;
  border: 1px solid var(--line-2);
  border-radius: 99px;
  background: rgba(255, 255, 255, .025);
  color: var(--muted);
  font: 600 .7rem/1.5 var(--mono);
  text-transform: uppercase;
  letter-spacing: .06em;
  white-space: nowrap;
}
.badge::before {
  content: "";
  width: 5px; height: 5px;
  border-radius: 50%;
  background: currentColor;
  flex: 0 0 auto;
  box-shadow: 0 0 0 0 currentColor;
  animation: hbf-ping 3.4s ease-out infinite;
}
@keyframes hbf-ping {
  0%       { box-shadow: 0 0 0 0 currentColor; opacity: 1; }
  55%,100% { box-shadow: 0 0 0 5px transparent; opacity: .85; }
}
.badge.measured { color: var(--green);  border-color: rgba(126, 233, 171, .34); background: rgba(126, 233, 171, .07); }
.badge.modelled { color: var(--blue);   border-color: rgba(103, 230, 255, .32); background: rgba(103, 230, 255, .07); }
.badge.assumed  { color: var(--amber);  border-color: rgba(255, 207, 112, .32); background: rgba(255, 207, 112, .07); }
.badge.limit    { color: var(--violet); border-color: rgba(189, 166, 255, .34); background: rgba(189, 166, 255, .08); }
.badge.invalid  { color: var(--red);    border-color: rgba(255, 143, 158, .32); background: rgba(255, 143, 158, .07); }

/* --------------------------------------------------------------------------
   Notices
   -------------------------------------------------------------------------- */

.notice {
  margin: 1.1rem 0;
  padding: .95rem 1.15rem;
  border: 1px solid rgba(255, 207, 112, .2);
  border-left: 3px solid var(--amber);
  border-radius: 0 var(--r-md) var(--r-md) 0;
  background: rgba(255, 207, 112, .055);
  color: #f4dfb6;
  font-size: .95rem;
}
.notice strong { color: #ffe6b8; }
.notice.danger { border-color: rgba(255, 143, 158, .2); border-left-color: var(--red);   background: rgba(255, 143, 158, .055); color: #ffd4d9; }
.notice.danger strong { color: #ffe0e4; }
.notice.good   { border-color: rgba(126, 233, 171, .2); border-left-color: var(--green); background: rgba(126, 233, 171, .055); color: #c8f5db; }
.notice.good strong { color: #d8fae6; }
.notice a { color: inherit; }

/* --------------------------------------------------------------------------
   Cards
   -------------------------------------------------------------------------- */

.cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 322px), 1fr));
  gap: 1.05rem;
  margin: 1.8rem 0 3rem;
}

.card, .panel {
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: linear-gradient(158deg, rgba(31, 21, 60, .74), rgba(14, 10, 30, .92));
  box-shadow: var(--shadow);
}

.card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 250px;
  padding: 1.4rem 1.4rem 1.25rem;
  color: var(--ink);
  text-decoration: none;
  overflow: hidden;
  transition: border-color .26s ease, transform .26s cubic-bezier(.2, .8, .2, 1), box-shadow .26s ease;
}
/* Ambient glow that lifts in on hover. */
.card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(46rem 20rem at 50% -18%, rgba(124, 92, 255, .30), transparent 68%);
  opacity: 0;
  transition: opacity .3s ease;
  pointer-events: none;
}
/* Light sweep across the top edge. */
.card::before {
  content: "";
  position: absolute;
  top: 0; left: -60%;
  width: 55%; height: 1px;
  background: linear-gradient(90deg, transparent, var(--cyan), transparent);
  opacity: 0;
  pointer-events: none;
}
.card:hover, .card:focus-visible {
  border-color: rgba(166, 138, 255, .55);
  transform: translateY(-5px);
  box-shadow: var(--shadow-lg), var(--glow);
}
.card:hover::after, .card:focus-visible::after { opacity: 1; }
.card:hover::before, .card:focus-visible::before { opacity: 1; animation: hbf-sweep 1.1s cubic-bezier(.3, .7, .3, 1); }
@keyframes hbf-sweep { from { left: -60%; } to { left: 105%; } }

.card > .badge { align-self: flex-start; max-width: calc(100% - 3.4rem); }

.card h2 {
  margin: 1rem 0 .5rem;
  font-size: 1.42rem;
  font-weight: 650;
  text-transform: uppercase;
  letter-spacing: .035em;
  line-height: 1.08;
}
.card p { margin: 0; color: var(--muted); font-size: .925rem; line-height: 1.6; }
.card .go {
  margin-top: auto;
  padding-top: 1.15rem;
  color: var(--cyan-2);
  font-family: var(--display);
  font-weight: 650;
  font-size: .86rem;
  text-transform: uppercase;
  letter-spacing: var(--track-caps);
  transition: color .18s ease, letter-spacing .3s ease;
}
.card:hover .go { color: #fff; letter-spacing: .115em; }

.card .index {
  position: absolute;
  top: 1.3rem; right: 1.4rem;
  color: var(--faint); /* v7.5.2: was --line-3 (1.9:1); text needs ≥ 4.5:1 */
  font: 600 .82rem var(--mono);
  letter-spacing: .06em;
  transition: color .26s ease;
}
.card:hover .index { color: var(--cyan); }

.callout {
  padding: 1.45rem;
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: linear-gradient(158deg, rgba(31, 21, 60, .68), rgba(14, 10, 30, .9));
  transition: border-color .26s ease, transform .26s ease;
}
.callout:hover { border-color: var(--line-3); transform: translateY(-2px); }
.callout h2 { margin: .4rem 0 .65rem; font-size: 1.28rem; }
.callout p { color: var(--muted); }

/* --------------------------------------------------------------------------
   Panels and the laboratory grid
   -------------------------------------------------------------------------- */

.labgrid {
  display: grid;
  grid-template-columns: minmax(280px, 380px) minmax(0, 1fr);
  gap: 1.05rem;
  align-items: start;
  margin-bottom: 2.2rem;
}

.panel { padding: 1.2rem; }
.panel + .panel { margin-top: 1.05rem; }
.panel h2 {
  margin: .1rem 0 1rem;
  padding-bottom: .72rem;
  border-bottom: 1px solid var(--line);
  font-size: 1.08rem;
  font-weight: 650;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.panel h3 { margin: 1.4rem 0 .6rem; font-size: .9rem; color: var(--cyan-2); letter-spacing: .075em; }
.controls { position: sticky; top: 80px; }

/* --------------------------------------------------------------------------
   Forms
   -------------------------------------------------------------------------- */

.field { margin: .85rem 0; min-width: 0; }
.field label {
  display: flex;
  justify-content: space-between;
  gap: .5rem;
  margin-bottom: .34rem;
  color: var(--ink-2);
  font-size: .875rem;
  font-weight: 550;
  overflow-wrap: anywhere;
}
.field label > span { flex-shrink: 0; color: var(--faint); font: 600 .73rem var(--mono); }
.playback .field.compact label { display: block; font-size: 11px; overflow-wrap: normal; }
.playback .field.compact label > span { display: block; font-size: 10px; }
.recorded-bench .controls .field label { display: block; font-size: 12px; }
.recorded-bench .controls .field label > span { display: inline-block; margin-left: .35em; color: var(--muted); }

.field small, .help, .source-note {
  display: block;
  margin-top: .32rem;
  color: var(--faint);
  font-size: .775rem;
  line-height: 1.55;
}

input, select, textarea {
  width: 100%;
  min-height: 42px;
  padding: .55rem .72rem;
  color: var(--ink);
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  background: var(--sunken);
  transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}
input:hover, select:hover, textarea:hover { border-color: var(--line-3); }
input:focus, select:focus, textarea:focus {
  border-color: var(--cyan);
  box-shadow: 0 0 0 3px rgba(166, 138, 255, .18);
  background: #0d0920;
  outline: none;
}
input:invalid { border-color: var(--red); }
input[type=range] { padding: 0; background: transparent; border: 0; accent-color: var(--cyan); }
select { cursor: pointer; }

.row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }

.filedrop {
  padding: 1.15rem;
  border: 1px dashed rgba(166, 138, 255, .45);
  border-radius: var(--r-md);
  background: rgba(166, 138, 255, .05);
  transition: border-color .2s ease, background-color .2s ease;
}
.filedrop:hover { border-color: var(--cyan); background: rgba(166, 138, 255, .09); }

.check { display: inline-flex; align-items: center; gap: .45rem; min-height: 42px; color: var(--muted); }
.check input, .layer-grid input { width: auto; min-height: auto; accent-color: var(--cyan); }

.layer-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(165px, 1fr));
  gap: .5rem .85rem;
  margin: 1.1rem 0 0;
  padding: .9rem 1rem;
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  background: rgba(10, 7, 24, .55);
}
.layer-grid legend { padding: 0 .4rem; color: var(--cyan-2); font-weight: 650; font-size: .82rem; text-transform: uppercase; letter-spacing: .07em; }
.layer-grid label { display: flex; align-items: center; gap: .45rem; color: var(--muted); font-size: .82rem; }

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */

.buttonrow { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1.1rem 0 0; }

button, .button {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: .45rem;
  min-height: 42px;
  padding: .55rem 1.05rem;
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  color: var(--ink);
  background: var(--panel-2);
  cursor: pointer;
  text-decoration: none;
  overflow: hidden;
  font-family: var(--display);
  font-size: .86rem;
  font-weight: 650;
  text-transform: uppercase;
  letter-spacing: var(--track-caps);
  transition: background-color .18s ease, border-color .18s ease, transform .12s ease, color .18s ease;
}
/* Shine sweep on hover. */
button::after, .button::after {
  content: "";
  position: absolute;
  top: 0; left: -120%;
  width: 45%; height: 100%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .17), transparent);
  transform: skewX(-18deg);
  pointer-events: none;
}
button:hover::after, .button:hover::after { animation: hbf-shine .8s ease; }
@keyframes hbf-shine { from { left: -120%; } to { left: 145%; } }

button:hover, .button:hover { border-color: rgba(166, 138, 255, .6); background: var(--panel-3); color: #fff; }
button:active, .button:active { transform: translateY(1px); }

button.primary, .button.primary {
  color: #fff;
  border-color: var(--primary-2);
  /* v7.5.2: darker fill so white text meets WCAG AA (≥ 4.76:1 on both stops). */
  background: linear-gradient(180deg, var(--primary-fill), var(--primary-fill-2));
  box-shadow: 0 1px 0 rgba(255, 255, 255, .2) inset, 0 8px 22px rgba(124, 92, 255, .3);
}
button.primary:hover, .button.primary:hover {
  color: #fff;
  background: linear-gradient(180deg, var(--primary-fill-hover), var(--primary-fill-hover-2));
  box-shadow: 0 1px 0 rgba(255, 255, 255, .24) inset, 0 12px 30px rgba(124, 92, 255, .42);
}
button:disabled { opacity: .4; cursor: not-allowed; transform: none; }
button:disabled:hover { border-color: var(--line-2); background: var(--panel-2); color: var(--ink); }
button:disabled::after { display: none; }

/* --------------------------------------------------------------------------
   Metrics
   -------------------------------------------------------------------------- */

.metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: .7rem;
  margin: .95rem 0;
}
.metric {
  padding: .85rem .9rem;
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  background: rgba(10, 7, 24, .6);
  transition: border-color .22s ease;
}
.metric:hover { border-color: var(--line-3); }
.metric .label {
  color: var(--muted);
  font-size: .72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .07em;
}
.metric .value {
  margin-top: .24rem;
  font: 700 clamp(1.05rem, 2.4vw, 1.5rem)/1.24 var(--mono);
  font-variant-numeric: tabular-nums;
  letter-spacing: -.02em;
  word-break: break-word;
}
.metric .unit { color: var(--cyan-2); font-size: .72rem; font-family: var(--mono); }
.process-value { font-size: 1rem !important; }

/* --------------------------------------------------------------------------
   Tables, details, charts
   -------------------------------------------------------------------------- */

.tablewrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r-md); background: rgba(10, 7, 24, .45); }
table { width: 100%; border-collapse: collapse; font-size: .86rem; }
th, td { padding: .64rem .78rem; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
th {
  color: var(--cyan-2);
  background: #17102c;
  font-family: var(--display);
  font-weight: 650;
  font-size: .76rem;
  text-transform: uppercase;
  letter-spacing: .1em;
}
td { font-variant-numeric: tabular-nums; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr { transition: background-color .16s ease; }
tbody tr:hover td { background: rgba(166, 138, 255, .05); }
table caption { padding: .68rem .78rem; color: var(--muted); text-align: left; font-size: .78rem; }

details {
  margin: .8rem 0;
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  background: rgba(10, 7, 24, .48);
  overflow: hidden;
}
summary {
  cursor: pointer;
  padding: .72rem .88rem;
  color: var(--cyan-2);
  font-family: var(--display);
  font-weight: 650;
  font-size: .88rem;
  text-transform: uppercase;
  letter-spacing: .06em;
  list-style-position: inside;
  transition: background-color .18s ease;
}
summary:hover { background: rgba(166, 138, 255, .07); }
details[open] summary { border-bottom: 1px solid var(--line); }
details > :not(summary) { margin-inline: .88rem; }

.chart {
  width: 100%;
  min-height: 280px;
  margin: .8rem 0;
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  background: var(--sunken);
  overflow: hidden;
}
.chart svg { display: block; width: 100%; height: auto; }
canvas.chart { display: block; height: auto; }

.warnings { margin: .85rem 0; padding-left: 1.25rem; color: #ffd8a8; font-size: .9rem; }
.warnings li { margin: .3rem 0; }
.status { min-height: 1.5em; color: var(--muted); font-size: .86rem; }

/* --------------------------------------------------------------------------
   3D viewer and playback
   -------------------------------------------------------------------------- */

#viewer { position: relative; overflow: auto; }
.imagecanvas { display: block; max-width: 100%; height: auto; background: #ddd; border-radius: var(--r-md); }
.overlay { position: absolute; inset: 0; pointer-events: none; max-width: 100%; height: auto; }

.viewer-title { display: flex; justify-content: space-between; align-items: start; gap: 1rem; }
.viewer-title h2 { margin-bottom: .25rem; }
.science-viewer { margin: 0; }
.science-viewer figcaption {
  padding: .72rem .9rem;
  color: var(--muted);
  border: 1px solid var(--line);
  border-top: 0;
  border-radius: 0 0 var(--r-md) var(--r-md);
  font-size: .78rem;
  line-height: 1.55;
}
.science-3d-host {
  position: relative;
  width: 100%;
  height: clamp(420px, 62vh, 720px);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--r-md) var(--r-md) 0 0;
  background: #06040f;
  touch-action: none;
}
.science-3d-host.compact-viewer { height: clamp(380px, 52svh, 620px); }
.science-3d-host[data-stale="true"] { opacity: .56; }
.panel[data-stale="true"] { border-color: rgba(255, 207, 112, .6); box-shadow: inset 0 0 0 1px rgba(255, 207, 112, .18); }
.science-3d-canvas { display: block; width: 100%; height: 100%; }
.viewer-fallback {
  display: grid;
  place-content: center;
  min-height: 100%;
  padding: 2rem;
  text-align: center;
  color: var(--muted);
  background: radial-gradient(circle, rgba(166, 138, 255, .09), transparent 55%);
}
.viewer-fallback strong { color: var(--ink); }

.playback {
  display: grid;
  grid-template-columns: repeat(5, auto) minmax(150px, 1fr) minmax(90px, 120px) auto;
  gap: .45rem;
  align-items: end;
  margin-top: .85rem;
}
.playback button { min-width: 44px; padding-inline: .55rem; }
.playback .field { margin: 0; }
.playback-slider { min-width: 150px; }
.compact { min-width: 90px; }

.reactor-workbench {
  display: grid;
  grid-template-columns: minmax(275px, 330px) minmax(440px, 1fr) minmax(240px, 285px);
  gap: 1rem;
  align-items: start;
  margin: 1rem 0 2rem;
}
.reactor-controls { position: sticky; top: 80px; max-height: calc(100vh - 95px); overflow: auto; scrollbar-gutter: stable; }
.reactor-view-panel { min-width: 0; }
.reactor-live-rail { position: sticky; top: 80px; }

/* --------------------------------------------------------------------------
   Home page components
   -------------------------------------------------------------------------- */

.statband {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 195px), 1fr));
  gap: 1px;
  margin: 2.4rem 0 0;
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  background: var(--line);
  overflow: hidden;
}
.statband > div {
  position: relative;
  padding: 1.25rem 1.3rem;
  background: linear-gradient(160deg, rgba(24, 16, 48, .82), rgba(11, 8, 25, .95));
  transition: background-color .26s ease;
}
.statband > div::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 2px;
  background: linear-gradient(90deg, var(--primary), transparent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .5s cubic-bezier(.2, .8, .2, 1);
}
.statband > div:hover::before { transform: scaleX(1); }
.statband dt {
  color: var(--muted);
  font-family: var(--display);
  font-size: .74rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .12em;
}
.statband dd {
  margin: .4rem 0 0;
  font: 700 1.72rem/1.1 var(--mono);
  font-variant-numeric: tabular-nums;
  letter-spacing: -.035em;
  color: var(--ink);
}
.statband dd small {
  display: block;
  margin-top: .38rem;
  color: var(--faint);
  font: 500 .775rem/1.5 var(--sans);
  letter-spacing: 0;
}

.sectionhead { margin: 3.6rem 0 1.5rem; }
.sectionhead h2 { margin: 0 0 .55rem; }
.sectionhead p { max-width: 66ch; margin: 0; color: var(--muted); font-size: 1rem; }

.spec {
  margin: 1rem 0 0;
  padding: .85rem 0 0;
  border-top: 1px solid var(--line);
  display: grid;
  gap: .38rem;
}
.spec div { display: flex; justify-content: space-between; gap: .8rem; font-size: .78rem; }
.spec dt { color: var(--faint); text-transform: uppercase; letter-spacing: .06em; font-size: .715rem; }
.spec dd { margin: 0; color: var(--ink-2); font-family: var(--mono); font-size: .755rem; text-align: right; }

.methodlist { display: grid; gap: .1rem; margin: 1.6rem 0 0; padding: 0; list-style: none; }
.methodlist li {
  display: grid;
  grid-template-columns: minmax(0, 15rem) minmax(0, 1fr);
  gap: .4rem 1.7rem;
  padding: 1.1rem 0;
  border-top: 1px solid var(--line);
  transition: border-color .24s ease;
}
.methodlist li:hover { border-top-color: var(--line-3); }
.methodlist li > strong {
  color: var(--ink);
  font-family: var(--display);
  font-weight: 650;
  font-size: 1rem;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.methodlist li > span { color: var(--muted); font-size: .92rem; line-height: 1.62; }

.equation {
  margin: 1rem 0;
  padding: .95rem 1.15rem;
  border: 1px solid var(--line);
  border-left: 3px solid var(--cyan);
  border-radius: 0 var(--r-sm) var(--r-sm) 0;
  background: var(--sunken);
  color: var(--cyan-2);
  font: 500 .95rem/1.75 var(--mono);
  overflow-x: auto;
}

/* --------------------------------------------------------------------------
   Scroll reveal — inert until the motion script marks the document ready,
   so the page is fully readable when JavaScript is blocked.
   -------------------------------------------------------------------------- */

[data-motion="on"] [data-reveal] {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity .68s cubic-bezier(.2, .8, .2, 1), transform .68s cubic-bezier(.2, .8, .2, 1);
  transition-delay: var(--reveal-delay, 0ms);
}
[data-motion="on"] [data-reveal].in { opacity: 1; transform: none; }

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */

footer {
  position: relative;
  margin-top: 4.2rem;
  padding: 2.2rem 0 3.6rem;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: .86rem;
}
footer::before {
  content: "";
  position: absolute;
  top: -1px; left: 0;
  width: 100%; height: 1px;
  background: linear-gradient(90deg, transparent, var(--cyan), transparent);
  opacity: .45;
}
footer nav { display: flex; flex-wrap: wrap; gap: .3rem; margin-bottom: 1.15rem; }
footer nav a {
  padding: .35rem .7rem .35rem 0;
  margin-right: .5rem;
  color: var(--ink-2);
  text-decoration: none;
  font-family: var(--display);
  font-weight: 600;
  font-size: .84rem;
  text-transform: uppercase;
  letter-spacing: var(--track-caps);
}
footer nav a:hover { color: var(--cyan-2); }
footer p { max-width: 78ch; margin: 0; color: var(--faint); line-height: 1.68; }

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 1100px) {
  .reactor-workbench { grid-template-columns: 1fr; }
  .reactor-controls, .reactor-live-rail { position: static; max-height: none; overflow: visible; }
  .reactor-view-panel { grid-row: 2; }
  .reactor-live-rail { grid-row: 3; }
  .herofield { opacity: .3; right: -22%; }
}

@media (max-width: 980px) {
  .sitebar { align-items: flex-start; flex-wrap: wrap; gap: .5rem; }
  .sitebar nav {
    width: 100%;
    margin-left: 0;
    overflow-x: auto;
    flex-wrap: nowrap;
    padding-bottom: .25rem;
    -webkit-overflow-scrolling: touch;
  }
  .sitebar[data-scrolled="true"] { min-height: 0; }
  .labgrid { grid-template-columns: 1fr; }
  .controls { position: static; }
  .three { grid-template-columns: 1fr; }
  .playback { grid-template-columns: repeat(5, 1fr); }
  .playback-slider { grid-column: 1 / -1; }
  .playback .compact, .playback .check { grid-column: span 2; }
  .methodlist li { grid-template-columns: 1fr; gap: .3rem; }
}

@media (max-width: 640px) {
  .row, .two { grid-template-columns: 1fr; }
  .hero, .labhead, main, footer { width: min(100% - 1.6rem, var(--shell)); }
  .hero { padding: 2.8rem 0 2.2rem; }
  .herofield { display: none; }
  .panel { padding: .95rem; }
  .card { padding: 1.2rem; min-height: 0; }
  .science-3d-host { height: clamp(320px, 56svh, 520px); }
  .viewer-title { display: block; }
  .statband dd { font-size: 1.42rem; }
  .sectionhead { margin-top: 2.8rem; }
  body::after { background-size: 56px 56px; }
}

@media (max-width: 380px) {
  body { font-size: 15px; }
  .hero, .labhead, main, footer { width: calc(100% - 1.1rem); }
  .brand { font-size: .88rem; letter-spacing: .07em; }
  .brand img { width: 26px; height: 26px; }
}

/* --------------------------------------------------------------------------
   Print and motion preferences
   -------------------------------------------------------------------------- */

@media print {
  :root { color-scheme: light; }
  body { color: #111; background: #fff; }
  body::before, body::after, .herofield, .scrollrail { display: none !important; }
  .sitebar, .controls, .buttonrow { display: none !important; }
  .labgrid { display: block; }
  .panel, .card { box-shadow: none; border-color: #888; background: #fff; break-inside: avoid; }
  .metric { background: #fff; border-color: #aaa; }
  a { color: #111; }
  .science-3d-host { display: none; }
  .science-viewer figcaption { border: 1px solid #888; }
  [data-motion="on"] [data-reveal] { opacity: 1 !important; transform: none !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
  body::before { animation: none; }
  .card:hover { transform: none; }
  .herofield { display: none; }
  [data-motion="on"] [data-reveal] { opacity: 1 !important; transform: none !important; }
}


/* --------------------------------------------------------------------------
   Collaboration call to action, profile, timeline and evidence components
   -------------------------------------------------------------------------- */

/* Primary action in the site bar. */
.sitebar .cta {
  margin-left: .55rem;
  padding: .44rem .95rem;
  border: 1px solid var(--primary-2);
  border-radius: var(--r-sm);
  background: linear-gradient(180deg, var(--primary-fill), var(--primary-fill-2));
  color: #fff;
  box-shadow: 0 6px 18px rgba(124, 92, 255, .3);
}
.sitebar .cta::after { display: none; }
.sitebar .cta:hover { color: #fff; background: linear-gradient(180deg, var(--primary-fill-hover), var(--primary-fill-hover-2)); border-color: var(--violet); }
.sitebar nav a.cta[aria-current="page"] { color: #fff; background: linear-gradient(180deg, var(--primary-fill-hover), var(--primary-fill-hover-2)); border-color: var(--violet); }

/* Contact panel */
.contactcard {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1.4rem 2rem;
  align-items: center;
  margin: 2rem 0 0;
  padding: 1.6rem 1.75rem;
  border: 1px solid var(--line-2);
  border-radius: var(--r-lg);
  background:
    radial-gradient(38rem 16rem at 8% 0%, rgba(124, 92, 255, .18), transparent 70%),
    linear-gradient(158deg, rgba(31, 21, 60, .82), rgba(14, 10, 30, .94));
}
.contactcard h2 { margin: .3rem 0 .5rem; font-size: 1.35rem; }
.contactcard p { margin: 0; color: var(--muted); max-width: 60ch; }
.contactcard .who { margin-top: .9rem; color: var(--ink-2); font-size: .95rem; }
.contactcard .who strong { color: var(--ink); }
.contactcard a.mail {
  font-family: var(--mono);
  font-size: .95rem;
  color: var(--cyan-2);
  overflow-wrap: anywhere;
}
.contactcard .actions { display: flex; flex-direction: column; gap: .55rem; }

/* Profile header */
.profile { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1.6rem; align-items: start; margin-bottom: 1.4rem; }
.profile .mark {
  display: grid;
  place-items: center;
  width: 92px; height: 92px;
  border: 1px solid var(--line-2);
  border-radius: var(--r-lg);
  background: linear-gradient(158deg, rgba(124, 92, 255, .3), rgba(14, 10, 30, .9));
  font: 650 2rem/1 var(--display);
  letter-spacing: .04em;
  color: var(--cyan-2);
}

/* Definition rows for responsibilities, deliverables, contributions */
.deflist { display: grid; gap: .1rem; margin: 1.2rem 0 0; padding: 0; }
.deflist > div {
  display: grid;
  grid-template-columns: minmax(0, 13rem) minmax(0, 1fr);
  gap: .35rem 1.7rem;
  padding: .95rem 0;
  border-top: 1px solid var(--line);
}
.deflist dt {
  color: var(--ink);
  font-family: var(--display);
  font-weight: 650;
  font-size: .93rem;
  text-transform: uppercase;
  letter-spacing: .055em;
}
.deflist dd { margin: 0; color: var(--muted); font-size: .93rem; line-height: 1.62; }

/* Phase timeline */
.timeline { margin: 1.5rem 0 0; padding: 0 0 0 1.9rem; list-style: none; border-left: 1px solid var(--line-2); }
.timeline li { position: relative; padding: 0 0 1.7rem .35rem; }
.timeline li:last-child { padding-bottom: 0; }
.timeline li::before {
  content: "";
  position: absolute;
  left: -2.28rem; top: .42rem;
  width: 9px; height: 9px;
  border: 2px solid var(--primary);
  border-radius: 50%;
  background: var(--bg);
}
.timeline .when {
  display: block;
  color: var(--cyan);
  font: 600 .7rem/1.6 var(--mono);
  text-transform: uppercase;
  letter-spacing: .16em;
}
.timeline .what {
  display: block;
  margin: .2rem 0 .3rem;
  color: var(--ink);
  font-family: var(--display);
  font-weight: 650;
  font-size: 1.02rem;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.timeline p { margin: 0; color: var(--muted); font-size: .92rem; line-height: 1.6; }

/* Numeric result emphasis inside tables */
.num { font-family: var(--mono); font-variant-numeric: tabular-nums; white-space: nowrap; }
.pass { color: var(--green); font-weight: 650; }
.drift { color: var(--amber); font-weight: 650; }

/* File / hash list */
.filelist { margin: 1rem 0 0; padding: 0; list-style: none; display: grid; gap: .1rem; }
.filelist li { padding: .7rem 0; border-top: 1px solid var(--line); }
.filelist code { display: inline-block; background: none; padding: 0; color: var(--cyan-2); font-size: .86rem; }
.filelist .hash { display: block; margin-top: .22rem; color: var(--faint); font: .715rem/1.5 var(--mono); overflow-wrap: anywhere; }
/* v7.5.3 (release candidate rc2 acceptance, a11y phase): a long record path in a list, such as the evidence register's
   docs/v753-verification/browser/acceptance-report.json link, wraps instead of widening a 320 px page. */
main li code, main li a { overflow-wrap: anywhere; }
/* v7.5.3 (V05 R-05): the Method and Studies links under each laboratory in a table header are at least 24 CSS px tall
   (WCAG 2.2 SC 2.5.8 target size), also at 320 px. */
th[scope="row"] .help a { display: inline-block; min-height: 24px; line-height: 24px; }

@media (max-width: 860px) {
  .contactcard { grid-template-columns: 1fr; }
  .contactcard .actions { flex-direction: row; flex-wrap: wrap; }
  .deflist > div { grid-template-columns: 1fr; gap: .25rem; }
  .profile { grid-template-columns: 1fr; gap: 1rem; }
}
@media (max-width: 640px) {
  .sitebar .cta { margin-left: 0; }
}

/* Secondary contact address under the primary one. */
.contactcard .who .alt { display: block; margin-top: .35rem; color: var(--faint); font-size: .86rem; }
.contactcard .who .alt a { color: var(--muted); }
.contactcard .who .alt a:hover { color: var(--cyan-2); }
/* Controls wrap to their panel, including intermediate desktop widths. */
[hidden]{display:none!important} .playback{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.playback-slider{flex:1 1 180px}.playback .compact{flex:0 0 100px}.panel,.reactor-live-rail,.reactor-controls{min-width:0}.science-3d-host{touch-action:none} .sitebar nav a{font-size:14px}

/* v7.2: original machines, working surfaces and compact scientific controls. */
.live-input-bar{padding:12px;border:1px solid #275462;border-radius:10px;margin-bottom:12px;background:#102532}.live-input-bar small{display:block;font-size:14px;color:#b6c7ce}.live-input-bar .buttonrow{margin:8px 0}.scene-tools{margin-top:12px;border-top:1px solid #28444e;padding-top:12px}.scene-tools button{font-size:14px}.scene-inspector{padding:12px 0}.live-3d-panel .science-3d-host{height:440px}.science-3d-host[data-stale=true]{opacity:.5}.live-3d-panel .playback label{font-size:14px}.live-3d-panel .playback-slider input{display:block;width:100%}.panel:fullscreen{overflow:auto;background:#071016;padding:20px}.panel:fullscreen .science-3d-host{height:70vh}.labhead{padding-top:24px;padding-bottom:20px}.labhead h1{margin:8px 0 10px}.labhead .lede{max-width:1050px}.labhead .truthline{margin-top:12px}.immersive-lab .labhead .lede{font-size:16px;line-height:1.5}.immersive-lab .labhead{padding:14px 28px}.immersive-lab .labhead h1{font-size:30px}.immersive-lab .labhead .eyebrow{margin:0}.immersive-lab main{max-width:none;padding:0 24px 32px}.immersive-lab .reactor-workbench{grid-template-columns:290px minmax(0,1fr) 230px;gap:14px;align-items:start}.immersive-lab .reactor-controls{max-height:910px;overflow:auto;position:static}.immersive-lab .science-3d-host{height:520px}.immersive-lab .reactor-view-panel{padding:16px}.immersive-lab .reactor-live-rail .panel{padding:14px}.immersive-lab .viewer-title{align-items:start}.immersive-lab .viewer-title h2{font-size:20px}.immersive-lab .metrics{grid-template-columns:repeat(auto-fit,minmax(135px,1fr))}.immersive-lab .reactor-workbench .metric .value{font-size:22px}
@media(max-width:1250px){.immersive-lab .reactor-workbench{grid-template-columns:270px minmax(0,1fr)}.immersive-lab .reactor-live-rail{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}}
@media(max-width:850px){.immersive-lab .reactor-workbench{grid-template-columns:1fr}.immersive-lab .reactor-view-panel{grid-row:1}.immersive-lab .reactor-controls{max-height:none}.immersive-lab .reactor-live-rail{grid-template-columns:1fr}.immersive-lab main{padding:0 12px}.immersive-lab .science-3d-host,.live-3d-panel .science-3d-host{height:360px}}

.immersive-lab main{width:calc(100% - 32px);margin:0 auto;padding:0 0 32px}.immersive-lab .labhead{width:calc(100% - 32px);max-width:none;margin:auto;padding:12px 0}.immersive-lab .labhead .lede{margin:6px 0}.immersive-lab .truthline{margin:8px 0}.immersive-lab main>details.notice{padding:10px 16px;margin:0 0 12px}.immersive-lab .reactor-workbench{grid-template-columns:280px minmax(0,1fr)}.immersive-lab .reactor-live-rail{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.immersive-lab .runIdentity{overflow-wrap:anywhere}.immersive-lab .viewer-title .source-note{max-width:600px}.immersive-lab .scene-tools{margin-top:10px}.immersive-lab .science-3d-host{height:470px}@media(max-width:850px){.immersive-lab .reactor-workbench{grid-template-columns:1fr}.immersive-lab .reactor-live-rail{grid-template-columns:1fr}.immersive-lab .science-3d-host{height:360px}}
/* Put the experiment, controls and 3D view ahead of long documentation. */
.labhead{padding-top:14px;padding-bottom:14px}.labhead h1{font-size:clamp(28px,3vw,38px);line-height:1.2}.labhead .lede{font-size:16px;line-height:1.5;margin:10px 0}.labhead .eyebrow{margin:0}.labhead .truthline{margin:10px 0 0}main>.notice{margin-bottom:14px;padding:14px 18px}.labgrid{grid-template-columns:310px minmax(0,1fr)}.labgrid>.controls{min-width:0}.live-3d-panel .source-note{margin:8px 0;font-size:14px}.live-3d-panel .science-3d-host{height:400px}.viewer-title .source-note{margin:4px 0}.scene-inspector select{max-width:100%}@media(max-width:850px){.labgrid{grid-template-columns:1fr}.labgrid>.controls{order:2}.labgrid>div{order:1}.live-3d-panel .science-3d-host{height:330px}}

.metrics{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.metric .value{font-size:clamp(17px,1.6vw,24px);overflow-wrap:normal;word-break:normal}.metric .label,.metric .unit{font-size:14px}

.download-receipt{position:relative;z-index:1;display:flex;align-items:center;gap:12px;flex-wrap:wrap;max-width:100%;margin:12px;padding:12px 18px;background:#132e39;border:1px solid #5ee5d0;border-radius:8px;font-size:13px;overflow-wrap:anywhere}
.download-receipt a{flex:1;min-width:0}.download-receipt button{flex:none}
.hbf-workspace:has(.workspace-timeline>.download-receipt){grid-template-rows:64px 24px minmax(0,1fr) auto}
.workspace-timeline:has(>.download-receipt){max-height:40dvh;min-height:122px}
.workspace-timeline>.download-receipt{margin:6px 0 0;padding:8px 12px}
@media(max-width:850px){.hbf-workspace:has(.workspace-timeline>.download-receipt){grid-template-rows:88px 24px minmax(0,1fr) auto}.workspace-timeline:has(>.download-receipt){min-height:142px}}
.study-results-table{max-width:100%;overflow:auto;margin:16px 0}.study-results-table caption{text-align:left;font-weight:700;padding:8px}.study-results-table th,.study-results-table td{vertical-align:top;overflow-wrap:anywhere;min-width:90px}.study-results-table [data-qualifier="false"]{font-weight:700;color:#ffca80}

.metric .long-value{overflow-wrap:anywhere;word-break:break-word;font-size:14px;line-height:1.45}.labgrid>div{min-width:0}

/* Startup is visible before the scientific module graph has loaded. */
:root{--hbf-release:7.5.3}.science-3d-host{--hbf-viewer-layout:1}
.lab-startup{width:min(1240px,calc(100% - 2rem));margin:12px auto;padding:10px 14px;border:1px solid var(--line);border-left:4px solid var(--cyan);border-radius:8px;background:var(--panel);font-size:14px}
.lab-startup p{margin:0;overflow-wrap:anywhere}.lab-startup .buttonrow{margin:8px 0 0}.lab-startup button{font-size:14px;min-height:36px;padding:6px 10px}.lab-startup[data-state=error],.lab-startup[data-state=slow]{border-left-color:var(--red)}
.check{display:flex;align-items:center;gap:8px;font-size:14px}.check input[type=checkbox],.live-input-bar input[type=checkbox]{width:18px;height:18px;min-height:18px;flex:0 0 18px;margin:0;padding:0;accent-color:var(--cyan)}
.science-3d-host,.live-3d-panel,.reactor-view-panel{scroll-margin-top:90px}
.live-input-bar textarea,.live-input-bar input[type=file],.experiment-diff{font-size:14px}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* v7.4: preserve the purple instrument workspace shown in the supplied recording. */
.recorded-workspace,.recorded-bench{--bg:#070512;--bg-2:#0b0819;--panel:#130d26;--panel-2:#181040;--ink:#ede9f9;--muted:#b7afd6;--line:#2a1f52;--cyan:#a68aff;--cyan-2:#d5c6ff;--blue:#67e6ff;background:#070512;color:#ede9f9}
.recorded-workspace .panel,.recorded-bench .panel{background:linear-gradient(145deg,#18102cf7,#0c091cf5);border-color:#352653;border-radius:12px}
.recorded-workspace input,.recorded-workspace select,.recorded-bench input,.recorded-bench select{background:#0b0819;border-color:#3b2d5e;color:#ede9f9;min-height:34px;padding:6px 8px;font-size:13px}
.recorded-workspace button,.recorded-bench button{min-height:34px;padding:6px 10px;font-size:12px;background:#21163b;border-color:#44315f}
.recorded-workspace button.primary,.recorded-bench button.primary{background:var(--primary-fill-hover);color:#fff}
.recorded-workspace .live-input-bar,.recorded-bench .live-input-bar{background:#1b1234;border-color:#3b2d5e}
.recorded-workspace{height:100dvh;overflow:hidden;font-size:13px}
.hbf-workspace{position:fixed;inset:0;z-index:30;background:#090713;display:grid;grid-template-rows:56px 28px 1fr 86px;isolation:isolate}
.hbf-workspace-header{grid-row:1;display:flex;align-items:center;gap:18px;padding:8px 14px;background:#160c29;border-bottom:1px solid #392448;z-index:4;min-width:0}
.workspace-brand{font-weight:750;font-size:14px;color:#f1ebff;white-space:nowrap;text-decoration:none}
.workspace-tabs{display:flex;gap:4px;flex:1;overflow-x:auto;min-width:0}
.workspace-tabs button{background:transparent;border-color:transparent;white-space:nowrap}
.workspace-tabs button[aria-pressed=true],.bench-tabs button[aria-pressed=true]{background:#714cd4;border-color:#a68aff;color:#fff}
.workspace-utility{display:flex;gap:6px;align-items:center}.workspace-utility select{max-width:145px}.quality-note{max-width:88px;font-size:10px;color:#b7afd6}
.workspace-boundary{grid-row:2;z-index:4;background:#372813;color:#ffdc9e;font-size:11px;padding:5px 14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hbf-stage.panel{grid-row:3;position:relative;padding:0;margin:0;border:0;border-radius:0;overflow:hidden;min-height:0;background:#0d1020}
.recorded-workspace .hbf-stage .science-3d-host{position:absolute;inset:0;height:100%!important;min-height:0;width:100%;border:0;border-radius:0;margin:0;scroll-margin:0}
.workspace-drawer{position:absolute;z-index:5;top:94px;bottom:100px;left:12px;width:330px;max-width:calc(100vw - 24px);overflow:auto;padding:9px;background:#100c20f2;border:1px solid #47335f;border-radius:12px;box-shadow:0 12px 40px #0007;scrollbar-width:thin}
.workspace-drawer:has([data-mode-panel=Compare]:not([hidden])),.workspace-drawer:has([data-mode-panel=Energy]:not([hidden])){width:min(670px,calc(100vw - 210px))}
.workspace-pane>.panel{margin:8px 0}.workspace-close{position:sticky;top:0;z-index:2;float:right;margin:0 0 8px 8px}.workspace-pane>h2{clear:both}
.recorded-workspace .workspace-controls{position:static;max-height:none;overflow:visible;width:auto;scrollbar-gutter:auto}.workspace-controls>.panel{padding:10px}.workspace-controls .field{margin:9px 0}.workspace-controls .field label{font-size:12px}.workspace-controls .help,.workspace-controls small,.workspace-controls .live-input-bar small{font-size:11px}.workspace-controls .buttonrow{gap:5px}
.recorded-workspace .workspace-drawer .labhead{width:auto;padding:12px 0}.workspace-drawer .labhead :is(h1,h2){font-size:22px}.workspace-drawer .labhead .lede{font-size:13px}.workspace-drawer .lab-startup{width:auto;margin:12px 0}.workspace-drawer .sitebar{position:static}.workspace-pane .layer-grid{grid-template-columns:1fr;margin-top:10px}.workspace-pane figcaption{font-size:12px;color:#b7afd6}
.workspace-camera{position:absolute;z-index:3;right:14px;top:100px;width:150px;display:grid;gap:6px}.workspace-camera button{background:#130e26de;box-shadow:0 3px 8px #0004;justify-content:flex-start;font-size:11px;min-height:31px}
.workspace-assembly{position:absolute;z-index:3;bottom:98px;left:14px;width:300px;max-height:45vh;overflow:auto;background:#130e26ed;margin:0;box-shadow:0 5px 20px #0006}.workspace-assembly .scene-tools{margin:0;padding:0;border:0}.workspace-assembly summary{font-size:12px;padding:8px 10px}.workspace-assembly .buttonrow{margin:8px 0}.workspace-assembly .scene-inspector{padding:8px 0}.workspace-assembly .scene-inspector label{font-size:12px}.workspace-drawer:not([hidden])~.workspace-assembly{left:355px}
.workspace-hud{position:absolute;z-index:2;top:98px;left:50%;transform:translateX(-50%);background:#110b22c9;border:1px solid #56407799;border-radius:7px;padding:6px 10px;color:#ddd1f6;white-space:nowrap;max-width:calc(100% - 380px);font:11px ui-monospace,monospace;overflow:hidden;text-overflow:ellipsis;pointer-events:none}
.workspace-timeline{grid-row:4;z-index:4;background:#130c22;border-top:1px solid #3d2853;padding:8px 14px;overflow:auto}.workspace-timeline .playback{margin:0;gap:7px;flex-wrap:nowrap}.workspace-timeline .playback button{min-width:32px;padding:5px 8px}.workspace-timeline .playback .compact{flex-basis:70px}.workspace-timeline .playback .field label{font-size:10px;margin:0}.workspace-timeline input[type=range]{min-height:24px;padding:0}.workspace-timeline .check{font-size:11px}.timeline-status{display:block;margin-top:4px;color:#a99abb;font-size:10px}
.recorded-workspace .metric{padding:9px;background:#0a071899}.recorded-workspace .metric .value{font-size:18px}.recorded-workspace .metric .label,.recorded-workspace .metric .unit{font-size:11px}.recorded-workspace .metrics{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.recorded-workspace .chart{background:#0b0819}.recorded-workspace .tablewrap{max-width:100%}.recorded-workspace table{font-size:11px}
.recorded-bench .sitebar{background:#130b24;border-color:#2a1f52;min-height:50px;padding:5px max(14px,calc((100vw - 1280px)/2))}.recorded-bench .sitebar nav a{font-size:12px}.recorded-bench .labhead{width:min(1280px,calc(100% - 28px));padding:12px 0}.recorded-bench .labhead h1{font-size:24px}.recorded-bench .labhead .lede{font-size:13px;max-width:1000px;margin:5px 0}.recorded-bench .labhead .eyebrow{font-size:10px}.recorded-bench .truthline{margin:6px 0}.recorded-bench main{width:min(1280px,calc(100% - 28px))}.recorded-bench .labgrid{grid-template-columns:340px minmax(0,1fr);gap:18px}.recorded-bench .controls{top:60px}.recorded-bench .panel h2{font-size:17px}.recorded-bench .lab-startup[data-state=ready]{font-size:11px;padding:6px 10px;margin:6px auto}.recorded-bench .lab-startup[data-state=ready] .buttonrow{margin:4px 0 0}.recorded-bench .lab-startup[data-state=ready] button{font-size:10px;min-height:26px}.bench-tabs{display:flex;flex-wrap:wrap;gap:5px;margin:0 0 12px;padding:8px;background:#130b24;border:1px solid #2a1f52;border-radius:10px}.bench-tab-panel>.panel:first-child{margin-top:0}.recorded-bench .science-3d-host{height:460px}.recorded-bench .notice{font-size:12px}.recorded-bench .metric{background:#0b0819}.recorded-bench .chart{background:#0b0819}.preset-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin:10px 0}.preset-grid button{font-size:12px;padding:8px 4px}.thermal-result{font-size:12px}.thermal-result .metric .value{font-size:16px}
@media(max-width:1100px){.workspace-utility{gap:3px}.workspace-utility select{max-width:110px}.workspace-brand{font-size:12px}.hbf-workspace-header{gap:8px}.quality-note{display:none}.workspace-tabs button{padding:5px 7px;font-size:11px}.workspace-hud{top:auto;bottom:102px;left:auto;right:14px;transform:none;max-width:calc(100% - 340px)}}
@media(max-width:850px){.hbf-workspace{grid-template-rows:88px 24px 1fr 100px}.hbf-workspace-header{flex-wrap:wrap;gap:5px}.workspace-brand{flex:1}.workspace-tabs{order:3;flex-basis:100%}.workspace-utility select{max-width:130px}.workspace-boundary{padding:4px 8px;font-size:10px}.workspace-drawer{top:120px;bottom:110px}.workspace-camera{top:122px;right:8px;width:112px;gap:4px}.workspace-camera button{font-size:10px;min-height:28px}.workspace-hud{bottom:110px;max-width:calc(100% - 190px)}.workspace-assembly{bottom:111px;left:8px;width:180px}.workspace-drawer:not([hidden])~.workspace-assembly{display:none}.workspace-drawer:has([data-mode-panel=Compare]:not([hidden])),.workspace-drawer:has([data-mode-panel=Energy]:not([hidden])){width:calc(100vw - 24px)}.workspace-timeline{padding:7px 8px}.workspace-timeline .playback{flex-wrap:wrap;gap:4px}.workspace-timeline .playback-slider{flex-basis:calc(100% - 220px);min-width:110px}.workspace-timeline .playback .compact{display:none}.timeline-status{font-size:9px}.recorded-bench .labgrid{grid-template-columns:1fr}.recorded-bench .controls{position:static;order:0}.recorded-bench .labgrid>div{order:1}.recorded-bench .science-3d-host{height:360px}.recorded-bench .labhead .lede{font-size:12px}}
@media print{.recorded-workspace{height:auto;overflow:visible}.hbf-workspace{position:static;display:block}.hbf-stage,.workspace-camera,.workspace-assembly,.workspace-tabs,.workspace-utility,.workspace-timeline{display:none}.workspace-drawer{position:static;width:100%!important;max-width:none;overflow:visible;display:block!important}.workspace-pane,.bench-tab-panel{display:block!important}.workspace-drawer [hidden]{display:block!important}.workspace-hud{position:static;transform:none}}
@media(max-width:560px){.hbf-workspace{grid-template-rows:118px 24px 1fr 100px}.hbf-workspace-header{align-content:center}.workspace-brand{flex-basis:100%;font-size:12px}.workspace-utility{order:2;flex-basis:100%;min-width:0}.workspace-utility select{flex:1;min-width:0;max-width:none;font-size:10px;min-height:28px}.workspace-tabs{order:3;flex-basis:100%}.workspace-drawer{top:150px}.workspace-camera{top:152px}.workspace-timeline .playback button{min-width:25px;padding:4px}.workspace-timeline .playback-slider{flex-basis:calc(100% - 190px)}.recorded-bench .row{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Scientific workspaces expose existing inputs and results without changing the scene. */
.science-shortcuts{position:sticky;top:0;z-index:5;display:flex;gap:6px;background:#130b24;padding:8px 92px 8px 0;border-bottom:1px solid #483563;margin-bottom:12px;flex-wrap:wrap}
.science-shortcuts button{font-size:14px;padding:6px 10px}.workspace-pane{scroll-margin-top:70px}
.workspace-controls .field label{font-size:14px}.workspace-controls .help,.workspace-controls small{font-size:12px}
.workspace-pane .panel h2{font-size:18px}.workspace-pane .panel p{line-height:1.5}
@media(max-width:850px){.workspace-timeline .playback .compact{display:block;flex-basis:88px}.science-shortcuts{padding-right:80px;gap:4px}}

/* v745: bounded desktop controls, normal-flow reflow, explicit historical state. */
.recorded-bench .controls{max-block-size:calc(100dvh - 76px);overflow-y:auto;scroll-padding-block:1rem 5rem;scrollbar-gutter:stable}
.recorded-bench .controls :is(input,select,textarea,button){scroll-margin-block:1rem}
:focus-visible{outline:3px solid #80e6ff;outline-offset:3px}
.result-association{display:block;padding:.65rem;background:#3c2816;color:#ffe2ab;border:1px solid #99703a;font-weight:650}
[data-state=historical]{border-color:#99703a}
.tablewrap td small{display:block;color:var(--muted);overflow-wrap:anywhere}
.research-panel textarea{width:100%;min-height:110px;font:12px ui-monospace,monospace}
.research-panel pre{white-space:pre-wrap;overflow-wrap:anywhere;max-height:420px;overflow:auto}
.research-panel details{margin:.75rem 0}
.research-panel .status{overflow-wrap:anywhere}
@media(max-width:60rem){.recorded-bench .labgrid{grid-template-columns:1fr}.recorded-bench .controls{position:static;max-block-size:none;overflow:visible;scrollbar-gutter:auto}.recorded-bench .sitebar{position:static}.recorded-bench .row{grid-template-columns:1fr}}
@media print{.recorded-bench .controls{position:static;max-block-size:none;overflow:visible}}

.science-3d-host[data-stale="true"]::after{content:"Previous scene · no current calculation";position:absolute;top:8px;left:8px;z-index:3;background:#442915;color:#ffe3b5;padding:8px;font-size:13px;pointer-events:none}

/* v746: keep first-paint layout changes out of view without collapsing canvases.
   The hash escape works even if JavaScript is blocked or the boot file is missing. */
html[data-hbf-startup]:not(:target){background:#0d091b}
html[data-hbf-startup]:not(:target) body{background:#0d091b;overflow:hidden}
html[data-hbf-startup]:not(:target) body>:not(#labLoadingScreen),
html[data-hbf-startup]:not(:target) body>:not(#labLoadingScreen) *{visibility:hidden!important;pointer-events:none!important}
#labLoadingScreen{display:none}
html[data-hbf-startup]:not(:target) #labLoadingScreen{display:flex;position:fixed;inset:0;z-index:10000;overflow:auto;align-items:flex-start;justify-content:flex-start;background:#0d091b;color:#ede6ff;padding:clamp(18px,4vw,48px);font-family:system-ui,sans-serif}
.lab-loading-card{margin:auto;width:min(100%,620px);padding:clamp(24px,5vw,44px);border:1px solid #48305f;border-radius:14px;background:#19102e}
.lab-loading-card h1{font-size:clamp(24px,4vw,34px);line-height:1.2;margin:12px 0 20px}
.lab-loading-card p{line-height:1.6}
.lab-loading-card .loading-brand{color:#c3a4ff;font-size:13px;letter-spacing:.08em}
.lab-loading-card .buttonrow{margin-top:24px;gap:12px}
.lab-loading-card a{color:#d4baff;text-decoration:underline;text-underline-offset:3px}
.lab-loading-card a:focus-visible{outline:3px solid #7ad9ed;outline-offset:5px}
.lab-loading-card .help{color:#c1b8ce}

/* ==========================================================================
   7.5.1 reconciliation — keeps the refreshed chrome and motion layer from
   fighting the preserved laboratory workspace layers above.
   ========================================================================== */

/* Focus ring follows the purple accent everywhere (overrides the legacy blue). */
:focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px; }

/* Compact instrument workspaces keep flat panel headings. */
.recorded-workspace .panel h2,
.recorded-bench .panel h2,
.workspace-pane .panel h2,
.hbf-workspace .panel h2,
.immersive-lab .reactor-live-rail .panel h2 { border-bottom: 0; padding-bottom: 0; }

.recorded-workspace .panel h2,
.recorded-bench .panel h2 { border-bottom-color: #352653; }
.recorded-workspace th, .recorded-bench th { background: #17102c; color: #d5c6ff; }
.recorded-workspace .tablewrap, .recorded-bench .tablewrap { background: rgba(11, 8, 25, .5); }
.recorded-workspace details, .recorded-bench details { background: rgba(11, 8, 25, .5); border-color: #352653; }
.recorded-workspace details[open] summary, .recorded-bench details[open] summary { border-bottom-color: #352653; }
.recorded-workspace .metric, .recorded-bench .metric { border-color: #2a1f52; }
.workspace-drawer .panel { box-shadow: none; }

/* Workspace chrome stays sentence case — these are dense functional labels. */
.workspace-tabs button, .bench-tabs button, .workspace-camera button,
.workspace-timeline .playback button, .science-shortcuts button,
.workspace-utility button, .workspace-close, .scene-tools button {
  font-family: var(--sans);
  text-transform: none;
  letter-spacing: normal;
}
.workspace-drawer .labhead :is(h1,h2), .workspace-pane h2 { letter-spacing: .02em; }

/* The full-window workspaces paint their own ground: drop the page field and
   grid there so nothing is composited behind a 100dvh fixed scene. */
.recorded-workspace::before, .recorded-workspace::after { display: none; }
body.recorded-workspace::before, body.recorded-workspace::after { display: none; }
.recorded-workspace, .immersive-lab { background: #070512; }

/* Laboratory pages carry heavy 3D: hold the ambient field still there. */
.recorded-workspace ~ * , .immersive-lab body::before { animation: none; }

/* Buttons inside dense control rails keep their compact legacy sizing. */
.recorded-workspace button::after, .recorded-bench button::after,
.workspace-timeline button::after, .lab-startup button::after { display: none; }

/* Sticky offsets follow the condensed site bar. */
.controls, .reactor-controls, .reactor-live-rail { top: 78px; }

/* Startup and loading cards adopt the accent. */
.lab-startup { border-left-color: var(--cyan); }
.lab-loading-card .loading-brand { letter-spacing: var(--track-wide); font-family: var(--mono); }
.lab-loading-card h1 { font-family: var(--display); text-transform: uppercase; letter-spacing: .02em; }

/* v750: typed studies and unobscured recorded workspace. */
.typed-study-form{display:grid;gap:10px;margin:12px 0;min-width:0}
.typed-study-form fieldset{min-width:0;display:grid;gap:8px;border:1px solid #44305e;border-radius:8px;padding:10px}
.typed-study-form label,.study-file-tools label{display:grid;gap:5px;font-size:12px;min-width:0}
.typed-study-form input,.typed-study-form textarea{width:100%;min-width:0;box-sizing:border-box}
.typed-study-form input[type=checkbox]{width:20px;justify-self:start}
.typed-study-form input:invalid,.typed-study-form textarea:invalid{outline:2px solid #f3aa70}
.study-file-tools{margin:12px 0;display:grid;gap:10px}
.research-panel>details>details textarea{width:100%;min-height:160px}
.recorded-workspace .hbf-stage .science-3d-host{left:var(--scene-left,0px);right:var(--scene-right,176px);width:auto}
.workspace-primary-summary{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 6px;font-size:11px;color:#e3d7f5}
.workspace-primary-summary .buttonrow{margin:0;flex-wrap:nowrap}.workspace-primary-summary button{white-space:nowrap;font-size:11px;min-height:26px;padding:4px 8px}
.hbf-workspace{grid-template-rows:64px 24px minmax(0,1fr) 122px}
.workspace-drawer{bottom:132px}.workspace-drawer:has([data-mode-panel=Compare]:not([hidden])),.workspace-drawer:has([data-mode-panel=Energy]:not([hidden])){width:min(480px,42vw)}
.workspace-assembly{bottom:132px}.workspace-hud{max-width:calc(100% - 400px)}
@media(min-width:851px){.workspace-drawer:not([hidden])~.workspace-assembly{left:calc(var(--scene-left) + 12px);width:230px}.workspace-drawer:not([hidden])~.workspace-hud{left:calc(var(--scene-left) + 12px);transform:none;max-width:calc(100% - var(--scene-left) - 200px)}}
@media(max-width:1100px){.workspace-hud{bottom:135px}}
@media(max-width:850px){.hbf-workspace{grid-template-rows:88px 24px minmax(0,1fr) 142px}.workspace-drawer{bottom:152px}.workspace-drawer:has([data-mode-panel=Compare]:not([hidden])),.workspace-drawer:has([data-mode-panel=Energy]:not([hidden])){width:calc(100vw - 24px)}.workspace-primary-summary{align-items:flex-start;font-size:10px}.workspace-primary-summary .buttonrow{flex-direction:column;gap:3px}.workspace-primary-summary button{font-size:10px;min-height:24px}.workspace-assembly,.workspace-hud{bottom:152px}}
@media(max-width:560px){.hbf-workspace{grid-template-rows:118px 24px minmax(0,1fr) 154px}.workspace-drawer{bottom:164px}.workspace-assembly,.workspace-hud{bottom:164px}.workspace-primary-summary{gap:5px}}

.stage-selected { outline: 2px solid #64dfca; outline-offset: -2px; background: #123c3a; }
.stage-selection-controls { display: grid; gap: .5rem; margin: .75rem 0; }
.stage-selection-controls select { min-height: 2.75rem; }
[data-stage-index]:focus-visible { outline: 3px solid #ffd681; outline-offset: 3px; }
.validation-form { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,15rem),1fr)); gap: .75rem; }
.validation-form label { display: grid; gap: .25rem; }
.validation-form input,.validation-form select { min-height: 2.75rem; max-width: 100%; }
.validation-wide { grid-column: 1 / -1; }
.validation-output { overflow-x: auto; }
.validation-output td,.validation-output th { white-space: normal; min-width: 5rem; }

/* v750 detector registry workbench */
/* Scope this addition to the detector registry workbench. */
.detector-validation-workbench { min-width: 0; }
.detector-validation-workbench > details { border-top: 1px solid #294658; padding: .85rem 0; margin-top: .5rem; }
.detector-validation-workbench > details[open] { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .7rem 1rem; }
.detector-validation-workbench > details > :is(summary,p,pre,.tablewrap) { grid-column: 1 / -1; }
.detector-validation-workbench > details > summary { cursor: pointer; font-weight: 650; }
.detector-validation-workbench .field { min-width: 0; display: flex; flex-direction: column; gap: .35rem; }
.detector-validation-workbench .field label { font-size: .875rem; }
.detector-validation-workbench .field :is(input,select) { box-sizing: border-box; width: 100%; min-width: 0; }
.detector-validation-workbench .tablewrap { min-width: 0; max-width: 100%; overflow-x: auto; }
.detector-validation-workbench table { width: 100%; border-collapse: collapse; text-align: left; }
.detector-validation-workbench :is(th,td) { padding: .55rem; vertical-align: top; }
.detector-validation-workbench td .field { min-width: 10rem; }
.detector-validation-workbench pre { max-width: 100%; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; }
.detector-validation-workbench [role="status"] { overflow-wrap: anywhere; }
.detector-validation-workbench button { align-self: start; min-height: 2.6rem; }
@media(max-width: 640px) { .detector-validation-workbench > details[open] { grid-template-columns: minmax(0,1fr); } }
/* Preserve readable mode labels when the narrow header scrolls horizontally. */
.workspace-tabs button{flex:0 0 auto}

@media(max-width:560px){.hbf-workspace:has(.workspace-timeline>.download-receipt){grid-template-rows:118px 24px minmax(0,1fr) auto}.workspace-timeline:has(>.download-receipt){min-height:154px}}

/* --------------------------------------------------------------------------
   v7.5.2 browser-acceptance corrections (docs/v752-verification/browser/)
   -------------------------------------------------------------------------- */
/* Accessible text that is not drawn (the immersive workspaces keep their visible brand bar). */
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; clip-path: inset(50%) !important; white-space: nowrap !important; border: 0 !important; }
/* Wide reference tables scroll inside their own box instead of widening the page. */
.table-scroll { max-width: 100%; overflow-x: auto; }
/* Long result badges wrap on narrow screens (overflowed at 320 CSS px). */
@media (max-width: 480px) { .badge { white-space: normal; max-width: 100%; overflow-wrap: anywhere; } }
/* Keyboard focus on form controls stays visible where workspace themes restyle borders. */
:is(input, select, textarea):focus-visible { outline: 2px solid var(--cyan-2); outline-offset: 2px; }

/* === v753 B06 DirectConvert === */
/* DC-C02 origin-preserving plant ledger: grouped sink and provenance inputs, origin/sink tables, pooled comparison. */
.dc-plant-ledger { margin-top: .9rem; padding-top: .6rem; border-top: 1px solid var(--line); }
.dc-ledger-lede { margin: 0 0 .6rem; color: var(--muted); font-size: .82rem; }
.dc-qualification .check { font-weight: 650; }
.dc-ledger-group { margin: .7rem 0 0; }
.dc-ledger-group > summary .dc-summary-note { display: block; color: var(--muted); font-weight: 400; font-size: .78rem; }
.dc-sink { min-width: 0; margin: .7rem 0 0; padding: .55rem .7rem .7rem; border: 1px solid var(--line); border-radius: var(--r-md); }
.dc-sink legend { padding: 0 .35rem; color: var(--cyan-2); font-weight: 650; font-size: .82rem; }
.dc-provenance .dc-source[hidden] { display: none; }
.dc-ledger-mapping { margin: 0 0 .6rem; }
.dc-origin-table .dc-total th, .dc-origin-table .dc-total td { border-top: 2px solid var(--line); font-weight: 650; }
.dc-origin-table caption, .dc-sink-table caption { caption-side: top; text-align: left; color: var(--muted); font-size: .8rem; padding: .3rem 0; }
/* V02 O-06: the note under the sink table stays inside the visible width of the scrolling table and reads as prose. */
.dc-sink-table .dc-withheld-note td { padding: .6rem .7rem; text-align: left; white-space: normal; border-top: 2px solid var(--line); }
.dc-sink-table .dc-withheld-note p { position: sticky; left: 0; margin: 0; max-width: min(66ch, calc(100vw - 5rem)); color: var(--muted); font-size: .84rem; line-height: 1.45; }
.dc-pooled, .dc-routes { margin-top: .9rem; }
/* DC-C05 campaign panel: raw-content conflicts shown readably above the JSON. */
.dc-campaign-conflicts { margin: 0 0 .8rem; padding: .6rem .75rem; border: 1px solid var(--line); border-left: 3px solid var(--amber); border-radius: var(--r-md); }
.dc-campaign-conflicts[data-state="clean"] { border-left-color: var(--green); }
.dc-campaign-conflicts h4 { margin: 0 0 .3rem; }
.dc-campaign-conflicts code { word-break: break-all; font-size: .78rem; }
.dc-campaign-conflicts ul { margin: 0; padding-left: 1.1rem; }
/* V02 F-16: an alias records the digest as the manifest wrote it (64 characters, or whatever was typed); it wraps instead of widening the table. */
.dc-campaign-conflicts li { overflow-wrap: anywhere; }
/* DC-C10 PIC numerical validation rail: verdict, step chips, scope line and the explicit refinement study. */
.dc-pic-rail, .dc-pic-study { margin: .8rem 0; padding: .65rem .8rem; border: 1px solid var(--line); border-left: 3px solid var(--amber); border-radius: var(--r-md); }
.dc-pic-rail[data-decision="numerically-converged"] { border-left-color: var(--green); }
.dc-pic-rail[data-decision="not-converged"] { border-left-color: var(--red); }
.dc-pic-rail h4, .dc-pic-study h4 { margin: 0 0 .35rem; }
.dc-rail-verdict { margin: 0 0 .4rem; }
.dc-rail-badge { display: inline-block; padding: .1rem .55rem; border: 1px solid var(--line); border-radius: 999px; color: var(--amber); font-size: .76rem; font-weight: 650; letter-spacing: .02em; }
.dc-pic-rail[data-decision="numerically-converged"] .dc-rail-badge { color: var(--green); }
.dc-pic-rail[data-decision="not-converged"] .dc-rail-badge { color: var(--red); }
.dc-rail-note { margin: .25rem 0; color: var(--muted); font-size: .8rem; }
.dc-rail-reasons { margin: .3rem 0; padding-left: 1.1rem; font-size: .82rem; }
.dc-rail-group { margin: .5rem 0 0; }
.dc-rail-group-label { margin: 0 0 .25rem; color: var(--muted); font-size: .74rem; letter-spacing: .05em; text-transform: uppercase; }
.dc-rail { display: flex; flex-wrap: wrap; gap: .35rem; margin: 0; padding: 0; list-style: none; }
.dc-rail li { display: flex; flex-direction: column; min-width: 6.4rem; padding: .3rem .55rem; border: 1px solid var(--line); border-left-width: 3px; border-left-color: var(--amber); border-radius: var(--r-md); font-size: .78rem; }
.dc-rail li[data-status="pass"] { border-left-color: var(--green); }
.dc-rail li[data-status="fail"] { border-left-color: var(--red); }
.dc-rail-name { font-weight: 650; }
.dc-rail-state { color: var(--muted); }
.dc-rail li[data-status="pass"] .dc-rail-state { color: var(--green); }
.dc-rail li[data-status="fail"] .dc-rail-state { color: var(--red); }
.dc-rail-scope { margin: .6rem 0 .3rem; font-size: .8rem; }
.dc-pic-rail details { margin-top: .5rem; }
.dc-pic-rail caption, .dc-pic-study-output caption { caption-side: top; padding: .3rem 0; color: var(--muted); font-size: .8rem; text-align: left; }
.dc-pic-study progress { width: 100%; max-width: 26rem; accent-color: var(--green); }
/* DC-C08 grouped acquisition: persistent evidence banner, four steps, dependency summary, power-boundary and example-check cards. */
/* The sticky head is one line (select and class name) so it can stay on screen on a phone; the explaining sentence follows it. */
.dc-acq-head { position: sticky; top: var(--dc-sticky-top, 0px); z-index: 6; display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .9rem; margin: .7rem 0 0; padding: .45rem .75rem; border: 1px solid var(--line-2); border-left: 4px solid var(--amber); border-radius: var(--r-md); background: var(--panel-2); }
.dc-acq-head[data-evidence="synthetic"] { border-left-color: var(--blue); }
.dc-acq-head[data-evidence="manufactured"] { border-left-color: var(--violet); }
.dc-evidence-chip { font-size: .78rem; font-weight: 700; letter-spacing: .06em; color: var(--amber); }
.dc-acq-head[data-evidence="synthetic"] .dc-evidence-chip { color: var(--blue); }
.dc-acq-head[data-evidence="manufactured"] .dc-evidence-chip { color: var(--violet); }
.dc-acq-head label { display: flex; flex: 0 1 auto; flex-wrap: wrap; align-items: center; gap: .25rem .5rem; min-width: 0; max-width: 100%; margin: 0; font-weight: 650; }
.dc-acq-head select { flex: 1 1 12rem; min-width: 0; max-width: 100%; min-height: 2.5rem; }   /* wraps under the label on a narrow phone instead of overflowing */
.dc-evidence-banner { margin: .4rem 0 .7rem; padding: 0 .2rem; font-size: .82rem; color: var(--ink); }
.dc-example { margin: .6rem 0; padding: .6rem .75rem; border: 1px dashed var(--line-3); border-radius: var(--r-md); }
.dc-example-text { margin: 0 0 .5rem; font-size: .84rem; }
.dc-acq-form { display: block; margin-top: .7rem; }
.dc-sweep-actions { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .6rem 1rem; margin-top: .8rem; }
.dc-sweep-actions label { display: grid; gap: .25rem; }
/* The sticky banner and the site bar must not hide a control that keyboard focus scrolls into view. */
.dc-acq :is(input, select, button, summary, h3, h4) { scroll-margin-top: 9rem; }
.dc-steps { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 .7rem; padding: 0; list-style: none; }
.dc-steps li { flex: 1 1 10rem; min-width: 0; }
.dc-step-tab { display: grid; grid-template-columns: auto 1fr; grid-template-areas: "num title" "num state"; align-items: center; column-gap: .6rem; width: 100%; text-align: left; }
.dc-step-num { grid-area: num; display: inline-grid; place-items: center; width: 1.7rem; height: 1.7rem; border: 1px solid currentColor; border-radius: 999px; font-weight: 650; }
.dc-step-title { grid-area: title; }
.dc-step-state { grid-area: state; font-size: .74rem; font-weight: 400; letter-spacing: 0; text-transform: none; color: var(--muted); }
.dc-step-tab[aria-current="step"] { background: #714cd4; border-color: #a68aff; color: #fff; }
.dc-step-tab[aria-current="step"] .dc-step-state { color: #fff; }
.dc-step-tab[data-complete="true"]:not([aria-current="step"]) .dc-step-state { color: var(--green); }
.dc-acq-step { min-width: 0; margin: 0 0 .5rem; padding: .6rem .75rem .8rem; border: 1px solid var(--line); border-radius: var(--r-md); }
.dc-acq-step[hidden] { display: none; }
.dc-acq-step legend { padding: 0 .35rem; }
.dc-acq-step legend h3 { margin: 0; font-size: .95rem; color: var(--cyan-2); }
.dc-acq-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); gap: .75rem; }
.dc-acq-fields label { display: grid; gap: .25rem; align-content: space-between; }   /* labels of different length: inputs share a baseline at the bottom of the row */
.dc-acq-fields input, .dc-acq-fields select { min-height: 2.75rem; max-width: 100%; }
.dc-acq-fields .dc-declaration { grid-column: 1 / -1; display: flex; align-items: flex-start; gap: .65rem; }
.dc-acq-fields .dc-declaration input { order: -1; flex: 0 0 auto; width: 1.4rem; min-height: 1.4rem; margin-top: .15rem; }
.dc-step-actions { margin-top: .75rem; }
.dc-file-note[hidden] { display: none; }
.dc-dependency { margin: .8rem 0 0; }
.dc-dependency-body { overflow-x: auto; }
.dc-dependency caption { caption-side: top; padding: .3rem 0; color: var(--muted); font-size: .8rem; text-align: left; }
.dc-dependency td, .dc-dependency th { white-space: normal; vertical-align: top; }
.dc-power-boundary, .dc-example-check { margin: .8rem 0; padding: .6rem .8rem; border: 1px solid var(--line); border-left: 3px solid var(--blue); border-radius: var(--r-md); }
.dc-power-boundary h4, .dc-example-check h4 { margin: 0 0 .35rem; }
.dc-power-boundary ul { margin: 0; padding-left: 1.1rem; font-size: .84rem; }
.dc-example-check[data-pass="true"] { border-left-color: var(--green); }
.dc-example-check[data-pass="false"] { border-left-color: var(--red); }
.dc-example-check caption { caption-side: top; padding: .3rem 0; color: var(--muted); font-size: .8rem; text-align: left; }
/* Phone: three columns leave the Detail column about 60 px wide, so each dependency becomes a stacked card (name and state on one line,
   the detail under them at full width). The table roles are set explicitly in collector-validation-ui.mjs; the header row stays for assistive technology. */
@media (max-width: 560px) {
  .dc-dependency table, .dc-dependency tbody { display: block; }
  .dc-dependency thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .dc-dependency tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .2rem .75rem; padding: .55rem .75rem; border-bottom: 1px solid var(--line); }
  .dc-dependency td { display: block; min-width: 0; padding: 0; border: 0; }
  .dc-dependency td:nth-child(1) { font-weight: 650; }
  .dc-dependency td:nth-child(2) { color: var(--muted); font-size: .78rem; text-align: right; }
  .dc-dependency td:nth-child(3) { grid-column: 1 / -1; overflow-wrap: anywhere; }   /* run identifiers and hashes are long unbroken tokens */
  .dc-dependency caption { display: block; }   /* a table-caption inside a block-level table would shrink to one narrow column */
  .dc-dependency tbody tr:hover td { background: none; }   /* the global hover tint is per cell; here the row is the card */
  .dc-dependency tbody tr:hover { background: rgba(166, 138, 255, .05); }
  .dc-dependency tbody tr:last-child { border-bottom: 0; }
}
/* === end v753 B06 === */
/* === v753 B05 AlphaTrack === */
/* Method identity, blank/control record and output-layer boundary (audit AT-03, AT-04, readiness §3.2). */
.method-schema-note code, .method-identity code { overflow-wrap: anywhere; }
.method-identity { margin: .75rem 0; font-size: .875rem; overflow-wrap: anywhere; }
.method-identity .mono { display: block; margin-top: .2rem; color: var(--muted); word-break: break-all; }
.control-formula { overflow-wrap: anywhere; }
.control-record { margin: .75rem 0; padding: .6rem .8rem; border: 1px solid var(--line-2); border-left: 3px solid var(--amber); border-radius: var(--r-sm); background: var(--sunken); overflow-wrap: anywhere; }
.control-record.negative { border-left-color: var(--red); }
.control-record h3 { margin: 0 0 .35rem; font-size: .9rem; }
.control-record .formula { margin: .2rem 0; font-family: var(--mono); font-size: .85rem; }
.output-layers { margin: .75rem 0; }
.output-layers summary { cursor: pointer; font-weight: 600; }
.output-layers td { vertical-align: top; overflow-wrap: break-word; }
/* Custody image-set summaries (AT-01 follow-up): a mismatch is unmistakable and says no score was published. */
.custody-image-set { margin: .6rem 0 .9rem; padding: .7rem .9rem; border: 1px solid var(--line-2); border-left: 4px solid var(--violet); border-radius: var(--r-sm); background: var(--sunken); overflow-wrap: anywhere; }
.custody-image-set[data-tone="mismatch"] { border-color: rgba(255, 143, 158, .45); border-left-color: var(--red); background: rgba(255, 143, 158, .08); }
.custody-image-set[data-tone="exact"] { border-left-color: var(--green); }
.custody-image-set[data-tone="partial"] { border-left-color: var(--amber); }
.custody-image-set-head { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.custody-image-set h4 { margin: 0; font-size: .95rem; }
.custody-image-set h5 { margin: .5rem 0 .2rem; font-size: .85rem; }
.custody-no-score { margin: .4rem 0; color: #ffd4d9; }
.custody-image-set table { width: 100%; border-collapse: collapse; font-size: .85rem; }
.custody-image-set :is(th, td) { padding: .25rem .4rem; text-align: left; vertical-align: top; }
.custody-image-set code { word-break: break-all; }
.custody-image-set code.whole { word-break: normal; white-space: nowrap; }
.custody-hash-list ol { margin: 0; padding-left: 1.4rem; max-height: 14rem; overflow: auto; }
/* Review decisions (AT-05 / AT-W4): object list, reason, undo/redo and the immutable log. */
.review-decisions .review-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: .75rem 1rem; align-items: start; margin: .5rem 0; }
.review-decisions select[multiple] { width: 100%; font-family: var(--mono); font-size: .8rem; }
.review-decisions .status { overflow-wrap: anywhere; }
.review-decisions .status[data-kind="error"] { padding: .4rem .6rem; border-left: 3px solid var(--red); background: rgba(255, 143, 158, .08); color: #ffd4d9; }
.review-decisions details { margin-top: .6rem; }
.review-decisions summary { cursor: pointer; font-weight: 600; }
.review-decisions td, .review-decisions th { vertical-align: top; overflow-wrap: break-word; }
.reviewed-line { margin: .5rem 0; font-size: .9rem; overflow-wrap: anywhere; }
.review-decisions .field label { flex-wrap: wrap; }
.review-decisions .field label > span { flex: 1 1 11rem; min-width: 0; text-align: right; overflow-wrap: anywhere; }
@media (max-width: 760px) { .review-decisions .review-grid { grid-template-columns: minmax(0, 1fr); } .review-decisions .field label > span { text-align: left; } }
/* Input support and budgets (AT-07 / AT-08). */
#cancelLoad[hidden] { display: none; }
.ingestion-support { margin: .75rem 0; padding: .5rem .7rem; border: 1px solid var(--line-2); border-radius: var(--r-sm); background: var(--sunken); }
.ingestion-support > summary { cursor: pointer; font-weight: 600; }
.ingestion-body h4 { margin: .7rem 0 .2rem; font-size: .85rem; }
.ingestion-body ul { margin: .2rem 0; padding-left: 1.2rem; }
/* The panel lives in the narrow controls column on a desktop and fills the screen on a phone: a label stacks above its value in both. */
.ingestion-body dl { margin: .2rem 0; font-size: .85rem; }
.ingestion-body dt { font-weight: 600; }
.ingestion-body dd { margin: 0 0 .3rem; overflow-wrap: break-word; }
/* Tables of this lane keep whole words. On a phone each row of the output-layer and review-log tables becomes a labelled block
   (the header row stays available to assistive technology) and each row of a custody summary stacks its label above its value,
   instead of a grid squeezed to a few letters per column. */
.output-layers .badge, .review-decisions .badge { white-space: nowrap; }
@media (max-width: 640px) {
  :is(.output-layers, .review-decisions) :is(table, tbody, tr, td) { display: block; }
  :is(.output-layers, .review-decisions) thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  :is(.output-layers, .review-decisions) tr { padding: .45rem .6rem; border-bottom: 1px solid var(--line); }
  :is(.output-layers, .review-decisions) td { padding: .1rem 0; border: 0; }
  :is(.output-layers, .review-decisions) td[data-label]::before { content: attr(data-label) ": "; font-weight: 600; color: var(--muted); }
  .custody-image-set-table :is(tbody, tr, th, td) { display: block; }
  .custody-image-set-table th[scope="row"] { padding-bottom: 0; border-bottom: 0; background: none; }
  .custody-image-set-table td { padding-top: .1rem; }
}
/* === end v753 B05 === */
/* === v753 B02 Isotope === */
#beamHelp .domain-line{display:block}
.submodel-status{margin:.5rem 0}
/* HBF-004: run identity and freshness line above every result group. */
.run-line{margin:.35rem 0 .6rem;padding:.25rem .6rem;border-left:3px solid var(--line-3);font-size:.9rem;line-height:1.4;color:var(--ink-2);overflow-wrap:anywhere}
.run-line[data-freshness="current"]{border-left-color:var(--green)}
.run-line[data-freshness="stale"],.run-line[data-freshness="invalid"]{border-left-color:var(--amber);color:#ffe6b8}
.run-line[data-freshness="none"]{border-left-color:var(--red);color:#ffd4d9}
[data-freshness="stale"]:not(.run-line),[data-freshness="invalid"]:not(.run-line){opacity:.6}
#xsResult[data-scalar="stale"]{opacity:1}
/* HBF-013: use restriction beside the source and transport results. */
.source-restriction{margin:.5rem 0 .75rem}
.source-restriction .notice.restricted{border-left-color:var(--amber);background:rgba(255,207,112,.07);color:#ffe6b8;margin:0}
.source-restriction .notice.restricted strong{color:#fff0cf}
.source-restriction details{margin-top:.4rem}
.source-restriction details p{margin:.35rem 0;font-size:.92rem}
.source-restriction .tablewrap{max-width:100%;overflow-x:auto}
.source-restriction .restriction-actions{margin-top:.4rem}
.source-restriction .restriction-actions button{font-size:.9rem}
#heldOutReproduction{margin-top:.4rem;font-size:.9rem;overflow-wrap:anywhere}
#branchModelStatus[data-status="unavailable"],#branchModelStatus[data-status="invalid"]{color:#ffd4d9}
/* I-P2-02: persistent frame / time / source badges above each 3D view; a physical-time badge and a normalized-time badge differ in colour as well as words. */
.view-badges-host{margin:.5rem 0 .75rem}
.view-badges{display:flex;flex-wrap:wrap;gap:.4rem .5rem;list-style:none;margin:0;padding:0}
.view-badges li{flex:1 1 17rem;min-width:0;padding:.35rem .6rem;border:1px solid var(--line-3);border-left-width:4px;border-radius:6px;background:rgba(9,21,29,.72);font-size:.9rem;line-height:1.4;overflow-wrap:anywhere}
.view-badges .badge-label{display:block;font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;color:var(--cyan-2)}
.view-badges li[data-badge="reaction"],.view-badges li[data-badge="source"],.view-badges li[data-badge="scope"]{flex-basis:100%}
.view-badges li[data-time-kind="physical"]{border-left-color:var(--green)}
.view-badges li[data-time-kind="normalized"]{border-left-color:var(--amber)}
.view-badges li[data-freshness="stale"],.view-badges li[data-freshness="invalid"]{border-left-color:var(--amber);color:#ffe6b8}
.view-badges li[data-freshness="none"]{border-left-color:var(--red);color:#ffd4d9}
.view-badges[data-available="false"] li[data-badge="scope"]{border-left-color:var(--amber)}
/* The page-wide rule above dims every stale element; here the stale statement (the Run badge) keeps full strength and the badges describing the previous scene are dimmed instead. */
.view-badges[data-freshness],.view-badges li[data-freshness]{opacity:1}
.view-badges[data-freshness="stale"] li:not([data-badge="run"]),.view-badges[data-freshness="invalid"] li:not([data-badge="run"]){opacity:.6}
/* I13: the detector half-angle states its own validity beside the control (range and unit), without hiding the other results. */
.field-error{display:block;margin-top:.25rem;padding:.3rem .5rem;border-left:3px solid var(--red);border-radius:4px;background:rgba(255,143,158,.08);color:#ffd4d9;font-size:.9rem;line-height:1.4;overflow-wrap:anywhere}
.field-error[hidden]{display:none}
#detectorAngle[aria-invalid="true"]{border-color:var(--red);outline-color:var(--red)}
/* I-P2-03: summary-first angular comparison. The summary wraps its text so that all seven columns, the verdict included, fit at 1353 px;
   the detail tables sit in labelled, focusable scroll regions. Header text keeps its case so that units read keV, not KEV. */
.iso-angular-view{margin:.25rem 0 1rem}
.iso-angular-view h4{margin:.4rem 0 .5rem;font-size:1.02rem}
.iso-angular-view .iso-restriction{margin:.25rem 0 .6rem;padding:.35rem .6rem;border-left:3px solid var(--amber);background:rgba(255,207,112,.07);color:#ffe6b8;font-size:.92rem;line-height:1.4;overflow-wrap:anywhere}
.iso-angular-view .iso-restriction strong{color:#fff0cf}
.iso-angular-view .iso-note{margin:.4rem 0;font-size:.9rem;line-height:1.4;color:var(--ink-2);overflow-wrap:anywhere}
.iso-table-region{max-width:100%;overflow-x:auto;margin:.5rem 0;border:1px solid var(--line);border-radius:var(--r-md);background:rgba(10,7,24,.45)}
.iso-table-region:focus-visible{outline:2px solid var(--cyan-2);outline-offset:2px}
.iso-table-region table{width:100%;border-collapse:collapse;font-size:.88rem}
.iso-table-region caption{caption-side:top;padding:.55rem .7rem;font-size:.86rem;font-weight:600;color:var(--ink-2)}
/* overflow-wrap:anywhere would shrink the table's min-content width to one character and break numbers into vertical strings; break-word does not. */
.iso-table-region th,.iso-table-region td{padding:.45rem .6rem;overflow-wrap:break-word;vertical-align:top;line-height:1.35}
.iso-table-region td.num{white-space:nowrap}
.iso-table-region th{text-transform:none;letter-spacing:.01em;font-family:inherit;font-size:.82rem}
.iso-table-region th[scope="row"]{color:var(--ink);font-weight:600;background:#150f2c}
.iso-table-region .num{font-variant-numeric:tabular-nums}
.iso-table-region td small{display:block;margin-top:.15rem;color:var(--muted);font-size:.76rem;line-height:1.3}
.iso-table-region td[data-tone="fail"] strong{color:var(--red)}
.iso-table-region td[data-tone="pass"] strong{color:var(--green)}
.iso-table-region td[data-tone="inconclusive"] strong,.iso-table-region td[data-tone="unclassified"] strong{color:var(--amber)}
.iso-angular-detail{margin:.6rem 0}
.iso-angular-detail .iso-table-region table{min-width:46rem}
.iso-angular-detail table.sticky-first th[scope="row"]{position:sticky;left:0;z-index:1;box-shadow:1px 0 0 var(--line)}
/* === end v753 B02 === */
/* === v753 orchestrator (acceptance fixes) === */
/* Case study: pinned SHA-256 values wrap instead of widening the page (acceptance probe at 640/375/320 px). */
dl.pinned .hash, dl.pinned code { overflow-wrap: anywhere; word-break: break-all; }
dl.pinned dd { min-width: 0; }
/* === end v753 orchestrator === */
/* === v753 B09 platform === */
/* Release evidence (HBF-007): the homepage band of separately counted, dated records and the evidence-page register. */
.evidence-band { margin-top: 2rem; }
.evidence-band > .eyebrow { margin: 0 0 .2rem; }
.evidence-band > .statband { margin-top: .7rem; }
.evidence-band > .help { margin: .85rem 0 0; max-width: 64rem; }
td .hash { display: block; margin-top: .3rem; color: var(--faint); font: .715rem/1.5 var(--mono); overflow-wrap: anywhere; }
p .hash { color: var(--faint); font: .8em/1.5 var(--mono); overflow-wrap: anywhere; }
td .scope { display: block; margin-top: .55rem; }
ul.tight { margin: .4rem 0 0; padding-left: 1.1rem; }
ul.tight li + li { margin-top: .35rem; }
/* Bypass block and focus visibility (PLAT-08; WCAG 2.4.1 technique G1, 2.4.11 technique C43). */
.skip-link {
  position: fixed;
  top: .75rem;
  left: .75rem;
  z-index: 1000; /* above the sticky site bar (20), the scroll rail (30) and workspace chrome */
  max-width: calc(100vw - 1.5rem);
  padding: .7rem 1.1rem;
  border: 2px solid var(--ink);
  border-radius: var(--r-sm);
  background: var(--cyan-2);
  color: var(--bg);
  font: 650 .95rem/1.25 var(--display);
  letter-spacing: var(--track-caps);
  text-decoration: none;
  transform: translateY(-300%); /* parked above the viewport: still in the tab order and the accessibility tree */
}
.skip-link:focus, .skip-link:focus-visible { transform: none; outline: 3px solid var(--ink); outline-offset: 3px; box-shadow: var(--shadow-lg); }
/* The sticky site bar must not cover a focused control or an anchor target. ui.mjs and site-motion.js replace this
   fallback with the measured height of the bar plus a margin; it applies when scripts are blocked. */
:root { --hbf-sticky-offset: 5.25rem; }
@media (max-width: 980px) { :root { --hbf-sticky-offset: 7.5rem; } }
html { scroll-padding-top: var(--hbf-sticky-offset); }
/* The main region takes programmatic focus when the skip link is followed; a ring around the whole region adds nothing. */
#main-content:focus { outline: none; }
@media print { .skip-link { display: none; } }
/* A sticky control column taller than the viewport moves with the page, so the browser cannot scroll a focused control at its foot
   into view (virtual-lab/mirror-notebook.html: "Run mirror model" stayed below the fold). Like the recorded-bench column and
   .reactor-controls, it scrolls inside itself; where it is static (narrow layouts, print) it flows with the page. */
.controls { max-block-size: calc(100dvh - 78px - 1rem); overflow-y: auto; scrollbar-gutter: stable; scroll-padding-block: 1rem; }
@media (max-width: 980px) { .controls { max-block-size: none; overflow: visible; scrollbar-gutter: auto; } }
@media print { .controls { max-block-size: none; overflow: visible; } }
/* Fingerprints in definition lists (case study, "Pinned record, source and fixture") wrap instead of widening the page. */
dd .hash { color: var(--faint); font: .8em/1.5 var(--mono); overflow-wrap: anywhere; }
/* A section reached by a link (a Contents entry, a card anchor) is shown at once and in place. The browser computes the scroll to an
   anchor from the box of the target, so a pending 22 px reveal offset would leave the section that much too high - behind the sticky
   bar - when the reveal finishes. :has(:target) covers a target inside a revealed section; browsers without it keep the old behaviour. */
[data-motion="on"] [data-reveal]:target,
[data-motion="on"] [data-reveal]:has(:target) { opacity: 1; transform: none; transition: none; }

/* Contents list, laboratory links and the study catalogue (PLAT-07). */
.toc { margin: 0 0 1.1rem; padding: .85rem 1.1rem; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--panel); }
.toc-title { margin: 0 0 .45rem; color: var(--faint); font: 650 .78rem/1.2 var(--display); letter-spacing: var(--track-caps); text-transform: uppercase; }
.toc ul { display: flex; flex-wrap: wrap; gap: .1rem 1.3rem; margin: 0; padding: 0; list-style: none; }
.toc a { display: inline-block; padding: .3rem 0; }
.labnav { margin: -.25rem 0 1rem; color: var(--muted); font-size: .92rem; }
.study-group + .study-group { margin-top: 1.7rem; }
.study-links { margin: -.3rem 0 .5rem; color: var(--muted); font-size: .92rem; }
.study-also { margin: .9rem 0 0; color: var(--muted); font-size: .92rem; }
.study { margin: .9rem 0 0; padding: 1rem 1.1rem; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--panel-2); }
.study h4 { margin: 0 0 .35rem; font-size: 1.02rem; line-height: 1.35; }
.study-summary { margin: 0 0 .6rem; color: var(--muted); }
.study-facts { display: grid; gap: .7rem; margin: .5rem 0 0; }
.study-facts > div { display: grid; grid-template-columns: minmax(6.5rem, 9rem) minmax(0, 1fr); gap: .25rem 1rem; }
.study-facts dt { color: var(--faint); font-size: .8rem; font-weight: 650; letter-spacing: var(--track-caps); text-transform: uppercase; }
.study-facts dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.study-where { display: inline-block; margin-top: .45rem; color: var(--muted); font-size: .92rem; }
@media (max-width: 640px) { .study-facts > div { grid-template-columns: 1fr; } }
/* === end v753 B09 === */
/* === v753 B07 reactor === */
/* HBF-012 / R3D-C06: APG mode tabs, a separate "All panels" toggle, focused section headings never hidden
   under the sticky section bar (WCAG 2.4.11 via scroll-padding, technique C43). */
.workspace-tabs{align-items:center}
.workspace-tablist{display:flex;gap:4px;min-width:0}
.workspace-tabs [role=tab]{background:transparent;border-color:transparent;white-space:nowrap;flex:0 0 auto}
.workspace-tabs [role=tab][aria-selected=true]{background:#714cd4;border-color:#a68aff;color:#fff}
.workspace-tabs .workspace-show-all{flex:0 0 auto;margin-left:6px;border-color:#5a4482}
.workspace-tabs [role=tab]:focus-visible,.workspace-show-all:focus-visible,.science-shortcuts button:focus-visible{outline:2px solid #ffd18a;outline-offset:2px}
/* The sticky bar sits below the drawer's 9px padding, so scrolled headings clear it by 16px (bar height + padding + a gap). */
.workspace-drawer{scroll-padding-top:calc(var(--section-offset,0px) + 16px)}
.workspace-drawer .workspace-pane{scroll-margin-top:0}
.workspace-drawer [data-section] :is(h2,h3)[tabindex="-1"]:focus{outline:2px solid #ffd18a;outline-offset:3px;border-radius:3px}
.workspace-pane[role=tabpanel]:focus-visible{outline:2px solid #a68aff;outline-offset:-2px}
.science-shortcuts button[aria-current=true]{background:#3a2a66;border-color:#a68aff;color:#fff}
/* One line that scrolls sideways, so the sticky bar never covers most of a narrow drawer. */
.workspace-drawer .science-shortcuts{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin}
.workspace-drawer .science-shortcuts button{flex:0 0 auto;white-space:nowrap}
.workspace-deeplink-notice{margin:0 0 4px;font-size:11px;color:#ffdc9e}
/* HBF-014 / R3D-C04: origin accounts read as a plain table: sentence-case row labels, right-aligned numbers, a ruled total. */
.origin-accounts .origin-table th[scope=row]{text-transform:none;letter-spacing:0;font-family:inherit;font-weight:600;font-size:.82rem;color:inherit;min-width:9.5rem}
.origin-accounts .origin-table th[scope=row] .source-note{display:block;font-weight:400;margin-top:2px}
.origin-accounts .origin-table td.num{text-align:right;white-space:nowrap}
.origin-accounts .origin-table tfoot :is(th,td){border-top:2px solid var(--line);font-weight:650}
.origin-accounts .origin-closure{margin:8px 0}
.origin-accounts details{margin:8px 0}
/* R3D-C01 / VR-03 / VR-B: persistent qualification rail (evidence class, component gates, net boundary) in its own grid row between
   the boundary line and the scene. Two fixed lines scroll sideways on a narrow screen; the overlays below shift down by the rail height. */
.hbf-workspace.has-qualification-rail{--rail-h:44px;grid-template-rows:56px 28px var(--rail-h) minmax(0,1fr) 86px}
.has-qualification-rail .hbf-stage.panel{grid-row:4}
.has-qualification-rail .workspace-timeline{grid-row:5}
.has-qualification-rail .workspace-drawer{top:calc(94px + var(--rail-h))}
.has-qualification-rail .workspace-camera{top:calc(100px + var(--rail-h))}
.has-qualification-rail .workspace-hud{top:calc(98px + var(--rail-h))}
.workspace-rail{grid-row:3;z-index:4;box-sizing:border-box;height:var(--rail-h,44px);display:flex;flex-direction:column;justify-content:center;background:#120c24;border-bottom:1px solid #392448;padding:0 14px;font-size:11px;line-height:20px;color:#ede9f9;min-width:0}
.workspace-rail .rail-line{display:flex;align-items:center;gap:10px;margin:0;height:20px;white-space:nowrap;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
.workspace-rail .rail-line::-webkit-scrollbar{display:none}
.workspace-rail .rail-key{flex:0 0 auto;color:#b7afd6;text-transform:uppercase;letter-spacing:.04em;font-size:10px}
.workspace-rail .rail-class{flex:0 0 auto;color:#fff;font-weight:650}
.workspace-rail[data-evidence-class=presentation-illustrative] .rail-class{color:#ffd18a}
.workspace-rail[data-evidence-class=regression-fixture] .rail-class{color:#ffd18a}
.workspace-rail[data-evidence-class=guided-numerical-fixture] .rail-class{color:#9be5c0}
.workspace-rail .rail-flag{flex:0 0 auto;color:#ffdc9e}
.workspace-rail .rail-stale{color:#ffb3a8}
.workspace-rail .rail-scope{flex:0 0 auto;color:#b7afd6}
.workspace-rail .rail-gates{display:inline-flex;gap:12px;flex:0 0 auto}
.workspace-rail .rail-gate{flex:0 0 auto;white-space:nowrap}
.workspace-rail .rail-gate[data-status=passed]{color:#9be5c0}
.workspace-rail .rail-gate[data-status=failed]{color:#ffd18a;font-weight:600}
.workspace-rail .rail-gate[data-status=unavailable]{color:#ffdc9e}
.workspace-rail .rail-net{flex:0 0 auto;color:#d9d0f2}
.workspace-rail .rail-net[data-direction=negative] .rail-net-value{color:#ffb3a8}
.workspace-rail .rail-net[data-direction=positive] .rail-net-value{color:#ffdc9e}
.workspace-rail[data-state=stale] .rail-gates,.workspace-rail[data-state=stale] .rail-net,.workspace-rail[data-state=unavailable] .rail-gates,.workspace-rail[data-state=unavailable] .rail-net{opacity:.55}
@media(max-width:850px){
  .hbf-workspace.has-qualification-rail{grid-template-rows:88px 24px var(--rail-h) minmax(0,1fr) 100px}
  .has-qualification-rail .workspace-drawer{top:calc(120px + var(--rail-h))}
  .has-qualification-rail .workspace-camera{top:calc(122px + var(--rail-h))}
  .has-qualification-rail .workspace-hud{top:auto}
  .workspace-rail{padding:0 8px}
}
@media(max-width:560px){
  /* Three lines on a phone: the class, then the four gates, then the net boundary, so nothing needs a sideways scroll. */
  .hbf-workspace.has-qualification-rail{--rail-h:64px;grid-template-rows:118px 24px var(--rail-h) minmax(0,1fr) 100px}
  .has-qualification-rail .workspace-drawer{top:calc(150px + var(--rail-h))}
  .has-qualification-rail .workspace-camera{top:calc(152px + var(--rail-h))}
  .workspace-rail .rail-line:nth-child(2){flex-wrap:wrap;height:40px;gap:0 8px;overflow:hidden;white-space:normal}
  .workspace-rail .rail-line:nth-child(2)>.rail-key:first-child{display:none}
  .workspace-rail .rail-gates{gap:8px}
  .workspace-rail .rail-net-desc{display:none}
}
/* F-17 (V02 review): while a download notice sat in the playback row, `.hbf-workspace:has(.workspace-timeline>.download-receipt)` (specificity
   0,3,0, above) replaced the five-row template of the qualification-rail layout (0,2,0) with a four-row one: the rail took the flexible row, the
   scene fell into the auto row and collapsed to 0 px. The rail layout now keeps its five rows while a notice is shown. The playback row grows by
   --notice-h, a fixed allowance, so the scene does not depend on how the file name wraps; the notice sticks to the bottom of that row and
   scroll-padding keeps whatever is scrolled or focused in the playback bar clear of it, so no control is hidden behind the notice. The selectors
   are more specific than the notice rules above, so this holds at every breakpoint. */
.hbf-workspace.has-qualification-rail:has(.workspace-timeline>.download-receipt){--notice-h:72px;grid-template-rows:56px 28px var(--rail-h) minmax(0,1fr) calc(86px + var(--notice-h))}
@media(max-width:850px){.hbf-workspace.has-qualification-rail:has(.workspace-timeline>.download-receipt){grid-template-rows:88px 24px var(--rail-h) minmax(0,1fr) calc(100px + var(--notice-h))}}
@media(max-width:560px){.hbf-workspace.has-qualification-rail:has(.workspace-timeline>.download-receipt){grid-template-rows:118px 24px var(--rail-h) minmax(0,1fr) calc(100px + var(--notice-h))}}
.has-qualification-rail .workspace-timeline:has(>.download-receipt){max-height:none;min-height:0;scroll-padding-bottom:calc(var(--notice-h) + 8px)}
.has-qualification-rail .workspace-timeline>.download-receipt{position:sticky;bottom:0}
/* The "Input examples" panel: stacked buttons that wrap, the loaded one pressed. */
.preset-buttons{display:grid;gap:6px;margin:8px 0}
.preset-button{text-align:left;white-space:normal;line-height:1.3;height:auto;text-transform:none;letter-spacing:0;font-weight:600}
.preset-button[aria-pressed=true]{background:#3a2a66;border-color:#a68aff;color:#fff}
.preset-detail .preset-class{margin:6px 0}
.preset-detail .preset-failing{color:#ffdc9e}
.preset-detail .preset-changes{margin:4px 0 8px 18px;padding:0}
.preset-explanation{border:1px dashed #a68aff;border-radius:8px;padding:8px 10px;margin:8px 0;font-size:12px}
/* R3D-C03: the model-dependency graph, a chain of stages and the typed-boundary table. */
.dependency-graph .dependency-chain{display:flex;flex-wrap:wrap;gap:6px 22px;list-style:none;margin:8px 0;padding:0}
.dependency-graph .dependency-chain li{position:relative;border:1px solid var(--line);border-radius:8px;padding:6px 10px;min-width:8rem;max-width:100%}
.dependency-graph .dependency-chain li:not(:last-child)::after{content:"\2192";position:absolute;right:-18px;top:50%;transform:translateY(-50%)}
.dependency-graph .dependency-chain li[data-basis=not-computed]{border-style:dashed;border-color:#ffcf70}
.dependency-graph .dependency-chain .source-note{display:block;overflow-wrap:anywhere}
.dependency-graph .dependency-table th[scope=row]{text-transform:none;letter-spacing:0;font-family:inherit;font-weight:600;font-size:.82rem;color:inherit;min-width:9.5rem}
.dependency-graph .dependency-table .source-note{display:block;font-weight:400;margin-top:2px;overflow-wrap:anywhere}
.dependency-graph .dependency-table td{vertical-align:top;min-width:9rem}
.dependency-graph .dependency-table tr[data-matched=false] th[scope=row]{border-left:3px solid #ffcf70}
.dependency-graph details{margin:8px 0}
.dependency-graph .dependency-omitted{margin:6px 0 6px 18px;padding:0}
/* R3D-C05: per-card freshness. Every result card carries a stamp with the run id; a historical card is dimmed, hatched and says so. */
.result-stamp{margin:6px 0;padding:4px 8px;border-radius:6px;border:1px solid var(--line);font-size:.78rem;font-weight:650;line-height:1.35;color:#bfe9d4;overflow-wrap:anywhere}
.result-stamp[data-state=historical]{background:#3c2816;color:#ffe2ab;border-color:#99703a}
.result-stamp[data-state=none]{color:var(--muted)}
[data-result-group][data-freshness=historical]{position:relative}
[data-result-group][data-freshness=historical]::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:repeating-linear-gradient(135deg,rgba(255,207,112,.08) 0 10px,transparent 10px 20px)}
[data-result-group][data-freshness=historical]>:not([data-result-stamp]):not(h2):not(h3){opacity:.55}
[data-result-group][data-freshness=historical] .result-headline .value,.workspace-rail[data-freshness=historical] .rail-net-value{text-decoration:line-through}
.workspace-primary-summary [data-freshness=historical]{color:#ffe2ab}
.rail-run{font-size:.74rem;white-space:nowrap;color:#bfe9d4}
.rail-run[data-freshness=historical]{color:#ffe2ab}
.science-3d-host[data-stale="true"][data-run-short]:not([data-run-short=""])::after{content:"Previous scene · run " attr(data-run-short) " · no current calculation"}
#exportState{margin:6px 0 0}
/* R3D-C07: scientific display preset. Every display-only control is tagged "overlay" (draws an input or computed quantity) or "appearance" (illustrative, no physical meaning). */
.display-statement,.display-preset-status{margin:6px 0}
.display-group{margin:8px 0;padding:6px 10px;border:1px solid var(--line);border-radius:8px}
.display-group legend{padding:0 6px;font-size:.78rem;font-weight:650}
.display-group[data-display-group=appearance] legend{color:#ffcf70}
.display-group label{display:block;margin:4px 0}
label[data-display-kind]::after{margin-left:6px;font-size:.66rem;font-weight:650;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
label[data-display-kind=overlay]::after{content:"overlay"}
label[data-display-kind=appearance]::after{content:"appearance";color:#ffcf70}
[data-display-preset][aria-pressed=true]{background:#1f4a38;border-color:#7fe0b0}
/* R3D-C08: evidence card for the selected component: status chip, parameter origins, linked dependency, run scope. */
.component-evidence{margin:8px 0;padding:8px 10px;border:1px solid var(--line);border-radius:8px;font-size:.82rem}
.component-evidence h3{margin:0 0 6px;font-size:.86rem}
.component-evidence p{margin:6px 0}
.evidence-status{display:inline-block;padding:1px 8px;border-radius:999px;border:1px solid var(--line);font-size:.7rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase}
.evidence-status[data-status=illustrative]{color:#ffcf70;border-color:#99703a;background:#3c2816}
.evidence-status[data-status=modelled]{color:#bfe9d4;border-color:#4f9b7c;background:#16352b}
.evidence-status[data-status=sourced]{color:#cfe0ff;border-color:#5b79b8;background:#18264a}
.evidence-status[data-status=measured]{color:#fff;border-color:#9a9a9a}
.evidence-caption{font-weight:650}
.evidence-parameters{list-style:none;margin:4px 0;padding:0}
.evidence-parameters li{padding:5px 0;border-top:1px solid var(--line)}
.evidence-line{display:flex;flex-wrap:wrap;gap:2px 10px;justify-content:space-between}
.evidence-name{font-weight:650}
.evidence-origin{font-size:.76rem}
.evidence-basis{margin-top:1px;overflow-wrap:anywhere}
.evidence-tag{font-size:.62rem;font-weight:650;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.evidence-value{font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.component-evidence[data-freshness=historical] .evidence-value{opacity:.55;text-decoration:line-through}
.evidence-run[data-state=historical]{color:#ffe2ab}
/* The inspector grows while it is open so the evidence card is readable without scrolling a narrow strip. */
.workspace-assembly[open]{max-height:62vh;width:min(360px,calc(100vw - 28px))}
@media(min-width:851px){.workspace-drawer:not([hidden])~.workspace-assembly[open]{width:min(340px,calc(100vw - var(--scene-left) - 190px))}}
/* R3D-C10: the orbit evidence block that always sits beside the tracer energy invariant, and its chip in the qualification rail. */
.orbit-evidence{margin:10px 0;padding:8px 10px 8px 12px;border:1px solid var(--line);border-left:4px solid var(--line);border-radius:8px;font-size:.84rem}
.orbit-evidence h4{margin:0 0 4px;font-size:.9rem}
.orbit-evidence p{margin:5px 0}
.orbit-evidence-list{margin:6px 0;padding-left:1.15em}
.orbit-evidence-list li{margin:5px 0;overflow-wrap:anywhere}
.orbit-evidence-list li[data-state=failed],.orbit-evidence-list li[data-state=not-demonstrated],.orbit-evidence-list li[data-state=classification-changed],.orbit-evidence-list li[data-state=changed],.orbit-evidence-list li[data-state=unavailable]{color:#ffe2ab}
.orbit-evidence[data-verdict=consistent]{border-left-color:#4f9b7c}
.orbit-evidence[data-verdict=not-demonstrated],.orbit-evidence[data-verdict=classification-changed],.orbit-evidence[data-unavailable]{border-left-color:#99703a}
.orbit-evidence-host[data-state=historical] .orbit-evidence{opacity:.7}
.orbit-evidence .tablewrap{margin:8px 0}
.rail-orbit{font-size:.78rem;color:var(--muted);white-space:nowrap}
.rail-orbit[data-orbit-chip=consistent]{color:#bfe9d4}
.rail-orbit[data-orbit-chip=not-demonstrated],.rail-orbit[data-orbit-chip=classification-changed],.rail-orbit[data-orbit-chip=unavailable]{color:#ffe2ab}
/* === end v753 B07 === */
/* === v753 B04 torus === */
/* Named input examples of the Torus notebook (TL-03). The loaded example is also stated in text (#inputExampleNature) and
 * through aria-pressed; the thicker border only repeats it. Long names stay readable: no forced upper case, they wrap. */
.input-examples [data-input-example] { display: block; width: 100%; margin: 0 0 8px; text-align: left; text-transform: none; letter-spacing: normal; white-space: normal; line-height: 1.35; }
.input-examples [data-input-example][aria-pressed="true"] { border-width: 2px; border-style: solid; font-weight: 700; }
.input-examples #inputExampleNature { overflow-wrap: anywhere; }
/* === end v753 B04 === */
/* === v753 B08 shared research UI === */
/* VR-01 current-model frame card (measured-field diagnostics). State is always stated in text. */
.model-frame-card{border:1px solid var(--line-2);border-radius:var(--r-md);padding:.75rem .9rem;margin:.75rem 0;background:rgba(10,7,24,.45);min-width:0}
.model-frame-card h3{margin:0 0 .35rem;font-size:1rem}
.model-frame-facts{display:grid;grid-template-columns:minmax(8rem,max-content) minmax(0,1fr);gap:.25rem .9rem;margin:.5rem 0;font-size:.86rem}
.model-frame-facts dt{color:var(--muted)}
.model-frame-facts dd{margin:0;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.model-frame-check{border-left:3px solid var(--line-3);padding-left:.6rem;overflow-wrap:anywhere}
.model-frame-check[data-state="mismatch"],.model-frame-check[data-state="needs-transform"],.model-frame-check[data-state="transform-unnamed"]{border-left-color:var(--amber)}
.model-frame-check[data-state="match"],.model-frame-check[data-state="transform"]{border-left-color:var(--green)}
.model-frame-transform-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:.5rem .9rem}
.model-frame-transform-fields label{display:flex;flex-direction:column;gap:.3rem;font-size:.86rem}
.model-frame-transform-fields textarea{font-family:var(--mono,monospace)}
@media(max-width:560px){.model-frame-facts{grid-template-columns:minmax(0,1fr)}}
/* I-P2-03 / TL-04 / F-P2 shared readable tables and the comparison summary. A scroll region is focusable (tabindex 0) and named; the
   identifier column stays put and the verdict column follows it, so neither needs horizontal scrolling to be read. */
.readable-table-region{max-width:100%;overflow-x:auto;margin:.5rem 0;border:1px solid var(--line);border-radius:var(--r-md);background:rgba(10,7,24,.45)}
.readable-table-region:focus-visible{outline:2px solid var(--cyan-2);outline-offset:2px}
.readable-table{width:100%;border-collapse:collapse;font-size:.88rem}
.readable-table caption{caption-side:top;padding:.55rem .7rem;font-size:.86rem;font-weight:600;color:var(--ink-2);text-align:left}
/* break-word, not anywhere: anywhere shrinks the min-content width to one character and splits numbers into vertical strings. */
.readable-table th,.readable-table td{padding:.45rem .6rem;overflow-wrap:break-word;vertical-align:top;line-height:1.35}
.readable-table th{text-transform:none;letter-spacing:.01em;font-family:inherit;font-size:.82rem}
.readable-table th[scope="row"]{color:var(--ink);font-weight:600;background:#150f2c;min-width:11rem;max-width:20rem}
.readable-table.sticky-first th[scope="row"]{position:sticky;left:0;z-index:1;box-shadow:1px 0 0 var(--line)}
.readable-table .num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.readable-table td small,.readable-table th small{display:block;margin-top:.15rem;color:var(--muted);font-size:.76rem;line-height:1.3;font-weight:400;overflow-wrap:anywhere}
.readable-table td[data-tone="changed"] strong{color:var(--amber)}
.readable-table td[data-tone="unavailable"] strong{color:var(--red)}
.readable-table td[data-tone="within"] strong{color:var(--green)}
.readable-table td[data-tone="identical"] strong{color:var(--muted)}
.readable-table-detail{margin:.4rem 0}
.readable-table-note{margin:.3rem 0;color:var(--muted);font-size:.86rem}
.cmp-body{margin-top:.6rem}
.cmp-lede{margin:.4rem 0;font-size:.98rem;line-height:1.45;overflow-wrap:anywhere}
.cmp-families{margin:.25rem 0 .6rem;padding:.35rem .6rem;border-left:3px solid var(--cyan-2);font-size:.92rem;line-height:1.4;overflow-wrap:anywhere}
.cmp-body h3{margin:.8rem 0 .3rem;font-size:1.02rem}
.cmp-body h4{margin:.7rem 0 .3rem;font-size:.95rem}
.cmp-body details{margin:.5rem 0}
.cmp-body details>summary{cursor:pointer}
@media(max-width:560px){.readable-table th[scope="row"]{min-width:8.5rem;max-width:10rem}}
/* Item 5: retained-study freshness banner. The state is stated in words (Current / Previous run / Independent of the main run);
   the border colour only repeats it. The Evaluate action and its reason sit beside the sentence, never behind a tooltip. */
.study-freshness{display:grid;gap:.35rem;margin:.5rem 0;padding:.5rem .7rem;border:1px solid var(--line);border-left:4px solid var(--line-3);border-radius:var(--r-md);background:rgba(10,7,24,.45);min-width:0}
.study-freshness[hidden]{display:none}
.study-freshness[data-state="current"]{border-left-color:var(--green)}
.study-freshness[data-state="previous"]{border-left-color:var(--amber)}
.study-freshness[data-state="independent"]{border-left-color:var(--cyan-2)}
.study-freshness-text{margin:0;line-height:1.4;overflow-wrap:anywhere}
.study-freshness-text:focus-visible{outline:2px solid var(--cyan-2);outline-offset:2px}
.study-freshness-detail{display:block;margin-top:.15rem;color:var(--muted);font-size:.86rem}
.study-freshness-action{justify-self:start}
.study-freshness-action[hidden],.study-freshness-reason[hidden]{display:none}
.study-freshness-reason{margin:0;font-size:.84rem;overflow-wrap:anywhere}
/* === end v753 B08 === */
/* === v753 B03 virtual === */
/* HBF-011 / VR-02: field-level domain messages (range and unit) beside the control; the empty slot takes no space. */
.field-error { display: block; color: var(--red); font-size: .82rem; line-height: 1.3; margin-top: .2rem; overflow-wrap: anywhere; }
.field-error:empty { display: none; }
input[aria-invalid="true"] { border-color: var(--red); outline: 2px solid rgba(255, 143, 158, .35); outline-offset: 1px; }
/* Item 2 (VR-03 / VR-B): observation time in physical seconds, derived plan, bounce ratio beside the animation. */
.observation-time { min-width: 0; margin: .85rem 0 0; padding: .35rem .7rem .5rem; border: 1px solid var(--line-2); border-radius: 8px; }
.observation-time legend { padding: 0 .4rem; color: var(--cyan-2); font-weight: 650; font-size: .82rem; text-transform: uppercase; letter-spacing: .07em; }
.observation-time input[readonly] { opacity: .78; border-style: dashed; }
.observation-derived { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; margin: .6rem 0 .3rem; }
.observation-derived .metric { padding: .45rem .55rem; min-width: 0; }
.observation-derived .metric .value { font-size: 1rem; overflow-wrap: anywhere; }
.observation-derived .note { grid-column: 1 / -1; margin: 0; }
.observation-status[data-kind="error"] { color: var(--red); }
#liveMetrics .observation-note { grid-column: 1 / -1; margin: .3rem 0 0; }
.observation-ratio { flex: 0 0 auto; display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: .25rem .5rem; min-width: 0; font-size: .82rem; color: var(--muted); }
.observation-ratio .label { color: var(--faint); font: 600 .73rem var(--mono); text-transform: uppercase; letter-spacing: .05em; }
.observation-ratio strong { color: var(--cyan-2); font: 700 1rem var(--mono); }
.observation-ratio small { color: var(--muted); font-size: .78rem; overflow-wrap: anywhere; }
.observation-ratio[data-stale="true"] { opacity: .6; }
.observation-ratio[data-stale="true"] strong::after { content: " · previous run"; font-weight: 400; font-size: .74rem; color: var(--muted); }
@media (max-width: 850px) { .playback .observation-ratio { grid-column: 1 / -1; } }
/* Item 3 (audit Lab 03 scientific correction 1): model cards beside the values they explain, and the four version labels. The results sit in a
   narrow side pane in the immersive workspace, so rows stack by default and become two columns only where the card itself is wide. */
.model-group { margin: .9rem 0; min-width: 0; }
.model-group h4 { margin: 0 0 .4rem; color: var(--cyan-2); font-size: .8rem; font-weight: 650; text-transform: uppercase; letter-spacing: .07em; }
.model-card-slot { min-width: 0; }
.model-card, .model-layers { container-type: inline-size; min-width: 0; }
.model-card { margin: .55rem 0 0; border-color: var(--line-2); border-radius: 8px; background: var(--panel-2); }
.model-card > summary { padding: .55rem .7rem; font-size: .84rem; line-height: 1.35; }
.model-card > summary:focus-visible { outline: 2px solid var(--cyan-2); outline-offset: -2px; }
.model-card-title { font-weight: 650; }
.model-card-id { display: inline-block; max-width: 100%; margin-top: .1rem; font: 600 .76rem var(--mono); letter-spacing: 0; text-transform: none; color: var(--ink); overflow-wrap: anywhere; vertical-align: baseline; }
.model-card-id[data-state="emitted"] { color: var(--cyan-2); }
.model-card-id[data-state="not-emitted"], .model-card-id[data-state="label-only"] { font-weight: 400; color: var(--muted); }
.model-card-hint { display: inline-block; margin-left: .35rem; color: var(--faint); font-size: .68rem; font-weight: 500; letter-spacing: .06em; }
.model-card > .model-card-body { margin-inline: 0; padding: .55rem .75rem .8rem; font-size: .88rem; line-height: 1.45; }
.model-card-headline { margin: 0 0 .35rem; }
.model-card-subhead { margin: .8rem 0 .25rem; color: var(--muted); font-size: .72rem; font-weight: 650; text-transform: uppercase; letter-spacing: .06em; }
.model-card-list { margin: .15rem 0 0; padding-left: 1.05rem; }
.model-card-list li { margin: .25rem 0; overflow-wrap: anywhere; }
.model-card-rows, .model-layer-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; margin: .15rem 0 0; }
.model-card-rows dt, .model-layer-list dt { margin-top: .5rem; color: var(--muted); }
.model-card-rows dd { margin: 0; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.model-layers { margin: .4rem 0 1rem; padding: .6rem .8rem .75rem; border: 1px solid var(--line-2); border-radius: 8px; background: var(--panel-2); }
.model-layers-line { margin: 0 0 .4rem; font: 600 .78rem var(--mono); color: var(--cyan-2); overflow-wrap: anywhere; }
.model-layer-list { font-size: .88rem; line-height: 1.45; }
.model-layer-list dt { color: var(--ink); font-weight: 650; }
.model-layer-list dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.model-layer-value { font: 600 .8rem var(--mono); letter-spacing: 0; text-transform: none; color: var(--cyan-2); }
.model-layer-detail { color: var(--muted); font-size: .8rem; }
.model-layer-meaning { display: block; margin-top: .25rem; color: var(--muted); }
.model-layer-parts { margin-top: .35rem; font-size: .8rem; }
@container (min-width: 34rem) {
  .model-card-rows { grid-template-columns: minmax(9rem, 36%) minmax(0, 1fr); gap: .3rem .9rem; }
  .model-card-rows dt { margin-top: 0; }
  .model-layer-list { grid-template-columns: minmax(8rem, 22%) minmax(0, 1fr); gap: .55rem .9rem; }
  .model-layer-list dt { margin-top: 0; }
}
/* === end v753 B03 === */
/* === v753 B01 fusionsim === */
/* Three independent reactivity statuses, the headline retained-table rate and the source card beside it. */
.fusion-statuses { margin: 0 0 14px; }
.fusion-statuses h3 { margin: 0 0 8px; }
.fusion-status-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.fusion-status { padding: 10px 12px; border: 1px solid var(--line-2); border-left-width: 4px; border-radius: 8px; background: var(--sunken); }
.fusion-status[data-status="verified"], .fusion-status[data-status="benchmarked"] { border-left-color: var(--blue); }
.fusion-status[data-status="supported-not-benchmarked"] { border-left-color: var(--amber); }
.fusion-status[data-status="outside-supported-domain"], .fusion-status[data-status="not-verified"], .fusion-status[data-status="failed"], .fusion-status[data-status="unavailable"] { border-left-color: var(--red); }
.fusion-status[data-status="not-established"] { border-left-color: var(--violet); }
.fusion-status-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; }
.fusion-status-title { font-weight: 600; color: var(--ink); }
.fusion-status-text { margin: 6px 0 0; font-size: 14px; line-height: 1.5; color: var(--ink-2); }
.fusion-headline { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-start; margin: 0 0 12px; }
.fusion-headline-rate { flex: 1 1 14rem; min-width: 0; }
.fusion-source-card { flex: 2 1 22rem; min-width: 0; padding: 10px 12px; border: 1px solid var(--line-2); border-radius: 8px; background: var(--sunken); font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
.fusion-source-card h3 { margin: 0 0 6px; }
.fusion-source-card p { margin: 6px 0; }
.fusion-source-card .field { margin: 8px 0; }
.fusion-source-card select { width: 100%; max-width: 100%; }
.fusion-source-card .tablewrap { overflow-x: auto; }
.fusion-source-dl { display: grid; grid-template-columns: minmax(7.5rem, 11rem) minmax(0, 1fr); gap: 4px 10px; margin: 8px 0; }
.fusion-source-dl dt { color: var(--muted); font-size: 13px; }
.fusion-source-dl dd { margin: 0; color: var(--ink-2); }
@media (max-width: 480px) { .fusion-source-dl { grid-template-columns: minmax(0, 1fr); } .fusion-source-dl dd { margin-bottom: 6px; } }
.fusion-rate-caption { margin: 6px 0 0; }
/* Keep the symbol case of the headline label: uppercase would turn the rate <σv> into <ΣV>. */
.fusion-headline .metric .label { text-transform: none; }
/* Burn domain policy: exit event, events table and plots (solid before the first exit, dashed with hollow markers after). */
.fusion-burn-view { margin: 0 0 14px; padding: 10px 12px; border: 1px solid var(--line-2); border-radius: 8px; background: var(--sunken); }
.fusion-burn-view h3 { margin: 0 0 6px; }
.fusion-burn-policy, .fusion-burn-exit-line { margin: 6px 0; line-height: 1.5; overflow-wrap: anywhere; }
.fusion-burn-svg { display: block; width: 100%; max-width: 720px; height: auto; margin: 8px 0 2px; }
.fusion-burn-text { fill: var(--ink-2); font-size: 11px; }
.fusion-burn-grid { stroke: var(--line-2); stroke-width: 1; }
.fusion-burn-level { stroke: var(--muted); stroke-width: 1; stroke-dasharray: 2 4; }
.fusion-burn-level-text { fill: var(--muted); }
.fusion-burn-exit { stroke: var(--red); stroke-width: 1.4; stroke-dasharray: 6 4; }
.fusion-burn-exit-text { fill: var(--red); }
.fusion-burn-line { fill: none; stroke-width: 2.4; }
.fusion-burn-post { stroke-dasharray: 7 5; }
.fusion-burn-s-ion { stroke: var(--blue); fill: var(--blue); }
.fusion-burn-s-electron { stroke: var(--amber); fill: var(--amber); }
.fusion-burn-s-fusion { stroke: var(--violet); fill: var(--violet); }
.fusion-burn-t-ion { fill: var(--blue); } .fusion-burn-t-electron { fill: var(--amber); } .fusion-burn-t-fusion { fill: var(--violet); }
.fusion-burn-line.fusion-burn-s-ion, .fusion-burn-line.fusion-burn-s-electron, .fusion-burn-line.fusion-burn-s-fusion { fill: none; }
.fusion-burn-mark.fusion-burn-post { fill: none; stroke-width: 1.6; stroke-dasharray: none; }
.fusion-burn-events td, .fusion-burn-events th { white-space: nowrap; }
/* Alpha-energy deposition interface: the controls sit under the plasma scenario, the accounting below the headline metrics. */
.fusion-deposition-controls { margin: .85rem 0; padding: .1rem .8rem .5rem; border: 1px solid var(--line-2); border-radius: 8px; background: var(--sunken); }
.fusion-deposition-controls h3 { margin: .6rem 0 .1rem; font-size: 1rem; }
.fusion-deposition-controls select:disabled, .fusion-deposition-controls input:disabled, #deposit:disabled { opacity: .55; }
.fusion-deposition { margin: 0 0 14px; padding: 10px 12px; border: 1px solid var(--line-2); border-radius: 8px; background: var(--sunken); }
.fusion-deposition h3 { margin: 0 0 6px; }
.fusion-deposition-mode { margin: 6px 0; line-height: 1.5; overflow-wrap: anywhere; }
.fusion-deposition-table th:not(:first-child), .fusion-deposition-table td:not(:first-child) { text-align: right; white-space: nowrap; }
.fusion-deposition-table tr[data-deposition-row="sum"] > *, .fusion-deposition-table tr[data-deposition-row="source"] > * { border-top: 1px solid var(--line-2); font-weight: 600; }
/* === end v753 B01 === */

/* Startup panel is shown only when loading is slow or fails. */
.lab-startup:not([data-state=slow]):not([data-state=error]){display:none!important}