:root {
  color-scheme: light;
  --mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", "SF Mono", Menlo, monospace;
  --sans: "Archivo", "Avenir Next", "Helvetica Neue", sans-serif;
  --rounded: "Nunito Sans", ui-rounded, "SF Pro Rounded", "Avenir Next", sans-serif;
  --condensed: "Roboto Condensed", "Avenir Next Condensed", "Archivo", sans-serif;
  --serif: "Source Serif 4", "Iowan Old Style", Georgia, serif;
  --type-small: clamp(12px, .82vw, 14px);
  --type-large: clamp(42px, 6vw, 88px);
  --maxw: 1420px;
  --metal-deep: #0d1217;
  --metal-steel: #576b7a;
  --metal-ice: #d1ebf7;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: #dfe8ed; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
html[data-site-stage="structure"] { background: #d8d5cf; }
html[data-site-stage="local"] { color-scheme: dark; background: #080c0f; }
html[data-site-stage="rust"] { background: #dce5e0; }
html[data-site-stage="prompt"] { color-scheme: dark; background: #0d0b13; }
html[data-site-stage="final"] { background: #dfe8ed; }
body {
  --model-color: #4f6aeb;
  --model-on: #fff;
  --display: var(--sans);
  --display-weight: 900;
  --display-tracking: -.045em;
  --body-font: var(--sans);
  --page-bg: #dfe8ed;
  --surface: #cbd8de;
  --raised: #f3f8fa;
  --fg: #0d1217;
  --soft: #495b65;
  --muted: #76868f;
  --steel-sweep-angle: 118deg;
  --steel-grain-angle: 0deg;
  --steel-glint: rgba(255, 255, 255, .48);
  --steel-shadow: rgba(87, 107, 122, .12);
  --steel-grain: rgba(13, 18, 23, .03);
  --page-pattern:
    linear-gradient(var(--steel-sweep-angle), var(--steel-glint) 0%, transparent 31%, var(--steel-shadow) 63%, transparent 100%),
    repeating-linear-gradient(var(--steel-grain-angle), var(--steel-grain) 0 1px, transparent 1px 7px);
  --pattern-size: auto;
  --panel-sheen: linear-gradient(var(--steel-sweep-angle), var(--steel-glint), transparent 34%, var(--steel-shadow) 72%, transparent);
  --hero-texture: repeating-linear-gradient(var(--steel-grain-angle), transparent 0 11px, var(--steel-grain) 11px 12px);
  --hero-texture-size: auto;
  --copy-shape: 2px;
  --proof-shape: 2px;
  --term-canvas: #fbfbf8;
  --term-fg: #242624;
  --term-muted: #747875;
  --syntax-inline: #78a9b0;
  --syntax-keyword: #815ac0;
  --syntax-function: #287fb8;
  --syntax-variable: #68737d;
  --syntax-string: #00b847;
  --syntax-number: #b26a00;
  --syntax-type: #9b6500;
  --syntax-operator: #b14d7d;
  --syntax-punctuation: #68737d;
  margin: 0;
  min-width: 0;
  min-height: 100vh;
  min-height: 100svh;
  overflow-x: hidden;
  background-color: var(--page-bg);
  background-image: var(--page-pattern);
  background-size: var(--pattern-size);
  color: var(--fg);
  font-family: var(--body-font);
  font-size: var(--type-small);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  transition: background-color .22s ease, color .16s ease;
}

main, section, article, div { min-width: 0; }

body[data-site-stage="structure"] {
  --display: var(--mono);
  --display-weight: 700;
  --display-tracking: -.035em;
  --page-bg: #d8d5cf;
  --surface: #c7c3bc;
  --raised: #eeece7;
  --fg: #15191c;
  --soft: #4a5155;
  --muted: #81878a;
  --steel-sweep-angle: 104deg;
  --steel-grain-angle: 90deg;
  --steel-glint: rgba(255, 255, 255, .42);
  --steel-shadow: rgba(87, 107, 122, .11);
  --steel-grain: rgba(21, 25, 28, .045);
  --term-canvas: #f7f4ee;
  --term-fg: #282624;
  --term-muted: #716b66;
  --syntax-inline: #8b4c32;
  --syntax-keyword: #873e70;
  --syntax-function: #4b6982;
  --syntax-variable: #6f6a64;
  --syntax-string: #4c7554;
  --syntax-number: #9d6615;
  --syntax-type: #8b4c32;
  --syntax-operator: #a93434;
  --syntax-punctuation: #81786d;
}
body[data-site-stage="local"] {
  --display: var(--rounded);
  --display-weight: 800;
  --display-tracking: -.045em;
  --page-bg: #080c0f;
  --surface: #11181d;
  --raised: #1b252c;
  --fg: #eef5f8;
  --soft: #91a0a8;
  --muted: #687780;
  --steel-sweep-angle: 132deg;
  --steel-grain-angle: 0deg;
  --steel-glint: rgba(209, 235, 247, .11);
  --steel-shadow: rgba(0, 0, 0, .24);
  --steel-grain: rgba(209, 235, 247, .035);
  --term-canvas: #0b1014;
  --term-fg: #eef5f8;
  --term-muted: #8d9aa2;
  --syntax-inline: #4e8b68;
  --syntax-keyword: #7b5bb2;
  --syntax-function: #1687a5;
  --syntax-variable: #7b8983;
  --syntax-string: #25935f;
  --syntax-number: #a56c19;
  --syntax-type: #008f83;
  --syntax-operator: #b64d80;
  --syntax-punctuation: #52756c;
}
body[data-site-stage="rust"] {
  --display: var(--condensed);
  --display-weight: 900;
  --display-tracking: -.03em;
  --page-bg: #dce5e0;
  --surface: #c8d5ce;
  --raised: #eef3f0;
  --fg: #101815;
  --soft: #4b5951;
  --muted: #718078;
  --steel-sweep-angle: 58deg;
  --steel-grain-angle: 132deg;
  --steel-glint: rgba(255, 255, 255, .44);
  --steel-shadow: rgba(87, 107, 122, .13);
  --steel-grain: rgba(16, 24, 21, .035);
  --term-canvas: #f2f7f4;
  --term-fg: #17201c;
  --term-muted: #68756e;
  --syntax-inline: #397d83;
  --syntax-keyword: #765d9f;
  --syntax-function: #347b9b;
  --syntax-variable: #5b7376;
  --syntax-string: #388064;
  --syntax-number: #a06e1b;
  --syntax-type: #397d83;
  --syntax-operator: #b64e78;
  --syntax-punctuation: #5b7376;
}
body[data-site-stage="prompt"] {
  --display: var(--serif);
  --display-weight: 900;
  --display-tracking: -.025em;
  --page-bg: #0d0b13;
  --surface: #181420;
  --raised: #241d30;
  --fg: #f5f1fa;
  --soft: #aaa0b8;
  --muted: #796f88;
  --steel-sweep-angle: 145deg;
  --steel-grain-angle: 90deg;
  --steel-glint: rgba(209, 235, 247, .09);
  --steel-shadow: rgba(0, 0, 0, .28);
  --steel-grain: rgba(209, 235, 247, .03);
  --term-canvas: #100d16;
  --term-fg: #f5f1fa;
  --term-muted: #9f94ad;
  --syntax-inline: #885d9f;
  --syntax-keyword: #7650a5;
  --syntax-function: #4f708f;
  --syntax-variable: #8a7f92;
  --syntax-string: #4e795c;
  --syntax-number: #a17116;
  --syntax-type: #885d9f;
  --syntax-operator: #b44e86;
  --syntax-punctuation: #746b7c;
}
body[data-site-stage="final"] {
  --display: var(--sans);
  --display-weight: 900;
  --display-tracking: -.05em;
  --page-bg: #dfe8ed;
  --surface: #cbd8de;
  --raised: #f3f8fa;
  --fg: #0d1217;
  --soft: #495b65;
  --muted: #76868f;
  --steel-sweep-angle: 118deg;
  --steel-grain-angle: 0deg;
  --steel-glint: rgba(255, 255, 255, .48);
  --steel-shadow: rgba(87, 107, 122, .12);
  --steel-grain: rgba(13, 18, 23, .03);
  --term-canvas: #fbfbf8;
  --term-fg: #242624;
  --term-muted: #747875;
  --syntax-inline: #78a9b0;
  --syntax-keyword: #815ac0;
  --syntax-function: #287fb8;
  --syntax-variable: #68737d;
  --syntax-string: #00b847;
  --syntax-number: #b26a00;
  --syntax-type: #9b6500;
  --syntax-operator: #b14d7d;
  --syntax-punctuation: #68737d;
}

button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
a { color: inherit; }
code { font-family: var(--mono); }
::selection { background: color-mix(in srgb, var(--model-color) 22%, transparent); color: var(--fg); }
:focus-visible { outline: 2px solid var(--fg); outline-offset: 4px; }

.skip-link {
  position: fixed;
  z-index: 100;
  top: max(8px, env(safe-area-inset-top));
  left: max(12px, env(safe-area-inset-left));
  transform: translateY(-180%);
  padding: 8px 11px;
  background: var(--fg);
  color: var(--page-bg);
  text-decoration: none;
}
.skip-link:focus { transform: none; }
.sr-only, .sr-live {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.nav {
  position: sticky;
  z-index: 50;
  top: 0;
  min-height: 52px;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 18px;
  padding: 0 20px;
  background: color-mix(in srgb, var(--page-bg) 94%, var(--raised));
  font-family: var(--mono);
  transition: background-color .22s ease, color .16s ease;
}
.brand { min-height: 44px; display: inline-flex; align-items: center; justify-self: start; font-size: var(--type-small); font-weight: 800; text-decoration: none; }
.brand span { margin: 0 5px; color: var(--muted); font-weight: 400; }
.nav-links { min-width: 0; justify-self: end; display: flex; align-items: center; gap: 20px; }
.nav-links a { min-height: 44px; display: inline-flex; align-items: center; color: var(--soft); font-size: var(--type-small); text-decoration: none; }
.nav-links a:hover { color: var(--fg); }

.demo { padding: 24px 12px 12px; background: transparent; }
.tui-shell {
  width: min(var(--maxw), 100%);
  margin: 0 auto;
  overflow: hidden;
  background: var(--term-canvas);
  contain: layout paint;
  transition: background-color .22s ease;
}
.terminal {
  --term-idle-border: color-mix(in srgb, var(--model-color) 18%, var(--term-canvas));
  --model-ink: color-mix(in srgb, var(--model-color) 82%, #000);
  background: var(--term-canvas);
  color: var(--term-fg);
  font-family: var(--mono);
  font-size: var(--type-small);
  transition: background-color .22s ease, color .16s ease;
}
body[data-site-stage="local"] .terminal,
body[data-site-stage="prompt"] .terminal {
  --model-ink: color-mix(in srgb, var(--model-color) 65%, #fff);
}
.terminal-screen {
  height: 520px;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.terminal-scroll {
  flex: 1;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 14px 0 0;
  font-size: var(--type-small);
  line-height: 1.5;
  scrollbar-width: none;
  overscroll-behavior: contain;
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
  contain: layout paint;
}
.terminal-scroll::-webkit-scrollbar { display: none; }
.terminal-event { display: none; }
.terminal-event.is-visible { display: block; margin-bottom: .8em; }
.tui-reasoning.terminal-event.is-visible { display: grid; }
.tui-outcome.terminal-event.is-visible { display: flex; }
.terminal-event:last-child.is-visible { margin-bottom: 0; }
.tui-user { width: calc(100% - 2ch); margin-left: 2ch; }
.tui-prompt-row {
  min-height: 1.5em;
  display: grid;
  grid-template-columns: 2ch minmax(0, 1fr);
  width: 100%;
  background: var(--model-color);
  color: var(--model-on);
}
.tui-prompt-row p, .tui-reasoning p, .tui-assistant p { margin: 0; }
.tui-prompt-row p { min-width: 0; padding-right: 1ch; white-space: pre-wrap; overflow-wrap: anywhere; }
.tui-reasoning { grid-template-columns: minmax(0, 1fr); padding-left: 2ch; }
.thinking-main { min-height: 1.5em; color: var(--model-ink); }
.thinking-live { display: inline-flex; align-items: baseline; gap: 1ch; color: var(--model-ink); }
.thinking-live > span:last-child {
  background: linear-gradient(90deg, var(--model-ink) 12%, color-mix(in srgb, white 55%, var(--model-color)) 46%, var(--model-ink) 78%);
  background-size: 220% 100%;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: thinking-label-shimmer 1.1s linear infinite;
}
.thinking-spinner {
  position: relative;
  width: 1ch;
  display: inline-block;
  overflow: hidden;
  color: transparent;
}
.thinking-spinner::before {
  position: absolute;
  inset: 0;
  content: "⠋";
  color: var(--model-ink);
  -webkit-text-fill-color: currentColor;
  animation: thinking-spinner .5s step-end infinite, thinking-spinner-glint 1.1s linear infinite;
}
.thinking-settled { display: none; color: var(--model-ink); }
.thinking-settled em { font-style: italic; }
.thinking-hint { min-height: 1.5em; display: grid; grid-template-columns: 2ch minmax(0, 1fr); color: var(--term-muted); }
.thinking-elbow { width: 2ch; }
.thinking-touch { display: none; }
.thinking-trace {
  display: none;
  grid-template-columns: 2ch minmax(0, 1fr);
  color: var(--term-muted);
  font-style: italic;
  overflow-wrap: anywhere;
}
.thinking-trace::before { content: "·"; }
.thinking-hint, .thinking-trace { touch-action: manipulation; }
.tui-reasoning.is-settled .thinking-live { display: none; }
.tui-reasoning.is-settled .thinking-settled { display: inline; }
.tui-reasoning.is-expanded .thinking-main,
.tui-reasoning.is-expanded .thinking-hint { display: none; }
.tui-reasoning.is-expanded .thinking-trace { display: grid; }
@keyframes thinking-label-shimmer { to { background-position: -220% 0; } }
@keyframes thinking-spinner-glint {
  50% { color: color-mix(in srgb, white 55%, var(--model-color)); }
}
@keyframes thinking-spinner {
  0% { content: "⠋"; }
  10% { content: "⠙"; }
  20% { content: "⠹"; }
  30% { content: "⠸"; }
  40% { content: "⠼"; }
  50% { content: "⠴"; }
  60% { content: "⠦"; }
  70% { content: "⠧"; }
  80% { content: "⠇"; }
  90% { content: "⠏"; }
}
.tui-tool { padding-left: 2ch; }
.tui-action { display: grid; grid-template-columns: 8ch minmax(0, 1fr); }
.tui-action > span { min-width: 0; overflow-wrap: anywhere; }
.tui-action strong { color: var(--term-fg); font-weight: 700; }
.tui-shell-command { grid-template-columns: 2ch minmax(0, 1fr); }
.tui-tool-meta { display: block; padding-left: 2ch; color: var(--term-muted); }
.diff { max-width: calc(100% - 2ch); display: grid; margin: .15em 0 0 2ch; overflow: hidden; color: var(--term-fg); }
.diff > span { min-height: 1.5em; }
.diff-file, .diff-hunk { color: var(--term-muted); }
.diff-remove, .diff-add { display: grid; grid-template-columns: 3ch 2ch minmax(0, 1fr); padding: 0 .35ch; }
.diff-remove { background: color-mix(in srgb, #e03030 7%, var(--term-canvas)); }
.diff-add { background: color-mix(in srgb, #00b847 7%, var(--term-canvas)); }
.diff i { color: var(--term-muted); font-style: normal; text-align: right; }
.diff b { font-weight: 400; text-align: center; }
.diff code { overflow: hidden; font: inherit; text-overflow: ellipsis; white-space: nowrap; }
.tui-assistant { padding-left: 2ch; color: var(--term-fg); }
.tui-markdown { max-width: 100%; font-variant-ligatures: none; }
.tui-markdown > * { margin: 0; }
.tui-markdown > * + * { margin-top: 1.5em; }
.md-heading { color: var(--term-fg); font-weight: 700; }
.md-inline { padding: 0; background: none; color: var(--syntax-inline); font: inherit; font-style: normal; }
.md-list { display: grid; padding: 0; list-style: none; }
.md-list li { display: grid; grid-template-columns: 2ch minmax(0, 1fr); }
.md-list li::before { content: "•"; color: var(--term-fg); }
.md-codebox { width: var(--md-box-width); max-width: 100%; overflow: hidden; color: var(--term-fg); }
.md-code-row {
  width: 100%;
  min-height: 1.5em;
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr) max-content;
  white-space: pre;
}
.md-code-body { min-width: 0; overflow: hidden; white-space: pre; }
.md-language { color: var(--term-muted); font-style: italic; }
.md-frame { color: var(--term-fg); }
.syntax-keyword { color: var(--syntax-keyword); }
.syntax-function { color: var(--syntax-function); }
.syntax-variable { color: var(--syntax-variable); }
.syntax-string { color: var(--syntax-string); }
.syntax-number { color: var(--syntax-number); }
.syntax-type { color: var(--syntax-type); }
.syntax-operator { color: var(--syntax-operator); }
.syntax-punctuation { color: var(--syntax-punctuation); }
.tui-outcome { gap: 1ch; padding-left: 2ch; color: var(--term-muted); }
.tui-outcome span { color: var(--term-fg); }
.tui-outcome i { font-style: italic; }

.terminal-compose {
  flex: 0 0 auto;
  padding: .75em 10px 6px;
  background: var(--term-canvas);
  font-size: var(--type-small);
  line-height: 1.5;
  transition: background-color .22s ease;
}
.composer-box {
  position: relative;
  width: 100%;
  min-height: 40px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  column-gap: 1ch;
  padding: .55em 1ch;
  border: 1px solid var(--term-idle-border);
  border-radius: 6px;
  background: var(--term-canvas);
}
.composer-shimmer {
  position: absolute;
  pointer-events: none;
  inset: -1px;
  z-index: 0;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  overflow: visible;
  opacity: 0;
}
.composer-shimmer rect {
  fill: none;
  vector-effect: non-scaling-stroke;
  stroke-linecap: round;
  stroke-dashoffset: 0;
}
.composer-shimmer-tail {
  stroke: color-mix(in srgb, var(--model-color) 45%, var(--term-idle-border));
  stroke-width: 2;
  stroke-dasharray: 18 82;
}
.composer-shimmer-core {
  stroke: color-mix(in srgb, white 32%, var(--model-color));
  stroke-width: 1.5;
  stroke-dasharray: 5 95;
}
.terminal.is-drafting .composer-box { border-color: var(--model-color); }
.terminal.is-running .composer-box { border-color: var(--term-idle-border); }
.terminal.is-running .composer-shimmer {
  opacity: 1;
}
.terminal.is-running .composer-shimmer rect { animation: composer-perimeter 1s linear infinite; }
@keyframes composer-perimeter { to { stroke-dashoffset: -100; } }
.composer-prompt, .composer-editor { position: relative; z-index: 1; }
.composer-prompt { color: var(--model-ink); font-weight: 700; line-height: 1.5; }
.composer-editor {
  min-width: 0;
  display: block;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.composer-input {
  color: var(--term-fg);
  white-space: pre-wrap;
}
.composer-cursor {
  width: .65ch;
  height: 1.15em;
  display: inline-block;
  margin-left: .1ch;
  background: var(--model-color);
  vertical-align: -.18em;
}
.composer-status {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 3ch;
  padding: .4em 2ch 0;
  color: var(--term-muted);
  font-size: var(--type-small);
  overflow: hidden;
  white-space: nowrap;
}
.composer-instruments { min-width: 0; display: flex; align-items: center; gap: 3ch; overflow: hidden; }
.composer-instruments > span { flex: 0 0 auto; }
.composer-instruments > [data-terminal-model] { min-width: 0; flex: 0 1 auto; overflow: hidden; color: var(--term-fg); text-overflow: ellipsis; }
.composer-instruments [data-model-compact] { display: none; }
.composer-status > [data-terminal-activity] { justify-self: end; color: var(--model-ink); }
.composer-status span:empty { display: none; }

.product {
  width: min(var(--maxw), calc(100% - 24px));
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(300px, 5fr);
  grid-template-rows: 348px;
  gap: 12px;
  margin: 0 auto;
  padding: 12px 0;
}
.product > *, .proof-band > *, .facts > *, .install > * { min-width: 0; }
.product-copy {
  position: relative;
  grid-column: 1;
  grid-row: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
  padding: 24px 28px;
  border-radius: var(--copy-shape);
  background-color: var(--surface);
  background-image: var(--panel-sheen), var(--hero-texture);
  background-size: 100% 100%, var(--hero-texture-size);
  transition: background-color .16s ease;
}
.kicker {
  position: relative;
  z-index: 2;
  margin: 0 0 12px;
  color: var(--soft);
  font-family: var(--mono);
  font-size: var(--type-small);
  font-weight: 700;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.display-title {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 1.92em;
  max-width: 100%;
  overflow: hidden;
  padding: .04em 0;
  font-size: var(--type-large);
}
.product h1 {
  margin: 0;
  font-family: var(--display);
  font-size: var(--type-large);
  font-weight: var(--display-weight);
  line-height: .9;
  letter-spacing: var(--display-tracking);
}
.product-copy > p:last-child {
  position: relative;
  z-index: 2;
  max-width: 48ch;
  margin: 16px 0 0;
  color: var(--soft);
  font-family: var(--sans);
  font-size: var(--type-small);
}
.proof-band {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
  display: grid;
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.proof {
  position: relative;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  overflow: hidden;
  padding: 16px 22px;
  border-radius: var(--proof-shape);
  background-color: var(--raised);
  background-image: var(--panel-sheen);
  transition: background-color .16s ease, color .16s ease;
}
.proof-rust, .proof-prompt { grid-column: 1; grid-row: auto; }
.proof > span { color: var(--soft); font-size: var(--type-small); }
.proof strong {
  margin: auto 0 6px;
  font-family: var(--display);
  font-size: var(--type-large);
  font-weight: var(--display-weight);
  line-height: .78;
  letter-spacing: var(--display-tracking);
  white-space: nowrap;
}
.proof p { margin: 0; color: var(--soft); font-size: var(--type-small); }

body[data-site-stage="rust"] .proof-rust {
  color: var(--model-on);
  background-color: var(--model-color);
  background-image: var(--panel-sheen), var(--hero-texture);
  background-size: 100% 100%, var(--hero-texture-size);
}
body[data-site-stage="rust"] .proof-rust > span,
body[data-site-stage="rust"] .proof-rust p { color: var(--model-on); }
body[data-site-stage="prompt"] .proof-prompt {
  color: var(--model-on);
  background-color: var(--model-color);
  background-image: var(--panel-sheen), var(--hero-texture);
  background-size: 100% 100%, var(--hero-texture-size);
}
body[data-site-stage="prompt"] .proof-prompt > span,
body[data-site-stage="prompt"] .proof-prompt p { color: var(--model-on); }
body[data-site-stage="final"] .proof-rust { background-color: color-mix(in srgb, var(--model-color) 15%, var(--raised)); }
body[data-site-stage="final"] .proof-prompt { color: var(--model-on); background-color: var(--model-color); }
body[data-site-stage="final"] .proof-prompt > span,
body[data-site-stage="final"] .proof-prompt p { color: var(--model-on); }

.facts {
  width: min(var(--maxw), calc(100% - 24px));
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
  margin: 0 auto;
  padding: 0 0 12px;
  font-family: var(--mono);
}
.facts article {
  height: 88px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 12px 14px;
  background-color: var(--surface);
  background-image: var(--panel-sheen);
  transition: background-color .16s ease, color .16s ease;
}
.facts article:nth-child(even) { background-color: var(--raised); }
.facts span { color: var(--soft); font-size: var(--type-small); }
.facts strong { min-height: 2.5em; font-size: var(--type-small); font-weight: 700; line-height: 1.25; }
body[data-site-stage="local"] [data-fact="local"],
body[data-site-stage="rust"] [data-fact="render"],
body[data-site-stage="prompt"] [data-fact="context"] { background-color: var(--model-color); color: var(--model-on); }
body[data-site-stage="local"] [data-fact="local"] span,
body[data-site-stage="rust"] [data-fact="render"] span,
body[data-site-stage="prompt"] [data-fact="context"] span { color: var(--model-on); }
body[data-site-stage="final"] [data-fact="local"] { background-color: color-mix(in srgb, var(--model-color) 15%, var(--surface)); }

body[data-site-action="read"][data-site-target="product"] .product-copy,
body[data-site-action="read"][data-site-target="proof"] .proof,
body[data-site-action="read"][data-site-target="facts"] .facts article,
body[data-site-action="read"][data-site-target="install"] .install {
  box-shadow: inset 5px 0 var(--model-color);
}

.install {
  width: min(var(--maxw), calc(100% - 24px));
  display: grid;
  grid-template-columns: .38fr minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  margin: 0 auto 12px;
  padding: 14px 18px;
  border-radius: var(--copy-shape);
  background-color: var(--surface);
  background-image: var(--panel-sheen);
  transition: background-color .16s ease;
}
.install .kicker { margin-bottom: 8px; }
.install h2 { margin: 0; font-family: var(--display); font-size: var(--type-small); font-weight: var(--display-weight); line-height: 1.2; letter-spacing: 0; }
.install-command {
  width: 100%;
  min-width: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 8px 12px;
  border: 0;
  border-radius: var(--proof-shape);
  background: var(--raised);
  color: var(--soft);
  cursor: pointer;
  font-family: var(--mono);
  text-align: left;
}
.install-command code { overflow: hidden; color: var(--fg); font-size: var(--type-small); text-overflow: ellipsis; white-space: nowrap; }
.copy-label { font-size: var(--type-small); }
.install-command.is-copied .copy-label { color: var(--model-color); }
.source-link { min-height: 44px; display: inline-flex; align-items: center; padding: 8px 0; color: var(--soft); font-family: var(--mono); font-size: var(--type-small); text-decoration: none; }
.source-link:hover { color: var(--fg); }
body[data-site-action="check"] .install-command,
body[data-site-stage="final"] .install-command { background: var(--metal-deep); color: var(--metal-ice); }
body[data-site-action="check"] .install-command code,
body[data-site-stage="final"] .install-command code { color: #fff; }

.footer {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 20px;
  color: var(--soft);
  font-family: var(--mono);
  font-size: var(--type-small);
}
.footer a { min-height: 44px; display: inline-flex; align-items: center; text-decoration: none; }
.footer a:first-child { color: var(--fg); font-weight: 800; }

#features, #install { scroll-margin-top: 64px; }

@media (max-width: 980px) {
  .composer-status [data-terminal-cache] { display: none; }
  .product { grid-template-columns: minmax(0, 3fr) minmax(250px, 2fr); }
  .facts { grid-template-columns: repeat(3, 1fr); }
  .facts article { grid-column: span 1; }
}

@media (max-width: 700px) {
  :root { --type-large: clamp(38px, 6vw, 52px); }
  .nav {
    grid-template-columns: minmax(0, 1fr) auto;
    min-height: calc(50px + env(safe-area-inset-top));
    gap: 8px;
    padding-top: env(safe-area-inset-top);
    padding-right: max(10px, env(safe-area-inset-right));
    padding-left: max(10px, env(safe-area-inset-left));
  }
  .nav-links { gap: 2px; }
  .nav-links a { padding: 0 6px; }
  .nav-links a:first-child { display: none; }
  .demo {
    padding-top: 12px;
    padding-right: env(safe-area-inset-right);
    padding-bottom: 8px;
    padding-left: env(safe-area-inset-left);
  }
  .tui-shell { width: 100%; }
  .terminal-screen {
    height: 440px;
    height: clamp(340px, 68svh, 440px);
    min-height: 0;
  }
  .terminal-scroll { padding-top: 10px; }
  .terminal-compose {
    padding-top: .6em;
    padding-right: max(6px, env(safe-area-inset-right));
    padding-bottom: 5px;
    padding-left: max(6px, env(safe-area-inset-left));
  }
  .composer-status { gap: 2ch; padding-right: 1ch; padding-left: 1ch; }
  .composer-instruments { gap: 2ch; }
  .composer-status [data-terminal-cache] { display: none; }
  .product, .facts, .install {
    width: auto;
    margin-right: max(6px, env(safe-area-inset-right));
    margin-left: max(6px, env(safe-area-inset-left));
  }
  .product { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(230px, 250px) minmax(164px, auto); padding-top: 4px; }
  .product .product-copy { grid-column: 1; grid-row: 1; min-height: 0; padding: 20px; }
  .product .proof-band { grid-column: 1; grid-row: 2; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: minmax(164px, auto); }
  .product .proof { grid-column: auto; grid-row: 1; min-height: 164px; padding: 14px 16px; }
  .install { grid-template-columns: 1fr; align-items: start; padding: 14px; }
  .install-command { grid-template-columns: auto minmax(0, 1fr); }
  .copy-label { display: none; }
  .source-link { justify-self: start; }
  .footer {
    padding-top: 8px;
    padding-right: max(10px, env(safe-area-inset-right));
    padding-bottom: max(8px, env(safe-area-inset-bottom));
    padding-left: max(10px, env(safe-area-inset-left));
  }
}

@media (max-width: 520px) {
  .composer-status { gap: 1.2ch; }
  .composer-status [data-terminal-cache],
  .composer-status [data-terminal-telemetry],
  .composer-status [data-terminal-throughput] { display: none; }
  .diff-remove, .diff-add { grid-template-columns: 2ch minmax(0, 1fr); align-items: start; }
  .diff i { display: none; }
  .diff code { overflow: visible; text-overflow: clip; white-space: pre-wrap; overflow-wrap: anywhere; }
  .product { grid-template-rows: minmax(220px, auto) auto; }
  .product .product-copy { min-height: 220px; padding: 18px; }
  .product .proof-band { grid-template-columns: minmax(0, 1fr); grid-template-rows: repeat(2, minmax(132px, auto)); }
  .product .proof { grid-row: auto; min-height: 132px; }
  .facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .facts article:last-child { grid-column: 1 / -1; }
  .facts article { height: 84px; padding: 11px 12px; }
  .install { gap: 12px; padding: 12px; }
}

@media (max-width: 430px) {
  .terminal-screen { height: clamp(330px, 67svh, 420px); }
  .tui-action { grid-template-columns: 7ch minmax(0, 1fr); }
  .tui-shell-command { grid-template-columns: 2ch minmax(0, 1fr); }
  .composer-status [data-terminal-context] { display: none; }
  .composer-instruments [data-model-full] { display: none; }
  .composer-instruments [data-model-compact] { display: inline; }
  .product-copy > p:last-child { margin-top: 12px; }
}

@media (max-width: 380px) {
  :root { --type-large: 36px; }
  .product .product-copy { min-height: 210px; padding: 16px; }
  .proof { padding: 12px 14px; }
  .facts { gap: 6px; }
  .facts article { height: 80px; padding: 10px; }
  .install-command { padding-right: 10px; padding-left: 10px; }
}

@media (pointer: coarse) {
  .thinking-hint, .thinking-trace { cursor: pointer; }
  .thinking-hint { min-height: 44px; align-items: center; }
  .thinking-keyboard { display: none; }
  .thinking-touch { display: inline; }
  .tui-reasoning.is-expanded .thinking-trace { min-height: 44px; align-items: center; }
}

@media (max-width: 900px) and (max-height: 500px) {
  .nav {
    position: relative;
    padding-right: max(10px, env(safe-area-inset-right));
    padding-left: max(10px, env(safe-area-inset-left));
  }
  .demo {
    padding-top: 6px;
    padding-right: env(safe-area-inset-right);
    padding-left: env(safe-area-inset-left);
  }
  .terminal-compose {
    padding-right: max(6px, env(safe-area-inset-right));
    padding-left: max(6px, env(safe-area-inset-left));
  }
  .terminal-screen {
    height: 320px;
    height: clamp(280px, calc(100svh - 58px), 360px);
  }
  .product, .facts, .install {
    width: auto;
    margin-right: max(12px, env(safe-area-inset-right));
    margin-left: max(12px, env(safe-area-inset-left));
  }
  .footer {
    padding-right: max(10px, env(safe-area-inset-right));
    padding-left: max(10px, env(safe-area-inset-left));
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}
