@layer base, layout, components, sections, states, utilities;

@layer base {
  *, *::before, *::after { box-sizing: border-box; }
  html { color-scheme: dark; scroll-behavior: smooth; }
  body { margin: 0; min-width: 320px; overflow-x: clip; background: var(--ink-950); color: var(--text-hi); font-family: var(--font-sans); font-size: var(--fs-body); font-synthesis: none; line-height: 1.85; text-rendering: optimizeLegibility; }
  img, svg, canvas { display: block; max-width: 100%; }
  img { height: auto; }
  button, a { color: inherit; font: inherit; }
  button { border: 0; }
  a { text-decoration-thickness: 1px; text-underline-offset: .22em; }
  h1, h2, h3, p { margin-block-start: 0; }
  h1, h2, h3 { line-height: 1.22; }
  h1, h2, h3, .brand { font-weight: 700; }
  :focus-visible { outline: 2px solid var(--gold-500); outline-offset: 3px; }
  ::selection { background: var(--gold-500); color: var(--ink-950); }
  [inert] { pointer-events: none; user-select: none; }
  section { scroll-margin-top: 80px; }
  main:focus, section[tabindex="-1"]:focus { outline: none; }
}

@layer layout {
  .section { position: relative; padding-block: var(--section-pad); background: var(--ink-950); }
  .section__inner { position: relative; z-index: 3; width: min(calc(100% - 2 * var(--gutter)), var(--container)); margin-inline: auto; padding-left: 64px; }
  .spine { position: absolute; inset: 0; z-index: 2; pointer-events: none; overflow: hidden; }
  .spine svg { width: 100%; height: 100%; overflow: visible; }
  .site-header { position: fixed; z-index: 50; top: 0; left: 0; width: 100%; height: 64px; display: flex; align-items: center; justify-content: space-between; padding-inline: var(--gutter); border-bottom: 1px solid transparent; transition: background-color var(--t-base), border-color var(--t-base); }
  .site-header.is-solid { background: rgba(6, 10, 19, .92); border-color: var(--line-dark); }
  .site-nav { display: flex; align-items: center; gap: clamp(18px, 2.4vw, 36px); }
  .site-nav > a:not(.btn) { position: relative; min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; color: var(--text-mid); font-size: var(--fs-small); text-decoration: none; }
  .site-nav > a:not(.btn) span { color: var(--text-low); font: 500 .65rem/1 var(--font-mono); letter-spacing: .12em; }
  .site-nav > a:not(.btn)::after { content: ""; position: absolute; bottom: 5px; left: 50%; width: 12px; height: 2px; background: var(--gold-500); opacity: 0; transform: translateX(-50%) scaleX(0); transition: opacity var(--t-base), transform var(--t-base) var(--ease-standard); }
  .site-nav > a.is-active { color: var(--text-hi); }
  .site-nav > a.is-active::after { opacity: 1; transform: translateX(-50%) scaleX(1); }
  .menu-trigger { display: none; }
  .mobile-menu { position: fixed; z-index: 100; inset: 0; overflow-y: auto; overscroll-behavior: contain; padding: 16px var(--gutter) 32px; background: var(--ink-950); }
  .mobile-menu[hidden] { display: none; }
  .mobile-menu__top { display: flex; min-height: 56px; align-items: center; justify-content: space-between; }
  .mobile-menu nav { display: grid; gap: 4px; margin-block: clamp(48px, 10vh, 96px) 40px; }
  .mobile-menu nav a { min-height: 56px; display: flex; align-items: center; gap: 24px; border-bottom: 1px solid var(--line-dark); font-size: var(--fs-h2); font-weight: 700; text-decoration: none; }
  .mobile-menu nav span { color: var(--gold-500); font: 500 var(--fs-micro)/1 var(--font-mono); letter-spacing: .12em; }
  .mobile-menu__mail { display: flex; width: max-content; min-height: 44px; align-items: center; margin-top: 20px; color: var(--text-mid); font-family: var(--font-mono); font-size: var(--fs-small); }
}

@layer components {
  .skip-link { position: fixed; z-index: 200; top: 10px; left: 10px; padding: 9px 14px; background: var(--gold-500); color: var(--ink-950); transform: translateY(-160%); transition: transform var(--t-fast); }
  .skip-link:focus { transform: translateY(0); }
  .brand { min-height: 44px; display: inline-flex; align-items: center; gap: 10px; color: var(--text-hi); font-family: var(--font-mono); letter-spacing: .08em; text-decoration: none; }
  .brand img { flex: 0 0 32px; }
  .brand--menu { min-height: auto; }
  .btn { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 26px; border: 1px solid transparent; border-radius: var(--radius-s); font-size: var(--fs-small); font-weight: 500; line-height: 1.3; text-decoration: none; transition: color var(--t-base), background-color var(--t-base), border-color var(--t-base), transform var(--t-fast); }
  .btn span { transition: transform var(--t-base) var(--ease-standard); }
  .btn--solid { background: var(--gold-500); color: var(--ink-950); }
  .btn--line { border-color: var(--line-dark); background: transparent; color: var(--text-hi); }
  .btn:hover span { transform: translateX(4px); }
  .btn--solid:hover { background: var(--gold-400); }
  .btn--line:hover { border-color: var(--gold-500); color: var(--gold-500); }
  .btn:active { transform: translateY(1px); }
  .nav-cta { min-height: 44px; padding: 8px 18px; }
  .menu-close { width: 44px; height: 44px; background: transparent; color: var(--text-hi); font: 300 2rem/1 var(--font-sans); cursor: pointer; }
  .section-head { display: flex; align-items: center; gap: 12px; margin-bottom: clamp(48px, 7vw, 88px); color: var(--text-hi); font-size: var(--fs-small); font-weight: 500; }
  .section-head__index { color: var(--gold-500); font: 500 var(--fs-micro)/1 var(--font-mono); letter-spacing: .12em; }
  .section-head [lang="en"] { color: var(--text-low); font: 500 var(--fs-micro)/1 var(--font-mono); letter-spacing: .12em; }
  .section-head i { width: 48px; height: 14px; margin-left: auto; background: repeating-linear-gradient(90deg, var(--line-dark) 0 1px, transparent 1px 10px); border-bottom: 1px solid var(--line-dark); }
  .section-head--paper { color: var(--ink-on-paper); }
  .section-head--paper .section-head__index { color: var(--gold-ink); }
  .section-head--paper [lang="en"] { color: var(--ink-soft-paper); }
  .section-head--paper i { background-image: repeating-linear-gradient(90deg, var(--line-paper) 0 1px, transparent 1px 10px); border-color: var(--line-paper); }
  .section-intro { max-width: 20ch; margin-bottom: clamp(48px, 8vw, 96px); font-size: var(--fs-h2); }
  .chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
  .chips span { padding: 5px 10px; border: 1px solid var(--line-dark); border-radius: 2px; color: var(--text-mid); font: 400 var(--fs-micro)/1.4 var(--font-mono); letter-spacing: .04em; }
}

@layer sections {
  .hero { position: relative; z-index: 3; min-height: 100svh; display: grid; place-items: center; overflow: hidden; isolation: isolate; background: var(--ink-950); }
  .field { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; }
  .hero__clear { position: absolute; z-index: -1; left: 50%; top: 50%; width: min(720px, 96vw); height: min(500px, 75vh); transform: translate(-50%, -50%); background: radial-gradient(ellipse, rgba(6, 10, 19, .76) 0%, rgba(6, 10, 19, .48) 48%, transparent 76%); pointer-events: none; }
  .hero__content { position: relative; z-index: 2; width: min(100% - 2 * var(--gutter), 840px); padding-block: 112px 96px; text-align: center; pointer-events: none; }
  .hero__eyebrow { margin-bottom: 24px; color: var(--gold-500); font: 500 var(--fs-micro)/1.5 var(--font-mono); letter-spacing: .12em; }
  .hero h1 { margin-bottom: 28px; font-size: var(--fs-hero); line-height: 1.12; text-wrap: balance; }
  .hero h1 .line-mask { display: block; overflow: hidden; }
  .hero h1 .line-mask > span { display: block; }
  .hero__intro { max-width: 34ch; margin: 0 auto 32px; color: var(--text-mid); text-shadow: 0 1px 24px rgba(6, 10, 19, .65); }
  .hero__actions { display: flex; justify-content: center; gap: 16px; }
  .hero__actions a { pointer-events: auto; }
  .telemetry { position: absolute; z-index: 3; color: var(--text-low); font: 400 var(--fs-micro)/1.6 var(--font-mono); letter-spacing: .1em; }
  .telemetry--tl { top: 88px; left: var(--sp-6); }
  .telemetry--tr { top: 88px; right: var(--sp-6); display: grid; justify-items: end; }
  .telemetry--bl { bottom: var(--sp-6); left: var(--sp-6); display: flex; align-items: center; gap: 12px; }
  .telemetry--bl i { width: 1px; height: 24px; background: var(--line-dark); }
  .telemetry--br { right: var(--sp-6); bottom: var(--sp-6); color: var(--gold-500); }

  .calibration { position: relative; z-index: 3; height: 72px; overflow: hidden; border-block: 1px solid var(--line-dark); background: var(--ink-950); }
  .calibration::before { content: ""; position: absolute; inset: 28px -20px auto; height: 15px; background: repeating-linear-gradient(90deg, var(--line-dark) 0 1px, transparent 1px 8px); }
  .calibration__track { position: absolute; inset: 0 auto 0 -64px; min-width: calc(100% + 240px); display: flex; align-items: flex-start; justify-content: space-around; gap: 38px; padding-top: 8px; color: var(--text-low); will-change: transform; font: 400 var(--fs-micro)/1 var(--font-mono); letter-spacing: .06em; white-space: nowrap; }
  .calibration__track span:nth-child(even) { padding-top: 39px; }

  .studio__grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px; align-items: start; }
  .studio__copy { grid-column: 1 / span 7; }
  .statement { margin-bottom: 40px; font-size: var(--fs-h2); }
  .statement > span { display: block; }
  .studio__copy > p { max-width: 44ch; color: var(--text-mid); }
  .anatomy { grid-column: 9 / -1; margin-top: 14px; }
  .anatomy svg { width: 100%; }
  .anatomy__x { fill: none; stroke: var(--text-hi); stroke-width: 12; stroke-linecap: round; }
  .anatomy__one { fill: none; stroke: var(--gold-500); stroke-width: 13; stroke-linecap: round; }
  .anatomy__leaders path { fill: none; stroke: var(--line-dark); stroke-width: 1; }
  .anatomy__labels { fill: var(--text-low); font: 400 11px var(--font-mono); letter-spacing: .06em; }
  .anatomy p { margin: 28px 0 0; color: var(--text-mid); font-size: var(--fs-small); }

  .bands { border-top: 1px solid var(--line-dark); }
  .band { position: relative; display: grid; grid-template-columns: 88px minmax(0, 1fr) 420px; gap: 32px; align-items: center; padding: 48px 24px 48px 0; border-bottom: 1px solid var(--line-dark); transition: background-color var(--t-base), transform var(--t-base) var(--ease-standard); }
  .band:hover { background: var(--ink-900); }
  .band:hover { transform: translateX(4px); }
  .band__channel { align-self: stretch; display: flex; flex-direction: column; align-items: center; gap: 18px; padding-top: 8px; color: var(--text-low); font: 500 var(--fs-micro)/1 var(--font-mono); writing-mode: vertical-rl; letter-spacing: .1em; }
  .band__channel i { width: 7px; height: 7px; border: 1px solid var(--text-low); border-radius: 50%; transition: background-color var(--t-base), border-color var(--t-base); }
  .band:hover .band__channel i, .band.is-inview .band__channel i { border-color: var(--gold-500); background: var(--gold-500); }
  .band__copy { max-width: 44ch; }
  .band__label { margin-bottom: 8px; color: var(--gold-500); font: 500 var(--fs-micro)/1 var(--font-mono); letter-spacing: .12em; }
  .band h3 { margin: 0 0 16px; font-size: var(--fs-h3); }
  .band__copy > p:not(.band__label) { margin-bottom: 0; color: var(--text-mid); }
  .viz { position: relative; height: 240px; overflow: hidden; border-block: 1px solid var(--line-dark); background: transparent; }
  .viz canvas { width: 100%; height: 100%; }
  .viz > span { position: absolute; bottom: 10px; left: 12px; color: var(--text-low); font: 400 .625rem/1 var(--font-mono); letter-spacing: .1em; }

  .evidence { color-scheme: light; background-color: var(--paper-500); color: var(--ink-on-paper); }
  .evidence::before { content: ""; position: absolute; z-index: 0; inset: 0; background: url("/2nd/assets/img/paper-grain.webp") 0 0 / 768px; opacity: .06; pointer-events: none; }
  .evidence__title { max-width: 14ch; margin-bottom: 24px; font-size: var(--fs-h2); }
  .evidence__lede { margin-bottom: 72px; color: var(--ink-soft-paper); }
  .ledger-head, .ledger__toggle { display: grid; grid-template-columns: 88px minmax(220px, 1fr) minmax(120px, auto) 64px 96px 44px; gap: 12px; align-items: center; }
  .ledger-head { min-height: 44px; padding-inline: 12px; border-block: 1px solid var(--line-paper); color: var(--ink-soft-paper); font: 500 .625rem/1 var(--font-mono); letter-spacing: .12em; }
  .ledger { margin: 0; padding: 0; list-style: none; }
  .ledger__row { border-bottom: 1px solid var(--line-paper); }
  .ledger__toggle { width: 100%; min-height: 76px; padding: 12px; background: transparent; color: var(--ink-on-paper); text-align: left; cursor: pointer; transition: background-color var(--t-base); }
  .ledger__toggle:hover { background: rgba(245, 242, 233, .72); }
  .ledger__id, .ledger__year, .ledger__status { font: 500 var(--fs-micro)/1.4 var(--font-mono); letter-spacing: .04em; }
  .ledger__name { font-size: 1.05rem; font-weight: 700; }
  .ledger__scope { color: var(--ink-soft-paper); font-size: var(--fs-small); }
  .ledger__status { display: flex; align-items: center; gap: 8px; }
  .ledger__status i { width: 6px; height: 6px; flex: 0 0 auto; border-radius: 50%; background: var(--gold-600); }
  .ledger__glyph { justify-self: center; font-size: 0; }
  .ledger__glyph::before { content: "+"; font: 400 1.5rem/1 var(--font-mono); }
  .ledger__toggle[aria-expanded="true"] .ledger__glyph::before { content: "−"; }
  .ledger__panel { display: grid; grid-template-rows: 0fr; transition: grid-template-rows var(--t-slow) var(--ease-standard); }
  .ledger__panel[hidden] { display: none; }
  .ledger__panel.is-open { grid-template-rows: 1fr; }
  .ledger__panel-inner { min-height: 0; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 520px); gap: 48px; padding-inline: 112px 56px; }
  .ledger__panel.is-open .ledger__panel-inner { padding-block: 36px 48px; }
  .ledger__panel-inner > div > p { max-width: 34ch; }
  .ledger dl { margin: 28px 0 0; font: 400 var(--fs-micro)/1.6 var(--font-mono); }
  .ledger dl div { display: grid; grid-template-columns: 56px 1fr; gap: 16px; padding-block: 4px; }
  .ledger dt { color: var(--gold-ink); }
  .ledger dd { margin: 0; color: var(--ink-soft-paper); }
  .ledger figure { margin: 0; overflow: hidden; border: 1px solid var(--line-paper); border-radius: var(--radius-m); background: rgba(245, 242, 233, .7); opacity: 0; transform: translateY(12px); transition: opacity var(--t-slow) 60ms, transform var(--t-slow) var(--ease-standard) 60ms; }
  .ledger__panel.is-open figure { opacity: 1; transform: none; }
  .evidence__foot { margin: 40px 0 0; text-align: right; }
  .evidence__foot a { min-height: 44px; display: inline-flex; align-items: center; color: var(--ink-on-paper); text-decoration-color: rgba(138, 98, 16, .45); }
  .evidence :focus-visible { outline-color: var(--gold-ink); }

  .stations { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin-top: 24px; border-top: 1px solid var(--line-dark); }
  .stations::before { content: ""; position: absolute; top: -1px; right: 100%; width: 32px; border-top: 1px solid var(--line-dark); }
  .station { position: relative; min-height: 260px; padding: 48px 12px 24px 0; }
  .station > i { position: absolute; top: -4px; left: 0; width: 7px; height: 7px; border: 1px solid var(--text-low); border-radius: 50%; background: var(--ink-950); transition: background-color var(--t-base), border-color var(--t-base); }
  .station.is-lit > i { border-color: var(--gold-500); background: var(--gold-500); }
  .station > span { color: var(--text-low); font: 500 var(--fs-micro)/1 var(--font-mono); }
  .station.is-lit > span { color: var(--gold-500); }
  .station > p[lang="en"] { margin: 24px 0 8px; color: var(--gold-500); font: 500 var(--fs-micro)/1 var(--font-mono); letter-spacing: .12em; }
  .station h3 { margin: 0 0 16px; font-size: var(--fs-h3); }
  .station h3 + p { max-width: 18ch; color: var(--text-mid); }

  .contact { position: relative; z-index: 3; min-height: 88svh; display: grid; place-items: center; overflow: hidden; isolation: isolate; background: var(--ink-950); text-align: center; }
  .contact::after { content: ""; position: absolute; z-index: -1; inset: 0; background: radial-gradient(ellipse at center, rgba(6, 10, 19, .42), rgba(6, 10, 19, .9) 72%); }
  .contact__inner { width: min(calc(100% - 2 * var(--gutter)), 820px); padding-block: 112px; }
  .closing-mark { width: 260px; margin: 0 auto 40px; overflow: visible; }
  .closing-mark path { fill: none; stroke: var(--text-hi); stroke-width: 12; stroke-linecap: round; }
  .closing-mark .closing-mark__gold { stroke: var(--gold-500); stroke-width: 13; }
  .closing-mark [data-mark-left], .closing-mark [data-mark-right] { transition: transform var(--t-cine) var(--ease-emph); }
  .js .closing-mark:not(.is-assembled) [data-mark-left] { transform: translateX(-64px); }
  .js .closing-mark:not(.is-assembled) [data-mark-right] { transform: translateX(64px); }
  .contact__eyebrow { margin-bottom: 18px; color: var(--gold-500); font: 500 var(--fs-micro)/1.5 var(--font-mono); letter-spacing: .12em; }
  .contact h2 { margin-bottom: 24px; font-size: var(--fs-hero); }
  .contact h2 + p { max-width: 38ch; margin: 0 auto 32px; color: var(--text-mid); }
  .contact .btn { padding-inline: 32px; }
  .contact__mail { min-height: 44px; display: flex; width: max-content; align-items: center; margin: 16px auto 0; color: var(--text-mid); font: 400 var(--fs-small)/1 var(--font-mono); }

  .footer { position: relative; z-index: 3; padding: 48px var(--gutter) 24px; border-top: 1px solid var(--line-dark); background: var(--ink-950); color: var(--text-low); font: 400 var(--fs-micro)/1.6 var(--font-mono); }
  .footer__top { display: grid; grid-template-columns: 1fr auto 1fr; gap: 24px; align-items: center; width: min(100%, var(--container)); margin-inline: auto; }
  .footer__brand { display: flex; align-items: center; gap: 16px; }
  .footer nav { display: flex; gap: 20px; }
  .footer a { min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; color: var(--text-mid); }
  .footer__top > a { justify-self: end; }
  .footer > p { width: min(100%, var(--container)); margin: 32px auto 0; padding-top: 20px; border-top: 1px solid var(--line-dark); }
}

@layer states {
  .js [data-reveal] { opacity: 0; transform: translateY(16px); transition: opacity var(--t-cine) var(--ease-emph), transform var(--t-cine) var(--ease-emph); }
  .js [data-reveal].is-in { opacity: 1; transform: none; }
  .js .telemetry, .js .hero__intro, .js .hero__actions, .js .hero__eyebrow { opacity: 0; animation: intro-fade var(--t-cine) var(--ease-emph) forwards; }
  .js .telemetry { animation-delay: 120ms; }
  .js .hero__eyebrow { animation-delay: 300ms; }
  .js .hero__intro { animation-delay: 420ms; }
  .js .hero__actions { animation-delay: 540ms; }
  .js .hero h1 .line-mask > span { transform: translateY(110%); animation: line-in var(--t-cine) var(--ease-emph) forwards; animation-delay: 240ms; }
  .js .hero h1 .line-mask + .line-mask > span { animation-delay: 330ms; }
  @keyframes intro-fade { to { opacity: 1; } }
  @keyframes line-in { to { transform: none; } }
  .no-js .hero, html.is-reduced .hero, html.has-static-field .hero, .hero[data-field-state="poster"] { background-color: var(--ink-950); background-image: url("/2nd/assets/img/datum-field-poster.jpg"); background-image: image-set(url("/2nd/assets/img/datum-field-poster.webp") type("image/webp"), url("/2nd/assets/img/datum-field-poster.jpg") type("image/jpeg")); background-position: center; background-size: cover; background-repeat: no-repeat; }
  .no-js .contact, html.is-reduced .contact, html.has-static-field .contact, .contact[data-field-state="poster"] { background-color: var(--ink-950); background-image: url("/2nd/assets/img/datum-field-poster.jpg"); background-image: image-set(url("/2nd/assets/img/datum-field-poster.webp") type("image/webp"), url("/2nd/assets/img/datum-field-poster.jpg") type("image/jpeg")); background-position: center; background-size: cover; background-repeat: no-repeat; }
  .no-js .spine::before { content: ""; position: absolute; top: 100svh; bottom: 0; left: max(calc((100vw - 1200px) / 2 + 32px), calc(var(--gutter) + 32px)); width: 2px; background: var(--gold-500); opacity: .5; }
  .no-js .ledger__toggle:disabled { cursor: default; }
  .no-js .ledger__panel { display: grid; grid-template-rows: 1fr; }
  .no-js .ledger__panel .ledger__panel-inner { padding-block: 36px 48px; }
  .no-js .ledger__panel figure { opacity: 1; transform: none; }
  .no-js .ledger__glyph::before { content: "−"; }
  body.menu-open { overflow: hidden; }
  .mobile-menu.is-opening { animation: intro-fade var(--t-base) var(--ease-standard) both; }
}

@layer utilities {
  .sr-only { 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; white-space: nowrap !important; border: 0 !important; }
}

@media (max-width: 1023px) {
  .section__inner { padding-left: 48px; }
  .site-nav { gap: 18px; }
  .site-nav > a:not(.btn) span { display: none; }
  .studio__copy { grid-column: 1 / -1; }
  .anatomy { grid-column: 5 / -1; margin-top: 64px; }
  .band { grid-template-columns: 72px minmax(0, 1fr); }
  .band .viz { grid-column: 2; height: 220px; }
  .ledger-head, .ledger__toggle { grid-template-columns: 76px minmax(180px, 1fr) minmax(100px, auto) 60px 92px 36px; }
  .ledger__panel-inner { grid-template-columns: 1fr 1.2fr; padding-inline: 88px 36px; }
  .stations { grid-template-columns: repeat(2, 1fr); }
  .footer__top { grid-template-columns: 1fr auto; }
  .footer nav { grid-column: 1 / -1; grid-row: 2; }
  .telemetry--bl, .telemetry--br { display: none; }
}

@media (max-width: 767px) {
  .site-header { height: 56px; }
  .site-nav { display: none; }
  .no-js .site-nav { display: flex; gap: 8px; }
  .no-js .site-nav > a:not(.btn) { padding-inline: 3px; font-size: .75rem; }
  .no-js .site-nav .nav-cta, .no-js .menu-trigger { display: none; }
  .menu-trigger { min-width: 72px; min-height: 44px; display: inline-flex; align-items: center; justify-content: flex-end; gap: 10px; padding: 0; background: transparent; color: var(--text-hi); font-size: var(--fs-small); cursor: pointer; }
  .menu-trigger__glyph { position: relative; width: 18px; height: 10px; border-block: 1px solid currentColor; }
  .section__inner { width: min(calc(100% - 2 * var(--gutter)), var(--container)); padding-left: 28px; }
  .section-head { gap: 8px; margin-bottom: 48px; }
  .section-head i { width: 28px; }
  .telemetry--tl { top: 74px; left: var(--gutter); right: var(--gutter); white-space: normal; font-size: var(--fs-micro); line-height: 1.45; letter-spacing: .04em; }
  .telemetry--tr, .telemetry--bl { display: none; }
  .telemetry--br { right: var(--gutter); bottom: 18px; display: block; }
  .no-js .spine::before { left: calc(var(--gutter) + 20px); }
  .js .spine::before { content: ""; position: absolute; top: 100svh; bottom: 0; left: calc(var(--gutter) + 20px); width: 1px; background: var(--gold-500); opacity: .42; }
  .hero__content { align-self: center; padding-block: 116px 92px; }
  .hero__eyebrow { margin-bottom: 18px; }
  .hero__intro { max-width: 30ch; font-size: .95rem; line-height: 1.75; }
  .hero__actions { flex-direction: column; width: min(100%, 330px); margin-inline: auto; }
  .calibration { height: 64px; }
  .calibration__track { transform: none !important; }
  .studio__grid { display: block; }
  .statement > span { margin-bottom: 12px; }
  .anatomy { width: min(100%, 280px); margin: 56px auto 0; }
  .band { grid-template-columns: 1fr; gap: 20px; padding: 32px 0; }
  .band:hover { transform: none; }
  .band__channel { min-height: 24px; flex-direction: row; justify-content: space-between; padding: 0; writing-mode: horizontal-tb; }
  .band__copy { grid-row: 2; }
  .band .viz { grid-column: 1; grid-row: 3; height: 140px; }
  .evidence__title br { display: none; }
  .evidence__lede { margin-bottom: 48px; }
  .ledger-head { display: none; }
  .ledger__toggle { min-height: 96px; grid-template-columns: 1fr auto; gap: 6px 12px; padding-block: 16px; }
  .ledger__id { grid-column: 1; grid-row: 1; }
  .ledger__year { grid-column: 2; grid-row: 1; }
  .ledger__name { grid-column: 1 / -1; grid-row: 2; font-size: 1rem; }
  .ledger__status { grid-column: 1; grid-row: 3; }
  .ledger__glyph { grid-column: 2; grid-row: 2 / 4; }
  .ledger__scope { display: none; }
  .ledger__panel-inner { grid-template-columns: 1fr; gap: 28px; padding-inline: 0; }
  .ledger__panel.is-open .ledger__panel-inner, .no-js .ledger__panel .ledger__panel-inner { padding-block: 28px 40px; }
  .evidence__foot { text-align: left; }
  .stations { grid-template-columns: 1fr; gap: 0; margin-left: 8px; border-top: 0; border-left: 1px solid var(--line-dark); }
  .stations::before { display: none; }
  .station { min-height: auto; padding: 12px 0 52px 40px; }
  .station > i { top: 18px; left: -4px; }
  .station h3 + p { max-width: 22ch; }
  .closing-mark { width: 220px; }
  .contact h2 { max-width: 8ch; margin-inline: auto; }
  .footer__top { display: grid; grid-template-columns: 1fr auto; }
  .footer__brand span { display: none; }
  .footer nav { flex-wrap: wrap; gap: 2px 20px; }

  .no-js .hero, html.is-reduced .hero, html.has-static-field .hero, .hero[data-field-state="poster"],
  .no-js .contact, html.is-reduced .contact, html.has-static-field .contact, .contact[data-field-state="poster"] {
    background-image: url("/2nd/assets/img/datum-field-poster.jpg");
    background-image: image-set(url("/2nd/assets/img/datum-field-poster-mobile.webp") type("image/webp"), url("/2nd/assets/img/datum-field-poster.jpg") type("image/jpeg"));
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .js [data-reveal] { opacity: 1; transform: none; }
  .field { visibility: hidden; }
  .closing-mark [data-mark-left], .closing-mark [data-mark-right] { transform: none !important; }
  .station > i { border-color: var(--gold-500); background: var(--gold-500); }
  .btn:hover span, .btn:active, .band:hover { transform: none !important; }
}

@media (forced-colors: active) {
  .field { display: none; }
  .hero, .contact { background-color: Canvas; background-image: none !important; }
  .btn, .viz, .ledger__row, .ledger-head, .site-header { border-color: CanvasText; }
  .spine { display: none; }
}