:root {
  color-scheme: dark light;
  --bg: #080a0f;
  --panel: rgba(255, 255, 255, .065);
  --panel-strong: rgba(255, 255, 255, .105);
  --text: #f4f7fb;
  --muted: #aab4c3;
  --dim: #7f8da1;
  --line: rgba(255, 255, 255, .14);
  --good: #7cffb2;
  --warn: #ffd166;
  --bad: #ff6b6b;
  --blue: #8ec5ff;
  --purple: #d4a5ff;
  --good-rgb: 124, 255, 178;
  --warn-rgb: 255, 209, 102;
  --bad-rgb: 255, 107, 107;
  --blue-rgb: 142, 197, 255;
  --purple-rgb: 212, 165, 255;
  --shadow: 0 24px 80px rgba(0, 0, 0, .42);
  --card-shadow: 0 12px 40px rgba(0, 0, 0, .22);
  --section-shadow: 0 18px 54px rgba(0, 0, 0, .14);
  --surface-rgb: 255, 255, 255;
  --section-wash: rgba(0, 0, 0, .12);
  --inset-surface: rgba(0, 0, 0, .16);
  --control-surface: rgba(0, 0, 0, .2);
  --solid-panel: #0c1018;
  --solid-panel-alt: #0c1119;
  --solid-panel-rgb: 12, 16, 24;
  --dark-panel-rgb: 8, 10, 15;
  --media-overlay-rgb: 8, 10, 15;
  --deep-panel: #10151d;
  --control-bg: #111720;
  --lead: #dce5f0;
  --code-text: #dbe9f8;
  --pre-text: #dbe9f8;
  --pre-surface: rgba(3, 6, 10, .72);
  --feature-text: #c6d0dd;
  --callout-text: #e9fff1;
  --terminal-surface: rgba(0, 0, 0, .38);
  --on-primary: #07100b;
  --on-solid-accent: #07100b;
  --on-gradient: #07101b;
  --primary-start: var(--good);
  --primary-end: #bcffd6;
  --external-svg-filter: brightness(0) saturate(100%) invert(1);
  --external-svg-filter-good: brightness(0) saturate(100%) invert(91%) sepia(35%) saturate(762%) hue-rotate(75deg) brightness(103%) contrast(102%);
  --external-svg-filter-blue: brightness(0) saturate(100%) invert(78%) sepia(27%) saturate(786%) hue-rotate(179deg) brightness(103%) contrast(103%);
  --body-background:
    radial-gradient(circle at 18% 5%, rgba(68, 132, 255, .32), transparent 32rem),
    radial-gradient(circle at 82% 12%, rgba(172, 83, 255, .24), transparent 34rem),
    radial-gradient(circle at 50% 92%, rgba(124, 255, 178, .12), transparent 38rem),
    linear-gradient(180deg, #080a0f 0%, #0b0f17 48%, #07080c 100%);
  --robotics-background:
    radial-gradient(circle at 16% 5%, rgba(124, 255, 178, .2), transparent 30rem),
    radial-gradient(circle at 84% 10%, rgba(142, 197, 255, .22), transparent 34rem),
    radial-gradient(circle at 50% 92%, rgba(212, 165, 255, .12), transparent 38rem),
    linear-gradient(180deg, #080a0f 0%, #0b0f17 48%, #07080c 100%);
  --header-background: linear-gradient(180deg, rgba(8, 10, 15, .82), rgba(8, 10, 15, .45));
  --header-line: rgba(255, 255, 255, .06);
  --radius: 22px;
  --max: 1180px;
  --mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

@media (prefers-color-scheme: light) {
  :root {
    color-scheme: light dark;
    --bg: #f6f8fb;
    --panel: rgba(255, 255, 255, .76);
    --panel-strong: rgba(255, 255, 255, .94);
    --text: #152033;
    --muted: #4e5f73;
    --dim: #5f6f83;
    --line: rgba(18, 42, 68, .18);
    --good: #087146;
    --warn: #805a00;
    --bad: #b4233a;
    --blue: #1c64ad;
    --purple: #7540a1;
    --good-rgb: 8, 113, 70;
    --warn-rgb: 128, 90, 0;
    --bad-rgb: 180, 35, 58;
    --blue-rgb: 28, 100, 173;
    --purple-rgb: 117, 64, 161;
    --shadow: 0 24px 70px rgba(34, 53, 74, .16);
    --card-shadow: 0 12px 32px rgba(34, 53, 74, .1);
    --section-shadow: 0 18px 48px rgba(34, 53, 74, .11);
    --surface-rgb: 18, 42, 68;
    --section-wash: rgba(255, 255, 255, .34);
    --inset-surface: rgba(255, 255, 255, .68);
    --control-surface: rgba(255, 255, 255, .9);
    --solid-panel: #fff;
    --solid-panel-alt: #fff;
    --solid-panel-rgb: 255, 255, 255;
    --dark-panel-rgb: 255, 255, 255;
    --deep-panel: #fff;
    --control-bg: #fff;
    --lead: #32445a;
    --code-text: #29435f;
    --feature-text: #3e5065;
    --callout-text: #163d2b;
    --terminal-surface: #132135;
    --on-solid-accent: #fff;
    --on-gradient: #fff;
    --primary-start: #72dfa2;
    --primary-end: #c3f5d5;
    --external-svg-filter: brightness(0) saturate(100%);
    --external-svg-filter-good: brightness(0) saturate(100%) invert(32%) sepia(24%) saturate(1902%) hue-rotate(108deg) brightness(92%) contrast(94%);
    --external-svg-filter-blue: brightness(0) saturate(100%) invert(35%) sepia(50%) saturate(1093%) hue-rotate(169deg) brightness(91%) contrast(91%);
    --body-background:
      radial-gradient(circle at 18% 5%, rgba(68, 132, 255, .16), transparent 32rem),
      radial-gradient(circle at 82% 12%, rgba(172, 83, 255, .12), transparent 34rem),
      radial-gradient(circle at 50% 92%, rgba(24, 153, 88, .09), transparent 38rem),
      linear-gradient(180deg, #f8faff 0%, #f2f6fb 48%, #f8fafc 100%);
    --robotics-background:
      radial-gradient(circle at 16% 5%, rgba(24, 153, 88, .12), transparent 30rem),
      radial-gradient(circle at 84% 10%, rgba(68, 132, 255, .15), transparent 34rem),
      radial-gradient(circle at 50% 92%, rgba(117, 64, 161, .09), transparent 38rem),
      linear-gradient(180deg, #f8faff 0%, #f2f6fb 48%, #f8fafc 100%);
    --header-background: linear-gradient(180deg, rgba(248, 250, 253, .92), rgba(248, 250, 253, .72));
    --header-line: rgba(18, 42, 68, .1);
  }
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  background: var(--bg);
}

body {
  margin: 0;
  min-height: 100vh;
  color: var(--text);
  font-family: var(--sans);
  background: var(--body-background);
  line-height: 1.55;
}

a {
  color: inherit;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
summary:focus-visible {
  outline: 3px solid var(--warn);
  outline-offset: 3px;
}

.skip-link {
  position: fixed;
  top: 12px;
  left: 12px;
  z-index: 100;
  padding: 10px 14px;
  border-radius: 8px;
  background: var(--text);
  color: var(--bg);
  font-weight: 800;
  text-decoration: none;
  transform: translateY(-160%);
  transition: transform .2s ease;
}

.skip-link:focus {
  transform: translateY(0);
}

.noise {
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .035;
  background-image: url("data:image/svg+xml,%3Csvg width='768' height='768' viewBox='0 0 768 768' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n' color-interpolation-filters='sRGB'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='4' seed='7' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='768' height='768' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
  background-position: center top;
  background-size: 768px 768px;
  z-index: 0;
}

.wrap {
  width: min(var(--max), calc(100% - 36px));
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

body > header {
  padding: 16px 0;
  position: sticky;
  top: 0;
  z-index: 70;
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
  /* Do not force this filtered header onto its own transform layer. Safari beta
     builds can retain stale rectangular textures around composited descendants. */
  background: var(--header-background);
  border-bottom: 1px solid var(--header-line);
}

nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.brand {
  display: flex;
  align-items: center;
  gap: 12px;
  font-weight: 820;
  letter-spacing: -.04em;
  font-size: 19px;
  text-decoration: none;
}

.mark {
  display: block;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  border-radius: 12px;
  object-fit: cover;
  box-shadow: 0 0 40px rgba(var(--good-rgb), .25);
}

.links {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
}

.links a,
.nav-more > summary,
.links .install-app-cta,
.menu-btn {
  text-decoration: none;
  color: var(--muted);
  font-family: inherit;
  font-size: 13px;
  padding: 8px 10px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: none;
}

.links > a,
.links > .install-app-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.links > a::before,
.links > .install-app-cta::before,
.nav-more > summary::before,
.nav-panel a::before {
  content: "";
  display: block;
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
  background: var(--nav-icon) center / contain no-repeat;
}

.links > a:is([href="/"], [href="index.html"]) { --nav-icon: url("../images/lucide-0.468.0-house.svg?v=2"); }
.links > a[href="evidence.html"] { --nav-icon: url("../images/lucide-0.468.0-badge-check.svg?v=2"); }
.links > a[href="benchmarks.html"] { --nav-icon: url("../images/lucide-0.468.0-chart-no-axes-combined.svg?v=2"); }
.links > a[href="use-cases.html"] { --nav-icon: url("../images/lucide-0.468.0-grid-2x2.svg?v=2"); }
.links > a[href="adoption.html"] { --nav-icon: url("../images/lucide-0.468.0-rocket.svg?v=2"); }
.links > a[href="investors.html"] { --nav-icon: url("../images/lucide-0.468.0-badge-dollar-sign.svg?v=2"); }
.links > a.coffee { --nav-icon: url("../images/lucide-0.468.0-coffee.svg?v=2"); }
.links > .install-app-cta { --nav-icon: url("../images/lucide-0.468.0-download.svg?v=2"); }
.nav-more > summary { --nav-icon: url("../images/lucide-0.468.0-folder.svg?v=2"); }

.links a:hover,
.links .install-app-cta:hover,
.links .install-app-cta:focus-visible,
.links a.active,
.nav-more > summary:hover,
.nav-more[open] > summary,
.nav-more.active-section > summary {
  color: var(--text);
  border-color: var(--line);
  background: rgba(var(--surface-rgb), .055);
}

.links .install-app-cta {
  cursor: pointer;
}

@media (min-width: 1041px) {
  .links > .install-app-cta span {
    display: none;
  }
}

.links > a.active,
.nav-more.active-section > summary {
  border-color: rgba(var(--good-rgb), .62);
  background:
    radial-gradient(circle at 50% 42%, rgba(var(--good-rgb), .14), transparent 62%),
    rgba(var(--surface-rgb), .065);
}

.nav-more {
  position: relative;
}

.nav-more > summary {
  display: flex;
  align-items: center;
  gap: 6px;
  list-style: none;
  cursor: pointer;
}

.nav-more > summary::-webkit-details-marker {
  display: none;
}

.nav-more > summary span {
  display: block;
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  overflow: hidden;
  color: inherit;
  background: url("../images/lucide-0.468.0-chevron-down.svg?v=2") center / contain no-repeat;
  font-size: 0;
  transition: transform .2s ease;
}

.nav-more[open] > summary span {
  transform: rotate(180deg);
}

.nav-panel {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  width: min(500px, calc(100vw - 36px));
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: var(--solid-panel);
  box-shadow: var(--shadow);
  max-height: calc(100vh - 96px);
  max-height: calc(100dvh - 96px);
  overflow-y: auto;
  overscroll-behavior: contain;
  z-index: 80;
}

.nav-panel a {
  --nav-accent: var(--good);
  --nav-tint: rgba(var(--good-rgb), .08);
  position: relative;
  display: grid;
  grid-template-rows: auto auto;
  place-items: center;
  align-content: center;
  gap: 10px;
  min-width: 0;
  min-height: 138px;
  aspect-ratio: 1;
  padding: 16px 10px 14px;
  border: 1px solid rgba(var(--surface-rgb), .1);
  border-radius: 20px;
  color: var(--nav-accent);
  background:
    radial-gradient(circle at 50% 42%, var(--nav-tint), transparent 55%),
    rgba(var(--surface-rgb), .035);
  overflow: hidden;
  text-align: center;
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}

.nav-panel a:hover,
.nav-panel a:focus,
.nav-panel a:focus-visible {
  z-index: 2;
  transform: translateY(-2px);
  border-color: rgba(var(--surface-rgb), .24);
  background:
    radial-gradient(circle at 50% 42%, var(--nav-tint), transparent 58%),
    rgba(var(--surface-rgb), .065);
}

.nav-panel a.active {
  border-color: var(--nav-accent);
  background:
    radial-gradient(circle at 50% 42%, var(--nav-tint), transparent 62%),
    rgba(var(--surface-rgb), .09);
}

.nav-panel a::before {
  align-self: center;
  width: 38px;
  height: 38px;
}

.nav-panel a strong {
  align-self: center;
  color: var(--text);
  font-size: 12px;
  line-height: 1.25;
}

.nav-panel a small {
  position: absolute;
  inset: 8px;
  z-index: 4;
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 14px;
  color: var(--text);
  background: var(--solid-panel);
  box-shadow: 0 12px 36px rgba(0, 0, 0, .45);
  font: 10px/1.4 var(--mono);
  opacity: 0;
  pointer-events: none;
  transform: scale(.96);
  transition: opacity .15s ease, transform .15s ease;
}

.nav-panel a:hover small,
.nav-panel a:focus small,
.nav-panel a:focus-within small {
  opacity: 1;
  transform: scale(1);
}

.nav-panel a.active::after {
  content: "✓";
  position: absolute;
  top: 10px;
  right: 11px;
  color: var(--good);
  font-family: var(--mono);
}

.nav-panel a[href="thinking-with-ai.html"] {
  --nav-icon: url("../images/lucide-0.468.0-brain-cog.svg?v=2");
  --nav-accent: var(--good);
  --nav-tint: rgba(var(--good-rgb), .11);
}

.nav-panel a[href="guides.html"] {
  --nav-icon: url("../images/lucide-0.468.0-book-open-text.svg?v=2");
}

.nav-panel a[href="eu-ai-act.html"] {
  --nav-icon: url("../images/lucide-0.468.0-scale.svg?v=2");
  --nav-accent: var(--blue);
  --nav-tint: rgba(var(--blue-rgb), .11);
}

.nav-panel a[href="tools.html"] {
  --nav-icon: url("../images/lucide-0.468.0-wrench.svg?v=2");
  --nav-accent: var(--blue);
  --nav-tint: rgba(var(--blue-rgb), .11);
}

.nav-panel a[href="rag.html"] {
  --nav-icon: url("../images/lucide-0.468.0-git-fork.svg?v=2");
  --nav-accent: var(--good);
  --nav-tint: rgba(var(--good-rgb), .11);
}

.nav-panel a[href="local-models.html"] {
  --nav-icon: url("../images/lucide-0.468.0-laptop.svg?v=2");
  --nav-accent: var(--purple);
  --nav-tint: rgba(var(--purple-rgb), .11);
}

.nav-panel a[href="cloud-models.html"] {
  --nav-icon: url("../images/lucide-0.468.0-cloud.svg?v=2");
  --nav-accent: var(--blue);
  --nav-tint: rgba(var(--blue-rgb), .11);
}

.nav-panel a[href="training-models.html"] {
  --nav-icon: url("../images/lucide-0.468.0-brain-circuit.svg?v=2");
  --nav-accent: var(--warn);
  --nav-tint: rgba(var(--warn-rgb), .1);
}

.nav-panel a[href="robotics.html"] {
  --nav-icon: url("../images/lucide-0.468.0-bot.svg?v=2");
}

.nav-panel a[href="remote-spark.html"] {
  --nav-icon: url("../images/lucide-0.468.0-monitor-up.svg?v=2");
  --nav-accent: var(--blue);
  --nav-tint: rgba(var(--blue-rgb), .11);
}

.nav-panel a[href="dgx-station.html"] {
  --nav-icon: url("../images/lucide-0.468.0-server.svg?v=2");
  --nav-accent: var(--purple);
  --nav-tint: rgba(var(--purple-rgb), .11);
}

.nav-panel a[href="diy-palantir.html"] {
  --nav-icon: url("../images/lucide-0.468.0-network.svg?v=2");
  --nav-accent: var(--warn);
  --nav-tint: rgba(var(--warn-rgb), .1);
}

.coffee {
  border-color: rgba(var(--good-rgb), .28) !important;
  color: var(--good) !important;
}

.menu-btn {
  display: none;
  cursor: pointer;
}

.hero {
  padding: 48px 0;
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 34px;
  align-items: center;
}

.hero > section {
  padding: 0;
  align-self: start;
}

.hero.single {
  grid-template-columns: 1fr;
  max-width: var(--max);
}

.hero.single > section {
  width: min(100%, 900px);
}

.eyebrow,
.tag {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--good);
  background: rgba(var(--good-rgb), .09);
  border: 1px solid rgba(var(--good-rgb), .25);
  border-radius: 999px;
  padding: 8px 12px;
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: .03em;
  text-transform: uppercase;
}

.tag {
  margin-bottom: 16px;
  padding: 6px 9px;
  font-size: 11px;
  letter-spacing: .04em;
}

.pulse {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--good);
  box-shadow: 0 0 0 0 rgba(var(--good-rgb), .75);
  animation: pulse 1.8s infinite;
}

@keyframes pulse {
  70% { box-shadow: 0 0 0 11px rgba(var(--good-rgb), 0); }
  100% { box-shadow: 0 0 0 0 rgba(var(--good-rgb), 0); }
}

h1 {
  margin: 22px 0 16px;
  font-size: clamp(50px, 6.8vw, 96px);
  line-height: .96;
  letter-spacing: -.062em;
  max-width: 11.5ch;
  text-wrap: balance;
}

.hero.single h1 {
  max-width: 14.5ch;
}

.grad {
  background: linear-gradient(90deg, var(--text), var(--good) 42%, var(--blue) 72%, var(--purple));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  color: transparent;
  margin-inline: -.035em;
  padding-inline: .035em;
}

.lead {
  color: var(--lead);
  font-size: clamp(18px, 2vw, 24px);
  max-width: 780px;
  letter-spacing: -.02em;
}

.lead strong {
  color: var(--text);
}

.hero-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 26px;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  text-decoration: none;
  border-radius: 999px;
  padding: 13px 18px;
  font-weight: 760;
  font-size: 14px;
  border: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .075);
  color: var(--text);
  box-shadow: 0 10px 30px rgba(0, 0, 0, .2);
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}

.btn.primary {
  color: var(--on-primary);
  background: linear-gradient(135deg, var(--primary-start), var(--primary-end));
  border-color: transparent;
}

.btn:hover {
  transform: translateY(-1px);
}

.install-banner {
  position: fixed;
  bottom: 20px;
  left: 20px;
  z-index: 55;
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  width: min(440px, calc(100vw - 40px));
  padding: 12px 40px 12px 12px;
  border: 1px solid rgba(var(--good-rgb), .38);
  border-radius: 16px;
  background: rgba(var(--solid-panel-rgb), .96);
  box-shadow: 0 16px 48px rgba(0, 0, 0, .4);
  backdrop-filter: blur(18px);
}

.install-banner[hidden] {
  display: none;
}

.install-banner-mark {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border: 1px solid rgba(var(--good-rgb), .3);
  border-radius: 12px;
  background: rgba(var(--good-rgb), .08);
}

.install-banner-mark img {
  display: block;
  width: 32px;
  height: 32px;
  border-radius: 9px;
}

.install-banner-copy {
  min-width: 0;
}

.install-banner-copy h2 {
  margin: 0;
  font-size: 15px;
  letter-spacing: -.025em;
}

.install-banner-copy .install-banner-instructions {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.install-banner-actions {
  display: flex;
}

.install-banner-actions .btn {
  min-height: 34px;
  padding: 8px 11px;
  font-size: 11px;
  white-space: nowrap;
}

.install-banner-actions .btn[hidden] {
  display: none;
}

.install-banner-actions .btn::before {
  content: "";
  width: 14px;
  height: 14px;
  background: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/download.svg") center / contain no-repeat;
  filter: var(--external-svg-filter);
}

.install-banner-dismiss {
  position: absolute;
  top: 8px;
  right: 8px;
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  padding: 0;
  border: 0;
  color: var(--dim);
  background: transparent;
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
}

.install-banner-dismiss::before {
  content: "";
  width: 15px;
  height: 15px;
  background:
    linear-gradient(45deg, transparent 44%, currentColor 44% 56%, transparent 56%),
    linear-gradient(-45deg, transparent 44%, currentColor 44% 56%, transparent 56%);
}

.install-banner-dismiss:focus-visible,
.install-banner-dismiss:hover {
  color: var(--text);
}

.matrix-unlock-banner {
  z-index: 70;
  border-color: rgba(244, 66, 125, .5);
  box-shadow:
    0 0 0 1px rgba(244, 66, 125, .08) inset,
    0 16px 48px rgba(0, 0, 0, .4),
    0 0 34px rgba(244, 66, 125, .13);
  animation: matrix-unlock-banner-in .32s cubic-bezier(.2, .8, .2, 1) both;
}

.matrix-unlock-banner.is-leaving {
  pointer-events: none;
  animation: matrix-unlock-banner-out .18s ease-in both;
}

.matrix-unlock-banner .install-banner-mark {
  overflow: hidden;
  border-color: rgba(244, 66, 125, .48);
  background:
    linear-gradient(rgba(244, 66, 125, .1) 1px, transparent 1px),
    linear-gradient(90deg, rgba(244, 66, 125, .1) 1px, transparent 1px),
    rgba(244, 66, 125, .07);
  background-size: 5px 5px;
  box-shadow: 0 0 20px rgba(244, 66, 125, .13) inset;
}

.matrix-unlock-commando {
  display: block;
  width: 32px;
  height: 32px;
  filter: drop-shadow(0 0 5px rgba(244, 66, 125, .32));
}

.matrix-unlock-commando .pixel-shadow {
  fill: #14101b;
}

.matrix-unlock-commando .pixel-skin {
  fill: #f0c7aa;
}

.matrix-unlock-commando .pixel-bandana {
  fill: #f4427d;
}

.matrix-unlock-commando .pixel-gear {
  fill: #65c5ca;
}

.matrix-unlock-commando .pixel-detail {
  fill: #f8f3ff;
}

@keyframes matrix-unlock-banner-in {
  from {
    opacity: 0;
    transform: translate3d(-14px, 10px, 0) scale(.98);
  }
}

@keyframes matrix-unlock-banner-out {
  to {
    opacity: 0;
    transform: translate3d(-8px, 6px, 0) scale(.985);
  }
}

@media (prefers-reduced-motion: reduce) {
  .matrix-unlock-banner,
  .matrix-unlock-banner.is-leaving {
    animation: none;
  }
}

/* Keep the two fixed helpers side by side until their combined width no longer fits. */
@media (max-width: 960px) {
  .has-page-menu .install-banner {
    bottom: 78px;
  }
}

@media (max-width: 560px) {
  .install-banner {
    right: 12px;
    bottom: 12px;
    left: 12px;
    grid-template-columns: 40px minmax(0, 1fr);
    width: auto;
  }

  .install-banner-actions {
    grid-column: 2;
    justify-self: start;
  }

  .has-page-menu .install-banner {
    bottom: 74px;
  }
}

.scorecard {
  padding: 22px;
  border-radius: var(--radius);
  background: linear-gradient(180deg, rgba(var(--surface-rgb), .105), rgba(var(--surface-rgb), .055));
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  position: relative;
  overflow: hidden;
}

.scorecard::before {
  content: "";
  position: absolute;
  inset: -1px;
  background: radial-gradient(circle at 70% 0%, rgba(var(--good-rgb), .26), transparent 28rem);
  pointer-events: none;
}

.scorecard > * {
  position: relative;
  z-index: 1;
}

.terminal {
  font-family: var(--mono);
  background: var(--terminal-surface);
  border: 1px solid rgba(var(--surface-rgb), .12);
  border-radius: 16px;
  padding: 16px;
  color: #d9ffe8;
  font-size: 13px;
  overflow: hidden;
}

.term-head {
  display: flex;
  gap: 7px;
  margin-bottom: 14px;
}

.dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--dim);
  opacity: .9;
}

.dot:nth-child(1) { background: var(--bad); }
.dot:nth-child(2) { background: var(--warn); }
.dot:nth-child(3) { background: var(--good); }

.metric-big {
  margin: 22px 0 6px;
  font-size: clamp(54px, 9vw, 96px);
  line-height: .9;
  letter-spacing: -.07em;
  font-weight: 900;
  color: var(--good);
  text-shadow: 0 0 30px rgba(var(--good-rgb), .2);
}

.metric-label,
.muted {
  color: var(--muted);
}

.metric-label {
  font-size: 14px;
}

.mini-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin-top: 20px;
}

.mini {
  background: rgba(var(--surface-rgb), .065);
  border: 1px solid rgba(var(--surface-rgb), .12);
  border-radius: 16px;
  padding: 15px;
}

.mini b {
  display: block;
  font-size: 24px;
  letter-spacing: -.04em;
}

.mini span {
  color: var(--muted);
  font-size: 12px;
}

.ticker {
  margin-top: 26px;
  overflow: hidden;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .035);
}

.ticker-track {
  display: flex;
  gap: 22px;
  width: max-content;
  padding: 12px 0;
  animation: marquee 28s linear infinite;
  font-family: var(--mono);
  font-size: 12px;
  color: var(--muted);
}

.ticker span {
  white-space: nowrap;
}

@keyframes marquee {
  to { transform: translateX(-50%); }
}

.proof-band {
  padding: 0 0 28px;
}

.proof-strip {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.proof-stat {
  display: grid;
  gap: 4px;
  padding: 24px 26px;
  text-decoration: none;
  transition: background .2s ease;
}

.proof-stat + .proof-stat {
  border-left: 1px solid var(--line);
}

.proof-stat:hover {
  background: rgba(var(--surface-rgb), .045);
}

.proof-stat strong {
  color: var(--good);
  font-size: clamp(38px, 5vw, 62px);
  line-height: .95;
  letter-spacing: -.06em;
}

.proof-stat span {
  font-size: 15px;
  font-weight: 760;
}

.proof-stat small {
  color: var(--dim);
  font-family: var(--mono);
  font-size: 11px;
}

section {
  padding: 54px 0;
}

section[id] {
  scroll-margin-top: 110px;
}

[data-page-menu-item] {
  scroll-margin-top: 110px;
}

.section-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 22px;
}

.heading-line {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.heading-line h2 {
  min-width: 0;
}

.section-share {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 29px;
  margin-bottom: 0;
  padding: 7px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  background: rgba(var(--surface-rgb), .045);
  font: 650 10px/1 var(--mono);
  white-space: nowrap;
  cursor: pointer;
}

.section-share:hover {
  color: var(--text);
  background: rgba(var(--surface-rgb), .085);
}

.section-share-icon {
  display: block;
  flex: 0 0 auto;
  width: 13px;
  height: 13px;
  color: var(--good);
  background: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/link-2.svg") center / contain no-repeat;
  filter: var(--external-svg-filter-good);
}

.section-share-label {
  display: block;
  color: inherit;
  line-height: 1;
}

.section-disclosure {
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.section-disclosure > summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 34px;
  gap: 14px;
  align-items: center;
  padding: 17px 4px;
  list-style: none;
  color: var(--text);
  font-weight: 780;
  cursor: pointer;
  transition: background .2s ease;
}

.section-disclosure > summary::-webkit-details-marker {
  display: none;
}

.section-disclosure > summary small {
  color: var(--dim);
  font: 10px var(--mono);
  text-transform: uppercase;
}

.section-disclosure > summary::after {
  content: "+";
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--good);
  font: 500 20px/1 var(--sans);
}

.section-disclosure[open] > summary::after {
  content: "−";
}

.section-disclosure > summary:hover,
.section-disclosure[open] > summary {
  background: rgba(var(--surface-rgb), .035);
}

.section-disclosure-body {
  padding: 24px 0 4px;
}

.section-disclosure-body > :first-child {
  margin-top: 0;
}

.clipboard-fallback {
  position: fixed;
  left: -9999px;
  opacity: 0;
}

h2 {
  margin: 0;
  font-size: clamp(32px, 5vw, 58px);
  line-height: .95;
  letter-spacing: -.06em;
  max-width: 850px;
}

.section-kicker {
  color: var(--muted);
  max-width: 430px;
  font-size: 15px;
}

.cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-top: 20px;
}

.cards.three {
  grid-template-columns: repeat(3, 1fr);
}

.card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 22px;
  box-shadow: var(--card-shadow);
  transition: border-color .2s ease, background .2s ease;
}

.cards .card:hover {
  border-color: rgba(var(--blue-rgb), .32);
  background: rgba(var(--surface-rgb), .085);
}

.card h3 {
  margin: 0 0 10px;
  font-size: 21px;
  letter-spacing: -.035em;
}

.card p {
  margin: 0;
  color: var(--muted);
}

.card a.more {
  display: inline-block;
  margin-top: 15px;
  color: var(--good);
  text-decoration: none;
  font-weight: 700;
}

.card a.more:hover,
.source a:hover {
  text-decoration: underline;
}

.source {
  font-size: 12px;
  color: var(--dim);
  margin-top: 16px !important;
}

.source a {
  color: var(--blue);
}

.evidence-page .card {
  display: flex;
  flex-direction: column;
}

.evidence-page .source {
  margin-top: auto !important;
  padding-top: 16px;
}

.big-panel {
  background: linear-gradient(180deg, rgba(var(--surface-rgb), .115), rgba(var(--surface-rgb), .055));
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 28px;
  box-shadow: var(--shadow);
}

.comparison,
.split,
.calculator {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.split {
  grid-template-columns: .86fr 1.14fr;
  align-items: stretch;
}

.calculator {
  grid-template-columns: .95fr 1.05fr;
}

.bad-panel {
  border-color: rgba(var(--bad-rgb), .25);
  background: linear-gradient(180deg, rgba(var(--bad-rgb), .1), rgba(var(--surface-rgb), .045));
}

.good-panel {
  border-color: rgba(var(--good-rgb), .25);
  background: linear-gradient(180deg, rgba(var(--good-rgb), .1), rgba(var(--surface-rgb), .045));
}

ul {
  margin: 12px 0 0;
  padding-left: 20px;
  color: var(--muted);
}

li {
  margin: 8px 0;
}

.quote {
  font-size: clamp(27px, 4vw, 50px);
  letter-spacing: -.055em;
  line-height: 1.06;
  margin: 0;
}

.thesis {
  font-size: clamp(28px, 4vw, 48px);
  line-height: 1.02;
  letter-spacing: -.055em;
  margin: 0;
}

.note {
  color: var(--dim);
  font-size: 12px;
  margin-top: 14px;
}

.form {
  display: grid;
  gap: 15px;
}

label {
  display: grid;
  gap: 7px;
  font-size: 13px;
  color: var(--muted);
}

input[type="range"] {
  width: 100%;
  accent-color: var(--good);
}

.value-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  color: var(--text);
  font-family: var(--mono);
  font-size: 12px;
}

.result {
  display: grid;
  gap: 14px;
}

.result-number {
  font-size: clamp(45px, 7vw, 78px);
  font-weight: 900;
  letter-spacing: -.07em;
  line-height: .92;
  color: var(--good);
}

.result-line {
  color: var(--muted);
}

.callout {
  border: 1px solid rgba(var(--good-rgb), .26);
  background: rgba(var(--good-rgb), .075);
  border-radius: var(--radius);
  padding: 24px;
  color: var(--callout-text);
}

.axis {
  display: grid;
  gap: 12px;
}

.axis-row {
  display: grid;
  grid-template-columns: 150px 1fr 86px;
  gap: 12px;
  align-items: center;
  font-size: 14px;
}

.bar {
  height: 12px;
  border-radius: 999px;
  background: rgba(var(--surface-rgb), .08);
  overflow: hidden;
  border: 1px solid rgba(var(--surface-rgb), .1);
}

.bar > i {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--good), var(--blue));
}

.axis-row small {
  color: var(--muted);
  text-align: right;
  font-family: var(--mono);
}

.columns {
  columns: 2 360px;
  column-gap: 28px;
}

.columns p {
  break-inside: avoid;
  margin-top: 0;
  color: var(--muted);
}

.timeline {
  display: grid;
  gap: 8px;
}

.step {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 13px;
  align-items: center;
  padding: 15px;
  border: 1px solid var(--line);
  background: var(--panel);
  border-radius: 14px;
}

.step b {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  justify-self: center;
  align-self: center;
  border: 1px solid rgba(var(--good-rgb), .24);
  border-radius: 10px;
  color: var(--good);
  background: rgba(var(--good-rgb), .055);
  font: 750 10px/1 var(--mono);
}

.step h3 {
  margin: 0 0 4px;
  letter-spacing: -.03em;
}

.step p {
  margin: 0;
  color: var(--muted);
}

.faq-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.faq-grid .card {
  height: 100%;
  min-width: 0;
}

.faq-grid h3 {
  margin-top: 0;
}

@media (max-width: 760px) {
  .faq-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

.path {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}

.path .card {
  position: relative;
}

.path .card::after {
  content: "→";
  position: absolute;
  right: -11px;
  top: 50%;
  color: var(--good);
  font-size: 24px;
}

.path .card:last-child::after {
  display: none;
}

.badge {
  display: inline-block;
  font-family: var(--mono);
  font-size: 11px;
  padding: 4px 7px;
  border-radius: 999px;
  border: 1px solid var(--line);
  color: var(--muted);
}

.filters {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin: 0;
}

.filter-toolbar {
  position: relative;
  display: grid;
  align-items: center;
  gap: 10px;
  margin: 18px 0 20px;
  padding: 13px 15px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: rgba(var(--surface-rgb), .03);
}

.filter-toolbar > strong {
  color: var(--text);
  font: 11px var(--mono);
  text-transform: uppercase;
}

.filter-summary {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.filter {
  --filter-glyph: "·";
  display: inline-flex;
  align-items: center;
  gap: 4px;
  cursor: pointer;
  border: 1px solid transparent;
  background: rgba(var(--blue-rgb), .075);
  color: var(--muted);
  border-radius: 999px;
  padding: 7px 9px;
  font-size: 12px;
  transition: color .2s ease, background .2s ease, border-color .2s ease;
}

.filter::before,
.stack-coverage button::before {
  content: var(--filter-glyph, "·");
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
  width: 17px;
  height: 17px;
  border: 1px solid currentColor;
  border-radius: 5px;
  font: 800 9px/1 var(--mono);
  opacity: .78;
}

.filter::before {
  width: 15px;
  height: 15px;
  border-radius: 4px;
  font-size: 8px;
}

.stack-coverage button::before {
  width: 15px;
  height: 15px;
  border-radius: 4px;
  font-size: 8px;
}

.filter-count {
  display: inline-flex;
  order: 2;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  margin-left: auto;
  padding: 0 5px;
  border: 1px solid currentColor;
  border-radius: 999px;
  font-family: var(--mono);
  font-size: 10px;
  opacity: .72;
}

.filter.active {
  color: var(--on-solid-accent);
  background: var(--good);
  border-color: var(--good);
}

.filter.active::after,
.stack-coverage button.active::after,
.benchmark-filter-options button[data-benchmark-filter].active::after {
  order: 1;
  content: "✓";
  margin-left: 1px;
  font-family: var(--mono);
  font-weight: 900;
}

.filter[data-filter="all"],
.stack-coverage button[data-tool-filter="all"] { --filter-glyph: "▦"; }
.filter[data-filter="coding"],
.stack-coverage button[data-tool-filter="coding-context"] { --filter-glyph: "‹›"; }
.filter[data-filter="research"],
.stack-coverage button[data-tool-filter="retrieval"] { --filter-glyph: "⌕"; }
.filter[data-filter="operations"],
.stack-coverage button[data-tool-filter="automation"] { --filter-glyph: "⚙"; }
.filter[data-filter="smallbiz"] { --filter-glyph: "↗"; }
.filter[data-filter="personal"],
.stack-coverage button[data-tool-filter="personal-knowledge"] { --filter-glyph: "●"; }
.filter[data-filter="education"] { --filter-glyph: "✎"; }
.filter[data-filter="healthcare"] { --filter-glyph: "+"; }
.filter[data-filter="science"] { --filter-glyph: "✦"; }

.stack-coverage button[data-tool-filter="interfaces"] { --filter-glyph: "▤"; }
.stack-coverage button[data-tool-filter="inference"] { --filter-glyph: "◈"; }
.stack-coverage button[data-tool-filter="routing"] { --filter-glyph: "⇄"; }
.stack-coverage button[data-tool-filter="structured-memory"] { --filter-glyph: "◇"; }
.stack-coverage button[data-tool-filter="speech"] { --filter-glyph: "≋"; }
.stack-coverage button[data-tool-filter="telephony"] { --filter-glyph: "☎"; }
.stack-coverage button[data-tool-filter="data-movement"] { --filter-glyph: "⇆"; }
.stack-coverage button[data-tool-filter="analytics"] { --filter-glyph: "↗"; }
.stack-coverage button[data-tool-filter="training"] { --filter-glyph: "△"; }
.stack-coverage button[data-tool-filter="evaluation"] { --filter-glyph: "✓"; }
.stack-coverage button[data-tool-filter="durable-agents"] { --filter-glyph: "∞"; }
.stack-coverage button[data-tool-filter="observability"] { --filter-glyph: "◎"; }
.stack-coverage button[data-tool-filter="identity-secrets"] { --filter-glyph: "◆"; }
.stack-coverage button[data-tool-filter="containment"] { --filter-glyph: "□"; }

.stack-coverage button[data-tool-filter="skills"] { --filter-glyph: "S"; }
.stack-coverage button[data-tool-filter="context-efficiency"] { --filter-glyph: "C"; }
.stack-coverage button[data-tool-filter="document-media"] { --filter-glyph: "D"; }

.usecase[data-hidden="true"] {
  display: none;
}

.cards[hidden] {
  display: none;
}

.vendor-catalog {
  margin-top: 0;
}

.catalog-divider {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
  gap: 28px;
  align-items: end;
  margin: 46px 0 4px;
  padding: 30px 0 24px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.catalog-divider[hidden] {
  display: none;
}

.catalog-divider h2 {
  margin-top: 12px;
  font-size: clamp(30px, 4vw, 48px);
}

.catalog-divider p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
}

.provider-divider {
  grid-column: 1 / -1;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  margin: 24px 0 0;
  padding: 20px 0 14px;
  border-bottom: 1px solid var(--line);
}

.provider-divider[hidden] {
  display: none;
}

.provider-divider h3 {
  margin: 9px 0 0;
  font-size: clamp(22px, 3vw, 30px);
}

.provider-divider p {
  max-width: 360px;
  margin: 0;
  color: var(--dim);
  font-size: 12px;
  text-align: right;
}

.guide-hero > section {
  padding: 0;
}

.guide-hero {
  padding: 48px 0 34px;
}

.guide-hero h1 {
  font-size: clamp(50px, 6.2vw, 88px);
}

.guide-principles {
  padding: 0 0 24px;
}

.guide-principles .proof-stat {
  cursor: default;
}

.guide-chooser-section {
  padding-top: 36px;
}

.guide-controls {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr)) auto;
  gap: 12px;
  align-items: end;
  padding: 18px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .035);
}

.guide-controls label {
  min-width: 0;
  color: var(--dim);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .03em;
  text-transform: uppercase;
}

.guide-controls select {
  width: 100%;
  min-width: 0;
  height: 42px;
  appearance: none;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 0 34px 0 11px;
  color: var(--text);
  background-color: var(--control-bg);
  background-image:
    linear-gradient(45deg, transparent 50%, var(--muted) 50%),
    linear-gradient(135deg, var(--muted) 50%, transparent 50%);
  background-position:
    calc(100% - 15px) 17px,
    calc(100% - 10px) 17px;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
  font: 600 13px var(--sans);
}

.guide-reset {
  height: 42px;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 0 15px;
  color: var(--muted);
  background: rgba(var(--surface-rgb), .05);
  font-weight: 750;
  cursor: pointer;
}

.guide-reset:hover {
  color: var(--text);
  background: rgba(var(--surface-rgb), .09);
}

.guide-result {
  margin: 14px 0 22px;
  color: var(--dim);
  font-family: var(--mono);
  font-size: 11px;
  text-transform: uppercase;
}

.guide-list {
  border-top: 1px solid var(--line);
}

.guide-recipe {
  border-bottom: 1px solid var(--line);
  scroll-margin-top: 110px;
}

.guide-recipe[hidden] {
  display: none;
}

.guide-recipe > summary {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr) auto 34px;
  gap: 18px;
  align-items: center;
  padding: 24px 4px;
  list-style: none;
  cursor: pointer;
  transition: background .2s ease;
}

.guide-recipe > summary::-webkit-details-marker {
  display: none;
}

.guide-recipe > summary::after {
  content: "+";
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--good);
  font: 500 22px/1 var(--sans);
}

.guide-recipe[open] > summary::after {
  content: "-";
}

.guide-recipe > summary:hover {
  background: rgba(var(--surface-rgb), .035);
}

.guide-recipe[open] > summary {
  background: rgba(var(--surface-rgb), .025);
}

.recipe-number {
  color: var(--good);
  font-family: var(--mono);
  font-size: 13px;
}

.recipe-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.recipe-title {
  color: var(--text);
  font-size: clamp(21px, 2.5vw, 30px);
  font-weight: 800;
  line-height: 1.05;
}

.recipe-description {
  max-width: 720px;
  color: var(--muted);
  font-size: 14px;
}

.guide-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}

.guide-meta span {
  padding: 4px 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-family: var(--mono);
  font-size: 10px;
  white-space: nowrap;
}

.recipe-body {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, .55fr);
  gap: 34px;
  padding: 30px 4px 40px 80px;
}

.recipe-main h3 {
  margin: 26px 0 12px;
  font-size: 15px;
  letter-spacing: 0;
  text-transform: uppercase;
}

.recipe-deliverable {
  max-width: 760px;
  margin: 0;
  color: var(--muted);
  font-size: 17px;
}

.recipe-deliverable strong {
  color: var(--text);
}

.recipe-steps {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--line);
}

.recipe-steps li {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 12px;
  margin: 0;
  padding: 15px 0;
  border-bottom: 1px solid var(--line);
}

.recipe-steps li > span {
  padding-top: 2px;
  color: var(--good);
  font-family: var(--mono);
  font-size: 11px;
}

.recipe-steps strong {
  display: block;
  margin-bottom: 3px;
  color: var(--text);
}

.recipe-steps p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
}

.prompt-block {
  display: grid;
  gap: 9px;
  margin-top: 18px;
  padding: 16px;
  border-left: 3px solid var(--blue);
  background: rgba(var(--blue-rgb), .07);
}

.prompt-block strong {
  font-size: 12px;
  text-transform: uppercase;
}

.prompt-block code {
  color: var(--code-text);
  font-family: var(--mono);
  font-size: 12px;
  line-height: 1.55;
  white-space: normal;
}

.recipe-aside {
  padding-left: 24px;
  border-left: 1px solid var(--line);
}

.acceptance-check {
  display: grid;
  gap: 8px;
  padding: 17px;
  border: 1px solid rgba(var(--good-rgb), .25);
  border-radius: 8px;
  background: rgba(var(--good-rgb), .07);
}

.acceptance-check span {
  color: var(--good);
  font-family: var(--mono);
  font-size: 10px;
  text-transform: uppercase;
}

.acceptance-check strong {
  font-size: 14px;
  line-height: 1.45;
}

.guide-facts {
  margin: 20px 0;
}

.guide-facts div {
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
}

.guide-facts dt {
  margin-bottom: 3px;
  color: var(--dim);
  font-family: var(--mono);
  font-size: 10px;
  text-transform: uppercase;
}

.guide-facts dd {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.guide-sources {
  color: var(--dim);
  font-size: 12px;
}

.guide-sources a {
  color: var(--blue);
}

.azure-blueprint-widget {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(300px, 1.1fr);
  gap: 26px;
  overflow: hidden;
  margin-top: 30px;
  padding: clamp(22px, 3vw, 32px);
  border: 1px solid rgba(80, 230, 255, .3);
  border-radius: 16px;
  color: #fff;
  color-scheme: dark;
  background:
    radial-gradient(circle at 8% 0, rgba(80, 230, 255, .2), transparent 37%),
    radial-gradient(circle at 102% 100%, rgba(0, 120, 212, .34), transparent 42%),
    linear-gradient(128deg, #001b35 0%, #002b52 51%, #003d73 100%);
  box-shadow: 0 22px 58px rgba(0, 44, 82, .24), inset 0 1px rgba(255, 255, 255, .08);
}

.azure-blueprint-widget > *:not(.azure-blueprint-field) {
  position: relative;
  z-index: 1;
}

.azure-blueprint-field {
  position: absolute;
  z-index: 0;
  inset: -16%;
  pointer-events: none;
  opacity: .72;
  background-image:
    linear-gradient(rgba(80, 230, 255, .075) 1px, transparent 1px),
    linear-gradient(90deg, rgba(80, 230, 255, .075) 1px, transparent 1px),
    radial-gradient(circle, rgba(80, 230, 255, .42) 0 1px, transparent 1.8px);
  background-position: center, center, 18px 24px;
  background-size: 38px 38px, 38px 38px, 94px 82px;
  animation: azure-blueprint-drift 10s ease-in-out infinite alternate;
}

.azure-blueprint-field::before {
  position: absolute;
  top: 6%;
  right: 8%;
  width: 190px;
  height: 164px;
  content: "";
  opacity: .2;
  background: linear-gradient(145deg, #50e6ff 0%, #0089d6 55%, #0067b8 100%);
  clip-path: polygon(48% 0, 100% 88%, 73% 88%, 60% 65%, 34% 65%, 45% 44%, 58% 44%, 47% 24%, 11% 88%, 0 88%);
  filter: drop-shadow(0 0 28px rgba(80, 230, 255, .45));
}

.azure-blueprint-field span {
  position: absolute;
  width: 9px;
  height: 9px;
  border: 1px solid rgba(255, 255, 255, .72);
  background: #50e6ff;
  box-shadow: 0 0 16px rgba(80, 230, 255, .72);
  animation: azure-blueprint-node 3.6s ease-in-out infinite alternate;
}

.azure-blueprint-field span:nth-child(1) { top: 18%; left: 8%; animation-delay: -1s; }
.azure-blueprint-field span:nth-child(2) { top: 37%; left: 43%; width: 6px; height: 6px; animation-delay: -4s; }
.azure-blueprint-field span:nth-child(3) { top: 15%; right: 24%; animation-delay: -6s; }
.azure-blueprint-field span:nth-child(4) { right: 9%; bottom: 17%; width: 7px; height: 7px; animation-delay: -3s; }
.azure-blueprint-field span:nth-child(5) { bottom: 11%; left: 27%; width: 6px; height: 6px; animation-delay: -5s; }
.azure-blueprint-field span:nth-child(6) { top: 60%; left: 58%; animation-delay: -2s; }

.azure-blueprint-intro,
.azure-blueprint-reading {
  align-self: center;
}

.azure-blueprint-label {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 16px;
  color: #8be9ff;
  font: 760 10px/1.2 var(--mono);
  letter-spacing: .075em;
  text-transform: uppercase;
}

.azure-blueprint-label::before {
  width: 10px;
  height: 10px;
  content: "";
  background: #50e6ff;
  box-shadow: 0 0 17px rgba(80, 230, 255, .75);
}

.recipe-main .azure-blueprint-widget h3 {
  max-width: 13ch;
  margin: 0 0 14px;
  color: #fff;
  font-size: clamp(28px, 3vw, 39px);
  letter-spacing: -.045em;
  line-height: 1.02;
  text-transform: none;
}

#azure-blueprint-title {
  scroll-margin-top: 96px;
}

.azure-blueprint-intro > p,
.azure-blueprint-reading > p {
  margin: 0;
  color: #d8ebfb;
  font-size: 13px;
  line-height: 1.55;
}

.azure-blueprint-reading > p strong {
  color: #fff;
}

.azure-blueprint-signals {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 17px;
}

.azure-blueprint-signals span {
  padding: 5px 8px;
  border: 1px solid rgba(80, 230, 255, .28);
  border-radius: 999px;
  color: #b9f4ff;
  background: rgba(0, 18, 38, .35);
  font: 700 9px/1.2 var(--mono);
  text-transform: uppercase;
}

.azure-blueprint-reading {
  padding: 19px;
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 12px;
  background: rgba(0, 18, 38, .72);
  box-shadow: inset 0 1px rgba(255, 255, 255, .055);
}

.azure-blueprint-reading .azure-blueprint-boundary {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid rgba(255, 255, 255, .12);
  color: #a9c6dc;
  font-size: 11px;
}

.azure-blueprint-actions.tool-links {
  gap: 7px;
  margin-top: 16px;
}

.azure-blueprint-actions > a {
  color: #8be9ff;
  font-size: 11px;
}

.azure-blueprint-actions .azure-blueprint-primary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  box-sizing: border-box;
  width: 100%;
  padding: 12px 14px;
  border: 1px solid rgba(80, 230, 255, .52);
  border-radius: 8px;
  color: #fff;
  text-decoration: none;
  background: linear-gradient(110deg, #0078d4, #0067b8);
  box-shadow: 0 10px 28px rgba(0, 120, 212, .24);
  transition: border-color .2s ease, background-color .2s ease, transform .2s ease;
}

.azure-blueprint-primary span,
.azure-blueprint-primary small,
.azure-blueprint-primary strong {
  display: block;
}

.azure-blueprint-primary small {
  margin-bottom: 4px;
  color: #c8f7ff;
  font: 720 9px/1.2 var(--mono);
  letter-spacing: .06em;
  text-transform: uppercase;
}

.azure-blueprint-primary strong {
  color: #fff;
  font-size: 14px;
}

.azure-blueprint-primary b {
  color: #fff;
  font-size: 18px;
}

.azure-blueprint-actions .azure-blueprint-primary:hover {
  border-color: #fff;
  background: linear-gradient(110deg, #108bdc, #0078d4);
  transform: translateX(3px);
}

.azure-blueprint-actions > a:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
}

@keyframes azure-blueprint-drift {
  from { transform: translate3d(-1.5%, -1%, 0) scale(1); }
  to { transform: translate3d(2.5%, 1.5%, 0) scale(1.025); }
}

@keyframes azure-blueprint-node {
  from { opacity: .24; transform: translate3d(0, -5px, 0) scale(.8); }
  to { opacity: .9; transform: translate3d(6px, 7px, 0) scale(1.08); }
}

@media (max-width: 1180px) {
  .azure-blueprint-widget {
    grid-template-columns: 1fr;
  }

  .recipe-main .azure-blueprint-widget h3 {
    max-width: 17ch;
  }
}

@media (max-width: 620px) {
  .azure-blueprint-widget {
    gap: 20px;
    padding: 20px 14px 14px;
    border-radius: 13px;
  }

  .azure-blueprint-reading {
    padding: 15px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .azure-blueprint-field,
  .azure-blueprint-field span {
    animation: none;
  }

  .azure-blueprint-actions .azure-blueprint-primary {
    transition: none;
  }
}

.loop-engineering-section {
  scroll-margin-top: 80px;
}

.loop-decision {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 28px;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.loop-decision article {
  min-height: 190px;
  padding: 24px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .03);
}

.loop-decision article:first-child {
  background: rgba(var(--warn-rgb), .035);
}

.loop-decision article:last-child {
  background: rgba(var(--good-rgb), .04);
}

.loop-decision h3,
.loop-build-grid h3,
.loop-starter h3 {
  margin: 12px 0 8px;
  font-size: 21px;
  line-height: 1.1;
}

.loop-decision p,
.loop-build-grid p,
.loop-starter p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
}

.loop-flow {
  margin-top: 18px;
}

.loop-pattern-picker {
  margin-top: 18px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
}

.loop-pattern-picker h3 {
  margin: 12px 0 8px;
  font-size: 21px;
  line-height: 1.1;
  scroll-margin-top: 110px;
}

.loop-pattern-picker > p {
  max-width: 840px;
  margin: 0 0 16px;
  color: var(--muted);
  font-size: 14px;
}

.loop-pattern-table {
  table-layout: fixed;
}

.loop-pattern-table th:nth-child(1) { width: 17%; }
.loop-pattern-table th:nth-child(2) { width: 14%; }
.loop-pattern-table th:nth-child(3) { width: 20%; }
.loop-pattern-table th:nth-child(4) { width: 27%; }
.loop-pattern-table th:nth-child(5) { width: 22%; }

.loop-build-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 18px;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.loop-build-grid article {
  min-height: 224px;
  padding: 20px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .025);
}

.loop-build-grid b {
  color: var(--good);
  font: 10px var(--mono);
  text-transform: uppercase;
}

.loop-build-grid h3 {
  font-size: 17px;
}

.loop-readiness {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 18px;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.loop-readiness div {
  display: grid;
  gap: 4px;
  padding: 16px 18px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.loop-readiness b {
  color: var(--good);
  font: 11px var(--mono);
}

.loop-readiness strong {
  font-size: 14px;
}

.loop-readiness span {
  color: var(--muted);
  font-size: 12px;
}

.loop-starter {
  display: grid;
  grid-template-columns: minmax(240px, .7fr) minmax(0, 1.3fr);
  gap: 32px;
  align-items: center;
  margin-top: 18px;
  padding: 24px;
  border: 1px solid rgba(var(--good-rgb), .22);
  background: linear-gradient(135deg, rgba(var(--good-rgb), .065), rgba(var(--blue-rgb), .035));
}

.loop-starter .prompt-block {
  margin: 0;
}

.loop-red-flags {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 18px;
}

.loop-red-flags strong,
.loop-red-flags span {
  padding: 7px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font: 10px var(--mono);
}

.loop-red-flags strong {
  color: var(--bad);
  border-color: rgba(var(--bad-rgb), .3);
  text-transform: uppercase;
}

.loop-red-flags span {
  color: var(--muted);
}

.loop-sources {
  margin-top: 22px;
}

.oss-implementation {
  margin-top: 30px;
  padding-top: 26px;
  border-top: 1px solid var(--line);
}

.oss-implementation-head h3 {
  margin: 12px 0 8px;
  font-size: 24px;
  line-height: 1.05;
  letter-spacing: -.025em;
  text-transform: none;
}

.oss-implementation-head p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
}

.oss-stack {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 18px;
}

.oss-stack article {
  display: grid;
  gap: 5px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(var(--surface-rgb), .025);
}

.oss-stack b {
  color: var(--good);
  font: 10px var(--mono);
  text-transform: uppercase;
}

.oss-stack strong {
  color: var(--text);
  font-size: 14px;
}

.oss-stack span {
  color: var(--muted);
  font-size: 12px;
}

.oss-steps code {
  color: var(--code-text);
  font-family: var(--mono);
  font-size: 11px;
}

.oss-links {
  margin-top: 16px;
}

.toolbox-section {
  padding-top: 76px;
}

.tool-cards .card {
  display: flex;
  flex-direction: column;
}

.tool-cards .card p {
  flex: 1;
}

.link-separator {
  margin: 0 3px;
  color: var(--dim);
}

.authority-panel h2 {
  margin-bottom: 28px;
}

.authority-ladder {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.authority-ladder > div {
  display: grid;
  gap: 5px;
  padding: 18px;
}

.authority-ladder > div + div {
  border-left: 1px solid var(--line);
}

.authority-ladder b {
  color: var(--good);
  font-family: var(--mono);
  font-size: 11px;
}

.authority-ladder strong {
  font-size: 14px;
}

.authority-ladder span {
  color: var(--muted);
  font-size: 12px;
}

.closing-section {
  padding-top: 34px;
}

.closing-cta {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(280px, .7fr);
  gap: 34px;
  align-items: end;
  padding: 38px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.closing-cta .quote {
  max-width: 780px;
}

.closing-actions {
  display: grid;
  gap: 8px;
  width: 100%;
  max-width: 360px;
  justify-self: end;
}

.closing-actions .btn {
  width: 100%;
  min-height: 50px;
  justify-content: space-between;
  padding: 13px 16px;
  border-radius: 11px;
  box-shadow: none;
  text-align: left;
}

.closing-actions .btn::after {
  content: "→";
  color: var(--good);
  font-family: var(--mono);
  font-weight: 500;
  transition: transform .2s ease;
}

.closing-actions .btn.primary::after {
  color: var(--on-primary);
}

.closing-actions .btn:hover::after {
  transform: translateX(3px);
}

.footer {
  padding: 42px 0 70px;
  color: var(--dim);
  border-top: 1px solid rgba(var(--surface-rgb), .08);
  margin-top: 40px;
}

.footer strong {
  color: var(--text);
}

.footer .agent-note a {
  color: var(--text);
  text-decoration-color: rgba(var(--surface-rgb), .42);
  text-underline-offset: .18em;
}

.footer .agent-note a:hover {
  text-decoration-color: currentColor;
}

.footer-grid .agent-note {
  grid-column: 1 / -1;
}

.small {
  font-size: 13px;
}

.flush-section {
  padding: 0;
}

.hero-note {
  max-width: 700px;
  margin: 16px 0 0;
  color: var(--muted);
  font-size: 14px;
}

.tag-bad {
  color: var(--bad);
  border-color: rgba(var(--bad-rgb), .28);
  background: rgba(var(--bad-rgb), .08);
}

.ledger-comparison {
  margin-bottom: 16px;
}

.claim-audit {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.claim-audit article {
  min-width: 0;
  padding: 22px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .035);
}

.claim-audit h3 {
  margin: 12px 0 8px;
  font-size: 18px;
  line-height: 1.15;
  letter-spacing: -.025em;
}

.claim-audit p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.claim-state {
  display: inline-flex;
  align-items: flex-start;
  gap: 5px;
  padding: 4px 7px;
  border: 1px solid currentColor;
  border-radius: 999px;
  font-family: var(--mono);
  font-size: 10px;
  text-transform: uppercase;
}

.state-agree { color: var(--good); }
.state-context { color: var(--warn); }
.state-reject { color: var(--bad); }

.claim-state::before {
  flex: 0 0 auto;
  margin-top: .08em;
}

.state-agree::before { content: "✓"; }
.state-context::before { content: "ⓘ"; }
.state-reject::before { content: "×"; }

.infrastructure-bridge {
  padding: 68px 0;
}

.infrastructure-feature {
  position: relative;
  display: grid;
  grid-template-columns: minmax(320px, .82fr) minmax(0, 1.18fr);
  overflow: hidden;
  border: 1px solid rgba(var(--blue-rgb), .28);
  border-radius: 30px;
  background:
    linear-gradient(135deg, rgba(var(--blue-rgb), .11), transparent 38%),
    linear-gradient(315deg, rgba(var(--good-rgb), .08), transparent 42%),
    rgba(var(--solid-panel-rgb), .94);
  box-shadow: 0 34px 100px rgba(0, 0, 0, .38);
  isolation: isolate;
}

.infrastructure-feature::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: .24;
  background-image:
    linear-gradient(rgba(var(--surface-rgb), .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(var(--surface-rgb), .055) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(90deg, #000, transparent 66%);
}

.infrastructure-feature::after {
  content: "";
  position: absolute;
  top: -110px;
  left: -70px;
  z-index: -1;
  width: 330px;
  height: 330px;
  border: 1px solid rgba(var(--good-rgb), .22);
  border-radius: 50%;
  box-shadow:
    0 0 0 58px rgba(var(--blue-rgb), .035),
    0 0 0 116px rgba(var(--purple-rgb), .025);
}

.infrastructure-visual {
  display: flex;
  min-height: 520px;
  flex-direction: column;
  justify-content: space-between;
  padding: 30px;
  border-right: 1px solid var(--line);
}

.infrastructure-meta {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  color: var(--blue);
  font: 600 10px/1.3 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}

.infrastructure-statement {
  position: relative;
  padding: 64px 0 36px;
}

.infrastructure-index {
  position: absolute;
  top: 0;
  left: -4px;
  color: rgba(var(--surface-rgb), .07);
  font: 800 clamp(92px, 12vw, 156px)/.8 var(--mono);
  letter-spacing: -.12em;
}

.infrastructure-statement p {
  position: relative;
  margin: 0;
  font-size: clamp(30px, 4vw, 52px);
  line-height: .98;
  letter-spacing: -.055em;
}

.infrastructure-statement strong {
  display: inline-block;
  margin-top: 7px;
  color: var(--good);
  font-weight: 780;
}

.infrastructure-stack {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
  list-style: none;
}

.infrastructure-stack li {
  position: relative;
  margin: 0;
  padding: 13px 14px 13px 30px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font: 600 10px/1.25 var(--mono);
  text-transform: uppercase;
}

.infrastructure-stack li::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 13px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--good);
  box-shadow: 0 0 12px rgba(var(--good-rgb), .7);
  transform: translateY(-50%);
}

.infrastructure-copy {
  align-self: center;
  padding: clamp(34px, 5vw, 68px);
}

.infrastructure-copy h2 {
  max-width: 9ch;
  margin-bottom: 25px;
  font-size: clamp(42px, 6vw, 76px);
  color: var(--text);
}

.infrastructure-copy > p {
  max-width: 690px;
  margin: 0;
  color: var(--feature-text);
  font-size: clamp(16px, 1.55vw, 19px);
  line-height: 1.68;
}

.infrastructure-copy em {
  color: var(--text);
  font-style: normal;
  font-weight: 780;
}

.europe-scenario {
  padding: 22px 0 42px;
}

.europe-scenario-heading h2 {
  max-width: 800px;
}

.europe-scenario-heading .section-kicker {
  max-width: 500px;
}

.europe-scenario-heading .section-kicker em {
  color: var(--text);
  font-style: normal;
  font-weight: 760;
}

.europe-scenario-grid {
  display: grid;
  grid-template-columns: minmax(0, .86fr) minmax(480px, 1.14fr);
  overflow: hidden;
  border: 1px solid rgba(var(--purple-rgb), .3);
  border-radius: 26px;
  background:
    linear-gradient(135deg, rgba(var(--purple-rgb), .1), transparent 32%),
    rgba(var(--solid-panel-rgb), .88);
  box-shadow: 0 26px 80px rgba(0, 0, 0, .28);
}

.europe-scenario-copy {
  padding: clamp(24px, 3vw, 38px) clamp(28px, 4vw, 48px) clamp(28px, 4vw, 48px);
  border-right: 1px solid var(--line);
}

.europe-scenario-label,
.europe-choice-head > span,
.europe-choice-path-label {
  color: var(--purple);
  font: 700 10px/1.3 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}

.europe-scenario-label {
  display: block;
}

.europe-scenario-copy h3 {
  max-width: 16ch;
  margin: 14px 0 20px;
  font-size: clamp(28px, 3.2vw, 42px);
  line-height: 1.02;
  letter-spacing: -.045em;
}

.europe-scenario-copy p {
  margin: 0 0 15px;
  color: var(--feature-text);
  font-size: 15px;
  line-height: 1.65;
}

.europe-scenario-links {
  margin-top: 24px;
}

.europe-scenario-links a {
  color: var(--purple);
}

.europe-choice-figure {
  min-width: 0;
  margin: 0;
  padding: clamp(22px, 2.5vw, 32px);
  background:
    radial-gradient(circle at 50% 32%, rgba(var(--blue-rgb), .13), transparent 14rem),
    linear-gradient(rgba(var(--surface-rgb), .04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(var(--surface-rgb), .04) 1px, transparent 1px);
  background-size: auto, 30px 30px, 30px 30px;
}

.europe-choice-head {
  display: grid;
  gap: 6px;
  text-align: center;
}

.europe-choice-head strong {
  font-size: clamp(30px, 4vw, 48px);
  line-height: 1;
  letter-spacing: -.055em;
}

.europe-choice-head small {
  color: var(--dim);
  font: 10px/1.4 var(--mono);
}

.europe-choice-fork {
  display: grid;
  place-items: center;
  padding-top: 20px;
}

.europe-choice-node {
  position: relative;
  z-index: 1;
  display: grid;
  min-width: 142px;
  grid-template-columns: 34px auto;
  gap: 2px 10px;
  align-items: center;
  padding: 12px 17px;
  border: 1px solid rgba(var(--blue-rgb), .45);
  border-radius: 999px;
  color: var(--text);
  background: rgba(var(--solid-panel-rgb), .96);
  box-shadow: 0 0 0 6px rgba(var(--blue-rgb), .045), 0 14px 40px rgba(var(--blue-rgb), .15);
}

.europe-choice-node .card-icon {
  display: grid;
  width: 34px;
  height: 34px;
  grid-row: 1 / 3;
  place-items: center;
  border-radius: 50%;
  color: var(--blue);
  background: rgba(var(--blue-rgb), .1);
}

.europe-choice-node strong {
  font: 780 12px/1.1 var(--mono);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.europe-choice-node small {
  color: var(--blue);
  font: 8px/1.2 var(--mono);
  letter-spacing: .03em;
  text-transform: uppercase;
}

.europe-choice-paths {
  --choice-path-gap: 16px;
  display: grid;
  position: relative;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--choice-path-gap);
  padding-top: 46px;
  background:
    linear-gradient(rgba(var(--blue-rgb), .8), rgba(var(--blue-rgb), .64)) center top / 2px 24px no-repeat,
    linear-gradient(90deg, rgba(var(--bad-rgb), .76), rgba(var(--blue-rgb), .68) 49.6%, rgba(var(--good-rgb), .78) 50.4%) center 23px / calc(50% + 8px) 2px no-repeat,
    linear-gradient(rgba(var(--bad-rgb), .76), rgba(var(--bad-rgb), .76)) calc(25% - 5px) 23px / 2px 24px no-repeat,
    linear-gradient(rgba(var(--good-rgb), .78), rgba(var(--good-rgb), .78)) calc(75% + 3px) 23px / 2px 24px no-repeat;
}

.europe-choice-path {
  --path-accent: var(--blue);
  --path-accent-rgb: var(--blue-rgb);
  --choice-icon-size: 40px;
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  overflow: hidden;
  padding: 0 18px 16px;
  border: 1px solid rgba(var(--path-accent-rgb), .34);
  border-radius: 22px;
  background:
    linear-gradient(90deg, var(--path-accent), transparent 78%) top / 100% 4px no-repeat,
    linear-gradient(180deg, rgba(var(--path-accent-rgb), .09), transparent 38%),
    rgba(var(--solid-panel-rgb), .88);
  box-shadow: 0 18px 42px rgba(var(--path-accent-rgb), .07);
}

.europe-choice-path--drift {
  --path-accent: var(--bad);
  --path-accent-rgb: var(--bad-rgb);
}

.europe-choice-path--agency {
  --path-accent: var(--good);
  --path-accent-rgb: var(--good-rgb);
}

.europe-choice-path-head {
  display: grid;
  min-height: 78px;
  grid-template-columns: var(--choice-icon-size) minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  margin: 0 -18px;
  padding: 16px 31px 14px;
  border-bottom: 1px solid rgba(var(--path-accent-rgb), .2);
}

.europe-choice-path-head > .card-icon {
  display: grid;
  width: var(--choice-icon-size);
  height: var(--choice-icon-size);
  place-items: center;
  border: 1px solid rgba(var(--path-accent-rgb), .34);
  border-radius: 14px;
  color: var(--path-accent);
  background: rgba(var(--path-accent-rgb), .1);
  box-shadow: 0 10px 24px rgba(var(--path-accent-rgb), .1);
}

.europe-choice-path-head > span {
  display: grid;
  gap: 3px;
}

.europe-choice-path-head small,
.europe-choice-outcome small {
  color: var(--dim);
  font: 8px/1.2 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}

.europe-choice-path-head strong {
  color: var(--path-accent);
  font: 760 12px/1.2 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}

.europe-choice-path ol {
  display: grid;
  grid-template-rows: repeat(3, minmax(68px, auto));
  gap: 8px;
  margin: 14px 0;
  padding: 0;
  color: var(--feature-text);
  list-style: none;
}

.europe-choice-path li {
  position: relative;
  display: grid;
  grid-template-columns: var(--choice-icon-size) minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-height: 68px;
  margin: 0;
  padding: 11px 12px;
  border: 1px solid rgba(var(--path-accent-rgb), .13);
  border-radius: 14px;
  background: rgba(var(--surface-rgb), .035);
  font-size: 12px;
  line-height: 1.4;
}

.europe-choice-path li > .card-icon {
  display: grid;
  width: var(--choice-icon-size);
  height: var(--choice-icon-size);
  place-items: center;
  border-radius: 11px;
  color: var(--path-accent);
  background: rgba(var(--path-accent-rgb), .1);
}

.europe-choice-path li > span {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
}

.europe-choice-path-head > .card-icon::before,
.europe-choice-path li > .card-icon::before,
.europe-choice-outcome > .card-icon::before {
  width: 20px;
  height: 20px;
}

.europe-choice-path-head > .card-icon,
.europe-choice-path li > .card-icon,
.europe-choice-outcome > .card-icon {
  margin: 0;
}

/* WebKit beta can leak an external SVG mask's rectangular texture around
   these composited pseudo-elements. Paint the map glyphs as ordinary,
   theme-aware local SVG backgrounds instead. */
.europe-choice-figure .card-icon[data-icon]::before {
  background: var(--europe-choice-icon) center / contain no-repeat;
  -webkit-mask: none;
  mask: none;
}

.europe-choice-figure [data-icon="signpost-big"] { --europe-choice-icon: url("../images/lucide-0.468.0-signpost-big-blue.svg?v=1"); }
.europe-choice-figure [data-icon="timer-reset"] { --europe-choice-icon: url("../images/lucide-0.468.0-timer-reset-bad.svg?v=1"); }
.europe-choice-figure [data-icon="timer"] { --europe-choice-icon: url("../images/lucide-0.468.0-timer-bad.svg?v=1"); }
.europe-choice-figure [data-icon="shield-question"] { --europe-choice-icon: url("../images/lucide-0.468.0-shield-question-bad.svg?v=1"); }
.europe-choice-figure [data-icon="refresh-cw-off"] { --europe-choice-icon: url("../images/lucide-0.468.0-refresh-cw-off-bad.svg?v=1"); }
.europe-choice-figure [data-icon="shield-alert"] { --europe-choice-icon: url("../images/lucide-0.468.0-shield-alert-bad.svg?v=1"); }
.europe-choice-figure [data-icon="handshake"] { --europe-choice-icon: url("../images/lucide-0.468.0-handshake-good.svg?v=1"); }
.europe-choice-figure [data-icon="server-cog"] { --europe-choice-icon: url("../images/lucide-0.468.0-server-cog-good.svg?v=1"); }
.europe-choice-figure [data-icon="network"] { --europe-choice-icon: url("../images/lucide-0.468.0-network-good.svg?v=1"); }
.europe-choice-figure [data-icon="shield-check"] { --europe-choice-icon: url("../images/lucide-0.468.0-shield-check-good.svg?v=1"); }
.europe-choice-figure [data-icon="badge-check"] { --europe-choice-icon: url("../images/lucide-0.468.0-badge-check-good.svg?v=1"); }

.europe-choice-path li small {
  color: var(--path-accent);
  font: 8px/1 var(--mono);
}

.europe-choice-outcome {
  display: grid;
  min-height: 68px;
  grid-template-columns: var(--choice-icon-size) minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  margin-top: auto;
  padding: 12px;
  border: 1px solid rgba(var(--path-accent-rgb), .22);
  border-radius: 15px;
  color: var(--path-accent);
  background: rgba(var(--path-accent-rgb), .08);
}

.europe-choice-outcome > .card-icon {
  display: grid;
  width: var(--choice-icon-size);
  height: var(--choice-icon-size);
  place-items: center;
  border-radius: 50%;
  background: rgba(var(--path-accent-rgb), .12);
}

.europe-choice-outcome > span {
  display: grid;
  gap: 3px;
}

.europe-choice-outcome strong {
  font-size: 13px;
  line-height: 1.25;
}

.europe-choice-figure figcaption {
  margin-top: 16px;
  color: var(--dim);
  font-size: 11px;
  line-height: 1.5;
}

.europe-choice-figure figcaption strong {
  color: var(--muted);
}

@media (max-width: 960px) {
  .europe-scenario-grid {
    grid-template-columns: 1fr;
  }

  .europe-scenario-copy {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .europe-scenario-copy h3 {
    max-width: 22ch;
  }
}

@media (max-width: 560px) {
  .europe-scenario {
    padding-bottom: 24px;
  }

  .europe-scenario-grid {
    border-radius: 20px;
  }

  .europe-scenario-copy,
  .europe-choice-figure {
    padding: 22px;
  }

  .europe-choice-paths {
    grid-template-columns: 1fr;
    padding-top: 24px;
    background: none;
  }

  .europe-choice-fork {
    padding-top: 18px;
  }

  .europe-choice-path {
    min-height: 0;
  }

  .europe-choice-path + .europe-choice-path {
    margin-top: 4px;
  }
}

.private-ai-evidence {
  padding: 26px 0 0;
}

.private-ai-heading h2 {
  max-width: 780px;
}

.private-ai-heading .section-kicker {
  max-width: 440px;
}

.private-ai-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}

.private-ai-card {
  --private-accent: var(--blue);
  --private-accent-rgb: var(--blue-rgb);
  position: relative;
  display: flex;
  min-width: 0;
  min-height: 430px;
  flex-direction: column;
  overflow: hidden;
  padding: 18px;
  border: 1px solid rgba(var(--private-accent-rgb), .28);
  border-radius: 22px;
  background:
    radial-gradient(circle at 76% 8%, rgba(var(--private-accent-rgb), .16), transparent 12rem),
    linear-gradient(180deg, rgba(var(--surface-rgb), .075), rgba(var(--surface-rgb), .035));
  box-shadow: 0 20px 56px rgba(0, 0, 0, .2);
  isolation: isolate;
}

.private-ai-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: .18;
  background-image:
    linear-gradient(rgba(var(--surface-rgb), .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(var(--surface-rgb), .055) 1px, transparent 1px);
  background-size: 28px 28px;
  mask-image: linear-gradient(180deg, #000, transparent 62%);
}

.private-ai-card--hybrid {
  --private-accent: var(--good);
  --private-accent-rgb: var(--good-rgb);
}

.private-ai-card--security {
  --private-accent: var(--purple);
  --private-accent-rgb: var(--purple-rgb);
}

.private-ai-card--leakage {
  --private-accent: var(--blue);
  --private-accent-rgb: var(--blue-rgb);
}

.private-ai-card--incident {
  --private-accent: var(--bad);
  --private-accent-rgb: var(--bad-rgb);
}

.private-ai-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  color: var(--private-accent);
}

.private-ai-card-head > span {
  padding-top: 5px;
  font: 700 9px/1.3 var(--mono);
  letter-spacing: .07em;
  text-transform: uppercase;
}

.private-ai-card-head .card-icon {
  display: grid;
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  place-items: center;
  border: 1px solid rgba(var(--private-accent-rgb), .34);
  border-radius: 14px;
  background: rgba(var(--private-accent-rgb), .09);
  box-shadow: 0 10px 28px rgba(var(--private-accent-rgb), .08);
}

.private-ai-card-head .card-icon::before {
  width: 21px;
  height: 21px;
}

.private-ai-card h3 {
  min-height: 72px;
  margin: 16px 0 12px;
  font-size: clamp(18px, 1.55vw, 22px);
  line-height: 1.08;
  letter-spacing: -.035em;
}

.private-ai-stat {
  color: var(--private-accent);
  font-size: clamp(54px, 5.6vw, 74px);
  line-height: .85;
  letter-spacing: -.07em;
  text-shadow: 0 0 32px rgba(var(--private-accent-rgb), .14);
}

.private-ai-claim {
  margin: 10px 0 0;
  color: var(--feature-text);
  font-size: 13px;
  line-height: 1.5;
}

.private-ai-secondary {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  margin: 10px 0 0;
  padding-top: 10px;
  border-top: 1px solid rgba(var(--private-accent-rgb), .3);
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
}

.private-ai-secondary strong {
  color: var(--private-accent);
  font-size: 24px;
  line-height: 1;
  letter-spacing: -.05em;
}

.private-ai-secondary span {
  padding-top: 0;
  line-height: 1.3;
}

.private-ai-source {
  display: grid;
  gap: 8px;
  margin-top: auto;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.private-ai-source small {
  color: var(--dim);
  font: 9px/1.45 var(--mono);
}

.private-ai-source a {
  color: var(--private-accent);
  font-size: 11px;
  font-weight: 760;
  line-height: 1.35;
  text-decoration: none;
}

.private-ai-source a:hover {
  text-decoration: underline;
}

.private-ai-takeaway {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 16px;
  align-items: center;
  margin-top: 14px;
  padding: 17px 20px;
  border: 1px solid rgba(var(--good-rgb), .24);
  border-radius: 18px;
  background: linear-gradient(90deg, rgba(var(--good-rgb), .1), rgba(var(--blue-rgb), .07));
}

.private-ai-takeaway .card-icon {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid rgba(var(--good-rgb), .34);
  border-radius: 50%;
  color: var(--good);
  background: rgba(var(--good-rgb), .08);
}

.private-ai-takeaway .card-icon::before {
  width: 22px;
  height: 22px;
}

.private-ai-takeaway p {
  margin: 0;
  color: var(--muted);
  font-size: clamp(14px, 1.5vw, 17px);
}

.private-ai-takeaway strong {
  color: var(--text);
}

@media (max-width: 1040px) {
  .private-ai-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .private-ai-card {
    min-height: 0;
  }

  .private-ai-card-head {
    display: block;
  }

  .private-ai-card-head > span {
    display: block;
    padding-right: 52px;
  }

  .private-ai-card-head .card-icon {
    position: absolute;
    top: 18px;
    right: 18px;
  }

  .private-ai-card:last-child {
    grid-column: 1 / -1;
    min-height: 0;
  }

  .private-ai-card h3 {
    min-height: 0;
  }
}

@media (max-width: 700px) {
  .private-ai-evidence {
    padding: 10px 0 0;
  }

  .private-ai-grid {
    grid-template-columns: 1fr;
  }

  .private-ai-card,
  .private-ai-card:last-child {
    grid-column: auto;
    min-height: 0;
  }

  .private-ai-card h3 {
    margin-top: 18px;
  }

  .private-ai-takeaway {
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 12px;
    padding: 15px;
  }

  .private-ai-takeaway .card-icon {
    width: 36px;
    height: 36px;
  }
}

.verdict-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin-bottom: 16px;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.verdict-card {
  display: flex;
  min-height: 260px;
  flex-direction: column;
  padding: 22px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .04);
}

.verdict-card > span {
  color: var(--dim);
  font-family: var(--mono);
  font-size: 10px;
  text-transform: uppercase;
}

.verdict-card strong {
  margin: 18px 0 12px;
  font-size: clamp(26px, 3vw, 38px);
  line-height: .95;
  letter-spacing: -.055em;
}

.verdict-card p {
  margin: 0 0 18px;
  color: var(--muted);
  font-size: 13px;
}

.verdict-card a {
  margin-top: auto;
  color: var(--good);
  font-size: 13px;
  font-weight: 750;
  text-decoration: none;
}

.verdict-card a:hover {
  text-decoration: underline;
}

.verdict-real strong { color: var(--good); }
.verdict-open strong { color: var(--warn); }
.verdict-risk strong { color: var(--bad); }

.verdict-card strong::before {
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 24px;
  margin-right: 8px;
  border: 1px solid currentColor;
  border-radius: 50%;
  font: 700 14px/1 var(--mono);
  vertical-align: .18em;
}

.verdict-real strong::before { content: "✓"; }
.verdict-open strong::before { content: "◇"; }
.verdict-risk strong::before { content: "!"; }

.bad-panel > .tag:first-child::before {
  content: "!";
  font-weight: 900;
}

.good-panel > .tag:first-child::before {
  content: "✓";
  font-weight: 900;
}

.thesis-panel {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(260px, .75fr);
  gap: 28px;
  align-items: end;
}

.thesis-panel p {
  margin-bottom: 0;
}

.calculation-notes {
  display: grid;
  gap: 10px;
  margin-top: 22px;
}

.calculation-notes p {
  margin: 0;
  padding: 13px 0;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 13px;
}

.calculation-notes strong {
  color: var(--text);
}

.calculator-card {
  padding: 28px;
}

.calculator-result {
  margin-top: 28px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
}

.result-label {
  color: var(--dim);
  font-family: var(--mono);
  font-size: 10px;
  text-transform: uppercase;
}

.result-metrics {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.result-metrics p {
  display: grid;
  gap: 4px;
  margin: 0;
  padding: 14px 0;
}

.result-metrics p + p {
  padding-left: 18px;
  border-left: 1px solid var(--line);
}

.result-metrics span {
  color: var(--dim);
  font-size: 11px;
}

.result-metrics strong {
  font-size: 18px;
}

.architecture-thesis {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.architecture-thesis .muted {
  margin: 22px 0;
}

.architecture-cards {
  grid-template-columns: repeat(2, 1fr);
  margin-top: 0;
}

.search-control {
  display: grid;
  grid-template-columns: minmax(240px, 380px) minmax(190px, 250px) 1fr;
  gap: 14px;
  align-items: center;
  margin-bottom: 16px;
}

.tool-search-control {
  grid-template-columns: minmax(280px, 560px) minmax(240px, 1fr);
  margin-bottom: 18px;
}

.search-control label {
  position: relative;
}

.search-control input[type="search"],
.search-control select {
  width: 100%;
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 0 16px;
  color: var(--text);
  background: rgba(var(--surface-rgb), .055);
  font: 600 13px var(--sans);
}

.search-control select {
  cursor: pointer;
  padding-right: 34px;
}

.search-control input[type="search"]::placeholder {
  color: var(--dim);
}

.search-help {
  margin: 0;
  color: var(--dim);
  font-size: 12px;
}

.empty-state {
  display: none;
  padding: 28px;
  border: 1px dashed var(--line);
  border-radius: var(--radius);
  color: var(--muted);
  text-align: center;
}

.empty-state.visible {
  display: block;
}

.evidence-scope {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.evidence-scope article {
  padding: 22px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .035);
}

.evidence-scope b {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--good);
  font-family: var(--mono);
  font-size: 11px;
}

.evidence-scope b::before {
  content: "✓";
  display: inline-grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border: 1px solid currentColor;
  border-radius: 6px;
  font-weight: 900;
}

.evidence-scope b[data-evidence-status="limited"] {
  color: var(--warn);
}

.evidence-scope b[data-evidence-status="limited"]::before {
  content: "≈";
}

.evidence-scope b[data-evidence-status="not-established"] {
  color: var(--bad);
}

.evidence-scope b[data-evidence-status="not-established"]::before {
  content: "×";
}

.evidence-scope h3 {
  margin: 12px 0 8px;
  font-size: 18px;
}

.evidence-scope p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.implementation-table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .025);
}

.implementation-table th,
.implementation-table td {
  padding: 16px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
}

.implementation-table th {
  color: var(--dim);
  background: rgba(var(--surface-rgb), .04);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .03em;
  text-transform: uppercase;
}

.implementation-table td {
  color: var(--muted);
  font-size: 13px;
}

.implementation-table td:first-child {
  color: var(--text);
  font-weight: 800;
}

.path-table {
  table-layout: fixed;
}

.path-table th:nth-child(1) { width: 19%; }
.path-table th:nth-child(2) { width: 22%; }
.path-table th:nth-child(3) { width: 21%; }
.path-table th:nth-child(4) { width: 12%; }
.path-table th:nth-child(5) { width: 26%; }

.inference-learning-table {
  table-layout: fixed;
}

.inference-learning-table th:nth-child(1) { width: 18%; }
.inference-learning-table th:nth-child(2) { width: 49%; }
.inference-learning-table th:nth-child(3) { width: 33%; }

.implementation-table small {
  display: block;
  margin-top: 5px;
  color: var(--dim);
}

.path-badge {
  display: inline-flex;
  padding: 3px 6px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--good);
  font-family: var(--mono);
  font-size: 9px;
  text-transform: uppercase;
}

.architecture-flow {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  margin-top: 24px;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.architecture-flow div {
  position: relative;
  min-height: 128px;
  padding: 17px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .035);
}

.architecture-flow b {
  display: block;
  margin-bottom: 7px;
  color: var(--good);
  font-family: var(--mono);
  font-size: 10px;
}

.architecture-flow strong {
  display: block;
  margin-bottom: 5px;
  font-size: 14px;
}

.architecture-flow span {
  color: var(--muted);
  font-size: 11px;
}

.system-diagram {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 42px minmax(0, 1fr) 42px minmax(0, 1fr);
  align-items: stretch;
  margin-top: 24px;
}

.video-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin: 24px 0 30px;
}

.video-grid.single-video-grid {
  grid-template-columns: minmax(0, 1fr);
}

.video-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(var(--surface-rgb), .035);
}

.video-frame {
  position: relative;
  aspect-ratio: 16 / 9;
  background: #000;
}

.video-frame iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

.video-poster {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  overflow: hidden;
  color: inherit;
  background: transparent;
  cursor: pointer;
}

.video-poster img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .8;
  transition: opacity .2s ease, transform .25s ease;
}

.video-poster span {
  position: absolute;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%);
  width: max-content;
  max-width: calc(100% - 32px);
  padding: 9px 13px;
  border: 1px solid rgba(255, 255, 255, .3);
  border-radius: 999px;
  color: #fff;
  background: rgba(var(--media-overlay-rgb), .82);
  font: 700 11px var(--mono);
  text-align: center;
}

.video-poster:hover img,
.video-poster:focus-visible img {
  opacity: 1;
  transform: scale(1.015);
}

.video-card > div:last-child {
  padding: 18px;
}

.video-card h3 {
  margin: 11px 0 8px;
  font-size: 19px;
}

.video-card p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.video-card .video-direct {
  display: inline-flex;
  margin-top: 14px;
  color: var(--blue);
  font: 700 11px var(--mono);
}

.station-benchmark-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin: 20px 0;
}

.station-benchmark-chart {
  min-width: 0;
  margin: 0;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(var(--surface-rgb), .04);
}

.station-benchmark-chart:last-child {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 20px;
}

.station-benchmark-chart:last-child figcaption {
  grid-column: 1 / -1;
}

.station-benchmark-chart figcaption > span,
.station-sparse-results article > span {
  color: var(--blue);
  font: 700 9px var(--mono);
  letter-spacing: .05em;
  text-transform: uppercase;
}

.station-benchmark-chart figcaption h4 {
  margin: 8px 0 6px;
  font-size: 20px;
  line-height: 1.1;
  letter-spacing: -.03em;
}

.station-benchmark-chart figcaption p,
.station-sparse-results article p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.55;
}

.station-chart-block {
  --bench-color: var(--blue);
  display: grid;
  gap: 8px;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.station-chart-block.prefill-bars { --bench-color: var(--purple); }
.station-chart-block.concurrency-bars { --bench-color: var(--good); }
.station-chart-block.swarm-bars { --bench-color: var(--blue); }
.station-chart-block.power-bars { --bench-color: var(--warn); }

.station-chart-block h5 {
  margin: 0 0 2px;
  color: var(--text);
  font: 700 9px var(--mono);
  text-transform: uppercase;
}

.station-bench-bar {
  display: grid;
  grid-template-columns: 132px minmax(72px, 1fr) 124px;
  gap: 8px;
  align-items: center;
}

.station-bench-bar > span,
.station-bench-bar > strong {
  min-width: 0;
  font: 8px var(--mono);
}

.station-bench-bar > span {
  color: var(--muted);
}

.station-bench-bar > strong {
  color: var(--text);
  text-align: right;
}

.station-bench-bar meter {
  display: block;
  width: 100%;
  height: 10px;
  border: 0;
  border-radius: 999px;
  background: rgba(var(--surface-rgb), .11);
  appearance: none;
}

.station-bench-bar meter::-webkit-meter-bar {
  height: 10px;
  border: 0;
  border-radius: 999px;
  background: rgba(var(--surface-rgb), .11);
  box-shadow: none;
}

.station-bench-bar meter::-webkit-meter-optimum-value {
  border-radius: 999px;
  background: var(--bench-color);
}

.station-bench-bar meter::-moz-meter-bar {
  border-radius: 999px;
  background: var(--bench-color);
}

.station-chart-jump {
  justify-self: start;
  margin-top: 5px;
  padding: 7px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--blue);
  background: rgba(var(--surface-rgb), .045);
  font: 700 8px var(--mono);
  cursor: pointer;
}

.station-chart-jump b {
  color: var(--text);
}

.station-chart-jump:hover,
.station-chart-jump:focus-visible {
  border-color: rgba(var(--blue-rgb), .48);
  background: rgba(var(--blue-rgb), .08);
}

.station-burst {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  margin-top: 2px;
  padding: 9px 10px;
  border: 1px dashed rgba(var(--good-rgb), .35);
  border-radius: 9px;
  color: var(--muted);
  font: 8px var(--mono);
}

.station-burst strong {
  color: var(--good);
  text-align: right;
}

.station-burst.thermal {
  border-color: rgba(var(--warn-rgb), .35);
}

.station-burst.thermal strong {
  color: var(--warn);
}

.station-sparse-results {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 20px;
}

.station-sparse-results article {
  min-width: 0;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: rgba(var(--surface-rgb), .025);
}

.station-sparse-results article h3 {
  margin: 8px 0 6px;
  font-size: 18px;
}

@media (max-width: 1100px) {
  .station-bench-bar {
    grid-template-columns: 112px minmax(64px, 1fr) 112px;
  }
}

.data-matrix {
  margin: 18px 0;
}

.source-table th:nth-child(1) { width: 17%; }
.source-table th:nth-child(2) { width: 24%; }
.source-table th:nth-child(3) { width: 29%; }
.source-table th:nth-child(4) { width: 30%; }

.diagram-tier {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(var(--surface-rgb), .025);
}

.diagram-tier h3 {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 16px;
  color: var(--text);
  font-size: 13px;
}

.diagram-tier h3 span {
  color: var(--good);
  font: 10px var(--mono);
}

.diagram-node {
  padding: 14px;
  border: 1px solid rgba(var(--good-rgb), .28);
  border-radius: 10px;
  background: rgba(var(--good-rgb), .06);
}

.diagram-node strong,
.diagram-node small {
  display: block;
}

.diagram-node strong {
  font-size: 13px;
}

.diagram-node small {
  margin-top: 5px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.45;
}

.diagram-arrow,
.diagram-tier-arrow {
  display: grid;
  place-items: center;
  color: var(--good);
  font: 500 22px var(--mono);
}

.diagram-arrow {
  min-height: 30px;
}

.diagram-tier-arrow {
  align-self: center;
}

.diagram-serving {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.diagram-node.optional {
  border-style: dashed;
  border-color: rgba(var(--warn-rgb), .45);
  background: rgba(var(--warn-rgb), .06);
}

.diagram-node.decision {
  margin-top: auto;
}

.tool-group-head {
  grid-column: 1 / -1;
  margin: 30px 0 -2px;
  color: var(--dim);
  font-family: var(--mono);
  font-size: 11px;
  text-transform: uppercase;
}

.tool-group-head:first-child {
  margin-top: 0;
}

.tool-group {
  grid-column: 1 / -1;
  border-top: 1px solid var(--line);
  scroll-margin-top: 110px;
}

.tool-group:last-child {
  border-bottom: 1px solid var(--line);
}

.tool-group[hidden] {
  display: none;
}

.tool-group > summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 32px;
  gap: 14px;
  align-items: center;
  padding: 18px 4px;
  list-style: none;
  cursor: pointer;
}

.tool-group > summary::-webkit-details-marker {
  display: none;
}

.tool-group > summary span {
  color: var(--text);
  font-size: clamp(17px, 2vw, 22px);
  font-weight: 790;
  letter-spacing: -.025em;
}

.tool-group > summary small {
  color: var(--dim);
  font: 10px var(--mono);
  text-transform: uppercase;
}

.tool-group > summary::after {
  content: "+";
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--good);
  font: 500 20px/1 var(--sans);
}

.tool-group[open] > summary::after {
  content: "−";
}

.tool-group > summary:hover,
.tool-group[open] > summary {
  background: rgba(var(--surface-rgb), .035);
}

.tool-group-body {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  padding: 16px 0 24px;
}

.tool-choice {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
  margin: 14px 0 0;
}

.tool-choice span {
  padding: 4px 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--dim);
  font-family: var(--mono);
  font-size: 9px;
}

.tool-efficiency-section {
  padding: 82px 0;
  background:
    radial-gradient(circle at 84% 15%, rgba(var(--purple-rgb), .09), transparent 30rem),
    var(--section-wash);
}

.section-disclosure-body > .tool-efficiency-section {
  padding: 48px 0 0;
  background: none;
}

.section-disclosure-body > .tool-efficiency-section > .wrap {
  width: 100%;
  max-width: none;
  padding: 0;
}

.harness-efficiency {
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: rgba(var(--surface-rgb), .025);
  box-shadow: 0 22px 70px rgba(0, 0, 0, .2);
}

.harness-efficiency figcaption {
  max-width: 900px;
  padding: 26px 26px 0;
}

.harness-efficiency figcaption > span {
  color: var(--good);
  font: 9px var(--mono);
  letter-spacing: .06em;
  text-transform: uppercase;
}

.harness-efficiency figcaption h3 {
  margin: 9px 0 7px;
  font-size: clamp(24px, 3.4vw, 38px);
  line-height: 1.05;
  letter-spacing: -.045em;
}

.harness-efficiency figcaption p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.chart-toggle {
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
  color: var(--dim);
  font: 9px var(--mono);
}

.chart-toggle > span {
  letter-spacing: .05em;
  text-transform: uppercase;
}

.chart-toggle > div {
  display: inline-flex;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(var(--surface-rgb), .025);
}

.chart-toggle button {
  min-height: 34px;
  padding: 7px 12px;
  border: 0;
  color: var(--dim);
  background: transparent;
  font: 700 9px/1.25 var(--mono);
  cursor: pointer;
}

.chart-toggle button + button {
  border-left: 1px solid var(--line);
}

.chart-toggle button:hover {
  color: var(--text);
  background: rgba(var(--surface-rgb), .05);
}

.chart-toggle button.active {
  color: var(--on-gradient);
  background: linear-gradient(90deg, var(--blue), var(--purple));
}

.chart-toggle output {
  flex: 1 1 260px;
  color: var(--muted);
  line-height: 1.45;
}

.efficiency-range-control {
  margin: 22px 26px 0 206px;
}

.efficiency-plot {
  padding: 17px 26px 26px;
}

.efficiency-axis {
  display: flex;
  justify-content: space-between;
  margin: 0 0 6px 180px;
  color: var(--dim);
  font: 8px var(--mono);
}

.efficiency-row {
  --series: var(--blue);
  display: grid;
  grid-template-columns: 164px minmax(0, 1fr);
  gap: 16px;
  align-items: center;
}

.efficiency-row + .efficiency-row {
  margin-top: 8px;
}

.efficiency-row--opencode { --series: var(--good); }
.efficiency-row--claude { --series: var(--warn); }
.efficiency-row--nanocoder { --series: var(--purple); }

.efficiency-label strong,
.efficiency-label span,
.efficiency-label small {
  display: block;
}

.efficiency-label strong {
  color: var(--text);
  font-size: 13px;
}

.efficiency-label span {
  margin-top: 2px;
  color: var(--series);
  font: 700 10px var(--mono);
}

.efficiency-label small {
  margin-top: 3px;
  color: var(--dim);
  font: 8px var(--mono);
}

.efficiency-track {
  position: relative;
  height: 54px;
  border: 1px solid rgba(var(--surface-rgb), .075);
  border-radius: 9px;
  background:
    repeating-linear-gradient(90deg, transparent 0 calc(20% - 1px), rgba(var(--surface-rgb), .075) calc(20% - 1px) 20%),
    rgba(var(--surface-rgb), .02);
}

.efficiency-dot {
  position: absolute;
  width: 7px;
  height: 7px;
  border: 1px solid rgba(var(--surface-rgb), .55);
  border-radius: 50%;
  background: var(--series);
  box-shadow: 0 0 0 2px rgba(var(--dark-panel-rgb), .3);
  transform: translate(-50%, -50%);
  opacity: .62;
  transition: left .24s ease;
}

.efficiency-dot[hidden] {
  display: none;
}

.efficiency-average {
  position: absolute;
  z-index: 2;
  top: 50%;
  width: 13px;
  height: 13px;
  border: 2px solid var(--text);
  background: var(--series);
  box-shadow: 0 0 0 3px rgba(var(--dark-panel-rgb), .7);
  transform: translate(-50%, -50%) rotate(45deg);
  transition: left .24s ease;
}

.efficiency-row--pi .efficiency-average { left: 20.87%; }
.efficiency-row--opencode .efficiency-average { left: 30.81%; }
.efficiency-row--claude .efficiency-average { left: 80.32%; }
.efficiency-row--nanocoder .efficiency-average { left: 51.89%; }

.efficiency-source {
  border-right: 0;
  border-bottom: 0;
  border-left: 0;
}

.memory-efficiency {
  margin-top: 24px;
}

.memory-plot {
  padding: 22px 26px 26px;
}

.memory-axis {
  display: flex;
  justify-content: space-between;
  margin: 0 0 7px 180px;
  color: var(--dim);
  font: 8px var(--mono);
}

.memory-row {
  --series: var(--muted);
  display: grid;
  grid-template-columns: 164px minmax(0, 1fr);
  gap: 16px;
  align-items: center;
}

.memory-row + .memory-row {
  margin-top: 8px;
}

.memory-row--jcode-off,
.memory-row--jcode {
  --series: var(--good);
}

.memory-row--codex { --series: var(--blue); }
.memory-row--pi { --series: var(--purple); }
.memory-row--claude,
.memory-row--opencode { --series: var(--warn); }

.memory-label strong,
.memory-label span {
  display: block;
}

.memory-label strong {
  color: var(--text);
  font-size: 11px;
  line-height: 1.25;
}

.memory-label span {
  margin-top: 3px;
  color: var(--series);
  font: 700 9px var(--mono);
}

.memory-track {
  height: 29px;
  overflow: hidden;
  border: 1px solid rgba(var(--surface-rgb), .075);
  border-radius: 8px;
  background:
    repeating-linear-gradient(90deg, transparent 0 calc(25% - 1px), rgba(var(--surface-rgb), .075) calc(25% - 1px) 25%),
    rgba(var(--surface-rgb), .02);
}

.memory-track i {
  display: block;
  min-width: 6px;
  height: 100%;
  border-radius: 7px;
  background: var(--series);
  background: linear-gradient(90deg, color-mix(in srgb, var(--series) 72%, transparent), var(--series));
}

.memory-row--jcode-off .memory-track i { width: 3.09%; }
.memory-row--jcode .memory-track i { width: 3.25%; }
.memory-row--codex .memory-track i { width: 6.75%; }
.memory-row--pi .memory-track i { width: 23.91%; }
.memory-row--antigravity .memory-track i { width: 27%; }
.memory-row--cursor .memory-track i { width: 49.22%; }
.memory-row--copilot .memory-track i { width: 49.41%; }
.memory-row--claude .memory-track i { width: 66.47%; }
.memory-row--opencode .memory-track i { width: 99.5%; }

.hardware-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.hardware-grid article {
  padding: 20px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .03);
}

.hardware-grid h3 {
  margin: 10px 0 8px;
  font-size: 17px;
}

.hardware-grid p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.more {
  display: inline-block;
  margin-top: 15px;
  color: var(--good);
  font-weight: 700;
  text-decoration: none;
  text-wrap: balance;
}

.more:hover {
  text-decoration: underline;
}

.tool-links {
  display: grid;
  justify-items: start;
  gap: 8px;
  width: 100%;
  margin-top: 17px;
}

.tool-links .more {
  display: block;
  margin-top: 0;
  line-height: 1.4;
}

.stack-coverage {
  display: grid;
  gap: 10px;
  align-items: center;
  scroll-margin-top: 96px;
  margin-bottom: 20px;
  padding: 13px 15px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: rgba(var(--surface-rgb), .03);
}

.stack-coverage strong {
  color: var(--text);
  font: 11px var(--mono);
  text-transform: uppercase;
}

.tool-filter-options {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 7px;
  width: 100%;
}

.stack-coverage button {
  --filter-glyph: "·";
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 4px 7px;
  border: 1px solid transparent;
  border-radius: 999px;
  color: var(--muted);
  background: rgba(var(--blue-rgb), .075);
  font: 10px var(--mono);
  cursor: pointer;
  transition: color .2s ease, background .2s ease, border-color .2s ease;
}

.tool-filter-options button {
  justify-content: flex-start;
  min-width: 0;
}

.stack-coverage button:hover {
  color: var(--text);
  border-color: var(--line);
}

.stack-coverage button.active {
  color: var(--on-solid-accent);
  border-color: var(--good);
  background: var(--good);
}

.stack-coverage .filter-count {
  min-width: 16px;
  height: 16px;
  margin-left: auto;
  padding: 0 4px;
  font-size: 8px;
}

.industry-coverage {
  display: grid;
  grid-template-columns: minmax(280px, .75fr) minmax(0, 1.25fr);
  margin: 22px 0 28px;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.industry-coverage-intro {
  padding: 23px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: linear-gradient(135deg, rgba(var(--good-rgb), .06), rgba(var(--blue-rgb), .035));
}

.industry-coverage-intro .tag {
  margin-bottom: 13px;
}

.industry-coverage-intro h2 {
  margin: 0 0 9px;
  font-size: clamp(25px, 3vw, 36px);
  line-height: 1;
}

.industry-coverage-intro p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.industry-groups {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  list-style: none;
}

.industry-groups li {
  display: grid;
  align-content: center;
  gap: 7px;
  min-width: 0;
  min-height: 112px;
  margin: 0;
  padding: 19px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .025);
}

.industry-groups b {
  color: var(--good);
  font: 10px var(--mono);
  letter-spacing: .02em;
  text-transform: uppercase;
}

.industry-groups span {
  color: var(--text);
  font-size: 14px;
  line-height: 1.45;
}

.tool-filter-summary {
  margin: -8px 0 20px;
  color: var(--dim);
  font-family: var(--mono);
  font-size: 11px;
}

.tool-cards .card[hidden],
.tool-cards > .tool-group[hidden] {
  display: none;
}

.decision-strip,
.compute-ladder,
.role-grid {
  display: grid;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.decision-strip,
.compute-ladder {
  grid-template-columns: repeat(4, 1fr);
}

.role-grid {
  grid-template-columns: repeat(3, 1fr);
}

.decision-strip article,
.compute-ladder article,
.role-grid article {
  min-width: 0;
  padding: 21px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .035);
}

.decision-strip b {
  display: block;
  margin-bottom: 9px;
  color: var(--good);
  font-family: var(--mono);
  font-size: 11px;
  text-transform: uppercase;
}

.decision-strip p,
.compute-ladder p,
.role-grid p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.compute-ladder {
  margin-top: 18px;
}

.compute-ladder h3,
.role-grid h3 {
  margin: 11px 0 8px;
  font-size: 18px;
  line-height: 1.12;
}

.oem-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.oem-card {
  display: flex;
  min-width: 0;
  min-height: 245px;
  padding: 23px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .035);
  flex-direction: column;
}

.oem-logo {
  display: flex;
  height: 48px;
  margin-bottom: 24px;
  align-items: center;
}

.oem-logo img {
  display: block;
  width: auto;
  max-width: 150px;
  height: 38px;
  object-fit: contain;
  object-position: left center;
  filter: grayscale(1) brightness(0) invert(1);
  opacity: .86;
}

.oem-logo img.brand-monochrome {
  filter: grayscale(1) contrast(1.2);
}

@media (prefers-color-scheme: light) {
  .oem-logo img {
    filter: grayscale(1) brightness(0);
    opacity: .82;
  }

  .oem-logo img.brand-monochrome {
    filter: grayscale(1) contrast(1.2);
    opacity: .86;
  }
}

.oem-card h3 {
  margin: 0 0 9px;
  font-size: 19px;
  line-height: 1.12;
}

.oem-card p {
  margin: 0 0 20px;
  color: var(--muted);
  font-size: 13px;
}

.oem-card .more {
  margin-top: auto;
}

.oem-card .tool-links {
  margin-top: auto;
}

.oem-card .tool-links .more {
  margin-top: 0;
}

.oem-card > .claim-state {
  width: fit-content;
  margin-bottom: 12px;
}

@media (max-width: 900px) {
  .oem-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .oem-grid {
    grid-template-columns: 1fr;
  }

  .oem-card {
    min-height: 220px;
    padding: 20px;
  }
}

.training-panel {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(420px, 1.15fr);
  gap: 34px;
  margin-top: 18px;
}

.training-panel h3 {
  margin: 0 0 12px;
  font-size: clamp(24px, 3vw, 38px);
  letter-spacing: -.045em;
  line-height: 1;
}

.training-panel p {
  margin: 0;
  color: var(--muted);
}

.compact-steps {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--line);
}

.compact-steps li {
  display: grid;
  grid-template-columns: 36px 1fr;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}

.compact-steps span,
.setup-step > span,
.spark-runbook > article > span {
  color: var(--good);
  font-family: var(--mono);
  font-size: 11px;
}

.compact-steps p {
  font-size: 13px;
}

.compact-steps strong {
  color: var(--text);
}

.reality-check {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 22px;
  align-items: start;
  margin-top: 18px;
  padding: 22px;
  border: 1px solid rgba(var(--warn-rgb), .3);
  border-radius: 12px;
  background: rgba(var(--warn-rgb), .065);
}

.reality-check h3,
.insider-panel h3,
.topology-note h3 {
  margin: 0 0 7px;
  font-size: 19px;
}

.reality-check p,
.insider-panel p,
.topology-note p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.europe-cards .card,
.qol-cards .card {
  display: flex;
  flex-direction: column;
}

.europe-cards .card p,
.qol-cards .card p {
  flex: 1;
}

.spark-hero {
  max-width: var(--max) !important;
}

.spark-hero h1 {
  max-width: 15ch;
  letter-spacing: -.058em;
  word-spacing: .08em;
}

.spark-hero h1 .grad {
  padding-right: .04em;
}

.nvidia-playbooks-section {
  padding-top: 4px;
}

.nvidia-playbooks-widget {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(430px, 1.18fr);
  column-gap: clamp(30px, 5vw, 68px);
  row-gap: 22px;
  overflow: hidden;
  padding: clamp(24px, 3vw, 38px);
  border: 1px solid #364138;
  border-radius: 18px;
  color: #fff;
  color-scheme: dark;
  background:
    radial-gradient(circle at 13% -8%, rgba(118, 185, 0, .27), transparent 38%),
    radial-gradient(circle at 96% 0, rgba(103, 188, 187, .12), transparent 33%),
    linear-gradient(118deg, #060806 0%, #0b100c 47%, #10191a 100%);
  box-shadow: 0 28px 80px rgba(0, 0, 0, .2), inset 0 1px rgba(255, 255, 255, .035);
}

.nvidia-playbooks-widget > *:not(.nvidia-playbooks-field) {
  position: relative;
  z-index: 1;
}

.nvidia-playbooks-field {
  position: absolute;
  z-index: 0;
  inset: -18%;
  pointer-events: none;
  opacity: .68;
  background-image:
    url("../images/dgx-spark-network.svg?v=1"),
    radial-gradient(circle, rgba(118, 185, 0, .48) 0 1px, transparent 1.7px),
    radial-gradient(circle, rgba(255, 255, 255, .26) 0 .7px, transparent 1.4px);
  background-position: 0 0, 22px 16px, 64px 48px;
  background-size: 760px 460px, 192px 148px, 254px 186px;
  animation: nvidia-playbook-drift 9s ease-in-out infinite alternate;
}

.nvidia-playbooks-field::before {
  position: absolute;
  inset: 0;
  content: "";
  background:
    radial-gradient(circle at 14% 31%, rgba(118, 185, 0, .24), transparent 20%),
    radial-gradient(circle at 79% 18%, rgba(79, 168, 160, .12), transparent 18%),
    radial-gradient(circle at 72% 76%, rgba(118, 185, 0, .1), transparent 17%);
}

.nvidia-playbooks-field span {
  position: absolute;
  width: 9px;
  height: 8px;
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
  background: #76b900;
  box-shadow: 0 0 18px rgba(118, 185, 0, .55);
  animation: nvidia-playbook-particle 3.8s ease-in-out infinite alternate;
}

.nvidia-playbooks-field span:nth-child(1) { top: 18%; left: 9%; animation-delay: -2s; }
.nvidia-playbooks-field span:nth-child(2) { top: 31%; left: 41%; width: 6px; height: 6px; animation-delay: -5s; }
.nvidia-playbooks-field span:nth-child(3) { top: 14%; right: 18%; animation-delay: -7s; }
.nvidia-playbooks-field span:nth-child(4) { right: 7%; bottom: 22%; width: 7px; height: 7px; animation-delay: -3s; }
.nvidia-playbooks-field span:nth-child(5) { bottom: 14%; left: 28%; width: 6px; height: 6px; animation-delay: -6s; }
.nvidia-playbooks-field span:nth-child(6) { top: 56%; left: 54%; animation-delay: -1s; }

.nvidia-playbooks-intro {
  position: relative;
  align-self: center;
}

.nvidia-playbooks-intro .heading-line {
  display: block;
}

.nvidia-playbooks-intro .section-share {
  position: absolute;
  top: 0;
  right: 0;
  width: 32px;
  min-height: 32px;
  margin: 0;
  padding: 8px;
  border-color: rgba(118, 185, 0, .55);
  color: #9be326;
  background: rgba(3, 6, 3, .82);
}

.nvidia-playbooks-intro .section-share:hover {
  color: #fff;
  background: rgba(118, 185, 0, .16);
}

.nvidia-playbooks-intro .section-share-label {
  display: none;
}

.nvidia-playbooks-label {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 20px;
  color: #9be326;
  font: 750 10px/1.2 var(--mono);
  letter-spacing: .085em;
  text-transform: uppercase;
}

.nvidia-playbooks-label::before {
  width: 9px;
  height: 9px;
  content: "";
  background: #76b900;
  box-shadow: 0 0 18px rgba(118, 185, 0, .7);
  transform: rotate(45deg);
}

.nvidia-playbooks-intro h2 {
  max-width: 13ch;
  margin: 0 0 15px;
  color: #fff;
  font-size: clamp(32px, 3.3vw, 48px);
  letter-spacing: -.05em;
  line-height: 1;
}

.nvidia-playbooks-intro > p {
  max-width: 590px;
  margin: 0;
  color: #c8cec9;
  font-size: clamp(13px, 1.2vw, 15px);
  line-height: 1.54;
}

.nvidia-playbooks-intro a {
  color: #9be326;
  font-weight: 700;
  text-decoration-color: rgba(155, 227, 38, .52);
  text-underline-offset: 3px;
}

.nvidia-playbooks-intro a:hover {
  text-decoration-color: #9be326;
}

.nvidia-playbooks-intro a:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
}

.nvidia-playbook-list.tool-links {
  align-self: center;
  justify-items: stretch;
  gap: 8px;
  margin-top: 0;
}

.nvidia-playbook-list > a {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) 20px;
  gap: 14px;
  align-items: center;
  min-width: 0;
  min-height: 74px;
  padding: 11px 15px;
  border: 1px solid #384039;
  border-radius: 10px;
  color: #fff;
  text-decoration: none;
  background: rgba(4, 6, 4, .82);
  box-shadow: inset 0 1px rgba(255, 255, 255, .025);
  transition: border-color .2s ease, background-color .2s ease, transform .2s ease;
}

.nvidia-playbook-list > a:hover {
  border-color: #76b900;
  background: rgba(13, 19, 10, .94);
  transform: translateX(4px);
}

.nvidia-playbook-list > a:focus-visible,
.nvidia-playbooks-home:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
}

.nvidia-playbook-index {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border: 1px solid rgba(118, 185, 0, .66);
  color: #9be326;
  background: rgba(118, 185, 0, .075);
  font: 760 12px/1 var(--mono);
  clip-path: polygon(0 0, 78% 0, 100% 22%, 100% 100%, 22% 100%, 0 78%);
}

.nvidia-playbook-copy,
.nvidia-playbook-title {
  display: block;
  min-width: 0;
}

.nvidia-playbook-title {
  margin-bottom: 6px;
  color: #fff;
  font-size: 15px;
  font-weight: 760;
  line-height: 1.25;
}

.nvidia-playbook-title small {
  display: inline-block;
  margin-left: 7px;
  padding: 3px 7px;
  border-radius: 4px;
  color: #10160c;
  background: #9be326;
  font: 800 9px/1 var(--mono);
  vertical-align: 2px;
  text-transform: uppercase;
}

.nvidia-playbook-copy > span:last-child {
  display: block;
  color: #aeb5af;
  font-size: 11px;
  line-height: 1.4;
}

.nvidia-playbook-arrow {
  color: #9be326;
  font-size: 18px;
}

.nvidia-playbooks-home {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-top: 2px;
  padding: 14px 20px;
  border: 1px solid #3e483f;
  border-radius: 11px;
  color: #fff;
  text-decoration: none;
  background: #030503;
  isolation: isolate;
  transition: border-color .2s ease, background-color .2s ease;
}

.nvidia-playbooks-home::before {
  position: absolute;
  z-index: -1;
  top: 0;
  right: 0;
  bottom: 0;
  width: 58%;
  content: "";
  opacity: .72;
  background:
    linear-gradient(90deg, #030503 0%, rgba(3, 5, 3, .72) 24%, rgba(3, 5, 3, .08) 78%),
    radial-gradient(circle, transparent 0 4px, rgba(166, 196, 103, .25) 4.8px 5.6px, transparent 6.4px) 0 0 / 25px 22px,
    radial-gradient(circle, transparent 0 5px, rgba(180, 139, 74, .18) 5.8px 6.7px, transparent 7.4px) 12px 8px / 31px 27px,
    linear-gradient(122deg, rgba(118, 185, 0, .16), rgba(125, 92, 45, .25));
  transform: skewX(-8deg) scaleX(1.08);
  transform-origin: right center;
}

.nvidia-playbooks-home:hover {
  border-color: #76b900;
}

.nvidia-playbooks-home span:first-child,
.nvidia-playbooks-home small,
.nvidia-playbooks-home strong {
  display: block;
}

.nvidia-playbooks-home small {
  margin-bottom: 5px;
  color: #9be326;
  font: 750 9px/1.2 var(--mono);
  letter-spacing: .07em;
  text-transform: uppercase;
}

.nvidia-playbooks-home strong {
  color: #fff;
  font-size: 18px;
}

.nvidia-playbooks-home > span:last-child {
  flex: 0 0 auto;
  padding: 11px 14px;
  color: #10160c;
  background: #9be326;
  box-shadow: 0 8px 24px rgba(118, 185, 0, .2);
  font-size: 11px;
  font-weight: 800;
}

@keyframes nvidia-playbook-drift {
  from { transform: translate3d(-2%, -1%, 0) scale(1); }
  to { transform: translate3d(3%, 2%, 0) scale(1.025); }
}

@keyframes nvidia-playbook-particle {
  from { opacity: .22; transform: translate3d(0, -7px, 0) rotate(-12deg) scale(.82); }
  to { opacity: .8; transform: translate3d(8px, 9px, 0) rotate(13deg) scale(1.08); }
}

@media (max-width: 900px) {
  .nvidia-playbooks-widget {
    grid-template-columns: 1fr;
  }

  .nvidia-playbooks-intro h2 {
    max-width: 15ch;
  }
}

@media (max-width: 700px) {
  .nvidia-playbooks-widget {
    row-gap: 24px;
    padding: 22px 16px 16px;
    border-radius: 14px;
  }

  .nvidia-playbooks-intro h2 {
    font-size: clamp(34px, 11vw, 48px);
  }

  .nvidia-playbook-list > a {
    grid-template-columns: 42px minmax(0, 1fr) 16px;
    gap: 11px;
    padding: 13px 11px;
  }

  .nvidia-playbook-index {
    width: 42px;
    height: 42px;
  }

  .nvidia-playbook-title small {
    margin-top: 5px;
    margin-left: 0;
  }

  .nvidia-playbooks-home {
    align-items: flex-start;
    flex-direction: column;
    padding: 18px;
  }

  .nvidia-playbooks-home > span:last-child {
    width: 100%;
    text-align: center;
  }
}

@media (prefers-reduced-motion: reduce) {
  .nvidia-playbooks-field,
  .nvidia-playbooks-field span,
  .skill-nvidia-field,
  .skill-nvidia-field i {
    animation: none;
  }

  .nvidia-playbook-list > a,
  .nvidia-playbooks-home {
    transition: none;
  }
}

.operator-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.operator-grid .card {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

.operator-grid .card p {
  flex: 1;
}

.remote-methods {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 18px;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.remote-methods article {
  min-width: 0;
  padding: 18px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .03);
}

.remote-methods b,
.remote-methods span {
  display: block;
}

.remote-methods b {
  margin-bottom: 7px;
  color: var(--good);
  font: 11px var(--mono);
  text-transform: uppercase;
}

.remote-methods span {
  color: var(--muted);
  font-size: 12px;
}

.spark-access-callout {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr);
  gap: 24px 34px;
  overflow: hidden;
  margin-top: 18px;
  padding: clamp(24px, 3vw, 34px);
  border: 1px solid rgba(118, 185, 0, .5);
  border-radius: 16px;
  color: #fff;
  color-scheme: dark;
  background:
    radial-gradient(circle at 8% 0, rgba(118, 185, 0, .25), transparent 34%),
    radial-gradient(circle at 92% 100%, rgba(71, 150, 145, .14), transparent 38%),
    linear-gradient(120deg, #060806, #0c120d 54%, #101819);
  box-shadow: 0 22px 62px rgba(0, 0, 0, .2), inset 0 1px rgba(255, 255, 255, .04);
}

.spark-access-callout::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  content: "";
  opacity: .24;
  background-image:
    linear-gradient(rgba(118, 185, 0, .16) 1px, transparent 1px),
    linear-gradient(90deg, rgba(118, 185, 0, .16) 1px, transparent 1px);
  background-size: 44px 44px;
  clip-path: polygon(34% 0, 100% 0, 100% 100%, 56% 100%);
}

.spark-access-eyebrow {
  display: inline-flex;
  gap: 9px;
  align-items: center;
  color: #9be326;
  font: 750 10px/1.2 var(--mono);
  letter-spacing: .075em;
  text-transform: uppercase;
}

.spark-access-eyebrow::before {
  width: 8px;
  height: 8px;
  content: "";
  background: #76b900;
  box-shadow: 0 0 16px rgba(118, 185, 0, .68);
  transform: rotate(45deg);
}

.spark-access-callout h3 {
  max-width: 19ch;
  margin: 13px 0 11px;
  scroll-margin-top: 96px;
  color: #fff;
  font-size: clamp(25px, 3vw, 37px);
  letter-spacing: -.045em;
  line-height: 1.02;
}

.spark-access-callout-copy p {
  max-width: 670px;
  margin: 0;
  color: #c3cbc4;
  font-size: 13px;
  line-height: 1.58;
}

.spark-access-routes {
  display: grid;
  gap: 8px;
  align-content: center;
  margin: 0;
}

.spark-access-routes > div {
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  padding: 13px 14px;
  border: 1px solid rgba(118, 185, 0, .24);
  border-radius: 9px;
  background: rgba(2, 5, 3, .58);
}

.spark-access-routes dt {
  color: #9be326;
  font: 750 10px/1.3 var(--mono);
  letter-spacing: .035em;
  text-transform: uppercase;
}

.spark-access-routes dd {
  margin: 0;
  color: #d3dad4;
  font-size: 12px;
  line-height: 1.4;
}

.spark-access-callout > .tool-links {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 9px 24px;
  margin-top: 0;
  padding-top: 17px;
  border-top: 1px solid rgba(118, 185, 0, .28);
}

.spark-access-callout > .tool-links a {
  margin-top: 0;
  color: #9be326;
  font-size: 12px;
  text-decoration: none;
}

.spark-access-callout > .tool-links a:hover {
  text-decoration: underline;
}

.runbook-access-paths {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 14px;
}

.runbook-access-paths > div {
  display: grid;
  gap: 6px;
  align-content: start;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(var(--surface-rgb), .035);
}

.runbook-access-paths strong {
  color: var(--good);
  font: 750 10px/1.4 var(--mono);
  text-transform: uppercase;
}

.runbook-access-paths span {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.48;
}

.spark-runbook > .runbook-access-step {
  scroll-margin-top: 96px;
  background: linear-gradient(145deg, rgba(var(--good-rgb), .075), rgba(var(--blue-rgb), .025));
}

@media (max-width: 1100px) {
  .runbook-access-paths {
    grid-template-columns: 1fr;
  }

  .runbook-access-paths > div {
    grid-template-columns: 104px minmax(0, 1fr);
  }
}

@media (max-width: 900px) {
  .spark-access-callout {
    grid-template-columns: 1fr;
  }

  .spark-access-routes {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .spark-access-routes > div {
    grid-template-columns: 1fr;
    align-content: start;
  }
}

@media (max-width: 700px) {
  .spark-access-callout {
    gap: 20px;
    padding: 21px 17px;
    border-radius: 13px;
  }

  .spark-access-routes {
    grid-template-columns: 1fr;
  }

  .spark-access-routes > div {
    grid-template-columns: 94px minmax(0, 1fr);
  }

  .spark-access-callout > .tool-links {
    align-items: flex-start;
    flex-direction: column;
  }

  .runbook-access-paths > div {
    grid-template-columns: 1fr;
    gap: 4px;
  }
}

.hardware-warning {
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr);
  gap: 24px;
  align-items: start;
  margin-top: 18px;
  padding: 24px;
  border: 1px solid rgba(var(--bad-rgb), .35);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(var(--bad-rgb), .095), rgba(var(--warn-rgb), .045));
}

.hardware-warning h3 {
  margin: 0 0 9px;
  font-size: clamp(21px, 2.5vw, 29px);
  letter-spacing: -.035em;
}

.hardware-warning p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.hardware-warning p + p {
  margin-top: 10px;
}

.hardware-warning h3.no-inline-brand-mark.brand-heading {
  display: block !important;
}

.no-inline-brand-mark.brand-heading > .brand-marks {
  display: none;
}

.hardware-warning p strong.brand-heading {
  display: inline !important;
}

.hardware-warning p strong.brand-heading > .brand-marks {
  display: none;
}

.hardware-warning.hardware-warning-disclosure {
  display: block;
  padding: 0;
  overflow: hidden;
}

.hardware-warning-disclosure-summary {
  display: block;
  cursor: pointer;
  list-style: none;
}

.hardware-warning-disclosure-summary::-webkit-details-marker {
  display: none;
}

.hardware-warning-disclosure-summary > h3 {
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr) 32px;
  gap: 24px;
  align-items: start;
  margin: 0;
  padding: 24px;
}

.hardware-warning-disclosure-summary > h3.brand-heading {
  display: grid !important;
}

.hardware-warning-disclosure-summary > h3.brand-heading > .brand-marks {
  display: none;
}

.hardware-warning-disclosure-title {
  min-width: 0;
}

.hardware-warning-disclosure-summary > h3::after {
  content: "+";
  display: grid;
  width: 30px;
  height: 30px;
  border: 1px solid rgba(var(--bad-rgb), .42);
  border-radius: 50%;
  place-items: center;
  color: var(--warn);
  font: 600 20px/1 var(--mono);
}

.hardware-warning-disclosure[open] > .hardware-warning-disclosure-summary > h3::after {
  content: "−";
}

.hardware-warning-disclosure-summary:hover {
  background: rgba(var(--warn-rgb), .045);
}

.hardware-warning-disclosure-summary:focus-visible {
  outline: 2px solid var(--warn);
  outline-offset: -4px;
}

.hardware-warning-disclosure-body {
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr) 32px;
  column-gap: 24px;
  padding: 0 24px 24px;
}

.hardware-warning-disclosure-body > * {
  grid-column: 2;
}

.hardware-price {
  display: grid;
  grid-template-columns: minmax(110px, auto) minmax(0, 1fr);
  gap: 7px 18px;
  align-items: center;
  margin-top: 16px;
  padding: 14px 16px;
  border: 1px solid rgba(var(--warn-rgb), .25);
  border-radius: 10px;
  background: var(--inset-surface);
}

.hardware-price > span {
  grid-column: 1 / -1;
  color: var(--warn);
  font: 9px var(--mono);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.hardware-price > strong {
  color: var(--text);
  font: 700 25px var(--mono);
  letter-spacing: -.04em;
}

.hardware-price > p {
  color: var(--muted);
  font-size: 12px;
}

.hardware-price > a {
  grid-column: 1 / -1;
  width: fit-content;
  color: var(--warn);
  font-size: 12px;
  font-weight: 750;
  text-decoration: none;
}

.hardware-price > a:hover {
  text-decoration: underline;
}

.role-grid code,
.setup-step code,
.safe-default code {
  color: var(--code-text);
  font-family: var(--mono);
}

.setup-step pre code {
  color: var(--pre-text);
}

.compact-check {
  grid-template-columns: 160px 1fr;
}

.setup-list {
  border-top: 1px solid var(--line);
}

.setup-step {
  display: grid;
  grid-template-columns: 60px minmax(0, 1fr);
  gap: 18px;
  padding: 24px 4px;
  border-bottom: 1px solid var(--line);
}

.setup-step h3 {
  margin: 0 0 7px;
  font-size: clamp(20px, 2.3vw, 27px);
  letter-spacing: -.035em;
}

.setup-step p {
  max-width: 920px;
  margin: 0;
  color: var(--muted);
}

pre {
  max-width: 100%;
  margin: 15px 0 0;
  padding: 16px;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 9px;
  color: var(--pre-text);
  background: var(--pre-surface);
  font: 12px/1.65 var(--mono);
  tab-size: 2;
}

pre code {
  font: inherit;
}

.safe-default {
  display: grid;
  gap: 6px;
  margin-top: 16px;
  padding: 15px;
  border-left: 3px solid var(--good);
  background: rgba(var(--good-rgb), .06);
}

.safe-default b {
  color: var(--good);
  font: 11px var(--mono);
  text-transform: uppercase;
}

.safe-default > b {
  display: flex;
  align-items: center;
  gap: 8px;
}

.warning-default {
  border-left-color: var(--warn);
  background: rgba(var(--warn-rgb), .06);
}

.warning-default b {
  color: var(--warn);
}

.safe-default > b::before {
  flex: 0 0 auto;
  content: "✓";
  font: 800 18px/1 system-ui, sans-serif;
}

.warning-default > b::before {
  content: "⚠";
}

.safe-default p {
  font-size: 12px;
}

.insider-panel {
  display: grid;
  grid-template-columns: minmax(220px, .7fr) minmax(0, 1.3fr);
  gap: 18px 32px;
  align-items: start;
  margin-top: 24px;
  padding: 24px;
  border: 1px solid rgba(var(--blue-rgb), .28);
  border-radius: 12px;
  background: rgba(var(--blue-rgb), .065);
}

.insider-panel .tool-links {
  grid-column: 2;
  margin-top: 0;
}

.topology-flow {
  display: grid;
  grid-template-columns: minmax(170px, 1fr) 92px repeat(3, minmax(170px, 1fr));
  align-items: stretch;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.topology-flow article {
  min-width: 0;
  padding: 19px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .04);
}

.topology-flow article > b,
.topology-flow article > strong,
.topology-flow article > span {
  display: block;
}

.topology-flow article > b {
  margin-bottom: 14px;
  color: var(--good);
  font: 10px var(--mono);
  text-transform: uppercase;
}

.topology-flow article > strong {
  margin-bottom: 7px;
  font-size: 16px;
  line-height: 1.15;
}

.topology-flow article > span {
  color: var(--muted);
  font-size: 12px;
}

.topology-link {
  display: grid;
  place-content: center;
  gap: 4px;
  min-width: 0;
  padding: 12px 5px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  color: var(--warn);
  text-align: center;
  background: rgba(var(--warn-rgb), .05);
}

.topology-link span {
  font: 10px var(--mono);
  text-transform: uppercase;
}

.topology-link small {
  color: var(--dim);
  font: 9px var(--mono);
}

.topology-note {
  padding: 19px 0 0;
}

.topology-note strong {
  color: var(--text);
}

.privacy-evidence {
  margin-bottom: 18px;
}

.privacy-evidence article {
  display: flex;
  flex-direction: column;
}

.privacy-evidence article p {
  flex: 1;
}

.privacy-evidence article .more {
  margin-top: auto;
  padding-top: 15px;
}

.hybrid-flow {
  margin-top: 0;
}

.privacy-boundary,
.privacy-workbench,
.privacy-router,
.grok-check,
.portability-panel,
.privacy-downloads {
  margin-top: 18px;
}

.privacy-workbench {
  align-items: start;
}

.privacy-workbench p,
.portability-panel p,
.privacy-downloads p {
  color: var(--muted);
}

.privacy-config {
  margin-top: 18px;
}

.privacy-workbench code,
.privacy-router code {
  color: var(--code-text);
  font-family: var(--mono);
}

.privacy-router .route-red {
  background: rgba(var(--bad-rgb), .065);
}

.privacy-router .route-amber {
  background: rgba(var(--warn-rgb), .055);
}

.privacy-router .route-green {
  background: rgba(var(--good-rgb), .045);
}

.privacy-router .route-red .path-badge {
  color: var(--bad);
}

.privacy-router .route-amber .path-badge {
  color: var(--warn);
}

.privacy-router .route-red .path-badge::before {
  content: "■ ";
}

.privacy-router .route-amber .path-badge::before {
  content: "▲ ";
}

.privacy-router .route-green .path-badge::before {
  content: "● ";
}

.grok-check {
  grid-template-columns: 210px minmax(0, 1fr);
}

.portability-panel {
  align-items: start;
}

.portability-panel .more {
  color: var(--blue);
}

.privacy-downloads {
  align-items: end;
}

.spark-runbook {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.spark-runbook > article {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 12px;
  min-width: 0;
  padding: 22px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .035);
}

.spark-runbook h3 {
  margin: 0 0 7px;
  font-size: 19px;
}

.spark-runbook p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.spark-runbook pre {
  margin-top: 14px;
}

.spark-runbook .code-note {
  margin-top: 10px;
  color: var(--dim);
  font-size: 11px;
}

.source-bar {
  padding: 18px;
  border-top: 1px solid var(--line);
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  border-left: 1px solid var(--line);
  color: var(--muted);
  background: rgba(var(--surface-rgb), .03);
}

.source-bar p {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
}

.source-bar strong {
  color: var(--text);
}

.source-bar p > strong:first-child {
  display: inline;
  margin: 0;
  font: 750 9px/1.25 var(--mono);
  letter-spacing: .06em;
  text-transform: uppercase;
}

.source-bar a {
  color: var(--blue);
}

.fallback-panel {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(250px, .75fr);
  gap: 30px;
  align-items: end;
}

.fallback-panel h2 {
  font-size: clamp(31px, 4.5vw, 52px);
}

.fallback-panel p {
  margin-bottom: 0;
  color: var(--muted);
}

.footer-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(260px, .8fr);
  gap: 28px;
  align-items: end;
}

.footer-grid p {
  margin: 0;
}

.page-menu {
  position: fixed;
  right: 20px;
  bottom: 20px;
  display: flex;
  gap: 8px;
  align-items: stretch;
  width: min(436px, calc(100vw - 40px));
  z-index: 65;
}

.page-menu-disclosure {
  position: relative;
  flex: 1 1 auto;
  min-width: 0;
}

.page-menu-disclosure > summary {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) 24px;
  gap: 10px;
  align-items: center;
  width: 100%;
  padding: 12px 13px;
  border: 1px solid rgba(var(--good-rgb), .35);
  border-radius: 14px;
  color: var(--text);
  background: rgba(var(--solid-panel-rgb), .96);
  box-shadow: 0 16px 48px rgba(0, 0, 0, .44);
  list-style: none;
  cursor: pointer;
  backdrop-filter: blur(18px);
}

.page-menu-disclosure > summary::-webkit-details-marker {
  display: none;
}

.page-menu-disclosure > summary > span {
  color: var(--good);
  font: 750 10px var(--mono);
  text-transform: uppercase;
}

.page-menu-disclosure > summary > small {
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.page-menu-disclosure > summary::after {
  content: "+";
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--good);
  font: 16px/1 var(--sans);
}

.page-menu-disclosure[open] > summary::after {
  content: "−";
}

.page-menu-top {
  display: grid;
  flex: 0 0 48px;
  place-items: center;
  width: 48px;
  min-height: 46px;
  padding: 0;
  border: 1px solid rgba(var(--good-rgb), .35);
  border-radius: 14px;
  color: var(--good);
  background: rgba(var(--solid-panel-rgb), .96);
  box-shadow: 0 16px 48px rgba(0, 0, 0, .44);
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
  backdrop-filter: blur(18px);
}

.page-menu-top::before {
  content: "";
  width: 22px;
  height: 22px;
  background: url("../images/lucide-0.468.0-arrow-up-good.svg?v=1") center / contain no-repeat;
}

.page-menu-top:hover {
  border-color: rgba(var(--good-rgb), .7);
  background: rgba(var(--good-rgb), .12);
}

.page-menu-panel {
  position: absolute;
  right: 0;
  bottom: calc(100% + 9px);
  display: grid;
  gap: 2px;
  align-items: stretch;
  width: 100%;
  max-height: min(560px, calc(100vh - 110px));
  padding: 8px;
  overflow-y: auto;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--solid-panel);
  box-shadow: var(--shadow);
}

.page-menu-panel a {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  padding: 10px;
  border: 1px solid transparent;
  border-radius: 9px;
  text-decoration: none;
}

.page-menu-panel a:hover,
.page-menu-panel a.active {
  border-color: var(--line);
  background: rgba(var(--surface-rgb), .055);
}

.page-menu-panel a > span {
  padding-top: 2px;
  color: var(--good);
  font: 10px var(--mono);
}

.page-menu-panel a > strong {
  font-size: 12px;
  line-height: 1.35;
}

.page-menu-panel a[data-depth="1"] {
  margin-left: 16px;
  padding-left: 8px;
  border-left-color: rgba(var(--good-rgb), .22);
  border-radius: 0 9px 9px 0;
}

.page-menu-panel a[data-depth="1"] > span {
  color: var(--blue);
}

.page-menu-panel a[data-depth="1"] > strong {
  font-size: 11px;
}

.page-menu-panel a[data-depth="2"] {
  margin-left: 32px;
  padding-left: 8px;
  border-left-color: rgba(var(--purple-rgb), .22);
  border-radius: 0 9px 9px 0;
}

.page-menu-panel a[data-depth="2"] > span {
  color: var(--purple);
}

.page-menu-panel a[data-depth="2"] > strong {
  font-size: 11px;
}

.page-menu-panel a[hidden] {
  display: none;
}

.page-menu-kind {
  grid-column: 2;
  color: var(--dim);
  font: 8px var(--mono);
  letter-spacing: .025em;
  text-transform: uppercase;
}

.page-menu-kind::before {
  content: "+ ";
  color: var(--good);
}

/* Local model field guide */
.local-model-hero h1 {
  max-width: 12ch;
}

.model-role-section {
  padding-top: 70px;
}

.role-selector {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(var(--surface-rgb), .03);
}

.role-selector button {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 2px 10px;
  min-height: 90px;
  padding: 15px;
  border: 1px solid transparent;
  border-radius: 12px;
  color: var(--muted);
  background: transparent;
  text-align: left;
  cursor: pointer;
  transition: color .2s ease, border-color .2s ease, background .2s ease, transform .2s ease;
}

.role-selector button:hover {
  color: var(--text);
  border-color: var(--line);
  transform: translateY(-1px);
}

.role-selector button.active {
  color: var(--text);
  border-color: rgba(var(--good-rgb), .38);
  background: linear-gradient(145deg, rgba(var(--good-rgb), .13), rgba(var(--blue-rgb), .045));
}

.role-selector button > span {
  grid-row: 1 / 3;
  color: var(--good);
  font: 10px var(--mono);
}

.role-selector button strong {
  font-size: 15px;
  line-height: 1.15;
}

.role-selector button small {
  color: var(--dim);
  font-size: 10px;
}

.role-panels {
  margin-top: 10px;
}

.role-panel {
  display: grid;
  grid-template-columns: minmax(210px, .72fr) repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .025);
}

.role-panel[hidden] {
  display: none;
}

.role-panel > div {
  min-width: 0;
  padding: 22px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.role-panel h3 {
  margin: 0 0 7px;
  font-size: 18px;
  letter-spacing: -.025em;
}

.role-panel p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.role-verdict {
  display: grid;
  align-content: center;
  gap: 6px;
  background: linear-gradient(145deg, rgba(var(--good-rgb), .09), rgba(var(--blue-rgb), .035));
}

.role-verdict span,
.role-verdict small {
  color: var(--dim);
  font: 9px/1.45 var(--mono);
  text-transform: uppercase;
}

.role-verdict strong {
  color: var(--good);
  font: 19px/1.15 var(--mono);
  letter-spacing: -.04em;
}

.capability-ladder {
  margin-top: 28px;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.capability-head,
.capability-ladder article {
  display: grid;
  grid-template-columns: 140px minmax(0, 1fr) minmax(0, 1fr);
}

.capability-head span {
  padding: 10px 16px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  color: var(--dim);
  background: rgba(var(--surface-rgb), .04);
  font: 9px var(--mono);
  letter-spacing: .03em;
  text-transform: uppercase;
}

.capability-ladder article > * {
  min-width: 0;
  margin: 0;
  padding: 15px 16px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.capability-ladder article strong {
  color: var(--text);
  font: 17px var(--mono);
}

.capability-ladder article p {
  color: var(--muted);
  font-size: 12px;
}

.capability-ladder article.recommended {
  background: rgba(var(--good-rgb), .045);
}

.capability-ladder article.recommended strong {
  color: var(--good);
}

.quant-guide {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 28px;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.quant-guide article {
  padding: 19px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .022);
}

.quant-guide article.recommended {
  background: linear-gradient(145deg, rgba(var(--good-rgb), .085), rgba(var(--blue-rgb), .03));
}

.quant-guide span {
  color: var(--good);
  font: 9px var(--mono);
  text-transform: uppercase;
}

.quant-guide h3 {
  margin: 8px 0 6px;
  font-size: 17px;
}

.quant-guide p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.model-memory-section {
  padding-top: 34px;
}

.source-with-links {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  margin-top: 18px;
}

.source-with-links .tool-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  margin-top: 0;
  padding-top: 11px;
  border-top: 1px solid var(--line);
}

.source-with-links .tool-links > a {
  color: var(--good);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;
  text-decoration: none;
  text-wrap: balance;
}

.source-with-links .tool-links > a:hover {
  text-decoration: underline;
}

.source-with-links .more {
  margin-top: 0;
  font-size: 12px;
}

.model-context-section {
  background: var(--section-wash);
}

.context-definitions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.context-definitions article {
  padding: 20px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .025);
}

.context-definitions article.recommended {
  background: linear-gradient(145deg, rgba(var(--good-rgb), .08), rgba(var(--blue-rgb), .03));
}

.context-definitions article > span {
  color: var(--good);
  font: 10px var(--mono);
}

.context-definitions h3 {
  margin: 8px 0 3px;
  font-size: 20px;
}

.context-definitions strong {
  display: block;
  margin-bottom: 8px;
  color: var(--text);
  font-size: 12px;
}

.context-definitions p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.context-planner {
  display: grid;
  grid-template-columns: minmax(320px, .82fr) minmax(0, 1.18fr);
  gap: 0;
  margin-top: 24px;
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
  background: rgba(var(--surface-rgb), .025);
}

.context-mode-switch {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 24px;
  padding: 8px;
  border: 1px solid var(--line);
  border-bottom: 0;
  border-radius: 18px 18px 0 0;
  background: rgba(var(--surface-rgb), .03);
}

.context-mode-switch button {
  display: grid;
  gap: 3px;
  min-height: 66px;
  padding: 13px 16px;
  border: 1px solid transparent;
  border-radius: 11px;
  color: var(--muted);
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.context-mode-switch button.active {
  border-color: rgba(var(--good-rgb), .35);
  color: var(--text);
  background: rgba(var(--good-rgb), .09);
}

.context-mode-switch button strong {
  font-size: 14px;
}

.context-mode-switch button span {
  color: var(--dim);
  font-size: 10px;
}

.context-mode-switch + .context-planner {
  margin-top: 0;
  border-radius: 0 0 18px 18px;
}

.context-controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  padding: 22px;
  border-right: 1px solid var(--line);
}

.context-controls label:nth-child(2),
.context-controls label:last-child {
  grid-column: 1 / -1;
}

.context-workload-fields {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  min-width: 0;
  margin: 0;
  padding: 16px 0 2px;
  border: 0;
  border-top: 1px solid var(--line);
}

.context-workload-fields[hidden] {
  display: none;
}

.context-workload-fields legend {
  padding: 0 8px 0 0;
  color: var(--good);
  font: 9px var(--mono);
  letter-spacing: .03em;
  text-transform: uppercase;
}

.context-presets {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

.context-presets button {
  min-height: 38px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--dim);
  background: rgba(var(--surface-rgb), .025);
  font: 9px var(--mono);
  cursor: pointer;
}

.context-presets button.active,
.context-presets button:hover {
  border-color: rgba(var(--blue-rgb), .38);
  color: var(--text);
  background: rgba(var(--blue-rgb), .08);
}

.context-controls label {
  align-content: start;
  color: var(--dim);
  font: 10px var(--mono);
  text-transform: uppercase;
}

.context-controls select,
.context-controls input[type="number"] {
  width: 100%;
  min-width: 0;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 9px;
  color: var(--text);
  background: var(--solid-panel-alt);
  font: 12px var(--sans);
  text-transform: none;
}

.input-with-unit {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--solid-panel-alt);
  overflow: hidden;
}

.input-with-unit input[type="number"] {
  border: 0;
  border-radius: 0;
}

.input-with-unit b {
  padding: 0 10px;
  color: var(--dim);
  font: 9px var(--mono);
  text-transform: none;
}

.context-result {
  display: grid;
  align-content: center;
  gap: 18px;
  min-width: 0;
  padding: 28px;
  background: radial-gradient(circle at 85% 10%, rgba(var(--blue-rgb), .12), transparent 55%);
}

.context-result-head > span {
  color: var(--good);
  font: 9px var(--mono);
  text-transform: uppercase;
}

.context-result-head strong {
  display: block;
  margin-top: 7px;
  font-size: clamp(24px, 3vw, 35px);
  line-height: 1.05;
  letter-spacing: -.045em;
}

.context-result.over .context-result-head strong {
  color: var(--warn);
}

.context-result-head p {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.context-meter {
  display: flex;
  width: 100%;
  height: 22px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(var(--surface-rgb), .03);
}

.context-segment {
  display: block;
  width: var(--segment-width, 0%);
  min-width: 0;
  transition: width .25s ease;
}

.context-segment.harness,
.context-legend i.harness {
  background: var(--purple);
}

.context-segment.material,
.context-legend i.material {
  background: var(--blue);
}

.context-segment.reserve,
.context-legend i.reserve {
  background: var(--warn);
}

.context-segment.free,
.context-legend i.free {
  background: var(--good);
}

.context-result.over .context-segment.free,
.context-result.over .context-legend i.free {
  background: var(--bad);
}

.context-legend {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px 18px;
}

.context-legend span {
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr) auto;
  gap: 7px;
  align-items: center;
  color: var(--dim);
  font: 9px var(--mono);
  text-transform: uppercase;
}

.context-legend i {
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

.context-legend b {
  color: var(--text);
  font-weight: 600;
}

.context-legend em {
  color: inherit;
  font-style: normal;
}

.context-breakdown {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
  padding-top: 2px;
}

.context-breakdown span {
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--dim);
  font: 9px var(--mono);
}

.context-breakdown b {
  color: var(--text);
}

.token-reality {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 24px;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.token-reality article {
  padding: 20px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.token-reality strong,
.token-reality span {
  display: block;
}

.token-reality strong {
  font-size: 18px;
}

.token-reality span {
  margin: 3px 0 9px;
  color: var(--good);
  font: 9px var(--mono);
  text-transform: uppercase;
}

.token-reality p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.memory-selector {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(var(--surface-rgb), .035);
}

.memory-selector button {
  display: grid;
  place-items: center;
  gap: 0;
  min-height: 70px;
  border: 1px solid transparent;
  border-radius: 12px;
  color: var(--muted);
  background: transparent;
  cursor: pointer;
  transition: color .2s ease, border-color .2s ease, background .2s ease, transform .2s ease;
}

.memory-selector button:hover {
  color: var(--text);
  border-color: var(--line);
  transform: translateY(-1px);
}

.memory-selector button.active {
  color: var(--on-solid-accent);
  border-color: var(--good);
  background: var(--good);
}

.memory-selector button strong {
  font-size: 24px;
  line-height: 1;
  letter-spacing: -.04em;
}

.memory-selector button span {
  font: 9px var(--mono);
  text-transform: uppercase;
}

.memory-live {
  margin: 13px 0 20px;
  color: var(--dim);
  font: 11px/1.5 var(--mono);
}

.memory-picks-head {
  display: grid;
  grid-template-columns: minmax(280px, .8fr) minmax(0, 1.2fr);
  gap: 26px;
  align-items: end;
  margin: 24px 0 14px;
}

.memory-picks-head h3 {
  margin: 8px 0 0;
  font-size: clamp(24px, 3vw, 34px);
  letter-spacing: -.04em;
}

.memory-picks-head p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.memory-picks {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.memory-picks article {
  display: flex;
  min-height: 245px;
  padding: 19px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  flex-direction: column;
  background: rgba(var(--surface-rgb), .025);
}

.memory-picks article.stretch {
  background: rgba(var(--warn-rgb), .035);
}

.memory-picks article > span {
  color: var(--good);
  font: 9px var(--mono);
  text-transform: uppercase;
}

.memory-picks article.stretch > span {
  color: var(--warn);
}

.memory-picks h3 {
  margin: 10px 0 5px;
  font-size: 20px;
}

.memory-picks strong {
  color: var(--blue);
  font: 10px/1.45 var(--mono);
}

.memory-picks p {
  margin: 12px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.memory-picks .more {
  margin-top: auto;
  padding-top: 18px;
  color: var(--good);
  font-size: 11px;
}

.memory-frontier {
  margin: 0 0 20px;
  padding: 13px 15px;
  border-right: 1px solid rgba(var(--purple-rgb), .22);
  border-bottom: 1px solid rgba(var(--purple-rgb), .22);
  border-left: 3px solid var(--purple);
  color: var(--muted);
  background: rgba(var(--purple-rgb), .045);
  font-size: 12px;
}

.memory-frontier strong {
  color: var(--text);
}

.memory-routes {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.memory-route {
  min-height: 268px;
  padding: 22px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .025);
}

.memory-route.active {
  background: linear-gradient(150deg, rgba(var(--good-rgb), .105), rgba(var(--blue-rgb), .035));
}

.memory-route[hidden] {
  display: none;
}

.memory-routes:has(.memory-route[hidden]) {
  grid-template-columns: 1fr;
}

.memory-routes:has(.memory-route[hidden]) .memory-route {
  min-height: 0;
}

.memory-route-number,
.memory-rule-grid article > span {
  color: var(--good);
  font: 11px var(--mono);
  text-transform: uppercase;
}

.memory-route h3 {
  margin: 10px 0 8px;
  font-size: 21px;
}

.memory-route p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.memory-route p + p {
  margin-top: 12px;
}

.memory-route strong {
  color: var(--text);
}

.memory-rule-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 20px;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.memory-rule-grid article {
  padding: 18px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.memory-rule-grid h3 {
  margin: 7px 0 4px;
  font-size: 15px;
}

.memory-rule-grid p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.catalog-key {
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
  margin-bottom: 16px;
  color: var(--dim);
  font: 10px var(--mono);
  text-transform: uppercase;
}

.catalog-key span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.catalog-key .key-symbol {
  display: inline-grid;
  place-items: center;
  min-width: 20px;
  height: 20px;
  padding: 0 4px;
  border: 1px solid currentColor;
  border-radius: 5px;
  font-size: 12px;
  line-height: 1;
}

.key-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--good);
}

.key-dot.warn {
  background: var(--warn);
}

.key-dot.server {
  background: var(--purple);
}

.model-family-list {
  border-top: 1px solid var(--line);
}

.model-family {
  border-bottom: 1px solid var(--line);
  scroll-margin-top: 110px;
}

.model-family[hidden] {
  display: none;
}

.model-family.model-match > summary {
  background: rgba(var(--good-rgb), .035);
}

.model-family > summary {
  display: grid;
  grid-template-columns: 48px minmax(210px, .72fr) minmax(380px, 1.28fr) 34px;
  gap: 16px;
  align-items: center;
  padding: 22px 4px;
  list-style: none;
  cursor: pointer;
  transition: background .2s ease;
}

.model-family > summary::-webkit-details-marker {
  display: none;
}

.model-family > summary::after {
  content: "+";
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--good);
  font: 500 22px/1 var(--sans);
}

.model-family[open] > summary::after {
  content: "−";
}

.model-family > summary:hover,
.model-family[open] > summary {
  background: rgba(var(--surface-rgb), .035);
}

.model-number {
  color: var(--good);
  font: 12px var(--mono);
}

.model-summary {
  display: grid;
  gap: 4px;
}

.model-name {
  color: var(--text);
  font-size: clamp(22px, 2.6vw, 32px);
  font-weight: 850;
  line-height: 1;
  letter-spacing: -.045em;
}

.model-summary > span:last-child {
  color: var(--muted);
  font-size: 12px;
}

.model-fit-list {
  display: flex;
  justify-content: flex-end;
  gap: 6px;
  flex-wrap: wrap;
}

.model-fit {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 8px;
  border: 1px solid rgba(var(--good-rgb), .28);
  border-radius: 999px;
  color: var(--good);
  background: rgba(var(--good-rgb), .055);
  font: 10px var(--mono);
  white-space: nowrap;
}

.model-fit::before {
  content: "✓";
  font-weight: 900;
}

.model-fit.tight {
  border-color: rgba(var(--warn-rgb), .3);
  color: var(--warn);
  background: rgba(var(--warn-rgb), .055);
}

.model-fit.tight::before {
  content: "△";
}

.model-fit.server {
  border-color: rgba(var(--purple-rgb), .3);
  color: var(--purple);
  background: rgba(var(--purple-rgb), .055);
}

.model-fit.server::before {
  content: "▣";
}

.model-tooltip {
  position: absolute;
  right: 0;
  bottom: calc(100% + 9px);
  z-index: 10;
  display: none;
  width: max-content;
  max-width: min(280px, calc(100vw - 32px));
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  color: var(--text);
  background: var(--control-bg);
  box-shadow: 0 12px 36px rgba(0, 0, 0, .45);
  font: 10px/1.4 var(--mono);
  white-space: normal;
}

.model-fit:hover .model-tooltip,
.model-fit:focus .model-tooltip,
.model-fit:focus-within .model-tooltip {
  display: block;
}

.model-body {
  display: grid;
  gap: 24px;
  padding: 26px 4px 42px 64px;
}

.model-intro {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr);
  gap: 28px;
}

.model-intro h3 {
  margin: 8px 0 9px;
  font-size: clamp(24px, 3vw, 36px);
  line-height: 1.02;
  letter-spacing: -.045em;
}

.model-intro p {
  margin: 0;
  color: var(--muted);
}

.model-sizes {
  display: flex;
  align-content: flex-start;
  gap: 6px;
  flex-wrap: wrap;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(var(--surface-rgb), .035);
}

.model-sizes strong,
.model-sizes small {
  width: 100%;
}

.model-sizes strong {
  margin-bottom: 5px;
  font-size: 13px;
}

.model-sizes span {
  padding: 4px 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font: 9px var(--mono);
}

.model-sizes small {
  margin-top: 7px;
  color: var(--dim);
  font-size: 10px;
}

.model-sizes.compact {
  margin: 16px 0 0;
  padding: 13px;
}

.model-benchmark {
  padding: 18px;
  border: 1px solid var(--line);
  background: var(--inset-surface);
}

.benchmark-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.benchmark-head strong {
  font-size: 14px;
}

.benchmark-head span {
  color: var(--dim);
  font: 10px var(--mono);
}

.benchmark-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.benchmark-grid > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 5px 10px;
  align-items: end;
  padding: 11px;
  border: 1px solid rgba(var(--surface-rgb), .08);
  border-radius: 8px;
  background: rgba(var(--surface-rgb), .025);
}

.benchmark-grid span {
  color: var(--muted);
  font-size: 10px;
}

.benchmark-grid b {
  color: var(--text);
  font: 14px var(--mono);
}

.benchmark-grid i {
  grid-column: 1 / -1;
  display: block;
  width: var(--score, 0%);
  height: 4px;
  border-radius: 99px;
  background: linear-gradient(90deg, var(--good), var(--blue));
}

.benchmark-grid small {
  grid-column: 1 / -1;
  color: var(--dim);
  font: 9px var(--mono);
}

.model-links-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}

.model-links-grid .tool-links {
  margin-top: 0;
}

.model-links-grid a,
.runtime-grid a,
.spark-source a {
  color: var(--blue);
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
}

.model-links-grid a:hover,
.runtime-grid a:hover,
.spark-source a:hover {
  text-decoration: underline;
}

.model-alternatives {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.model-alternatives .card {
  display: flex;
  flex-direction: column;
}

.model-alternatives .tool-links {
  margin-top: auto;
  padding-top: 18px;
}

.benchmark-notes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.benchmark-notes article {
  padding: 22px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.benchmark-notes span,
.runtime-grid article > span,
.scale-flow article > span {
  color: var(--good);
  font: 10px var(--mono);
  text-transform: uppercase;
}

.benchmark-notes h3 {
  margin: 9px 0 6px;
  font-size: 19px;
}

.benchmark-notes p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.estonian-panel {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr);
  gap: 28px;
  align-items: center;
  margin-top: 20px;
  padding: 26px;
  border: 1px solid rgba(var(--good-rgb), .24);
  background: linear-gradient(135deg, rgba(var(--good-rgb), .07), rgba(var(--blue-rgb), .035));
}

.estonian-panel h3 {
  margin: 9px 0 7px;
  font-size: 28px;
  letter-spacing: -.04em;
}

.estonian-panel p {
  margin: 0;
  color: var(--muted);
}

.estonian-scores {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.estonian-scores div {
  display: grid;
  gap: 3px;
  padding: 15px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.estonian-scores b {
  color: var(--good);
  font: 20px var(--mono);
}

.estonian-scores span {
  color: var(--dim);
  font-size: 10px;
}

.runtime-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.runtime-grid article {
  padding: 22px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.runtime-grid article:first-child {
  background: rgba(var(--good-rgb), .045);
}

.runtime-grid h3 {
  margin: 9px 0 6px;
  font-size: 21px;
}

.runtime-grid p {
  margin: 0 0 15px;
  color: var(--muted);
  font-size: 13px;
}

.layer-map {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 32px minmax(0, 1fr) 32px minmax(0, 1fr);
  align-items: stretch;
  margin-bottom: 18px;
}

.layer-map article {
  display: grid;
  align-content: start;
  gap: 7px;
  min-height: 140px;
  padding: 19px;
  border: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .025);
}

.layer-map article:nth-of-type(2) {
  background: rgba(var(--blue-rgb), .045);
}

.layer-map article:nth-of-type(3) {
  background: rgba(var(--purple-rgb), .045);
}

.layer-map article span {
  color: var(--good);
  font: 9px var(--mono);
  text-transform: uppercase;
}

.layer-map article strong {
  font-size: 16px;
}

.local-models-page :is(
  .memory-picks h3,
  .model-alternatives h3,
  .runtime-grid h3,
  .layer-map strong
).brand-heading {
  align-items: center;
}

.local-models-page :is(
  .memory-picks h3,
  .model-alternatives h3,
  .runtime-grid h3,
  .layer-map strong
).brand-heading > .brand-marks {
  align-self: center;
}

.layer-map article p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.layer-map > i {
  display: grid;
  place-items: center;
  color: var(--good);
  font-style: normal;
}

.harness-grid article:nth-child(3),
.harness-grid article:nth-child(4) {
  background: rgba(var(--purple-rgb), .035);
}

.scale-flow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 28px minmax(0, 1fr) 28px minmax(0, 1fr) 28px minmax(0, 1fr);
  align-items: stretch;
}

.scale-flow article {
  display: grid;
  align-content: start;
  gap: 7px;
  min-height: 210px;
  padding: 22px;
  border: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .03);
}

.scale-flow article:nth-of-type(2),
.scale-flow article:nth-of-type(3) {
  background: rgba(var(--blue-rgb), .045);
}

.scale-flow > i {
  display: grid;
  place-items: center;
  color: var(--good);
  font-style: normal;
}

.scale-flow strong {
  font-size: 18px;
  line-height: 1.15;
}

.scale-flow p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.spark-source {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(260px, .7fr);
  gap: 26px;
  margin-top: 18px;
  padding: 21px;
  border-left: 3px solid var(--blue);
  background: rgba(var(--blue-rgb), .055);
}

.spark-source p {
  margin: 0;
  color: var(--muted);
}

.spark-source strong {
  color: var(--text);
}

.spark-source .tool-links {
  margin-top: 0;
}

.method-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.method-grid article {
  padding: 20px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.method-grid h3 {
  margin: 0 0 6px;
  font-size: 17px;
}

.method-grid p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.local-models-page .source-bar {
  margin-top: 20px;
}

@media (min-width: 901px) {
  .filter-toolbar {
    position: sticky;
    top: 85px;
    z-index: 15;
    background: rgba(var(--solid-panel-rgb), .94);
    backdrop-filter: blur(18px);
  }
}

@media (max-width: 1040px) {
  body {
    padding-top: 55px;
  }

  body > header {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    padding: 10px 0;
    z-index: 80;
  }

  nav {
    gap: 12px;
  }

  .brand {
    gap: 9px;
    font-size: 18px;
  }

  .mark {
    width: 34px;
    height: 34px;
    flex-basis: 34px;
  }
}

@media (max-width: 900px) {
  .infrastructure-feature {
    grid-template-columns: 1fr;
  }

  .infrastructure-visual {
    min-height: 350px;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .hero,
  .split,
  .calculator,
  .comparison {
    grid-template-columns: 1fr;
  }

  .memory-routes,
  .memory-rule-grid,
  .runtime-grid,
  .method-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .role-selector,
  .quant-guide {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tool-filter-options {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .role-panel {
    grid-template-columns: minmax(210px, .7fr) minmax(0, 1.3fr);
  }

  .role-panel > div:last-child {
    grid-column: 1 / -1;
  }

  .context-planner {
    grid-template-columns: 1fr;
  }

  .context-controls {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .model-family > summary {
    grid-template-columns: 42px minmax(0, 1fr) 32px;
  }

  .model-fit-list {
    grid-column: 2;
    justify-content: flex-start;
  }

  .model-family > summary::after {
    grid-column: 3;
    grid-row: 1 / 3;
  }

  .model-body {
    padding-left: 46px;
  }

  .model-intro,
  .estonian-panel,
  .spark-source,
  .source-with-links,
  .memory-picks-head {
    grid-template-columns: 1fr;
  }

  .layer-map {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .layer-map > i {
    display: none;
  }

  .scale-flow {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .scale-flow > i {
    display: none;
  }

  .cards,
  .cards.three,
  .path {
    grid-template-columns: 1fr;
  }

  .catalog-divider {
    grid-template-columns: 1fr;
  }

  .provider-divider {
    display: block;
  }

  .provider-divider p {
    margin-top: 8px;
    text-align: left;
  }

  .path .card::after {
    display: none;
  }
}

@media (max-width: 1040px) {
  .links {
    display: none;
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    left: 0;
    max-height: calc(100vh - 70px);
    max-height: calc(100dvh - 70px);
    padding: 14px;
    background: var(--solid-panel);
    border: 1px solid var(--line);
    border-radius: 18px;
    box-shadow: var(--shadow);
    overflow-y: auto;
    overscroll-behavior: contain;
    touch-action: pan-y;
    z-index: 80;
  }

  .links.open {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: start;
    gap: 10px;
  }

  .links > a,
  .nav-more > summary,
  .links > .install-app-cta {
    width: 100%;
  }

  .links > a,
  .nav-more > summary,
  .links > .install-app-cta {
    display: grid;
    place-items: center;
    align-content: center;
    gap: 9px;
    min-width: 0;
    min-height: 0;
    aspect-ratio: 1;
    padding: 10px 7px;
    border: 1px solid rgba(var(--surface-rgb), .1);
    border-radius: 20px;
    background:
      radial-gradient(circle at 50% 42%, rgba(var(--surface-rgb), .09), transparent 55%),
      rgba(var(--surface-rgb), .035);
    font-size: 11px;
    font-weight: 760;
    line-height: 1.2;
    text-align: center;
  }

  .links > a::before,
  .nav-more > summary::before,
  .links > .install-app-cta::before {
    width: 30px;
    height: 30px;
    color: var(--good);
  }

  .links > a[href="benchmarks.html"]::before,
  .links > a[href="evidence.html"]::before {
    color: var(--blue);
  }

  .links > a[href="use-cases.html"]::before,
  .links > a[href="adoption.html"]::before {
    color: var(--purple);
  }

  .links > a[href="investors.html"]::before {
    color: var(--warn);
  }

  .links > a.coffee::before {
    color: var(--good);
  }

  .nav-more {
    width: 100%;
  }

  .nav-more[open] {
    grid-column: 1 / -1;
  }

  .nav-more > summary {
    position: relative;
  }

  .nav-more > summary span {
    position: absolute;
    right: 11px;
    bottom: 9px;
    width: 22px;
    height: 22px;
    flex-basis: 22px;
  }

  .nav-more[open] > summary {
    grid-template-columns: 32px minmax(0, 1fr) 20px;
    justify-items: start;
    min-height: 64px;
    aspect-ratio: auto;
    padding: 10px 12px;
    text-align: left;
  }

  .nav-more[open] > summary::before {
    align-self: center;
  }

  .nav-more[open] > summary span {
    position: static;
    justify-self: end;
    align-self: center;
  }

  .nav-panel {
    position: static;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
    max-height: none;
    margin-top: 10px;
    padding: 10px;
    border-radius: 18px;
    box-shadow: none;
    overflow-y: visible;
  }

  .nav-panel a {
    min-height: 0;
    padding: 11px 7px 9px;
    border-radius: 17px;
  }

  .nav-panel a::before {
    width: 28px;
    height: 28px;
  }

  .nav-panel a strong {
    font-size: 10px;
  }

  .nav-panel a small {
    inset: 5px;
    padding: 6px;
    border-radius: 12px;
    font-size: 9px;
    line-height: 1.25;
  }

  .menu-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 36px;
    padding: 7px 11px;
    border-color: var(--line);
    color: var(--text);
    background: rgba(var(--surface-rgb), .055);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .08);
    font-weight: 760;
    position: relative;
    z-index: 81;
  }

  .menu-btn::before {
    content: "";
    display: block;
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    /* WebKit beta can leak an external SVG mask's rectangular texture when
       this pseudo-element is composited inside the sticky glass header. */
    background: url("../images/lucide-0.468.0-menu-text.svg?v=1") center / contain no-repeat;
    -webkit-mask: none;
    mask: none;
  }

  .menu-btn:hover,
  .menu-btn[aria-expanded="true"] {
    border-color: rgba(var(--good-rgb), .55);
    background: rgba(var(--good-rgb), .09);
  }

  .menu-btn[aria-expanded="true"]::before {
    background-image: url("../images/lucide-0.468.0-x-text.svg?v=1");
  }
}

@media (max-width: 900px) {
  .section-head {
    display: block;
  }

  .section-kicker {
    margin-top: 10px;
  }

  .filter-toolbar {
    display: grid;
  }

  .closing-cta {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .closing-actions {
    max-width: 440px;
    justify-self: start;
  }

  .guide-controls {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .guide-reset {
    width: 100%;
  }

  .guide-recipe > summary {
    grid-template-columns: 44px minmax(0, 1fr) 34px;
  }

  .guide-recipe > summary .guide-meta {
    grid-column: 2 / 3;
    justify-content: flex-start;
  }

  .guide-recipe > summary::after {
    grid-column: 3;
    grid-row: 1 / 3;
  }

  .recipe-body {
    grid-template-columns: 1fr;
    padding-left: 62px;
  }

  .recipe-aside {
    padding-top: 22px;
    padding-left: 0;
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .authority-ladder {
    grid-template-columns: 1fr;
  }

  .authority-ladder > div + div {
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .claim-audit,
  .verdict-grid,
  .evidence-scope,
  .hardware-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .decision-strip,
  .compute-ladder,
  .spark-runbook {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .operator-grid,
  .remote-methods {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .training-panel,
  .insider-panel,
  .fallback-panel {
    grid-template-columns: 1fr;
  }

  .insider-panel .tool-links {
    grid-column: auto;
    margin-top: 0;
  }

  .topology-flow {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .topology-link {
    min-height: 110px;
  }

  .thesis-panel,
  .footer-grid {
    grid-template-columns: 1fr;
  }

  .architecture-flow {
    grid-template-columns: repeat(3, 1fr);
  }

  .industry-coverage {
    grid-template-columns: 1fr;
  }

  .loop-build-grid,
  .loop-readiness {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .loop-starter {
    grid-template-columns: 1fr;
  }

  .tool-group-body {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .proof-strip {
    grid-template-columns: 1fr;
  }

  .memory-selector {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .tool-filter-options {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .benchmark-grid,
  .benchmark-notes,
  .model-alternatives,
  .context-definitions,
  .token-reality {
    grid-template-columns: 1fr;
  }

  .proof-stat {
    padding: 20px 0;
  }

  .proof-stat + .proof-stat {
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .implementation-table,
  .implementation-table tbody,
  .implementation-table tr,
  .implementation-table td {
    display: block;
    width: 100%;
  }

  .implementation-table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
  }

  .implementation-table tr {
    border-bottom: 1px solid var(--line);
  }

  .implementation-table td {
    display: grid;
    grid-template-columns: 105px 1fr;
    gap: 12px;
    border-right: 0;
  }

  .implementation-table td::before {
    content: attr(data-label);
    color: var(--dim);
    font-family: var(--mono);
    font-size: 9px;
    text-transform: uppercase;
  }

  .implementation-table td > small {
    grid-column: 2;
  }

  .tool-efficiency-section {
    padding: 54px 0;
  }

  .harness-efficiency figcaption {
    padding: 20px 20px 0;
  }

  .chart-toggle > span,
  .chart-toggle > div,
  .chart-toggle output {
    width: 100%;
  }

  .chart-toggle > div {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-radius: 13px;
  }

  .chart-toggle button {
    padding-right: 8px;
    padding-left: 8px;
  }

  .efficiency-range-control {
    margin: 20px;
  }

  .efficiency-plot {
    padding: 0 20px 20px;
  }

  .efficiency-axis {
    margin-left: 0;
  }

  .efficiency-row {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .efficiency-row + .efficiency-row {
    margin-top: 15px;
  }

  .efficiency-label {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 2px 10px;
    align-items: baseline;
  }

  .efficiency-label span {
    margin-top: 0;
  }

  .efficiency-label small {
    grid-column: 1 / -1;
  }

  .memory-plot {
    padding: 20px;
  }

  .memory-axis {
    margin-left: 0;
  }

  .memory-row {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .memory-row + .memory-row {
    margin-top: 14px;
  }

  .memory-label {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: baseline;
  }

  .memory-label span {
    margin-top: 0;
  }
}


@media (max-width: 760px) {
  .video-grid {
    grid-template-columns: 1fr;
  }

  .station-benchmark-grid,
  .station-sparse-results {
    grid-template-columns: 1fr;
  }

  .station-benchmark-chart:last-child {
    display: block;
    grid-column: auto;
  }

  .station-bench-bar {
    grid-template-columns: 112px minmax(64px, 1fr) 112px;
  }

  .system-diagram {
    grid-template-columns: 1fr;
  }

  .diagram-tier-arrow {
    min-height: 38px;
    transform: rotate(90deg);
  }

  .diagram-serving {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .wrap {
    width: min(100% - 24px, var(--max));
  }

  section {
    padding: 44px 0;
  }

  .infrastructure-bridge {
    padding: 48px 0;
  }

  .infrastructure-feature {
    border-radius: 22px;
  }

  .infrastructure-visual {
    min-height: 320px;
    padding: 22px;
  }

  .infrastructure-meta {
    display: grid;
    gap: 6px;
  }

  .infrastructure-copy {
    padding: 30px 22px 34px;
  }

  .infrastructure-copy h2 {
    margin-bottom: 20px;
  }

  .infrastructure-copy > p {
    font-size: 15px;
    line-height: 1.65;
  }

  .toolbox-section {
    padding-top: 54px;
  }

  .tool-filter-options {
    display: flex;
    flex-wrap: nowrap;
    width: calc(100% + 6px);
    margin: -3px;
    padding: 3px 3px 8px;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-color: var(--dim) transparent;
  }

  .tool-filter-options button {
    flex: 0 0 auto;
  }

  .section-head {
    margin-bottom: 18px;
  }

  .heading-line {
    display: block;
  }

  .section-share {
    margin-top: 11px;
    margin-bottom: 0;
  }

  .section-disclosure > summary {
    grid-template-columns: minmax(0, 1fr) 32px;
    padding-right: 0;
    padding-left: 0;
  }

  .section-disclosure > summary small {
    grid-column: 1;
    grid-row: 2;
  }

  .section-disclosure > summary::after {
    grid-column: 2;
    grid-row: 1 / 3;
  }

  .section-disclosure-body {
    padding-top: 18px;
  }

  .mini-grid {
    grid-template-columns: 1fr;
  }

  .axis-row {
    grid-template-columns: 1fr;
    gap: 5px;
  }

  .axis-row small {
    text-align: left;
  }

  .step {
    grid-template-columns: 40px minmax(0, 1fr);
  }

  .hero {
    padding-top: 48px;
  }

  .terminal {
    font-size: 11px;
  }

  section[id] {
    scroll-margin-top: 16px;
  }

  .guide-recipe {
    scroll-margin-top: 16px;
  }

  .model-family {
    scroll-margin-top: 16px;
  }

  .memory-selector {
    padding: 6px;
  }

  .role-selector {
    gap: 5px;
    padding: 6px;
  }

  .role-selector button {
    grid-template-columns: 1fr;
    min-height: 102px;
    padding: 12px;
  }

  .role-selector button > span {
    grid-row: auto;
  }

  .role-panel,
  .quant-guide {
    grid-template-columns: 1fr;
  }

  .role-panel > div:last-child {
    grid-column: auto;
  }

  .capability-head {
    display: none;
  }

  .capability-ladder article {
    grid-template-columns: 1fr;
  }

  .capability-ladder article p::before {
    display: block;
    margin-bottom: 5px;
    color: var(--dim);
    font: 8px var(--mono);
    letter-spacing: .03em;
    text-transform: uppercase;
  }

  .capability-ladder article p:first-of-type::before {
    content: "Good default assignments";
  }

  .capability-ladder article p:last-of-type::before {
    content: "Expect trouble with";
  }

  .context-controls {
    grid-template-columns: 1fr;
    padding: 18px;
  }

  .context-workload-fields,
  .context-mode-switch {
    grid-template-columns: 1fr;
  }

  .context-presets {
    grid-template-columns: 1fr;
  }

  .context-controls label:nth-child(2),
  .context-controls label:last-child {
    grid-column: auto;
  }

  .context-result {
    padding: 20px 18px;
  }

  .context-legend {
    grid-template-columns: 1fr;
  }

  .memory-selector button {
    min-height: 58px;
  }

  .memory-routes,
  .memory-rule-grid,
  .runtime-grid,
  .method-grid,
  .scale-flow,
  .estonian-scores,
  .model-links-grid {
    grid-template-columns: 1fr;
  }

  .memory-route {
    min-height: 0;
    padding: 18px;
  }

  .model-family > summary {
    grid-template-columns: 28px minmax(0, 1fr) 30px;
    gap: 9px;
    padding-right: 0;
    padding-left: 0;
  }

  .model-name {
    font-size: 23px;
  }

  .model-summary > span:last-child {
    font-size: 11px;
  }

  .model-fit-list {
    gap: 4px;
  }

  .model-fit {
    padding: 4px 6px;
    font-size: 9px;
  }

  .model-tooltip {
    position: fixed;
    right: 12px;
    bottom: 12px;
    left: 12px;
    width: auto;
    max-width: none;
  }

  .model-body {
    gap: 18px;
    padding: 22px 0 32px;
  }

  .model-intro {
    gap: 18px;
  }

  .benchmark-head {
    display: grid;
  }

  .estonian-panel {
    padding: 19px;
  }

  .guide-controls {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 14px 0;
    background: transparent;
  }

  .guide-controls select {
    padding-right: 27px;
    padding-left: 9px;
    background-position:
      calc(100% - 13px) 17px,
      calc(100% - 8px) 17px;
    font-size: 12px;
  }

  .guide-reset {
    grid-column: 1 / -1;
  }

  .guide-recipe > summary {
    grid-template-columns: 30px minmax(0, 1fr) 32px;
    gap: 10px;
    padding: 20px 0;
  }

  .recipe-description {
    font-size: 13px;
  }

  .guide-meta {
    gap: 4px;
  }

  .guide-meta span {
    font-size: 9px;
  }

  .recipe-body {
    gap: 22px;
    padding: 22px 0 32px;
  }

  .oss-stack {
    grid-template-columns: 1fr;
  }

  .recipe-steps li {
    grid-template-columns: 32px 1fr;
  }

  .authority-panel {
    padding: 20px;
  }

  .claim-audit,
  .verdict-grid,
  .evidence-scope,
  .hardware-grid,
  .architecture-flow,
  .architecture-cards,
  .result-metrics,
  .search-control {
    grid-template-columns: 1fr;
  }

  .loop-decision,
  .loop-build-grid,
  .loop-readiness,
  .loop-starter {
    grid-template-columns: 1fr;
  }

  .industry-groups {
    grid-template-columns: 1fr;
  }

  .industry-coverage-intro,
  .industry-groups li {
    padding: 17px;
  }

  .industry-groups li {
    min-height: 0;
  }

  .loop-decision article,
  .loop-build-grid article {
    min-height: 0;
    padding: 18px;
  }

  .loop-starter {
    gap: 20px;
    padding: 18px;
  }

  .decision-strip,
  .compute-ladder,
  .role-grid,
  .spark-runbook,
  .topology-flow,
  .operator-grid,
  .remote-methods {
    grid-template-columns: 1fr;
  }

  .tool-group > summary {
    grid-template-columns: minmax(0, 1fr) auto 30px;
    gap: 8px;
    padding-right: 0;
    padding-left: 0;
  }

  .tool-group-body {
    grid-template-columns: 1fr;
  }

  .page-menu {
    right: 12px;
    bottom: 12px;
    width: auto;
  }

  .page-menu-disclosure > summary {
    grid-template-columns: auto 22px;
    width: auto;
  }

  .page-menu-disclosure > summary > small {
    display: none;
  }

  .page-menu-panel {
    right: -56px;
    width: calc(100vw - 24px);
  }

  .reality-check,
  .compact-check,
  .insider-panel,
  .hardware-warning {
    grid-template-columns: 1fr;
  }

  .hardware-warning-disclosure-summary > h3 {
    grid-template-columns: minmax(0, 1fr) 32px;
    gap: 13px;
    padding: 18px 16px;
  }

  .hardware-warning-disclosure-summary .claim-state {
    grid-column: 1 / -1;
  }

  .hardware-warning-disclosure-title {
    grid-column: 1;
  }

  .hardware-warning-disclosure-summary > h3::after {
    grid-column: 2;
    grid-row: 2;
  }

  .hardware-warning-disclosure-body {
    display: block;
    padding: 0 16px 18px;
  }

  .hardware-price {
    grid-template-columns: 1fr;
  }

  .hardware-price > span,
  .hardware-price > a {
    grid-column: auto;
  }

  .stack-coverage {
    align-items: flex-start;
  }

  .stack-coverage strong {
    width: 100%;
  }

  .setup-step {
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 8px;
  }

  .spark-runbook > article {
    grid-template-columns: 32px minmax(0, 1fr);
    padding: 18px 13px;
  }

  .topology-link {
    min-height: 78px;
  }

  .verdict-card {
    min-height: 230px;
  }

  .result-metrics p + p {
    padding-left: 0;
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .implementation-table td {
    grid-template-columns: 86px 1fr;
    padding: 13px 10px;
  }
}

/* Keep the collapsed tablet launcher as compact as the desktop Build panel. */
@media (min-width: 561px) and (max-width: 1040px) {
  .links {
    right: 0;
    left: auto;
    width: 500px;
    max-width: calc(100vw - 36px);
    height: 500px;
    max-height: calc(100vh - 70px);
    max-height: calc(100dvh - 70px);
  }

  .links > a,
  .nav-more > summary,
  .links > .install-app-cta {
    gap: 10px;
    padding: 16px 10px 14px;
    font-size: 12px;
  }

  .links > a::before,
  .nav-more > summary::before,
  .links > .install-app-cta::before {
    width: 38px;
    height: 38px;
  }

  .links .nav-more[open] {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: grid;
    grid-template-rows: 52px minmax(0, 1fr);
    gap: 8px;
    width: auto;
    height: auto;
    min-height: 0;
    padding: 14px;
    border-radius: 18px;
    background: var(--solid-panel);
  }

  .links .nav-more[open] > summary {
    min-height: 52px;
    height: 52px;
    padding: 8px 10px;
  }

  .links .nav-more[open] > summary::before {
    width: 30px;
    height: 30px;
  }

  .links .nav-more[open] .nav-panel {
    align-self: start;
    justify-self: center;
    width: 408px;
    max-width: 100%;
    margin: 0;
  }
}

@media (max-width: 360px) {
  .links > a,
  .nav-more > summary,
  .links > .install-app-cta {
    gap: 5px;
    padding: 6px;
    font-size: 10px;
  }

  .links > a::before,
  .nav-more > summary::before,
  .links > .install-app-cta::before {
    width: 24px;
    height: 24px;
  }

  .nav-panel {
    gap: 7px;
    padding: 7px;
  }

  .nav-panel a {
    gap: 5px;
    padding: 5px;
  }

  .nav-panel a::before {
    width: 22px;
    height: 22px;
  }

  .nav-panel a strong {
    font-size: 9px;
    line-height: 1.15;
  }

  .nav-panel a small {
    inset: 4px;
    padding: 5px;
    border-radius: 10px;
    font-size: 8px;
    line-height: 1.15;
  }

  .guide-controls {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  .pulse,
  .ticker-track {
    animation: none;
  }

  .btn,
  .card,
  .filter,
  .nav-more > summary span,
  .section-disclosure > summary,
  .section-share,
  .stack-coverage button,
  .tool-group > summary,
  .guide-recipe > summary,
  .guide-reset,
  .skip-link {
    transition: none;
  }
}

/* Cloud model provider guide */
.cloud-model-hero {
  max-width: 980px;
}

.cloud-model-hero .lead {
  max-width: 900px;
}

.cloud-gate-section,
.cloud-cuda-section,
.cloud-fit-section {
  background: var(--section-wash);
}

.cloud-gate-grid,
.tinygrad-principles,
.price-method-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.cloud-gate-grid article,
.tinygrad-principles article,
.price-method-grid article {
  min-width: 0;
  padding: 21px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .025);
}

.cloud-gate-grid article:nth-child(1) {
  background: rgba(var(--good-rgb), .045);
}

.cloud-gate-grid article:nth-child(2),
.cloud-gate-grid article:nth-child(3) {
  background: rgba(var(--warn-rgb), .035);
}

.cloud-gate-grid span,
.tinygrad-principles span {
  color: var(--good);
  font: 10px var(--mono);
  text-transform: uppercase;
}

.cloud-gate-grid article:nth-child(2) span,
.cloud-gate-grid article:nth-child(3) span {
  color: var(--warn);
}

.cloud-gate-grid h3,
.tinygrad-principles h3,
.price-method-grid h3 {
  margin: 10px 0 7px;
  font-size: 17px;
  letter-spacing: -.02em;
}

.cloud-gate-grid p,
.tinygrad-principles p,
.price-method-grid p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.cloud-model-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.cloud-model-card {
  display: flex;
  min-width: 0;
  flex-direction: column;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(var(--surface-rgb), .035);
}

.cloud-model-card.recommended {
  background: linear-gradient(145deg, rgba(var(--good-rgb), .065), rgba(var(--blue-rgb), .025));
}

.cloud-model-card.upcoming {
  border-color: rgba(var(--warn-rgb), .26);
  background: linear-gradient(145deg, rgba(var(--warn-rgb), .065), rgba(var(--purple-rgb), .025));
}

.cloud-model-card.featured-video-card {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: minmax(0, .92fr) minmax(360px, 1.08fr);
  gap: 28px;
  align-items: center;
}

.cloud-model-copy {
  display: flex;
  min-width: 0;
  height: 100%;
  flex-direction: column;
}

.cloud-model-copy > p {
  min-height: 0;
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.model-video {
  min-width: 0;
  width: 100%;
}

.model-video-tab-list {
  display: none;
  gap: 6px;
  margin: 0 0 10px;
  padding: 2px 1px 6px;
  overflow-x: auto;
  scrollbar-width: thin;
}

.model-video-tabs.is-enhanced .model-video-tab-list {
  display: flex;
}

.model-video-tab-list button {
  flex: 0 0 auto;
  min-height: 38px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  color: var(--muted);
  background: rgba(var(--surface-rgb), .045);
  cursor: pointer;
  font: 700 10px var(--mono);
}

.model-video-tab-list button[aria-selected="true"] {
  border-color: rgba(var(--blue-rgb), .36);
  color: var(--text);
  background: rgba(var(--blue-rgb), .11);
  box-shadow: inset 0 -2px 0 var(--blue);
}

.model-video-tab-list button:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 2px;
}

.model-video-panel + .model-video-panel {
  margin-top: 14px;
}

.model-video-tabs.is-enhanced .model-video-panel {
  margin-top: 0;
}

.model-video-tabs.is-enhanced .model-video-panel[hidden] {
  display: none;
}

.model-video .video-frame {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 14px;
}

.model-video .video-direct {
  display: inline-flex;
  margin-top: 12px;
  color: var(--blue);
  font: 700 11px var(--mono);
}

.cloud-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--dim);
  font: 10px var(--mono);
  text-transform: uppercase;
}

.status-chip {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 5px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font: 9px var(--mono);
  letter-spacing: .02em;
  text-transform: uppercase;
}

.status-chip.ready {
  color: var(--good);
  border-color: rgba(var(--good-rgb), .3);
  background: rgba(var(--good-rgb), .08);
}

.status-chip.pilot,
.status-chip.waiting {
  color: var(--warn);
  border-color: rgba(var(--warn-rgb), .3);
  background: rgba(var(--warn-rgb), .08);
}

.cloud-model-card h3 {
  margin: 18px 0 8px;
  font-size: clamp(23px, 3vw, 31px);
  letter-spacing: -.045em;
}

.cloud-model-card .nested-heading-line {
  flex-wrap: wrap;
  margin: 18px 0 8px;
}

.cloud-model-card .nested-heading-line h3 {
  align-items: center;
  margin: 0;
}

.cloud-model-card .nested-heading-line h3 > .brand-marks {
  align-self: center;
}

.cloud-model-card > p {
  min-height: 66px;
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.cloud-model-card dl {
  display: grid;
  gap: 0;
  margin: 20px 0 0;
  border-top: 1px solid var(--line);
}

.cloud-model-card dl > div {
  display: grid;
  grid-template-columns: 100px minmax(0, 1fr);
  gap: 12px;
  padding: 9px 0;
  border-bottom: 1px solid var(--line);
}

.cloud-model-card dt {
  color: var(--dim);
  font: 9px var(--mono);
  text-transform: uppercase;
}

.cloud-model-card dd {
  margin: 0;
  color: var(--text);
  font-size: 12px;
}

.cloud-model-card .tool-links {
  margin-top: auto;
  padding-top: 18px;
}

.cloud-watch {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(300px, .7fr);
  gap: 34px;
  margin-top: 18px;
  padding: 26px;
  border: 1px solid rgba(var(--warn-rgb), .3);
  border-left: 4px solid var(--warn);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(var(--warn-rgb), .075), rgba(var(--purple-rgb), .035));
}

.cloud-watch h3 {
  margin: 13px 0 8px;
  font-size: 25px;
  letter-spacing: -.035em;
}

.cloud-watch h4 {
  margin: 0 0 10px;
  font-size: 14px;
}

.cloud-watch p,
.cloud-watch li {
  color: var(--muted);
  font-size: 12px;
}

.cloud-watch p,
.cloud-watch ul {
  margin-top: 0;
}

.cloud-watch ul {
  padding-left: 18px;
}

.cloud-watch .more {
  margin-top: 12px;
}

.hardware-subhead {
  margin-bottom: 16px;
}

.hardware-subhead.compact {
  margin-top: 34px;
}

.hardware-subhead > span {
  color: var(--good);
  font: 10px var(--mono);
  letter-spacing: .03em;
  text-transform: uppercase;
}

.hardware-subhead h3 {
  max-width: 920px;
  margin: 9px 0 7px;
  font-size: clamp(22px, 3vw, 30px);
  letter-spacing: -.035em;
}

.hardware-subhead p {
  max-width: 920px;
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.platform-video-disclosure {
  margin-top: 34px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(var(--surface-rgb), .022);
}

.platform-video-disclosure > summary {
  position: relative;
  margin: 0;
  padding: 20px 70px 20px 20px;
  list-style: none;
  cursor: pointer;
  transition: background .2s ease;
}

.platform-video-disclosure > summary::-webkit-details-marker {
  display: none;
}

.platform-video-disclosure > summary::after {
  display: grid;
  position: absolute;
  top: 50%;
  right: 20px;
  place-items: center;
  width: 36px;
  height: 36px;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--good);
  background: rgba(var(--surface-rgb), .035);
  content: "+";
  font: 500 22px/1 var(--sans);
  transform: translateY(-50%);
}

.platform-video-disclosure[open] > summary::after {
  content: "−";
}

.platform-video-disclosure > summary:hover,
.platform-video-disclosure[open] > summary {
  background: rgba(var(--surface-rgb), .035);
}

.platform-video-disclosure[open] > summary {
  border-bottom: 1px solid var(--line);
}

.platform-video-disclosure > .video-grid {
  margin: 0;
  padding: 20px;
}

.platform-video-disclosure:not([open]) > .video-grid {
  display: none;
}

.provider-scale-heading {
  scroll-margin-top: 110px;
}

.provider-disclosure-card {
  margin: 18px 0;
  overflow: clip;
  border: 1px solid var(--line);
  border-radius: 20px;
  background:
    radial-gradient(circle at 94% 0%, rgba(var(--blue-rgb), .085), transparent 24rem),
    rgba(var(--surface-rgb), .025);
  box-shadow: var(--section-shadow);
  scroll-margin-top: 110px;
}

.provider-disclosure-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 42px;
  column-gap: 20px;
  align-items: center;
  padding: 24px 26px;
  list-style: none;
  cursor: pointer;
  transition: background .2s ease;
}

.provider-disclosure-summary::-webkit-details-marker {
  display: none;
}

.provider-disclosure-summary::after {
  display: grid;
  grid-column: 2;
  grid-row: 1 / 4;
  place-items: center;
  width: 40px;
  height: 40px;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--good);
  background: rgba(var(--surface-rgb), .035);
  content: "+";
  font: 500 24px/1 var(--sans);
}

.provider-disclosure-card[open] > .provider-disclosure-summary::after {
  content: "−";
}

.provider-disclosure-summary:hover,
.provider-disclosure-card[open] > .provider-disclosure-summary {
  background: rgba(var(--surface-rgb), .035);
}

.provider-disclosure-summary > span {
  grid-column: 1;
  color: var(--good);
  font: 9px var(--mono);
  letter-spacing: .05em;
  text-transform: uppercase;
}

.provider-disclosure-summary h3 {
  grid-column: 1;
  margin: 9px 0 7px;
  font-size: clamp(22px, 3vw, 30px);
  line-height: 1.1;
  letter-spacing: -.035em;
}

.provider-disclosure-summary p {
  grid-column: 1;
  max-width: 920px;
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.provider-disclosure-body {
  padding: 26px;
  border-top: 1px solid var(--line);
}

.provider-disclosure-body > :first-child {
  margin-top: 0;
}

.provider-tier-card > .provider-disclosure-body {
  background: linear-gradient(180deg, rgba(var(--surface-rgb), .018), transparent 20rem);
}

.provider-card-intro {
  max-width: 920px;
  color: var(--muted);
  font-size: 13px;
}

.provider-scale-flow {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 18px;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.provider-scale-flow article {
  position: relative;
  min-width: 0;
  padding: 21px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .025);
}

.provider-scale-flow article:nth-child(2) {
  background: linear-gradient(145deg, rgba(var(--good-rgb), .07), rgba(var(--blue-rgb), .025));
}

.provider-scale-flow article:nth-child(3),
.provider-scale-flow article:nth-child(4) {
  background: linear-gradient(145deg, rgba(var(--blue-rgb), .055), rgba(var(--purple-rgb), .025));
}

.provider-scale-flow article > span,
.compute-landscape .provider-disclosure-summary > span,
.support-program-grid article > span,
.support-scale-case > span {
  color: var(--good);
  font: 9px var(--mono);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.provider-scale-flow article:nth-child(n + 3) > span {
  color: var(--blue);
}

.provider-scale-flow h4 {
  margin: 10px 0 4px;
  font-size: 20px;
  letter-spacing: -.035em;
}

.provider-scale-flow strong {
  display: block;
  color: var(--text);
  font: 11px/1.45 var(--mono);
}

.provider-scale-flow p {
  margin: 11px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.scale-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  margin-top: 16px;
  padding-top: 13px;
  border-top: 1px solid rgba(var(--surface-rgb), .09);
}

.scale-facts span {
  color: var(--text);
  font: 9px/1.45 var(--mono);
}

.scale-facts b {
  display: block;
  margin-bottom: 3px;
  color: var(--dim);
  font-size: 7px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.scale-basis {
  margin: 0 0 28px;
  border-top: 1px solid var(--line);
}

.cloud-routes {
  margin: 28px 0 20px;
  border: 1px solid rgba(var(--blue-rgb), .2);
  border-radius: 20px;
  background: linear-gradient(145deg, rgba(var(--blue-rgb), .055), rgba(var(--purple-rgb), .018));
}

.cloud-routes .hardware-subhead {
  margin: 0 0 20px;
}

.cloud-routes .hardware-subhead h4 {
  max-width: 900px;
  margin: 9px 0 7px;
  font-size: clamp(22px, 3vw, 30px);
  letter-spacing: -.035em;
}

.cloud-platform-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.cloud-platform-card {
  display: flex;
  min-width: 0;
  flex-direction: column;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--inset-surface);
}

.cloud-platform-card.aws-card {
  border-color: rgba(var(--warn-rgb), .24);
}

.cloud-platform-card.azure-card {
  border-color: rgba(var(--blue-rgb), .3);
}

.cloud-platform-card.google-card {
  border-color: rgba(var(--good-rgb), .26);
}

.cloud-platform-card.alibaba-card {
  border-color: rgba(var(--purple-rgb), .28);
}

.cloud-platform-title > span {
  color: var(--blue);
  font: 9px var(--mono);
  letter-spacing: .05em;
}

.aws-card .cloud-platform-title > span {
  color: var(--warn);
}

.google-card .cloud-platform-title > span {
  color: var(--good);
}

.alibaba-card .cloud-platform-title > span {
  color: var(--purple);
}

.cloud-platform-title h4 {
  margin: 9px 0 7px;
  font-size: 20px;
  letter-spacing: -.035em;
}

.cloud-platform-title p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.cloud-platform-card dl {
  display: grid;
  gap: 0;
  margin: 17px 0 0;
}

.cloud-platform-card dl > div {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 10px;
  padding: 9px 0;
  border-top: 1px solid rgba(var(--surface-rgb), .075);
}

.cloud-platform-card dt {
  color: var(--dim);
  font: 8px/1.4 var(--mono);
  letter-spacing: .03em;
  text-transform: uppercase;
}

.cloud-platform-card dd {
  margin: 0;
  color: var(--text);
  font-size: 10px;
}

.cloud-platform-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: auto;
  padding-top: 15px;
}

.cloud-platform-stats span {
  padding: 10px;
  border: 1px solid rgba(var(--surface-rgb), .08);
  border-radius: 9px;
  color: var(--text);
  background: rgba(var(--surface-rgb), .025);
  font: 10px/1.4 var(--mono);
}

.cloud-platform-stats b {
  display: block;
  margin-bottom: 3px;
  color: var(--dim);
  font-size: 7px;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.cloud-platform-card .tool-links {
  margin-top: 15px;
}

.cloud-platform-card .tool-links a {
  color: var(--blue);
  font-size: 10px;
  font-weight: 700;
  text-decoration: none;
}

.cloud-platform-card .tool-links a:hover {
  text-decoration: underline;
}

.scaling-effect {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) minmax(220px, .36fr);
  gap: 20px;
  align-items: start;
  margin: 18px 0;
  padding: 22px;
  border: 1px solid rgba(var(--warn-rgb), .28);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(var(--warn-rgb), .065), rgba(var(--blue-rgb), .025));
}

.scaling-effect h4 {
  margin: 0 0 6px;
  font-size: 18px;
  letter-spacing: -.025em;
}

.scaling-effect p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.scaling-effect .tool-links {
  margin-top: 0;
}

.compute-landscape {
  margin: 24px 0 0;
  border: 1px solid var(--line);
  border-radius: 20px;
  background:
    radial-gradient(circle at 92% 0%, rgba(var(--blue-rgb), .1), transparent 24rem),
    rgba(var(--surface-rgb), .025);
  box-shadow: 0 22px 70px rgba(0, 0, 0, .2);
}

.compute-landscape .provider-disclosure-summary p {
  max-width: 900px;
}

.compute-landscape .provider-disclosure-summary h3 {
  margin: 9px 0 7px;
  font-size: clamp(24px, 3.4vw, 38px);
  line-height: 1.05;
  letter-spacing: -.045em;
}

.compute-landscape .provider-disclosure-summary p,
.compute-landscape-intro {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.compute-landscape-intro {
  max-width: 900px;
  padding-bottom: 18px;
}

.compute-legend {
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
  margin: 20px 0 15px 204px;
  color: var(--dim);
  font: 9px var(--mono);
  text-transform: uppercase;
}

.compute-legend span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.compute-legend span::before {
  width: 20px;
  height: 7px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--blue), var(--purple));
  content: '';
}

.compute-legend .observed-floor::before {
  border: 1px solid rgba(var(--good-rgb), .55);
  background: repeating-linear-gradient(135deg, rgba(var(--good-rgb), .5) 0 4px, rgba(var(--good-rgb), .1) 4px 8px);
}

.compute-legend .owner-pool::before {
  border: 1px solid rgba(var(--warn-rgb), .62);
  background: linear-gradient(90deg, rgba(var(--warn-rgb), .22), rgba(var(--blue-rgb), .22));
}

.compute-legend .not-disclosed::before {
  border: 1px dashed var(--dim);
  background: transparent;
}

.compute-scale-control {
  margin: 0 0 15px 204px;
}

.compute-chart {
  display: grid;
  gap: 7px;
}

.compute-row {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
}

.compute-provider strong,
.compute-provider small,
.compute-provider em {
  display: block;
}

.compute-provider strong {
  color: var(--text);
  font-size: 12px;
}

.compute-provider small {
  margin-top: 2px;
  color: var(--dim);
  font: 8px var(--mono);
  letter-spacing: .04em;
}

.compute-provider em {
  margin-top: 3px;
  color: var(--good);
  font: normal 8px var(--mono);
}

.compute-track {
  position: relative;
  height: 42px;
  border: 1px solid rgba(var(--surface-rgb), .075);
  border-radius: 8px;
  background:
    linear-gradient(90deg, transparent 26.4%, rgba(var(--surface-rgb), .08) 26.5%, transparent 26.6%),
    linear-gradient(90deg, transparent 52.8%, rgba(var(--surface-rgb), .08) 52.9%, transparent 53%),
    linear-gradient(90deg, transparent 79.3%, rgba(var(--surface-rgb), .08) 79.4%, transparent 79.5%),
    rgba(var(--surface-rgb), .018);
}

.compute-bar {
  display: flex;
  position: relative;
  height: 100%;
  min-width: 74px;
  flex-direction: column;
  justify-content: center;
  padding: 0 10px;
  border-radius: 7px;
  color: var(--on-gradient);
  background: linear-gradient(90deg, var(--blue), var(--purple));
  box-shadow: 0 8px 24px rgba(var(--blue-rgb), .12);
  white-space: nowrap;
  transition: width .28s ease;
}

.compute-bar.observed {
  border: 1px solid rgba(var(--good-rgb), .55);
  color: var(--text);
  background: repeating-linear-gradient(135deg, rgba(var(--good-rgb), .33) 0 7px, rgba(var(--good-rgb), .11) 7px 14px);
}

.compute-bar.owner {
  border: 1px solid rgba(var(--warn-rgb), .62);
  color: var(--text);
  background: linear-gradient(90deg, rgba(var(--warn-rgb), .32), rgba(var(--blue-rgb), .32));
  box-shadow: 0 8px 24px rgba(var(--warn-rgb), .08);
}

.compute-bar b {
  font: 700 11px var(--mono);
}

.compute-bar small {
  overflow: visible;
  font: 8px var(--mono);
  opacity: .76;
}

.compute-mistral { width: 12.6%; }
.compute-deepseek { width: 34.4%; }
.compute-xai { width: 74.5%; }
.compute-anthropic { width: 79.4%; }
.compute-openai,
.compute-meta-lab { width: 85.5%; }
.compute-deepmind { width: 87.4%; }
.compute-meta-owner { width: 89%; }
.compute-amazon { width: 89.7%; }
.compute-microsoft { width: 93.5%; }
.compute-google { width: 98%; }

.compute-undisclosed {
  display: flex;
  align-items: center;
  padding: 0 12px;
  border-style: dashed;
  color: var(--dim);
  font: 9px var(--mono);
  text-transform: uppercase;
}

.compute-undisclosed span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.compute-group-label {
  margin: 8px 0 2px 204px;
  padding-top: 11px;
  border-top: 1px solid rgba(var(--surface-rgb), .08);
  color: var(--blue);
  font: 9px var(--mono);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.compute-axis {
  position: relative;
  height: 14px;
  margin: 2px 0 0 204px;
  color: var(--dim);
  font: 8px var(--mono);
}

.compute-axis span {
  position: absolute;
  top: 0;
  transform: translateX(-50%);
}

.compute-axis span:nth-child(1) { left: 0; transform: none; }
.compute-axis span:nth-child(2) { left: 26.5%; }
.compute-axis span:nth-child(3) { left: 52.9%; }
.compute-axis span:nth-child(4) { left: 79.4%; }
.compute-axis span:nth-child(5) { right: 0; transform: none; }

.compute-landscape[data-compute-scale="linear"] .compute-track {
  background:
    linear-gradient(90deg, transparent 24.9%, rgba(var(--surface-rgb), .08) 25%, transparent 25.1%),
    linear-gradient(90deg, transparent 49.9%, rgba(var(--surface-rgb), .08) 50%, transparent 50.1%),
    linear-gradient(90deg, transparent 74.9%, rgba(var(--surface-rgb), .08) 75%, transparent 75.1%),
    rgba(var(--surface-rgb), .018);
}

.compute-landscape[data-compute-scale="linear"] .compute-bar {
  min-width: 3px;
  padding: 0;
  overflow: visible;
}

.compute-landscape[data-compute-scale="linear"] .compute-bar b,
.compute-landscape[data-compute-scale="linear"] .compute-bar small {
  position: absolute;
  z-index: 2;
  left: calc(100% + 8px);
  color: var(--text);
}

.compute-landscape[data-compute-scale="linear"] .compute-bar b {
  top: 7px;
}

.compute-landscape[data-compute-scale="linear"] .compute-bar small {
  top: 22px;
}

.compute-landscape[data-compute-scale="linear"] .compute-bar.compute-label-inside b,
.compute-landscape[data-compute-scale="linear"] .compute-bar.compute-label-inside small {
  right: 8px;
  left: auto;
  color: var(--on-gradient);
  text-align: right;
}

.compute-landscape[data-compute-scale="linear"] .compute-bar.owner.compute-label-inside b,
.compute-landscape[data-compute-scale="linear"] .compute-bar.owner.compute-label-inside small {
  color: var(--text);
}

.compute-landscape[data-compute-scale="linear"] .compute-axis span:nth-child(2) { left: 25%; }
.compute-landscape[data-compute-scale="linear"] .compute-axis span:nth-child(3) { left: 50%; }
.compute-landscape[data-compute-scale="linear"] .compute-axis span:nth-child(4) { left: 75%; }

@media (prefers-reduced-motion: reduce) {
  .efficiency-dot,
  .efficiency-average,
  .compute-bar {
    transition: none;
  }
}

.compute-cost-method {
  display: grid;
  grid-template-columns: 150px repeat(2, minmax(0, 1fr));
  gap: 16px;
  align-items: start;
  margin-top: 22px;
  padding: 18px;
  border: 1px solid rgba(var(--warn-rgb), .24);
  border-radius: 12px;
  background: rgba(var(--warn-rgb), .035);
}

.compute-cost-method > strong {
  color: var(--warn);
  font: 10px var(--mono);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.compute-cost-method p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.compute-reading {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 22px;
}

.compute-reading p {
  margin: 0;
  padding: 16px;
  border: 1px solid rgba(var(--surface-rgb), .085);
  border-radius: 12px;
  color: var(--muted);
  background: var(--inset-surface);
  font-size: 12px;
}

.compute-reading strong {
  color: var(--text);
}

.compute-sources {
  margin-top: 16px;
  border-top: 1px solid var(--line);
}

.compute-sources .tool-links a,
.support-program-grid .tool-links a,
.support-scale-case .tool-links a,
.scaling-effect .tool-links a {
  color: var(--blue);
  font-size: 11px;
  font-weight: 700;
  text-decoration: none;
}

.compute-sources .tool-links a:hover,
.support-program-grid .tool-links a:hover,
.support-scale-case .tool-links a:hover,
.scaling-effect .tool-links a:hover {
  text-decoration: underline;
}

.scale-outcome-table-wrap {
  margin-top: 24px;
}

.scale-outcome-table td strong {
  color: var(--text);
}

.public-scale-bridge {
  margin-top: 30px;
  border: 1px solid rgba(var(--blue-rgb), .22);
  border-radius: 20px;
  background: linear-gradient(145deg, rgba(var(--blue-rgb), .055), rgba(var(--good-rgb), .02));
}

.public-scale-bridge .hardware-subhead h4 {
  max-width: 900px;
  margin: 9px 0 7px;
  font-size: clamp(22px, 3vw, 30px);
  letter-spacing: -.035em;
}

.support-region-block {
  margin-top: 25px;
}

.support-region-block + .support-region-block {
  margin-top: 30px;
  padding-top: 28px;
  border-top: 1px solid var(--line);
}

.support-region-heading {
  display: flex;
  gap: 16px;
  align-items: center;
  margin-bottom: 15px;
}

.support-region-heading > div {
  min-width: 0;
}

.support-region-heading span {
  color: var(--dim);
  font: 9px var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}

.support-region-heading h5 {
  margin: 3px 0 0;
  font-size: 17px;
  letter-spacing: -.025em;
}

.support-region-icon {
  width: 72px;
  height: 48px;
  flex: 0 0 auto;
  overflow: visible;
  color: var(--text);
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.35;
  opacity: .8;
}

.support-region-icon .support-region-dots {
  fill: currentColor;
  stroke: none;
}

.support-region-icon .support-region-canton {
  fill: var(--bg);
  stroke: currentColor;
}

.support-program-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.support-program-grid article {
  display: flex;
  min-width: 0;
  flex-direction: column;
  padding: 19px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: var(--inset-surface);
}

.support-program-grid h5 {
  margin: 9px 0 6px;
  font-size: 17px;
  letter-spacing: -.025em;
}

.support-program-grid p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.support-program-grid .tool-links {
  margin-top: auto;
  padding-top: 15px;
}

.support-scale-cases {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 18px;
}

.support-scale-case {
  display: flex;
  gap: 10px;
  align-items: start;
  padding: 19px;
  border: 1px solid rgba(var(--good-rgb), .22);
  border-radius: 13px;
  background: rgba(var(--good-rgb), .035);
  flex-direction: column;
}

.support-scale-case:nth-child(2) {
  border-color: rgba(var(--blue-rgb), .22);
  background: rgba(var(--blue-rgb), .035);
}

.support-scale-case p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.support-scale-case strong {
  color: var(--text);
}

.support-scale-case .tool-links {
  margin-top: auto;
  padding-top: 4px;
}

.nvidia-evolution {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 24px;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.nvidia-evolution article {
  position: relative;
  min-width: 0;
  padding: 20px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .025);
}

.nvidia-evolution article::before {
  position: absolute;
  top: -4px;
  left: 18px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--good);
  box-shadow: 0 0 0 4px rgba(var(--good-rgb), .09);
  content: '';
}

.nvidia-evolution span,
.economics-results article > span,
.economics-bottom-line span {
  display: block;
  color: var(--dim);
  font: 9px var(--mono);
  letter-spacing: .03em;
  text-transform: uppercase;
}

.nvidia-evolution strong {
  display: block;
  margin-top: 7px;
  color: var(--good);
  font: 15px/1.3 var(--mono);
}

.nvidia-evolution p {
  margin: 9px 0 0;
  color: var(--muted);
  font-size: 11px;
}

/* NVIDIA commercial-stack disclosure: diagram remains a readable document without CSS. */
.nvidia-stack-diagram {
  display: grid;
  position: relative;
  gap: 18px;
  margin: 28px 0;
  padding: clamp(20px, 3vw, 34px);
  overflow: hidden;
  border: 1px solid rgba(var(--surface-rgb), .16);
  border-radius: 26px;
  background:
    radial-gradient(circle at 92% 4%, rgba(var(--good-rgb), .15), transparent 25rem),
    radial-gradient(circle at 5% 96%, rgba(var(--blue-rgb), .1), transparent 24rem),
    linear-gradient(155deg, rgba(var(--surface-rgb), .065), rgba(var(--surface-rgb), .018));
  box-shadow: inset 0 1px rgba(var(--surface-rgb), .09), 0 24px 60px rgba(0, 0, 0, .14);
  counter-reset: stack-layer;
}

.nvidia-stack-diagram::before {
  position: absolute;
  inset: 0;
  opacity: .18;
  pointer-events: none;
  background-image: radial-gradient(circle, rgba(var(--surface-rgb), .32) 1px, transparent 1px);
  background-size: 22px 22px;
  content: '';
  mask-image: linear-gradient(135deg, #000, transparent 58%);
}

.nvidia-stack-diagram > * {
  position: relative;
}

.nvidia-stack-diagram figcaption {
  max-width: 780px;
  padding: 2px 4px 5px;
}

.nvidia-stack-diagram figcaption > span,
.nvidia-stack-layer-label > span,
.nvidia-stack-band > span,
.nvidia-stack-foundation > span {
  display: block;
  color: var(--dim);
  font: 700 9px/1.4 var(--mono);
  letter-spacing: .1em;
  text-transform: uppercase;
}

.nvidia-stack-diagram figcaption > strong {
  display: block;
  margin-top: 8px;
  color: var(--text);
  font: 760 clamp(21px, 2.7vw, 30px)/1.08 var(--sans);
  letter-spacing: -.035em;
}

.nvidia-stack-diagram figcaption > p,
.nvidia-stack-layer-label > p {
  margin: 9px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.nvidia-stack-band,
.nvidia-stack-foundation {
  padding: 18px;
  border: 1px solid rgba(var(--surface-rgb), .14);
  border-radius: 18px;
  background: rgba(var(--solid-panel-rgb), .58);
  box-shadow: inset 0 1px rgba(var(--surface-rgb), .08);
}

.nvidia-stack-outcomes {
  border-color: rgba(var(--good-rgb), .34);
  background:
    linear-gradient(115deg, rgba(var(--good-rgb), .12), transparent 48%),
    rgba(var(--solid-panel-rgb), .68);
}

.nvidia-stack-band-items,
.nvidia-stack-foundation-items {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.nvidia-stack-band-items {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.nvidia-stack-band-items > span,
.nvidia-stack-foundation-items > span {
  display: grid;
  place-items: center;
  min-width: 0;
  min-height: 66px;
  padding: 12px 9px;
  border: 1px solid rgba(var(--surface-rgb), .11);
  border-radius: 13px;
  color: var(--text);
  background: rgba(var(--surface-rgb), .035);
  font-size: 11px;
  font-weight: 750;
  line-height: 1.25;
  text-align: center;
}

.nvidia-stack-band-items > span::before,
.nvidia-stack-foundation-items > span::before,
.nvidia-stack-product::before {
  display: block;
  width: 24px;
  height: 24px;
  margin-bottom: 8px;
  background: var(--stack-icon) center / contain no-repeat;
  content: '';
  filter: var(--external-svg-filter);
}

.nvidia-stack-outcomes .nvidia-stack-band-items > span {
  color: var(--good);
}

.nvidia-stack-outcomes .nvidia-stack-band-items > span:nth-child(1) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/layout-dashboard.svg"); }
.nvidia-stack-outcomes .nvidia-stack-band-items > span:nth-child(2) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/bot.svg"); }
.nvidia-stack-outcomes .nvidia-stack-band-items > span:nth-child(3) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/braces.svg"); }
.nvidia-stack-outcomes .nvidia-stack-band-items > span:nth-child(4) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/chart-no-axes-combined.svg"); }
.nvidia-stack-outcomes .nvidia-stack-band-items > span:nth-child(5) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/graduation-cap.svg"); }

.nvidia-stack-layer {
  --stack-accent: var(--good);
  --stack-accent-rgb: var(--good-rgb);
  --stack-layer-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/blocks.svg");
  display: grid;
  position: relative;
  grid-template-columns: minmax(205px, .82fr) minmax(0, 3fr);
  gap: 12px;
  padding: 12px;
  border: 1px solid rgba(var(--stack-accent-rgb), .3);
  border-radius: 20px;
  background:
    linear-gradient(105deg, rgba(var(--stack-accent-rgb), .1), transparent 38%),
    rgba(var(--solid-panel-rgb), .68);
  box-shadow: inset 3px 0 var(--stack-accent), inset 0 1px rgba(var(--surface-rgb), .06);
  counter-increment: stack-layer;
}

.nvidia-stack-serving {
  --stack-accent: var(--blue);
  --stack-accent-rgb: var(--blue-rgb);
  --stack-layer-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/server-cog.svg");
}

.nvidia-stack-infrastructure {
  --stack-accent: var(--purple);
  --stack-accent-rgb: var(--purple-rgb);
  --stack-layer-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/network.svg");
}

.nvidia-stack-system {
  --stack-accent: var(--warn);
  --stack-accent-rgb: var(--warn-rgb);
  --stack-layer-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/cpu.svg");
}

.nvidia-stack-layer-label {
  position: relative;
  align-self: stretch;
  min-width: 0;
  padding: 20px 18px;
  border: 1px solid rgba(var(--stack-accent-rgb), .18);
  border-radius: 14px;
  background: rgba(var(--stack-accent-rgb), .075);
}

.nvidia-stack-layer-label::before {
  display: block;
  width: 34px;
  height: 34px;
  margin: 0 0 18px;
  color: var(--stack-accent);
  background: var(--stack-layer-icon) center / contain no-repeat;
  content: '';
  filter: var(--external-svg-filter);
}

.nvidia-stack-layer-label::after {
  position: absolute;
  top: 17px;
  right: 17px;
  color: rgba(var(--stack-accent-rgb), .68);
  content: "0" counter(stack-layer);
  font: 700 10px/1 var(--mono);
  letter-spacing: .08em;
}

.nvidia-stack-layer-label > span {
  color: var(--stack-accent);
}

.nvidia-stack-layer-label h4 {
  margin: 8px 0 0;
  color: var(--text);
  font-size: 16px;
  line-height: 1.22;
  letter-spacing: -.02em;
}

.nvidia-stack-products {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}

.nvidia-stack-products-five {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.nvidia-stack-products-four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.nvidia-stack-product-wide {
  grid-column: span 2;
}

.nvidia-stack-product {
  --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/box.svg");
  display: flex;
  position: relative;
  min-width: 0;
  min-height: 156px;
  padding: 17px 15px 15px;
  flex-direction: column;
  align-items: flex-start;
  border: 1px solid rgba(var(--surface-rgb), .11);
  border-radius: 14px;
  color: var(--text);
  background: rgba(var(--surface-rgb), .035);
  text-decoration: none;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .08);
  transition: transform .16s ease, border-color .16s ease, background-color .16s ease, box-shadow .16s ease;
}

.nvidia-stack-product::before {
  width: 29px;
  height: 29px;
  color: var(--stack-accent);
}

.nvidia-stack-product::after {
  position: absolute;
  top: 12px;
  right: 13px;
  color: var(--dim);
  content: "↗";
  font: 11px/1 var(--mono);
}

.nvidia-stack-product:hover {
  border-color: rgba(var(--stack-accent-rgb), .56);
  color: var(--text);
  background: rgba(var(--stack-accent-rgb), .105);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .14);
  transform: translateY(-2px);
}

.nvidia-stack-product:focus-visible {
  z-index: 3;
  outline: 3px solid var(--stack-accent);
  outline-offset: 2px;
  background: rgba(var(--stack-accent-rgb), .12);
}

.nvidia-stack-product > strong,
.nvidia-stack-product > .nvidia-stack-subtitle,
.nvidia-stack-description {
  display: block;
}

.nvidia-stack-product > strong {
  color: var(--text);
  font: 760 13px/1.2 var(--sans);
  letter-spacing: -.01em;
}

.nvidia-stack-subtitle {
  margin-top: 5px;
  color: var(--stack-accent);
  font: 700 9px/1.3 var(--mono);
  letter-spacing: .01em;
}

.nvidia-stack-description {
  margin-top: auto;
  padding-top: 10px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.42;
}

.nvidia-stack-apps .nvidia-stack-product:nth-child(1) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/package-open.svg"); }
.nvidia-stack-apps .nvidia-stack-product:nth-child(2) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/brain-circuit.svg"); }
.nvidia-stack-apps .nvidia-stack-product:nth-child(3) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/chart-spline.svg"); }
.nvidia-stack-serving .nvidia-stack-product:nth-child(1) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/gauge.svg"); }
.nvidia-stack-serving .nvidia-stack-product:nth-child(2) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/server.svg"); }
.nvidia-stack-serving .nvidia-stack-product:nth-child(3) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/workflow.svg"); }
.nvidia-stack-infrastructure .nvidia-stack-product:nth-child(1) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/calendar-cog.svg"); }
.nvidia-stack-infrastructure .nvidia-stack-product:nth-child(2) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/factory.svg"); }
.nvidia-stack-infrastructure .nvidia-stack-product:nth-child(3) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/boxes.svg"); }
.nvidia-stack-infrastructure .nvidia-stack-product:nth-child(4) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/cable.svg"); }
.nvidia-stack-infrastructure .nvidia-stack-product:nth-child(5) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/radar.svg"); }
.nvidia-stack-system .nvidia-stack-product:nth-child(1) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/monitor-cog.svg"); }
.nvidia-stack-system .nvidia-stack-product:nth-child(2) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/activity.svg"); }
.nvidia-stack-system .nvidia-stack-product:nth-child(3) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/cpu.svg"); }
.nvidia-stack-system .nvidia-stack-product:nth-child(4) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/container.svg"); }

.nvidia-stack-foundation {
  border-color: rgba(var(--purple-rgb), .3);
  background:
    linear-gradient(115deg, rgba(var(--purple-rgb), .1), transparent 50%),
    rgba(var(--solid-panel-rgb), .68);
}

.nvidia-stack-foundation-items {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.nvidia-stack-foundation-items > span {
  --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/hard-drive.svg");
  min-height: 58px;
  color: var(--purple);
  font-size: 10px;
}

.nvidia-stack-foundation-items > span:nth-child(2) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/cpu.svg"); }
.nvidia-stack-foundation-items > span:nth-child(3) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/network.svg"); }
.nvidia-stack-foundation-items > span:nth-child(4) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/database.svg"); }
.nvidia-stack-foundation-items > span:nth-child(5) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/badge-check.svg"); }

.nvidia-stack-foundation-items small {
  display: block;
  color: var(--muted);
  font-size: 8px;
  font-weight: 600;
}

.nvidia-stack-deploy {
  border-color: rgba(var(--blue-rgb), .34);
  background:
    linear-gradient(115deg, rgba(var(--blue-rgb), .12), transparent 48%),
    rgba(var(--solid-panel-rgb), .68);
}

.nvidia-stack-deploy .nvidia-stack-band-items {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.nvidia-stack-deploy .nvidia-stack-band-items > span {
  color: var(--blue);
}

.nvidia-stack-deploy .nvidia-stack-band-items > span:nth-child(1) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/cloud.svg"); }
.nvidia-stack-deploy .nvidia-stack-band-items > span:nth-child(2) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/building-2.svg"); }
.nvidia-stack-deploy .nvidia-stack-band-items > span:nth-child(3) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/router.svg"); }
.nvidia-stack-deploy .nvidia-stack-band-items > span:nth-child(4) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/monitor.svg"); }

@media (max-width: 980px) {
  .nvidia-stack-layer {
    grid-template-columns: 1fr;
  }

  .nvidia-stack-layer-label {
    padding-left: 68px;
  }

  .nvidia-stack-layer-label::before {
    position: absolute;
    top: 19px;
    left: 18px;
  }

  .nvidia-stack-products-five {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .nvidia-stack-products-four {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .nvidia-stack-product-wide {
    grid-column: span 2;
  }
}

@media (max-width: 700px) {
  .nvidia-stack-diagram {
    gap: 13px;
    margin-inline: -4px;
    padding: 16px;
    border-radius: 20px;
  }

  .nvidia-stack-band,
  .nvidia-stack-foundation {
    padding: 14px;
  }

  .nvidia-stack-band-items,
  .nvidia-stack-foundation-items,
  .nvidia-stack-deploy .nvidia-stack-band-items {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .nvidia-stack-outcomes .nvidia-stack-band-items > span:last-child,
  .nvidia-stack-foundation-items > span:last-child {
    grid-column: 1 / -1;
  }

  .nvidia-stack-layer {
    gap: 8px;
    padding: 8px;
    border-radius: 16px;
  }

  .nvidia-stack-layer-label {
    padding: 16px 46px 16px 58px;
  }

  .nvidia-stack-layer-label::before {
    top: 16px;
    left: 14px;
    width: 30px;
    height: 30px;
  }

  .nvidia-stack-layer-label::after {
    top: 16px;
    right: 14px;
  }

  .nvidia-stack-products,
  .nvidia-stack-products-four,
  .nvidia-stack-products-five {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .nvidia-stack-product,
  .nvidia-stack-product-wide {
    grid-column: auto;
    min-height: 150px;
  }
}

@media (max-width: 480px) {
  .nvidia-stack-products,
  .nvidia-stack-products-four,
  .nvidia-stack-products-five {
    grid-template-columns: 1fr;
  }

  .nvidia-stack-product {
    min-height: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .nvidia-stack-product {
    transition: none;
  }
}

@media (forced-colors: active) {
  .nvidia-stack-diagram,
  .nvidia-stack-band,
  .nvidia-stack-foundation,
  .nvidia-stack-layer,
  .nvidia-stack-layer-label,
  .nvidia-stack-product,
  .nvidia-stack-band-items > span,
  .nvidia-stack-foundation-items > span {
    border-color: CanvasText;
    background: Canvas;
    color: CanvasText;
    box-shadow: none;
  }

  .nvidia-stack-product > strong,
  .nvidia-stack-subtitle,
  .nvidia-stack-layer-label > span {
    color: LinkText;
  }
}

/* Operator-owned companion architecture: reuse the commercial plate's visual grammar. */
.oss-stack-diagram {
  margin: 4px 0 26px;
  border-color: rgba(var(--blue-rgb), .24);
  background:
    radial-gradient(circle at 92% 4%, rgba(var(--blue-rgb), .15), transparent 25rem),
    radial-gradient(circle at 4% 96%, rgba(var(--good-rgb), .09), transparent 23rem),
    linear-gradient(155deg, rgba(var(--surface-rgb), .065), rgba(var(--surface-rgb), .018));
  counter-reset: stack-layer;
}

.oss-stack-diagram::before {
  mask-image: linear-gradient(225deg, #000, transparent 58%);
}

.oss-stack-band {
  border-color: rgba(var(--blue-rgb), .34);
  background:
    linear-gradient(115deg, rgba(var(--blue-rgb), .12), transparent 48%),
    rgba(var(--solid-panel-rgb), .68);
}

.oss-stack-band .nvidia-stack-band-items {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.oss-stack-band .nvidia-stack-band-items > span {
  color: var(--blue);
}

.oss-stack-band .nvidia-stack-band-items > span:nth-child(1) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/braces.svg"); }
.oss-stack-band .nvidia-stack-band-items > span:nth-child(2) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/panels-top-left.svg"); }
.oss-stack-band .nvidia-stack-band-items > span:nth-child(3) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/bot.svg"); }
.oss-stack-band .nvidia-stack-band-items > span:nth-child(4) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/list-checks.svg"); }

.oss-stack-serving {
  --stack-accent: var(--good);
  --stack-accent-rgb: var(--good-rgb);
  --stack-layer-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/server-cog.svg");
}

.oss-stack-control {
  --stack-accent: var(--blue);
  --stack-accent-rgb: var(--blue-rgb);
  --stack-layer-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/calendar-cog.svg");
}

.oss-stack-provisioning {
  --stack-accent: var(--purple);
  --stack-accent-rgb: var(--purple-rgb);
  --stack-layer-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/wrench.svg");
}

.oss-stack-observability {
  --stack-accent: var(--warn);
  --stack-accent-rgb: var(--warn-rgb);
  --stack-layer-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/activity.svg");
}

.oss-stack-platform {
  --stack-accent: var(--good);
  --stack-accent-rgb: var(--good-rgb);
  --stack-layer-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/shield-check.svg");
}

.oss-stack-boundary {
  --stack-accent: var(--warn);
  --stack-accent-rgb: var(--warn-rgb);
  --stack-layer-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/hard-drive.svg");
}

.oss-stack-serving .nvidia-stack-product:nth-child(1) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/gauge.svg"); }
.oss-stack-serving .nvidia-stack-product:nth-child(2) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/server.svg"); }
.oss-stack-serving .nvidia-stack-product:nth-child(3) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/route.svg"); }
.oss-stack-control .nvidia-stack-product:nth-child(1) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/container.svg"); }
.oss-stack-control .nvidia-stack-product:nth-child(2) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/list-ordered.svg"); }
.oss-stack-control .nvidia-stack-product:nth-child(3) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/mountain.svg"); }
.oss-stack-control .nvidia-stack-product:nth-child(4) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/blocks.svg"); }
.oss-stack-provisioning .nvidia-stack-product:nth-child(1) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/server-cog.svg"); }
.oss-stack-provisioning .nvidia-stack-product:nth-child(2) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/monitor-cog.svg"); }
.oss-stack-provisioning .nvidia-stack-product:nth-child(3) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/scroll-text.svg"); }
.oss-stack-observability .nvidia-stack-product:nth-child(1) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/waypoints.svg"); }
.oss-stack-observability .nvidia-stack-product:nth-child(2) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/activity.svg"); }
.oss-stack-observability .nvidia-stack-product:nth-child(3) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/chart-spline.svg"); }
.oss-stack-observability .nvidia-stack-product:nth-child(4) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/logs.svg"); }
.oss-stack-platform .nvidia-stack-product:nth-child(1) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/database.svg"); }
.oss-stack-platform .nvidia-stack-product:nth-child(2) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/archive.svg"); }
.oss-stack-platform .nvidia-stack-product:nth-child(3) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/network.svg"); }
.oss-stack-platform .nvidia-stack-product:nth-child(4) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/key-round.svg"); }
.oss-stack-boundary .nvidia-stack-product:nth-child(1) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/cable.svg"); }
.oss-stack-boundary .nvidia-stack-product:nth-child(2) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/component.svg"); }
.oss-stack-boundary .nvidia-stack-product:nth-child(3) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/cpu.svg"); }
.oss-stack-boundary .nvidia-stack-product:nth-child(4) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/share-2.svg"); }
.oss-stack-boundary .nvidia-stack-product:nth-child(5) { --stack-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/microchip.svg"); }

.oss-stack-diagram .oss-stack-ownership {
  margin: 0;
  border-color: rgba(var(--warn-rgb), .26);
  background: rgba(var(--warn-rgb), .055);
}

@media (max-width: 700px) {
  .oss-stack-band .nvidia-stack-band-items {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .oss-stack-band .nvidia-stack-band-items > span:last-child {
    grid-column: auto;
  }
}

@media (forced-colors: active) {
  .oss-stack-diagram .oss-stack-ownership {
    border-color: CanvasText;
    background: Canvas;
    color: CanvasText;
  }
}

.rubin-analysis {
  margin: 38px 0 18px;
  padding: 28px;
  border: 1px solid rgba(var(--good-rgb), .22);
  border-radius: 22px;
  background:
    radial-gradient(circle at 92% 3%, rgba(var(--good-rgb), .09), transparent 29%),
    linear-gradient(145deg, rgba(var(--surface-rgb), .05), rgba(var(--blue-rgb), .025));
  scroll-margin-top: 110px;
}

.rubin-analysis > .hardware-subhead {
  margin-bottom: 22px;
}

.rubin-verdict-grid,
.rubin-driver-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 18px;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.rubin-verdict-grid article,
.rubin-driver-grid article {
  min-width: 0;
  padding: 19px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .035);
}

.rubin-verdict-grid article:nth-child(2),
.rubin-verdict-grid article:nth-child(3) {
  background: linear-gradient(145deg, rgba(var(--good-rgb), .075), rgba(var(--blue-rgb), .025));
}

.rubin-verdict-grid span,
.rubin-driver-grid span,
.rubin-chart figcaption > span {
  display: block;
  color: var(--dim);
  font: 9px var(--mono);
  letter-spacing: .035em;
  text-transform: uppercase;
}

.rubin-verdict-grid strong,
.rubin-driver-grid strong {
  display: block;
  margin-top: 8px;
  color: var(--good);
  font: 15px/1.3 var(--mono);
}

.rubin-verdict-grid p,
.rubin-driver-grid p {
  margin: 9px 0 0;
  color: var(--muted);
  font-size: 11px;
}

.rubin-method-note,
.rubin-lut-example {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  margin: 18px 0;
  padding: 22px;
  border: 1px solid rgba(var(--warn-rgb), .28);
  border-left: 4px solid var(--warn);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(var(--warn-rgb), .065), rgba(var(--purple-rgb), .025));
}

.rubin-method-note h4,
.rubin-lut-example h4 {
  margin: 12px 0 7px;
  font-size: 16px;
  letter-spacing: -.02em;
}

.rubin-method-note > div:not(:first-child) h4 {
  margin-top: 0;
}

.rubin-method-note p,
.rubin-lut-example p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.rubin-driver-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 18px;
}

.rubin-driver-grid article:nth-child(1),
.rubin-driver-grid article:nth-child(2),
.rubin-driver-grid article:nth-child(3) {
  background: linear-gradient(145deg, rgba(var(--good-rgb), .055), rgba(var(--blue-rgb), .018));
}

.rubin-lut-example {
  grid-template-columns: minmax(0, 1.45fr) minmax(260px, .55fr);
  border-color: rgba(var(--blue-rgb), .25);
  border-left-color: var(--blue);
  background: linear-gradient(145deg, rgba(var(--blue-rgb), .06), rgba(var(--purple-rgb), .025));
}

.rubin-lut-example > div:last-child {
  padding-left: 20px;
  border-left: 1px solid var(--line);
}

.rubin-lut-example > div:last-child > strong {
  display: block;
  margin-bottom: 8px;
  color: var(--text);
}

.rubin-chart-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 20px;
}

.rubin-chart {
  min-width: 0;
  margin: 0;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(var(--surface-rgb), .04);
}

.rubin-chart figcaption h4 {
  margin: 8px 0 6px;
  font-size: 20px;
  letter-spacing: -.03em;
}

.rubin-chart figcaption p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.rubin-chart-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 7px 12px;
  margin: 16px 0;
}

.rubin-chart-legend span {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  color: var(--muted);
  font: 9px var(--mono);
}

.rubin-chart-legend span::before {
  width: 8px;
  height: 8px;
  border-radius: 3px;
  background: var(--series-color);
  content: '';
}

.rubin-chart .rubin { --series-color: var(--good); }
.rubin-chart .gb300 { --series-color: var(--blue); }
.rubin-chart .gb200 { --series-color: var(--purple); }
.rubin-chart .legacy { --series-color: var(--warn); }

.rubin-bar-groups {
  display: grid;
  gap: 13px;
}

.rubin-bar-groups section {
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.rubin-bar-groups h5 {
  margin: 0 0 8px;
  color: var(--text);
  font: 10px var(--mono);
}

.rubin-bar {
  display: grid;
  grid-template-columns: 88px minmax(70px, 1fr) 68px;
  gap: 8px;
  align-items: center;
  margin-top: 5px;
}

.rubin-bar > span,
.rubin-bar > strong,
.rubin-bar > em {
  min-width: 0;
  color: var(--muted);
  font: 8px var(--mono);
}

.rubin-bar > strong {
  color: var(--text);
  text-align: right;
}

.rubin-bar > em {
  grid-column: 2 / 4;
  color: var(--dim);
  font-style: normal;
}

.rubin-bar meter {
  display: block;
  width: 100%;
  height: 9px;
  border: 0;
  border-radius: 999px;
  background: rgba(var(--surface-rgb), .11);
  appearance: none;
}

.rubin-bar meter::-webkit-meter-bar {
  height: 9px;
  border: 0;
  border-radius: 999px;
  background: rgba(var(--surface-rgb), .11);
  box-shadow: none;
}

.rubin-bar meter::-webkit-meter-optimum-value {
  border-radius: 999px;
  background: var(--series-color);
}

.rubin-bar meter::-moz-meter-bar {
  border-radius: 999px;
  background: var(--series-color);
}

.rubin-data-table {
  margin-top: 18px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: rgba(var(--surface-rgb), .028);
}

.rubin-data-table summary {
  padding: 16px 18px;
  color: var(--text);
  font: 11px var(--mono);
  cursor: pointer;
}

.rubin-data-table[open] summary {
  border-bottom: 1px solid var(--line);
}

.rubin-data-table .table-scroll {
  padding: 0 14px 14px;
}

.rubin-data-table .table-scroll + .table-scroll {
  padding-top: 12px;
}

.rubin-data-table table {
  min-width: 920px;
}

.rubin-data-table caption {
  padding: 16px 0 10px;
  color: var(--muted);
  font: 10px var(--mono);
  text-align: left;
}

.rubin-data-table th,
.rubin-data-table td {
  font-size: 10px;
  white-space: nowrap;
}

.rubin-sources {
  margin-top: 18px;
}

.colo-recommendation {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(250px, .65fr);
  gap: 28px;
  align-items: end;
  margin-bottom: 20px;
  padding: 24px;
  border: 1px solid rgba(var(--good-rgb), .28);
  border-left: 4px solid var(--good);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(var(--good-rgb), .07), rgba(var(--blue-rgb), .025));
}

.colo-recommendation h3 {
  margin: 12px 0 7px;
  font-size: 24px;
  letter-spacing: -.035em;
}

.colo-recommendation p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.colo-recommendation .tool-links {
  justify-content: flex-end;
}

.hgx-dgx-widget {
  grid-template-columns: minmax(0, 1.15fr) repeat(2, minmax(210px, .85fr));
  align-items: stretch;
}

.hgx-dgx-widget article {
  padding-left: 22px;
  border-left: 1px solid rgba(var(--good-rgb), .22);
}

.hgx-dgx-widget article > span {
  color: var(--good);
  font: 9px var(--mono);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.hgx-dgx-widget h4 {
  margin: 10px 0 7px;
  font-size: 18px;
  letter-spacing: -.025em;
}

.hgx-dgx-widget .tool-links {
  grid-column: 1 / -1;
  justify-content: flex-start;
  padding-top: 16px;
  border-top: 1px solid rgba(var(--good-rgb), .18);
}

.table-scroll {
  width: 100%;
}

.cloud-hardware-table th:nth-child(1) { width: 18%; }
.cloud-hardware-table th:nth-child(2) { width: 21%; }
.cloud-hardware-table th:nth-child(3) { width: 20%; }
.cloud-hardware-table th:nth-child(4) { width: 18%; }
.cloud-hardware-table th:nth-child(5) { width: 23%; }

.oem-hardware-table th:nth-child(1) { width: 18%; }
.oem-hardware-table th:nth-child(2) { width: 22%; }
.oem-hardware-table th:nth-child(3) { width: 20%; }
.oem-hardware-table th:nth-child(4) { width: 20%; }
.oem-hardware-table th:nth-child(5) { width: 20%; }

.hardware-outcome-table th:nth-child(1) { width: 20%; }
.hardware-outcome-table th:nth-child(2) { width: 32%; }
.hardware-outcome-table th:nth-child(3) { width: 18%; }
.hardware-outcome-table th:nth-child(4) { width: 30%; }

.cuda-table th:nth-child(1) { width: 19%; }
.cuda-table th:nth-child(2) { width: 15%; }
.cuda-table th:nth-child(3) { width: 20%; }
.cuda-table th:nth-child(4) { width: 23%; }
.cuda-table th:nth-child(5) { width: 23%; }

.cloud-hardware-table td strong {
  color: var(--text);
}

.cloud-hardware-table td:first-child a {
  color: var(--good);
  font-weight: 650;
  text-decoration: none;
}

.cloud-hardware-table td:first-child a:hover {
  text-decoration: underline;
}

.oem-hardware-table td:first-child a {
  color: var(--good);
  font-weight: 650;
  text-decoration: none;
}

.oem-hardware-table td:first-child a:hover {
  text-decoration: underline;
}

.price-evidence {
  margin-top: 14px;
}

.compat {
  display: inline-flex;
  width: fit-content;
  padding: 4px 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font: 9px var(--mono);
  text-transform: uppercase;
}

.compat.native {
  color: var(--good);
  border-color: rgba(var(--good-rgb), .3);
}

.compat.port,
.compat.bridge {
  color: var(--warn);
  border-color: rgba(var(--warn-rgb), .3);
}

.compat.separate {
  color: var(--blue);
  border-color: rgba(var(--blue-rgb), .3);
}

.tinygrad-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.tinygrad-card {
  display: flex;
  min-width: 0;
  flex-direction: column;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(var(--purple-rgb), .055), rgba(var(--blue-rgb), .025));
}

.tinygrad-card > span {
  color: var(--purple);
  font: 10px var(--mono);
  text-transform: uppercase;
}

.tinygrad-card h3 {
  margin: 10px 0 7px;
  font-size: 24px;
  letter-spacing: -.035em;
}

.tinygrad-card > strong {
  color: var(--good);
  font: 16px var(--mono);
}

.tinygrad-card p {
  flex: 1;
  color: var(--muted);
  font-size: 13px;
}

.tinygrad-card .more {
  margin-top: 5px;
}

.tinygrad-card.wide {
  grid-column: 1 / -1;
}

.client-software-questions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin: 12px 0 5px;
}

.client-software-questions p {
  margin: 0;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.client-software-questions strong {
  color: var(--text);
}

.tinygrad-principles {
  margin-top: 20px;
}

.cloud-economics-section {
  background:
    radial-gradient(circle at 84% 14%, rgba(var(--good-rgb), .08), transparent 28%),
    var(--section-wash);
}

.economics-planner-tabs {
  display: inline-flex;
  position: relative;
  z-index: 2;
  gap: 5px;
  align-items: end;
  margin: 0 0 -1px 14px;
}

.economics-planner-tabs button {
  min-height: 46px;
  padding: 0 19px;
  border: 1px solid var(--line);
  border-radius: 12px 12px 0 0;
  color: var(--muted);
  background: rgba(var(--dark-panel-rgb), .72);
  box-shadow: inset 0 -1px 0 var(--line);
  cursor: pointer;
  font: 750 10px var(--mono);
  letter-spacing: .025em;
  text-transform: uppercase;
}

.economics-control-tabs button {
  min-height: 40px;
  border: 0;
  border-radius: 8px;
  padding: 0 16px;
  color: var(--muted);
  background: transparent;
  cursor: pointer;
  font: 10px var(--mono);
  text-transform: uppercase;
}

.economics-planner-tabs button.active {
  z-index: 2;
  border-color: rgba(var(--good-rgb), .3);
  border-bottom-color: rgb(var(--solid-panel-rgb));
  color: var(--text);
  background: rgb(var(--solid-panel-rgb));
  box-shadow: inset 0 3px 0 var(--good);
}

.economics-control-tabs button.active {
  color: var(--on-solid-accent);
  background: var(--good);
}

.economics-planner-tabs button:focus-visible,
.economics-control-tabs button:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 2px;
}

[data-economics-planner-view][hidden] {
  display: none;
}

.economics-planner-view {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(var(--solid-panel-rgb), .74);
  box-shadow: var(--shadow);
}

.economics-mode {
  display: grid;
  gap: 6px;
  align-self: start;
  margin: 0;
}

.economics-mode > span {
  color: var(--dim);
  font: 750 9px var(--mono);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.economics-mode > div {
  display: inline-flex;
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--control-surface);
}

.economics-mode button {
  min-height: 38px;
  border: 0;
  border-radius: 999px;
  padding: 0 15px;
  color: var(--muted);
  background: transparent;
  cursor: pointer;
  font: 10px var(--mono);
  text-transform: uppercase;
}

.economics-mode button.active {
  color: var(--on-solid-accent);
  background: var(--good);
}

.economics-mode button:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 2px;
}

.economics-shell {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  align-items: start;
}

.economics-controls,
.economics-results {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(var(--solid-panel-rgb), .88);
  box-shadow: var(--shadow);
}

.economics-controls {
  display: block;
  padding: 0;
  overflow: hidden;
}

.economics-driver-controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 20px;
}

.economics-preset-summary {
  grid-column: 1 / -1;
  margin: 0;
  padding: 13px 14px;
  border: 1px solid rgba(var(--good-rgb), .22);
  border-radius: 11px;
  color: var(--muted);
  background: rgba(var(--good-rgb), .055);
  font-size: 11px;
  line-height: 1.55;
}

.economics-control-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  padding: 12px;
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .025);
}

.economics-control-panel {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 20px;
}

.economics-control-panel[hidden] {
  display: none;
}

.economics-control-panel-advanced {
  grid-template-columns: 1fr;
}

.economics-advanced-group {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  min-width: 0;
}

.economics-advanced-group + .economics-advanced-group {
  padding-top: 20px;
  border-top: 1px solid var(--line);
}

.economics-plan-costs {
  grid-column: 1 / -1;
  padding-top: 20px;
  border-top: 1px solid var(--line);
}

.economics-advanced-heading {
  grid-column: 1 / -1;
}

.economics-advanced-heading span {
  color: var(--text);
  font: 750 11px var(--mono);
  letter-spacing: .03em;
  text-transform: uppercase;
}

.economics-advanced-heading p {
  margin: 5px 0 0;
  color: var(--dim);
  font-size: 11px;
  line-height: 1.5;
}

.economics-controls label {
  min-width: 0;
  padding: 13px;
  border: 1px solid rgba(var(--surface-rgb), .075);
  border-radius: 11px;
  background: rgba(var(--surface-rgb), .025);
  color: var(--dim);
  font: 9px var(--mono);
  letter-spacing: .02em;
  text-transform: uppercase;
}

.economics-controls label > small {
  color: var(--dim);
  font: 10px/1.45 var(--sans);
  letter-spacing: 0;
  text-transform: none;
}

.economics-controls select,
.economics-controls input[type="number"] {
  width: 100%;
  min-width: 0;
  height: 41px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 0 10px;
  color: var(--text);
  background: var(--control-bg);
  font: 12px var(--mono);
}

.economics-controls select {
  appearance: none;
  padding-right: 34px;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--muted) 50%),
    linear-gradient(135deg, var(--muted) 50%, transparent 50%);
  background-position: calc(100% - 15px) 17px, calc(100% - 10px) 17px;
  background-repeat: no-repeat;
  background-size: 5px 5px, 5px 5px;
}

.economics-controls input:focus,
.economics-controls select:focus {
  border-color: var(--good);
  outline: none;
}

.economics-controls input[aria-invalid="true"],
.team-economics-controls input[aria-invalid="true"] {
  border-color: var(--bad);
  box-shadow: 0 0 0 2px rgba(var(--bad-rgb), .12);
}

.calculator-validation {
  margin: 0 0 18px;
  padding: 11px 13px;
  border: 1px solid rgba(var(--bad-rgb), .35);
  border-radius: 9px;
  color: var(--bad);
  background: rgba(var(--bad-rgb), .07);
  font-size: 11px;
}

.calculator-validation[hidden] {
  display: none;
}

.calculator-results-stale > :not(.calculator-validation) {
  opacity: .58;
}

.economics-controls .range-control {
  gap: 9px;
}

.range-control > span {
  color: var(--text);
  font: 11px var(--mono);
  letter-spacing: 0;
  text-transform: none;
}

.economics-results {
  padding: 22px;
  border-color: rgba(var(--good-rgb), .18);
}

.economics-results-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: start;
  padding-bottom: 17px;
  border-bottom: 1px solid var(--line);
}

.economics-results-head .economics-fit {
  padding: 0;
  border: 0;
}

.economics-fit {
  padding-bottom: 17px;
  border-bottom: 1px solid var(--line);
}

.economics-fit p {
  margin: 10px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.economics-result-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin-top: 18px;
  border: 1px solid var(--line);
  background: var(--line);
}

.economics-result-grid[hidden] {
  display: none;
}

.economics-result-grid article {
  min-width: 0;
  padding: 16px;
  background: var(--deep-panel);
}

.economics-result-grid .primary-result {
  grid-column: 1 / -1;
}

.economics-result-grid article > strong {
  display: block;
  margin: 8px 0 5px;
  color: var(--text);
  font: 700 clamp(17px, 2.2vw, 25px) var(--mono);
  letter-spacing: -.04em;
}

.economics-result-grid .primary-result > strong {
  color: var(--good);
  font-size: clamp(35px, 5vw, 58px);
  line-height: .95;
}

.economics-result-grid .primary-result.state-negative > strong {
  color: var(--bad);
}

.economics-finance-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 18px;
}

.economics-finance-summary article {
  min-width: 0;
  padding: 15px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--deep-panel);
}

.economics-finance-summary span,
.economics-finance-summary strong,
.economics-finance-summary small {
  display: block;
}

.economics-finance-summary span {
  color: var(--dim);
  font: 9px var(--mono);
  text-transform: uppercase;
}

.economics-finance-summary strong {
  margin: 8px 0 5px;
  color: var(--text);
  font: 750 clamp(16px, 1.8vw, 22px)/1.15 var(--mono);
  letter-spacing: -.035em;
}

.economics-finance-summary small {
  color: var(--dim);
  font-size: 10px;
}

.economics-finance-summary .state-positive {
  border-color: rgba(var(--good-rgb), .28);
  background: rgba(var(--good-rgb), .045);
}

.economics-finance-summary .state-positive strong {
  color: var(--good);
}

.economics-finance-summary .state-negative {
  border-color: rgba(var(--bad-rgb), .32);
  background: rgba(var(--bad-rgb), .05);
}

.economics-finance-summary .state-negative strong {
  color: var(--bad);
}

.economics-finance-summary .state-neutral {
  border-color: var(--line-strong);
  background: var(--panel);
}

.economics-result-grid article > small {
  display: block;
  color: var(--dim);
  font-size: 10px;
}

.economics-bottom-line {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 18px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.economics-bottom-line > div {
  min-width: 0;
  padding: 14px 10px 14px 0;
}

.economics-bottom-line > div + div {
  padding-left: 10px;
  border-left: 1px solid var(--line);
}

.economics-bottom-line strong {
  display: block;
  margin-top: 6px;
  color: var(--text);
  font: 12px/1.45 var(--mono);
}

.economics-verdict {
  margin: 16px 0 12px;
  color: var(--muted);
  font-size: 12px;
}

.economics-results > .tool-links {
  margin-top: 10px;
}

.economics-results .more[hidden] {
  display: none;
}

.economics-caveat {
  display: grid;
  grid-template-columns: minmax(220px, .62fr) minmax(0, 1.38fr);
  gap: 26px;
  align-items: start;
  margin-top: 14px;
  padding: 22px;
  border: 1px solid rgba(var(--warn-rgb), .25);
  border-left: 4px solid var(--warn);
  border-radius: 14px;
  background: rgba(var(--warn-rgb), .045);
}

.economics-caveat-title span {
  display: block;
  margin-bottom: 9px;
  color: var(--warn);
  font: 9px var(--mono);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.economics-caveat-title strong {
  display: block;
  color: var(--warn);
  font-size: 16px;
  line-height: 1.35;
}

.economics-caveat-copy {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 24px;
}

.economics-caveat-copy p:first-child {
  grid-column: 1 / -1;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(var(--surface-rgb), .08);
}

.economics-caveat p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.economics-caveat a {
  color: var(--warn);
  font-weight: 700;
  text-decoration: none;
}

.economics-caveat a:hover {
  text-decoration: underline;
}

.economics-deal {
  display: grid;
  grid-template-columns: minmax(260px, .78fr) minmax(0, 1.22fr);
  gap: 22px 28px;
  align-items: start;
  margin-top: 14px;
  padding: 24px;
  border: 1px solid rgba(var(--good-rgb), .34);
  border-left: 4px solid var(--good);
  border-radius: 16px;
  background:
    radial-gradient(circle at 90% 10%, rgba(var(--good-rgb), .12), transparent 40%),
    rgba(var(--good-rgb), .045);
  box-shadow: var(--shadow);
}

.economics-deal[hidden] {
  display: none;
}

.economics-deal h3 {
  margin: 13px 0 8px;
  font-size: clamp(20px, 2.4vw, 30px);
  line-height: 1.1;
}

.economics-deal > div > p,
.economics-deal-gate {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.economics-deal-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  border: 1px solid var(--line);
  background: var(--line);
}

.economics-deal-metrics p {
  min-width: 0;
  padding: 15px;
  background: var(--deep-panel);
}

.economics-deal-metrics span,
.economics-deal-metrics strong {
  display: block;
}

.economics-deal-metrics span {
  color: var(--dim);
  font: 9px var(--mono);
  text-transform: uppercase;
}

.economics-deal-metrics strong {
  margin-top: 7px;
  color: var(--good);
  font: 700 16px/1.25 var(--mono);
}

.economics-deal-gate {
  grid-column: 1 / -1;
  padding-top: 18px;
  border-top: 1px solid rgba(var(--good-rgb), .2);
}

.economics-deal-gate strong {
  color: var(--text);
}

.team-economics-shell {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  align-items: start;
}

.team-economics-controls,
.team-economics-results {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(var(--solid-panel-rgb), .88);
  box-shadow: var(--shadow);
}

.team-economics-controls {
  overflow: hidden;
}

.team-economics-core {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  padding: 20px;
}

.team-economics-controls label {
  min-width: 0;
  color: var(--dim);
  font: 9px var(--mono);
  letter-spacing: .02em;
  text-transform: uppercase;
}

.team-economics-core > label {
  padding: 13px;
  border: 1px solid rgba(var(--surface-rgb), .075);
  border-radius: 11px;
  background: rgba(var(--surface-rgb), .025);
}

.team-economics-controls label > small,
.team-economics-controls article > small {
  display: block;
  margin-top: 7px;
  color: var(--dim);
  font: 10px/1.45 var(--sans);
  letter-spacing: 0;
  text-transform: none;
}

.team-economics-controls select,
.team-economics-controls input[type="number"] {
  width: 100%;
  min-width: 0;
  height: 41px;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 0 10px;
  color: var(--text);
  background: var(--control-bg);
  font: 12px var(--mono);
}

.team-economics-controls select {
  appearance: none;
  padding-right: 34px;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--muted) 50%),
    linear-gradient(135deg, var(--muted) 50%, transparent 50%);
  background-position: calc(100% - 15px) 17px, calc(100% - 10px) 17px;
  background-repeat: no-repeat;
  background-size: 5px 5px, 5px 5px;
}

.team-economics-controls select:focus,
.team-economics-controls input:focus {
  border-color: var(--good);
  outline: none;
}

.team-economics-controls option:disabled {
  color: var(--dim);
  background: var(--control-surface);
}

.team-workload-mix {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  min-width: 0;
  margin: 0;
  padding: 20px;
  border: 0;
  border-top: 1px solid var(--line);
}

.team-workload-mix legend {
  grid-column: 1 / -1;
  width: 100%;
  padding: 0 0 4px;
  color: var(--text);
  font: 700 12px var(--mono);
  text-transform: uppercase;
}

.team-workload-mix article {
  min-width: 0;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--deep-panel);
}

.team-workload-mix article > div {
  display: flex;
  gap: 10px;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 12px;
}

.team-workload-mix article > div span {
  color: var(--text);
  font-weight: 800;
}

.team-workload-mix article > div small {
  margin: 0;
  color: var(--good);
  font: 700 8px var(--mono);
  letter-spacing: .035em;
  text-transform: uppercase;
}

.team-workload-mix label {
  display: block;
  margin-top: 10px;
}

.team-allocation-section {
  padding: 20px;
  border-top: 1px solid var(--line);
}

.team-allocation-leading {
  margin-bottom: 18px;
  padding: 0 0 18px;
  border-top: 0;
  border-bottom: 1px solid var(--line);
}

.team-allocation-section > div:first-child {
  display: flex;
  gap: 16px;
  align-items: baseline;
  justify-content: space-between;
}

.team-allocation-section h3,
.team-allocation-section p {
  margin: 0;
}

.team-allocation-section h3 {
  font-size: 15px;
  letter-spacing: -.02em;
}

.team-allocation-section p {
  color: var(--dim);
  font-size: 10px;
}

.team-economics-results {
  padding: 22px;
  border-color: rgba(var(--good-rgb), .18);
}

.team-economics-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin-top: 18px;
  border: 1px solid var(--line);
  background: var(--line);
}

.team-economics-metrics article {
  min-width: 0;
  padding: 15px;
  background: var(--deep-panel);
}

.team-economics-metrics .primary-result {
  grid-column: 1 / -1;
}

.team-economics-metrics span,
.team-economics-metrics strong,
.team-economics-metrics small {
  display: block;
}

.team-economics-metrics span,
.team-allocation span {
  color: var(--dim);
  font: 9px var(--mono);
  text-transform: uppercase;
}

.team-economics-metrics strong {
  margin: 7px 0 4px;
  color: var(--text);
  font: 700 18px/1.2 var(--mono);
}

.team-economics-metrics .primary-result strong {
  color: var(--good);
  font-size: clamp(34px, 5vw, 54px);
}

.team-economics-metrics small,
.team-allocation small {
  color: var(--dim);
  font-size: 10px;
}

.team-allocation {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 14px;
}

.team-allocation > div {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(var(--surface-rgb), .025);
}

.team-allocation strong {
  display: block;
  margin: 5px 0 8px;
  color: var(--text);
  font: 700 15px var(--mono);
}

.team-allocation i {
  display: block;
  height: 7px;
  margin-bottom: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(var(--surface-rgb), .11);
}

.team-allocation b {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: var(--good);
  transition: width .18s ease;
}

.team-economics-gate {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  margin-top: 14px;
  padding: 18px;
  border: 1px solid rgba(var(--warn-rgb), .25);
  border-radius: 14px;
  background: rgba(var(--warn-rgb), .045);
}

.team-economics-gate p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.team-economics-gate strong {
  color: var(--text);
}

.cloud-fit-ladder {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.cloud-fit-ladder article {
  min-width: 0;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(var(--surface-rgb), .03);
}

.cloud-fit-ladder span {
  color: var(--good);
  font: 10px var(--mono);
  text-transform: uppercase;
}

.cloud-fit-ladder h3 {
  margin: 11px 0 7px;
  font-size: 19px;
}

.cloud-fit-ladder p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.price-method-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.price-links {
  margin-top: 22px;
}

.inline-more {
  display: inline;
  color: var(--good);
  font-weight: 750;
  text-decoration: none;
}

.inline-more:hover {
  text-decoration: underline;
}

@media (max-width: 900px) {
  .cloud-gate-grid,
  .tinygrad-principles,
  .cloud-fit-ladder,
  .provider-scale-flow,
  .support-program-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cloud-platform-grid,
  .compute-cost-method {
    grid-template-columns: 1fr;
  }

  .cloud-watch,
  .colo-recommendation,
  .economics-shell,
  .team-economics-shell,
  .scaling-effect {
    grid-template-columns: 1fr;
  }

  .team-economics-core {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cloud-model-card.featured-video-card {
    grid-template-columns: 1fr;
  }

  .nvidia-evolution {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .rubin-verdict-grid,
  .rubin-driver-grid,
  .rubin-chart-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .rubin-chart-grid {
    grid-template-columns: 1fr;
  }

  .rubin-method-note,
  .rubin-lut-example {
    grid-template-columns: 1fr;
  }

  .rubin-lut-example > div:last-child {
    padding-top: 18px;
    padding-left: 0;
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .client-software-questions,
  .economics-caveat,
  .economics-deal {
    grid-template-columns: 1fr;
  }

  .economics-caveat-copy {
    grid-template-columns: 1fr;
  }

  .economics-caveat-copy p:first-child {
    grid-column: auto;
  }

  .economics-deal-gate {
    grid-column: auto;
  }

  .colo-recommendation .tool-links {
    justify-content: flex-start;
  }

  .hgx-dgx-widget article {
    padding-top: 18px;
    padding-left: 0;
    border-top: 1px solid rgba(var(--good-rgb), .22);
    border-left: 0;
  }
}

@media (max-width: 700px) {
  .cloud-model-grid,
  .nvidia-evolution,
  .rubin-verdict-grid,
  .rubin-driver-grid,
  .tinygrad-grid,
  .cloud-gate-grid,
  .tinygrad-principles,
  .cloud-fit-ladder,
  .price-method-grid,
  .economics-controls,
  .economics-driver-controls,
  .economics-control-panel,
  .economics-advanced-group,
  .economics-bottom-line,
  .provider-scale-flow,
  .scale-facts,
  .support-program-grid,
  .support-scale-cases,
  .compute-reading {
    grid-template-columns: 1fr;
  }

  .team-economics-core,
  .team-workload-mix,
  .team-allocation,
  .economics-results-head,
  .economics-finance-summary,
  .economics-result-grid,
  .team-economics-metrics {
    grid-template-columns: 1fr;
  }

  .economics-result-grid .primary-result,
  .team-economics-metrics .primary-result {
    grid-column: auto;
  }

  .cloud-model-card,
  .tinygrad-card,
  .cloud-watch,
  .rubin-analysis,
  .rubin-chart,
  .economics-controls,
  .economics-results {
    padding: 19px;
  }

  .team-economics-controls,
  .team-economics-results {
    border-radius: 14px;
  }

  .team-economics-core,
  .team-workload-mix,
  .team-economics-results {
    padding: 19px;
  }

  .team-allocation-section:not(.team-allocation-leading) {
    padding: 19px;
  }

  .economics-controls {
    padding: 0;
  }

  .economics-results-head .economics-mode,
  .economics-results-head .economics-mode > div {
    width: 100%;
  }

  .economics-results-head .economics-mode button {
    flex: 1;
  }

  .team-allocation-section > div:first-child {
    display: grid;
    gap: 5px;
  }

  .economics-bottom-line > div + div {
    padding-left: 0;
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .cloud-model-card > p {
    min-height: 0;
  }

  .cloud-watch h3 {
    font-size: 22px;
  }

  .rubin-analysis {
    padding: 19px;
  }

  .rubin-bar {
    grid-template-columns: 80px minmax(60px, 1fr) 64px;
  }

  .rubin-data-table .table-scroll {
    overflow-x: auto;
  }

  .rubin-data-table .implementation-table {
    display: table;
    width: 100%;
  }

  .rubin-data-table .implementation-table caption {
    display: table-caption;
  }

  .rubin-data-table .implementation-table thead {
    position: static;
    display: table-header-group;
    width: auto;
    height: auto;
    overflow: visible;
    clip: auto;
  }

  .rubin-data-table .implementation-table tbody {
    display: table-row-group;
    width: auto;
  }

  .rubin-data-table .implementation-table tr {
    display: table-row;
    width: auto;
    border-bottom: 0;
  }

  .rubin-data-table .implementation-table th,
  .rubin-data-table .implementation-table td {
    display: table-cell;
    width: auto;
  }

  .rubin-data-table .implementation-table td::before {
    display: none;
  }

  .provider-disclosure-summary,
  .provider-disclosure-body {
    padding: 19px;
  }

  .compute-legend,
  .compute-scale-control,
  .compute-group-label,
  .compute-axis {
    margin-left: 0;
  }

  .compute-row {
    grid-template-columns: 1fr;
    gap: 5px;
  }

  .compute-track {
    height: 40px;
  }

  .table-scroll {
    overflow: visible;
  }

  .rubin-data-table .table-scroll {
    overflow-x: auto;
  }
}

@media (max-width: 420px) {
  .cloud-card-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .cloud-model-card dl > div {
    grid-template-columns: 82px minmax(0, 1fr);
  }

  .economics-mode {
    display: grid;
    width: 100%;
    border-radius: 14px;
  }

  .economics-control-tabs {
    display: grid;
    width: 100%;
    border-radius: 14px;
  }

  .economics-planner-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: auto;
    margin-left: 8px;
  }

  .economics-planner-tabs button,
  .economics-control-tabs button {
    width: 100%;
  }

  .economics-planner-tabs button {
    padding: 0 8px;
  }

  .economics-mode button {
    width: 100%;
  }

  .economics-result-grid {
    grid-template-columns: 1fr;
  }

  .economics-result-grid .primary-result {
    grid-column: auto;
  }

  .economics-deal-metrics {
    grid-template-columns: 1fr;
  }

  .team-economics-metrics {
    grid-template-columns: 1fr;
  }

  .team-economics-metrics .primary-result {
    grid-column: auto;
  }

  .team-economics-gate {
    flex-direction: column;
  }
}

/* Organizational adoption */
.adoption-page .adoption-hero {
  grid-template-columns: minmax(0, 1.08fr) minmax(340px, .72fr);
  align-items: stretch;
  padding-bottom: 72px;
}

.adoption-page .adoption-hero > section {
  align-self: start;
}

.adoption-page .adoption-hero h1 {
  max-width: 11.5ch;
  font-size: clamp(50px, 6.5vw, 92px);
}

.adoption-page .hero-note {
  max-width: 700px;
}

.adoption-compass {
  position: relative;
  display: grid;
  grid-template-rows: auto 1fr auto;
  overflow: hidden;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 82% 8%, rgba(var(--good-rgb), .2), transparent 18rem),
    linear-gradient(180deg, rgba(var(--surface-rgb), .1), rgba(var(--surface-rgb), .045));
  box-shadow: var(--shadow);
}

.adoption-compass::after {
  content: "";
  position: absolute;
  right: -70px;
  bottom: -100px;
  width: 260px;
  height: 260px;
  border: 1px solid rgba(var(--blue-rgb), .14);
  border-radius: 50%;
  box-shadow: 0 0 0 34px rgba(var(--blue-rgb), .035), 0 0 0 72px rgba(var(--purple-rgb), .025);
  pointer-events: none;
}

.compass-head {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
  font: 700 11px var(--mono);
  text-transform: uppercase;
  letter-spacing: .04em;
}

.compass-head span {
  color: var(--good);
}

.compass-head small {
  color: var(--dim);
  font: inherit;
  text-align: right;
}

.compass-stages {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 0;
  margin: 18px 0;
  padding: 0;
  list-style: none;
}

.compass-stages::before {
  content: "";
  position: absolute;
  top: 22px;
  bottom: 22px;
  left: 20px;
  width: 1px;
  background: linear-gradient(var(--good), var(--blue), var(--purple));
  opacity: .65;
}

.compass-stages li {
  position: relative;
  display: grid;
  grid-template-columns: 42px 1fr;
  align-items: center;
  gap: 13px;
  margin: 0;
  padding: 9px 0;
}

.compass-stages li > span {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--good);
  background: var(--deep-panel);
  font: 700 10px var(--mono);
}

.compass-stages li div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 4px 0 8px;
  border-bottom: 1px solid rgba(var(--surface-rgb), .08);
}

.compass-stages li:last-child div {
  border-bottom: 0;
}

.compass-stages strong {
  font-size: 17px;
  letter-spacing: -.025em;
}

.compass-stages small {
  color: var(--dim);
  font: 10px var(--mono);
  text-transform: uppercase;
}

.compass-question {
  position: relative;
  z-index: 1;
  margin: 0;
  padding: 17px;
  border: 1px solid rgba(var(--good-rgb), .2);
  border-radius: 15px;
  color: var(--muted);
  background: rgba(var(--dark-panel-rgb), .5);
  font-size: 14px;
}

.compass-question strong {
  color: var(--text);
}

.journey-section {
  border-top: 1px solid rgba(var(--surface-rgb), .08);
  border-bottom: 1px solid rgba(var(--surface-rgb), .08);
  background: rgba(var(--surface-rgb), .018);
}

.adoption-rail {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-top: 32px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(var(--dark-panel-rgb), .38);
  box-shadow: 0 16px 50px rgba(0, 0, 0, .2);
}

.adoption-rail a {
  position: relative;
  display: grid;
  align-content: start;
  min-height: 170px;
  padding: 22px 19px;
  text-decoration: none;
  transition: background .2s ease;
}

.adoption-rail a + a {
  border-left: 1px solid var(--line);
}

.adoption-rail a::after {
  content: "→";
  position: absolute;
  top: 48%;
  right: -11px;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--good);
  background: var(--deep-panel);
  font: 12px var(--mono);
}

.adoption-rail a:last-child::after {
  display: none;
}

.adoption-rail a:hover {
  background: rgba(var(--surface-rgb), .055);
}

.adoption-rail span {
  color: var(--good);
  font: 700 11px var(--mono);
}

.adoption-rail strong {
  margin-top: 26px;
  font-size: 22px;
  letter-spacing: -.04em;
}

.adoption-rail small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.journey-rule {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 20px;
  margin-top: 20px;
  padding: 17px 20px;
  border: 1px solid rgba(var(--blue-rgb), .18);
  border-radius: 16px;
  background: rgba(var(--blue-rgb), .045);
}

.journey-rule .tag {
  margin: 0;
}

.journey-rule p {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 9px;
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.journey-rule strong {
  color: var(--text);
}

.journey-rule i {
  color: var(--good);
  font-style: normal;
}

.adoption-stage {
  --stage-accent: var(--good);
  position: relative;
  padding: 76px 0;
}

.adoption-stage + .adoption-stage {
  border-top: 1px solid rgba(var(--surface-rgb), .07);
}

.stage-walk {
  --stage-accent: var(--blue);
  background: linear-gradient(90deg, rgba(var(--blue-rgb), .045), transparent 46%);
}

.stage-engineer {
  --stage-accent: var(--warn);
  background: linear-gradient(90deg, rgba(var(--warn-rgb), .05), transparent 46%);
}

.stage-run {
  --stage-accent: var(--purple);
  background: linear-gradient(90deg, rgba(var(--purple-rgb), .05), transparent 46%);
}

.stage-fly {
  background: linear-gradient(90deg, rgba(var(--good-rgb), .05), transparent 46%);
}

.stage-shell {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  gap: 38px;
}

.stage-marker {
  position: sticky;
  top: 126px;
  align-self: start;
  display: grid;
  padding-top: 4px;
}

.stage-marker::after {
  content: "";
  width: 1px;
  height: 76px;
  margin: 18px 0 0 14px;
  background: linear-gradient(var(--stage-accent), transparent);
}

.stage-marker span {
  color: var(--stage-accent);
  font: 800 clamp(38px, 5vw, 62px)/.9 var(--mono);
  letter-spacing: -.08em;
}

.stage-marker strong {
  margin-top: 12px;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: .12em;
}

.stage-marker small {
  margin-top: 2px;
  color: var(--dim);
  font: 9px var(--mono);
  text-transform: uppercase;
}

.stage-content {
  min-width: 0;
}

.stage-content .tag {
  color: var(--stage-accent);
}

.stage-lede {
  max-width: 900px;
  margin: 0 0 24px;
  color: var(--lead);
  font-size: clamp(18px, 2.1vw, 24px);
  line-height: 1.45;
  letter-spacing: -.02em;
}

.stage-grid,
.engineering-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.stage-grid .card,
.engineering-grid .card {
  min-height: 100%;
}

.compact-list {
  display: grid;
  gap: 9px;
  margin-top: 15px;
  padding: 0;
  list-style: none;
}

.compact-list li {
  position: relative;
  margin: 0;
  padding: 0 0 9px 19px;
  border-bottom: 1px solid rgba(var(--surface-rgb), .07);
}

.compact-list li:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.compact-list li::before {
  content: "↳";
  position: absolute;
  left: 0;
  color: var(--stage-accent);
  font-family: var(--mono);
}

.signal-list {
  display: grid;
  gap: 9px;
  margin: 15px 0 0;
  padding: 0;
  list-style: none;
}

.signal-list li {
  display: grid;
  grid-template-columns: 24px 1fr;
  gap: 9px;
  align-items: start;
  margin: 0;
  padding: 10px 0;
  border-top: 1px solid rgba(var(--surface-rgb), .07);
  color: var(--muted);
}

.signal-list span {
  color: var(--good);
  font: 800 15px var(--mono);
}

.signal-list .not-yet span {
  color: var(--warn);
}

.success-bar {
  display: grid;
  grid-template-columns: 128px minmax(0, 1fr);
  align-items: center;
  gap: 20px;
  margin-top: 16px;
  padding: 19px 22px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--stage-accent);
  border-radius: 14px;
  background: rgba(var(--surface-rgb), .045);
}

.success-bar > span,
.micro-label {
  color: var(--stage-accent);
  font: 750 10px var(--mono);
  text-transform: uppercase;
  letter-spacing: .06em;
}

.success-bar p {
  margin: 0;
  color: var(--muted);
  font-size: 17px;
}

.success-bar strong {
  color: var(--text);
}

.activity-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 18px;
}

.activity-cloud span {
  padding: 8px 10px;
  border: 1px solid rgba(var(--blue-rgb), .22);
  border-radius: 999px;
  color: var(--blue);
  background: rgba(var(--blue-rgb), .07);
  font-size: 12px;
}

.stage-test {
  display: grid;
  align-content: start;
  gap: 12px;
  background: linear-gradient(145deg, rgba(var(--blue-rgb), .12), rgba(var(--surface-rgb), .045));
}

.test-question {
  margin: 0 !important;
  color: var(--text) !important;
  font-size: clamp(22px, 3vw, 32px);
  line-height: 1.12;
  letter-spacing: -.04em;
}

.stage-test .muted {
  margin-top: 4px;
  font-size: 13px;
}

.failure-note {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  align-items: center;
  margin: 0 0 18px;
  padding: 14px 17px;
  border: 1px solid rgba(var(--warn-rgb), .25);
  border-radius: 13px;
  background: rgba(var(--warn-rgb), .065);
}

.failure-note strong {
  color: var(--warn);
  font: 800 11px var(--mono);
  text-transform: uppercase;
}

.failure-note span {
  color: var(--muted);
  font-size: 13px;
}

.engineer-questions ol {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
  counter-reset: engineer;
}

.engineer-questions li {
  display: grid;
  gap: 3px;
  margin: 0;
  padding: 11px;
  border: 1px solid rgba(var(--surface-rgb), .08);
  border-radius: 10px;
  color: var(--muted);
  background: var(--inset-surface);
  font-size: 12px;
}

.engineer-questions li span {
  color: var(--warn);
  font: 750 9px var(--mono);
  text-transform: uppercase;
}

.card-note {
  margin-top: 18px !important;
  padding-top: 14px;
  border-top: 1px solid var(--line);
  color: var(--text) !important;
  font-weight: 700;
}

.run-map {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin: 22px 0 16px;
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
  background: rgba(var(--surface-rgb), .035);
}

.run-map div {
  display: grid;
  gap: 20px;
  min-height: 135px;
  padding: 18px;
}

.run-map div + div {
  border-left: 1px solid var(--line);
}

.run-map span {
  color: var(--purple);
  font: 750 10px var(--mono);
  text-transform: uppercase;
}

.run-map strong {
  align-self: end;
  font-size: 14px;
  line-height: 1.3;
}

.scale-priorities {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.scale-priorities article {
  display: grid;
  gap: 5px;
  padding: 16px;
  border: 1px solid rgba(var(--purple-rgb), .16);
  border-radius: 14px;
  background: rgba(var(--purple-rgb), .045);
}

.scale-priorities span {
  color: var(--purple);
  font: 700 9px var(--mono);
}

.scale-priorities strong {
  font-size: 14px;
}

.scale-priorities small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
}

.coe-panel {
  display: grid;
  grid-template-columns: .82fr 1.18fr;
  gap: 28px;
  padding: 28px;
  border: 1px solid rgba(var(--good-rgb), .2);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 0% 100%, rgba(var(--good-rgb), .12), transparent 25rem),
    linear-gradient(145deg, rgba(var(--surface-rgb), .09), rgba(var(--surface-rgb), .035));
  box-shadow: var(--shadow);
}

.coe-intro {
  display: grid;
  align-content: center;
  gap: 16px;
}

.coe-intro .quote {
  font-size: clamp(31px, 4.1vw, 52px);
}

.coe-intro .muted {
  margin: 0;
  font-size: 14px;
}

.coe-responsibilities {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.coe-responsibilities > div {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 10px;
  padding: 14px;
  border: 1px solid rgba(var(--surface-rgb), .09);
  border-radius: 12px;
  background: rgba(var(--dark-panel-rgb), .35);
}

.coe-responsibilities span {
  color: var(--good);
  font: 700 9px var(--mono);
}

.coe-responsibilities p {
  display: grid;
  gap: 2px;
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.coe-responsibilities strong {
  color: var(--text);
  font-size: 13px;
}

.operating-section {
  border-top: 1px solid rgba(var(--surface-rgb), .08);
  border-bottom: 1px solid rgba(var(--surface-rgb), .08);
  background: rgba(var(--surface-rgb), .022);
}

.operating-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.operating-grid .card {
  position: relative;
  overflow: hidden;
}

.operating-grid .card::after {
  content: "";
  position: absolute;
  right: -42px;
  bottom: -58px;
  width: 150px;
  height: 150px;
  border: 1px solid rgba(var(--good-rgb), .08);
  border-radius: 50%;
}

.operating-icon {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  margin-bottom: 24px;
  border: 1px solid rgba(var(--good-rgb), .26);
  border-radius: 10px;
  color: var(--good);
  background: rgba(var(--good-rgb), .07);
  font: 800 12px var(--mono);
}

.transformation-equation {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin-top: 18px;
  padding: 21px;
  border: 1px solid var(--line);
  border-radius: 15px;
  color: var(--muted);
  background: rgba(var(--dark-panel-rgb), .35);
  font-size: 13px;
}

.transformation-equation i {
  color: var(--good);
  font-style: normal;
  font-family: var(--mono);
}

.transformation-equation strong {
  color: var(--text);
}

.adoption-evidence-section {
  padding: 72px 0;
  border-top: 1px solid rgba(var(--surface-rgb), .08);
  border-bottom: 1px solid rgba(var(--surface-rgb), .08);
  background:
    radial-gradient(circle at 9% 12%, rgba(var(--blue-rgb), .09), transparent 30rem),
    radial-gradient(circle at 88% 58%, rgba(var(--purple-rgb), .07), transparent 34rem),
    rgba(var(--surface-rgb), .018);
}

.adoption-evidence-section .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;
  white-space: nowrap !important;
  border: 0 !important;
}

.adoption-stat-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}

.adoption-stat-grid article {
  display: grid;
  align-content: start;
  min-width: 0;
  min-height: 184px;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 17px;
  background: linear-gradient(145deg, rgba(var(--surface-rgb), .075), rgba(var(--surface-rgb), .025));
}

.adoption-stat-grid article > span {
  color: var(--good);
  font: 800 10px/1.25 var(--mono);
  letter-spacing: .055em;
  text-transform: uppercase;
}

.adoption-stat-grid output {
  margin: 10px 0 5px;
  color: var(--text);
  font: 850 clamp(38px, 5vw, 60px)/.95 var(--mono);
  letter-spacing: -.075em;
}

.adoption-stat-grid p {
  margin: 0;
  color: var(--lead);
  font-size: 13px;
  line-height: 1.48;
}

.adoption-stat-grid small {
  align-self: end;
  margin-top: 14px;
  color: var(--dim);
  font: 750 9px/1.35 var(--mono);
  text-transform: uppercase;
}

.adoption-chart-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(320px, .9fr);
  gap: 14px;
  align-items: stretch;
}

.adoption-chart-panel {
  min-width: 0;
  margin: 0;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(var(--dark-panel-rgb), .4);
  box-shadow: 0 18px 58px rgba(0, 0, 0, .16);
}

.adoption-chart-panel figcaption {
  display: grid;
  gap: 7px;
  margin-bottom: 18px;
}

.adoption-chart-panel figcaption h3 {
  margin: 0;
  font-size: clamp(22px, 2.6vw, 31px);
  line-height: 1.05;
  letter-spacing: -.04em;
}

.adoption-chart-panel figcaption p {
  max-width: 780px;
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.adoption-map-panel {
  margin-top: 0;
}

.adoption-map-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 310px);
  align-items: end;
  gap: 14px;
  margin-bottom: 14px;
}

.adoption-map-layers {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.adoption-map-layers button,
.adoption-map-features button {
  border: 1px solid var(--line);
  color: var(--muted);
  background: rgba(var(--surface-rgb), .035);
  cursor: pointer;
}

.adoption-map-layers button {
  min-height: 40px;
  padding: 8px 12px;
  border-radius: 9px;
  font: 750 10px var(--mono);
}

.adoption-map-layers button:hover,
.adoption-map-features button:hover {
  border-color: var(--blue);
  color: var(--text);
}

.adoption-map-layers button.active,
.adoption-map-features button.active {
  border-color: var(--blue);
  color: var(--text);
  background: rgba(var(--blue-rgb), .1);
  box-shadow: inset 0 -3px 0 var(--blue);
}

.adoption-map-layers button.active::after {
  margin-left: 7px;
  content: "✓";
}

.adoption-map-features button.active::after {
  color: var(--text);
  content: "✓ Selected";
  font: 800 8px var(--mono);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.adoption-map-select {
  display: grid;
  gap: 5px;
  width: 100%;
  min-width: 0;
  justify-self: end;
}

.adoption-map-select span {
  color: var(--dim);
  font: 750 9px var(--mono);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.adoption-map-select select {
  width: 100%;
  min-height: 40px;
  padding: 8px 34px 8px 11px;
  border: 1px solid var(--line);
  border-radius: 9px;
  color: var(--text);
  background: var(--control-bg);
  font: 700 10px var(--mono);
}

.adoption-map-layout {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(250px, .72fr);
  min-height: 390px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 15px;
  background:
    linear-gradient(rgba(var(--surface-rgb), .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(var(--surface-rgb), .035) 1px, transparent 1px),
    rgba(var(--surface-rgb), .018);
  background-size: 48px 48px;
}

.adoption-map-viewport {
  position: relative;
  display: grid;
  place-items: center;
  min-width: 0;
  overflow: hidden;
  padding: 14px;
}

.adoption-map-viewport > img {
  display: block;
  width: 100%;
  height: auto;
  opacity: .78;
}

.adoption-map-viewport > p {
  position: absolute;
  margin: 0;
  color: var(--dim);
  font-size: 11px;
}

.adoption-map-viewport svg {
  display: block;
  width: 100%;
  height: auto;
  max-height: 390px;
  overflow: visible;
}

.adoption-map-point {
  color: var(--blue);
}

.adoption-map-point .map-dot {
  fill: var(--deep-panel);
  stroke: currentColor;
  stroke-width: 2.5;
  vector-effect: non-scaling-stroke;
}

.adoption-map-point.is-aggregate .map-dot {
  fill: rgba(var(--warn-rgb), .32);
  stroke: var(--warn);
}

.adoption-map-point.is-selected .map-dot {
  fill: var(--blue);
  stroke: var(--text);
  stroke-width: 3.5;
}

.map-crosshair {
  stroke: var(--text);
  stroke-width: 1.5;
  stroke-dasharray: 3 3;
  vector-effect: non-scaling-stroke;
}

.map-point-label {
  paint-order: stroke;
  fill: var(--text);
  stroke: var(--deep-panel);
  stroke-width: 5px;
  stroke-linejoin: round;
  font: 800 11px var(--mono);
}

.adoption-map-viewport svg[data-map-layer="europe"] .map-point-label {
  stroke-width: 1.7px;
  font-size: 4px;
}

.adoption-map-scale {
  position: absolute;
  left: 16px;
  bottom: 13px;
  display: grid;
  gap: 1px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  background: rgba(var(--dark-panel-rgb), .82);
  backdrop-filter: blur(8px);
  font: 750 9px var(--mono);
}

.adoption-map-scale small {
  color: var(--dim);
  font-size: 8px;
}

.adoption-map-reading {
  display: grid;
  align-content: center;
  gap: 9px;
  padding: 28px;
  border-left: 1px solid var(--line);
  background: rgba(var(--dark-panel-rgb), .58);
}

.adoption-map-reading > span {
  color: var(--blue);
  font: 800 9px var(--mono);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.adoption-map-reading > strong {
  display: grid;
  gap: 4px;
  font-size: 17px;
}

.adoption-map-reading b {
  color: var(--text);
  font: 850 38px/.95 var(--mono);
  letter-spacing: -.06em;
}

.adoption-map-reading p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.adoption-map-reading small {
  color: var(--dim);
  font-size: 9px;
}

.adoption-map-features {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}

.adoption-map-features button {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 12px 13px;
  border-radius: 10px;
  text-align: left;
}

.adoption-map-features span,
.adoption-map-features small {
  color: var(--dim);
  font: 750 8px var(--mono);
  text-transform: uppercase;
}

.adoption-map-features strong {
  color: var(--text);
  font-size: 12px;
}

.adoption-map-features b {
  color: var(--blue);
  font: 850 15px var(--mono);
}

.diffusion-key {
  display: flex;
  justify-content: flex-end;
  gap: 18px;
  margin: -3px 0 12px;
  color: var(--dim);
  font: 750 9px var(--mono);
  text-transform: uppercase;
}

.diffusion-key span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.diffusion-key span::before,
.diffusion-marker {
  display: block;
  width: 10px;
  height: 10px;
  border: 2px solid var(--blue);
  background: var(--deep-panel);
}

.diffusion-key .h1-key::before,
.h1-marker {
  border-radius: 50%;
}

.diffusion-key .h2-key::before,
.h2-marker {
  border-radius: 2px;
  border-color: var(--good);
  background: var(--good);
}

.diffusion-bars {
  display: grid;
  gap: 9px;
}

.diffusion-row {
  display: grid;
  grid-template-columns: minmax(118px, .8fr) minmax(160px, 1.6fr) 82px;
  gap: 12px;
  align-items: center;
  min-width: 0;
}

.diffusion-name {
  min-width: 0;
  overflow: hidden;
  font-size: 11px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.diffusion-track {
  position: relative;
  height: 1px;
  background: var(--line);
}

.diffusion-track::before {
  position: absolute;
  inset: -4px auto -4px 0;
  width: 1px;
  content: "";
  background: var(--dim);
  opacity: .45;
}

.diffusion-marker {
  position: absolute;
  top: 50%;
  z-index: 1;
  transform: translate(-50%, -50%);
}

.diffusion-values {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px;
  text-align: right;
}

.diffusion-values b {
  font: 800 11px var(--mono);
}

.diffusion-values small {
  color: var(--good);
  font: 750 8px var(--mono);
  white-space: nowrap;
}

.organization-chart {
  display: grid;
  gap: 16px;
  margin-top: 8px;
}

.chart-source-note {
  margin: 16px 0 0;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  color: var(--dim);
  font-size: 9px;
  line-height: 1.5;
}

.organization-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

.organization-year {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
}

.organization-year > strong {
  color: var(--dim);
  font: 800 10px var(--mono);
}

.organization-bars {
  display: grid;
  gap: 7px;
}

.organization-bar {
  position: relative;
  min-height: 34px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(var(--surface-rgb), .025);
}

.organization-fill {
  position: absolute;
  inset: 0 auto 0 0;
  background:
    repeating-linear-gradient(135deg, transparent 0 8px, rgba(var(--surface-rgb), .12) 8px 10px),
    rgba(var(--good-rgb), .22);
}

.organization-bar.generative_ai .organization-fill {
  background:
    repeating-linear-gradient(90deg, transparent 0 5px, rgba(var(--surface-rgb), .13) 5px 7px),
    rgba(var(--blue-rgb), .2);
}

.organization-bar b {
  position: relative;
  z-index: 1;
  display: block;
  padding: 8px 10px;
  font: 800 10px var(--mono);
}

.adoption-depth-grid {
  margin-top: 14px;
}

.adoption-gap-chart {
  display: grid;
  gap: 17px;
  margin-top: 5px;
}

.adoption-gap-row {
  display: grid;
  gap: 7px;
}

.adoption-gap-label,
.codex-milestone-meta {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.adoption-gap-label strong {
  color: var(--text);
  font-size: 11px;
}

.adoption-gap-label b {
  color: var(--good);
  font: 850 15px var(--mono);
}

.adoption-gap-track,
.codex-track {
  position: relative;
  display: block;
  height: 12px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(var(--surface-rgb), .025);
}

.adoption-gap-fill,
.codex-fill {
  position: absolute;
  inset: 0 auto 0 0;
  display: block;
  border-radius: inherit;
  background:
    repeating-linear-gradient(135deg, transparent 0 7px, rgba(var(--surface-rgb), .19) 7px 9px),
    rgba(var(--good-rgb), .72);
}

.gap-ebit_impact .adoption-gap-fill {
  background:
    repeating-linear-gradient(90deg, transparent 0 5px, rgba(var(--surface-rgb), .17) 5px 7px),
    rgba(var(--blue-rgb), .72);
}

.gap-high_performer .adoption-gap-fill {
  background:
    repeating-linear-gradient(45deg, transparent 0 4px, rgba(var(--surface-rgb), .2) 4px 6px),
    rgba(var(--purple-rgb), .72);
}

.adoption-gap-row small {
  color: var(--muted);
  font-size: 10px;
}

.business-use-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 16px;
  margin-top: 22px;
  padding: 15px;
  border: 1px solid rgba(var(--blue-rgb), .26);
  border-radius: 11px;
  background: rgba(var(--blue-rgb), .045);
}

.business-use-strip span {
  color: var(--muted);
  font-size: 10px;
}

.business-use-strip strong {
  display: block;
  color: var(--blue);
  font: 850 18px var(--mono);
}

.business-use-strip small {
  grid-column: 1 / -1;
  padding-top: 8px;
  border-top: 1px solid var(--line);
  color: var(--dim);
  font-size: 9px;
}

.codex-adoption-chart {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(230px, .74fr) minmax(0, 1fr);
  gap: 12px;
  align-items: stretch;
}

.codex-panel {
  margin-top: 14px;
}

.codex-panel-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  align-items: stretch;
}

.codex-series,
.codex-distribution-event {
  min-width: 0;
  padding: 15px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: rgba(var(--surface-rgb), .025);
}

.codex-series + .codex-series {
  padding-top: 15px;
  border-top: 1px solid var(--line);
}

.codex-distribution-event {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 12px;
  padding: 15px;
  border-color: rgba(var(--warn-rgb), .42);
  border-left-width: 4px;
  border-radius: 10px;
  background: rgba(var(--warn-rgb), .055);
}

.codex-distribution-event strong,
.codex-distribution-event time {
  color: var(--warn);
  font: 800 9px/1.4 var(--mono);
  letter-spacing: .035em;
  text-transform: uppercase;
}

.codex-distribution-event p,
.codex-distribution-event small {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--muted);
  font-size: 9px;
}

.codex-distribution-event small {
  color: var(--dim);
}

.codex-series h4 {
  margin: 0 0 11px;
  color: var(--text);
  font-size: 12px;
}

.codex-milestones {
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.codex-milestone {
  display: grid;
  gap: 6px;
  margin: 0;
}

.codex-milestone time,
.codex-milestone strong {
  font: 800 10px var(--mono);
}

.codex-milestone time {
  color: var(--dim);
}

.codex-milestone strong {
  color: var(--good);
}

.codex-milestone small {
  color: var(--muted);
  font-size: 9px;
}

.codex_chatgpt_work_active .codex-fill {
  background:
    repeating-linear-gradient(90deg, transparent 0 5px, rgba(var(--surface-rgb), .18) 5px 7px),
    rgba(var(--purple-rgb), .72);
}

.codex_chatgpt_work_active .codex-milestone strong {
  color: var(--purple);
}

.frontier-telemetry-panel {
  margin-top: 14px;
}

.frontier-telemetry-head {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr);
  gap: 24px;
  align-items: end;
  margin-bottom: 18px;
}

.frontier-telemetry-head h3 {
  margin: 6px 0 0;
  font-size: clamp(22px, 2.6vw, 31px);
  line-height: 1.05;
  letter-spacing: -.04em;
}

.frontier-telemetry-head > p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.frontier-telemetry-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.frontier-telemetry-grid article {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  min-width: 0;
  padding: 17px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: rgba(var(--surface-rgb), .025);
}

.frontier-telemetry-grid header {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 9px;
  align-items: baseline;
  padding-bottom: 11px;
  border-bottom: 1px solid var(--line);
}

.frontier-telemetry-grid header span,
.frontier-telemetry-grid header small {
  color: var(--dim);
  font: 750 8px var(--mono);
  text-transform: uppercase;
  white-space: nowrap;
}

.frontier-telemetry-grid header span {
  color: var(--good);
}

.frontier-telemetry-grid h4 {
  margin: 0;
  font-size: 15px;
}

.telemetry-sample {
  margin: 11px 0 13px;
  color: var(--muted);
  font-size: 10px;
}

.frontier-telemetry-grid dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin: 0;
}

.frontier-telemetry-grid dl > div {
  display: flex;
  min-width: 0;
  min-height: 98px;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 9px;
  flex-direction: column-reverse;
  justify-content: space-between;
  background: rgba(var(--dark-panel-rgb), .34);
}

.frontier-telemetry-grid dt {
  color: var(--muted);
  font-size: 9px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.frontier-telemetry-grid dd {
  margin: 0 0 10px;
  color: var(--text);
  font: 850 clamp(18px, 2vw, 25px)/1 var(--mono);
  letter-spacing: -.04em;
}

.telemetry-caveat {
  margin: 12px 0 0;
  color: var(--dim);
  font-size: 9px;
}

.market-share-panel {
  margin-top: 14px;
}

.market-filter {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
  margin: -2px 0 10px;
}

.market-filter > span {
  margin-right: 4px;
  color: var(--dim);
  font: 800 9px var(--mono);
  letter-spacing: .05em;
  text-transform: uppercase;
}

.market-filter button {
  min-height: 38px;
  padding: 8px 11px;
  border: 1px solid var(--line);
  border-radius: 9px;
  color: var(--muted);
  background: rgba(var(--surface-rgb), .035);
  font: 750 10px var(--mono);
  cursor: pointer;
}

.market-filter button:hover {
  border-color: rgba(var(--good-rgb), .42);
  color: var(--text);
}

.market-filter button.active {
  border-color: var(--good);
  color: var(--text);
  background: rgba(var(--good-rgb), .09);
}

.market-filter button.active::after {
  margin-left: 7px;
  color: var(--good);
  content: "✓";
}

.market-share-chart {
  width: 100%;
  min-height: 360px;
}

.market-share-chart svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}

.market-gridline {
  stroke: var(--line);
  stroke-width: 1;
}

.market-axis-label,
.market-endpoint {
  fill: var(--muted);
  font: 750 10px var(--mono);
}

.market-endpoint {
  fill: var(--text);
  font-size: 10.5px;
}

.market-endpoint-leader {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
}

.market-line {
  fill: none;
  stroke: currentColor;
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.market-marker {
  fill: var(--deep-panel);
  stroke: currentColor;
  stroke-width: 3;
  vector-effect: non-scaling-stroke;
}

path.market-marker {
  stroke-linecap: round;
  stroke-linejoin: round;
}

.pattern-long-dash { stroke-dasharray: 16 8; }
.pattern-dot { stroke-dasharray: 2 8; }
.pattern-dash-dot { stroke-dasharray: 16 6 2 6; }
.pattern-short-dash { stroke-dasharray: 7 6; }

.series-chatgpt { color: var(--good); }
.series-gemini { color: var(--blue); }
.series-claude { color: var(--purple); }
.series-grok { color: var(--warn); }
.series-perplexity { color: var(--bad); }

[data-market-series] {
  transition: opacity .18s ease;
}

[data-market-series].is-muted {
  opacity: .12;
}

[data-market-series].is-highlighted .market-line {
  stroke-width: 6;
}

.market-share-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 9px 18px;
  margin: 6px 0 0;
  padding: 14px 0 0;
  border-top: 1px solid var(--line);
  list-style: none;
}

.market-share-legend li {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  color: var(--muted);
  font-size: 10px;
}

.legend-pattern {
  position: relative;
  flex: 0 0 34px;
  width: 34px;
  height: 0;
  border-top: 3px solid currentColor;
}

.legend-pattern.pattern-long-dash { border-top-style: dashed; }
.legend-pattern.pattern-dot { border-top-style: dotted; }
.legend-pattern.pattern-dash-dot { border-top: 0; height: 3px; background: repeating-linear-gradient(90deg, currentColor 0 12px, transparent 12px 17px, currentColor 17px 20px, transparent 20px 25px); }
.legend-pattern.pattern-short-dash { border-top-style: dashed; }

.legend-marker {
  position: absolute;
  top: -6px;
  left: 50%;
  display: block;
  width: 10px;
  height: 10px;
  border: 2px solid currentColor;
  background: var(--deep-panel);
  transform: translateX(-50%);
}

.marker-solid { border-radius: 50%; }
.marker-long-dash { border-radius: 1px; }
.marker-dot { transform: translateX(-50%) rotate(45deg); }
.marker-dash-dot {
  top: -7px;
  width: 12px;
  height: 11px;
  border: 0;
  background: currentColor;
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
}

.marker-short-dash {
  top: -7px;
  border: 0;
  background: transparent;
}

.marker-short-dash::before,
.marker-short-dash::after {
  position: absolute;
  top: 4px;
  left: -1px;
  width: 12px;
  height: 2px;
  content: "";
  background: currentColor;
  transform: rotate(45deg);
}

.marker-short-dash::after {
  transform: rotate(-45deg);
}

.adoption-data-details,
.adoption-sources {
  margin-top: 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(var(--dark-panel-rgb), .32);
}

.adoption-data-details > summary,
.adoption-sources > summary {
  padding: 16px 18px;
  color: var(--text);
  font: 800 11px var(--mono);
  cursor: pointer;
}

.adoption-data-details[open] > summary,
.adoption-sources[open] > summary {
  border-bottom: 1px solid var(--line);
}

.adoption-table-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  padding: 20px;
}

.adoption-secondary-tables {
  padding-top: 24px;
  border-top: 1px solid var(--line);
}

.table-definition-note {
  margin: 12px 0 0;
  color: var(--dim);
  font-size: 10px;
}

.adoption-table-grid h3,
.adoption-source-grid h3 {
  margin: 0 0 12px;
  font-size: 16px;
}

.adoption-evidence-section table {
  width: 100%;
  border-collapse: collapse;
  color: var(--muted);
  font-size: 11px;
}

.adoption-evidence-section caption {
  padding: 0 0 10px;
  color: var(--dim);
  font-size: 10px;
  text-align: left;
}

.adoption-evidence-section th,
.adoption-evidence-section td {
  padding: 10px 9px;
  border-top: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
}

.adoption-evidence-section thead th {
  color: var(--dim);
  font: 750 9px var(--mono);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.adoption-evidence-section tbody th {
  color: var(--text);
}

.player-ledger-head {
  margin-top: 52px;
}

.player-ledger {
  margin-top: 24px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(var(--dark-panel-rgb), .36);
}

.player-ledger table {
  min-width: 940px;
  table-layout: fixed;
}

.player-ledger caption {
  padding: 13px 16px;
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  background: rgba(var(--surface-rgb), .025);
  font-size: 10px;
  line-height: 1.4;
}

.player-ledger thead th {
  padding-top: 12px;
  padding-bottom: 12px;
  border-top: 0;
  background: rgba(var(--surface-rgb), .022);
}

.player-ledger tbody th,
.player-ledger tbody td {
  padding: 13px 12px;
}

.player-ledger tbody tr:nth-child(even) {
  background: rgba(var(--surface-rgb), .018);
}

.player-ledger tr > :first-child {
  padding-left: 16px;
}

.player-ledger tr > :last-child {
  padding-right: 16px;
}

.player-ledger th:first-child { width: 12%; }
.player-ledger th:nth-child(2) { width: 18%; }
.player-ledger th:nth-child(3) { width: 18%; }
.player-ledger th:nth-child(4) { width: 18%; }
.player-ledger th:nth-child(5) { width: 34%; }

.player-ledger th strong,
.player-ledger td strong {
  display: block;
  color: var(--text);
  font-size: 13px;
}

.player-ledger th small,
.player-ledger td small {
  display: block;
  margin-top: 3px;
  color: var(--dim);
  font-size: 9px;
  font-weight: 600;
}

.number-notes {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 14px;
}

.number-notes article {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: rgba(var(--surface-rgb), .03);
}

.number-notes span {
  color: var(--good);
  font: 800 9px var(--mono);
  text-transform: uppercase;
}

.number-notes p {
  margin: 9px 0 0;
  color: var(--muted);
  font-size: 11px;
}

.number-notes strong {
  color: var(--text);
}

.adoption-source-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
  padding: 22px;
}

.adoption-source-grid ul {
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.adoption-source-grid li {
  display: grid;
  gap: 2px;
  margin: 0;
}

.adoption-source-grid a,
.source-watchlist a {
  color: var(--text);
  text-decoration-color: var(--good);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.adoption-source-grid li span,
.adoption-source-grid p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.source-watchlist {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.source-watchlist a {
  padding: 7px 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(var(--surface-rgb), .035);
  font-size: 10px;
  text-decoration: none;
}

.source-watchlist a:hover {
  border-color: rgba(var(--good-rgb), .46);
}

.adoption-refresh-note {
  margin: 0;
  padding: 15px 22px;
  border-top: 1px solid var(--line);
  color: var(--dim);
  font: 700 9px/1.5 var(--mono);
}

@media (max-width: 1000px) {
  .adoption-page .adoption-hero {
    grid-template-columns: minmax(0, 1fr) 340px;
  }

  .adoption-rail {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .adoption-rail a:nth-child(4),
  .adoption-rail a:nth-child(5) {
    border-top: 1px solid var(--line);
  }

  .adoption-rail a:nth-child(4) {
    border-left: 0;
  }

  .adoption-rail a:nth-child(3)::after,
  .adoption-rail a:last-child::after {
    display: none;
  }

  .run-map {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .run-map div:nth-child(4),
  .run-map div:nth-child(5) {
    border-top: 1px solid var(--line);
  }

  .run-map div:nth-child(4) {
    border-left: 0;
  }
}

@media (max-width: 900px) {
  .adoption-page .adoption-hero {
    grid-template-columns: 1fr;
  }

  .stage-shell {
    grid-template-columns: 82px minmax(0, 1fr);
    gap: 24px;
  }

  .stage-marker {
    position: static;
  }

  .coe-panel {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 700px) {
  .adoption-page .adoption-hero {
    padding-top: 48px;
    padding-bottom: 50px;
  }

  .adoption-rail {
    grid-template-columns: 1fr;
  }

  .adoption-rail a {
    grid-template-columns: 36px 90px 1fr;
    align-items: center;
    gap: 9px;
    min-height: 0;
    padding: 17px;
  }

  .adoption-rail a + a,
  .adoption-rail a:nth-child(4),
  .adoption-rail a:nth-child(5) {
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .adoption-rail a::after {
    display: none;
  }

  .adoption-rail strong,
  .adoption-rail small {
    margin: 0;
  }

  .journey-rule {
    grid-template-columns: 1fr;
  }

  .stage-shell {
    grid-template-columns: 1fr;
    gap: 15px;
  }

  .stage-marker {
    display: grid;
    grid-template-columns: auto auto 1fr;
    align-items: baseline;
    gap: 10px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--line);
  }

  .stage-marker::after {
    display: none;
  }

  .stage-marker span {
    font-size: 32px;
  }

  .stage-marker strong,
  .stage-marker small {
    margin: 0;
  }

  .stage-grid,
  .engineering-grid,
  .operating-grid,
  .scale-priorities {
    grid-template-columns: 1fr;
  }

  .run-map {
    grid-template-columns: 1fr;
  }

  .run-map div {
    grid-template-columns: 120px 1fr;
    align-items: center;
    gap: 12px;
    min-height: 0;
  }

  .run-map div + div,
  .run-map div:nth-child(4),
  .run-map div:nth-child(5) {
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .run-map strong {
    align-self: auto;
  }

  .transformation-equation {
    align-items: stretch;
    flex-direction: column;
    text-align: center;
  }
}

@media (max-width: 560px) {
  .adoption-compass,
  .coe-panel {
    padding: 19px;
  }

  .compass-stages li div {
    align-items: start;
    flex-direction: column;
    gap: 1px;
  }

  .adoption-stage {
    padding: 58px 0;
  }

  .success-bar,
  .failure-note {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .engineer-questions ol,
  .coe-responsibilities {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .adoption-rail a {
    transition: none;
  }
}

@media (max-width: 1000px) {
  .adoption-chart-grid {
    grid-template-columns: 1fr;
  }

  .codex-panel-layout {
    grid-template-columns: 1fr;
  }

  .diffusion-row {
    grid-template-columns: minmax(140px, .8fr) minmax(220px, 1.6fr) 86px;
  }

  .number-notes {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .adoption-evidence-section {
    padding: 64px 0;
  }

  .adoption-stat-grid,
  .adoption-table-grid,
  .adoption-source-grid {
    grid-template-columns: 1fr;
  }

  .adoption-stat-grid article {
    min-height: 0;
  }

  .adoption-chart-panel {
    padding: 19px;
  }

  .adoption-map-toolbar,
  .frontier-telemetry-head {
    align-items: stretch;
    grid-template-columns: 1fr;
  }

  .adoption-map-toolbar {
    grid-template-columns: 1fr;
  }

  .adoption-map-select {
    width: 100%;
  }

  .adoption-map-layout,
  .frontier-telemetry-grid {
    grid-template-columns: 1fr;
  }

  .adoption-map-layout {
    min-height: 0;
  }

  .adoption-map-viewport svg[data-map-layer="europe"] .map-point-label {
    stroke-width: 2.2px;
    font-size: 6.5px;
  }

  .adoption-map-reading {
    padding: 20px;
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .adoption-map-features {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .codex-adoption-chart {
    grid-template-columns: 1fr;
  }

  .frontier-telemetry-head {
    display: grid;
  }

  .diffusion-row {
    grid-template-columns: minmax(108px, .75fr) minmax(130px, 1.4fr) 80px;
    gap: 8px;
  }

  .diffusion-name {
    white-space: normal;
  }

  .market-share-chart {
    min-height: 0;
  }

  .market-share-chart svg {
    min-width: 620px;
  }

  .market-share-panel .market-share-chart {
    overflow-x: auto;
    padding-bottom: 6px;
  }

  .player-ledger-head {
    margin-top: 56px;
  }

  .adoption-evidence-section .table-scroll {
    overflow: visible;
  }

  .adoption-evidence-section table,
  .player-ledger table {
    min-width: 0;
  }

  .adoption-data-details table thead,
  .player-ledger table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
  }

  .adoption-data-details table tbody,
  .player-ledger table tbody {
    display: grid;
    gap: 10px;
  }

  .adoption-data-details table tr,
  .player-ledger table tr {
    display: grid;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 11px;
    background: rgba(var(--surface-rgb), .025);
  }

  .adoption-data-details table th,
  .adoption-data-details table td,
  .player-ledger table th,
  .player-ledger table td {
    display: grid;
    grid-template-columns: minmax(92px, .44fr) minmax(0, 1fr);
    gap: 12px;
    width: auto !important;
    padding: 8px 0;
    border-top: 1px solid var(--line);
  }

  .adoption-data-details table th:first-child,
  .player-ledger table th:first-child {
    display: block;
    padding-top: 0;
    border-top: 0;
  }

  .adoption-data-details table td::before,
  .player-ledger table td::before {
    color: var(--dim);
    content: attr(data-label);
    font: 750 8px/1.4 var(--mono);
    letter-spacing: .04em;
    text-transform: uppercase;
  }
}

@media (max-width: 560px) {
  .adoption-stat-grid,
  .number-notes {
    grid-template-columns: 1fr;
  }

  .diffusion-key {
    justify-content: flex-start;
  }

  .diffusion-row {
    grid-template-columns: minmax(0, 1fr) 74px;
    gap: 5px 10px;
  }

  .diffusion-track {
    grid-column: 1 / -1;
    grid-row: 2;
    margin: 6px 5px 9px;
  }

  .diffusion-values {
    justify-content: flex-end;
  }

  .market-filter > span {
    flex-basis: 100%;
  }

  .adoption-map-layers,
  .adoption-map-layers button {
    width: 100%;
  }

  .adoption-map-reading b {
    font-size: 32px;
  }

  .frontier-telemetry-grid dl {
    grid-template-columns: 1fr;
  }

  .frontier-telemetry-grid dl > div {
    min-height: 78px;
  }

  .adoption-data-details > summary,
  .adoption-sources > summary {
    padding: 15px;
  }

  .adoption-table-grid,
  .adoption-source-grid {
    padding: 16px;
  }

  .adoption-data-details table th,
  .adoption-data-details table td,
  .player-ledger table th,
  .player-ledger table td {
    grid-template-columns: 88px minmax(0, 1fr);
  }
}

@media (prefers-reduced-motion: reduce) {
  [data-market-series] {
    transition: none;
  }
}

@media (forced-colors: active) {
  .adoption-map-point .map-dot,
  .market-line,
  .market-marker,
  .market-endpoint-leader,
  .legend-marker {
    stroke: CanvasText;
    color: CanvasText;
  }

  .adoption-map-point.is-selected .map-dot {
    fill: Highlight;
  }

  .adoption-map-layers button.active,
  .adoption-map-features button.active,
  .market-filter button.active {
    border: 3px solid Highlight;
  }
}

/* Benchmark database */
.benchmark-hero,
.training-hero {
  align-items: stretch;
}

.benchmark-scorecard,
.training-scorecard {
  align-self: center;
}

.benchmark-map-section,
.training-loop-section,
.inference-engineering-section,
.scale-evidence-section,
.training-risk-section {
  border-top: 1px solid rgba(var(--surface-rgb), .07);
  border-bottom: 1px solid rgba(var(--surface-rgb), .07);
  background: rgba(var(--surface-rgb), .022);
}

.benchmark-map {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
  background: rgba(var(--dark-panel-rgb), .35);
}

.benchmark-map article {
  display: grid;
  align-content: space-between;
  gap: 22px;
  min-height: 165px;
  padding: 17px;
}

.benchmark-map article + article {
  border-left: 1px solid var(--line);
}

.benchmark-map span,
.benchmark-kind,
.trace-head span,
.harness-task span,
.training-ladder article > span,
.data-stack article > span,
.evaluation-gates article > span,
.team-playbooks article > span,
.failure-files article > span,
.training-risk-matrix article > span,
.distillation-boundary article > span,
.scale-chart article > div:first-child > span {
  color: var(--good);
  font: 750 10px var(--mono);
  letter-spacing: .05em;
  text-transform: uppercase;
}

.benchmark-map strong {
  font-size: 16px;
}

.benchmark-map small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
}

.benchmark-atlas-section {
  border-bottom: 1px solid rgba(var(--surface-rgb), .07);
}

.benchmark-atlas {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: linear-gradient(145deg, rgba(var(--blue-rgb), .065), rgba(var(--dark-panel-rgb), .48));
  box-shadow: var(--shadow);
}

.atlas-controls {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 7px;
  padding: 14px;
  border-bottom: 1px solid var(--line);
  background: rgba(var(--dark-panel-rgb), .42);
}

.atlas-controls button {
  min-height: 40px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  color: var(--muted);
  background: rgba(var(--surface-rgb), .035);
  font: 700 10px var(--mono);
  cursor: pointer;
}

.atlas-controls button:hover,
.atlas-controls button.active {
  border-color: rgba(var(--blue-rgb), .38);
  color: var(--text);
  background: rgba(var(--blue-rgb), .1);
}

.atlas-chart {
  --atlas-label: 132px;
  padding: 22px;
}

.atlas-axis-title {
  margin-left: var(--atlas-label);
  color: var(--text);
  font: 750 10px var(--mono);
  letter-spacing: .05em;
  text-transform: uppercase;
}

.atlas-axis-title span {
  margin-left: 8px;
  color: var(--dim);
  font-weight: 500;
}

.atlas-axis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 10px 0 8px var(--atlas-label);
  color: var(--dim);
  font: 9px var(--mono);
  text-transform: uppercase;
}

.atlas-axis span:not(:last-child) {
  border-right: 1px dashed rgba(var(--surface-rgb), .1);
}

.atlas-axis span {
  padding: 0 10px;
}

.atlas-lane {
  display: grid;
  grid-template-columns: var(--atlas-label) minmax(0, 1fr);
  min-height: 76px;
  border-top: 1px solid rgba(var(--surface-rgb), .07);
}

.atlas-lane > strong {
  display: flex;
  align-items: center;
  padding-right: 18px;
  color: var(--muted);
  font-size: 12px;
}

.atlas-cells {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.atlas-cells > div {
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  gap: 6px;
  min-width: 0;
  padding: 10px;
  border-left: 1px dashed rgba(var(--surface-rgb), .1);
}

.atlas-cells a {
  padding: 7px 9px;
  border: 1px solid rgba(var(--good-rgb), .22);
  border-radius: 999px;
  color: var(--text);
  background: rgba(var(--good-rgb), .07);
  font: 700 10px var(--mono);
  text-decoration: none;
  transition: opacity .2s ease, border-color .2s ease, background .2s ease;
}

.atlas-cells a:hover,
.atlas-cells a:focus-visible {
  border-color: rgba(var(--good-rgb), .58);
  background: rgba(var(--good-rgb), .14);
}

.atlas-cells a.atlas-muted {
  opacity: .18;
}

.atlas-note {
  margin: 0;
  padding: 13px 22px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  background: var(--inset-surface);
  font-size: 11px;
}

.blind-lab {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  background: linear-gradient(145deg, rgba(var(--blue-rgb), .08), rgba(var(--surface-rgb), .035));
  box-shadow: var(--shadow);
}

.blind-prompt {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 9px 28px;
  padding: 24px;
  border-bottom: 1px solid var(--line);
}

.blind-prompt > span {
  color: var(--blue);
  font: 750 10px var(--mono);
  text-transform: uppercase;
}

.blind-prompt h3 {
  grid-column: 1;
  margin: 0;
  font-size: clamp(24px, 3vw, 36px);
  letter-spacing: -.045em;
}

.blind-prompt > p {
  grid-column: 1;
  max-width: 780px;
  margin: 0;
  color: var(--lead);
  font-size: 17px;
}

.blind-rubric {
  grid-column: 2;
  grid-row: 1 / 4;
  display: grid;
  align-content: center;
  gap: 6px;
  max-width: 270px;
  padding: 16px;
  border: 1px dashed rgba(var(--warn-rgb), .3);
  border-radius: 13px;
  background: rgba(var(--warn-rgb), .055);
}

.blind-rubric strong {
  color: var(--warn);
  font: 750 10px var(--mono);
  text-transform: uppercase;
}

.blind-rubric span {
  color: var(--muted);
  font-size: 12px;
}

.blind-answers {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.blind-answers button {
  display: grid;
  align-content: start;
  gap: 18px;
  min-height: 190px;
  padding: 24px;
  border: 0;
  color: var(--text);
  background: rgba(var(--dark-panel-rgb), .38);
  text-align: left;
  cursor: pointer;
  transition: background .2s ease, box-shadow .2s ease;
}

.blind-answers button + button {
  border-left: 1px solid var(--line);
}

.blind-answers button:hover,
.blind-answers button:focus-visible {
  background: rgba(var(--good-rgb), .07);
  box-shadow: inset 0 0 0 1px rgba(var(--good-rgb), .24);
}

.blind-answers button:disabled {
  cursor: default;
  opacity: .6;
}

.blind-answers button.selected {
  opacity: 1;
  background: rgba(var(--good-rgb), .09);
}

.blind-answers button > span {
  color: var(--good);
  font: 750 11px var(--mono);
  text-transform: uppercase;
}

.blind-answers button p {
  margin: 0;
  font-size: 16px;
  line-height: 1.55;
}

.blind-reveal {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px;
  align-items: center;
  padding: 22px 24px;
  border-top: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .045);
}

.blind-reveal:not([hidden]) {
  display: grid;
}

.blind-reveal h3 {
  margin: 10px 0 4px;
  font-size: 20px;
}

.blind-reveal p {
  margin: 0;
  color: var(--muted);
}

.blind-score {
  display: grid;
  grid-template-columns: auto auto;
  gap: 4px 14px;
  align-items: center;
}

.blind-score span {
  color: var(--dim);
  font: 10px var(--mono);
  text-transform: uppercase;
}

.blind-score strong {
  font-size: 23px;
}

.blind-score .btn {
  grid-column: 1 / -1;
  margin-top: 6px;
}

.benchmark-toolbar {
  position: sticky;
  top: 84px;
  z-index: 14;
  display: grid;
  grid-template-columns: minmax(240px, .7fr) minmax(0, 1.3fr);
  gap: 13px;
  margin-bottom: 18px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(var(--solid-panel-rgb), .95);
  backdrop-filter: blur(18px);
}

.site-benchmark-index {
  display: grid;
  grid-template-columns: minmax(230px, .38fr) minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  margin-bottom: 16px;
  padding: 17px;
  border: 1px solid rgba(var(--blue-rgb), .18);
  border-radius: 14px;
  background: rgba(var(--blue-rgb), .04);
  scroll-margin-top: 110px;
}

.site-benchmark-index > div {
  display: grid;
  gap: 5px;
}

.site-benchmark-index strong {
  font-size: 13px;
}

.site-benchmark-index span {
  color: var(--dim);
  font-size: 10px;
  line-height: 1.45;
}

.site-benchmark-index nav {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.site-benchmark-index a {
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--blue);
  background: rgba(var(--surface-rgb), .025);
  font: 700 9px var(--mono);
  text-decoration: none;
}

.site-benchmark-index a:hover,
.site-benchmark-index a:focus-visible {
  border-color: rgba(var(--blue-rgb), .4);
  color: var(--text);
}

.benchmark-search {
  gap: 5px;
}

.benchmark-search span {
  font: 700 10px var(--mono);
  text-transform: uppercase;
}

.benchmark-search input,
.planner-controls select {
  width: 100%;
  min-height: 42px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  color: var(--text);
  background: rgba(var(--surface-rgb), .06);
  font: inherit;
}

.benchmark-search input::placeholder {
  color: var(--dim);
}

.benchmark-filter-options {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 6px;
  align-self: end;
}

.benchmark-filter-options button,
.planner-presets button {
  min-height: 38px;
  padding: 8px 9px;
  border: 1px solid var(--line);
  border-radius: 9px;
  color: var(--muted);
  background: rgba(var(--surface-rgb), .035);
  font: 700 10px var(--mono);
  cursor: pointer;
}

.benchmark-filter-options button:hover,
.benchmark-filter-options button.active,
.planner-presets button:hover,
.planner-presets button.active {
  border-color: rgba(var(--good-rgb), .32);
  color: var(--text);
  background: rgba(var(--good-rgb), .09);
}

.benchmark-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.benchmark-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 17px;
  background: var(--panel);
  box-shadow: 0 12px 38px rgba(0, 0, 0, .2);
  scroll-margin-top: 176px;
  transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
}

.benchmark-card:target {
  border-color: rgba(var(--good-rgb), .6);
  background: linear-gradient(145deg, rgba(var(--good-rgb), .095), var(--panel));
  box-shadow: 0 0 0 3px rgba(var(--good-rgb), .08), 0 18px 48px rgba(0, 0, 0, .32);
}

.benchmark-card[hidden] {
  display: none;
}

.benchmark-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.benchmark-card-head > strong {
  color: var(--dim);
  font: 650 9px var(--mono);
  text-transform: uppercase;
}

.benchmark-card h3 {
  margin: 22px 0 7px;
  font-size: 24px;
  letter-spacing: -.04em;
}

.benchmark-card > p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.benchmark-card dl {
  display: grid;
  gap: 9px;
  margin: 18px 0 0;
}

.benchmark-card dl div {
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: 9px;
  padding-top: 9px;
  border-top: 1px solid rgba(var(--surface-rgb), .07);
}

.benchmark-card dt {
  color: var(--blue);
  font: 700 9px var(--mono);
  text-transform: uppercase;
}

.benchmark-card dd {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}

.benchmark-card .more {
  margin-top: auto;
  padding-top: 18px;
  color: var(--good);
  text-decoration: none;
  font-size: 12px;
  font-weight: 750;
}

.benchmark-card > .tool-links {
  margin-top: auto;
  padding-top: 18px;
}

.benchmark-card > .tool-links .more {
  margin-top: 0;
  padding-top: 0;
}

.benchmark-deep-link {
  color: inherit;
  text-decoration-color: rgba(var(--blue-rgb), .35);
  text-underline-offset: 2px;
}

.benchmark-deep-link:hover,
.benchmark-deep-link:focus-visible {
  color: var(--blue);
  text-decoration-color: currentColor;
}

.empty-state {
  padding: 34px;
  border: 1px dashed var(--line);
  border-radius: 16px;
  text-align: center;
}

.empty-state p {
  margin: 5px 0 0;
  color: var(--muted);
}

.harness-demo {
  display: grid;
  grid-template-columns: .82fr 1.18fr;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  background: rgba(var(--dark-panel-rgb), .36);
}

.harness-controls,
.harness-trace {
  padding: 24px;
}

.harness-controls {
  display: grid;
  gap: 10px;
  border-right: 1px solid var(--line);
}

.harness-task {
  display: grid;
  gap: 7px;
  margin: 0 0 11px;
  color: var(--lead);
  font-size: 16px;
}

.harness-controls label {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 9px;
  padding: 11px;
  border: 1px solid rgba(var(--surface-rgb), .08);
  border-radius: 10px;
  color: var(--muted);
  background: rgba(var(--surface-rgb), .035);
}

.harness-controls input,
.training-questions input {
  accent-color: var(--good);
}

.harness-controls .btn {
  margin-top: 7px;
}

.harness-trace {
  display: grid;
  align-content: start;
  gap: 16px;
}

.trace-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.trace-head strong {
  color: var(--warn);
  font: 750 11px var(--mono);
}

.harness-trace ol {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: trace;
}

.harness-trace li {
  display: grid;
  grid-template-columns: 27px 1fr;
  gap: 9px;
  margin: 0;
  padding: 10px;
  border: 1px solid rgba(var(--surface-rgb), .07);
  border-radius: 9px;
  color: var(--muted);
  background: rgba(var(--surface-rgb), .025);
  font-size: 12px;
}

.harness-trace li::before {
  counter-increment: trace;
  content: counter(trace, decimal-leading-zero);
  color: var(--blue);
  font: 700 10px var(--mono);
}

.harness-output {
  padding: 15px;
  border: 1px solid rgba(var(--warn-rgb), .22);
  border-radius: 11px;
  color: var(--warn);
  background: rgba(var(--warn-rgb), .055);
  font-size: 13px;
}

.harness-output.ready {
  border-color: rgba(var(--good-rgb), .24);
  color: var(--callout-text);
  background: rgba(var(--good-rgb), .065);
}

.risk-grid,
.training-risk-matrix {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 13px;
}

.risk-grid article,
.training-risk-matrix article {
  padding: 20px;
  border: 1px solid rgba(var(--bad-rgb), .14);
  border-radius: 15px;
  background: rgba(var(--bad-rgb), .035);
}

.risk-grid article > span {
  color: var(--bad);
  font: 750 10px var(--mono);
  text-transform: uppercase;
}

.risk-grid h3,
.training-risk-matrix h3 {
  margin: 18px 0 7px;
  font-size: 18px;
}

.risk-grid p,
.training-risk-matrix p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

/* Training page */
.training-ladder-mini {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 20px;
}

.training-ladder-mini span {
  display: flex;
  gap: 8px;
  padding: 11px;
  border: 1px solid rgba(var(--surface-rgb), .1);
  border-radius: 10px;
  color: var(--muted);
  background: rgba(var(--surface-rgb), .035);
  font-size: 12px;
}

.training-ladder-mini b {
  color: var(--good);
  font-family: var(--mono);
}

.training-chooser {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  background: rgba(var(--dark-panel-rgb), .34);
}

.training-questions {
  display: grid;
  padding: 16px;
  border-right: 1px solid var(--line);
}

.training-questions label {
  grid-template-columns: auto 1fr;
  align-items: start;
  gap: 11px;
  padding: 14px;
  border: 1px solid transparent;
  border-radius: 11px;
  cursor: pointer;
}

.training-questions label:hover {
  border-color: rgba(var(--good-rgb), .17);
  background: rgba(var(--good-rgb), .04);
}

.training-questions input {
  margin-top: 3px;
}

.training-questions label > span {
  display: grid;
  gap: 3px;
}

.training-questions strong {
  color: var(--text);
  font-size: 14px;
}

.training-questions small {
  color: var(--dim);
  font-size: 11px;
}

.training-recommendation {
  display: grid;
  align-content: center;
  padding: 28px;
  background:
    radial-gradient(circle at 100% 0%, rgba(var(--good-rgb), .14), transparent 24rem),
    rgba(var(--surface-rgb), .035);
}

.training-recommendation .tag {
  justify-self: start;
}

.training-recommendation h3 {
  margin: 7px 0 9px;
  font-size: clamp(25px, 3vw, 36px);
  letter-spacing: -.05em;
}

.training-recommendation > p {
  margin: 0;
  color: var(--muted);
}

.training-route-stack {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  margin: 22px 0 14px;
}

.training-route-stack span {
  padding: 9px 7px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--dim);
  background: rgba(var(--surface-rgb), .03);
  font: 700 9px var(--mono);
  text-align: center;
  text-transform: uppercase;
}

.training-route-stack span.active {
  border-color: rgba(var(--good-rgb), .3);
  color: var(--text);
  background: rgba(var(--good-rgb), .09);
}

.training-ladder {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
  background: rgba(var(--surface-rgb), .025);
}

.training-ladder article {
  display: flex;
  flex-direction: column;
  min-height: 290px;
  padding: 21px;
}

.training-ladder article + article {
  border-left: 1px solid var(--line);
}

.training-ladder article:nth-child(2) {
  background: rgba(var(--blue-rgb), .035);
}

.training-ladder article:nth-child(3) {
  background: rgba(var(--purple-rgb), .035);
}

.training-ladder article:nth-child(4) {
  background: rgba(var(--warn-rgb), .035);
}

.training-ladder h3 {
  margin: 28px 0 9px;
  font-size: 20px;
}

.training-ladder p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.training-ladder strong {
  margin-top: auto;
  padding-top: 18px;
  color: var(--text);
  font-size: 12px;
}

.training-ladder small {
  margin-top: 5px;
  color: var(--dim);
  font-size: 10px;
  line-height: 1.4;
}

.looped-transformers-section {
  border-top: 1px solid rgba(var(--surface-rgb), .07);
  border-bottom: 1px solid rgba(var(--surface-rgb), .07);
  background: rgba(var(--surface-rgb), .022);
}

.looped-architecture {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 24px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 17px;
}

.looped-architecture article {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 22px;
  background: rgba(var(--surface-rgb), .025);
}

.looped-architecture article + article {
  border-left: 1px solid var(--line);
  background: rgba(var(--good-rgb), .045);
}

.looped-architecture span,
.section-subhead > .tag {
  justify-self: start;
}

.looped-architecture strong {
  color: var(--text);
  font: 750 clamp(13px, 1.6vw, 18px)/1.55 var(--mono);
}

.looped-architecture i {
  color: var(--good);
  font-style: normal;
}

.looped-architecture p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.looped-proposition {
  margin: 13px 0 0;
  color: var(--lead);
  font: 750 12px var(--mono);
  text-align: center;
  text-transform: uppercase;
}

.looped-proposition b {
  padding: 0 8px;
  color: var(--good);
}

.section-subhead {
  display: grid;
  gap: 8px;
  margin-top: 34px;
}

.section-subhead h3 {
  margin: 0;
  font-size: clamp(24px, 3vw, 34px);
  letter-spacing: -.045em;
}

.loop-kind-cards code,
.looped-checkpoints code {
  overflow-wrap: anywhere;
  color: var(--blue);
  font-size: 11px;
}

.loop-kind-cards code {
  display: block;
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
  line-height: 1.7;
}

.looped-uncertainty p + p {
  margin-top: 5px;
}

.looped-uncertainty a {
  color: var(--blue);
}

.looped-decision-table th:nth-child(1) { width: 18%; }
.looped-decision-table th:nth-child(2) { width: 35%; }
.looped-decision-table th:nth-child(3) { width: 47%; }

.looped-experiment {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 20px 0;
  padding: 0;
  list-style: none;
  counter-reset: looped-experiment;
}

.looped-experiment li {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 4px 12px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(var(--surface-rgb), .025);
  counter-increment: looped-experiment;
}

.looped-experiment li::before {
  grid-row: 1 / 3;
  color: var(--good);
  content: "0" counter(looped-experiment);
  font: 750 11px var(--mono);
}

.looped-experiment b {
  font-size: 13px;
}

.looped-experiment span {
  color: var(--muted);
  font-size: 11px;
}

.training-loop {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 38px minmax(0, 1fr) 38px minmax(0, 1fr) 38px minmax(0, 1fr);
  grid-template-rows: auto 38px auto auto;
  align-items: stretch;
  gap: 0;
}

.training-loop article {
  display: grid;
  align-content: space-between;
  gap: 8px;
  min-height: 142px;
  padding: 17px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: rgba(var(--dark-panel-rgb), .52);
}

.training-loop article:nth-of-type(1) { grid-area: 1 / 1; }
.training-loop article:nth-of-type(2) { grid-area: 1 / 3; }
.training-loop article:nth-of-type(3) { grid-area: 1 / 5; }
.training-loop article:nth-of-type(4) { grid-area: 1 / 7; }
.training-loop article:nth-of-type(5) { grid-area: 3 / 7; }
.training-loop article:nth-of-type(6) { grid-area: 3 / 5; }
.training-loop article:nth-of-type(7) { grid-area: 3 / 3; }
.training-loop article:nth-of-type(8) { grid-area: 3 / 1; }

.training-loop > i {
  display: grid;
  place-items: center;
  color: var(--good);
  font-size: 0;
}

.training-loop > i::before {
  font: 19px var(--mono);
}

.training-loop > i:nth-of-type(1) { grid-area: 1 / 2; }
.training-loop > i:nth-of-type(2) { grid-area: 1 / 4; }
.training-loop > i:nth-of-type(3) { grid-area: 1 / 6; }
.training-loop > i:nth-of-type(4) { grid-area: 2 / 7; }
.training-loop > i:nth-of-type(5) { grid-area: 3 / 6; }
.training-loop > i:nth-of-type(6) { grid-area: 3 / 4; }
.training-loop > i:nth-of-type(7) { grid-area: 3 / 2; }

.training-loop > i:nth-of-type(1)::before,
.training-loop > i:nth-of-type(2)::before,
.training-loop > i:nth-of-type(3)::before { content: "→"; }
.training-loop > i:nth-of-type(4)::before { content: "↓"; }
.training-loop > i:nth-of-type(5)::before,
.training-loop > i:nth-of-type(6)::before,
.training-loop > i:nth-of-type(7)::before { content: "←"; }

.training-loop article > span {
  color: var(--good);
  font: 750 10px var(--mono);
}

.training-loop article strong {
  font-size: 13px;
  line-height: 1.25;
}

.training-loop article small {
  color: var(--dim);
  font-size: 9px;
  line-height: 1.4;
}

.training-loop-return {
  grid-column: 1 / -1;
  grid-row: 4;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 14px;
  padding: 9px 14px;
  border: 1px dashed rgba(var(--good-rgb), .24);
  border-radius: 10px;
  color: var(--good);
  background: rgba(var(--good-rgb), .035);
  font: 700 10px var(--mono);
  text-transform: uppercase;
}

.data-stack {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.data-stack article {
  min-height: 178px;
  padding: 20px;
  border: 1px solid rgba(var(--blue-rgb), .15);
  border-radius: 15px;
  background: rgba(var(--blue-rgb), .035);
}

.data-stack h3 {
  margin: 27px 0 7px;
  font-size: 19px;
}

.data-stack p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.national-route-note {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 20px;
  align-items: center;
  margin-top: 14px;
  padding: 18px 20px;
  border: 1px solid rgba(var(--good-rgb), .2);
  border-radius: 14px;
  background: rgba(var(--good-rgb), .045);
}

.national-route-note > strong {
  color: var(--good);
  font: 750 11px var(--mono);
  text-transform: uppercase;
}

.national-route-note p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.national-route-note a {
  color: var(--blue);
}

.training-planner {
  display: grid;
  grid-template-columns: .84fr 1.16fr;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  background: rgba(var(--dark-panel-rgb), .36);
  box-shadow: var(--shadow);
}

.planner-controls,
.planner-results {
  padding: 24px;
}

.planner-controls {
  display: grid;
  gap: 14px;
  border-right: 1px solid var(--line);
}

.planner-presets {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  margin-bottom: 4px;
}

.planner-controls select {
  appearance: auto;
}

.planner-results {
  display: grid;
  align-content: start;
  gap: 18px;
  background:
    radial-gradient(circle at 100% 0%, rgba(var(--blue-rgb), .11), transparent 26rem),
    rgba(var(--surface-rgb), .025);
}

.planner-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.planner-metrics article {
  padding: 16px;
  border: 1px solid rgba(var(--surface-rgb), .09);
  border-radius: 12px;
  background: rgba(var(--dark-panel-rgb), .35);
}

.planner-metrics span {
  display: block;
  color: var(--dim);
  font: 700 9px var(--mono);
  text-transform: uppercase;
}

.planner-metrics strong {
  display: block;
  margin-top: 8px;
  color: var(--good);
  font-size: clamp(21px, 3vw, 34px);
  letter-spacing: -.045em;
}

.memory-budget {
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(var(--dark-panel-rgb), .4);
}

.memory-budget-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 15px;
}

.memory-budget-head > div {
  display: grid;
  gap: 5px;
}

.memory-budget-head span {
  color: var(--muted);
  font-size: 12px;
}

.memory-budget-head strong {
  font-size: 28px;
  letter-spacing: -.045em;
}

.memory-budget-head small {
  color: var(--warn);
  font: 700 10px var(--mono);
  text-align: right;
}

.memory-stack {
  display: flex;
  height: 28px;
  margin: 16px 0 12px;
  overflow: hidden;
  border: 1px solid rgba(var(--surface-rgb), .1);
  border-radius: 8px;
  background: rgba(var(--surface-rgb), .03);
}

.memory-stack span {
  min-width: 2px;
  transition: width .25s ease;
}

#memoryWeights,
.legend-weights {
  background: var(--good);
}

#memoryTrainState,
.legend-state {
  background: var(--blue);
}

#memoryReserve,
.legend-reserve {
  background: var(--purple);
}

.memory-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
}

.memory-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--muted);
  font-size: 10px;
}

.memory-legend i {
  width: 8px;
  height: 8px;
  border-radius: 3px;
}

.memory-legend b {
  color: var(--text);
  font-family: var(--mono);
}

.planner-warning {
  padding: 14px;
  border: 1px solid rgba(var(--warn-rgb), .22);
  border-radius: 11px;
  color: var(--warn);
  background: rgba(var(--warn-rgb), .055);
  font-size: 12px;
}

.scale-chart {
  display: grid;
  gap: 9px;
}

.scale-chart article {
  display: grid;
  grid-template-columns: 210px minmax(160px, 1fr) 180px;
  gap: 18px;
  align-items: center;
  padding: 13px 16px;
  border: 1px solid rgba(var(--surface-rgb), .08);
  border-radius: 12px;
  background: rgba(var(--dark-panel-rgb), .38);
}

.scale-chart article > div:first-child {
  display: grid;
  gap: 3px;
}

.scale-chart article > div:first-child strong {
  font-size: 13px;
}

.scale-track {
  height: 18px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(var(--surface-rgb), .055);
}

.scale-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--good), var(--blue));
}

.scale-1 { width: 8%; }
.scale-2 { width: 40%; }
.scale-3 { width: 86%; }
.scale-4 { width: 100%; }

.scale-chart article > b {
  color: var(--lead);
  font: 750 12px var(--mono);
  text-align: right;
}

.evaluation-gates {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  border: 1px solid var(--line);
  border-radius: 17px;
  overflow: hidden;
}

.evaluation-gates article {
  min-height: 190px;
  padding: 18px;
  background: rgba(var(--surface-rgb), .025);
}

.evaluation-gates article + article {
  border-left: 1px solid var(--line);
}

.evaluation-gates h3 {
  margin: 26px 0 7px;
  font-size: 17px;
}

.evaluation-gates p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.failure-files {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 13px;
}

.failure-files article {
  display: flex;
  flex-direction: column;
  min-height: 220px;
  padding: 20px;
  border: 1px solid rgba(var(--bad-rgb), .16);
  border-radius: 15px;
  background: linear-gradient(145deg, rgba(var(--bad-rgb), .055), rgba(var(--surface-rgb), .025));
}

.failure-files article > span,
.training-risk-matrix article > span {
  color: var(--bad);
}

.failure-files h3 {
  margin: 27px 0 7px;
  font-size: 19px;
}

.failure-files p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.failure-files strong,
.failure-files a {
  margin-top: auto;
  padding-top: 18px;
  color: var(--warn);
  font-size: 11px;
  text-decoration: none;
}

.jensen-grid {
  display: grid;
  grid-template-columns: 1.12fr .88fr;
  gap: 14px;
}

.jensen-video,
.open-letter-card {
  margin: 0;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  background: var(--panel);
}

.jensen-video {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

.jensen-video .video-frame {
  flex: 0 0 auto;
  width: 100%;
  min-width: 0;
}

.jensen-video > div:last-child {
  display: grid;
  flex: 1;
  align-content: center;
  padding: 22px;
}

.jensen-video h3 {
  margin: 0 0 9px;
  font-size: 23px;
}

.jensen-video p,
.open-letter-card > p:not(.quote) {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.open-letter-card {
  display: flex;
  flex-direction: column;
  padding: 24px;
  background:
    radial-gradient(circle at 100% 0%, rgba(var(--good-rgb), .12), transparent 25rem),
    var(--panel);
}

.open-letter-card .quote {
  margin: 10px 0 18px;
  font-size: clamp(27px, 3.7vw, 45px);
}

.open-letter-card .source {
  margin-top: 16px !important;
}

.open-letter-card .tool-links {
  margin-top: auto;
  padding-top: 18px;
}

.distillation-boundary {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 16px;
  margin-top: 14px;
}

.distillation-boundary article {
  min-height: 150px;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: rgba(var(--surface-rgb), .035);
}

.distillation-boundary > i {
  color: var(--warn);
  font: 28px var(--mono);
}

.distillation-boundary strong {
  display: block;
  margin: 22px 0 6px;
  font-size: 17px;
}

.distillation-boundary p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.training-risk-matrix article {
  display: flex;
  flex-direction: column;
  min-height: 250px;
}

.training-risk-matrix article > a {
  margin-top: auto;
  padding-top: 18px;
  color: var(--good);
  font-size: 11px;
  font-weight: 750;
  text-decoration: none;
}

.legal-timeline {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr;
  align-items: center;
  gap: 12px;
  margin-top: 14px;
  padding: 16px;
  border: 1px solid rgba(var(--warn-rgb), .2);
  border-radius: 14px;
  background: rgba(var(--warn-rgb), .045);
}

.legal-timeline article {
  display: grid;
  gap: 4px;
}

.legal-timeline span {
  color: var(--warn);
  font: 750 10px var(--mono);
  text-transform: uppercase;
}

.legal-timeline strong {
  font-size: 12px;
}

.legal-timeline > i {
  color: var(--warn);
  font-style: normal;
}

.team-playbooks,
.partner-routes {
  display: grid;
  gap: 13px;
}

.team-playbooks {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.team-playbooks article,
.partner-routes article {
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: rgba(var(--surface-rgb), .035);
}

.team-playbooks h3,
.partner-routes h3 {
  margin: 25px 0 8px;
  font-size: 18px;
}

.team-playbooks ul {
  margin-top: 9px;
  padding-left: 17px;
  font-size: 11px;
}

.team-playbooks li {
  margin: 5px 0;
}

.partner-routes {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 13px;
}

.partner-routes p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

@media (max-width: 1100px) {
  .benchmark-map {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .benchmark-map article:nth-child(5),
  .benchmark-map article:nth-child(6),
  .benchmark-map article:nth-child(7) {
    border-top: 1px solid var(--line);
  }

  .benchmark-map article:nth-child(5) {
    border-left: 0;
  }

  .training-loop {
    grid-template-columns: minmax(0, 1fr) 38px minmax(0, 1fr);
    grid-template-rows: auto 38px auto 38px auto 38px auto auto;
  }

  .training-loop article:nth-of-type(1) { grid-area: 1 / 1; }
  .training-loop article:nth-of-type(2) { grid-area: 1 / 3; }
  .training-loop article:nth-of-type(3) { grid-area: 3 / 3; }
  .training-loop article:nth-of-type(4) { grid-area: 3 / 1; }
  .training-loop article:nth-of-type(5) { grid-area: 5 / 1; }
  .training-loop article:nth-of-type(6) { grid-area: 5 / 3; }
  .training-loop article:nth-of-type(7) { grid-area: 7 / 3; }
  .training-loop article:nth-of-type(8) { grid-area: 7 / 1; }
  .training-loop > i:nth-of-type(1) { grid-area: 1 / 2; }
  .training-loop > i:nth-of-type(2) { grid-area: 2 / 3; }
  .training-loop > i:nth-of-type(3) { grid-area: 3 / 2; }
  .training-loop > i:nth-of-type(4) { grid-area: 4 / 1; }
  .training-loop > i:nth-of-type(5) { grid-area: 5 / 2; }
  .training-loop > i:nth-of-type(6) { grid-area: 6 / 3; }
  .training-loop > i:nth-of-type(7) { grid-area: 7 / 2; }
  .training-loop > i:nth-of-type(1)::before,
  .training-loop > i:nth-of-type(5)::before { content: "→"; }
  .training-loop > i:nth-of-type(2)::before,
  .training-loop > i:nth-of-type(4)::before,
  .training-loop > i:nth-of-type(6)::before { content: "↓"; }
  .training-loop > i:nth-of-type(3)::before,
  .training-loop > i:nth-of-type(7)::before { content: "←"; }
  .training-loop-return { grid-row: 8; }
}

@media (max-width: 900px) {
  .atlas-controls {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .atlas-chart {
    --atlas-label: 104px;
    padding: 18px;
  }

  .site-benchmark-index {
    grid-template-columns: 1fr;
  }

  .benchmark-toolbar {
    position: static;
    grid-template-columns: 1fr;
  }

  .benchmark-cards,
  .risk-grid,
  .training-risk-matrix,
  .failure-files,
  .data-stack {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .harness-demo,
  .training-chooser,
  .training-planner,
  .jensen-grid {
    grid-template-columns: 1fr;
  }

  .harness-controls,
  .training-questions,
  .planner-controls {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .training-ladder {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .training-ladder article:nth-child(3) {
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .training-ladder article:nth-child(4) {
    border-top: 1px solid var(--line);
  }

  .evaluation-gates,
  .team-playbooks {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .evaluation-gates article:nth-child(3),
  .evaluation-gates article:nth-child(5) {
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .evaluation-gates article:nth-child(4) {
    border-top: 1px solid var(--line);
  }

  .evaluation-gates article:nth-child(5) {
    grid-column: 1 / -1;
  }

  .jensen-video {
    grid-template-columns: 1fr;
  }

  .looped-tradeoffs,
  .loop-kind-cards,
  .looped-checkpoints {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 700px) {
  .looped-architecture,
  .looped-experiment {
    grid-template-columns: 1fr;
  }

  .looped-architecture article + article {
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .atlas-controls {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .atlas-chart {
    --atlas-label: 0px;
    padding: 14px;
  }

  .atlas-axis-title {
    margin-left: 0;
    padding-bottom: 10px;
  }

  .atlas-axis {
    display: none;
  }

  .atlas-lane {
    grid-template-columns: 1fr;
  }

  .atlas-lane > strong {
    padding: 11px 2px 7px;
  }

  .atlas-cells {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .atlas-cells > div {
    min-height: 48px;
    border-top: 1px dashed rgba(var(--surface-rgb), .08);
  }

  .benchmark-map {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .benchmark-map article:nth-child(odd) {
    border-left: 0;
  }

  .benchmark-map article:nth-child(3),
  .benchmark-map article:nth-child(4) {
    border-top: 1px solid var(--line);
  }

  .blind-prompt {
    grid-template-columns: 1fr;
  }

  .blind-rubric {
    grid-column: 1;
    grid-row: auto;
    max-width: none;
  }

  .blind-answers,
  .blind-reveal,
  .benchmark-cards,
  .risk-grid,
  .training-risk-matrix,
  .failure-files,
  .data-stack,
  .partner-routes {
    grid-template-columns: 1fr;
  }

  .blind-answers button + button {
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .blind-score {
    justify-self: start;
  }

  .training-loop {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    gap: 7px;
  }

  .training-loop article:nth-of-type(1),
  .training-loop article:nth-of-type(2),
  .training-loop article:nth-of-type(3),
  .training-loop article:nth-of-type(4),
  .training-loop article:nth-of-type(5),
  .training-loop article:nth-of-type(6),
  .training-loop article:nth-of-type(7),
  .training-loop article:nth-of-type(8) {
    grid-column: 1;
    grid-row: auto;
    min-height: 0;
  }

  .training-loop > i:nth-of-type(1),
  .training-loop > i:nth-of-type(2),
  .training-loop > i:nth-of-type(3),
  .training-loop > i:nth-of-type(4),
  .training-loop > i:nth-of-type(5),
  .training-loop > i:nth-of-type(6),
  .training-loop > i:nth-of-type(7) {
    grid-column: 1;
    grid-row: auto;
    min-height: 20px;
  }

  .training-loop > i:nth-of-type(1)::before,
  .training-loop > i:nth-of-type(2)::before,
  .training-loop > i:nth-of-type(3)::before,
  .training-loop > i:nth-of-type(4)::before,
  .training-loop > i:nth-of-type(5)::before,
  .training-loop > i:nth-of-type(6)::before,
  .training-loop > i:nth-of-type(7)::before { content: "↓"; }

  .training-loop article {
    grid-template-columns: 34px 1fr;
  }

  .training-loop article small {
    grid-column: 2;
  }

  .training-loop-return {
    grid-column: 1;
    grid-row: auto;
    font-size: 8px;
  }

  .national-route-note,
  .scale-chart article {
    grid-template-columns: 1fr;
  }

  .scale-chart article > b {
    text-align: left;
  }

  .distillation-boundary {
    grid-template-columns: 1fr;
  }

  .distillation-boundary > i,
  .legal-timeline > i {
    transform: rotate(90deg);
    justify-self: center;
  }

  .legal-timeline {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .benchmark-filter-options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .training-ladder,
  .planner-metrics,
  .evaluation-gates,
  .team-playbooks {
    grid-template-columns: 1fr;
  }

  .training-ladder article + article,
  .training-ladder article:nth-child(4),
  .evaluation-gates article + article,
  .evaluation-gates article:nth-child(4) {
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .evaluation-gates article:nth-child(5) {
    grid-column: 1;
  }

  .training-route-stack {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .planner-presets {
    grid-template-columns: 1fr;
  }

  .memory-budget-head {
    align-items: start;
    flex-direction: column;
  }

  .memory-budget-head small {
    text-align: left;
  }
}

/* Evidence study chart and negative results */
.study-map-section {
  border-top: 1px solid rgba(var(--surface-rgb), .07);
  border-bottom: 1px solid rgba(var(--surface-rgb), .07);
  background: rgba(var(--surface-rgb), .022);
}

.study-chart {
  display: grid;
  gap: 8px;
}

.study-chart article {
  display: grid;
  grid-template-columns: 260px minmax(180px, 1fr) 110px;
  gap: 18px;
  align-items: center;
  min-height: 76px;
  padding: 13px 16px;
  border: 1px solid rgba(var(--surface-rgb), .08);
  border-radius: 12px;
  background: rgba(var(--dark-panel-rgb), .38);
}

.study-chart article > div:first-child {
  display: grid;
  gap: 2px;
}

.study-chart article > div:first-child span {
  color: var(--blue);
  font: 750 9px var(--mono);
  text-transform: uppercase;
}

.study-chart article > div:first-child strong {
  font-size: 13px;
}

.study-chart article > div:first-child small {
  color: var(--dim);
  font-size: 10px;
}

.study-axis {
  position: relative;
  height: 22px;
  border-radius: 999px;
  background:
    linear-gradient(90deg, transparent 49.8%, rgba(var(--surface-rgb), .22) 49.8%, rgba(var(--surface-rgb), .22) 50.2%, transparent 50.2%),
    rgba(var(--surface-rgb), .045);
}

.study-axis i {
  position: absolute;
  top: 3px;
  bottom: 3px;
  border-radius: 999px;
}

.study-positive {
  left: 50%;
  background: linear-gradient(90deg, var(--good), var(--blue));
}

.study-negative {
  right: 50%;
  background: linear-gradient(90deg, var(--bad), var(--warn));
}

.study-w1 { width: 1%; min-width: 3px; }
.study-w14 { width: 11.7%; }
.study-w19 { width: 15.8%; }
.study-w25 { width: 20.9%; }
.study-w40 { width: 33.3%; }
.study-w56 { width: 46.5%; }

.study-chart article > b {
  font: 800 13px var(--mono);
  text-align: right;
}

.study-benefit { color: var(--good); }
.study-harm { color: var(--bad); }
.study-mixed { color: var(--warn); }

.study-chart-sources {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 13px;
}

.study-chart-sources a {
  padding: 7px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  background: rgba(var(--surface-rgb), .035);
  font: 650 9px var(--mono);
  text-decoration: none;
}

.study-chart-sources a:hover {
  color: var(--text);
  border-color: rgba(var(--good-rgb), .26);
}

.negative-result-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 13px;
}

.negative-result-grid article {
  display: flex;
  flex-direction: column;
  min-height: 235px;
  padding: 20px;
  border: 1px solid rgba(var(--bad-rgb), .16);
  border-radius: 15px;
  background: linear-gradient(145deg, rgba(var(--bad-rgb), .055), rgba(var(--surface-rgb), .025));
}

.negative-result-grid article > span {
  color: var(--bad);
  font: 750 10px var(--mono);
  text-transform: uppercase;
}

.negative-result-grid h3 {
  margin: 27px 0 8px;
  font-size: 19px;
}

.negative-result-grid p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.negative-result-grid a {
  margin-top: auto;
  padding-top: 18px;
  color: var(--good);
  font-size: 11px;
  font-weight: 750;
  text-decoration: none;
}

@media (max-width: 900px) {
  .negative-result-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .study-chart article {
    grid-template-columns: 1fr 80px;
    gap: 10px;
  }

  .study-axis {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .study-chart article > b {
    grid-column: 2;
    grid-row: 1;
  }

  .negative-result-grid {
    grid-template-columns: 1fr;
  }
}

/* Robotics builder guide */
.robotics-page {
  background: var(--robotics-background);
}

.robotics-hero {
  padding-bottom: 56px;
}

.robotics-hero h1 {
  max-width: 940px;
}

.robotics-frontier-section {
  padding-top: 34px;
  border-top: 1px solid rgba(var(--surface-rgb), .07);
  background:
    radial-gradient(circle at 12% 2%, rgba(var(--purple-rgb), .12), transparent 30rem),
    radial-gradient(circle at 88% 100%, rgba(var(--good-rgb), .07), transparent 34rem),
    rgba(var(--surface-rgb), .018);
}

.frontier-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.16fr) minmax(340px, .84fr);
  overflow: hidden;
  border: 1px solid rgba(var(--purple-rgb), .24);
  border-radius: 20px;
  background:
    radial-gradient(circle at 100% 0%, rgba(var(--purple-rgb), .12), transparent 28rem),
    var(--panel);
  box-shadow: var(--shadow);
}

.frontier-hero > .video-frame {
  min-width: 0;
  min-height: 0;
  width: 100%;
  height: auto;
  overflow: hidden;
  align-self: center;
  aspect-ratio: 16 / 9;
}

.frontier-hero .video-poster img {
  object-fit: contain;
}

.frontier-hero-copy {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  padding: 29px;
  background: rgba(var(--solid-panel-rgb), .96);
}

.frontier-hero-copy h3 {
  margin: 12px 0 11px;
  font-size: clamp(27px, 3.2vw, 43px);
  letter-spacing: -.045em;
  line-height: 1;
}

.frontier-hero-copy p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.frontier-hero-copy .frontier-caveat {
  margin-top: 15px;
  padding: 13px 14px;
  border-left: 2px solid var(--warn);
  color: var(--muted);
  background: rgba(var(--warn-rgb), .045);
  font-size: 11px;
}

.frontier-caveat strong {
  color: var(--warn);
}

.frontier-hero-copy .tool-links {
  margin-top: 19px;
}

.frontier-lanes {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-top: 15px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(var(--dark-panel-rgb), .35);
}

.frontier-lanes article {
  min-height: 185px;
  padding: 18px;
}

.frontier-lanes article + article {
  border-left: 1px solid var(--line);
}

.frontier-lanes span {
  color: var(--good);
  font: 760 10px var(--mono);
}

.frontier-lanes strong {
  display: block;
  margin: 35px 0 8px;
  font-size: 16px;
  line-height: 1.25;
}

.frontier-lanes p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.frontier-evidence-ladder {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: 22px;
  align-items: center;
  margin-top: 15px;
  padding: 17px 19px;
  border: 1px solid rgba(var(--blue-rgb), .2);
  border-radius: 15px;
  background: rgba(var(--blue-rgb), .045);
}

.frontier-evidence-ladder > strong {
  font-size: 16px;
}

.frontier-evidence-ladder ol {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: frontier-evidence;
}

.frontier-evidence-ladder li {
  min-width: 0;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.4;
  counter-increment: frontier-evidence;
}

.frontier-evidence-ladder li::before {
  content: counter(frontier-evidence, decimal-leading-zero);
  display: block;
  margin-bottom: 4px;
  color: var(--dim);
  font: 700 9px var(--mono);
}

.frontier-evidence-ladder li span {
  display: block;
  margin-bottom: 3px;
  color: var(--blue);
  font: 750 9px var(--mono);
  text-transform: uppercase;
}

.figure-timeline-section {
  border-top: 1px solid rgba(var(--surface-rgb), .07);
  border-bottom: 1px solid rgba(var(--surface-rgb), .07);
  background:
    radial-gradient(circle at 91% 5%, rgba(var(--purple-rgb), .08), transparent 32rem),
    rgba(var(--surface-rgb), .018);
}

.figure-timeline {
  display: grid;
  gap: 30px;
}

.figure-year {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  gap: 17px;
}

.figure-year > strong {
  padding-top: 4px;
  color: rgba(var(--purple-rgb), .72);
  font: 820 19px var(--mono);
  letter-spacing: -.05em;
}

.figure-release-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  min-width: 0;
}

.figure-release {
  display: grid;
  grid-template-columns: minmax(145px, .72fr) minmax(0, 1.28fr);
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: rgba(var(--surface-rgb), .03);
}

.figure-release-media,
.frontier-clip,
.frontier-company-video {
  position: relative;
  display: block;
  min-width: 0;
  overflow: hidden;
  background: #050609;
  text-decoration: none;
}

.figure-release-media img,
.frontier-clip img,
.frontier-company-video img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .76;
  transition: opacity .2s ease, transform .25s ease;
}

.figure-release-media:hover img,
.figure-release-media:focus-visible img,
.frontier-clip:hover img,
.frontier-clip:focus-visible img,
.frontier-company-video:hover img,
.frontier-company-video:focus-visible img {
  opacity: 1;
  transform: scale(1.018);
}

.figure-release-media > span {
  position: absolute;
  right: 10px;
  bottom: 10px;
  display: grid;
  place-items: center;
  min-width: 35px;
  height: 29px;
  padding: 0 8px;
  border: 1px solid rgba(255, 255, 255, .26);
  border-radius: 999px;
  color: #fff;
  background: rgba(var(--media-overlay-rgb), .84);
  font: 750 9px var(--mono);
}

.figure-release > div {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 16px;
}

.figure-release time {
  color: var(--good);
  font: 740 9px var(--mono);
  text-transform: uppercase;
}

.figure-release small {
  margin-top: 3px;
  color: var(--dim);
  font: 700 9px var(--mono);
  text-transform: uppercase;
}

.figure-release h3 {
  margin: 19px 0 6px;
  font-size: 17px;
  line-height: 1.2;
}

.figure-release p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.figure-release .tool-links {
  margin-top: auto;
  padding-top: 14px;
}

.figure-release .tool-links a {
  font-size: 9px;
}

.frontier-companies-section {
  border-bottom: 1px solid rgba(var(--surface-rgb), .07);
  background:
    radial-gradient(circle at 5% 20%, rgba(var(--blue-rgb), .07), transparent 34rem),
    radial-gradient(circle at 95% 80%, rgba(var(--good-rgb), .06), transparent 32rem);
}

.frontier-company-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.frontier-company {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 17px;
  background: var(--panel);
}

.frontier-video-pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  background: var(--line);
}

.frontier-clip,
.frontier-company-video {
  aspect-ratio: 16 / 9;
}

.frontier-clip span,
.frontier-company-video span {
  position: absolute;
  right: 9px;
  bottom: 9px;
  left: 9px;
  width: auto;
  max-width: none;
  transform: none;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 8px 10px;
  border: 1px solid rgba(255, 255, 255, .24);
  border-radius: 999px;
  color: #fff;
  background: rgba(var(--media-overlay-rgb), .82);
  font: 700 9px var(--mono);
  line-height: 1.25;
  text-align: center;
  overflow-wrap: anywhere;
  white-space: normal;
}

.frontier-company-copy {
  display: flex;
  flex-direction: column;
  padding: 22px;
}

.frontier-company-copy h3 {
  margin: 12px 0 9px;
  font-size: 23px;
  line-height: 1.08;
  letter-spacing: -.035em;
}

.frontier-company-copy p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.frontier-company-copy .tool-links {
  margin-top: 18px;
}

.region-mark {
  display: inline-block;
  flex: 0 0 20px;
  width: 20px;
  height: 15px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .36);
  border-radius: 2px;
  background-color: #fff;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, .1), 0 2px 5px rgba(0, 0, 0, .16);
}

.region-mark--usa {
  background-image: url("../images/flags/us.svg");
}

.region-mark--china {
  background-image: url("../images/flags/cn.svg");
}

.region-mark--eu {
  background-image: url("../images/flags/eu.svg");
}

.region-mark--switzerland {
  background-image: url("../images/flags/ch.svg");
}

.region-mark--france-us {
  flex-basis: 34px;
  width: 34px;
  background-color: transparent;
  background-image: url("../images/flags/fr.svg"), url("../images/flags/us.svg");
  background-position: left center, right center;
  background-size: 16px 12px;
}

.region-mark--canada {
  background-image: url("../images/flags/ca.svg");
}

.region-mark--singapore {
  background-image: url("../images/flags/sg.svg");
}

.region-mark--uk {
  background-image: url("../images/flags/gb.svg");
}

.region-mark--japan {
  background-image: url("../images/flags/jp.svg");
}

.region-mark--israel {
  background-image: url("../images/flags/il.svg");
}

.region-mark--china-us {
  flex-basis: 34px;
  width: 34px;
  background-color: transparent;
  background-image: url("../images/flags/cn.svg"), url("../images/flags/us.svg");
  background-position: left center, right center;
  background-size: 16px 12px;
}

.frontier-company-ecosystem {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.frontier-company-ecosystem .frontier-company-video {
  min-height: 100%;
}

.frontier-source-note {
  margin: 15px 0 0;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: 13px;
  color: var(--muted);
  background: rgba(var(--dark-panel-rgb), .42);
  font-size: 11px;
}

.frontier-source-note strong {
  color: var(--good);
}

.robotics-proof-strip {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.guide-principles .robotics-proof-strip .proof-stat {
  cursor: pointer;
}

.robotics-proof-strip .proof-stat:nth-child(3n + 1) {
  border-left: 0;
}

.robotics-proof-strip .proof-stat:nth-child(n + 4) {
  border-top: 1px solid var(--line);
}

.robotics-proof-strip .proof-stat strong {
  font-size: clamp(32px, 4.2vw, 54px);
}

.robotics-market-section {
  padding-top: 44px;
  border-top: 1px solid rgba(var(--surface-rgb), .07);
  border-bottom: 1px solid rgba(var(--surface-rgb), .07);
  background:
    radial-gradient(circle at 8% 18%, rgba(var(--good-rgb), .09), transparent 31rem),
    radial-gradient(circle at 92% 70%, rgba(var(--blue-rgb), .1), transparent 30rem),
    rgba(var(--surface-rgb), .018);
}

.robotics-market-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.13fr) minmax(330px, .87fr);
  gap: 14px;
  align-items: stretch;
}

.market-landscape,
.market-deployment {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(var(--dark-panel-rgb), .48);
}

.market-landscape article {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 20px;
  align-items: start;
  padding: 22px;
}

.market-landscape article + article {
  border-top: 1px solid var(--line);
}

.market-landscape article > strong,
.market-deployment-stat strong {
  color: var(--good);
  font-size: clamp(36px, 4vw, 54px);
  line-height: .95;
  letter-spacing: -.06em;
}

.market-landscape article span,
.market-deployment-stat span {
  display: block;
  color: var(--text);
  font-size: 15px;
  font-weight: 780;
  line-height: 1.25;
}

.market-landscape article p {
  margin: 7px 0 13px;
  color: var(--muted);
  font-size: 11px;
}

.market-landscape .tool-links {
  margin-top: 12px;
}

.market-landscape .more {
  font-size: 9px;
}

.market-deployment {
  display: flex;
  flex-direction: column;
  padding: 24px;
  border-color: rgba(var(--blue-rgb), .24);
  background:
    radial-gradient(circle at 100% 0%, rgba(var(--purple-rgb), .15), transparent 24rem),
    linear-gradient(145deg, rgba(var(--blue-rgb), .075), rgba(var(--good-rgb), .035));
}

.market-deployment > .tag {
  align-self: flex-start;
}

.market-deployment-stat {
  display: grid;
  gap: 7px;
  padding: 22px 0;
}

.market-deployment-stat + .market-deployment-stat {
  border-top: 1px solid var(--line);
}

.market-deployment-stat small {
  color: var(--dim);
  font: 700 9px var(--mono);
  text-transform: uppercase;
}

.market-takeaway {
  margin: 0;
  padding: 17px 18px;
  border-left: 2px solid var(--warn);
  color: var(--lead);
  background: rgba(var(--warn-rgb), .045);
  font-size: 13px;
}

.market-deployment .tool-links {
  margin-top: auto;
  padding-top: 20px;
}

.robotics-hands-section {
  border-top: 1px solid rgba(var(--surface-rgb), .07);
  border-bottom: 1px solid rgba(var(--surface-rgb), .07);
  background:
    radial-gradient(circle at 9% 8%, rgba(var(--purple-rgb), .11), transparent 30rem),
    radial-gradient(circle at 92% 80%, rgba(var(--good-rgb), .08), transparent 34rem),
    rgba(var(--surface-rgb), .012);
}

.hands-procurement {
  display: grid;
  grid-template-columns: minmax(0, 1.06fr) minmax(330px, .94fr);
  overflow: hidden;
  border: 1px solid rgba(var(--purple-rgb), .24);
  border-radius: 18px;
  background: rgba(var(--dark-panel-rgb), .5);
}

.hands-procurement > div {
  padding: 27px;
}

.hands-procurement h3 {
  margin: 14px 0 11px;
  font-size: clamp(26px, 3.1vw, 40px);
  line-height: 1.02;
  letter-spacing: -.045em;
}

.hands-procurement p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.hands-procurement .frontier-caveat {
  margin-top: 16px;
  padding: 14px 15px;
  border-left: 2px solid var(--warn);
  background: rgba(var(--warn-rgb), .045);
  font-size: 11px;
}

.hands-procurement .tool-links {
  margin-top: 18px;
}

.hands-layer-flow {
  display: grid;
  margin: 0;
  padding: 0;
  border-left: 1px solid var(--line);
  list-style: none;
  background: linear-gradient(145deg, rgba(var(--blue-rgb), .065), rgba(var(--good-rgb), .025));
}

.hands-layer-flow li {
  display: grid;
  grid-template-columns: 38px 100px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-width: 0;
  padding: 15px 19px;
}

.hands-layer-flow li + li {
  border-top: 1px solid var(--line);
}

.hands-layer-flow span {
  color: var(--good);
  font: 760 9px var(--mono);
}

.hands-layer-flow strong {
  font-size: 14px;
}

.hands-layer-flow small {
  min-width: 0;
  color: var(--muted);
  font: 650 9px/1.45 var(--mono);
}

.hand-company-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 14px;
}

.hand-company {
  display: flex;
  min-width: 0;
  overflow: hidden;
  flex-direction: column;
  border: 1px solid var(--line);
  border-radius: 17px;
  background: var(--panel);
}

.hand-company--component {
  border-color: rgba(var(--warn-rgb), .25);
}

.hand-company--full {
  grid-column: 1 / -1;
}

.hand-company-video {
  position: relative;
  display: block;
  min-width: 0;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  background: #050609;
}

.hand-company-video img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .78;
  transition: opacity .2s ease, transform .25s ease;
}

.hand-company-video:hover img,
.hand-company-video:focus-visible img {
  opacity: 1;
  transform: scale(1.018);
}

.hand-company-video span {
  position: absolute;
  right: 9px;
  bottom: 9px;
  left: 9px;
  transform: none;
  width: auto;
  max-width: none;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 8px 10px;
  border: 1px solid rgba(255, 255, 255, .24);
  border-radius: 999px;
  color: #fff;
  background: rgba(var(--media-overlay-rgb), .82);
  font: 700 9px/1.25 var(--mono);
  text-align: center;
}

.hand-company-copy {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 22px;
}

.hand-company-copy h3 {
  margin: 13px 0 9px;
  font-size: 22px;
  line-height: 1.08;
  letter-spacing: -.035em;
}

.hand-company-copy p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.hand-company-copy dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin: 18px 0 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--line);
}

.hand-company-copy dl div {
  min-width: 0;
  padding: 10px;
  background: var(--solid-panel);
}

.hand-company-copy dt {
  color: var(--dim);
  font: 700 8px var(--mono);
  text-transform: uppercase;
}

.hand-company-copy dd {
  margin: 5px 0 0;
  color: var(--blue);
  font: 750 10px var(--mono);
}

.hand-company-copy .tool-links {
  margin-top: auto;
  padding-top: 18px;
}

.component-label {
  align-self: flex-start;
  margin-top: 18px;
  padding: 8px 10px;
  border: 1px solid rgba(var(--warn-rgb), .22);
  border-radius: 999px;
  color: var(--warn);
  background: rgba(var(--warn-rgb), .04);
  font: 720 8px var(--mono);
  text-transform: uppercase;
}

.hands-checklist {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 14px;
}

.hands-checklist article {
  min-width: 0;
  min-height: 190px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(var(--surface-rgb), .028);
}

.hands-checklist span {
  display: block;
  margin-top: 18px;
  color: var(--good);
  font: 740 9px var(--mono);
  text-transform: uppercase;
}

.hands-checklist h3 {
  margin: 8px 0 7px;
  font-size: 17px;
}

.hands-checklist p {
  margin: 0;
  color: var(--muted);
  font-size: 10px;
}

.robotics-edge-videos .video-card:first-child {
  border-color: rgba(var(--purple-rgb), .25);
}

.robotics-edge-videos .video-card:last-child {
  border-color: rgba(var(--good-rgb), .23);
}

.robotics-route,
.robotics-stack,
.robotics-scoreboard {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 13px;
}

.robotics-route article,
.robotics-stack article,
.robotics-scoreboard article {
  display: flex;
  flex-direction: column;
  min-height: 230px;
  padding: 21px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(var(--surface-rgb), .055), rgba(var(--surface-rgb), .022));
}

.robotics-route article > span,
.robotics-stack article > span,
.robotics-scoreboard article > span,
.robotics-edge-grid article > span,
.unitree-build-map article > span,
.robotics-resource-grid article > span {
  color: var(--good);
  font: 760 10px var(--mono);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.robotics-route h3,
.robotics-stack h3,
.robotics-scoreboard h3 {
  margin: 31px 0 8px;
  font-size: 20px;
}

.robotics-route p,
.robotics-stack p,
.robotics-scoreboard p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.robotics-route article > strong,
.robotics-stack article > small {
  margin-top: auto;
  padding-top: 22px;
  color: var(--blue);
  font: 700 10px var(--mono);
}

.robotics-wedge,
.robotics-safety {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 14px;
}

.robotics-wedge > div,
.robotics-safety > div {
  padding: 23px;
  border: 1px solid rgba(var(--good-rgb), .16);
  border-radius: 16px;
  background: rgba(var(--good-rgb), .035);
}

.robotics-wedge > div:last-child,
.robotics-safety > div:first-child {
  border-color: rgba(var(--bad-rgb), .16);
  background: rgba(var(--bad-rgb), .035);
}

.robotics-wedge h3,
.robotics-safety h3 {
  margin: 12px 0 7px;
  font-size: 21px;
}

.robotics-wedge p,
.robotics-safety p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.robotics-safety .more,
.robotics-safety .tool-links {
  margin-top: 18px;
}

.robotics-stack-section {
  border-top: 1px solid rgba(var(--surface-rgb), .07);
  border-bottom: 1px solid rgba(var(--surface-rgb), .07);
  background: rgba(var(--surface-rgb), .018);
}

.robotics-stack article {
  min-height: 210px;
}

.robotics-core-links {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  margin-top: 15px;
}

.robotics-core-links .more {
  justify-content: center;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(var(--surface-rgb), .025);
  text-align: center;
}

.robotics-edge-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.robotics-edge-grid > article {
  padding: 25px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 100% 0%, rgba(var(--blue-rgb), .1), transparent 22rem),
    var(--panel);
}

.robotics-edge-grid > article:first-child {
  background:
    radial-gradient(circle at 100% 0%, rgba(var(--purple-rgb), .12), transparent 22rem),
    var(--panel);
}

.robotics-edge-grid h3 {
  margin: 10px 0 18px;
  font-size: 29px;
}

.robotics-edge-grid dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.robotics-edge-grid dl div {
  padding: 13px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.robotics-edge-grid dt {
  color: var(--dim);
  font: 700 9px var(--mono);
  text-transform: uppercase;
}

.robotics-edge-grid dd {
  margin: 4px 0 0;
  font-size: 12px;
}

.robotics-edge-grid p {
  margin: 18px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.robotics-edge-grid .more {
  display: inline-flex;
  margin-top: 17px;
}

.robotics-control-line {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr;
  gap: 14px;
  align-items: center;
  margin-top: 14px;
}

.robotics-control-line article {
  min-height: 150px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(var(--surface-rgb), .03);
}

.robotics-control-line article > span {
  color: var(--blue);
  font: 730 9px var(--mono);
  text-transform: uppercase;
}

.robotics-control-line strong {
  display: block;
  margin: 24px 0 6px;
  font-size: 16px;
}

.robotics-control-line p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.robotics-control-line > i {
  color: var(--good);
  font: 800 20px var(--mono);
}

.unitree-section {
  border-top: 1px solid rgba(var(--surface-rgb), .07);
  border-bottom: 1px solid rgba(var(--surface-rgb), .07);
  background:
    radial-gradient(circle at 85% 15%, rgba(var(--warn-rgb), .07), transparent 30rem),
    rgba(var(--surface-rgb), .018);
}

.unitree-timeline {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.unitree-video {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(var(--surface-rgb), .035);
  text-decoration: none;
  transition: border-color .2s ease, transform .2s ease;
}

.unitree-video:hover,
.unitree-video:focus-visible {
  border-color: rgba(var(--good-rgb), .35);
  transform: translateY(-2px);
}

.unitree-video img {
  width: 100%;
  height: 100%;
  min-height: 152px;
  object-fit: cover;
}

.unitree-video > span {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 15px;
}

.unitree-video small {
  color: var(--good);
  font: 720 9px var(--mono);
  text-transform: uppercase;
}

.unitree-video strong {
  margin: 8px 0 6px;
  font-size: 15px;
  line-height: 1.3;
}

.unitree-video em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
}

.unitree-video b {
  margin-top: auto;
  padding-top: 13px;
  color: var(--blue);
  font: 730 10px var(--mono);
}

.unitree-build-map {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 13px;
  margin-top: 15px;
}

.unitree-build-map article {
  display: flex;
  flex-direction: column;
  min-height: 230px;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: rgba(var(--surface-rgb), .025);
}

.unitree-build-map h3 {
  margin: 26px 0 7px;
  font-size: 19px;
}

.unitree-build-map p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.unitree-build-map > article > .more,
.unitree-build-map .tool-links {
  margin-top: auto;
  padding-top: 18px;
}

.robotics-scoreboard article {
  min-height: 205px;
}

.robotics-scoreboard article > strong {
  margin-top: auto;
  padding: 18px 0 6px;
  color: var(--warn);
  font: 750 11px var(--mono);
}

.eu-inc-section {
  border-top: 1px solid rgba(var(--surface-rgb), .07);
  border-bottom: 1px solid rgba(var(--surface-rgb), .07);
  background: rgba(var(--surface-rgb), .018);
}

.eu-inc-card {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  overflow: hidden;
  border: 1px solid rgba(var(--blue-rgb), .2);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 0% 0%, rgba(var(--blue-rgb), .12), transparent 28rem),
    var(--panel);
}

.eu-inc-card > div {
  padding: 28px;
}

.eu-inc-card > div + div {
  border-left: 1px solid var(--line);
  background: rgba(var(--dark-panel-rgb), .3);
}

.eu-inc-mark {
  display: inline-block;
  color: var(--blue);
  font: 850 14px var(--mono);
  letter-spacing: .08em;
}

.eu-inc-card h3 {
  margin: 13px 0 11px;
  font-size: clamp(24px, 3vw, 36px);
}

.eu-inc-card p {
  color: var(--muted);
  font-size: 13px;
}

.eu-inc-checks > span {
  color: var(--good);
  font: 760 10px var(--mono);
  text-transform: uppercase;
}

.eu-inc-checks ul {
  display: grid;
  gap: 9px;
  margin: 18px 0 24px;
  padding-left: 19px;
  color: var(--muted);
  font-size: 12px;
}

.prototype-feature {
  display: grid;
  grid-template-columns: 1fr 1fr;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--panel);
}

.prototype-feature > div:last-child {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 25px;
}

.prototype-feature h3 {
  margin: 12px 0 8px;
  font-size: 24px;
}

.prototype-feature p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.prototype-feature .tool-links {
  margin-top: 18px;
}

.chapter-links {
  margin-top: 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(var(--surface-rgb), .025);
}

.chapter-links > summary {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 17px 19px;
  cursor: pointer;
  list-style: none;
}

.chapter-links > summary::-webkit-details-marker {
  display: none;
}

.chapter-links > summary span {
  font-weight: 760;
}

.chapter-links > summary small {
  color: var(--dim);
  font: 700 10px var(--mono);
}

.chapter-links > div {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  border-top: 1px solid var(--line);
  background: var(--line);
}

.chapter-links a {
  padding: 12px;
  color: var(--muted);
  background: var(--solid-panel);
  font-size: 10px;
  text-decoration: none;
}

.chapter-links a:hover {
  color: var(--text);
}

.chapter-links b {
  display: block;
  margin-bottom: 3px;
  color: var(--good);
  font-family: var(--mono);
}

.robotics-resource-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 13px;
  margin-top: 14px;
}

.robotics-resource-grid article {
  min-height: 240px;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: rgba(var(--surface-rgb), .025);
}

.robotics-resource-grid h3 {
  margin: 26px 0 13px;
  font-size: 19px;
}

/* AI Now Summit video library */
.ai-now-section {
  border-top: 1px solid rgba(var(--surface-rgb), .07);
  border-bottom: 1px solid rgba(var(--surface-rgb), .07);
  background:
    radial-gradient(circle at 90% 0%, rgba(var(--purple-rgb), .08), transparent 32rem),
    rgba(var(--surface-rgb), .018);
}

.ai-now-filter {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 7px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: rgba(var(--dark-panel-rgb), .5);
}

.ai-now-filter button {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 11px;
  border: 1px solid transparent;
  border-radius: 10px;
  color: var(--muted);
  background: transparent;
  font: 720 10px var(--mono);
  cursor: pointer;
}

.ai-now-filter button span {
  color: var(--dim);
}

.ai-now-filter button:hover,
.ai-now-filter button.active {
  color: var(--text);
  border-color: rgba(var(--purple-rgb), .25);
  background: rgba(var(--purple-rgb), .08);
}

.ai-now-filter button.active span {
  color: var(--good);
}

.ai-now-summary {
  margin: 12px 2px;
  color: var(--dim);
  font: 700 10px var(--mono);
}

.ai-now-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.ai-now-card {
  display: grid;
  grid-template-rows: auto 1fr;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(var(--surface-rgb), .03);
  text-decoration: none;
  transition: border-color .2s ease, transform .2s ease;
}

.ai-now-card:hover,
.ai-now-card:focus-visible {
  border-color: rgba(var(--purple-rgb), .36);
  transform: translateY(-2px);
}

.ai-now-card img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  opacity: .82;
  transition: opacity .2s ease;
}

.ai-now-card:hover img {
  opacity: 1;
}

.ai-now-card > span {
  display: flex;
  flex-direction: column;
  min-height: 148px;
  padding: 15px;
}

.ai-now-card small {
  color: var(--good);
  font: 720 9px var(--mono);
  text-transform: uppercase;
}

.ai-now-card strong {
  margin: 11px 0;
  font-size: 16px;
  line-height: 1.3;
}

.ai-now-card em {
  margin-top: auto;
  color: var(--blue);
  font: 720 10px var(--mono);
  font-style: normal;
}

@media (max-width: 900px) {
  .frontier-lanes {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    background: var(--line);
  }

  .frontier-lanes article {
    border-left: 0 !important;
    background: var(--solid-panel);
  }

  .frontier-evidence-ladder {
    grid-template-columns: 1fr;
    gap: 13px;
  }

  .figure-release-list,
  .frontier-company-grid,
  .robotics-market-grid,
  .hands-procurement,
  .hand-company-grid {
    grid-template-columns: 1fr;
  }

  .hands-layer-flow {
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .hands-checklist {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .frontier-company-ecosystem {
    grid-column: auto;
  }

  .robotics-route,
  .robotics-stack,
  .robotics-scoreboard,
  .unitree-build-map,
  .robotics-resource-grid,
  .ai-now-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .robotics-core-links {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .unitree-timeline {
    grid-template-columns: 1fr;
  }

  .ai-now-filter {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .robotics-proof-strip {
    grid-template-columns: 1fr;
  }

  .frontier-hero,
  .frontier-company-ecosystem {
    grid-template-columns: 1fr;
  }

  .frontier-hero > .video-frame,
  .frontier-company-ecosystem .frontier-company-video {
    min-height: 0;
  }

  .frontier-hero > .video-frame {
    height: auto;
    aspect-ratio: 16 / 9;
  }

  .frontier-lanes {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .frontier-evidence-ladder ol {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .figure-year {
    grid-template-columns: 1fr;
    gap: 9px;
  }

  .robotics-edge-grid,
  .robotics-wedge,
  .robotics-safety,
  .eu-inc-card,
  .prototype-feature {
    grid-template-columns: 1fr;
  }

  .robotics-control-line {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .robotics-control-line > i {
    display: none;
  }

  .eu-inc-card > div + div {
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .prototype-feature > .video-frame {
    min-height: 260px;
  }

  .chapter-links > div {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .frontier-hero-copy,
  .frontier-company-copy,
  .hand-company-copy,
  .hands-procurement > div {
    padding: 20px;
  }

  .frontier-lanes,
  .frontier-evidence-ladder ol {
    grid-template-columns: 1fr;
  }

  .frontier-lanes article {
    min-height: 0;
  }

  .frontier-lanes strong {
    margin-top: 22px;
  }

  .figure-release {
    grid-template-columns: 1fr;
  }

  .market-landscape article {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .figure-release-media {
    aspect-ratio: 16 / 9;
  }

  .robotics-route,
  .robotics-stack,
  .robotics-scoreboard,
  .hands-checklist,
  .unitree-build-map,
  .robotics-resource-grid,
  .ai-now-grid,
  .robotics-core-links {
    grid-template-columns: 1fr;
  }

  .hands-layer-flow li {
    grid-template-columns: 30px 70px minmax(0, 1fr);
    padding: 13px 15px;
  }

  .unitree-video {
    grid-template-columns: 1fr;
  }

  .unitree-video img {
    height: auto;
    aspect-ratio: 16 / 9;
    min-height: 0;
  }

  .robotics-edge-grid dl,
  .ai-now-filter {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .chapter-links > div {
    grid-template-columns: 1fr;
  }
}

/* July 2026 content-density, embedded-video and robotics refinements */
.ai-now-card[hidden] {
  display: none !important;
}

.ai-now-card {
  grid-template-rows: auto 1fr;
}

.ai-now-card:hover {
  transform: none;
}

.ai-now-card-copy {
  display: flex;
  flex-direction: column;
  min-height: 108px;
  padding: 15px;
}

.ai-now-card-copy strong {
  margin-bottom: 0;
}

.ai-now-video {
  width: 100%;
}

.card-icon {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  margin-bottom: 18px;
  border: 1px solid rgba(var(--surface-rgb), .18);
  border-radius: 10px;
  color: var(--muted);
  background: rgba(var(--surface-rgb), .035);
  font: 750 18px var(--mono);
  font-style: normal;
}

.robotics-route article,
.robotics-stack article {
  position: relative;
}

.robotics-route article > .card-icon + span,
.robotics-stack article > .card-icon + span {
  position: absolute;
  top: 27px;
  right: 20px;
  left: 68px;
  overflow: hidden;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.robotics-route article h3,
.robotics-stack article h3 {
  margin-top: 10px;
}

.frontier-hero-evidence {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr);
  gap: 14px;
  margin-top: 14px;
}

.frontier-hero-evidence > div,
.frontier-hero-evidence > aside {
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: rgba(var(--surface-rgb), .025);
}

.frontier-hero-evidence p {
  margin: 11px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.frontier-hero-evidence .frontier-caveat {
  margin: 0;
}

.frontier-hero-evidence .tool-links {
  margin-top: 15px;
}

.figure-release > div:not(.figure-release-media) {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 16px;
}

.figure-release > .figure-release-media {
  display: block;
  padding: 0;
}

.figure-release--milestone {
  grid-column: 1 / -1;
  grid-template-columns: minmax(320px, .95fr) minmax(0, 1.05fr);
  border-color: rgba(var(--purple-rgb), .42);
  background:
    radial-gradient(circle at 0% 50%, rgba(var(--purple-rgb), .16), transparent 28rem),
    linear-gradient(135deg, rgba(var(--purple-rgb), .075), rgba(var(--blue-rgb), .035));
  box-shadow: 0 18px 60px rgba(0, 0, 0, .22);
}

.figure-release--milestone h3 {
  font-size: 23px;
}

.figure-release--milestone .figure-release-media {
  aspect-ratio: 16 / 9;
}

.robotics-core-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  align-items: center;
  margin-top: 24px;
  padding: 13px 15px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.robotics-core-links::before {
  content: "Core references";
  margin-right: 8px;
  color: var(--dim);
  font: 740 9px var(--mono);
  text-transform: uppercase;
}

.robotics-core-links .more {
  justify-content: flex-start;
  padding: 7px 9px;
  border: 0;
  border-radius: 7px;
  background: transparent;
}

.robotics-core-links .more:hover,
.robotics-core-links .more:focus-visible {
  background: rgba(var(--good-rgb), .06);
}

.chapter-links button {
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  color: var(--muted);
  background: rgba(var(--surface-rgb), .025);
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.chapter-links button:hover,
.chapter-links button:focus-visible {
  color: var(--text);
  border-color: rgba(var(--good-rgb), .26);
}

.chapter-links button b {
  color: var(--good);
}

.evidence-intro {
  margin: 0 0 15px;
  padding: 14px 16px;
  border-left: 2px solid var(--good);
  color: var(--muted);
  background: rgba(var(--good-rgb), .04);
  font-size: 12px;
}

.evidence-intro strong {
  color: var(--text);
}

.decision-usecases {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.decision-usecases article {
  display: flex;
  flex-direction: column;
}

.decision-usecases .evidence-label {
  color: var(--good);
  font: 720 9px var(--mono);
  text-transform: uppercase;
}

.decision-usecases h3 {
  margin-top: 17px;
}

.decision-usecases .more {
  margin-top: auto;
  padding-top: 18px;
  font-size: 10px;
}

.cloud-quickstart {
  padding: 24px 0 34px;
  border-bottom: 1px solid rgba(var(--surface-rgb), .07);
}

.cloud-quickstart-head {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(320px, .58fr);
  column-gap: 40px;
  align-items: end;
  margin-bottom: 16px;
}

.cloud-quickstart-head .tag {
  grid-column: 1 / -1;
}

.cloud-quickstart-head h2 {
  margin: 10px 0 0;
  font-size: clamp(26px, 4vw, 43px);
  letter-spacing: -.045em;
  line-height: 1;
}

.cloud-quickstart-head p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.cloud-quickstart-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.cloud-quickstart-grid a {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  grid-template-rows: auto auto;
  gap: 12px;
  min-width: 0;
  padding: 17px;
  border: 1px solid var(--line);
  border-radius: 14px;
  color: var(--text);
  background: linear-gradient(145deg, rgba(var(--surface-rgb), .045), rgba(var(--surface-rgb), .02));
  text-decoration: none;
}

.cloud-quickstart-grid a:hover,
.cloud-quickstart-grid a:focus-visible {
  border-color: rgba(var(--good-rgb), .3);
  background: rgba(var(--good-rgb), .04);
}

.cloud-quickstart-grid i {
  display: grid;
  place-items: center;
  grid-column: 1;
  grid-row: 1;
  align-self: start;
  width: 34px;
  height: 34px;
  border: 1px solid rgba(var(--surface-rgb), .16);
  border-radius: 10px;
  color: var(--muted);
  font: 750 17px var(--mono);
  font-style: normal;
}

.cloud-quickstart-grid span {
  display: flex;
  flex-direction: column;
}

.cloud-quickstart-grid .cloud-quickstart-copy {
  display: contents;
}

.cloud-quickstart-title {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
}

.cloud-quickstart-grid small {
  color: var(--good);
  font: 720 9px var(--mono);
  text-transform: uppercase;
}

.cloud-quickstart-grid strong {
  margin: 12px 0 7px;
  font-size: 14px;
  line-height: 1.25;
}

.cloud-quickstart-grid em {
  grid-column: 1 / -1;
  grid-row: 2;
  margin-top: 0;
  color: var(--muted);
  font-size: 10px;
  font-style: normal;
}

.nested-heading-line {
  gap: 14px;
}

.nested-heading-line .section-share {
  flex: none;
}

@media (max-width: 1100px) {
  .decision-usecases {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .cloud-quickstart-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 800px) {
  .frontier-hero-evidence,
  .cloud-quickstart-head {
    grid-template-columns: 1fr;
  }

  .cloud-quickstart-head p {
    margin-top: 14px;
  }

  .figure-release--milestone {
    grid-template-columns: minmax(230px, .9fr) minmax(0, 1.1fr);
  }

  .decision-usecases {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .figure-release--milestone,
  .decision-usecases,
  .cloud-quickstart-grid {
    grid-template-columns: 1fr;
  }

  .robotics-route article > .card-icon + span,
  .robotics-stack article > .card-icon + span {
    position: static;
    text-align: left;
  }

  .robotics-route article h3,
  .robotics-stack article h3 {
    margin-top: 24px;
  }

  .robotics-core-links {
    align-items: stretch;
  }

  .robotics-core-links::before {
    flex-basis: 100%;
    margin: 0 0 7px;
  }
}

/* Relatable monochrome iconography for decisions, platforms and filters */
.card-icon[data-icon],
.operating-icon[data-icon],
.cloud-quickstart-grid i[data-icon] {
  font-size: 0;
}

.card-icon[data-icon]::before,
.operating-icon[data-icon]::before,
.cloud-quickstart-grid i[data-icon]::before {
  content: "";
  display: block;
  width: 18px;
  height: 18px;
  background: var(--semantic-icon) center / contain no-repeat;
  filter: var(--external-svg-filter);
}

[data-icon="eye"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/eye.svg"); }
[data-icon="badge-dollar-sign"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/badge-dollar-sign.svg"); }
[data-icon="scan-line"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/scan-line.svg"); }
[data-icon="gamepad-2"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/gamepad-2.svg"); }
[data-icon="brain-circuit"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/brain-circuit.svg"); }
[data-icon="shield-check"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/shield-check.svg"); }
[data-icon="map-pinned"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/map-pinned.svg"); }
[data-icon="bot"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/bot.svg"); }
[data-icon="scan-eye"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/scan-eye.svg"); }
[data-icon="route"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/route.svg"); }
[data-icon="database-zap"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/database-zap.svg"); }
[data-icon="network"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/network.svg"); }
[data-icon="hospital"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/hospital.svg"); }
[data-icon="bed"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/bed.svg"); }
[data-icon="plane"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/plane.svg"); }
[data-icon="bus-front"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/bus-front.svg"); }
[data-icon="users-round"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/users-round.svg"); }
[data-icon="workflow"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/workflow.svg"); }
[data-icon="cpu"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/cpu.svg"); }
[data-icon="server-cog"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/server-cog.svg"); }
[data-icon="boxes"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/boxes.svg"); }
[data-icon="cloud"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/cloud.svg"); }
[data-icon="clipboard-check"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/clipboard-check.svg"); }
[data-icon="upload"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/upload.svg"); }
[data-icon="triangle-alert"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/triangle-alert.svg"); }

.platform-marks {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: .32em;
  margin-right: .46em;
  vertical-align: -.12em;
}

.tag > .platform-marks,
.eyebrow > .platform-marks {
  margin-right: 0;
}

.platform-mark {
  display: inline-block;
  width: 1em;
  height: 1em;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  filter: var(--external-svg-filter);
}

.platform-mark-windows {
  background-image: url("https://cdn.jsdelivr.net/gh/FortAwesome/Font-Awesome@6.7.2/svgs/brands/windows.svg");
}

.platform-mark-apple {
  background-image: url("https://cdn.jsdelivr.net/gh/FortAwesome/Font-Awesome@6.7.2/svgs/brands/apple.svg");
}

.platform-mark-linux {
  background-image: url("https://cdn.jsdelivr.net/gh/FortAwesome/Font-Awesome@6.7.2/svgs/brands/linux.svg");
}

.eyebrow .platform-mark {
  filter: var(--external-svg-filter-good);
}

.filter[data-filter],
.stack-coverage button[data-tool-filter] {
  --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/layout-grid.svg");
}

.filter::before,
.stack-coverage button::before {
  content: "";
  border: 0;
  border-radius: 0;
  background: var(--filter-icon) center / contain no-repeat;
  filter: var(--external-svg-filter);
}

.filter[data-filter="coding"],
.stack-coverage button[data-tool-filter="coding-context"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/code-xml.svg"); }
.filter[data-filter="research"],
.stack-coverage button[data-tool-filter="retrieval"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/search.svg"); }
.filter[data-filter="operations"],
.stack-coverage button[data-tool-filter="automation"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/cog.svg"); }
.filter[data-filter="smallbiz"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/briefcase-business.svg"); }
.filter[data-filter="personal"],
.stack-coverage button[data-tool-filter="personal-knowledge"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/user.svg"); }
.filter[data-filter="education"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/graduation-cap.svg"); }
.filter[data-filter="healthcare"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/heart-pulse.svg"); }
.filter[data-filter="science"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/flask-conical.svg"); }
.stack-coverage button[data-tool-filter="interfaces"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/panels-top-left.svg"); }
.stack-coverage button[data-tool-filter="inference"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/brain-circuit.svg"); }
.stack-coverage button[data-tool-filter="routing"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/route.svg"); }
.stack-coverage button[data-tool-filter="structured-memory"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/database.svg"); }
.stack-coverage button[data-tool-filter="speech"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/audio-lines.svg"); }
.stack-coverage button[data-tool-filter="telephony"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/phone.svg"); }
.stack-coverage button[data-tool-filter="data-movement"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/arrow-left-right.svg"); }
.stack-coverage button[data-tool-filter="analytics"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/chart-no-axes-combined.svg"); }
.stack-coverage button[data-tool-filter="geospatial"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/map.svg"); }
.stack-coverage button[data-tool-filter="training"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/boxes.svg"); }
.stack-coverage button[data-tool-filter="evaluation"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/badge-check.svg"); }
.stack-coverage button[data-tool-filter="durable-agents"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/repeat-2.svg"); }
.stack-coverage button[data-tool-filter="observability"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/radar.svg"); }
.stack-coverage button[data-tool-filter="identity-secrets"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/key-round.svg"); }
.stack-coverage button[data-tool-filter="containment"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/shield-check.svg"); }
.stack-coverage button[data-tool-filter="skills"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/puzzle.svg"); }
.stack-coverage button[data-tool-filter="context-efficiency"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/gauge.svg"); }
.stack-coverage button[data-tool-filter="document-media"] { --filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/files.svg"); }

/* Keep the benchmark chooser in the same compact, icon-led language as tools. */
.benchmark-filter-options button[data-benchmark-filter] {
  --benchmark-filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/layout-grid.svg");
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 4px;
  min-width: 0;
  min-height: 0;
  padding: 5px 8px;
  border-color: transparent;
  border-radius: 999px;
  color: var(--muted);
  background: rgba(var(--blue-rgb), .075);
  font: 10px var(--mono);
  transition: color .2s ease, background .2s ease, border-color .2s ease;
}

.benchmark-filter-options button[data-benchmark-filter]::before {
  content: "";
  display: block;
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  background: var(--benchmark-filter-icon) center / contain no-repeat;
  filter: var(--external-svg-filter);
}

.benchmark-filter-options button[data-benchmark-filter]:hover {
  border-color: var(--line);
  color: var(--text);
  background: rgba(var(--blue-rgb), .075);
}

.benchmark-filter-options button[data-benchmark-filter].active {
  border-color: var(--good);
  color: var(--on-solid-accent);
  background: var(--good);
}

.benchmark-filter-options button[data-benchmark-filter].active::after {
  content: "✓";
  margin-left: 1px;
  font-family: var(--mono);
  font-weight: 900;
}

.benchmark-filter-options button[data-benchmark-filter].active::before {
  filter: brightness(0) saturate(100%);
}

@media (prefers-color-scheme: light) {
  .benchmark-filter-options button[data-benchmark-filter].active::before {
    filter: brightness(0) saturate(100%) invert(1);
  }
}

.benchmark-filter-options .filter-count {
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  font-size: 8px;
}

.benchmark-filter-options button[data-benchmark-filter="referenced"] { --benchmark-filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/link-2.svg"); }
.benchmark-filter-options button[data-benchmark-filter="preference"] { --benchmark-filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/messages-square.svg"); }
.benchmark-filter-options button[data-benchmark-filter="reasoning"] { --benchmark-filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/brain-circuit.svg"); }
.benchmark-filter-options button[data-benchmark-filter="coding"] { --benchmark-filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/code-xml.svg"); }
.benchmark-filter-options button[data-benchmark-filter="agents"] { --benchmark-filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/workflow.svg"); }
.benchmark-filter-options button[data-benchmark-filter="multimodal"] { --benchmark-filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/scan-eye.svg"); }
.benchmark-filter-options button[data-benchmark-filter="safety"] { --benchmark-filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/shield-alert.svg"); }
.benchmark-filter-options button[data-benchmark-filter="systems"] { --benchmark-filter-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/gauge.svg"); }

.benchmark-map span[data-icon] {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.benchmark-map span[data-icon]::before {
  content: "";
  display: block;
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  background: var(--semantic-icon) center / contain no-repeat;
  filter: var(--external-svg-filter);
}

/* Benchmark titles use the publisher/project mark as a stable left anchor. */
.benchmark-card {
  --benchmark-logo: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/trophy.svg");
}

.benchmark-card h3 {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 18px;
}

.benchmark-card h3::before {
  content: "";
  display: block;
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  background: var(--benchmark-logo) center / contain no-repeat;
  filter: var(--external-svg-filter);
}

/* Benchmark cards use their own single pseudo-element mark. */
.benchmark-card h3 > .brand-marks {
  display: none;
}

.benchmark-card#arena { --benchmark-logo: url("https://arena.ai/images/favicon-rebrand.svg"); }
.benchmark-card#eq-bench,
.benchmark-card#matharena,
.benchmark-card#webdev-arena { --benchmark-logo: url("../images/logos/tools/semantic-benchmark.svg"); }
.benchmark-card#jailbreakbench-harmbench { --benchmark-logo: url("../images/logos/tools/semantic-security.svg"); }

/* Keep local stroke-only fallbacks theme-aware when painted as backgrounds. */
:is(
  .benchmark-card#eq-bench,
  .benchmark-card#matharena,
  .benchmark-card#webdev-arena,
  .benchmark-card#jailbreakbench-harmbench
) h3::before {
  background: var(--benchmark-logo) center / contain no-repeat;
  filter: invert(.82);
  opacity: .9;
  -webkit-mask: none;
  mask: none;
}
.benchmark-card#alpacaeval { --benchmark-logo: url("https://raw.githubusercontent.com/tatsu-lab/alpaca_eval/main/docs/AlpacaFarm_small.png"); }
.benchmark-card#helm,
.benchmark-card#vhelm,
.benchmark-card#helm-safety { --benchmark-logo: url("https://crfm.stanford.edu/helm/helm.svg"); }
.benchmark-card#open-llm-leaderboard,
.benchmark-card#gaia { --benchmark-logo: url("https://cdn.simpleicons.org/huggingface"); }
.benchmark-card#mmlu-pro,
.benchmark-card#tau-bench { --benchmark-logo: url("https://cdn.simpleicons.org/github"); }
.benchmark-card#gpqa,
.benchmark-card#acbench { --benchmark-logo: url("https://cdn.simpleicons.org/arxiv"); }
.benchmark-card#arc-agi { --benchmark-logo: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/puzzle.svg"); }
.benchmark-card#hle { --benchmark-logo: url("https://www.lastexam.ai/favicon.ico"); }
.benchmark-card#aime { --benchmark-logo: url("https://cdn.simpleicons.org/academia"); }
.benchmark-card#ifeval { --benchmark-logo: url("https://cdn.simpleicons.org/google"); }
.benchmark-card#ruler { --benchmark-logo: url("https://cdn.simpleicons.org/nvidia"); }
.benchmark-card#swe-bench { --benchmark-logo: url("https://www.swebench.com/favicon.ico"); }
.benchmark-card#livecodebench { --benchmark-logo: url("https://livecodebench.github.io/images/favicon.svg"); }
.benchmark-card#aider-polyglot { --benchmark-logo: url("https://cdn.jsdelivr.net/gh/Aider-AI/aider/aider/website/assets/logo.svg"); }
.benchmark-card#humaneval,
.benchmark-card#browsecomp { --benchmark-logo: url("https://cdn.jsdelivr.net/npm/simple-icons@13.21.0/icons/openai.svg"); }
.benchmark-card#bfcl { --benchmark-logo: url("https://gorilla.cs.berkeley.edu/favicon.ico"); }
.benchmark-card#mcp-atlas { --benchmark-logo: url("https://labs.scale.com/images/favicon.svg"); }
.benchmark-card#metr-time-horizons { --benchmark-logo: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/timer.svg"); }
.benchmark-card#terminal-bench { --benchmark-logo: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/square-terminal.svg"); }
.benchmark-card#terminalworld { --benchmark-logo: url("https://terminalworld.ai/favicon.ico"); }
.benchmark-card#osworld { --benchmark-logo: url("https://osworld-v2.xlang.ai/static/images/favicon.png"); }
.benchmark-card#agents-last-exam { --benchmark-logo: url("https://agents-last-exam.org/favicon.ico?603d046c9a6fdfbb"); }
.benchmark-card#gpt-investor { --benchmark-logo: url("https://storage.ghost.io/c/67/dc/67dcc269-0f34-4b92-a56b-1029dfb080ad/content/images/size/w256h256/2023/06/Red-Elegant-Modern-Design-Football-Club-Logo--3-.png"); }
.benchmark-card#mmmu { --benchmark-logo: url("https://mmmu-benchmark.github.io/static/images/mmmu_icon2.png"); }
.benchmark-card#minebench { --benchmark-logo: url("https://minebench.ai/favicon.ico"); }
.benchmark-card#voxelbench { --benchmark-logo: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/boxes.svg"); }
.benchmark-card#mlperf { --benchmark-logo: url("https://mlcommons.org/wp-content/themes/mlcommons/build/img/favicon/apple-touch-icon.png"); }
.benchmark-card#ml-energy { --benchmark-logo: url("https://ml.energy/assets/img/favicon/apple-touch-icon.png"); }
.benchmark-card#harness-efficiency { --benchmark-logo: url("https://nqawhc.github.io/favicon.svg"); }

/* Raster project marks stay recognisable, but share the catalogue's monochrome finish. */
:is(
  .benchmark-card#alpacaeval,
  .benchmark-card#hle,
  .benchmark-card#swe-bench,
  .benchmark-card#bfcl,
  .benchmark-card#terminalworld,
  .benchmark-card#osworld,
  .benchmark-card#agents-last-exam,
  .benchmark-card#gpt-investor,
  .benchmark-card#mmmu,
  .benchmark-card#minebench,
  .benchmark-card#mlperf,
  .benchmark-card#ml-energy
) h3::before {
  border-radius: 5px;
  background: var(--benchmark-logo) center / contain no-repeat;
  filter: grayscale(1) contrast(1.12);
  -webkit-mask: none;
  mask: none;
}

/* OSWorld ships a dark mark, so invert it only against the dark site palette. */
.benchmark-card#osworld h3::before {
  filter: grayscale(1) contrast(1.12) invert(1);
}

@media (prefers-color-scheme: light) {
  :is(
    .benchmark-card#eq-bench,
    .benchmark-card#matharena,
    .benchmark-card#webdev-arena,
    .benchmark-card#jailbreakbench-harmbench
  ) h3::before {
    filter: none;
  }

  .benchmark-card#osworld h3::before {
    filter: grayscale(1) contrast(1.12);
  }
}

/* Shared icon and brand language */
.card-icon,
.operating-icon,
.cloud-quickstart-grid i,
.flow-icon,
.stage-icon,
.scaling-effect-icon {
  box-sizing: border-box;
  border-radius: 50%;
  line-height: 0;
}

.flow-icon,
.stage-icon,
.scaling-effect-icon {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 34px;
  height: 34px;
  border: 1px solid rgba(var(--surface-rgb), .18);
  color: var(--muted);
  background: rgba(var(--surface-rgb), .035);
  font-style: normal;
}

.flow-icon,
.stage-icon {
  margin-bottom: 14px;
}

.card-icon[data-icon],
.operating-icon[data-icon],
.cloud-quickstart-grid i[data-icon],
.flow-icon[data-icon],
.stage-icon[data-icon],
.scaling-effect-icon[data-icon] {
  font-size: 0;
}

.card-icon[data-icon]::before,
.operating-icon[data-icon]::before,
.cloud-quickstart-grid i[data-icon]::before,
.flow-icon[data-icon]::before,
.stage-icon[data-icon]::before,
.scaling-effect-icon[data-icon]::before {
  content: "";
  display: block;
  width: 18px;
  height: 18px;
  background: var(--semantic-icon) center / contain no-repeat;
  filter: var(--external-svg-filter);
}

[data-icon="file-check-2"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/file-check-2.svg"); }
[data-icon="book-open-check"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/book-open-check.svg"); }
[data-icon="wrench"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/wrench.svg"); }
[data-icon="badge-check"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/badge-check.svg"); }
[data-icon="circle-check-big"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/circle-check-big.svg"); }
[data-icon="scan-search"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/scan-search.svg"); }
[data-icon="chart-no-axes-combined"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/chart-no-axes-combined.svg"); }
[data-icon="landmark"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/landmark.svg"); }
[data-icon="factory"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/factory.svg"); }
[data-icon="library"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/library.svg"); }
[data-icon="sparkles"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/sparkles.svg"); }
[data-icon="footprints"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/footprints.svg"); }
[data-icon="gauge"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/gauge.svg"); }
[data-icon="rocket"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/rocket.svg"); }
[data-icon="bell-ring"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/bell-ring.svg"); }
[data-icon="scroll-text"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/scroll-text.svg"); }
[data-icon="database"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/database.svg"); }
[data-icon="package-check"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/package-check.svg"); }
[data-icon="list-checks"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/list-checks.svg"); }
[data-icon="laptop"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/laptop.svg"); }
[data-icon="pc-case"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/pc-case.svg"); }
[data-icon="server"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/server.svg"); }
[data-icon="cloud-cog"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/cloud-cog.svg"); }
[data-icon="webhook"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/webhook.svg"); }
[data-icon="file-search"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/file-search.svg"); }
[data-icon="sliders-horizontal"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/sliders-horizontal.svg"); }
[data-icon="book-open-text"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/book-open-text.svg"); }
[data-icon="atom"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/atom.svg"); }
[data-icon="list-tree"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/list-tree.svg"); }
[data-icon="refresh-cw-off"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/refresh-cw-off.svg"); }
[data-icon="receipt-text"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/receipt-text.svg"); }
[data-icon="trophy"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/trophy.svg"); }
[data-icon="copyright"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/copyright.svg"); }
[data-icon="briefcase-business"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/briefcase-business.svg"); }
[data-icon="code-xml"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/code-xml.svg"); }
[data-icon="handshake"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/handshake.svg"); }
[data-icon="person-standing"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/person-standing.svg"); }
[data-icon="hand"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/hand.svg"); }
[data-icon="timer-reset"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/timer-reset.svg"); }
[data-icon="cable"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/cable.svg"); }
[data-icon="flask-conical"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/flask-conical.svg"); }
[data-icon="life-buoy"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/life-buoy.svg"); }
[data-icon="timer"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/timer.svg"); }
[data-icon="activity"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/activity.svg"); }
[data-icon="shield-alert"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/shield-alert.svg"); }
[data-icon="languages"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/languages.svg"); }
[data-icon="messages-square"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/messages-square.svg"); }
[data-icon="shield-question"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/shield-question.svg"); }
[data-icon="git-branch"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/git-branch.svg"); }
[data-icon="square-terminal"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/square-terminal.svg"); }
[data-icon="panels-top-left"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/panels-top-left.svg"); }
[data-icon="circle-gauge"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/circle-gauge.svg"); }
[data-icon="chart-spline"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/chart-spline.svg"); }
[data-icon="orbit"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/orbit.svg"); }
[data-icon="scale"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/scale.svg"); }

.verdict-card strong {
  display: flex;
  align-items: flex-start;
  gap: 9px;
}

.verdict-card strong::before {
  content: "";
  display: block;
  flex: 0 0 auto;
  width: 25px;
  height: 25px;
  margin: -.02em 0 0;
  border: 0;
  border-radius: 0;
  background: var(--verdict-icon) center / contain no-repeat;
  filter: var(--external-svg-filter);
}

.verdict-real strong { --verdict-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/circle-check-big.svg"); }
.verdict-open strong { --verdict-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/circle-gauge.svg"); }
.verdict-risk strong { --verdict-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/circle-alert.svg"); }

.architecture-flow .flow-icon {
  margin-bottom: 12px;
}

.industry-groups li {
  grid-template-columns: 34px minmax(0, 1fr);
  align-content: center;
  column-gap: 12px;
}

.industry-groups .card-icon {
  grid-row: 1 / 3;
  align-self: start;
  margin: 0;
}

.industry-groups b,
.industry-groups span {
  grid-column: 2;
}

.usecase > .tag {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.usecase > .tag::before {
  content: "";
  display: block;
  width: 13px;
  height: 13px;
  background: var(--usecase-icon) center / contain no-repeat;
  filter: var(--external-svg-filter-good);
}

.usecase[data-category="coding"] { --usecase-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/code-xml.svg"); }
.usecase[data-category="research"] { --usecase-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/search.svg"); }
.usecase[data-category="operations"] { --usecase-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/cog.svg"); }
.usecase[data-category="smallbiz"] { --usecase-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/briefcase-business.svg"); }
.usecase[data-category="personal"] { --usecase-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/user.svg"); }
.usecase[data-category="education"] { --usecase-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/graduation-cap.svg"); }
.usecase[data-category="healthcare"] { --usecase-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/heart-pulse.svg"); }
.usecase[data-category="science"] { --usecase-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/flask-conical.svg"); }

.compass-stages li > span[data-icon] {
  font-size: 0;
}

.compass-stages li > span[data-icon]::after {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  background: var(--semantic-icon) center / contain no-repeat;
  filter: var(--external-svg-filter);
}

.adoption-rail .stage-icon {
  margin-bottom: 13px;
}

.adoption-rail .stage-icon::before {
  filter: var(--external-svg-filter-good);
}

.adoption-rail .stage-icon + span {
  color: var(--dim);
}

.adoption-rail .stage-icon ~ strong {
  margin-top: 12px;
}

.path-badge {
  align-items: center;
  gap: 6px;
  line-height: 1.25;
}

.privacy-router .path-badge::before {
  content: "";
  flex: 0 0 auto;
  width: 9px;
  height: 9px;
  background: var(--route-icon) center / contain no-repeat;
  filter: var(--external-svg-filter);
}

.privacy-router .route-red .path-badge { --route-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/lock-keyhole.svg"); }
.privacy-router .route-amber .path-badge { --route-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/scan-search.svg"); }
.privacy-router .route-green .path-badge { --route-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/circle-check-big.svg"); }

.scaling-effect {
  position: relative;
  grid-template-columns: 78px minmax(0, 1fr) minmax(220px, .36fr);
  grid-template-rows: auto auto;
  column-gap: 20px;
  row-gap: 0;
  align-items: start;
}

.scaling-effect-icon {
  grid-column: 1;
  grid-row: 1 / 3;
  align-self: start;
  width: 78px;
  height: 78px;
  border-color: rgba(var(--warn-rgb), .3);
  color: var(--warn);
  background: rgba(var(--warn-rgb), .07);
}

.scaling-effect-icon[data-icon]::before {
  width: 40px;
  height: 40px;
}

.scaling-effect > .status-chip {
  position: static;
  grid-column: 2;
  grid-row: 1;
  justify-self: start;
  margin: 0 0 9px;
  transform: none;
}

.scaling-effect > div:not(.tool-links) {
  grid-column: 2;
  grid-row: 2;
  padding-top: 0;
}

.scaling-effect > .tool-links {
  grid-column: 3;
  grid-row: 1 / 3;
  align-self: start;
}

.brand-heading {
  display: flex !important;
  align-items: flex-start;
  gap: 10px;
}

.tag.brand-heading,
.model-name.brand-heading {
  display: inline-flex !important;
  align-items: center;
}

.tag.brand-heading > .brand-marks,
.model-name.brand-heading > .brand-marks {
  align-self: center;
}

.evidence-scope b::before {
  content: "";
  width: 18px;
  height: 18px;
  border: 0;
  border-radius: 0;
  background: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/circle-check-big.svg") center / contain no-repeat;
  filter: var(--external-svg-filter);
}

.evidence-scope b[data-evidence-status="limited"]::before {
  content: "";
  background-image: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/circle-gauge.svg");
}

.evidence-scope b[data-evidence-status="not-established"]::before {
  content: "";
  background-image: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/circle-alert.svg");
}

.training-loop article {
  min-height: 178px;
}

.training-loop article .flow-icon {
  margin-bottom: 0;
}

.frontier-lanes .card-icon {
  margin-bottom: 11px;
}

.frontier-lanes strong {
  margin-top: 16px;
}

.robotics-control-line .card-icon {
  margin-bottom: 11px;
}

.robotics-control-line strong {
  margin-top: 14px;
}

.robotics-scoreboard .card-icon,
.unitree-build-map .card-icon,
.benchmark-notes .card-icon {
  margin-bottom: 12px;
}

/* Icon-led cards use a tighter rhythm than the original text-only layouts. */
.card-icon {
  margin-bottom: 12px;
}

.evidence-scope .card-icon,
.training-ladder .card-icon,
.data-stack .card-icon,
.failure-files .card-icon,
.team-playbooks .card-icon,
.frontier-lanes .card-icon,
.robotics-control-line .card-icon,
.unitree-build-map .card-icon,
.robotics-scoreboard .card-icon {
  margin-bottom: 9px;
}

.training-ladder h3,
.data-stack h3,
.failure-files h3,
.team-playbooks h3,
.unitree-build-map h3,
.robotics-scoreboard h3 {
  margin-top: 14px;
}

.brand-marks,
.publisher-marks {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 6px;
  color: var(--muted);
}

.brand-mark {
  display: inline-block;
  flex: 0 0 auto;
  width: 21px;
  height: 21px;
  background: var(--brand-logo) center / contain no-repeat;
  filter: grayscale(1) invert(.76);
  opacity: .86;
}

@media (prefers-color-scheme: light) {
  .brand-mark {
    filter: grayscale(1);
    opacity: .82;
  }

  .brand-mark[data-brand="nist"] {
    filter: none;
    opacity: .9;
  }
}

/* These official favicons use opaque colour fields. Grayscale them without
   the dark-scheme inversion so their backgrounds stay subdued. */
.brand-mark[data-brand="sillytavern"],
.brand-mark[data-brand="modelsdev"],
.brand-mark[data-brand="comfyui"],
.brand-mark[data-brand="gitbutler"],
.brand-mark[data-brand="netron"],
.brand-mark[data-brand="axolotl"],
.brand-mark[data-brand="superlinked"] {
  filter: grayscale(1);
  opacity: .86;
}

.benchmark-card .brand-mark,
.cloud-model-card .brand-mark,
.model-name .brand-mark {
  width: 24px;
  height: 24px;
}

.training-risk-matrix > article > span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.training-risk-matrix .brand-mark {
  width: 16px;
  height: 16px;
}

.brand-mark[data-brand="agentskills"] { --brand-logo: url("../images/logos/tools/agentskills.svg"); }
.brand-mark[data-brand="airbus"] { --brand-logo: url("../images/logos/tools/airbus.svg"); }
.brand-mark[data-brand="airbyte"] { --brand-logo: url("../images/logos/tools/airbyte.svg"); }
.brand-mark[data-brand="aider"] { --brand-logo: url("../images/logos/tools/aider.svg"); }
.brand-mark[data-brand="alibabacloud"] { --brand-logo: url("../images/logos/tools/alibabacloud.svg"); }
.brand-mark[data-brand="amd"] { --brand-logo: url("../images/logos/tools/amd.svg"); }
.brand-mark[data-brand="anthropic"] { --brand-logo: url("../images/logos/tools/anthropic.svg"); }
.brand-mark[data-brand="apacheairflow"] { --brand-logo: url("../images/logos/tools/apacheairflow.svg"); }
.brand-mark[data-brand="apachecassandra"] { --brand-logo: url("../images/logos/tools/apachecassandra.svg"); }
.brand-mark[data-brand="apachekafka"] { --brand-logo: url("../images/logos/tools/apachekafka.svg"); }
.brand-mark[data-brand="apachenifi"] { --brand-logo: url("../images/logos/tools/apachenifi.svg"); }
.brand-mark[data-brand="apachesolr"] { --brand-logo: url("../images/logos/tools/apachesolr.svg"); }
.brand-mark[data-brand="apachespark"] { --brand-logo: url("../images/logos/tools/apachespark.svg"); }
.brand-mark[data-brand="apachesuperset"] { --brand-logo: url("../images/logos/tools/apachesuperset.svg"); }
.brand-mark[data-brand="aws"] { --brand-logo: url("../images/logos/tools/aws.svg"); }
.brand-mark[data-brand="buzz"] { --brand-logo: url("../images/logos/tools/buzz.svg"); }
.brand-mark[data-brand="asterisk"] { --brand-logo: url("../images/logos/tools/asterisk.svg"); }
.brand-mark[data-brand="apacheiceberg"] { --brand-logo: url("../images/logos/tools/apacheiceberg.svg"); }
.brand-mark[data-brand="anythingllm"] { --brand-logo: url("../images/logos/tools/anythingllm.svg"); }
.brand-mark[data-brand="cesium"] { --brand-logo: url("../images/logos/tools/cesium.svg"); }
.brand-mark[data-brand="chroma"] { --brand-logo: url("../images/logos/tools/chroma.svg"); }
.brand-mark[data-brand="claude"] { --brand-logo: url("../images/logos/tools/claude.svg"); }
.brand-mark[data-brand="cline"] { --brand-logo: url("../images/logos/tools/cline.svg"); }
.brand-mark[data-brand="cloudflare"] { --brand-logo: url("../images/logos/tools/cloudflare.svg"); }
.brand-mark[data-brand="primeagent"] { --brand-logo: url("../images/logos/tools/primeagent.svg"); }
.brand-mark[data-brand="continue"] { --brand-logo: url("../images/logos/tools/continue.png"); }
.brand-mark[data-brand="crewai"] { --brand-logo: url("../images/logos/tools/crewai.svg"); }
.brand-mark[data-brand="databricks"] { --brand-logo: url("../images/logos/tools/databricks.svg"); }
.brand-mark[data-brand="deepseek"] { --brand-logo: url("../images/logos/tools/deepseek.svg"); }
.brand-mark[data-brand="dell"] { --brand-logo: url("../images/logos/tools/dell.svg"); }
.brand-mark[data-brand="dbt"] { --brand-logo: url("../images/logos/tools/dbt.svg"); }
.brand-mark[data-brand="dify"] { --brand-logo: url("../images/logos/tools/dify.svg"); }
.brand-mark[data-brand="docling"] { --brand-logo: url("../images/logos/tools/docling.svg"); }
.brand-mark[data-brand="dlthub"] { --brand-logo: url("../images/logos/tools/dlthub.svg"); }
.brand-mark[data-brand="docker"] { --brand-logo: url("../images/logos/tools/docker.svg"); }
.brand-mark[data-brand="dspy"] { --brand-logo: url("../images/logos/tools/dspy.png"); }
.brand-mark[data-brand="duckdb"] { --brand-logo: url("../images/logos/tools/duckdb.svg"); }
.brand-mark[data-brand="elasticsearch"] { --brand-logo: url("../images/logos/tools/elasticsearch.svg"); }
.brand-mark[data-brand="europeanunion"] {
  width: 22px;
  height: 16px;
  border: 0;
  border-radius: 1px;
  background-color: #039;
  background-size: 100% 100%;
  box-shadow: 0 0 0 1px rgba(var(--surface-rgb), .18);
  filter: none;
  opacity: 1;
  --brand-logo: url("../images/flags/eu.svg");
}
.brand-mark[data-brand="fastmcp"] { --brand-logo: url("../images/logos/tools/fastmcp.svg"); }
.brand-mark[data-brand="github"] { --brand-logo: url("../images/logos/tools/github.svg"); }
.brand-mark[data-brand="gitlab"] { --brand-logo: url("../images/logos/tools/gitlab.svg"); }
.brand-mark[data-brand="google"] { --brand-logo: url("../images/logos/tools/google.svg"); }
.brand-mark[data-brand="grafana"] { --brand-logo: url("../images/logos/tools/grafana.svg"); }
.brand-mark[data-brand="haystack"] { --brand-logo: url("../images/logos/tools/haystack.svg"); }
.brand-mark[data-brand="hp"] { --brand-logo: url("../images/logos/tools/hp.svg"); }
.brand-mark[data-brand="huggingface"] { --brand-logo: url("../images/logos/tools/huggingface.svg"); }
.brand-mark[data-brand="intel"] { --brand-logo: url("../images/logos/tools/intel.svg"); }
.brand-mark[data-brand="ibm"] { --brand-logo: url("../images/logos/tools/ibm.svg"); }
.brand-mark[data-brand="jetbrains"] { --brand-logo: url("../images/logos/tools/jetbrains.svg"); }
.brand-mark[data-brand="keycloak"] { --brand-logo: url("../images/logos/tools/keycloak.svg"); }
.brand-mark[data-brand="kubernetes"] { --brand-logo: url("../images/logos/tools/kubernetes.svg"); }
.brand-mark[data-brand="langchain"] { --brand-logo: url("../images/logos/tools/langchain.svg"); }
.brand-mark[data-brand="langfuse"] { --brand-logo: url("../images/logos/tools/langfuse.svg"); }
.brand-mark[data-brand="langgraph"] { --brand-logo: url("../images/logos/tools/langgraph.svg"); }
.brand-mark[data-brand="lenovo"] { --brand-logo: url("../images/logos/tools/lenovo.svg"); }
.brand-mark[data-brand="librechat"] { --brand-logo: url("../images/logos/tools/librechat.svg"); }
.brand-mark[data-brand="livekit"] { --brand-logo: url("../images/logos/tools/livekit.svg"); }
.brand-mark[data-brand="litellm"] { --brand-logo: url("../images/logos/tools/litellm.png"); }
.brand-mark[data-brand="lmstudio"] { --brand-logo: url("../images/logos/tools/lmstudio.svg"); }
.brand-mark[data-brand="mlx"] { --brand-logo: url("../images/logos/tools/mlx.svg"); }
.brand-mark[data-brand="llamacpp"] { --brand-logo: url("../images/logos/tools/llamacpp.svg"); }
.brand-mark[data-brand="make"] { --brand-logo: url("../images/logos/tools/make.svg"); }
.brand-mark[data-brand="maplibre"] { --brand-logo: url("../images/logos/tools/maplibre.svg"); }
.brand-mark[data-brand="meta"] { --brand-logo: url("../images/logos/tools/meta.svg"); }
.brand-mark[data-brand="microsoft"] { --brand-logo: url("../images/logos/tools/microsoft.svg"); }
.brand-mark[data-brand="minimax"] { --brand-logo: url("../images/logos/tools/minimax.svg"); }
.brand-mark[data-brand="milvus"] { --brand-logo: url("../images/logos/tools/milvus.svg"); }
.brand-mark[data-brand="minio"] { --brand-logo: url("../images/logos/tools/minio.svg"); }
.brand-mark[data-brand="mistralai"] { --brand-logo: url("../images/logos/tools/mistralai.svg"); }
.brand-mark[data-brand="mem0"] { --brand-logo: url("../images/logos/tools/mem0.svg"); }
.brand-mark[data-brand="mlcommons"] { --brand-logo: url("../images/logos/tools/mlcommons.png"); }
.brand-mark[data-brand="mlflow"] { --brand-logo: url("../images/logos/tools/mlflow.svg"); }
.brand-mark[data-brand="moonshotai"] { --brand-logo: url("../images/logos/tools/moonshotai.svg"); }
.brand-mark[data-brand="n8n"] { --brand-logo: url("../images/logos/tools/n8n.svg"); }
.brand-mark[data-brand="natsdotio"] { --brand-logo: url("../images/logos/tools/natsdotio.svg"); }
.brand-mark[data-brand="neo4j"] { --brand-logo: url("../images/logos/tools/neo4j.svg"); }
.brand-mark[data-brand="nodered"] { --brand-logo: url("../images/logos/tools/nodered.svg"); }
.brand-mark[data-brand="nvidia"] { --brand-logo: url("../images/logos/tools/nvidia.svg"); }
.brand-mark[data-brand="nist"] {
  width: 34px;
  --brand-logo: url("../images/logos/nist.svg");
}
.brand-mark[data-brand="obsidian"] { --brand-logo: url("../images/logos/tools/obsidian.svg"); }
.brand-mark[data-brand="ollama"] { --brand-logo: url("../images/logos/tools/ollama.svg"); }
.brand-mark[data-brand="openai"] { --brand-logo: url("../images/logos/tools/openai.svg"); }
.brand-mark[data-brand="openbao"] { --brand-logo: url("../images/logos/tools/openbao.svg"); }
.brand-mark[data-brand="opencode"] { --brand-logo: url("../images/logos/tools/opencode.svg"); }
.brand-mark[data-brand="openhands"] { --brand-logo: url("../images/logos/tools/openhands.png"); }
.brand-mark[data-brand="openstreetmap"] { --brand-logo: url("../images/logos/tools/openstreetmap.svg"); }
.brand-mark[data-brand="openwebui"] { --brand-logo: url("../images/logos/tools/openwebui.svg"); }
.brand-mark[data-brand="opentelemetry"] { --brand-logo: url("../images/logos/tools/opentelemetry.svg"); }
.brand-mark[data-brand="openrouter"] { --brand-logo: url("../images/logos/tools/openrouter.svg"); }
.brand-mark[data-brand="opensrc"] { --brand-logo: url("../images/logos/tools/opensrc.svg"); }
.brand-mark[data-brand="openspec"] { --brand-logo: url("../images/logos/tools/openspec.svg"); }
.brand-mark[data-brand="ovh"] { --brand-logo: url("../images/logos/tools/ovh.svg"); }
.brand-mark[data-brand="palantir"] { --brand-logo: url("../images/logos/tools/palantir.svg"); }
.brand-mark[data-brand="pipecat"] { --brand-logo: url("../images/logos/tools/pipecat.svg"); }
.brand-mark[data-brand="promptfoo"] { --brand-logo: url("../images/logos/tools/promptfoo.svg"); }
.brand-mark[data-brand="prefect"] { --brand-logo: url("../images/logos/tools/prefect.svg"); }
.brand-mark[data-brand="prometheus"] { --brand-logo: url("../images/logos/tools/prometheus.svg"); }
.brand-mark[data-brand="postgresql"] { --brand-logo: url("../images/logos/tools/postgresql.svg"); }
.brand-mark[data-brand="pydantic"] { --brand-logo: url("../images/logos/tools/pydantic.svg"); }
.brand-mark[data-brand="qdrant"] { --brand-logo: url("../images/logos/tools/qdrant.svg"); }
.brand-mark[data-brand="qgis"] { --brand-logo: url("../images/logos/tools/qgis.svg"); }
.brand-mark[data-brand="qwen"] { --brand-logo: url("../images/logos/tools/qwen.webp"); }
.brand-mark[data-brand="rabbitmq"] { --brand-logo: url("../images/logos/tools/rabbitmq.svg"); }
.brand-mark[data-brand="redis"] { --brand-logo: url("../images/logos/tools/redis.svg"); }
.brand-mark[data-brand="rivet"] { --brand-logo: url("../images/logos/tools/rivet.svg"); }
.brand-mark[data-brand="ros"] { --brand-logo: url("../images/logos/tools/ros.svg"); }
.brand-mark[data-brand="roocode"] { --brand-logo: url("../images/logos/tools/roocode.svg"); }
.brand-mark[data-brand="scaleway"] { --brand-logo: url("../images/logos/tools/scaleway.svg"); }
.brand-mark[data-brand="scrapy"] { --brand-logo: url("../images/logos/tools/scrapy.svg"); }
.brand-mark[data-brand="snowflake"] { --brand-logo: url("../images/logos/tools/snowflake.svg"); }
.brand-mark[data-brand="specflow"] { --brand-logo: url("../images/logos/tools/specflow.svg"); }
.brand-mark[data-brand="sglang"] { --brand-logo: url("../images/logos/tools/sglang.svg"); }
.brand-mark[data-brand="temporal"] { --brand-logo: url("../images/logos/tools/temporal.svg"); }
.brand-mark[data-brand="tesla"] { --brand-logo: url("../images/logos/tools/tesla.svg"); }
.brand-mark[data-brand="trino"] { --brand-logo: url("../images/logos/tools/trino.svg"); }
.brand-mark[data-brand="unsloth"] { --brand-logo: url("../images/logos/tools/unsloth.png"); }
.brand-mark[data-brand="vmware"] { --brand-logo: url("../images/logos/tools/vmware.svg"); }
.brand-mark[data-brand="visualstudiocode"] { --brand-logo: url("../images/logos/tools/visualstudiocode.svg"); }
.brand-mark[data-brand="weightsandbiases"] { --brand-logo: url("../images/logos/tools/weightsandbiases.svg"); }
.brand-mark[data-brand="arizephoenix"] { --brand-logo: url("../images/logos/tools/arizephoenix.png"); }
.brand-mark[data-brand="helicone"] { --brand-logo: url("../images/logos/tools/helicone.svg"); }
.brand-mark[data-brand="zapier"] { --brand-logo: url("../images/logos/tools/zapier.svg"); }
.brand-mark[data-brand="zedindustries"] { --brand-logo: url("../images/logos/tools/zedindustries.svg"); }
.brand-mark[data-brand="vllm"] { --brand-logo: url("../images/logos/tools/vllm.svg"); }
.brand-mark[data-brand="hermesagent"] { --brand-logo: url("../images/logos/tools/hermesagent.svg"); }
.brand-mark[data-brand="openclaw"] { --brand-logo: url("../images/logos/tools/openclaw.svg"); }
.brand-mark[data-brand="zai"] { --brand-logo: url("../images/logos/tools/zai.svg"); }
.brand-mark[data-brand="xai"] {
  border-radius: 4px;
  background: url("https://x.ai/icon.png") center / contain no-repeat;
  -webkit-mask: none;
  mask: none;
}

/* Tool marks that are not part of the Simple Icons catalogue use the
   project's own published logo or favicon instead of a placeholder glyph. */
.brand-mark[data-brand="sillytavern"] { --brand-logo: url("../images/logos/tools/sillytavern.ico"); }
.brand-mark[data-brand="llmcli"],
.brand-mark[data-brand="herdr"],
.brand-mark[data-brand="goose"] { --brand-logo: url("../images/logos/tools/semantic-terminal.svg"); }
.brand-mark[data-brand="orca"] {
  width: 27px;
  --brand-logo: url("../images/logos/tools/orca.svg");
}
.brand-mark[data-brand="modelsdev"] { --brand-logo: url("../images/logos/tools/modelsdev.svg"); }
.brand-mark[data-brand="comfyui"] { --brand-logo: url("../images/logos/tools/comfyui.svg"); }
.brand-mark[data-brand="iopaint"],
.brand-mark[data-brand="screenpipe"] { --brand-logo: url("../images/logos/tools/semantic-media.svg"); }
.brand-mark[data-brand="codexrouter"] { --brand-logo: url("../images/logos/tools/semantic-router.svg"); }
.brand-mark[data-brand="gitbutler"] { --brand-logo: url("../images/logos/tools/gitbutler.ico"); }
.brand-mark[data-brand="netron"] { --brand-logo: url("../images/logos/tools/netron.ico"); }
.brand-mark[data-brand="axolotl"] { --brand-logo: url("../images/logos/tools/axolotl.jpg"); }
.brand-mark[data-brand="garak"],
.brand-mark[data-brand="pyrit"],
.brand-mark[data-brand="heretic"],
.brand-mark[data-brand="gandalf"],
.brand-mark[data-brand="jailbreakbench"],
.brand-mark[data-brand="harmbench"] { --brand-logo: url("../images/logos/tools/semantic-security.svg"); }
.brand-mark[data-brand="tensortrust"],
.brand-mark[data-brand="eqbench"],
.brand-mark[data-brand="matharena"],
.brand-mark[data-brand="webdevarena"] { --brand-logo: url("../images/logos/tools/semantic-benchmark.svg"); }
.brand-mark[data-brand="ktransformers"] { --brand-logo: url("../images/logos/tools/ktransformers.png"); }
.brand-mark[data-brand="tokenspeed"] { --brand-logo: url("../images/logos/tools/tokenspeed.png"); }
.brand-mark[data-brand="superlinked"] { --brand-logo: url("../images/logos/tools/superlinked.svg"); }
.brand-mark[data-brand="cohere"] { --brand-logo: url("../images/logos/tools/cohere.png"); }
.brand-mark[data-brand="nomic"] { --brand-logo: url("../images/logos/tools/nomic.svg"); }
.brand-mark[data-brand="sentencetransformers"] { --brand-logo: url("../images/logos/tools/sentencetransformers.ico"); }
.brand-mark[data-brand="voicebox"] { --brand-logo: url("../images/logos/tools/voicebox.webp"); }
.brand-mark[data-brand="openflow"] { --brand-logo: url("../images/logos/tools/openflow.svg"); }
.brand-mark[data-brand="superwhisper"] { --brand-logo: url("../images/logos/tools/superwhisper.ico"); }
.brand-mark[data-brand="speaches"] { --brand-logo: url("../images/logos/tools/speaches.png"); }
.brand-mark[data-brand="kokorofastapi"] { --brand-logo: url("../images/logos/tools/kokorofastapi.svg"); }
.brand-mark[data-brand="openedaispeech"] { --brand-logo: url("../images/logos/tools/openedaispeech.png"); }
.brand-mark[data-brand="officecli"] { --brand-logo: url("../images/logos/tools/officecli.png"); }
.brand-mark[data-brand="openmanus"] { --brand-logo: url("../images/logos/tools/openmanus.jpg"); }
.brand-mark[data-brand="tinytroupe"] { --brand-logo: url("../images/logos/tools/tinytroupe.png"); }
.brand-mark[data-brand="llamaindex"] { --brand-logo: url("../images/logos/tools/llamaindex.ico"); }
.brand-mark[data-brand="agno"] { --brand-logo: url("../images/logos/tools/agno.ico"); }
.brand-mark[data-brand="camel"] { --brand-logo: url("../images/logos/tools/camel.ico"); }
.brand-mark[data-brand="superpowers"] { --brand-logo: url("../images/logos/tools/superpowers.png"); }
.brand-mark[data-brand="agencyagents"] { --brand-logo: url("../images/logos/tools/agencyagents.jpg"); }
.brand-mark[data-brand="gstack"] { --brand-logo: url("../images/logos/tools/gstack.png"); }
.brand-mark[data-brand="openwiki"] { --brand-logo: url("../images/logos/tools/langchain.svg"); }
.brand-mark[data-brand="taxhacker"] { --brand-logo: url("../images/logos/tools/taxhacker.svg"); }
.brand-mark[data-brand="firecrawl"] { --brand-logo: url("../images/logos/tools/firecrawl.ico"); }
.brand-mark[data-brand="chonkie"] { --brand-logo: url("../images/logos/tools/chonkie.png"); }
.brand-mark[data-brand="faultline"] { --brand-logo: url("../images/logos/tools/faultline.svg"); }
.brand-mark[data-brand="ragflow"] { --brand-logo: url("../images/logos/tools/ragflow.svg"); }
.brand-mark[data-brand="embedchain"] { --brand-logo: url("../images/logos/tools/embedchain.ico"); }
.brand-mark[data-brand="unstructured"] { --brand-logo: url("../images/logos/tools/unstructured.svg"); }
.brand-mark[data-brand="falkordb"] { --brand-logo: url("../images/logos/tools/falkordb.svg"); }
.brand-mark[data-brand="graphiti"] { --brand-logo: url("../images/logos/tools/graphiti.png"); }
.brand-mark[data-brand="cognee"] { --brand-logo: url("../images/logos/tools/cognee.svg"); }
.brand-mark[data-brand="fivetran"] { --brand-logo: url("../images/logos/tools/fivetran.png"); }
.brand-mark[data-brand="deltalake"] { --brand-logo: url("../images/logos/tools/deltalake.ico"); }
.brand-mark[data-brand="dashjoin"] { --brand-logo: url("../images/logos/tools/dashjoin.ico"); }
.brand-mark[data-brand="janusgraph"] { --brand-logo: url("../images/logos/tools/janusgraph.png"); }
.brand-mark[data-brand="tinkerpop"] { --brand-logo: url("../images/logos/tools/tinkerpop.png"); }
.brand-mark[data-brand="geotrellis"] { --brand-logo: url("../images/logos/tools/geotrellis.png"); }
.brand-mark[data-brand="locstat"] { --brand-logo: url("../images/logos/tools/locstat.png"); }
.brand-mark[data-brand="ranger"] { --brand-logo: url("../images/logos/tools/ranger.svg"); }
.brand-mark[data-brand="opa"] { --brand-logo: url("../images/logos/tools/opa.ico"); }
.brand-mark[data-brand="openfoundry"] { --brand-logo: url("../images/logos/tools/openfoundry.svg"); }
.brand-mark[data-brand="osiris"] { --brand-logo: url("../images/logos/tools/osiris.svg"); }
.brand-mark[data-brand="opensky"] { --brand-logo: url("../images/logos/tools/opensky.png"); }
.brand-mark[data-brand="adsbexchange"] { --brand-logo: url("../images/logos/tools/adsbexchange.svg"); }
.brand-mark[data-brand="celestrak"] { --brand-logo: url("../images/logos/tools/celestrak.ico"); }
.brand-mark[data-brand="austincameras"] { --brand-logo: url("../images/logos/tools/austincameras.svg"); }
.brand-mark[data-brand="geoserver"] { --brand-logo: url("../images/logos/tools/geoserver.ico"); }
.brand-mark[data-brand="rtk"] { --brand-logo: url("../images/logos/tools/rtk.svg"); }
.brand-mark[data-brand="ralph"] { --brand-logo: url("../images/logos/tools/ralph.jpg"); }
.brand-mark[data-brand="caveman"] { --brand-logo: url("../images/logos/tools/caveman.svg"); }
.brand-mark[data-brand="codebuddy"] { --brand-logo: url("../images/logos/tools/codebuddy.svg"); }
.brand-mark[data-brand="jcode"] { --brand-logo: url("../images/logos/tools/jcode.ico"); }
.brand-mark[data-brand="opencommit"] { --brand-logo: url("../images/logos/tools/opencommit.svg"); }
.brand-mark[data-brand="parallelcode"] { --brand-logo: url("../images/logos/tools/parallelcode.svg"); }
.brand-mark[data-brand="windowsterminal"] { --brand-logo: url("../images/logos/tools/windowsterminal.ico"); }
.brand-mark[data-brand="nimbalyst"] { --brand-logo: url("../images/logos/tools/nimbalyst.svg"); }
.brand-mark[data-brand="kandev"] { --brand-logo: url("../images/logos/tools/kandev.svg"); }
.brand-mark[data-brand="agentdeck"] { --brand-logo: url("../images/logos/tools/agentdeck.svg"); }
.brand-mark[data-brand="ccmanager"] { --brand-logo: url("../images/logos/tools/ccmanager.jpg"); }
.brand-mark[data-brand="headroom"] { --brand-logo: url("../images/logos/tools/headroom.svg"); }
.brand-mark[data-brand="pi"] { --brand-logo: url("../images/logos/tools/pi.svg"); }
.brand-mark[data-brand="nanocoder"] { --brand-logo: url("../images/logos/tools/nanocoder.svg"); }
.brand-mark[data-brand="librecode"] { --brand-logo: url("../images/logos/tools/librecode.png"); }
.brand-mark[data-brand="context7"] { --brand-logo: url("../images/logos/tools/context7.svg"); }
.brand-mark[data-brand="ifixai"] { --brand-logo: url("../images/logos/tools/ifixai.png"); }
.brand-mark[data-brand="trulens"] { --brand-logo: url("../images/logos/tools/trulens.png"); }
.brand-mark[data-brand="ragas"] { --brand-logo: url("../images/logos/tools/ragas.ico"); }
.brand-mark[data-brand="memanto"] { --brand-logo: url("../images/logos/tools/memanto.svg"); }
.brand-mark[data-brand="triplebits"] { --brand-logo: url("../images/logos/tools/triplebits.svg"); }
.brand-mark[data-brand="promptsecurity"] { --brand-logo: url("../images/logos/tools/promptsecurity.ico"); }
.brand-mark[data-brand="protectai"],
.brand-mark[data-brand="llmguard"] { --brand-logo: url("../images/logos/tools/protectai.png"); }
.brand-mark[data-brand="safeprompt"] { --brand-logo: url("../images/logos/tools/safeprompt.svg"); }
.brand-mark[data-brand="lakera"] { --brand-logo: url("../images/logos/tools/lakera.png"); }
.brand-mark[data-brand="freeswitch"] { --brand-logo: url("../images/logos/tools/freeswitch.png"); }
.brand-mark[data-brand="mcp"] { --brand-logo: url("../images/logos/tools/mcp.svg"); }
.brand-mark[data-brand="weaviate"] { --brand-logo: url("../images/logos/tools/weaviate.ico"); }
.brand-mark[data-brand="letta"] { --brand-logo: url("../images/logos/tools/letta.jpg"); }
.brand-mark[data-brand="pipedream"] { --brand-logo: url("../images/logos/tools/pipedream.ico"); }
.brand-mark[data-brand="kestra"] { --brand-logo: url("../images/logos/tools/kestra.ico"); }
.brand-mark[data-brand="flowise"] { --brand-logo: url("../images/logos/tools/flowise.ico"); }
.brand-mark[data-brand="meltano"] { --brand-logo: url("../images/logos/tools/meltano.ico"); }
.brand-mark[data-brand="deepeval"] { --brand-logo: url("../images/logos/tools/deepeval.png"); }
.brand-mark[data-brand="guardrailsai"] { --brand-logo: url("../images/logos/tools/guardrailsai.png"); }
.brand-mark[data-brand="frigate"] { --brand-logo: url("../images/logos/tools/frigate.svg"); }

@media (max-width: 800px) {
  .scaling-effect {
    grid-template-columns: 62px minmax(0, 1fr);
  }

  .scaling-effect-icon {
    width: 62px;
    height: 62px;
  }

  .scaling-effect .tool-links {
    grid-column: 1 / -1;
    grid-row: 3;
    margin-top: 16px;
  }
}

@media (max-width: 560px) {
  .scaling-effect {
    grid-template-columns: 62px minmax(0, 1fr);
    column-gap: 14px;
  }

  .scaling-effect > .status-chip {
    position: static;
    transform: none;
  }

  .scaling-effect > div:not(.tool-links) {
    padding-top: 0;
  }
}

/* Compact icon-led card headers: icon left, label and title stacked right. */
:is(
  .path,
  .evidence-scope,
  .loop-decision,
  .loop-build-grid,
  .hardware-grid,
  .europe-cards,
  .training-ladder,
  .data-stack,
  .failure-files,
  .team-playbooks,
  .frontier-lanes,
  .robotics-route,
  .robotics-stack,
  .robotics-control-line,
  .unitree-build-map,
  .robotics-scoreboard,
  .benchmark-notes,
  .decision-usecases
) > article:has(> .card-icon:first-child) {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  column-gap: 12px;
  row-gap: 0;
  align-content: start;
}

:is(
  .path,
  .evidence-scope,
  .loop-decision,
  .loop-build-grid,
  .hardware-grid,
  .europe-cards,
  .training-ladder,
  .data-stack,
  .failure-files,
  .team-playbooks,
  .frontier-lanes,
  .robotics-route,
  .robotics-stack,
  .robotics-control-line,
  .unitree-build-map,
  .robotics-scoreboard,
  .benchmark-notes,
  .decision-usecases
) > article:has(> .card-icon:first-child) > .card-icon {
  grid-column: 1;
  grid-row: 1 / 3;
  align-self: start;
  margin: 0;
}

:is(
  .path,
  .evidence-scope,
  .loop-decision,
  .loop-build-grid,
  .hardware-grid,
  .europe-cards,
  .training-ladder,
  .data-stack,
  .failure-files,
  .team-playbooks,
  .frontier-lanes,
  .robotics-route,
  .robotics-stack,
  .robotics-control-line,
  .unitree-build-map,
  .robotics-scoreboard,
  .benchmark-notes,
  .decision-usecases
) > article:has(> .card-icon:first-child) > :is(span, b) {
  position: static;
  grid-column: 2;
  grid-row: 1;
  align-self: end;
  justify-self: start;
  min-width: 0;
  margin: 0;
  overflow: visible;
  text-align: left;
  text-overflow: clip;
  white-space: normal;
}

:is(
  .path,
  .evidence-scope,
  .loop-decision,
  .loop-build-grid,
  .hardware-grid,
  .europe-cards,
  .training-ladder,
  .data-stack,
  .failure-files,
  .team-playbooks,
  .robotics-route,
  .robotics-stack,
  .unitree-build-map,
  .robotics-scoreboard,
  .benchmark-notes,
  .decision-usecases
) > article:has(> .card-icon:first-child) > h3 {
  grid-column: 2;
  grid-row: 2;
  align-self: start;
  min-width: 0;
  margin: 3px 0 0;
}

.frontier-lanes > article:has(> .card-icon:first-child) > strong,
.robotics-control-line > article:has(> .card-icon:first-child) > strong {
  grid-column: 2;
  grid-row: 2;
  align-self: start;
  min-width: 0;
  margin: 3px 0 0;
}

:is(
  .path,
  .evidence-scope,
  .loop-decision,
  .loop-build-grid,
  .hardware-grid,
  .europe-cards,
  .training-ladder,
  .data-stack,
  .failure-files,
  .team-playbooks,
  .frontier-lanes,
  .robotics-route,
  .robotics-stack,
  .robotics-control-line,
  .unitree-build-map,
  .robotics-scoreboard,
  .benchmark-notes,
  .decision-usecases
) > article:has(> .card-icon:first-child) > :is(p, ul, dl, a, small, .tool-links) {
  grid-column: 1 / -1;
}

:is(
  .path,
  .evidence-scope,
  .loop-decision,
  .loop-build-grid,
  .hardware-grid,
  .europe-cards,
  .training-ladder,
  .data-stack,
  .failure-files,
  .team-playbooks,
  .frontier-lanes,
  .robotics-route,
  .robotics-stack,
  .robotics-control-line,
  .unitree-build-map,
  .robotics-scoreboard,
  .benchmark-notes,
  .decision-usecases
) > article:has(> .card-icon:first-child) > p {
  margin-top: 14px;
}

.training-ladder > article:has(> .card-icon:first-child) {
  grid-template-rows: auto auto minmax(0, 1fr) auto auto;
}

.training-ladder > article > strong,
.failure-files > article > :is(strong, a),
.robotics-route > article > strong,
.robotics-stack > article > small,
.robotics-scoreboard > article > strong {
  grid-column: 1 / -1;
}

.failure-files > article:has(> .card-icon:first-child),
.robotics-route > article:has(> .card-icon:first-child),
.robotics-stack > article:has(> .card-icon:first-child),
.unitree-build-map > article:has(> .card-icon:first-child),
.decision-usecases > article:has(> .card-icon:first-child) {
  grid-template-rows: auto auto minmax(0, 1fr) auto;
}

.robotics-route article > .card-icon + span,
.robotics-stack article > .card-icon + span {
  position: static;
  grid-column: 2;
  grid-row: 1;
  text-align: left;
  white-space: normal;
}

.robotics-route article h3,
.robotics-stack article h3 {
  grid-column: 2;
  grid-row: 2;
  margin: 3px 0 0;
}

.architecture-flow > div:has(> .flow-icon:first-child) {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  column-gap: 12px;
  row-gap: 0;
  align-content: start;
}

.architecture-flow > div:has(> .flow-icon:first-child) > .flow-icon {
  grid-column: 1;
  grid-row: 1 / 3;
  align-self: start;
  margin: 0;
}

.architecture-flow > div:has(> .flow-icon:first-child) > b {
  grid-column: 2;
  grid-row: 1;
  align-self: end;
  margin: 0;
}

.architecture-flow > div:has(> .flow-icon:first-child) > strong {
  grid-column: 2;
  grid-row: 2;
  align-self: start;
  margin: 3px 0 0;
}

.architecture-flow > div:has(> .flow-icon:first-child) > span {
  grid-column: 1 / -1;
  grid-row: 3;
  margin-top: 12px;
}

.training-loop article {
  grid-template-columns: 34px minmax(0, 1fr);
  grid-template-rows: auto auto minmax(0, 1fr);
  column-gap: 12px;
  row-gap: 0;
  align-content: stretch;
  min-height: 148px;
}

.training-loop article > .flow-icon {
  grid-column: 1;
  grid-row: 1 / 3;
  align-self: start;
  margin: 0;
}

.training-loop article > span {
  grid-column: 2;
  grid-row: 1;
  align-self: end;
}

.training-loop article > strong {
  grid-column: 2;
  grid-row: 2;
  align-self: start;
  margin-top: 3px;
}

.training-loop article > small {
  grid-column: 1 / -1;
  grid-row: 3;
  align-self: end;
  margin-top: 12px;
}

.adoption-rail a {
  grid-template-columns: 34px minmax(0, 1fr);
  grid-template-rows: auto auto minmax(0, 1fr);
  column-gap: 12px;
  min-height: 160px;
}

.adoption-rail .stage-icon {
  grid-column: 1;
  grid-row: 1 / 3;
  align-self: start;
  margin: 0;
}

.adoption-rail .stage-icon + span {
  grid-column: 2;
  grid-row: 1;
  align-self: end;
}

.adoption-rail .stage-icon ~ strong {
  grid-column: 2;
  grid-row: 2;
  align-self: start;
  margin-top: 3px;
}

.adoption-rail .stage-icon ~ small {
  grid-column: 1 / -1;
  grid-row: 3;
  margin-top: 12px;
}

/* Geometric centering for every semantic glyph inside a circular container. */
:is(
  .card-icon,
  .operating-icon,
  .cloud-quickstart-grid i,
  .flow-icon,
  .stage-icon,
  .scaling-effect-icon
) {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  padding: 0;
  vertical-align: middle;
}

:is(
  .card-icon,
  .operating-icon,
  .cloud-quickstart-grid i,
  .flow-icon,
  .stage-icon,
  .scaling-effect-icon
)[data-icon]::before {
  position: absolute;
  top: 50%;
  left: 50%;
  flex: none;
  margin: 0;
  transform: translate(-50%, -50%);
}

.compass-stages li > span[data-icon] {
  position: relative;
  padding: 0;
  line-height: 0;
}

.compass-stages li > span[data-icon]::after {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: 0;
  transform: translate(-50%, -50%);
}

.brand-marks,
.publisher-marks {
  align-self: flex-start;
  line-height: 0;
  vertical-align: top;
}

.platform-marks {
  align-self: center;
  line-height: 0;
  vertical-align: -.12em;
}

.brand-mark,
.platform-mark {
  display: block;
  align-self: center;
  margin-block: 0;
}

.topology-flow :is(.brand-marks, .platform-marks) {
  display: inline-flex;
  flex-flow: row nowrap;
  width: max-content;
  max-width: 100%;
}

.tools-page .tool-cards .card > h3.brand-heading {
  align-items: center;
}

.tools-page .tool-cards .card > h3.brand-heading > .brand-marks {
  align-self: center;
}

/* A strong immediately after the card label is a title, not footer copy. */
:is(
  .path,
  .evidence-scope,
  .loop-decision,
  .loop-build-grid,
  .hardware-grid,
  .europe-cards,
  .training-ladder,
  .data-stack,
  .failure-files,
  .team-playbooks,
  .frontier-lanes,
  .robotics-route,
  .robotics-stack,
  .robotics-control-line,
  .unitree-build-map,
  .robotics-scoreboard,
  .benchmark-notes,
  .decision-usecases
) > article:has(> .card-icon:first-child) > .card-icon + :is(span, b) + strong {
  grid-column: 2;
  grid-row: 2;
  align-self: start;
  min-width: 0;
  margin: 3px 0 0;
  padding: 0;
}

.cloud-quickstart-grid strong {
  margin: 8px 0 0;
}

/* RAG architecture comparison and deep implementation sections. */
.retrieval-compare {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-top: 26px;
}

.retrieval-diagram {
  min-width: 0;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(var(--surface-rgb), .035);
}

.retrieval-diagram-vector {
  --diagram-accent: var(--blue);
  --diagram-accent-rgb: var(--blue-rgb);
}

.retrieval-diagram-graph {
  --diagram-accent: var(--purple);
  --diagram-accent-rgb: var(--purple-rgb);
}

.retrieval-diagram figcaption {
  display: grid;
  gap: 5px;
  min-height: 128px;
  padding: 22px;
  border-bottom: 1px solid var(--line);
  background:
    radial-gradient(circle at 12% 0%, rgba(var(--diagram-accent-rgb), .18), transparent 58%),
    rgba(var(--surface-rgb), .035);
}

.retrieval-diagram figcaption span {
  color: var(--diagram-accent);
  font: 800 10px/1.2 var(--mono);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.retrieval-diagram figcaption strong {
  font-size: clamp(23px, 2.4vw, 31px);
  line-height: 1.02;
  letter-spacing: -.04em;
}

.retrieval-diagram figcaption small {
  color: var(--muted);
  font-size: 12px;
}

.retrieval-diagram-lanes {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.retrieval-lane {
  min-width: 0;
  padding: 18px;
}

.retrieval-lane + .retrieval-lane {
  border-left: 1px solid var(--line);
}

.retrieval-lane > b {
  display: block;
  margin-bottom: 13px;
  color: var(--diagram-accent);
  font: 800 9px/1.2 var(--mono);
  letter-spacing: .05em;
  text-transform: uppercase;
}

.retrieval-sequence {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  justify-items: stretch;
}

.retrieval-sequence > i {
  display: grid;
  place-items: center;
  min-height: 24px;
  color: var(--diagram-accent);
  font: 800 15px/1 var(--mono);
  font-style: normal;
}

.retrieval-node {
  position: relative;
  display: grid;
  gap: 4px;
  min-height: 91px;
  padding: 13px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: rgba(var(--surface-rgb), .045);
}

.retrieval-node::before {
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  content: "";
  background: var(--diagram-accent);
  opacity: .72;
}

.retrieval-node small {
  color: var(--dim);
  font: 750 8px/1.2 var(--mono);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.retrieval-node strong {
  font-size: 13px;
  line-height: 1.18;
}

.retrieval-node > span:not(.mini-graph) {
  color: var(--muted);
  font-size: 10px;
  line-height: 1.35;
}

.memory-node,
.graph-node {
  border-color: rgba(var(--diagram-accent-rgb), .36);
  background: rgba(var(--diagram-accent-rgb), .075);
}

.context-node {
  border-style: dashed;
}

.answer-node {
  border-color: rgba(var(--good-rgb), .34);
  background: rgba(var(--good-rgb), .055);
}

.mini-graph {
  display: block;
  width: 96px;
  height: 38px;
  margin-top: 5px;
  color: var(--diagram-accent);
  overflow: visible;
}

.mini-graph path {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  opacity: .78;
}

.mini-graph circle {
  fill: var(--control-bg);
  stroke: currentColor;
  stroke-width: 2.5;
}

.retrieval-diagram-result {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  min-height: 60px;
  padding: 12px 18px;
  border-top: 1px solid var(--line);
  background: rgba(var(--diagram-accent-rgb), .055);
}

.retrieval-diagram-result b {
  color: var(--diagram-accent);
  font: 800 9px/1.4 var(--mono);
  text-transform: uppercase;
}

.retrieval-diagram-result span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.diagram-caption {
  margin: 16px 0 0;
  padding: 16px 18px;
  border-left: 3px solid var(--good);
  color: var(--muted);
  background: rgba(var(--good-rgb), .045);
  font-size: 13px;
}

.diagram-caption strong {
  color: var(--text);
}

/* Fine-pointer liquid trail; WebGL progressively enhances capable desktops only. */
.pointer-fluid-trail {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
  contain: strict;
}

/* Five-minute idle state: the wandering token. */
body.idle-screensaver-visible {
  overflow: hidden;
}

.idle-screensaver {
  --idle-token-hue: 152;
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  overflow: hidden;
  visibility: hidden;
  opacity: 0;
  cursor: none;
  color: #f4f8ff;
  background:
    radial-gradient(circle at 50% 45%, hsl(var(--idle-token-hue) 80% 54% / .1), transparent 28rem),
    radial-gradient(circle at 15% 10%, rgba(68, 132, 255, .13), transparent 34rem),
    #05070a;
  isolation: isolate;
  transition: opacity .18s ease, visibility 0s linear .18s;
}

.idle-screensaver.is-active {
  visibility: visible;
  opacity: 1;
  transition-delay: 0s;
}

.idle-screensaver-matrix {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  opacity: 0;
  background: #000;
  pointer-events: none;
}

.idle-screensaver-grid {
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: .23;
  background-image:
    linear-gradient(rgba(126, 155, 185, .12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(126, 155, 185, .12) 1px, transparent 1px);
  background-size: 46px 46px;
  -webkit-mask-image: radial-gradient(circle at center, #000, transparent 82%);
  mask-image: radial-gradient(circle at center, #000, transparent 82%);
}

.idle-screensaver.is-matrix {
  --idle-token-hue: 339;
  background: #000;
}

.idle-screensaver.is-matrix .idle-screensaver-matrix {
  opacity: 1;
}

.idle-screensaver.is-matrix .idle-screensaver-grid {
  opacity: 0;
}

.idle-screensaver.is-matrix .idle-screensaver-token {
  --idle-token-hue: 339 !important;
  background:
    linear-gradient(135deg, rgba(244, 66, 125, .2), transparent 55%),
    rgba(10, 2, 6, .94);
}

.idle-screensaver.is-matrix .idle-screensaver-head,
.idle-screensaver.is-matrix .idle-screensaver-foot p {
  text-shadow: 0 1px 12px #000, 0 1px 24px #000;
}

.idle-screensaver.is-matrix .idle-screensaver-head i {
  background: #f4427d;
  box-shadow: 0 0 18px #f4427d;
}

.idle-screensaver-head,
.idle-screensaver-foot {
  position: absolute;
  right: clamp(20px, 3vw, 48px);
  left: clamp(20px, 3vw, 48px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  font-family: var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}

.idle-screensaver-head {
  top: clamp(20px, 3vw, 42px);
  font-size: clamp(10px, 1.15vw, 14px);
  font-weight: 850;
}

.idle-screensaver-head span {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.idle-screensaver-head i {
  width: 8px;
  height: 8px;
  flex: 0 0 8px;
  border-radius: 50%;
  background: #58e39a;
  box-shadow: 0 0 18px #58e39a;
  animation: idle-screensaver-pulse 1.8s ease-in-out infinite;
}

.idle-screensaver-head small,
.idle-screensaver-foot small {
  color: #7f90a3;
  font-size: 9px;
  font-weight: 800;
}

.idle-screensaver-token {
  position: absolute;
  top: 0;
  left: 0;
  display: grid;
  width: clamp(168px, 18vw, 250px);
  min-height: clamp(104px, 11vw, 152px);
  padding: clamp(17px, 2vw, 26px);
  overflow: hidden;
  border: 1px solid hsl(var(--idle-token-hue) 90% 65% / .72);
  border-radius: clamp(17px, 2vw, 25px);
  color: hsl(var(--idle-token-hue) 88% 68%);
  background:
    linear-gradient(135deg, hsl(var(--idle-token-hue) 75% 52% / .19), transparent 55%),
    rgba(8, 13, 20, .94);
  box-shadow:
    0 0 0 1px hsl(var(--idle-token-hue) 85% 56% / .12) inset,
    0 0 46px hsl(var(--idle-token-hue) 90% 52% / .22),
    0 22px 60px rgba(0, 0, 0, .5);
  font-family: var(--mono);
  user-select: none;
  pointer-events: none;
  will-change: transform;
}

.idle-screensaver-token::after {
  position: absolute;
  inset: 0;
  content: "";
  opacity: .24;
  background: repeating-linear-gradient(180deg, transparent 0 5px, rgba(255, 255, 255, .08) 6px);
}

.idle-screensaver-token small,
.idle-screensaver-token span {
  position: relative;
  z-index: 1;
  font-size: clamp(7px, .7vw, 9px);
  font-weight: 800;
  letter-spacing: .12em;
}

.idle-screensaver-token small {
  align-self: start;
  opacity: .72;
}

.idle-screensaver-token strong {
  position: relative;
  z-index: 1;
  align-self: center;
  color: #fff;
  font-size: clamp(21px, 2.6vw, 38px);
  line-height: .95;
  letter-spacing: -.07em;
  text-shadow: 0 0 26px hsl(var(--idle-token-hue) 90% 60% / .42);
}

.idle-screensaver-token.has-long-label strong {
  font-size: clamp(17px, 1.75vw, 26px);
  letter-spacing: -.055em;
}

.idle-screensaver-token span {
  align-self: end;
  justify-self: end;
  opacity: .52;
}

.idle-screensaver-foot {
  bottom: clamp(20px, 3vw, 42px);
  align-items: end;
}

.idle-screensaver-foot p {
  max-width: min(76vw, 860px);
  margin: 0;
  color: #aab8c7;
  font-size: clamp(10px, 1.3vw, 14px);
  font-weight: 700;
  letter-spacing: .035em;
  text-transform: none;
}

.idle-screensaver.is-corner {
  --idle-token-hue: 48;
}

.idle-screensaver.is-corner .idle-screensaver-token {
  --idle-token-hue: 48 !important;
  animation: idle-corner-flare .65s ease-out both;
}

.idle-screensaver.is-corner .idle-screensaver-head {
  color: #ffe27a;
}

@keyframes idle-screensaver-pulse {
  50% { opacity: .34; }
}

@keyframes idle-corner-flare {
  45% { filter: brightness(1.8); }
  100% { box-shadow: 0 0 80px hsl(var(--idle-token-hue) 95% 62% / .55); }
}

@media (max-width: 600px) {
  .idle-screensaver-head,
  .idle-screensaver-foot {
    align-items: flex-start;
    flex-direction: column;
    gap: 7px;
  }

  .idle-screensaver-head small,
  .idle-screensaver-foot small {
    align-self: flex-end;
  }
}

@media (prefers-reduced-motion: reduce) {
  .idle-screensaver {
    cursor: auto;
  }

  .idle-screensaver-token {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) !important;
    will-change: auto;
  }

  .idle-screensaver-head i,
  .idle-screensaver.is-corner .idle-screensaver-token {
    animation: none;
  }
}

.section-subhead {
  max-width: 900px;
  margin: 42px 0 10px;
  font-size: clamp(24px, 3vw, 34px);
  line-height: 1.08;
  letter-spacing: -.035em;
}

.section-deck {
  max-width: 920px;
  margin: 0 0 20px;
  color: var(--muted);
  font-size: 14px;
}

.graph-build-flow,
.graph-query-trace,
.retrieval-refresh-flow {
  margin-top: 18px;
}

.graph-quality-grid article {
  min-height: 190px;
}

.graph-quality-grid p {
  line-height: 1.55;
}

.retrieval-ownership {
  margin-bottom: 0;
}

.retrieval-ownership article {
  min-height: 184px;
}

@media (max-width: 900px) {
  .retrieval-compare {
    grid-template-columns: minmax(0, 1fr);
  }

  .retrieval-diagram figcaption strong {
    font-size: clamp(25px, 5vw, 34px);
  }
}

@media (max-width: 560px) {
  .retrieval-diagram-lanes {
    grid-template-columns: minmax(0, 1fr);
  }

  .retrieval-lane + .retrieval-lane {
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .retrieval-diagram figcaption {
    min-height: 0;
    padding: 18px;
  }

  .retrieval-diagram-result {
    grid-template-columns: minmax(0, 1fr);
  }

  .section-subhead {
    margin-top: 34px;
  }
}

/* Thinking with AI */
.thinking-page .thinking-hero {
  grid-template-columns: minmax(0, 1.12fr) minmax(340px, .68fr);
  align-items: stretch;
  padding-bottom: 72px;
}

.thinking-page .thinking-hero > section {
  align-self: start;
}

.thinking-page .thinking-hero h1 {
  max-width: 10.4ch;
  font-size: clamp(52px, 6.8vw, 94px);
}

.thinking-page .hero-note {
  max-width: 760px;
}

.thinking-loop-card {
  display: grid;
  grid-template-rows: auto 1fr auto;
  overflow: hidden;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 84% 7%, rgba(var(--blue-rgb), .18), transparent 19rem),
    radial-gradient(circle at 10% 96%, rgba(var(--good-rgb), .1), transparent 18rem),
    linear-gradient(180deg, rgba(var(--surface-rgb), .105), rgba(var(--surface-rgb), .04));
  box-shadow: var(--shadow);
}

.thinking-loop-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
  font: 700 10px var(--mono);
  text-transform: uppercase;
  letter-spacing: .05em;
}

.thinking-loop-head span {
  color: var(--good);
}

.thinking-loop-head small {
  color: var(--dim);
  font: inherit;
  text-align: right;
}

.thinking-loop-card ol {
  position: relative;
  display: grid;
  gap: 0;
  margin: 15px 0;
  padding: 0;
  list-style: none;
}

.thinking-loop-card ol::before {
  position: absolute;
  top: 24px;
  bottom: 24px;
  left: 20px;
  width: 1px;
  content: "";
  background: linear-gradient(var(--good), var(--blue), var(--purple));
  opacity: .55;
}

.thinking-loop-card li {
  position: relative;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  gap: 13px;
  margin: 0;
  padding: 7px 0;
}

.thinking-loop-card li > b {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--good);
  background: var(--deep-panel);
  font: 700 10px var(--mono);
}

.thinking-loop-card li > div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 7px;
  border-bottom: 1px solid rgba(var(--surface-rgb), .08);
}

.thinking-loop-card li:last-child > div {
  border-bottom: 0;
}

.thinking-loop-card li strong {
  font-size: 16px;
  letter-spacing: -.025em;
}

.thinking-loop-card li small {
  color: var(--dim);
  font: 9px var(--mono);
  text-transform: uppercase;
  text-align: right;
}

.thinking-loop-card > p {
  margin: 0;
  padding: 16px;
  border: 1px solid rgba(var(--good-rgb), .2);
  border-radius: 14px;
  color: var(--muted);
  background: rgba(var(--dark-panel-rgb), .42);
  font-size: 13px;
}

.thinking-loop-card > p strong {
  color: var(--text);
}

.thinking-start-section,
.context-engineering-section,
.security-first-section,
.open-alternative-section,
.first-month-section {
  border-top: 1px solid rgba(var(--surface-rgb), .075);
  border-bottom: 1px solid rgba(var(--surface-rgb), .075);
  background: rgba(var(--surface-rgb), .018);
}

.thinking-foundations .card {
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.thinking-foundations .card > .path-badge {
  align-self: flex-start;
}

.thinking-foundations .card > :is(a.more, .tool-links) {
  margin-top: auto;
  padding-top: 16px;
}

.thinking-foundations .safe-default {
  margin-top: auto;
}

.thinking-notice {
  display: grid;
  grid-template-columns: minmax(230px, .62fr) minmax(0, 1.38fr);
  gap: 22px;
  align-items: center;
  margin-top: 20px;
  padding: 20px;
  border: 1px solid rgba(var(--blue-rgb), .22);
  border-radius: 15px;
  background: rgba(var(--blue-rgb), .05);
}

.thinking-notice > div {
  display: grid;
  gap: 5px;
}

.thinking-notice span {
  color: var(--blue);
  font: 700 10px var(--mono);
  text-transform: uppercase;
}

.thinking-notice strong {
  font-size: 16px;
}

.thinking-notice p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.thinking-notice p strong {
  color: var(--text);
  font-size: inherit;
}

.thinking-notice p a {
  color: var(--blue);
}

.beginner-notice {
  border-color: rgba(var(--good-rgb), .22);
  background: rgba(var(--good-rgb), .045);
}

.beginner-notice span {
  color: var(--good);
}

.surface-ladder,
.context-budget,
.modernization-rail {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.surface-ladder article,
.context-budget article,
.modernization-rail article {
  min-width: 0;
  padding: 17px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .025);
}

.surface-ladder article,
.modernization-rail article {
  display: flex;
  flex-direction: column;
}

.surface-ladder b {
  color: var(--good);
  font: 750 10px var(--mono);
}

.surface-ladder article > span,
.context-budget article > span {
  display: block;
  margin-top: 14px;
  color: var(--blue);
  font: 750 9px var(--mono);
  text-transform: uppercase;
}

.surface-ladder h3,
.context-budget strong,
.modernization-rail h3 {
  display: block;
  margin: 7px 0 6px;
  font-size: 17px;
  line-height: 1.18;
  letter-spacing: -.025em;
}

.surface-ladder p,
.context-budget p,
.modernization-rail p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.surface-ladder small,
.modernization-rail small {
  display: block;
  margin-top: auto;
  padding-top: 14px;
  color: var(--dim);
  font: 700 9px var(--mono);
  text-transform: uppercase;
}

.context-budget article:nth-child(1) {
  background: rgba(var(--good-rgb), .04);
}

.context-budget article:nth-child(5) {
  background: rgba(var(--purple-rgb), .04);
}

.context-visual,
.context-rot-card {
  overflow: hidden;
  margin: 22px 0 0;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(var(--dark-panel-rgb), .3);
}

.css-diagram-scroll {
  overflow: visible;
}

.agent-loop-diagram {
  position: relative;
  display: grid;
  gap: clamp(22px, 3vw, 34px);
  min-width: 0;
  padding: 54px clamp(16px, 2vw, 28px) 28px;
  color: #f4f7f8;
  background:
    linear-gradient(90deg, rgba(66, 220, 145, .025), transparent 48%),
    #0d1411;
}

.agent-loop-diagram::after {
  position: absolute;
  top: 45px;
  right: 28px;
  bottom: 23px;
  border-right: 1px dashed rgba(66, 220, 145, .7);
  content: "";
}

.agent-loop-limit {
  position: absolute;
  top: 18px;
  right: 28px;
  color: rgba(244, 247, 248, .72);
  font: 750 9px var(--mono);
  text-transform: uppercase;
}

.agent-loop-row {
  display: grid;
  grid-template-columns: clamp(58px, 8vw, 96px) minmax(0, 1fr);
  gap: clamp(8px, 1.2vw, 16px);
  align-items: center;
}

.agent-loop-row > b {
  color: #57df91;
  font: 800 12px var(--mono);
  text-transform: uppercase;
}

.agent-loop-track {
  display: flex;
  min-width: 0;
  height: clamp(72px, 7vw, 96px);
  overflow: hidden;
  border: 1px solid rgba(66, 220, 145, .14);
  border-radius: 15px;
  background: rgba(13, 72, 47, .38);
}

.context-token,
.context-space {
  display: grid;
  place-items: center;
  min-width: 0;
  padding: 10px;
  text-align: center;
}

.context-token {
  flex: 0 0 auto;
  gap: 6px;
  border-right: 1px solid rgba(255, 255, 255, .12);
  font: 750 clamp(7px, .72vw, 9px)/1.3 var(--mono);
  text-transform: uppercase;
}

.context-token em {
  font: inherit;
  font-style: normal;
}

.token-symbol {
  display: block;
  width: clamp(14px, 1.5vw, 18px);
  height: clamp(14px, 1.5vw, 18px);
  color: currentColor;
  background: var(--token-icon) center / contain no-repeat;
  filter: brightness(0) saturate(100%) invert(1);
}

.context-token small {
  color: rgba(255, 255, 255, .68);
  font: 700 8px/1.35 var(--mono);
}

.token-system,
.legend-system {
  --token-color: #08763e;
  --token-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/settings-2.svg");
}

.token-prompt,
.legend-prompt {
  --token-color: #6f2ca3;
  --token-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/message-square-text.svg");
}

.token-file,
.legend-file {
  --token-color: #ffc20c;
  --token-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/file-text.svg");
}

.token-response,
.legend-response {
  --token-color: #087bc1;
  --token-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/message-square-reply.svg");
}

.token-cache,
.legend-cache {
  --token-color: #879aab;
  --token-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/history.svg");
}

.token-system {
  width: 10%;
  background: var(--token-color);
}

.token-prompt {
  width: 10%;
  background: var(--token-color);
}

.token-file {
  width: 11%;
  color: #191d22;
  background: var(--token-color);
}

.token-response {
  width: 14%;
  background: var(--token-color);
}

.token-cache {
  width: 36%;
  background:
    repeating-linear-gradient(90deg, rgba(255, 255, 255, .04) 0 24%, rgba(255, 255, 255, .11) 24% 25%),
    var(--token-color);
}

.context-space {
  flex: 1 1 auto;
  justify-items: end;
  padding-right: 22px;
  color: rgba(244, 247, 248, .48);
  font: 700 8px var(--mono);
  text-transform: uppercase;
}

.context-token-legend {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  padding: 12px 16px;
  border-top: 1px solid rgba(var(--surface-rgb), .08);
  background: #0d1411;
}

.token-legend-item {
  display: flex;
  gap: 8px;
  align-items: center;
  min-width: 0;
  color: rgba(244, 247, 248, .78);
}

.token-legend-item > i {
  position: relative;
  display: grid;
  flex: 0 0 28px;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: var(--token-color);
}

.token-legend-item > i::after {
  width: 14px;
  height: 14px;
  content: "";
  background: var(--token-icon) center / contain no-repeat;
  filter: brightness(0) saturate(100%) invert(1);
}

.legend-file > i::after {
  filter: brightness(0) saturate(100%);
}

.token-legend-item b {
  min-width: 0;
  font: 750 8px/1.25 var(--mono);
  text-transform: uppercase;
}

.context-visual > figcaption {
  display: grid;
  grid-template-columns: minmax(230px, .65fr) minmax(0, 1.35fr);
  gap: 22px;
  align-items: center;
  padding: 17px 19px;
  border-top: 1px solid var(--line);
}

.context-visual > figcaption > div {
  display: grid;
  gap: 4px;
}

.context-visual > figcaption span,
.context-diagram-head span {
  color: var(--good);
  font: 750 9px var(--mono);
  text-transform: uppercase;
}

.context-visual > figcaption strong,
.context-diagram-head strong {
  font-size: 15px;
}

.context-visual > figcaption p,
.context-rot-card > figcaption {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.context-rot-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 22px;
}

.context-rot-card {
  display: grid;
  grid-template-rows: auto 1fr auto;
  margin: 0;
}

.context-diagram-head {
  display: grid;
  gap: 5px;
  padding: 17px 19px;
  border-bottom: 1px solid var(--line);
}

.context-diagram-head strong {
  font-size: 17px;
}

.rot-middle-diagram,
.rot-late-diagram {
  position: relative;
  min-height: 320px;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 100%, rgba(var(--blue-rgb), .08), transparent 18rem),
    rgba(var(--surface-rgb), .018);
}

.recall-label,
.stack-label {
  position: absolute;
  z-index: 3;
  color: var(--lead);
  font: 700 10px/1.3 var(--mono);
  text-align: center;
}

.recall-beginning {
  top: 52px;
  left: 7%;
}

.recall-middle {
  top: 151px;
  left: 50%;
  transform: translateX(-50%);
}

.recall-middle b {
  color: var(--bad);
  font: inherit;
  text-transform: uppercase;
}

.recall-end {
  top: 52px;
  right: 9%;
}

.recall-curve {
  position: absolute;
  top: 109px;
  left: 12%;
  width: 76%;
  height: auto;
  overflow: visible;
  color: var(--blue);
  filter: drop-shadow(0 0 5px rgba(var(--blue-rgb), .18));
}

.decay-document {
  position: absolute;
  bottom: 20px;
  left: 50%;
  display: grid;
  align-content: center;
  gap: 7px;
  width: 108px;
  height: 108px;
  padding: 16px;
  border: 2px solid rgba(var(--surface-rgb), .22);
  border-radius: 10px 10px 2px 2px;
  background: rgba(var(--dark-panel-rgb), .5);
  box-shadow: 0 14px 30px rgba(0, 0, 0, .12);
  transform: translateX(-50%);
}

.decay-document span {
  display: block;
  height: 3px;
  border-radius: 999px;
  background: var(--lead);
}

.decay-document span:nth-child(3),
.decay-document span:nth-child(4),
.decay-document span:nth-child(5) {
  opacity: .15;
}

.context-rot-card > figcaption {
  padding: 15px 18px 17px;
  border-top: 1px solid var(--line);
}

.stack-newest {
  top: 30px;
  left: 24px;
}

.stack-oldest {
  bottom: 54px;
  left: 24px;
}

.context-stack {
  position: absolute;
  top: 35px;
  bottom: 53px;
  left: 50%;
  display: grid;
  width: 178px;
  padding: 10px;
  border: 1px solid rgba(var(--surface-rgb), .19);
  border-radius: 11px;
  background: rgba(var(--dark-panel-rgb), .42);
  transform: translateX(-50%);
}

.context-stack::after {
  position: absolute;
  right: -28px;
  bottom: -16px;
  width: 90px;
  height: 100px;
  content: "";
  background:
    radial-gradient(circle at 10% 20%, rgba(var(--blue-rgb), .5) 0 2px, transparent 3px),
    radial-gradient(circle at 42% 44%, rgba(var(--blue-rgb), .36) 0 3px, transparent 4px),
    radial-gradient(circle at 72% 22%, rgba(var(--good-rgb), .42) 0 2px, transparent 3px),
    radial-gradient(circle at 26% 76%, rgba(var(--surface-rgb), .3) 0 3px, transparent 4px),
    radial-gradient(circle at 78% 80%, rgba(var(--surface-rgb), .26) 0 2px, transparent 3px);
  opacity: .65;
}

.context-stack > span {
  align-self: center;
  height: 32px;
  border: 1px solid rgba(var(--surface-rgb), .13);
  border-radius: 7px;
  background:
    linear-gradient(var(--lead), var(--lead)) 13px 10px / 72% 3px no-repeat,
    linear-gradient(var(--lead), var(--lead)) 13px 18px / 55% 3px no-repeat,
    rgba(var(--surface-rgb), .035);
}

.context-stack > span:nth-child(4) { opacity: .72; }
.context-stack > span:nth-child(5) { opacity: .42; }
.context-stack > span:nth-child(6) { opacity: .18; }

.context-threshold {
  position: absolute;
  top: 51%;
  right: 8%;
  left: 24%;
  z-index: 4;
  border-top: 2px solid var(--blue);
}

.context-threshold span {
  position: absolute;
  top: -22px;
  right: 0;
  color: var(--blue);
  font: 750 8px var(--mono);
  text-transform: uppercase;
}

.context-time-arrow {
  position: absolute;
  right: 20%;
  bottom: 21px;
  color: var(--dim);
  font: 700 9px var(--mono);
}

.context-time-arrow b {
  color: var(--blue);
  font: inherit;
}

.context-control-table,
.replacement-scorecard {
  margin-top: 22px;
}

.context-control-table code,
.skill-starter code,
.tool-call-panel code,
.thinking-notice code {
  color: var(--code-text);
  font-family: var(--mono);
}

.skill-starter {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(330px, .88fr);
  grid-template-areas:
    "intro steps"
    "actions note";
  gap: clamp(22px, 3vw, 38px);
  align-items: start;
  margin-top: 22px;
  padding: clamp(22px, 3vw, 34px);
  border: 1px solid rgba(var(--good-rgb), .27);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 0 0, rgba(var(--good-rgb), .11), transparent 26rem),
    linear-gradient(145deg, rgba(var(--good-rgb), .045), rgba(var(--blue-rgb), .025));
}

.skill-starter-intro {
  grid-area: intro;
}

.skill-starter h3 {
  max-width: 720px;
  margin: 10px 0 12px;
  font-size: clamp(28px, 3.5vw, 46px);
  line-height: 1.02;
  letter-spacing: -.05em;
}

.skill-starter-intro > p {
  max-width: 760px;
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.skill-anatomy {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 20px;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.skill-anatomy > span {
  min-width: 0;
  padding: 14px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--dark-panel-rgb), .24);
}

.skill-anatomy b,
.skill-anatomy small {
  display: block;
}

.skill-anatomy b {
  color: var(--good);
  font: 750 11px var(--mono);
}

.skill-anatomy small {
  margin-top: 6px;
  color: var(--dim);
  font-size: 10px;
  line-height: 1.35;
}

.skill-starter-actions {
  grid-area: actions;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: start;
  gap: 9px;
  margin: 0;
}

.skill-starter-actions > .btn {
  min-width: 0;
  width: 100%;
  padding: 12px 14px;
  font-size: 13px;
  line-height: 1.2;
}

.skill-starter-actions .skill-download {
  color: #07101b;
  border-color: transparent;
}

.skill-starter-actions .skill-download::before,
.skill-starter-actions .skill-spec::before {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  content: "";
  background: var(--skill-action-icon) center / contain no-repeat;
}

.skill-starter-actions .skill-download::before {
  --skill-action-icon: url("../images/lucide-0.468.0-download.svg?v=2");
  filter: brightness(0) saturate(100%);
}

.skill-starter-actions .skill-spec::before {
  --skill-action-icon: url("../images/lucide-0.468.0-globe.svg?v=1");
}

.skill-starter-actions .skill-spec b {
  font-size: 14px;
}

.skill-starter-actions .skill-download-color {
  background: linear-gradient(135deg, #72dfa2, #c3f5d5);
}

.skill-starter-actions .skill-download-structure {
  background: linear-gradient(135deg, #ffc857, #ffe5a3);
}

.skill-starter-actions .skill-download-evidence {
  color: #f7fbff;
  background: linear-gradient(135deg, #2d62ad, #3568b8);
}

.skill-starter-actions .skill-download-evidence::before {
  filter: brightness(0) invert(1);
}

.skill-starter-actions .skill-nvidia {
  position: relative;
  isolation: isolate;
  grid-column: 1 / -1;
  overflow: hidden;
  gap: 9px;
  color: #081005;
  border-color: #9be326;
  background: linear-gradient(135deg, #76b900, #9be326);
  box-shadow: 0 8px 24px rgba(118, 185, 0, .2);
}

.skill-nvidia > *:not(.skill-nvidia-field) {
  position: relative;
  z-index: 1;
}

.skill-nvidia img {
  flex: 0 0 auto;
  filter: brightness(0);
}

.skill-nvidia b {
  font-size: 14px;
}

.skill-nvidia-field {
  position: absolute;
  z-index: 0;
  inset: -70%;
  pointer-events: none;
  opacity: .48;
  background-image:
    url("../images/dgx-spark-network.svg?v=1"),
    radial-gradient(circle, rgba(6, 14, 3, .52) 0 1px, transparent 1.7px),
    radial-gradient(circle, rgba(255, 255, 255, .4) 0 .7px, transparent 1.4px);
  background-position: 0 0, 22px 16px, 64px 48px;
  background-size: 380px 230px, 96px 74px, 127px 93px;
  animation: nvidia-playbook-drift 9s ease-in-out infinite alternate;
}

.skill-nvidia-field i {
  position: absolute;
  width: 7px;
  height: 6px;
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
  background: #081005;
  box-shadow: 0 0 12px rgba(8, 16, 5, .35);
  animation: nvidia-playbook-particle 3.8s ease-in-out infinite alternate;
}

.skill-nvidia-field i:nth-child(1) { top: 18%; left: 9%; animation-delay: -2s; }
.skill-nvidia-field i:nth-child(2) { top: 31%; left: 41%; width: 5px; height: 5px; animation-delay: -5s; }
.skill-nvidia-field i:nth-child(3) { top: 14%; right: 18%; animation-delay: -7s; }
.skill-nvidia-field i:nth-child(4) { right: 7%; bottom: 22%; width: 5px; height: 5px; animation-delay: -3s; }
.skill-nvidia-field i:nth-child(5) { bottom: 14%; left: 28%; width: 5px; height: 5px; animation-delay: -6s; }
.skill-nvidia-field i:nth-child(6) { top: 56%; left: 54%; animation-delay: -1s; }

.skill-starter-actions .skill-nvidia:hover {
  color: #030703;
  border-color: #b8f257;
  background: linear-gradient(135deg, #86ce0a, #b3ed50);
}

.skill-starter-actions .skill-nvidia:focus-visible {
  outline-color: #76b900;
  outline-offset: 3px;
}

.skill-starter-notes {
  grid-area: note;
  display: grid;
  gap: 9px;
}

.skill-starter .skill-starter-note {
  display: block;
  max-width: none;
  margin: 0;
  padding: 13px 15px;
  border-left: 3px solid var(--blue);
  background: rgba(var(--blue-rgb), .055);
  font-size: 11px;
}

.skill-starter-note strong {
  color: var(--text);
}

.skill-create-steps {
  grid-area: steps;
  display: grid;
  gap: 0;
  align-content: start;
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
  list-style: none;
}

.skill-create-steps li {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 13px;
  align-items: start;
  margin: 0;
  padding: 15px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .025);
}

.skill-create-steps li > b {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border: 1px solid rgba(var(--good-rgb), .28);
  border-radius: 11px;
  color: var(--good);
  background: rgba(var(--good-rgb), .07);
  font: 800 10px var(--mono);
}

.skill-create-steps strong {
  display: block;
  margin: 2px 0 5px;
  font-size: 14px;
}

.skill-create-steps p {
  margin: 0;
  color: var(--muted);
  font-size: 10px;
}

.context-repair {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 22px minmax(0, 1fr) 22px minmax(0, 1fr) 22px minmax(0, 1fr);
  align-items: stretch;
  margin-top: 22px;
}

.context-repair > div {
  padding: 16px;
  border: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .025);
}

.context-repair > div > span {
  color: var(--good);
  font: 750 10px var(--mono);
}

.context-repair > div > strong {
  display: block;
  margin: 13px 0 5px;
  font-size: 17px;
}

.context-repair p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

.context-repair > i {
  display: grid;
  place-items: center;
  color: var(--good);
  font-style: normal;
}

.tool-call-panel {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(270px, .75fr);
  gap: 24px;
  align-items: start;
  margin-top: 22px;
  padding: 22px;
  border: 1px solid rgba(var(--blue-rgb), .22);
  border-radius: var(--radius);
  background: linear-gradient(135deg, rgba(var(--blue-rgb), .06), rgba(var(--surface-rgb), .025));
}

.tool-call-panel h3,
.modernization-prompt h3 {
  margin: 8px 0;
  font-size: clamp(25px, 3vw, 38px);
  line-height: 1.05;
  letter-spacing: -.045em;
}

.tool-call-panel p,
.modernization-prompt p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.tool-call-panel aside {
  padding: 17px;
  border: 1px solid rgba(var(--surface-rgb), .1);
  border-radius: 14px;
  background: rgba(var(--dark-panel-rgb), .34);
}

.tool-call-panel aside > strong {
  font-size: 13px;
}

.tool-call-panel ul {
  margin: 12px 0 0;
  padding-left: 17px;
  color: var(--muted);
  font-size: 11px;
}

.tool-call-flow {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
  margin-top: 18px;
}

.tool-call-flow span {
  padding: 7px 9px;
  border: 1px solid rgba(var(--blue-rgb), .17);
  border-radius: 999px;
  color: var(--lead);
  background: rgba(var(--blue-rgb), .045);
  font: 700 9px var(--mono);
  text-transform: uppercase;
}

.tool-call-flow i {
  color: var(--blue);
  font-style: normal;
}

.modernization-rail article:nth-child(1),
.modernization-rail article:nth-child(4) {
  background: rgba(var(--good-rgb), .035);
}

.modernization-rail b {
  color: var(--good);
  font: 750 9px var(--mono);
  text-transform: uppercase;
}

.modernization-rail h3 {
  margin-top: 17px;
}

.modernization-prompt {
  display: grid;
  grid-template-columns: minmax(260px, .7fr) minmax(0, 1.3fr);
  gap: 24px;
  align-items: center;
  margin-top: 22px;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: linear-gradient(120deg, rgba(var(--surface-rgb), .07), rgba(var(--surface-rgb), .022));
}

.modernization-prompt .prompt-block {
  margin: 0;
}

.prompt-contract {
  display: grid;
  grid-template-columns: minmax(260px, .72fr) minmax(0, 1.28fr);
  gap: 28px;
  align-items: center;
  margin-top: 24px;
  padding: 25px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: linear-gradient(120deg, rgba(var(--surface-rgb), .08), rgba(var(--surface-rgb), .025));
}

.prompt-contract h3 {
  margin: 0 0 8px;
  font-size: clamp(24px, 3vw, 34px);
  letter-spacing: -.045em;
}

.prompt-contract p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.prompt-contract .prompt-block {
  margin: 0;
}

.spec-rails-note {
  position: relative;
  display: grid;
  grid-template-columns: minmax(280px, .9fr) minmax(0, 1.1fr);
  gap: 22px;
  align-items: start;
  overflow: hidden;
  margin-bottom: 20px;
  padding: 18px 20px;
  border: 1px solid rgba(var(--good-rgb), .22);
  border-radius: var(--radius);
  background: linear-gradient(125deg, rgba(var(--good-rgb), .06), rgba(var(--surface-rgb), .022));
}

.buzz-collaboration-note {
  margin-top: 28px;
}

.spec-rails-note::before {
  position: absolute;
  top: 18px;
  bottom: 18px;
  left: 0;
  width: 3px;
  border-radius: 0 3px 3px 0;
  content: "";
  background: var(--good);
}

.spec-rails-copy h3 {
  margin: 8px 0 7px;
  font-size: clamp(22px, 2.4vw, 30px);
  line-height: 1.04;
  letter-spacing: -.045em;
}

.spec-rails-copy p,
.spec-rail-caveat {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.spec-rail-uses {
  border-top: 1px solid var(--line);
}

.spec-rail-details {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.spec-rail-uses > div {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  gap: 13px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}

.spec-rail-uses b {
  color: var(--good);
  font: 750 9px var(--mono);
  text-transform: uppercase;
}

.spec-rail-uses span {
  color: var(--lead);
  font-size: 11px;
}

.spec-rail-caveat {
  padding-top: 12px;
  border-top: 1px solid rgba(var(--good-rgb), .16);
}

.spec-rail-caveat strong {
  color: var(--text);
}

.thinking-flow {
  margin-top: 0;
}

.artifact-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 18px;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.artifact-grid article {
  min-height: 145px;
  padding: 18px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .025);
}

.artifact-grid span {
  color: var(--good);
  font: 700 10px var(--mono);
  text-transform: uppercase;
}

.artifact-grid h3 {
  margin: 14px 0 7px;
  font-size: 20px;
}

.artifact-grid p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.stop-rules {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 20px;
  padding: 16px;
  border: 1px solid rgba(var(--warn-rgb), .2);
  border-radius: 14px;
  background: rgba(var(--warn-rgb), .045);
}

.stop-rules strong {
  margin-right: 6px;
  color: var(--warn);
  font: 750 10px var(--mono);
  text-transform: uppercase;
}

.stop-rules span {
  padding: 5px 8px;
  border: 1px solid rgba(var(--warn-rgb), .17);
  border-radius: 999px;
  color: var(--muted);
  font-size: 11px;
}

.thinking-tool-table code,
.economics-formula code {
  color: var(--code-text);
  font-family: var(--mono);
}

.thinking-tool-table th:first-child { width: 15%; }
.thinking-tool-table th:nth-child(2),
.thinking-tool-table th:nth-child(3),
.thinking-tool-table th:nth-child(4) { width: 28.333%; }

.security-principle {
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr);
  gap: 20px;
  align-items: center;
  margin-bottom: 24px;
  padding: 20px;
  border: 1px solid rgba(var(--bad-rgb), .24);
  border-radius: 15px;
  background: rgba(var(--bad-rgb), .055);
}

.security-principle span {
  color: var(--bad);
  font: 800 10px var(--mono);
  text-transform: uppercase;
}

.security-principle p {
  margin: 0;
  color: var(--lead);
  font-size: 15px;
}

.pipeline-rail {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.pipeline-rail article {
  position: relative;
  min-height: 158px;
  padding: 16px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .025);
}

.pipeline-rail article:nth-child(-n + 3) {
  background: rgba(var(--good-rgb), .035);
}

.pipeline-rail article:not(:last-child)::after {
  position: absolute;
  top: 28px;
  right: -11px;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 21px;
  height: 21px;
  border: 1px solid var(--line);
  border-radius: 50%;
  content: "→";
  color: var(--good);
  background: var(--deep-panel);
  font: 11px var(--mono);
}

.pipeline-rail b {
  display: block;
  color: var(--good);
  font: 700 9px var(--mono);
  text-transform: uppercase;
}

.pipeline-rail strong {
  display: block;
  margin: 18px 0 7px;
  font-size: 16px;
  line-height: 1.2;
}

.pipeline-rail span {
  color: var(--muted);
  font-size: 11px;
}

.glossary-notice {
  border-color: rgba(var(--purple-rgb), .22);
  background: rgba(var(--purple-rgb), .045);
}

.glossary-notice span {
  color: var(--purple);
}

.security-gate-table {
  margin-top: 24px;
}

.security-secret-note {
  margin-top: 20px;
}

.access-price-warning {
  display: grid;
  grid-template-columns: minmax(240px, .65fr) minmax(0, 1.35fr);
  gap: 18px;
  align-items: center;
  margin-bottom: 12px;
  padding: 15px 16px;
  border: 1px solid rgba(var(--warn-rgb), .28);
  border-radius: var(--radius);
  background:
    linear-gradient(115deg, rgba(var(--warn-rgb), .1), transparent 58%),
    rgba(var(--surface-rgb), .025);
}

.access-price-warning > div > span,
.access-workload-options article > span {
  color: var(--warn);
  font: 750 9px var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}

.access-price-warning > div > p {
  margin: 0;
  color: var(--text);
  font-size: clamp(19px, 2vw, 24px);
  font-weight: 760;
  line-height: 1.08;
  letter-spacing: -.035em;
}

.access-price-warning > div > p strong {
  color: var(--warn);
  font-weight: inherit;
}

.access-price-warning > p {
  margin: 0;
  padding-left: 18px;
  border-left: 1px solid rgba(var(--warn-rgb), .25);
  color: var(--muted);
  font-size: 12px;
}

.subscription-playbook-section {
  padding: 42px 0;
  border-top: 1px solid rgba(var(--surface-rgb), .075);
  border-bottom: 1px solid rgba(var(--surface-rgb), .075);
  background:
    radial-gradient(circle at 12% 18%, rgba(var(--warn-rgb), .055), transparent 28rem),
    rgba(var(--surface-rgb), .018);
}

.subscription-playbook-section .section-head {
  margin-bottom: 16px;
}

.subscription-playbook-section .section-head h2 {
  max-width: 760px;
  font-size: clamp(34px, 4.3vw, 50px);
}

.subscription-path {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  align-items: stretch;
}

.subscription-step {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto 1fr;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(var(--surface-rgb), .035);
}

.subscription-step-copy,
.subscription-step-side {
  padding: 18px;
}

.subscription-step-side {
  display: grid;
  align-items: center;
  border-top: 1px solid var(--line);
  background: rgba(var(--dark-panel-rgb), .2);
}

.subscription-step-copy > span {
  font: 750 9px var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}

.subscription-step-copy h3 {
  margin: 14px 0 8px;
  font-size: clamp(25px, 2.5vw, 32px);
  line-height: 1.02;
  letter-spacing: -.05em;
}

.subscription-step-copy > p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.access-start {
  border-color: rgba(var(--good-rgb), .28);
  background: linear-gradient(155deg, rgba(var(--good-rgb), .08), rgba(var(--surface-rgb), .025));
}

.access-start .subscription-step-copy > span {
  color: var(--good);
}

.access-upgrade {
  border-color: rgba(var(--blue-rgb), .28);
  background: linear-gradient(155deg, rgba(var(--blue-rgb), .08), rgba(var(--surface-rgb), .025));
}

.access-upgrade .subscription-step-copy > span {
  color: var(--blue);
}

.access-optimize {
  border-color: rgba(var(--purple-rgb), .28);
  background: linear-gradient(155deg, rgba(var(--purple-rgb), .08), rgba(var(--surface-rgb), .025));
}

.access-optimize .subscription-step-copy > span {
  color: var(--purple);
}

.access-plan-pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}

.access-plan-pair > div {
  padding: 15px;
  border: 1px solid rgba(var(--good-rgb), .18);
  border-radius: 10px;
  background: rgba(var(--dark-panel-rgb), .32);
}

.access-plan-pair :is(small, strong, b, em) {
  display: block;
}

.access-plan-pair small {
  color: var(--muted);
  font: 700 8px var(--mono);
  letter-spacing: .07em;
  text-transform: uppercase;
}

.access-plan-pair strong {
  margin-top: 5px;
  font-size: 24px;
}

.access-plan-pair b {
  margin-top: 12px;
  color: var(--good);
  font-size: 18px;
}

.access-plan-pair em {
  margin-top: 2px;
  color: var(--muted);
  font-size: 9px;
  font-style: normal;
}

.access-big-number {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 13px;
  align-items: center;
  margin: 0;
  padding: 18px;
  border: 1px solid rgba(var(--blue-rgb), .2);
  border-radius: 10px;
  background: rgba(var(--dark-panel-rgb), .32);
}

.access-big-number strong {
  color: var(--blue);
  font-size: clamp(50px, 5.8vw, 72px);
  line-height: 1;
  letter-spacing: -.06em;
}

.access-big-number span {
  color: var(--muted);
  max-width: 210px;
  font-size: 14px;
  line-height: 1.3;
}

.access-checklist {
  display: grid;
  gap: 7px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.access-checklist li {
  position: relative;
  padding: 11px 12px 11px 32px;
  border: 1px solid rgba(var(--purple-rgb), .14);
  border-radius: 8px;
  color: var(--muted);
  background: rgba(var(--dark-panel-rgb), .28);
  font-size: 12px;
}

.access-checklist li::before {
  position: absolute;
  top: 11px;
  left: 12px;
  content: "✓";
  color: var(--purple);
  font-weight: 800;
}

.access-checklist strong,
.access-card-rule strong {
  color: var(--text);
}

.subscription-step-copy .access-card-rule {
  margin-top: 14px;
  padding-top: 11px;
  border-top: 1px solid var(--line);
  font-size: 10px;
}

.access-workload-panel {
  display: grid;
  grid-template-columns: minmax(240px, .72fr) minmax(0, 1.28fr);
  gap: 16px 22px;
  margin-top: 16px;
  padding: 18px;
  border: 1px solid rgba(var(--good-rgb), .22);
  border-radius: var(--radius);
  background: rgba(var(--good-rgb), .035);
}

.access-workload-intro h3 {
  margin: 10px 0 7px;
  font-size: clamp(26px, 3vw, 36px);
  line-height: 1.02;
  letter-spacing: -.05em;
}

.access-workload-intro p,
.access-workload-note,
.access-workload-options p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.access-workload-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.access-workload-options article {
  padding: 15px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .025);
}

.access-workload-options article:nth-child(2) > span {
  color: var(--blue);
}

.access-workload-options h4 {
  margin: 10px 0 7px;
  font-size: 19px;
  line-height: 1.16;
}

.access-workload-options strong,
.access-workload-note strong {
  color: var(--text);
}

.access-workload-note {
  grid-column: 1 / -1;
  padding-top: 13px;
  border-top: 1px solid var(--line);
}

.subscription-playbook-section .source-bar {
  margin-top: 12px;
  padding: 15px 16px;
  border-radius: 12px;
}

.access-ladder-section {
  padding: 42px 0;
}

.access-ladder-section .section-head {
  margin-bottom: 16px;
}

.access-ladder-section .section-head h2 {
  max-width: 760px;
  font-size: clamp(34px, 4.3vw, 50px);
}

.access-ladder-section .source-bar p > strong:first-child {
  display: inline;
  margin: 0;
}

.access-resilience-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 0;
}

.access-card {
  display: grid;
  grid-template-rows: auto auto 1fr auto;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(var(--surface-rgb), .035);
}

.access-card > span {
  color: var(--good);
  font: 750 10px var(--mono);
  text-transform: uppercase;
}

.access-card h3 {
  margin: 14px 0 8px;
  font-size: clamp(24px, 2.7vw, 31px);
  line-height: 1.03;
  letter-spacing: -.05em;
}

.access-card p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.access-card p strong {
  color: var(--text);
}

.access-card > :is(.more, .tool-links) {
  margin-top: 16px;
  padding-top: 0;
}

.access-card .tool-links {
  display: grid;
}

.access-package {
  border-color: rgba(var(--good-rgb), .26);
  background: linear-gradient(160deg, rgba(var(--good-rgb), .08), rgba(var(--surface-rgb), .03));
}

.access-api {
  border-color: rgba(var(--blue-rgb), .26);
  background: linear-gradient(160deg, rgba(var(--blue-rgb), .08), rgba(var(--surface-rgb), .03));
}

.access-api > span {
  color: var(--blue);
}

.access-owned {
  border-color: rgba(var(--purple-rgb), .26);
  background: linear-gradient(160deg, rgba(var(--purple-rgb), .08), rgba(var(--surface-rgb), .03));
}

.access-owned > span {
  color: var(--purple);
}

.incident-runbook {
  display: grid;
  grid-template-columns: minmax(280px, .72fr) minmax(0, 1.28fr);
  gap: 26px;
  align-items: start;
  margin-top: 24px;
  padding: 22px;
  border: 1px solid rgba(var(--warn-rgb), .22);
  border-radius: var(--radius);
  background: rgba(var(--warn-rgb), .04);
}

.incident-runbook h3 {
  margin: 0 0 9px;
  font-size: clamp(26px, 3.5vw, 42px);
  line-height: 1.04;
  letter-spacing: -.05em;
}

.incident-runbook > div > p {
  margin: 0;
  color: var(--muted);
}

.incident-steps {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--line);
}

.incident-steps li {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  padding: 9px 0;
  border-bottom: 1px solid var(--line);
}

.incident-steps li > span {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border: 1px solid rgba(var(--warn-rgb), .24);
  border-radius: 8px;
  color: var(--warn);
  background: rgba(var(--warn-rgb), .055);
  font: 750 9px var(--mono);
}

.incident-steps p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.42;
}

.incident-steps strong {
  color: var(--text);
}

.access-route-grid,
.hardware-route-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 24px;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.access-route-grid article,
.hardware-route-grid article {
  display: flex;
  flex-direction: column;
  min-height: 190px;
  padding: 18px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .025);
}

.access-route-grid .path-badge,
.hardware-route-grid .path-badge {
  align-self: flex-start;
}

.access-route-grid h3,
.hardware-route-grid h3 {
  margin: 16px 0 7px;
  font-size: 19px;
  line-height: 1.18;
}

.access-route-grid p,
.hardware-route-grid p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.hardware-route-grid a.more {
  margin-top: auto;
  padding-top: 16px;
}

.replacement-flow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 28px minmax(0, 1fr) 28px minmax(0, 1fr) 28px minmax(0, 1fr) 28px minmax(0, 1fr);
  align-items: stretch;
}

.replacement-flow article {
  min-height: 162px;
  padding: 17px;
  border: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .03);
}

.replacement-flow b {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border: 1px solid rgba(var(--good-rgb), .22);
  border-radius: 8px;
  color: var(--good);
  background: rgba(var(--good-rgb), .05);
  font: 750 9px var(--mono);
}

.replacement-flow strong {
  display: block;
  margin: 14px 0 7px;
  font-size: 18px;
  line-height: 1.15;
}

.replacement-flow span {
  color: var(--muted);
  font-size: 11px;
}

.replacement-flow > i {
  display: grid;
  place-items: center;
  color: var(--good);
  font-style: normal;
}

.replacement-scorecard {
  margin-top: 22px;
}

.openrouter-lab {
  display: grid;
  grid-template-columns: minmax(0, 1.22fr) minmax(270px, .78fr);
  gap: 28px;
  align-items: center;
  margin-top: 22px;
  padding: 21px;
  border: 1px solid rgba(var(--blue-rgb), .24);
  border-radius: var(--radius);
  background: rgba(var(--blue-rgb), .045);
}

.openrouter-lab h3 {
  margin: 0 0 8px;
  font-size: clamp(25px, 3vw, 38px);
  letter-spacing: -.045em;
}

.openrouter-lab p {
  margin: 0;
  color: var(--muted);
}

.openrouter-lab .tool-links {
  margin: 0;
}

.local-economics {
  display: grid;
  grid-template-columns: minmax(300px, .78fr) minmax(0, 1.22fr);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(var(--dark-panel-rgb), .36);
  box-shadow: var(--shadow);
}

.local-economics-controls,
.local-economics-results {
  padding: 25px;
}

.local-economics-controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  border-right: 1px solid var(--line);
}

.local-economics-controls label {
  min-width: 0;
  color: var(--dim);
  font: 700 10px var(--mono);
  text-transform: uppercase;
}

.local-economics-controls label:nth-of-type(1),
.local-economics-controls label:nth-of-type(2),
.local-economics-controls p {
  grid-column: 1 / -1;
}

.local-economics-controls input[type="number"] {
  width: 100%;
  min-width: 0;
  height: 44px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 11px;
  color: var(--text);
  background: var(--control-bg);
  font: 700 15px var(--mono);
}

.local-economics-controls p {
  margin: 4px 0 0;
  padding-top: 14px;
  border-top: 1px solid var(--line);
  color: var(--dim);
  font-size: 11px;
}

.local-economics-results {
  display: grid;
  align-content: start;
  gap: 18px;
  background:
    radial-gradient(circle at 100% 0%, rgba(var(--good-rgb), .1), transparent 28rem),
    rgba(var(--surface-rgb), .02);
}

.economics-verdict {
  padding-bottom: 17px;
  border-bottom: 1px solid var(--line);
}

.economics-verdict > span {
  color: var(--good);
  font: 750 9px var(--mono);
  text-transform: uppercase;
}

.economics-verdict > strong {
  display: block;
  margin: 10px 0 6px;
  font-size: clamp(28px, 4vw, 48px);
  line-height: 1;
  letter-spacing: -.055em;
}

.economics-verdict > p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.economics-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.economics-metrics article {
  padding: 16px;
  border: 1px solid rgba(var(--surface-rgb), .09);
  border-radius: 12px;
  background: rgba(var(--dark-panel-rgb), .32);
}

.economics-metrics span {
  display: block;
  color: var(--dim);
  font: 700 9px var(--mono);
  text-transform: uppercase;
}

.economics-metrics strong {
  display: block;
  margin-top: 8px;
  color: var(--good);
  font-size: clamp(21px, 3vw, 34px);
  letter-spacing: -.045em;
}

.economics-formula {
  display: grid;
  gap: 8px;
  padding: 15px;
  border-left: 3px solid var(--blue);
  background: rgba(var(--blue-rgb), .05);
}

.economics-formula strong {
  font-size: 11px;
  text-transform: uppercase;
}

.economics-formula code {
  font-size: 11px;
  line-height: 1.55;
}

.local-economics-results .planner-warning {
  margin: 0;
}

.privacy-notice {
  border-color: rgba(var(--good-rgb), .22);
  background: rgba(var(--good-rgb), .045);
}

.privacy-notice span {
  color: var(--good);
}

.first-month-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.first-month-grid article {
  display: flex;
  flex-direction: column;
  min-height: 325px;
  padding: 18px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .025);
}

.first-month-grid article > b {
  color: var(--good);
  font: 750 10px var(--mono);
  text-transform: uppercase;
}

.first-month-grid h3 {
  margin: 20px 0 9px;
  font-size: 23px;
  letter-spacing: -.04em;
}

.first-month-grid ul {
  margin: 0;
  padding-left: 17px;
  font-size: 12px;
}

.first-month-grid article > strong {
  margin-top: auto;
  padding-top: 15px;
  border-top: 1px solid var(--line);
  color: var(--lead);
  font-size: 12px;
}

@media (max-width: 1040px) {
  .thinking-page .thinking-hero,
  .local-economics {
    grid-template-columns: 1fr;
  }

  .subscription-path {
    grid-template-columns: 1fr;
  }

  .subscription-step {
    grid-template-columns: minmax(280px, .85fr) minmax(360px, 1.15fr);
    grid-template-rows: 1fr;
  }

  .subscription-step-side {
    border-top: 0;
    border-left: 1px solid var(--line);
  }

  .thinking-loop-card {
    grid-template-rows: auto auto auto;
  }

  .thinking-loop-card ol {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .thinking-loop-card ol::before {
    display: none;
  }

  .thinking-loop-card li {
    grid-template-columns: 36px minmax(0, 1fr);
    padding: 8px;
  }

  .thinking-loop-card li > b {
    width: 36px;
    height: 36px;
  }

  .thinking-loop-card li > div {
    align-items: start;
    flex-direction: column;
    gap: 2px;
    border-bottom: 0;
  }

  .thinking-loop-card li small {
    text-align: left;
  }

  .pipeline-rail {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .surface-ladder,
  .context-budget,
  .modernization-rail {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .context-repair {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border-top: 1px solid var(--line);
    border-left: 1px solid var(--line);
  }

  .context-repair > div {
    border-top: 0;
    border-left: 0;
  }

  .context-repair > i {
    display: none;
  }

  .pipeline-rail article:nth-child(3)::after {
    display: none;
  }

  .access-route-grid,
  .hardware-route-grid,
  .first-month-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .replacement-flow {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    border-top: 1px solid var(--line);
    border-left: 1px solid var(--line);
  }

  .replacement-flow article {
    min-height: 158px;
    border-top: 0;
    border-left: 0;
  }

  .replacement-flow > i {
    display: none;
  }

  .local-economics-controls {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
}

@media (max-width: 900px) {
  .skill-starter {
    grid-template-columns: 1fr;
    grid-template-areas:
      "intro"
      "actions"
      "note"
      "steps";
  }

  .agent-loop-diagram {
    gap: 22px;
    padding: 50px 16px 18px;
  }

  .subscription-step {
    grid-template-columns: minmax(240px, .9fr) minmax(300px, 1.1fr);
  }

  .access-workload-panel {
    grid-template-columns: 1fr;
  }

  .agent-loop-diagram::after {
    right: 16px;
  }

  .agent-loop-limit {
    top: 17px;
    right: 16px;
  }

  .agent-loop-row {
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 8px;
  }

  .agent-loop-row > b {
    font-size: 9px;
    line-height: 1.2;
  }

  .agent-loop-track {
    height: 74px;
  }

  .context-token {
    gap: 4px;
    padding: 6px 2px;
    font-size: 8px;
  }

  .context-space {
    padding-right: 10px;
    font-size: 7px;
  }

  .context-token-legend {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .thinking-loop-card ol,
  .artifact-grid,
  .pipeline-rail,
  .surface-ladder,
  .context-budget,
  .context-rot-grid,
  .context-repair,
  .modernization-rail,
  .replacement-flow,
  .access-route-grid,
  .hardware-route-grid,
  .first-month-grid {
    grid-template-columns: 1fr;
  }

  .access-price-warning,
  .access-resilience-grid,
  .access-workload-options {
    grid-template-columns: 1fr;
  }

  .subscription-step {
    grid-template-columns: 1fr;
    grid-template-rows: auto 1fr;
  }

  .subscription-step-side {
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .source-with-links .tool-links {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .access-price-warning > p {
    padding-top: 14px;
    padding-left: 0;
    border-top: 1px solid rgba(var(--warn-rgb), .25);
    border-left: 0;
  }

  .thinking-loop-card li {
    padding: 7px 0;
  }

  .thinking-loop-card li > div {
    flex-direction: row;
    align-items: baseline;
    border-bottom: 1px solid rgba(var(--surface-rgb), .08);
  }

  .thinking-loop-card li small {
    text-align: right;
  }

  .thinking-notice,
  .prompt-contract,
  .spec-rails-note,
  .context-visual > figcaption,
  .tool-call-panel,
  .modernization-prompt,
  .security-principle,
  .incident-runbook,
  .openrouter-lab {
    grid-template-columns: 1fr;
  }

  .skill-anatomy {
    grid-template-columns: 1fr;
  }

  .thinking-page .section-head .heading-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 34px;
    gap: 10px;
    align-items: start;
  }

  .thinking-page .section-head .section-share {
    width: 34px;
    height: 34px;
    min-height: 34px;
    margin: 0;
    padding: 0;
  }

  .thinking-page .section-head .section-share-label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
  }

  .thinking-foundations .card {
    height: auto;
  }

  .thinking-foundations .card > :is(a.more, .tool-links),
  .thinking-foundations .safe-default {
    margin-top: 16px;
    padding-top: 0;
  }

  .pipeline-rail article:not(:last-child)::after {
    display: none;
  }

  .pipeline-rail article,
  .surface-ladder article,
  .context-budget article,
  .context-repair > div,
  .modernization-rail article,
  .replacement-flow article,
  .access-route-grid article,
  .hardware-route-grid article,
  .first-month-grid article {
    min-height: 0;
  }

  .access-card {
    min-height: 0;
  }

  .local-economics-controls {
    grid-template-columns: 1fr;
  }

  .context-visual > figcaption {
    gap: 8px;
  }

  .context-token em,
  .context-token small {
    display: none;
  }

  .token-symbol {
    width: 17px;
    height: 17px;
  }

  .local-economics-controls label,
  .local-economics-controls label:nth-of-type(1),
  .local-economics-controls label:nth-of-type(2),
  .local-economics-controls p {
    grid-column: auto;
  }
}

@media (max-width: 520px) {
  .thinking-page .thinking-hero h1 {
    font-size: clamp(45px, 14vw, 66px);
  }

  .thinking-loop-card,
  .prompt-contract,
  .spec-rails-note,
  .skill-starter,
  .tool-call-panel,
  .modernization-prompt,
  .incident-runbook,
  .openrouter-lab,
  .local-economics-controls,
  .local-economics-results {
    padding: 19px;
  }

  .economics-metrics {
    grid-template-columns: 1fr;
  }

  .thinking-notice {
    padding: 17px;
  }

  .context-diagram-head,
  .context-visual > figcaption {
    padding: 15px;
  }

  .recall-middle {
    top: 122px;
  }

  .context-token-legend {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 10px 12px;
  }
}

@media (max-width: 560px) {
  .skill-starter-actions {
    grid-template-columns: 1fr;
  }

  .skill-starter-actions .skill-nvidia {
    grid-column: auto;
  }
}

/* Contextual social sharing and branded chart exports */
[data-share-export="compact"] .frontier-telemetry-grid,
[data-share-export="compact"] .adoption-map-layout {
  grid-template-columns: 1fr;
}

[data-share-export="compact"] .codex-adoption-chart {
  display: flex;
  align-items: stretch;
  flex-direction: column;
}

[data-share-export="compact"] .codex-series,
[data-share-export="compact"] .codex-distribution-event {
  flex: 0 0 auto;
}

[data-share-export="compact"] .adoption-map-layout {
  min-height: 0;
}

[data-share-export="compact"] .adoption-map-reading {
  padding: 20px;
  border-top: 1px solid var(--line);
  border-left: 0;
}

[data-share-export="compact"] .study-chart article {
  grid-template-columns: 1fr 80px;
  gap: 10px;
}

[data-share-export="compact"] .study-axis {
  grid-column: 1 / -1;
  grid-row: 2;
}

[data-share-export="compact"] .study-chart article > b {
  grid-column: 2;
  grid-row: 1;
}

[data-share-export="compact"] .scale-chart article,
[data-share-export="compact"] .efficiency-row,
[data-share-export="compact"] .memory-row {
  grid-template-columns: 1fr;
}

[data-share-export="compact"] .scale-chart article > b {
  text-align: left;
}

[data-share-export="compact"] .efficiency-axis,
[data-share-export="compact"] .memory-axis {
  margin-left: 0;
}

[data-share-export="compact"] .efficiency-row,
[data-share-export="compact"] .memory-row {
  gap: 6px;
}

[data-share-export="compact"] .efficiency-label,
[data-share-export="compact"] .memory-label {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2px 10px;
  align-items: baseline;
}

[data-share-export="compact"] .efficiency-label span,
[data-share-export="compact"] .memory-label span {
  margin-top: 0;
}

[data-share-export="compact"] .efficiency-label small {
  grid-column: 1 / -1;
}

[data-share-export="compact"] .atlas-chart {
  --atlas-label: 0px;
  padding: 14px;
}

[data-share-export="compact"] .atlas-axis-title {
  margin-left: 0;
  padding-bottom: 10px;
}

[data-share-export="compact"] .atlas-axis {
  display: none;
}

[data-share-export="compact"] .atlas-lane {
  grid-template-columns: 1fr;
}

[data-share-export="compact"] .atlas-lane > strong {
  padding: 11px 2px 7px;
}

[data-share-export="compact"] .atlas-cells {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

[data-share-export] .compute-axis {
  display: flex;
  position: static;
  justify-content: space-between;
}

[data-share-export] .compute-axis span {
  position: static;
  transform: none;
}

.share-toolbar {
  grid-column: 1 / -1;
  width: fit-content;
  max-width: 100%;
  margin-top: 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--text);
  background: var(--control-bg);
  box-shadow: 0 8px 22px rgba(0, 0, 0, .08);
  overflow: hidden;
  transition: border-color .2s ease, border-radius .2s ease, box-shadow .2s ease;
}

.share-toolbar[open] {
  width: 100%;
  border-color: rgba(var(--blue-rgb), .42);
  border-radius: 18px;
  box-shadow: 0 16px 42px rgba(0, 0, 0, .14);
}

.share-toolbar:not([open]) > .share-toolbar-panel {
  display: none;
}

.share-toolbar-toggle {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 40px;
  padding: 8px 11px;
  list-style: none;
  cursor: pointer;
  user-select: none;
}

.share-toolbar-toggle::-webkit-details-marker {
  display: none;
}

.share-toolbar-toggle:hover {
  background: rgba(var(--blue-rgb), .08);
}

.share-toolbar-toggle:focus-visible,
.share-caption-editor:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: -2px;
}

.share-toolbar-toggle-icon,
.share-toolbar-chevron {
  display: block;
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  color: var(--good);
  background: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/share-2.svg") center / contain no-repeat;
  filter: var(--external-svg-filter-good);
}

.share-toolbar-toggle-copy {
  display: flex;
  align-items: baseline;
  gap: 7px;
  min-width: 0;
}

.share-toolbar-toggle-copy strong {
  font: 760 11px/1 var(--mono);
  white-space: nowrap;
}

.share-toolbar-toggle-copy small {
  color: var(--muted);
  font: 650 9px/1 var(--mono);
  white-space: nowrap;
}

.share-toolbar-chevron {
  width: 13px;
  height: 13px;
  margin-left: 2px;
  color: var(--muted);
  background-image: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/chevron-down.svg");
  filter: var(--external-svg-filter);
  transition: transform .2s ease;
}

.share-toolbar[open] .share-toolbar-toggle {
  border-bottom: 1px solid var(--line);
}

.share-toolbar[open] .share-toolbar-chevron {
  transform: rotate(180deg);
}

.share-toolbar-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px 18px;
  padding: 14px;
  background: linear-gradient(135deg, rgba(var(--blue-rgb), .045), transparent 52%);
}

.share-caption-block,
.share-caption-label {
  display: grid;
  min-width: 0;
}

.share-caption-block {
  gap: 7px;
}

.share-caption-label {
  gap: 2px;
}

.share-caption-label strong {
  font-size: 13px;
  letter-spacing: -.01em;
}

.share-caption-label span,
.share-tool-status {
  color: var(--muted);
  font-size: 10px;
  line-height: 1.4;
}

.share-caption-editor {
  width: 100%;
  min-height: 150px;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  color: var(--text);
  background: rgba(var(--surface-rgb), .055);
  font: 500 12px/1.5 var(--sans);
  resize: vertical;
}

.share-caption-editor:hover {
  border-color: rgba(var(--blue-rgb), .55);
}

.share-tool-actions {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 7px;
  min-width: 0;
}

.share-tool-button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--text);
  background: rgba(var(--surface-rgb), .045);
  font: 700 10px/1 var(--mono);
  white-space: nowrap;
  cursor: pointer;
}

.share-tool-button > span {
  display: inline-grid;
  place-items: center;
  min-width: 18px;
  height: 18px;
  padding: 0 3px;
  border: 1px solid var(--blue);
  border-radius: 6px;
  color: var(--blue);
  font-size: 10px;
  font-weight: 850;
  line-height: 1;
}

.share-tool-button > span:empty {
  width: 16px;
  min-width: 16px;
  height: 16px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: var(--share-action-icon) center / contain no-repeat;
  filter: var(--external-svg-filter);
}

.share-tool-button > b {
  color: inherit;
  font: inherit;
}

.share-tool-button:hover {
  border-color: var(--blue);
  background: rgba(var(--blue-rgb), .12);
}

.share-tool-button:disabled {
  cursor: wait;
  opacity: .62;
}

.share-tool-copy {
  --share-action-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/copy.svg");
  border-color: var(--good);
  color: var(--good);
  background: rgba(var(--good-rgb), .08);
}

.share-tool-native {
  --share-action-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/share-2.svg");
}

.share-tool-image-share,
.share-tool-image-download {
  --share-action-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/image-up.svg");
  border-color: var(--good);
}

.share-tool-image-share {
  color: var(--good);
  background: rgba(var(--good-rgb), .08);
}

.share-tool-image-download {
  --share-action-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/download.svg");
}

.share-tool-status {
  grid-column: 1 / -1;
  min-height: 14px;
  margin: -4px 0 0;
  padding-top: 3px;
}

.share-tool-status:empty {
  display: none;
}

@media (max-width: 520px) {
  .share-toolbar {
    margin-top: 12px;
  }

  .share-toolbar[open] {
    border-radius: 15px;
  }

  .share-toolbar-toggle-copy small {
    display: none;
  }

  .share-toolbar-panel {
    padding: 12px;
  }

  .share-caption-editor {
    min-height: 174px;
  }

  .share-tool-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .share-tool-button {
    justify-content: flex-start;
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .share-tool-button,
  .share-toolbar,
  .share-toolbar-chevron {
    transition: none;
  }
}

.analytics-consent {
  position: fixed;
  right: 20px;
  bottom: 20px;
  left: 20px;
  z-index: 90;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, .48fr);
  gap: 22px;
  align-items: end;
  width: min(920px, calc(100vw - 40px));
  max-height: calc(100vh - 40px);
  margin: 0 auto;
  padding: 20px;
  overflow: auto;
  border: 1px solid rgba(var(--blue-rgb), .42);
  border-radius: 18px;
  color: var(--text);
  background: rgba(var(--solid-panel-rgb), .98);
  box-shadow: 0 20px 70px rgba(0, 0, 0, .5);
}

.analytics-consent[hidden] {
  display: none;
}

.analytics-consent-copy {
  min-width: 0;
}

.analytics-consent-eyebrow {
  display: block;
  margin-bottom: 5px;
  color: var(--blue);
  font: 750 9px/1.2 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}

.analytics-consent h2 {
  margin: 0;
  font-size: 22px;
  letter-spacing: -.035em;
}

.analytics-consent-copy > p {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.55;
}

.analytics-consent code {
  color: var(--lead);
  font-size: .92em;
}

.analytics-consent-details {
  margin-top: 10px;
}

.analytics-consent-details > summary {
  width: fit-content;
  color: var(--blue);
  font-size: 11px;
  font-weight: 760;
  cursor: pointer;
}

.analytics-consent-details > div {
  margin-top: 9px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(var(--surface-rgb), .035);
}

.analytics-consent-details ul {
  display: grid;
  gap: 6px;
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.5;
}

.analytics-consent-details strong {
  color: var(--text);
}

.analytics-consent-sources {
  display: grid;
  gap: 5px;
  margin-top: 9px;
}

.analytics-consent-details a {
  width: fit-content;
  color: var(--blue);
  font-size: 10px;
  font-weight: 750;
  text-decoration: none;
}

.analytics-consent-details a:hover {
  text-decoration: underline;
}

.analytics-consent-current {
  color: var(--good) !important;
  font-family: var(--mono);
  font-size: 10px !important;
  font-weight: 750;
}

.analytics-consent-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.analytics-consent-actions .btn {
  min-height: 46px;
  padding: 11px 13px;
  border-color: rgba(var(--blue-rgb), .4);
  border-radius: 11px;
  box-shadow: none;
  font-size: 12px;
  text-align: center;
  cursor: pointer;
}

.analytics-consent-actions .btn:hover {
  border-color: var(--blue);
  background: rgba(var(--blue-rgb), .1);
}

.analytics-consent-actions .btn[aria-pressed="true"] {
  border-color: var(--good);
  background: rgba(var(--good-rgb), .1);
}

.analytics-consent-close {
  grid-column: 1 / -1;
  justify-self: center;
  padding: 5px 8px;
  border: 0;
  color: var(--muted);
  background: transparent;
  font: 700 10px var(--mono);
  text-decoration: underline;
  cursor: pointer;
}

.analytics-consent-close:hover {
  color: var(--text);
}

.analytics-footer-control {
  grid-column: 1 / -1;
  margin: 12px 0 0 !important;
}

.analytics-settings-button {
  padding: 3px 0;
  border: 0;
  color: var(--blue);
  background: transparent;
  font: 700 11px var(--mono);
  text-decoration: underline;
  cursor: pointer;
}

.analytics-settings-button:hover {
  color: var(--text);
}

.analytics-consent-live {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.analytics-consent-open .install-banner {
  display: none !important;
}

@media (max-width: 820px) {
  .analytics-consent {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .analytics-consent-actions {
    width: min(100%, 430px);
  }
}

@media (max-width: 520px) {
  .analytics-consent {
    right: 12px;
    bottom: 12px;
    left: 12px;
    width: auto;
    max-height: calc(100vh - 24px);
    max-height: calc(100dvh - 24px);
    padding: 16px;
    border-radius: 15px;
  }

  .analytics-consent h2 {
    font-size: 20px;
  }

  .analytics-consent-actions {
    grid-template-columns: 1fr;
    width: 100%;
  }

  .analytics-consent-close {
    grid-column: 1;
  }
}

@media print {
  .analytics-consent,
  .analytics-footer-control {
    display: none !important;
  }
}

/* EU AI Act guide foundations */
.act-hero-note {
  max-width: 850px;
  margin: 22px 0 0;
  padding: 14px 16px;
  border-left: 3px solid var(--warn);
  color: var(--muted);
  background: rgba(var(--warn-rgb), .07);
  font-size: 12px;
  line-height: 1.55;
}

.act-verdict-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.act-verdict-card {
  display: flex;
  min-height: 205px;
  flex-direction: column;
  gap: 10px;
  padding: 20px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .035);
}

.act-verdict-card h3,
.act-verdict-card p {
  margin: 0;
}

.act-verdict-card h3 {
  font-size: 17px;
  line-height: 1.2;
}

.act-verdict-card p {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.55;
}

.act-verdict-card .status-chip {
  width: fit-content;
  margin-top: auto;
}

.status-chip.label,
.status-chip.disclose {
  color: var(--warn);
  border-color: rgba(var(--warn-rgb), .34);
  background: rgba(var(--warn-rgb), .08);
}

.status-chip.review {
  color: var(--blue);
  border-color: rgba(var(--blue-rgb), .34);
  background: rgba(var(--blue-rgb), .08);
}

.act-checker-shell {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(var(--surface-rgb), .025);
  box-shadow: var(--section-shadow);
  overflow: hidden;
}

.act-checker-form {
  min-width: 0;
  padding: 24px;
  border-right: 1px solid var(--line);
}

.act-checker-form fieldset {
  min-width: 0;
  margin: 0;
  padding: 20px 0;
  border: 0;
  border-bottom: 1px solid var(--line);
}

.act-checker-form fieldset:first-child {
  padding-top: 0;
}

.act-checker-form legend {
  width: 100%;
  padding: 0;
  color: var(--text);
  font-size: 15px;
  font-weight: 820;
  line-height: 1.35;
}

.act-question-number {
  display: inline-grid;
  width: 26px;
  height: 26px;
  margin-right: 8px;
  place-items: center;
  border: 1px solid rgba(var(--good-rgb), .42);
  border-radius: 50%;
  color: var(--good);
  font: 800 10px var(--mono);
}

.act-question-help {
  display: block;
  margin: 8px 0 12px 35px;
  color: var(--dim);
  font-size: 11px;
  line-height: 1.5;
}

.act-choice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.act-choice-grid label {
  position: relative;
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 9px;
  align-items: start;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  color: var(--muted);
  background: rgba(var(--surface-rgb), .025);
  font-size: 12px;
  line-height: 1.4;
  cursor: pointer;
}

.act-choice-grid label:hover,
.act-choice-grid label:focus-within {
  border-color: rgba(var(--blue-rgb), .5);
  background: rgba(var(--blue-rgb), .06);
}

.act-choice-grid input {
  width: 17px;
  height: 17px;
  margin: 0;
  accent-color: var(--good);
}

.act-checker-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding-top: 20px;
}

.act-checker-actions .btn {
  font: inherit;
  cursor: pointer;
}

.act-checker-result {
  align-self: start;
  min-width: 0;
  padding: 26px;
  border-top: 4px solid var(--blue);
  background:
    radial-gradient(circle at 80% 8%, rgba(var(--blue-rgb), .13), transparent 20rem),
    rgba(var(--surface-rgb), .035);
}

.act-checker-result[data-state="label"] {
  border-top-color: var(--warn);
}

.act-checker-result[data-state="disclose"] {
  border-top-color: var(--blue);
}

.act-checker-result[data-state="clear"] {
  border-top-color: var(--good);
}

.act-checker-result[data-state="classify"] {
  border-top-color: var(--bad);
}

.act-result-status {
  display: inline-flex;
  margin: 0 0 14px;
  padding: 5px 8px;
  border: 1px solid currentColor;
  border-radius: 999px;
  color: var(--blue);
  font: 800 9px/1 var(--mono);
  letter-spacing: .05em;
  text-transform: uppercase;
}

.act-checker-result[data-state="label"] .act-result-status { color: var(--warn); }
.act-checker-result[data-state="clear"] .act-result-status { color: var(--good); }
.act-checker-result[data-state="classify"] .act-result-status { color: var(--bad); }

.act-checker-result h3 {
  margin: 0;
  font-size: clamp(26px, 3vw, 36px);
  letter-spacing: -.04em;
}

.act-result-summary {
  margin: 12px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.6;
}

.act-result-actions {
  display: grid;
  gap: 9px;
  margin: 20px 0 0;
  padding: 0;
  list-style: none;
}

.act-result-actions li {
  position: relative;
  padding: 11px 12px 11px 34px;
  border: 1px solid var(--line);
  border-radius: 11px;
  color: var(--text);
  background: rgba(var(--surface-rgb), .035);
  font-size: 12px;
  line-height: 1.5;
}

.act-result-actions li::before {
  content: "→";
  position: absolute;
  top: 11px;
  left: 12px;
  color: var(--good);
  font-family: var(--mono);
}

.act-result-evidence {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}

.act-result-evidence strong {
  display: block;
  color: var(--dim);
  font: 750 9px/1.3 var(--mono);
  letter-spacing: .05em;
  text-transform: uppercase;
}

.act-result-evidence p {
  margin: 7px 0 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.5;
}

.act-rule-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.act-rule-card {
  min-width: 0;
  padding: 24px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .03);
}

.act-rule-card:last-child:nth-child(odd) {
  grid-column: 1 / -1;
}

.act-rule-card h3 {
  margin: 10px 0 8px;
  font-size: 21px;
}

.act-rule-card > p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.55;
}

.act-rule-list {
  display: grid;
  gap: 0;
  margin: 18px 0 0;
}

.act-rule-list div {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 12px;
  padding: 10px 0;
  border-top: 1px solid var(--line);
}

.act-rule-list dt {
  color: var(--dim);
  font: 750 9px/1.4 var(--mono);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.act-rule-list dd {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.act-rule-list dd strong {
  color: var(--text);
}

.act-timeline,
.act-boundary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.act-timeline article,
.act-boundary-grid article {
  min-width: 0;
  padding: 22px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .03);
}

.act-timeline time,
.act-boundary-grid .tag {
  color: var(--good);
  font: 800 10px/1.3 var(--mono);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.act-timeline h3,
.act-boundary-grid h3 {
  margin: 10px 0 8px;
  font-size: 19px;
}

.act-timeline p,
.act-boundary-grid p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.55;
}

.act-copy-sample {
  display: inline-block;
  padding: 5px 8px;
  border: 1px solid rgba(var(--blue-rgb), .35);
  border-radius: 7px;
  color: var(--text);
  background: rgba(var(--blue-rgb), .07);
  font-size: 12px;
  font-weight: 720;
}

.act-source-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.act-source-list a {
  display: block;
  min-width: 0;
  padding: 15px;
  border: 1px solid var(--line);
  border-radius: 13px;
  color: var(--blue);
  background: rgba(var(--surface-rgb), .03);
  font-size: 12px;
  font-weight: 760;
  line-height: 1.45;
  text-decoration: none;
}

.act-source-list a:hover,
.act-source-list a:focus-visible {
  border-color: rgba(var(--blue-rgb), .55);
  background: rgba(var(--blue-rgb), .07);
}

@media (max-width: 900px) {
  .act-verdict-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .act-verdict-card {
    min-height: 180px;
  }

  .act-checker-shell {
    grid-template-columns: 1fr;
  }

  .act-checker-form {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .act-rule-grid {
    grid-template-columns: 1fr;
  }

  .act-rule-card:last-child:nth-child(odd),
  .act-rule-card {
    grid-column: auto;
  }
}

@media (max-width: 700px) {
  .act-choice-grid,
  .act-source-list,
  .act-timeline,
  .act-boundary-grid {
    grid-template-columns: 1fr;
  }

  .act-checker-form,
  .act-checker-result,
  .act-rule-card {
    padding: 18px;
  }

  .act-rule-list div {
    grid-template-columns: 78px minmax(0, 1fr);
  }
}

@media (max-width: 520px) {
  .act-verdict-grid {
    grid-template-columns: 1fr;
  }

  .act-verdict-card {
    min-height: 0;
  }

  .act-question-help {
    margin-left: 0;
  }
}

@media (forced-colors: active) {
  .act-checker-result {
    border-color: CanvasText;
  }
}

/* EU AI Act full-guide expansion and Act-wide pathfinder */
.eu-ai-act-page .sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.act-anchor-alias {
  display: block;
  height: 0;
  scroll-margin-top: 120px;
}

.eu-ai-act-page section[id],
.eu-ai-act-page [data-page-menu-item],
.eu-ai-act-page [data-ai-act-route-card] {
  scroll-margin-top: 110px;
}

.status-chip.label,
.status-chip.disclose {
  color: var(--warn);
  border-color: rgba(var(--warn-rgb), .36);
  background: rgba(var(--warn-rgb), .09);
}

.status-chip.review {
  color: var(--blue);
  border-color: rgba(var(--blue-rgb), .36);
  background: rgba(var(--blue-rgb), .09);
}

.status-chip.blocked {
  color: var(--bad);
  border-color: rgba(var(--bad-rgb), .38);
  background: rgba(var(--bad-rgb), .09);
}

.act-route-kicker {
  display: block;
  color: var(--good);
  font: 800 10px/1.35 var(--mono);
  letter-spacing: .05em;
  text-transform: uppercase;
}

.act-situation-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.act-situation-card {
  display: flex;
  min-width: 0;
  min-height: 230px;
  flex-direction: column;
  gap: 10px;
  padding: 21px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .035);
}

.act-situation-card h3,
.act-situation-card p {
  margin: 0;
}

.act-situation-card h3 {
  font-size: 18px;
  line-height: 1.2;
}

.act-situation-card p {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.58;
}

.act-situation-card .status-chip {
  margin-top: auto;
}

.act-pathfinder-shell {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 94% 4%, rgba(var(--blue-rgb), .12), transparent 24rem),
    rgba(var(--surface-rgb), .03);
  box-shadow: var(--section-shadow);
  overflow: hidden;
}

.act-pathfinder-form {
  grid-column: 1 / -1;
  min-width: 0;
  padding: 26px;
}

.act-pathfinder-shell.has-result .act-pathfinder-form {
  display: none;
}

.act-pathfinder-intro {
  max-width: 760px;
  margin-bottom: 18px;
}

.act-pathfinder-intro h3,
.act-pathfinder-intro p {
  margin: 0;
}

.act-pathfinder-intro h3 {
  margin-top: 6px;
  font-size: clamp(25px, 3vw, 34px);
  letter-spacing: -.035em;
}

.act-pathfinder-intro p:last-child {
  margin-top: 8px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.55;
}

.act-pathfinder-form fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.eu-ai-act-page .act-choice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.eu-ai-act-page .act-situation-choice {
  position: relative;
  display: grid;
  min-width: 0;
  min-height: 92px;
  grid-template-columns: 21px minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  padding: 15px;
  border: 1px solid var(--line);
  border-radius: 13px;
  color: var(--muted);
  background: rgba(var(--surface-rgb), .035);
  cursor: pointer;
  transition: border-color .16s ease, background-color .16s ease, transform .16s ease;
}

.eu-ai-act-page .act-situation-choice:hover,
.eu-ai-act-page .act-situation-choice:focus-within {
  border-color: rgba(var(--blue-rgb), .56);
  background: rgba(var(--blue-rgb), .07);
}

.eu-ai-act-page .act-situation-choice.is-selected,
.eu-ai-act-page .act-situation-choice:has(input:checked) {
  border-color: rgba(var(--good-rgb), .72);
  color: var(--text);
  background: rgba(var(--good-rgb), .09);
  box-shadow: inset 0 0 0 1px rgba(var(--good-rgb), .16);
}

.eu-ai-act-page .act-situation-choice.is-selected::after,
.eu-ai-act-page .act-situation-choice:has(input:checked)::after {
  content: "Selected ✓";
  position: absolute;
  right: 11px;
  bottom: 9px;
  color: var(--good);
  font: 800 9px/1 var(--mono);
  letter-spacing: .03em;
  text-transform: uppercase;
}

.eu-ai-act-page .act-situation-choice input {
  width: 20px;
  height: 20px;
  margin: 1px 0 0;
  accent-color: var(--good);
}

.act-situation-choice span,
.act-situation-choice strong,
.act-situation-choice small {
  display: block;
  min-width: 0;
}

.act-situation-choice strong {
  padding-right: 58px;
  color: var(--text);
  font-size: 14px;
  line-height: 1.35;
}

.act-situation-choice small {
  margin-top: 6px;
  color: var(--dim);
  font-size: 12px;
  line-height: 1.45;
}

.act-pathfinder-error {
  margin: 16px 0 0;
  padding: 11px 13px;
  border-left: 3px solid var(--bad);
  color: var(--text);
  background: rgba(var(--bad-rgb), .08);
  font-size: 13px;
  line-height: 1.45;
}

.eu-ai-act-page .act-checker-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding-top: 20px;
}

.eu-ai-act-page .act-checker-actions .btn {
  min-height: 44px;
  font: inherit;
  cursor: pointer;
}

.eu-ai-act-page .act-checker-result {
  grid-column: 1 / -1;
  align-self: stretch;
  min-width: 0;
  padding: 28px;
  border: 0;
  border-top: 4px solid var(--blue);
  background: rgba(var(--surface-rgb), .045);
  scroll-margin-top: 120px;
}

.eu-ai-act-page .act-checker-result[hidden] {
  display: none;
}

.eu-ai-act-page .act-checker-result h3 {
  margin: 0;
  font-size: clamp(27px, 3vw, 36px);
  letter-spacing: -.04em;
}

.act-result-status {
  display: inline-flex;
  margin: 0 0 14px;
  padding: 6px 9px;
  border: 1px solid rgba(var(--blue-rgb), .46);
  border-radius: 999px;
  color: var(--blue);
  background: rgba(var(--blue-rgb), .08);
  font: 800 10px/1 var(--mono);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.act-result-summary,
.act-result-caveat {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.58;
}

.act-result-summary {
  margin: 12px 0 0;
}

.act-result-routes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 20px 0 0;
  padding: 0;
  list-style: none;
}

.act-result-routes a {
  display: block;
  min-height: 100%;
  padding: 12px 13px;
  border: 1px solid var(--line);
  border-radius: 11px;
  color: var(--text);
  background: rgba(var(--surface-rgb), .04);
  text-decoration: none;
}

.act-result-routes a:hover,
.act-result-routes a:focus-visible {
  border-color: rgba(var(--blue-rgb), .58);
  background: rgba(var(--blue-rgb), .08);
}

.act-result-routes strong,
.act-result-routes small {
  display: block;
}

.act-result-routes strong {
  color: var(--blue);
  font-size: 14px;
}

.act-result-routes small {
  margin-top: 5px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.act-result-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

.act-result-actions .btn {
  min-height: 44px;
  font: inherit;
  cursor: pointer;
}

.act-result-caveat {
  margin: 18px 0 0;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}

.act-definition {
  margin-bottom: 18px;
}

.act-actor-grid,
.act-general-grid,
.act-rights-grid,
.act-governance-grid,
.act-gpai-grid,
.act-classification-grid,
.act-penalty-grid {
  display: grid;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.act-actor-grid,
.act-general-grid,
.act-rights-grid,
.act-gpai-grid,
.act-classification-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.act-governance-grid,
.act-penalty-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 18px;
}

.act-actor-grid article,
.act-general-grid article,
.act-rights-grid article,
.act-governance-grid article,
.act-gpai-grid article,
.act-classification-grid article,
.act-penalty-grid article {
  min-width: 0;
  padding: 22px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .03);
}

.act-actor-grid h3,
.act-general-grid h3,
.act-rights-grid h3,
.act-governance-grid h3,
.act-gpai-grid h3,
.act-classification-grid h3,
.act-penalty-grid h3 {
  margin: 10px 0 8px;
  font-size: 19px;
}

.act-actor-grid p,
.act-general-grid p,
.act-rights-grid p,
.act-governance-grid p,
.act-gpai-grid p,
.act-classification-grid p,
.act-penalty-grid p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.57;
}

.act-actor-grid .card-icon {
  margin-bottom: 12px;
}

.act-compact-list {
  display: grid;
  gap: 7px;
  margin: 14px 0 0;
  padding-left: 18px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}

.act-risk-map {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.act-risk-map a {
  display: block;
  min-width: 0;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 14px;
  color: var(--text);
  background: rgba(var(--surface-rgb), .035);
  text-decoration: none;
}

.act-risk-map a:last-child {
  grid-column: 1 / -1;
}

.act-risk-map a:hover,
.act-risk-map a:focus-visible {
  border-color: rgba(var(--blue-rgb), .58);
  background: rgba(var(--blue-rgb), .07);
}

.act-risk-map span,
.act-risk-map strong,
.act-risk-map small {
  display: block;
}

.act-risk-map span {
  color: var(--good);
  font: 800 10px/1.3 var(--mono);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.act-risk-map strong {
  margin-top: 8px;
  font-size: 21px;
}

.act-risk-map small {
  margin-top: 7px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}

.act-prohibition-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
  list-style: none;
  counter-reset: act-ban;
}

.act-prohibition-list li {
  position: relative;
  min-width: 0;
  padding: 21px 21px 21px 62px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .03);
  counter-increment: act-ban;
}

.act-prohibition-list li::before {
  content: counter(act-ban, decimal-leading-zero);
  position: absolute;
  top: 22px;
  left: 20px;
  color: var(--bad);
  font: 800 11px/1 var(--mono);
}

.act-prohibition-list strong {
  display: block;
  font-size: 16px;
  line-height: 1.35;
}

.act-prohibition-list p {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.56;
}

.act-upcoming-bans,
.act-duty-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 18px;
}

.act-upcoming-bans article,
.act-duty-columns article {
  min-width: 0;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(var(--surface-rgb), .035);
}

.act-upcoming-bans h3,
.act-duty-columns h3 {
  margin: 12px 0 8px;
  font-size: 20px;
}

.act-upcoming-bans p,
.act-duty-columns p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.57;
}

.act-area-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 18px;
}

.act-area-grid span {
  display: grid;
  min-height: 50px;
  place-items: center;
  padding: 10px;
  border: 1px solid rgba(var(--blue-rgb), .3);
  border-radius: 10px;
  color: var(--text);
  background: rgba(var(--blue-rgb), .06);
  font-size: 12px;
  font-weight: 740;
  text-align: center;
}

.eu-ai-act-page .act-rule-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.eu-ai-act-page .act-rule-card {
  min-width: 0;
  padding: 23px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .03);
}

.eu-ai-act-page .act-rule-card:last-child:nth-child(odd) {
  grid-column: 1 / -1;
}

.eu-ai-act-page .act-rule-card h3 {
  margin: 10px 0 8px;
  font-size: 21px;
}

.eu-ai-act-page .act-rule-card > p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.58;
}

.eu-ai-act-page .act-rule-list {
  display: grid;
  margin: 16px 0 0;
}

.eu-ai-act-page .act-rule-list div {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  gap: 12px;
  padding: 10px 0;
  border-top: 1px solid var(--line);
}

.eu-ai-act-page .act-rule-list dt {
  color: var(--dim);
  font: 800 9px/1.4 var(--mono);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.eu-ai-act-page .act-rule-list dd {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.act-subsection {
  padding-top: 58px;
  scroll-margin-top: 110px;
}

.act-subsection .section-head h3 {
  margin: 8px 0 0;
  font-size: clamp(25px, 3vw, 34px);
  letter-spacing: -.035em;
}

.act-label-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.act-label-grid article {
  min-width: 0;
  padding: 18px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .03);
}

.act-label-grid article > span {
  color: var(--dim);
  font: 800 9px/1.3 var(--mono);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.eu-ai-act-page .act-copy-sample {
  display: block;
  margin: 10px 0 0;
  padding: 9px 10px;
  border: 1px solid rgba(var(--blue-rgb), .35);
  border-radius: 8px;
  color: var(--text);
  background: rgba(var(--blue-rgb), .07);
  font-size: 12px;
  font-weight: 720;
  line-height: 1.45;
}

.eu-ai-act-page .act-boundary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 18px;
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.eu-ai-act-page .act-boundary-grid article {
  min-width: 0;
  padding: 22px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .03);
}

.eu-ai-act-page .act-boundary-grid h3 {
  margin: 10px 0 8px;
  font-size: 19px;
}

.eu-ai-act-page .act-boundary-grid p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.57;
}

.act-current-position {
  display: flex;
  gap: 14px;
  align-items: center;
  margin-bottom: 18px;
  padding: 16px;
  border: 1px solid rgba(var(--good-rgb), .3);
  border-radius: 13px;
  background: rgba(var(--good-rgb), .06);
}

.act-current-position p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}

.eu-ai-act-page .act-timeline {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.eu-ai-act-page .act-timeline article {
  min-width: 0;
  padding: 21px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgba(var(--surface-rgb), .03);
}

.eu-ai-act-page .act-timeline article:last-child {
  grid-column: 1 / -1;
}

.eu-ai-act-page .act-timeline article:last-child p {
  max-width: 760px;
}

.eu-ai-act-page .act-timeline time {
  color: var(--good);
  font: 800 10px/1.3 var(--mono);
  letter-spacing: .04em;
  text-transform: uppercase;
}

.eu-ai-act-page .act-timeline h3 {
  margin: 10px 0 8px;
  font-size: 18px;
}

.eu-ai-act-page .act-timeline p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.55;
}

.eu-ai-act-page .act-source-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.eu-ai-act-page .act-source-list a {
  display: block;
  min-width: 0;
  padding: 15px;
  border: 1px solid var(--line);
  border-radius: 13px;
  color: var(--blue);
  background: rgba(var(--surface-rgb), .03);
  font-size: 12px;
  font-weight: 760;
  line-height: 1.45;
  text-decoration: none;
}

.eu-ai-act-page .act-source-list a:hover,
.eu-ai-act-page .act-source-list a:focus-visible {
  border-color: rgba(var(--blue-rgb), .55);
  background: rgba(var(--blue-rgb), .07);
}

@media (max-width: 1100px) {
  .act-situation-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .act-governance-grid,
  .act-penalty-grid,
  .act-label-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .act-situation-grid,
  .act-actor-grid,
  .act-general-grid,
  .act-rights-grid,
  .act-gpai-grid,
  .act-classification-grid,
  .eu-ai-act-page .act-timeline {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .act-situation-card {
    min-height: 210px;
  }

  .act-pathfinder-shell,
  .act-pathfinder-shell.has-result {
    grid-template-columns: 1fr;
  }

  .act-pathfinder-shell.has-result .act-pathfinder-form {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .act-area-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .act-result-routes {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .eu-ai-act-page .act-rule-grid {
    grid-template-columns: 1fr;
  }

  .eu-ai-act-page .act-rule-card:last-child:nth-child(odd),
  .eu-ai-act-page .act-rule-card {
    grid-column: auto;
  }

  .eu-ai-act-page .act-timeline article:last-child {
    grid-column: auto;
  }
}

@media (max-width: 700px) {
  .act-situation-grid,
  .eu-ai-act-page .act-choice-grid,
  .act-actor-grid,
  .act-general-grid,
  .act-rights-grid,
  .act-governance-grid,
  .act-gpai-grid,
  .act-classification-grid,
  .act-penalty-grid,
  .act-risk-map,
  .act-prohibition-list,
  .act-upcoming-bans,
  .act-duty-columns,
  .act-label-grid,
  .eu-ai-act-page .act-boundary-grid,
  .eu-ai-act-page .act-timeline,
  .eu-ai-act-page .act-source-list {
    grid-template-columns: 1fr;
  }

  .act-risk-map a:last-child {
    grid-column: auto;
  }

  .act-situation-card {
    min-height: 0;
  }

  .act-pathfinder-form,
  .eu-ai-act-page .act-checker-result,
  .eu-ai-act-page .act-rule-card {
    padding: 19px;
  }

  .eu-ai-act-page .act-situation-choice {
    min-height: 64px;
    align-items: center;
    padding: 12px 14px;
  }

  .act-situation-choice strong {
    padding-right: 0;
  }

  .act-situation-choice small,
  .eu-ai-act-page .act-situation-choice.is-selected::after,
  .eu-ai-act-page .act-situation-choice:has(input:checked)::after {
    display: none;
  }

  .act-current-position {
    align-items: flex-start;
    flex-direction: column;
  }

  .act-area-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .act-result-routes {
    grid-template-columns: 1fr;
  }

  .act-result-routes a {
    display: flex;
    min-height: 44px;
    align-items: center;
  }

  .act-result-routes small {
    display: none;
  }

  .act-subsection {
    padding-top: 42px;
  }

  .eu-ai-act-page .act-checker-actions {
    padding-bottom: 42px;
  }
}

@media (max-width: 470px) {
  .act-area-grid {
    grid-template-columns: 1fr;
  }

  .eu-ai-act-page .act-situation-choice {
    min-height: 64px;
  }

  .eu-ai-act-page .act-rule-list div {
    grid-template-columns: 68px minmax(0, 1fr);
  }
}

@media (prefers-reduced-motion: reduce) {
  .eu-ai-act-page .act-situation-choice {
    transition: none;
  }
}

@media (forced-colors: active) {
  .eu-ai-act-page .act-situation-choice.is-selected,
  .eu-ai-act-page .act-situation-choice:has(input:checked),
  .eu-ai-act-page .act-checker-result,
  .act-pathfinder-error {
    border-color: CanvasText;
  }
}

/* EU AI Act visual QA: media, notices, labels and resilient component rhythm */
[data-icon="package-search"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/package-search.svg"); }
[data-icon="user-round"] { --semantic-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/user-round.svg"); }

.act-hero {
  max-width: var(--max);
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr);
  gap: 38px;
  align-items: center;
}

.act-hero > section {
  min-width: 0;
}

.act-hero h1 {
  max-width: 11.5ch;
  font-size: clamp(50px, 5.5vw, 78px);
}

.act-hero-media {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(var(--surface-rgb), .035);
  box-shadow: var(--card-shadow);
}

.act-hero-media .video-frame {
  border-bottom: 1px solid var(--line);
}

.act-video-poster {
  isolation: isolate;
  text-decoration: none;
  background:
    radial-gradient(circle at 78% 22%, rgba(255, 213, 0, .22), transparent 24%),
    linear-gradient(140deg, #082b65 0%, #064fb1 58%, #0875c9 100%);
}

.act-video-poster::before {
  content: "";
  position: absolute;
  inset: 17% 12% 25%;
  z-index: 0;
  background: url("../images/eu-ai-label-basic.svg") center / contain no-repeat;
  filter: drop-shadow(0 12px 28px rgba(0, 0, 0, .24));
  transition: transform .25s ease;
}

.act-video-poster::after {
  content: "EU AI ACT · ARTICLE 50";
  position: absolute;
  top: 17px;
  left: 18px;
  z-index: 1;
  color: #fff;
  font: 800 10px/1.3 var(--mono);
  letter-spacing: .08em;
}

.act-video-poster span {
  z-index: 2;
}

.act-video-poster:hover::before,
.act-video-poster:focus-visible::before {
  transform: scale(1.035);
}

.act-hero-media-copy {
  display: grid;
  gap: 5px;
  padding: 16px 18px 18px;
}

.act-hero-media-copy span,
.act-hero-media-copy strong,
.act-hero-media-copy small {
  display: block;
}

.act-hero-media-copy span {
  color: var(--good);
  font: 800 9px/1.35 var(--mono);
  letter-spacing: .05em;
  text-transform: uppercase;
}

.act-hero-media-copy strong {
  color: var(--text);
  font-size: 18px;
  line-height: 1.3;
}

.act-hero-media-copy small {
  color: var(--dim);
  font-size: 11px;
}

.act-pathfinder-form[hidden],
.act-pathfinder-fallback[hidden] {
  display: none;
}

.act-pathfinder-fallback {
  grid-column: 1 / -1;
  max-width: none;
  margin: 0;
  padding: 24px 26px;
  border-left: 0;
}

.eu-ai-act-page .status-chip {
  gap: 6px;
}

.eu-ai-act-page .status-chip::before {
  content: "";
  display: block;
  flex: 0 0 auto;
  width: 11px;
  height: 11px;
  background: var(--act-status-icon) center / contain no-repeat;
  filter: var(--external-svg-filter);
}

.eu-ai-act-page .status-chip.label,
.eu-ai-act-page .status-chip.disclose {
  --act-status-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/tag.svg");
}

.eu-ai-act-page .status-chip.review {
  --act-status-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/search-check.svg");
}

.eu-ai-act-page .status-chip.blocked {
  --act-status-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/octagon-x.svg");
}

.eu-ai-act-page .status-chip.ready {
  --act-status-icon: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/circle-check-big.svg");
}

.act-prohibition-list li,
.act-compact-list li,
.act-result-routes li {
  margin: 0;
}

.eu-ai-act-page .callout,
.eu-ai-act-page .source-bar {
  position: relative;
  padding-left: 58px;
}

.eu-ai-act-page .callout:not(.act-definition),
.eu-ai-act-page .source-bar {
  margin-top: 18px;
}

.eu-ai-act-page .callout::before,
.eu-ai-act-page .source-bar::before {
  content: "";
  position: absolute;
  top: 24px;
  left: 24px;
  width: 18px;
  height: 18px;
  background: currentColor;
}

.eu-ai-act-page .callout::before {
  color: var(--good);
  background: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/scale.svg") center / contain no-repeat;
  filter: var(--external-svg-filter-good);
}

.eu-ai-act-page .source-bar::before {
  color: var(--blue);
  background: url("https://cdn.jsdelivr.net/npm/lucide-static@0.468.0/icons/book-open-check.svg") center / contain no-repeat;
  filter: var(--external-svg-filter-blue);
}

.eu-ai-act-page .callout p {
  margin: 0;
  line-height: 1.6;
}

.eu-ai-act-page .act-definition {
  margin: 0 0 18px;
}

.act-official-label-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.act-official-label-grid > article {
  display: flex;
  min-width: 0;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: rgba(var(--surface-rgb), .03);
}

.act-official-label-preview {
  display: grid;
  min-height: 154px;
  place-items: center;
  padding: 24px;
  border-bottom: 1px solid rgba(255, 255, 255, .14);
  background:
    radial-gradient(circle at 50% 30%, rgba(142, 197, 255, .12), transparent 15rem),
    #080a0f;
}

.act-official-label-preview img {
  display: block;
  width: min(100%, 255px);
  height: auto;
}

.act-official-label-grid > article:first-child .act-official-label-preview img {
  width: 94px;
}

.act-official-label-copy {
  display: flex;
  min-height: 0;
  flex: 1;
  flex-direction: column;
  padding: 18px;
}

.act-official-label-copy > span {
  color: var(--good);
  font: 800 9px/1.35 var(--mono);
  letter-spacing: .05em;
  text-transform: uppercase;
}

.act-official-label-copy h4 {
  margin: 8px 0 7px;
  color: var(--text);
  font-size: 19px;
}

.act-official-label-copy p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.55;
}

.act-official-label-copy .tool-links {
  margin-top: auto;
  padding-top: 16px;
}

.act-label-resource .tool-links {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(var(--good-rgb), .22);
}

.act-register-table {
  table-layout: fixed;
}

.act-register-table th:nth-child(1) { width: 20%; }
.act-register-table th:nth-child(2) { width: 45%; }
.act-register-table th:nth-child(3) { width: 35%; }

.act-register-table th,
.act-register-table td {
  overflow-wrap: anywhere;
}

.eu-ai-act-page .table-scroll {
  overflow-x: auto;
}

@media (max-width: 900px) {
  .act-hero {
    grid-template-columns: 1fr;
    gap: 26px;
  }

  .act-hero h1 {
    max-width: 13ch;
  }

  .act-hero-media {
    width: min(100%, 760px);
  }

  .act-official-label-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .act-official-label-grid > article:last-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 700px) {
  .act-hero {
    gap: 22px;
  }

  .act-official-label-grid {
    grid-template-columns: 1fr;
  }

  .act-official-label-grid > article:last-child {
    grid-column: auto;
  }

  .act-label-resource .tool-links {
    grid-template-columns: 1fr;
  }

  .act-situation-choice small {
    display: block;
  }

  .act-result-routes a {
    display: block;
    min-height: 0;
    align-items: initial;
  }

  .act-result-routes small {
    display: block;
  }

  .eu-ai-act-page .act-checker-actions {
    padding-bottom: 0;
  }

  .eu-ai-act-page .callout,
  .eu-ai-act-page .source-bar {
    padding: 18px 18px 18px 50px;
  }

  .eu-ai-act-page .callout::before,
  .eu-ai-act-page .source-bar::before {
    top: 19px;
    left: 18px;
  }

  .eu-ai-act-page .table-scroll {
    overflow: visible;
  }
}

@media (max-width: 470px) {
  .act-register-table td {
    grid-template-columns: 88px minmax(0, 1fr);
    padding: 14px 12px;
  }
}

@media (forced-colors: active) {
  .eu-ai-act-page .status-chip::before,
  .eu-ai-act-page .callout::before,
  .eu-ai-act-page .source-bar::before {
    background: CanvasText;
  }
}
/* Keep the desktop header on one calm line until the mobile menu takes over. */
@media (min-width: 1041px) and (max-width: 1160px) {
  nav { gap: 8px; }
  .links { gap: 3px; flex-wrap: nowrap; }
  .links > a,
  .nav-more > summary,
  .links .install-app-cta { padding: 7px 6px; font-size: 11px; white-space: nowrap; }
}

/* Investors: a neutral, evidence-first public-company research map. */
.investors-page .investors-hero { align-items: center; }
.investors-page .investors-hero > section { align-self: start; }
.investors-page .investor-ledgers,
.investors-page .scenario-grid,
.investors-page .killer-grid,
.investors-page .thesis-grid { display: grid; gap: 12px; }
.investors-page .investor-ledgers { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.investors-page .investor-ledgers article,
.investors-page .scenario-grid article,
.investors-page .killer-grid article,
.investors-page .method-grid > article,
.investors-page .portfolio-grid > article,
.investors-page .thesis-grid article,
.investors-page .company-card { border: 1px solid var(--line); border-radius: 16px; background: rgba(var(--surface-rgb), .035); }
.investors-page .investor-ledgers article { display: flex; min-height: 230px; flex-direction: column; padding: 20px; }
.investors-page .investor-ledgers article > span,
.investors-page .scenario-grid article > span { color: var(--good); font: 700 11px var(--mono); letter-spacing: .08em; }
.investors-page .investor-ledgers h3,
.investors-page .scenario-grid h3,
.investors-page .killer-grid h3,
.investors-page .method-grid h3,
.investors-page .portfolio-grid h3,
.investors-page .thesis-grid h3,
.investors-page .company-card h3 { color: var(--text); }
.investors-page .investor-ledgers h3 { margin: 15px 0 9px; font-size: 21px; }
.investors-page .investor-ledgers p,
.investors-page .scenario-grid p,
.investors-page .killer-grid p,
.investors-page .method-grid p,
.investors-page .portfolio-grid p { margin: 0; color: var(--muted); }
.investors-page .investor-ledgers b { margin-top: auto; padding-top: 16px; color: var(--text); font-size: 12px; }
.investors-page .research-rule,
.investors-page .directory-note { display: grid; gap: 8px; margin-top: 17px; padding: 18px 20px; border: 1px solid rgba(var(--good-rgb), .24); border-radius: 14px; background: rgba(var(--good-rgb), .055); }
.investors-page .research-rule p,
.investors-page .directory-note span { margin: 0; color: var(--muted); }
.investors-page .directory-note strong { color: var(--good); }
.investors-page .method-grid,
.investors-page .portfolio-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.investors-page .method-grid { border: 0; }
.investors-page .method-grid > article,
.investors-page .portfolio-grid > article { padding: 22px; }
.investors-page .method-grid h3,
.investors-page .portfolio-grid h3 { margin: 0 0 16px; font-size: 19px; }
.investors-page .method-grid dl,
.investors-page .thesis-grid dl { display: grid; gap: 11px; margin: 0; }
.investors-page .method-grid dl div { display: grid; grid-template-columns: 122px 1fr; gap: 12px; padding-top: 11px; border-top: 1px solid var(--line); }
.investors-page .method-grid dt,
.investors-page .thesis-grid dt { color: var(--good); font: 700 10px var(--mono); letter-spacing: .06em; text-transform: uppercase; }
.investors-page .method-grid dd,
.investors-page .thesis-grid dd { margin: 0; color: var(--muted); font-size: 13px; }
.investors-page .research-scorecard { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; counter-reset: score; }
.investors-page .research-scorecard li { display: flex; gap: 8px; align-items: start; padding: 9px; border: 1px solid rgba(var(--surface-rgb), .12); border-radius: 10px; color: var(--muted); font-size: 12px; }
.investors-page .research-scorecard li::before { counter-increment: score; content: counter(score, decimal-leading-zero); color: var(--good); font: 700 10px var(--mono); }

.investors-page .value-board { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; counter-reset: gates; }
.investors-page .gate { position: relative; display: grid; grid-template-columns: 40px 1fr; gap: 12px; min-height: 164px; padding: 18px; border: 1px solid rgba(var(--surface-rgb), .17); border-radius: 20px; background: linear-gradient(135deg, rgba(var(--good-rgb), .12), rgba(var(--blue-rgb), .045)); box-shadow: var(--card-shadow); }
.investors-page .gate::after { content: ""; position: absolute; top: 50%; right: -14px; z-index: 1; width: 14px; height: 2px; background: linear-gradient(90deg, rgba(var(--good-rgb), .72), rgba(var(--blue-rgb), .2)); }
.investors-page .gate:nth-child(4n)::after { display: none; }
.investors-page .gate:nth-child(even) { transform: translateY(26px); background: linear-gradient(135deg, rgba(var(--purple-rgb), .12), rgba(var(--blue-rgb), .045)); }
.investors-page .gate-number { display: grid; width: 40px; height: 40px; place-items: center; border: 1px solid rgba(var(--good-rgb), .55); border-radius: 50%; color: var(--good); font: 800 11px var(--mono); background: rgba(var(--solid-panel-rgb), .52); }
.investors-page .gate h3 { margin: 3px 0 8px; color: var(--text); font-size: 16px; line-height: 1.15; }
.investors-page .gate p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.investors-page .gate-prompt { grid-column: 1 / -1; align-self: end; color: var(--text); font: 700 10px/1.35 var(--mono); }

.investors-page .directory-controls { display: grid; grid-template-columns: minmax(260px, 1.3fr) minmax(180px, .8fr) minmax(190px, .9fr) auto; gap: 12px; align-items: end; margin-bottom: 14px; padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: rgba(var(--surface-rgb), .035); }
.investors-page .directory-controls fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.investors-page .directory-controls legend,
.investors-page .directory-select-label,
.investors-page .directory-search-label { display: grid; gap: 7px; color: var(--text); font-size: 12px; font-weight: 760; }
.investors-page .filter-row { display: flex; flex-wrap: wrap; gap: 6px; }
.investors-page .directory-filter,
.investors-page .directory-reset,
.investors-page .directory-controls select,
.investors-page .directory-controls input { min-height: 36px; border: 1px solid var(--line); border-radius: 10px; color: var(--text); font: inherit; background: var(--control-bg); }
.investors-page .directory-filter,
.investors-page .directory-reset { padding: 7px 10px; cursor: pointer; }
.investors-page .directory-filter.is-active { border-color: rgba(var(--good-rgb), .65); color: var(--text); background: rgba(var(--good-rgb), .13); }
.investors-page .directory-controls select,
.investors-page .directory-controls input { width: 100%; padding: 7px 10px; }
.investors-page .directory-result { margin: 0 0 14px; color: var(--muted); font: 700 12px var(--mono); }
.investors-page .company-directory { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.investors-page .company-card { display: flex; min-width: 0; min-height: 230px; flex-direction: column; padding: 18px; }
.investors-page .company-card[hidden] { display: none; }
.investors-page .company-logo { display: block; width: 48px; height: 48px; margin: 0 0 12px; padding: 8px; border: 1px solid rgba(var(--text-rgb), .16); border-radius: 12px; object-fit: contain; background: #f1f3f5; filter: grayscale(1) contrast(1.08); opacity: .9; }
.investors-page .company-card h3 { margin: 0 0 8px; font-size: 18px; }
.investors-page .company-card > p { min-height: 46px; margin: 0 0 16px; color: var(--muted); font-size: 13px; }
.investors-page .company-card dl { display: grid; gap: 7px; margin: 0 0 16px; }
.investors-page .company-card dl div { display: grid; grid-template-columns: 72px 1fr; gap: 8px; }
.investors-page .company-card dt { color: var(--dim); font: 700 10px var(--mono); text-transform: uppercase; }
.investors-page .company-card dd { margin: 0; color: var(--text); font-size: 12px; }
.investors-page .company-card > a { margin-top: auto; color: var(--good); font-size: 12px; font-weight: 760; text-decoration: none; }
.investors-page .company-card > a:hover,
.investors-page .company-card > a:focus-visible { text-decoration: underline; }
.investors-page .directory-empty { margin: 18px 0 0; padding: 18px; border: 1px dashed var(--line); border-radius: 14px; color: var(--muted); text-align: center; }
.investors-page .private-watch-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.investors-page .private-watch-card { display: flex; min-width: 0; min-height: 230px; flex-direction: column; padding: 18px; border: 1px solid var(--line); border-radius: 16px; background: rgba(var(--surface-rgb), .035); }
.investors-page .private-watch-card h3 { margin: 0 0 8px; color: var(--text); font-size: 18px; }
.investors-page .private-watch-card > p { margin: 0 0 16px; color: var(--muted); font-size: 13px; font-weight: 760; }
.investors-page .private-watch-card dl { display: grid; gap: 7px; margin: 0 0 16px; }
.investors-page .private-watch-card dl div { display: grid; grid-template-columns: 92px 1fr; gap: 8px; }
.investors-page .private-watch-card dt { color: var(--dim); font: 700 10px var(--mono); text-transform: uppercase; }
.investors-page .private-watch-card dd { margin: 0; color: var(--text); font-size: 12px; }
.investors-page .private-watch-card > a { margin-top: auto; color: var(--good); font-size: 12px; font-weight: 760; text-decoration: none; }
.investors-page .private-watch-card > a:hover,
.investors-page .private-watch-card > a:focus-visible { text-decoration: underline; }
.investors-page .thesis-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.investors-page .thesis-grid article { padding: 19px; }
.investors-page .thesis-grid h3 { min-height: 42px; margin: 0 0 14px; font-size: 18px; }
.investors-page .thesis-grid dl div { padding-top: 10px; border-top: 1px solid var(--line); }
.investors-page .thesis-grid dd { margin-top: 4px; }
.investors-page .scenario-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.investors-page .scenario-grid article,
.investors-page .killer-grid article { padding: 19px; }
.investors-page .scenario-grid h3 { margin: 10px 0 8px; font-size: 18px; }
.investors-page .scenario-grid p,
.investors-page .killer-grid p { font-size: 13px; }
.investors-page .portfolio-grid ul { display: grid; gap: 9px; margin: 0; padding-left: 20px; color: var(--muted); }
.investors-page .portfolio-grid li::marker { color: var(--good); }
.investors-page .killer-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.investors-page .killer-grid h3 { margin: 0 0 8px; font-size: 17px; }

@media (max-width: 1100px) {
  .investors-page .investor-ledgers,
  .investors-page .killer-grid,
  .investors-page .private-watch-grid,
  .investors-page .company-directory { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .investors-page .value-board { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .investors-page .gate::after { display: none; }
  .investors-page .directory-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .investors-page .investor-ledgers,
  .investors-page .method-grid,
  .investors-page .portfolio-grid,
  .investors-page .scenario-grid,
  .investors-page .killer-grid,
  .investors-page .thesis-grid,
  .investors-page .private-watch-grid,
  .investors-page .company-directory,
  .investors-page .value-board,
  .investors-page .directory-controls { grid-template-columns: 1fr; }
  .investors-page .investor-ledgers article { min-height: 0; }
  .investors-page .method-grid dl div { grid-template-columns: 1fr; }
  .investors-page .research-scorecard { grid-template-columns: 1fr; }
  .investors-page .gate,
  .investors-page .gate:nth-child(even) { min-height: 0; transform: none; }
  .investors-page .company-card > p,
  .investors-page .thesis-grid h3 { min-height: 0; }
}

@media (min-width: 1041px) {
  .filter-toolbar,
  .benchmark-toolbar { top: 72px; }
  .stage-marker { top: 112px; }
}

/* Shared single-select chrome: preserve each component's geometry and typography. */
select:not([multiple]) {
  -webkit-appearance: none;
  appearance: none;
  min-height: 36px;
  padding-right: 2.65rem;
  line-height: 1.25;
  background-color: var(--control-bg);
  background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);
  background-position: calc(100% - 15px) 50%, calc(100% - 10px) 50%;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
}

@media (forced-colors: active) {
  select:not([multiple]) { -webkit-appearance: auto; appearance: auto; background-image: none; }
}