@layer reset, base, layout, components, responsive;

@layer reset {
  *, *::before, *::after { box-sizing: border-box; }
  html { font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; scroll-behavior: smooth; }
  body, h1, h2, h3, p, ol, ul, dl, dd { margin: 0; }
  ol, ul { padding: 0; }
  img { display: block; max-width: 100%; }
  button { font: inherit; }
  a { color: inherit; }
}

@layer base {
  :root {
    color-scheme: light;
    --paper: oklch(0.972 0.012 74);
    --paper-deep: oklch(0.935 0.018 70);
    --ink: oklch(0.245 0.018 54);
    --ink-soft: oklch(0.34 0.02 54);
    --muted: oklch(0.515 0.022 58);
    --line: oklch(0.825 0.025 67);
    --accent: oklch(0.49 0.17 35);
    --accent-dark: oklch(0.39 0.145 34);
    --accent-soft: oklch(0.91 0.052 48);
    --light-ink: oklch(0.965 0.01 72);
    --light-muted: oklch(0.79 0.02 70);
    --green: oklch(0.58 0.12 145);
    --amber: oklch(0.66 0.13 76);
    --focus: oklch(0.65 0.17 35);
    --page: min(92vw, 88rem);
    --mono: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
  }

  body {
    min-width: 320px;
    min-height: 100vh;
    color: var(--ink);
    background: var(--paper);
    font-size: 1rem;
    line-height: 1.55;
    text-rendering: optimizeLegibility;
  }
  a { text-underline-offset: 0.25em; }
  :focus-visible { outline: 3px solid var(--focus); outline-offset: 4px; }
  ::selection { color: var(--ink); background: var(--accent-soft); }
}

@layer layout {
  .page-grid {
    width: var(--page);
    margin-inline: auto;
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    column-gap: clamp(1rem, 2vw, 2rem);
  }

  .site-header {
    min-height: 5rem;
    padding-inline: max(4vw, calc((100vw - 88rem) / 2));
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    color: var(--light-ink);
    background: var(--ink);
    border-bottom: 1px solid oklch(0.39 0.02 54);
  }

  .hero { min-height: 45rem; padding-block: clamp(5rem, 10vw, 9.5rem) clamp(4rem, 8vw, 7rem); align-items: center; }
  .hero-copy { grid-column: 1 / span 6; align-self: center; }
  .hero-system { grid-column: 8 / -1; align-self: center; }

  .manifesto { color: var(--light-ink); background: var(--ink); }
  .manifesto-grid { padding-block: clamp(5rem, 9vw, 9rem); align-items: start; }
  .manifesto-grid > .section-label { grid-column: 1 / span 2; }
  .manifesto-grid > div { grid-column: 3 / span 6; }
  .manifesto-note { grid-column: 10 / -1; }

  .principles { padding-block: clamp(5rem, 9vw, 9rem); }
  .principles .section-intro { grid-column: 1 / span 4; }
  .principle-list { grid-column: 6 / -1; }

  .evidence-band { color: var(--light-ink); background: var(--accent-dark); }
  .evidence-grid { padding-block: clamp(5rem, 8vw, 8rem); align-items: start; }
  .evidence-copy { grid-column: 1 / span 5; }
  .evidence-stats { grid-column: 7 / -1; }

  .live-proof { padding-block: clamp(5rem, 9vw, 9rem); align-items: start; }
  .live-proof > div:first-child { grid-column: 1 / span 5; }
  .live-copy { grid-column: 7 / -1; }
  .endpoint { grid-column: 7 / -1; }

  .page-hero { min-height: 33rem; padding-block: clamp(5rem, 10vw, 9rem) clamp(4rem, 7vw, 6rem); align-items: end; }
  .page-hero > div:first-child { grid-column: 1 / span 7; }
  .page-summary { grid-column: 9 / -1; }

  .benchmark-rationale { color: var(--light-ink); background: var(--ink); }
  .rationale-grid { padding-block: clamp(5rem, 8vw, 8rem); align-items: start; }
  .rationale-grid > .section-label { grid-column: 1 / span 2; }
  .rationale-copy { grid-column: 3 / span 6; }
  .rationale-note { grid-column: 10 / -1; }

  .roadmap { padding-bottom: clamp(5rem, 10vw, 10rem); }
  .roadmap-row { grid-column: 1 / -1; }

  .research-callout { color: var(--light-ink); background: var(--accent-dark); }
  .research-grid { padding-block: clamp(4rem, 7vw, 7rem); align-items: start; }
  .research-grid .section-label { grid-column: 1 / span 2; }
  .research-grid h2 { grid-column: 3 / span 4; }
  .research-grid p:not(.section-label) { grid-column: 7 / span 4; }
  .research-grid .button { grid-column: 11 / -1; justify-self: end; }

  .result-feature { padding-block: clamp(4rem, 8vw, 8rem); border-top: 1px solid var(--line); }
  .result-heading { grid-column: 1 / span 5; }
  .result-table-wrap { grid-column: 7 / -1; }
  .reading-note { grid-column: 7 / -1; }

  .history-section { padding-block: clamp(5rem, 9vw, 9rem); border-top: 1px solid var(--line); }
  .history-section .section-intro { grid-column: 1 / span 4; }
  .history-list { grid-column: 6 / -1; }

  .security-results { color: var(--light-ink); background: var(--ink); }
  .security-grid { padding-block: clamp(5rem, 9vw, 9rem); }
  .security-grid > div:first-child { grid-column: 1 / span 5; }
  .check-list { grid-column: 7 / -1; }
  .security-foot { grid-column: 7 / -1; }

  .method { padding-block: clamp(5rem, 9vw, 9rem); }
  .method .section-intro { grid-column: 1 / span 4; }
  .method-list { grid-column: 6 / -1; }
  .method-cta { grid-column: 6 / -1; }

  .manual-flow, .manual-commands { padding-block: clamp(5rem, 9vw, 9rem); }
  .manual-flow .section-intro, .manual-commands .section-intro { grid-column: 1 / span 4; }
  .manual-flow .method-list, .command-list { grid-column: 6 / -1; }
  .manual-example { color: var(--light-ink); background: var(--ink); }
  .manual-example-grid { padding-block: clamp(5rem, 9vw, 9rem); align-items: start; }
  .manual-example-grid > div { grid-column: 1 / span 5; }
  .manual-example-grid > pre { grid-column: 7 / -1; }
  .manual-boundaries { color: var(--light-ink); background: var(--accent-dark); }

  .cookie-policy { padding-bottom: clamp(5rem, 10vw, 10rem); }
  .cookie-policy-intro { grid-column: 1 / span 5; }
  .cookie-current { grid-column: 7 / -1; }
  .policy-section { grid-column: 1 / -1; }

  .site-footer {
    min-height: 18rem;
    padding: 4rem max(4vw, calc((100vw - 88rem) / 2));
    display: grid;
    grid-template-columns: 1.25fr 1fr 1fr;
    gap: 2rem;
    align-items: start;
    color: var(--light-muted);
    background: var(--ink);
    border-top: 1px solid oklch(0.39 0.02 54);
  }
  .site-footer small { grid-column: 1 / span 2; align-self: end; }
  .site-footer .footer-cookie-button { grid-column: 3; justify-self: end; align-self: end; }
}

@layer components {
  .skip-link {
    position: fixed;
    z-index: 20;
    top: 0.75rem;
    left: 0.75rem;
    padding: 0.7rem 1rem;
    color: var(--light-ink);
    background: var(--accent);
    transform: translateY(-180%);
  }
  .skip-link:focus { transform: translateY(0); }

  .brand { display: inline-flex; align-items: center; gap: 0.75rem; font-weight: 750; letter-spacing: -0.01em; text-decoration: none; }
  .brand-mark { width: 2.1rem; height: 2.1rem; display: grid; place-items: center; color: var(--ink); background: var(--light-ink); border-radius: 0.45rem; font-weight: 850; }
  .site-nav { display: flex; align-items: center; gap: clamp(1rem, 2.4vw, 2.5rem); font-size: 0.82rem; font-weight: 700; }
  .site-nav a { color: var(--light-muted); text-decoration: none; }
  .site-nav a:hover, .site-nav a[aria-current="page"] { color: var(--light-ink); }
  .site-nav a[aria-current="page"] { text-decoration: underline; text-decoration-color: var(--accent-soft); text-decoration-thickness: 2px; }
  .site-nav .nav-access { padding: 0.62rem 0.9rem; color: var(--ink); background: var(--light-ink); border-radius: 0.35rem; }

  .kicker, .section-label, .mono-note { font: 750 0.72rem/1.4 var(--mono); letter-spacing: 0.11em; }
  .kicker { margin-bottom: 1.5rem; color: var(--accent); }
  .status-dot { width: 0.47rem; height: 0.47rem; display: inline-block; background: var(--green); border-radius: 50%; box-shadow: 0 0 0 0.24rem oklch(0.58 0.12 145 / 0.14); }
  h1 { max-width: 10ch; font-size: clamp(3.4rem, 7.2vw, 7rem); font-weight: 790; line-height: 0.94; letter-spacing: 0.005em; }
  .page-hero h1 { max-width: 11ch; font-size: clamp(3.3rem, 6.5vw, 6.6rem); }
  .results-hero h1 { max-width: 11.5ch; }
  .legal-hero h1 { max-width: 8ch; }
  .manual-hero h1 { max-width: 12ch; }
  h2 { font-size: clamp(2.1rem, 4vw, 4.3rem); font-weight: 760; line-height: 1.02; letter-spacing: 0.003em; }
  h3 { font-size: 1.12rem; font-weight: 730; line-height: 1.25; letter-spacing: -0.005em; }
  .hero-lede { max-width: 37rem; margin-top: 2rem; color: var(--muted); font-size: clamp(1.05rem, 1.5vw, 1.25rem); line-height: 1.65; }
  .actions { margin-top: 2.3rem; display: flex; align-items: center; gap: 1.6rem; flex-wrap: wrap; }
  .button { min-height: 3rem; padding: 0.78rem 1.05rem; display: inline-flex; align-items: center; justify-content: center; gap: 0.8rem; border-radius: 0.35rem; font-size: 0.83rem; font-weight: 760; text-decoration: none; }
  .button-primary { color: var(--light-ink); background: var(--accent); }
  .button-primary:hover { background: var(--accent-dark); }
  .button-light { color: var(--ink); background: var(--light-ink); }
  .text-link { color: var(--ink-soft); font-size: 0.86rem; font-weight: 720; text-decoration-color: var(--line); }
  .text-button { margin-top: 1.7rem; padding: 0 0 0.2rem; color: var(--ink); background: transparent; border: 0; border-bottom: 1px solid var(--accent); font-size: 0.82rem; font-weight: 720; line-height: 1.4; cursor: pointer; }

  .hero-system { overflow: hidden; color: var(--light-ink); background: var(--ink); border: 1px solid oklch(0.39 0.02 54); box-shadow: 1.5rem 1.5rem 0 var(--accent-soft); }
  .system-topline, .system-foot { min-height: 2.7rem; padding-inline: 1rem; display: flex; align-items: center; justify-content: space-between; gap: 0.7rem; color: var(--light-muted); font: 700 0.62rem/1.2 var(--mono); letter-spacing: 0.08em; }
  .system-topline { border-bottom: 1px solid oklch(0.39 0.02 54); }
  .system-foot { border-top: 1px solid oklch(0.39 0.02 54); }
  .system-line { height: 1px; flex: 1; background: oklch(0.46 0.02 54); }
  .pipeline { list-style: none; }
  .pipeline li { position: relative; min-height: 5.4rem; padding: 1rem; display: grid; grid-template-columns: 2.4rem 1fr; grid-template-rows: auto auto; align-items: center; column-gap: 0.8rem; border-bottom: 1px solid oklch(0.39 0.02 54); }
  .pipeline li:last-child { border-bottom: 0; }
  .pipeline li:not(:last-child)::after { content: "↓"; position: absolute; z-index: 2; bottom: -0.75rem; left: 1.55rem; width: 1.5rem; height: 1.5rem; display: grid; place-items: center; color: var(--ink); background: var(--accent-soft); border-radius: 50%; font: 700 0.75rem/1 var(--mono); }
  .pipeline-index { grid-row: 1 / 3; color: var(--accent-soft); font: 700 0.67rem/1.2 var(--mono); }
  .pipeline strong { font-size: 0.95rem; }
  .pipeline code { color: var(--light-muted); font: 500 0.72rem/1.4 var(--mono); }
  .pipeline-output { background: var(--accent); }
  .pipeline-output .pipeline-index, .pipeline-output code { color: var(--light-ink); }

  .section-label { margin-bottom: 1.1rem; color: var(--accent); }
  .section-label-light { color: var(--accent-soft); }
  .manifesto h2 { max-width: 13ch; }
  .manifesto-grid > div p { max-width: 42rem; margin-top: 2rem; color: var(--light-muted); font-size: 1.08rem; line-height: 1.7; }
  .manifesto-note { padding-top: 0.35rem; color: var(--light-muted); font: 600 0.72rem/1.7 var(--mono); border-top: 1px solid oklch(0.42 0.02 54); }
  .section-intro h2 { max-width: 10ch; }

  .principle-list { list-style: none; border-top: 1px solid var(--line); }
  .principle-list li { min-height: 8.5rem; padding: 1.5rem 0; display: grid; grid-template-columns: 3rem 1fr auto; gap: 1.1rem; align-items: start; border-bottom: 1px solid var(--line); }
  .principle-list h3 { font-size: 1.35rem; }
  .principle-list p { max-width: 38rem; margin-top: 0.5rem; color: var(--muted); }
  .row-number { color: var(--accent); font: 750 0.7rem/1.7 var(--mono); }
  .row-state { width: max-content; padding: 0.25rem 0.45rem; font: 750 0.6rem/1.2 var(--mono); letter-spacing: 0.07em; border: 1px solid currentColor; border-radius: 0.25rem; }
  .state-now { color: var(--accent); }
  .state-measured { color: oklch(0.45 0.11 145); }
  .state-research { color: var(--muted); }

  .evidence-copy h2 { max-width: 10ch; }
  .evidence-copy > p:not(.section-label) { max-width: 34rem; margin-top: 1.6rem; color: oklch(0.88 0.018 70); }
  .evidence-copy .button { margin-top: 2rem; }
  .evidence-stats { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid oklch(0.67 0.1 35); border-left: 1px solid oklch(0.67 0.1 35); }
  .evidence-stats div { min-height: 10rem; padding: 1.4rem; display: flex; flex-direction: column; justify-content: space-between; border-right: 1px solid oklch(0.67 0.1 35); border-bottom: 1px solid oklch(0.67 0.1 35); }
  .evidence-stats dt { color: oklch(0.87 0.04 50); font: 700 0.68rem/1.4 var(--mono); letter-spacing: 0.06em; }
  .evidence-stats dd { font: 750 clamp(2.1rem, 4vw, 4rem)/1 var(--mono); letter-spacing: -0.045em; }
  .evidence-stats small { display: block; margin-top: 0.45rem; color: oklch(0.87 0.04 50); font-size: 0.65rem; letter-spacing: 0; }

  .live-proof h2 { max-width: 10ch; }
  .live-copy > p { max-width: 39rem; color: var(--muted); font-size: 1.05rem; line-height: 1.7; }
  .live-copy .button { margin-top: 2rem; }
  .endpoint { margin-top: 3.5rem; padding: 1rem 0; display: grid; grid-template-columns: auto 1fr auto; gap: 1rem; align-items: center; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .endpoint code, .endpoint > span:last-child { font: 700 0.68rem/1.4 var(--mono); letter-spacing: 0.07em; }
  .endpoint > span:last-child { color: oklch(0.45 0.11 145); }

  .page-summary > p:first-child { color: var(--muted); font-size: 1.08rem; line-height: 1.7; }
  .mono-note { margin-top: 2rem; color: var(--accent); }
  .legend { margin-top: 2rem; display: grid; gap: 0.55rem; color: var(--muted); font: 700 0.67rem/1.4 var(--mono); }
  .legend span { display: flex; align-items: center; gap: 0.7rem; }
  .legend i { width: 0.55rem; height: 0.55rem; display: block; border-radius: 50%; }
  .legend-done { background: var(--green); }
  .legend-progress { background: var(--accent); }
  .legend-next { border: 1px solid var(--muted); }

  .roadmap-row { position: relative; min-height: 18rem; padding: 3rem 0; display: grid; grid-template-columns: 2fr 7fr 1fr; gap: clamp(1.5rem, 4vw, 5rem); border-top: 1px solid var(--line); }
  .roadmap-row:last-child { border-bottom: 1px solid var(--line); }
  .roadmap-row::before { content: ""; position: absolute; top: 3.4rem; left: -1.75rem; width: 0.62rem; height: 0.62rem; border-radius: 50%; }
  .roadmap-done::before { background: var(--green); }
  .roadmap-progress::before { background: var(--accent); box-shadow: 0 0 0 0.35rem var(--accent-soft); }
  .roadmap-next::before { border: 1px solid var(--muted); background: var(--paper); }
  .roadmap-meta { display: flex; flex-direction: column; gap: 1rem; }
  .roadmap-version { font: 750 0.78rem/1.4 var(--mono); }
  .roadmap-body h2 { font-size: clamp(1.9rem, 3vw, 3.2rem); }
  .roadmap-body > p { max-width: 48rem; margin-top: 1.1rem; color: var(--muted); }
  .roadmap-body ul { margin-top: 1.3rem; display: flex; gap: 0.55rem; flex-wrap: wrap; list-style: none; }
  .roadmap-body li { padding: 0.38rem 0.58rem; color: var(--ink-soft); background: var(--paper-deep); font: 650 0.66rem/1.3 var(--mono); border-radius: 0.25rem; }
  .roadmap-row time { justify-self: end; color: var(--muted); font: 700 0.68rem/1.4 var(--mono); }
  .research-grid h2 { font-size: clamp(2rem, 3.5vw, 3.8rem); }
  .research-grid > p:not(.section-label) { color: oklch(0.88 0.018 70); }

  .rationale-copy h2 { max-width: 10ch; }
  .rationale-copy p { max-width: 45rem; margin-top: 1.5rem; color: var(--light-muted); font-size: 1.03rem; line-height: 1.7; }
  .rationale-copy a { display: inline-block; margin-top: 1.7rem; color: var(--accent-soft); font-size: 0.82rem; font-weight: 720; }
  .rationale-note { padding-top: 0.4rem; color: var(--light-muted); font: 600 0.72rem/1.7 var(--mono); border-top: 1px solid oklch(0.42 0.02 54); }

  .result-heading h2 { max-width: 11ch; font-size: clamp(2.3rem, 4vw, 4.2rem); }
  .result-heading > p:last-child { max-width: 34rem; margin-top: 1.5rem; color: var(--muted); }
  .result-table-wrap { overflow-x: auto; }
  .result-table { width: 100%; border-collapse: collapse; font: 650 0.75rem/1.45 var(--mono); white-space: nowrap; }
  .result-table th, .result-table td { padding: 1.15rem 0.8rem; text-align: right; border-bottom: 1px solid var(--line); }
  .result-table th:first-child, .result-table td:first-child { padding-left: 0; text-align: left; }
  .result-table thead th { color: var(--muted); font-size: 0.63rem; letter-spacing: 0.07em; }
  .result-table tbody th { color: var(--ink-soft); }
  .result-positive { color: oklch(0.43 0.12 145); }
  .result-caution { color: var(--accent); }
  .reading-note { margin-top: 1.75rem; padding: 1.2rem 1.35rem; color: var(--ink-soft); background: var(--accent-soft); border: 1px solid oklch(0.79 0.06 45); }
  .reading-note strong { font: 760 0.68rem/1.3 var(--mono); letter-spacing: 0.06em; }
  .reading-note p { margin-top: 0.45rem; font-size: 0.87rem; }

  .history-list { border-top: 1px solid var(--line); }
  .history-list article { min-height: 11rem; padding: 1.7rem 0; display: grid; grid-template-columns: 7rem 1fr 1.8fr; gap: 1.5rem; border-bottom: 1px solid var(--line); }
  .history-list article > div { display: flex; flex-direction: column; gap: 0.7rem; }
  .history-list time { font: 750 0.7rem/1.3 var(--mono); }
  .history-list p { color: var(--muted); }

  .security-grid h2 { max-width: 10ch; }
  .security-grid > div:first-child > p:last-child { max-width: 32rem; margin-top: 1.5rem; color: var(--light-muted); }
  .check-list { list-style: none; border-top: 1px solid oklch(0.42 0.02 54); }
  .check-list li { min-height: 4.3rem; padding: 1rem 0; display: grid; grid-template-columns: 4.5rem 1fr; gap: 1rem; align-items: center; color: var(--light-muted); border-bottom: 1px solid oklch(0.42 0.02 54); }
  .check-list span { color: var(--accent-soft); font: 750 0.7rem/1.3 var(--mono); }
  .security-foot { margin-top: 2rem; display: flex; gap: 1rem 2rem; flex-wrap: wrap; color: var(--light-muted); font-size: 0.68rem; }

  .method-list { list-style: none; border-top: 1px solid var(--line); }
  .method-list li { min-height: 8rem; padding: 1.5rem 0; display: grid; grid-template-columns: 3rem 1fr; gap: 1rem; border-bottom: 1px solid var(--line); }
  .method-list li > span { color: var(--accent); font: 750 0.7rem/1.5 var(--mono); }
  .method-list p { margin-top: 0.45rem; color: var(--muted); }
  .method-cta { margin-top: 3rem; padding: 1.4rem 0; display: flex; align-items: center; justify-content: space-between; gap: 2rem; border-top: 2px solid var(--ink); border-bottom: 1px solid var(--line); }
  .method-cta p { max-width: 33rem; font-weight: 650; }

  .manual-hero .button { margin-top: 2rem; }
  .manual-example-grid > div > p:last-child { max-width: 34rem; margin-top: 1.6rem; color: var(--light-muted); line-height: 1.7; }
  .manual-example pre { max-width: 100%; overflow-x: auto; padding: clamp(1.3rem, 3vw, 2.2rem); color: var(--light-ink); background: oklch(0.2 0.014 54); border: 1px solid oklch(0.42 0.02 54); }
  .manual-example code { font: 600 0.78rem/1.65 var(--mono); }
  .command-list { border-top: 1px solid var(--line); }
  .command-list > div { min-height: 6rem; padding: 1.3rem 0; display: grid; grid-template-columns: 3rem minmax(0, 1fr); gap: 1rem; align-items: start; border-bottom: 1px solid var(--line); }
  .command-list span { color: var(--accent); font: 750 0.7rem/1.5 var(--mono); }
  .command-list code { overflow-wrap: anywhere; color: var(--ink-soft); font: 650 0.76rem/1.65 var(--mono); }

  .cookie-policy-intro h2 { max-width: 9ch; }
  .cookie-current { padding: clamp(1.6rem, 3vw, 2.5rem); color: var(--light-ink); background: var(--accent-dark); }
  .cookie-current strong { font: 750 0.69rem/1.4 var(--mono); letter-spacing: 0.07em; }
  .cookie-current p { margin-top: 1.2rem; color: oklch(0.88 0.018 70); }
  .policy-section { padding-block: clamp(3rem, 6vw, 5rem); display: grid; grid-template-columns: 4fr 8fr; gap: clamp(2rem, 6vw, 7rem); border-top: 1px solid var(--line); }
  .policy-section:first-of-type { margin-top: clamp(4rem, 8vw, 8rem); }
  .policy-section > div:first-child { display: grid; grid-template-columns: 2.5rem 1fr; align-items: start; gap: 0.8rem; }
  .policy-section h2 { font-size: clamp(1.7rem, 3vw, 3rem); }
  .policy-index { color: var(--accent); font: 750 0.7rem/1.7 var(--mono); }
  .policy-copy { max-width: 48rem; }
  .policy-copy p + p { margin-top: 1.2rem; }
  .policy-copy p { color: var(--muted); line-height: 1.7; }
  .policy-copy strong { color: var(--ink); }
  .policy-copy .button { margin-top: 1.6rem; border: 0; cursor: pointer; }
  .cookie-table-wrap { overflow-x: auto; }
  .cookie-table { width: 100%; border-collapse: collapse; font-size: 0.78rem; }
  .cookie-table th, .cookie-table td { padding: 1.1rem 0.8rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
  .cookie-table th:first-child, .cookie-table td:first-child { padding-left: 0; }
  .cookie-table thead th { color: var(--muted); font: 700 0.62rem/1.4 var(--mono); letter-spacing: 0.06em; }
  .cookie-table tbody th { font-weight: 650; }
  .cookie-table code { font: 650 0.7rem/1.5 var(--mono); }

  .footer-brand { display: flex; align-items: center; gap: 0.8rem; color: var(--light-ink); }
  .footer-owner { max-width: 19rem; font-size: 0.86rem; }
  .footer-owner a { color: var(--light-ink); }
  .footer-agents { max-width: 26rem; font: 600 0.7rem/1.5 var(--mono); }
  .site-footer nav { display: flex; justify-content: flex-end; gap: 0.75rem 1.35rem; flex-wrap: wrap; font-size: 0.78rem; font-weight: 650; }
  .site-footer small { font: 600 0.63rem/1.5 var(--mono); letter-spacing: 0.05em; }
  .footer-cookie-button { padding: 0; color: var(--light-muted); background: transparent; border: 0; border-bottom: 1px solid oklch(0.49 0.02 54); font: 650 0.7rem/1.5 var(--mono); cursor: pointer; }

  .cookie-banner { position: fixed; z-index: 50; right: 1rem; bottom: 1rem; left: 1rem; width: min(calc(100% - 2rem), 78rem); max-height: calc(100vh - 2rem); margin-inline: auto; padding: clamp(1.2rem, 2.4vw, 2rem); display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: clamp(1.5rem, 4vw, 4rem); align-items: end; overflow-y: auto; color: var(--light-ink); background: var(--ink); border: 1px solid oklch(0.48 0.025 54); box-shadow: 0 1rem 3rem oklch(0.15 0.018 54 / 0.24); }
  .cookie-banner[hidden] { display: none; }
  .cookie-label { margin-bottom: 0.6rem; color: var(--accent-soft); font: 750 0.62rem/1.4 var(--mono); letter-spacing: 0.09em; }
  .cookie-banner h2 { max-width: none; font-size: clamp(1.35rem, 2.2vw, 2rem); line-height: 1.08; letter-spacing: -0.005em; }
  .cookie-banner-copy > p:not(.cookie-label) { max-width: 68ch; margin-top: 0.75rem; color: var(--light-muted); font-size: 0.82rem; }
  .cookie-categories { margin-top: 0.85rem; display: flex; gap: 0.6rem 1.2rem; flex-wrap: wrap; color: var(--light-ink); font-size: 0.75rem; }
  .cookie-categories label { display: inline-flex; align-items: center; gap: 0.45rem; cursor: pointer; }
  .cookie-categories input { width: 1rem; height: 1rem; margin: 0; accent-color: var(--accent); }
  .cookie-banner-copy > a { display: inline-block; margin-top: 0.75rem; color: var(--light-ink); font-size: 0.73rem; }
  .cookie-actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.65rem; }
  .cookie-actions button { min-height: 2.85rem; padding: 0.7rem 0.9rem; color: var(--light-ink); background: transparent; border: 1px solid oklch(0.56 0.03 54); border-radius: 0.3rem; font-size: 0.75rem; font-weight: 730; cursor: pointer; white-space: nowrap; }
  .cookie-actions button:hover { color: var(--ink); background: var(--accent-soft); border-color: var(--accent-soft); }
}

@layer responsive {
  @media (max-width: 980px) {
    .hero { min-height: auto; }
    .hero-copy { grid-column: 1 / span 7; }
    .hero-system { grid-column: 8 / -1; }
    .manifesto-grid > .section-label { grid-column: 1 / span 3; }
    .manifesto-grid > div { grid-column: 4 / -1; }
    .manifesto-note { grid-column: 4 / span 6; margin-top: 3rem; }
    .principles .section-intro, .history-section .section-intro, .method .section-intro, .manual-flow .section-intro, .manual-commands .section-intro { grid-column: 1 / span 5; }
    .principle-list, .history-list, .method-list, .method-cta, .manual-flow .method-list, .command-list { grid-column: 6 / -1; }
    .evidence-copy { grid-column: 1 / span 6; }
    .evidence-stats { grid-column: 7 / -1; }
    .page-hero > div:first-child { grid-column: 1 / span 8; }
    .page-summary { grid-column: 9 / -1; }
    .rationale-grid > .section-label { grid-column: 1 / span 3; }
    .rationale-copy { grid-column: 4 / span 6; }
    .rationale-note { grid-column: 10 / -1; }
    .research-grid .section-label { grid-column: 1 / span 3; }
    .research-grid h2 { grid-column: 4 / span 4; }
    .research-grid p:not(.section-label) { grid-column: 8 / -1; }
    .research-grid .button { grid-column: 8 / -1; margin-top: 1.5rem; justify-self: start; }
    .result-heading { grid-column: 1 / span 5; }
    .result-table-wrap, .reading-note { grid-column: 6 / -1; }
    .history-list article { grid-template-columns: 6.5rem 1fr; }
    .history-list article p { grid-column: 2; }
  }

  @media (max-width: 760px) {
    .page-grid { width: min(90vw, 42rem); display: block; }
    .site-header { min-height: auto; padding: 1rem 5vw; align-items: flex-start; }
    .site-nav { display: grid; grid-template-columns: auto auto; gap: 0.5rem 1.1rem; text-align: right; }
    .site-nav .nav-access { padding: 0; color: var(--light-muted); background: transparent; }
    .hero, .page-hero { padding-block: 4.5rem; }
    h1, .page-hero h1 { font-size: clamp(3rem, 14vw, 5.4rem); letter-spacing: 0.004em; }
    .hero-system { margin-top: 4rem; box-shadow: 0.9rem 0.9rem 0 var(--accent-soft); }
    .manifesto-grid > div { margin-top: 2rem; }
    .manifesto-note { margin-top: 3rem; }
    .principle-list, .evidence-stats, .history-list, .method-list { margin-top: 3rem; }
    .evidence-copy { margin-bottom: 3rem; }
    .live-copy { margin-top: 2rem; }
    .page-summary { margin-top: 3rem; }
    .rationale-copy { margin-top: 2rem; }
    .rationale-note { margin-top: 3rem; }
    .roadmap { padding-bottom: 5rem; }
    .roadmap-row { min-height: 0; padding: 2.5rem 0; grid-template-columns: 1fr auto; gap: 1.5rem; }
    .roadmap-row::before { display: none; }
    .roadmap-body { grid-column: 1 / -1; grid-row: 2; }
    .roadmap-row time { grid-column: 2; grid-row: 1; }
    .research-grid h2, .research-grid > p:not(.section-label), .research-grid .button { margin-top: 1.5rem; }
    .result-table-wrap { margin-top: 3rem; }
    .history-list article { grid-template-columns: 1fr; }
    .history-list article p { grid-column: auto; }
    .check-list { margin-top: 3rem; }
    .method-cta { flex-direction: column; align-items: flex-start; }
    .manual-example-grid > pre { margin-top: 3rem; }
    .command-list { margin-top: 3rem; }
    .cookie-current { margin-top: 2.5rem; }
    .policy-section { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
    .policy-section:first-of-type { margin-top: 4rem; }
    .cookie-banner { grid-template-columns: 1fr; align-items: start; }
    .site-footer { grid-template-columns: 1fr; min-height: 22rem; }
    .site-footer small { grid-column: auto; }
    .site-footer .footer-cookie-button { grid-column: auto; justify-self: start; }
    .site-footer nav { justify-content: flex-start; }
  }

  @media (max-width: 430px) {
    .brand > span:last-child { max-width: 3.5rem; line-height: 1.05; }
    .site-nav { font-size: 0.7rem; }
    .principle-list li { grid-template-columns: 2.2rem 1fr; }
    .principle-list .row-state { grid-column: 2; }
    .evidence-stats { grid-template-columns: 1fr; }
    .evidence-stats div { min-height: 8rem; }
    .endpoint { grid-template-columns: auto 1fr; }
    .endpoint > span:last-child { grid-column: 2; }
    .roadmap-row { display: block; }
    .roadmap-row time { display: block; margin-top: 0.8rem; }
    .roadmap-body { margin-top: 2rem; }
    .roadmap-body ul { display: grid; }
    .site-footer nav { flex-wrap: wrap; }
    .cookie-actions { grid-template-columns: 1fr; }
    .cookie-actions button { white-space: normal; }
  }

  @media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
  }
}