:root { color-scheme: light; --paper:#f5f3ef; --ink:#1a1a1a; --muted:#59554f; --line:#ded9d0; --accent:#235c49; }
*, *::before, *::after { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:'Source Sans 3',system-ui,sans-serif; font-size:17px; line-height:1.65; -webkit-font-smoothing:antialiased; }
a { color:var(--accent); text-underline-offset:3px; }
a:hover { text-decoration-thickness:2px; }
button { font:inherit; }
:focus-visible { outline:3px solid #a56619; outline-offset:4px; }
[hidden] { display:none !important; }
h1,h2,h3 { font-family:'Newsreader',Georgia,serif; line-height:1.16; font-weight:600; }
h1,h2,h3,p { margin:0; }
h1 { font-size:clamp(37px,6vw,60px); max-width:760px; letter-spacing:-.025em; }
h2 { font-size:30px; }
h3 { font-size:25px; }
p + p { margin-top:12px; }
.wrap { max-width:960px; margin:0 auto; padding:0 24px; }
.skip-link { position:absolute; left:16px; top:-100px; padding:12px; background:white; z-index:5; }
.skip-link:focus { top:12px; }
.site-header { background:var(--ink); color:white; padding:22px 0 42px; }
.site-name { display:inline-block; margin-bottom:15px; color:#eee9df; text-decoration:none; font-family:'Newsreader',Georgia,serif; font-size:23px; }
.site-nav { display:flex; flex-wrap:wrap; gap:0 7px; border-bottom:1px solid #45413a; padding-bottom:10px; margin-bottom:25px; }
.site-nav a { padding:9px 10px; min-height:44px; font-family:'JetBrains Mono',monospace; font-size:12px; color:#bfbab2; text-decoration:none; border-bottom:2px solid transparent; }
.site-nav a:hover { color:white; }
.site-nav a[aria-current] { color:white; border-bottom-color:#dbc5a0; }
.eyebrow { font-family:'JetBrains Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:1px; color:#626057; }
.site-header .eyebrow { color:#d2bd9b; margin-bottom:12px; }
.lede { max-width:720px; color:#ded9d0; font-size:20px; line-height:1.55; margin-top:17px; }
.breadcrumb { margin:0 0 24px; font-size:14px; color:#c8c1b7; }
.breadcrumb a { color:#c8c1b7; }
.breadcrumb span { padding:0 8px; }
main { padding-top:32px !important; padding-bottom:36px !important; }
.intro { max-width:740px; font-size:20px; margin-bottom:24px; }
.section-heading { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:12px; margin:34px 0 18px; }
.section-heading p { color:var(--muted); font-size:15px; }
.legend { border:1px solid var(--line); border-radius:10px; background:#eeeae2; padding:16px 20px; margin:24px 0; }
.legend summary { cursor:pointer; font-weight:600; min-height:30px; }
.legend p { color:#49463f; font-size:15px; margin-top:10px; }
.legend ul { padding-left:20px; margin:12px 0 0; font-size:15px; }
.legend li + li { margin-top:6px; }
.filters { border:0; padding:0; margin:0 0 12px; }
.filters legend { font-size:14px; font-weight:600; margin-bottom:9px; }
.filter-options { display:flex; flex-wrap:wrap; gap:8px; }
.filters button { min-height:44px; padding:8px 16px; border:1px solid #b4afa5; border-radius:24px; background:transparent; color:#464138; cursor:pointer; font-size:14px; }
.filters button[aria-pressed=true] { background:var(--ink); border-color:var(--ink); color:white; }
.filters button:hover { border-color:var(--ink); }
.result-count { color:var(--muted); font-size:14px; margin-bottom:22px; }
.capability-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.capability-card { display:flex; flex-direction:column; background:white; border:1px solid var(--line); border-radius:10px; padding:25px; }
.capability-card .eyebrow { margin-bottom:12px; }
.capability-card h3 a { color:var(--ink); text-decoration:none; }
.capability-card h3 a:hover { text-decoration:underline; }
.capability-card p { color:var(--muted); font-size:16px; margin:12px 0 15px; }
.preview-list { list-style:none; margin:0 0 18px; padding:0; }
.preview-list li { border-top:1px solid #eeeae3; padding:10px 0; font-size:16px; line-height:1.4; }
.preview-list .type { display:block; margin:0 0 4px; }
.card-link { display:block; margin-top:auto; padding-top:8px; font-weight:600; }
.type,.readiness { display:inline-block; font-family:'JetBrains Mono',monospace; font-size:10px; line-height:1.5; letter-spacing:.25px; }
.type { color:#37634f; text-transform:uppercase; }
.readiness { background:#eeeae2; border:1px solid #ded8ca; color:#534b3e; border-radius:5px; padding:4px 8px; }
.readiness.emerging { color:#28533c; background:#e9f1e9; border-color:#cbdcc9; }
.readiness.breakthrough { background:#f3ebe0; border-color:#e0cdb3; color:#734f21; }
.capability-brief { display:grid; grid-template-columns:1fr 1fr; gap:24px; background:#eae7dd; border-left:3px solid #a78f67; border-radius:0 9px 9px 0; padding:22px 25px; margin-bottom:28px; }
.capability-brief h2 { font-size:21px; margin-bottom:8px; }
.capability-brief p { font-size:16px; color:#4b473e; }
.outcome-list { display:grid; gap:20px; }
.outcome-card { border:1px solid var(--line); background:white; border-radius:10px; padding:28px; scroll-margin-top:18px; }
.card-meta { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-bottom:14px; }
.outcome-card h3 { font-size:29px; margin-bottom:12px; }
.scenario { font-size:19px; color:#38372f; }
.explanation { margin:20px 0 0; display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.explanation dt { font-weight:600; font-size:14px; margin-bottom:5px; }
.explanation dd { margin:0; color:var(--muted); font-size:16px; }
.frontiers,.sources,.related { margin-top:36px; }
.frontiers > p { color:var(--muted); margin:12px 0 20px; }
.frontier { padding:20px 0; border-top:1px solid var(--line); }
.frontier h3 { font-size:24px; margin-bottom:10px; }
.frontier p { font-size:16px; }
.frontier .caveat { color:var(--muted); margin-top:8px; }
.sources { border-top:1px solid var(--line); padding-top:25px; }
.sources h2,.related h2 { font-size:25px; }
.sources p { color:var(--muted); font-size:14px; margin-top:10px; }
.sources ul { padding-left:21px; font-size:15px; }
.sources li { margin-bottom:8px; overflow-wrap:anywhere; }
.related-links { display:flex; flex-wrap:wrap; gap:10px; margin-top:15px; }
.related-links a { border:1px solid var(--line); background:white; border-radius:7px; padding:10px 15px; }
.bridge { margin-top:36px; padding:26px; border-radius:10px; background:var(--ink); color:#ece6db; }
.bridge h2 { color:white; font-size:27px; margin-bottom:12px; }
.bridge p { font-size:16px; }
.bridge a { color:#e2cda9; }
.bridge-links { display:flex; gap:10px 22px; flex-wrap:wrap; margin-top:18px; }
.bridge-links a { display:inline-block; padding:5px 0; }
.site-footer { border-top:1px solid var(--line); padding:24px 0 38px; color:var(--muted); font-size:13px; }
.site-footer .wrap { display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px 25px; }
.outcome-preview { display:block; margin:-10px 0; padding:12px 0; color:var(--ink); text-decoration:none; border-radius:4px; }
.preview-title { text-decoration:underline; text-decoration-color:#b4c1b7; text-underline-offset:4px; }
.outcome-preview:hover .preview-title { color:var(--accent); text-decoration-color:var(--accent); }
.read-details { display:block; color:var(--accent); font-size:14px; font-weight:600; margin-top:9px; text-decoration:underline; text-underline-offset:3px; }
.outcome-card > .read-details { display:inline-block; min-height:44px; padding:12px 0 0; }
.outcome-card h3 a { color:inherit; text-decoration-color:#b4c1b7; text-decoration-thickness:1px; text-underline-offset:5px; }
.outcome-card h3 a:hover { color:var(--accent); text-decoration-color:var(--accent); }
.outcome-dialog-ready .outcome-card { cursor:pointer; }
.outcome-dialog-ready .outcome-card:hover { border-color:#98ac9d; }
.detail-fallback { margin-top:25px; padding-top:20px; border-top:1px solid var(--line); scroll-margin-top:20px; }
.detail-fallback > summary { cursor:pointer; color:var(--accent); font-weight:600; margin-bottom:20px; }
.outcome-dialog { padding:0; width:min(780px,calc(100% - 40px)); max-width:none; max-height:calc(100vh - 48px); max-height:calc(100dvh - 48px); border:1px solid #c6bfb0; border-radius:13px; background:var(--paper); color:var(--ink); box-shadow:0 20px 90px #0005; overflow:hidden; }
.outcome-dialog[open] { display:flex; flex-direction:column; }
.outcome-dialog::backdrop { background:rgb(16 18 15 / .65); }
.dialog-topbar { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-shrink:0; padding:12px 20px 12px 30px; border-bottom:1px solid var(--line); background:var(--paper); }
.dialog-topbar > span { color:var(--muted); font-family:'JetBrains Mono',monospace; text-transform:uppercase; font-size:11px; letter-spacing:.8px; }
.dialog-close { display:grid; place-items:center; width:40px; height:40px; flex-shrink:0; border:1px solid #d1cbc0; border-radius:7px; background:transparent; color:#45413a; font-size:29px; line-height:1; cursor:pointer; }
.dialog-close:hover { color:#dc2626; border-color:#ef4444; background:#fef2f2; }
.dialog-content { min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:28px 34px 36px; }
.detail-copy { overflow-wrap:break-word; }
.detail-copy > .eyebrow { margin-bottom:11px; }
.detail-copy > h2 { font-size:clamp(28px,5vw,39px); letter-spacing:-.015em; }
.detail-readiness { color:var(--muted); font-family:'JetBrains Mono',monospace; font-size:11px; margin:12px 0 20px; }
.detail-copy .detail-lede { font-size:21px; line-height:1.5; margin-bottom:18px; }
.detail-copy > p:not(.eyebrow):not(.detail-readiness):not(.detail-lede) { color:#47443d; }
.detail-copy section { margin-top:26px; }
.detail-copy h3 { font-size:24px; margin-bottom:10px; }
.detail-copy ul,.detail-copy ol { padding-left:23px; margin:10px 0; }
.detail-copy li + li { margin-top:9px; }
.detail-caveat { border-left:3px solid #bba47e; padding:10px 14px; margin-top:17px; background:#eee9df; font-size:15px; }
.detail-sources { border-top:1px solid var(--line); padding-top:22px; }
.detail-sources p,.detail-sources li { font-size:14px; }
.detail-sources p { color:var(--muted); }
.detail-sources a { overflow-wrap:anywhere; }
.detail-permalink { display:inline-block; min-height:44px; padding:12px 0 0; margin-top:10px; font-size:14px; }
.detail-visual { margin:27px 0; padding:22px; border:1px solid #cec7b9; border-radius:8px; background:#ece9e1; }
.detail-visual figcaption { border-top:1px solid #d2cabb; padding-top:12px; margin-top:17px; font-size:14px; color:#565046; }
.visual-note { font-size:14px; color:#4c493f; }
.amdahl-controls { display:none; margin:20px 0; }
.interactive .amdahl-controls { display:grid; gap:17px; }
.amdahl-controls label { display:block; font-size:14px; font-weight:600; }
.amdahl-controls output { display:inline-block; min-width:3em; margin-left:7px; font-family:'JetBrains Mono',monospace; color:var(--accent); }
.amdahl-controls input { display:block; width:100%; min-height:30px; margin:7px 0 0; accent-color:var(--accent); cursor:pointer; }
.amdahl-result { font-weight:600; font-size:16px; margin:16px 0; }
.time-chart { margin:16px 0 20px; }
.bar-label { font-size:13px; margin:12px 0 6px; }
.time-track { display:flex; height:28px; width:100%; background:#fff9; border-right:1px solid #b7ad9a; }
.time-track > span { display:block; height:100%; flex-shrink:0; }
.unchanged { background:#6e685c; }
.accelerated { background:#39785d; }
.chart-key { display:flex; flex-wrap:wrap; gap:8px 18px; margin-top:12px; font-size:12px; }
.chart-key i { display:inline-block; width:12px; height:12px; margin-right:5px; }
.formula { font-family:'JetBrains Mono',monospace; font-size:12px; overflow-wrap:anywhere; margin:14px 0 8px; }
.detail-copy .process-flow { list-style:none; counter-reset:stage; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:23px 16px; padding:0; margin:18px 0; }
.process-flow li { counter-increment:stage; position:relative; padding:15px; background:#fffaf1; border:1px solid #d5ccbc; border-radius:6px; }
.detail-copy .process-flow li + li { margin:0; }
.process-flow strong { display:block; line-height:1.4; font-size:16px; }
.process-flow strong::before { content:counter(stage) '. '; color:var(--accent); }
.process-flow p { margin:8px 0 0; font-size:14px; line-height:1.5; }
.process-flow li:not(:last-child)::after { content:'↓'; position:absolute; bottom:-26px; left:calc(50% - 6px); font-size:18px; color:#5d6557; }
.process-flow li:nth-child(odd):not(:last-child)::after { content:'→'; bottom:auto; top:calc(50% - 15px); left:auto; right:-16px; }
.process-flow li:nth-child(even):not(:last-child)::after { content:'↙'; }
.feedback-loop { font-size:14px; font-weight:600; border-top:1px dashed #b2aa96; padding-top:13px; }
.feedback-loop > span { font-size:23px; margin-right:4px; }
.tradeoff-wrap { max-width:100%; }
.tradeoffs { width:100%; border-collapse:collapse; font-size:14px; line-height:1.45; table-layout:fixed; }
.tradeoffs caption { text-align:left; color:var(--muted); font-size:13px; margin-bottom:10px; }
.tradeoffs th,.tradeoffs td { text-align:left; vertical-align:top; padding:12px 10px; border-bottom:1px solid #ccc4b5; overflow-wrap:break-word; }
.tradeoffs thead th { background:#ded9cc; }
.tradeoffs tbody th { width:40%; }
@media(max-width:600px) {
  .wrap { padding-left:18px; padding-right:18px; }
  .site-header { padding-top:18px; padding-bottom:30px; }
  .site-nav { gap:0 3px; }
  .site-nav a { padding:9px 7px; font-size:11px; }
  .lede,.intro { font-size:18px; }
  .capability-grid,.capability-brief,.explanation { grid-template-columns:1fr; }
  .capability-card,.outcome-card { padding:22px; }
  .capability-brief { padding:20px; gap:17px; }
  .outcome-card h3 { font-size:26px; }
  .explanation { gap:16px; }
  .bridge { padding:23px; }
  .outcome-dialog { width:calc(100% - 20px); max-height:calc(100vh - 20px); max-height:calc(100dvh - 20px); border-radius:10px; }
  .dialog-topbar { padding:10px 12px 10px 20px; }
  .dialog-content { padding:23px 20px 28px; }
  .detail-copy .detail-lede { font-size:19px; }
  .detail-visual { padding:16px; margin:24px 0; }
  .detail-copy .process-flow { grid-template-columns:1fr; }
  .process-flow li:nth-child(n):not(:last-child)::after { content:'↓'; top:auto; bottom:-26px; left:calc(50% - 6px); right:auto; }
  .tradeoffs th,.tradeoffs td { padding:10px 7px; font-size:13px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
@media print {
  .site-header { background:white; color:black; padding:0; }
  .site-header .eyebrow,.lede,.site-name,.breadcrumb,.breadcrumb a { color:#333; }
  .site-nav,.filters,.bridge,.skip-link { display:none; }
  .capability-grid,.explanation { display:block; }
  .outcome-card,.capability-card { break-inside:avoid; margin-bottom:15px; }
}
