:root {
  --sl-blue: #0071bc;
  --sl-logo-blue: #669ed3;
  --sl-green: #67a651;
  --sl-red: #d85e5d;
  --sl-orange: #f3aa68;
  --sl-ink: #16191d;
  --sl-gray: #656d77;
  --sl-rule: #dfe5eb;
  --display-font: "Space Grotesk", Arial, "Liberation Sans", Helvetica, sans-serif;
  --metric-font: "DM Mono", "SFMono-Regular", Consolas, monospace;
  --fig-w: 700px;
}

html { scroll-behavior: smooth; }
body { color: #33383f; background: #fff; font-family: Arial, "Liberation Sans", Helvetica, sans-serif; }
a { color: var(--sl-blue); text-decoration-thickness: 1px; text-underline-offset: .16em; }
p, .lead-abstract, .res-text, .fig-caption { text-wrap: pretty; }
.subtitle { color: var(--sl-gray); font-weight: 400; }
.skip-link { position: fixed; z-index: 10; top: -4rem; left: 1rem; padding: .55rem .8rem; border-radius: 0 0 .4rem .4rem; color: #fff; background: var(--sl-ink); text-decoration: none; transition: top .2s ease; }
.skip-link:focus { top: 0; }

/* The page follows the editorial proportions of the reference project page:
   940px media, 820px prose, and 700px inset figures. */
.hero { background: linear-gradient(180deg, #f7f9fc 0%, #eef3f9 100%); border-bottom: 1px solid rgba(0, 0, 0, .06); }
.response-demo-section { padding: 2.4rem 0 .65rem; background: #fff; }
.response-demo-heading { max-width: 790px; margin: 0 auto 1.15rem; text-align: center; }
.response-demo-heading .section-kicker { display: block; margin-bottom: .45rem; color: var(--sl-blue); font-size: .65rem; font-weight: 800; letter-spacing: .16em; }
.response-demo-heading h2 { margin: 0 0 .5rem; color: var(--sl-ink); font-family: var(--display-font); font-size: clamp(1.45rem, 2.5vw, 2rem); letter-spacing: -.02em; }
.response-demo-heading p { max-width: 680px; margin: 0 auto; color: var(--sl-gray); font-size: .9rem; line-height: 1.58; }
.response-demo { max-width: 900px; margin: 0 auto; padding: 1.05rem 1.2rem .82rem; border: 1px solid #dbe5ed; border-radius: .85rem; background: linear-gradient(145deg, #fbfdff, #f5f9fc); box-shadow: 0 10px 28px rgba(31, 52, 76, .055); }
.response-demo-top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-bottom: .85rem; border-bottom: 1px solid #e1e8ee; }
.demo-eyebrow { display: block; margin-bottom: .25rem; color: var(--sl-blue); font-family: var(--metric-font); font-size: .59rem; font-weight: 700; letter-spacing: .12em; }
.response-demo-top strong { color: var(--sl-ink); font-size: .88rem; font-weight: 700; }
.think-switch { display: inline-flex; align-items: center; gap: .48rem; padding: .25rem .45rem .25rem .25rem; border: 1px solid #ccd9e3; border-radius: 999px; color: #4e6270; background: #fff; cursor: pointer; font-family: var(--metric-font); font-size: .64rem; font-weight: 700; letter-spacing: .08em; line-height: 1; transition: border-color .18s, box-shadow .18s, color .18s; }
.think-switch:hover, .think-switch:focus-visible { border-color: var(--sl-logo-blue); color: var(--sl-logo-blue); box-shadow: 0 0 0 3px rgba(0, 113, 188, .1); outline: none; }
.switch-track { display: inline-flex; align-items: center; width: 2.2rem; height: 1.22rem; padding: .14rem; border-radius: 999px; background: #8796a1; transition: background .2s; }
.switch-thumb { display: block; width: .94rem; height: .94rem; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(21, 37, 51, .23); transform: translateX(0); transition: transform .2s; }
.response-demo[data-state="strict"] .switch-track { background: #5d9d6d; }
.response-demo[data-state="strict"] .switch-thumb { transform: translateX(.98rem); }
.demo-question { display: flex; align-items: baseline; gap: .85rem; padding: .82rem 0 .68rem; }
.demo-question > span, .demo-pane-head > span { color: #7d8b96; font-family: var(--metric-font); font-size: .61rem; font-weight: 700; letter-spacing: .11em; }
.demo-question p { margin: 0; color: var(--sl-ink); font-family: Georgia, serif; font-size: 1.03rem; }
.demo-response-grid { display: grid; grid-template-columns: minmax(0, 1.42fr) minmax(180px, .78fr); gap: .72rem; }
.demo-pane { min-height: 128px; padding: .85rem .95rem .8rem; border: 1px solid #dde6ed; border-radius: .55rem; background: #fff; }
.demo-pane-trace { border-top: 3px solid #bd6b68; }
.demo-pane-answer { border-top: 3px solid #6b9a58; }
.demo-pane-head { display: flex; align-items: center; justify-content: space-between; gap: .45rem; margin-bottom: .75rem; }
.demo-pane-head strong { color: #5f6f7a; font-family: Georgia, serif; font-size: .92rem; font-style: italic; }
.demo-pane-head em { padding: .2rem .38rem; border: 1px solid #d9e4eb; border-radius: 999px; color: #768793; font-family: var(--metric-font); font-size: .55rem; font-style: normal; font-weight: 700; letter-spacing: .08em; }
.demo-pane-trace .demo-pane-head em { border-color: #edcecc; color: #ad6260; background: #fff7f6; }
.demo-trace, .demo-answer { margin: 0 0 .42rem; color: #354753; line-height: 1.55; }
.demo-trace { font-family: Georgia, serif; font-size: .97rem; }
.demo-answer { color: #4f9140; font-family: var(--display-font); font-size: 1.55rem; font-weight: 700; line-height: 1.2; }
.demo-trace-note, .demo-answer-note { display: block; color: #85939d; font-size: .7rem; line-height: 1.4; }
.demo-footer { display: flex; align-items: center; gap: .42rem; margin-top: .76rem; color: #80909b; font-family: var(--metric-font); font-size: .58rem; letter-spacing: .045em; }
.demo-status-dot { width: .42rem; height: .42rem; border-radius: 50%; background: #bd6b68; box-shadow: 0 0 0 3px rgba(189, 107, 104, .12); }
.response-demo[data-state="strict"] .demo-status-dot { background: #6b9a58; box-shadow: 0 0 0 3px rgba(107, 154, 88, .12); }
.demo-foot-rule { width: 1.4rem; height: 1px; margin-left: auto; background: #d7e1e8; }
.response-demo[data-state="strict"] .demo-pane-trace { border-top-color: #6b9a58; }
.response-demo[data-state="strict"] .demo-pane-trace .demo-pane-head em { border-color: #cde2d1; color: #5c8e64; background: #f6fbf5; }
.response-demo[data-state="strict"] .demo-trace { color: #7b8b83; font-style: italic; }
.title-main { color: var(--sl-ink); font-weight: 700; letter-spacing: -.035em; }
.brand-thinking { color: var(--sl-logo-blue); }.brand-inertia { color: var(--sl-green); }
.authors .au { white-space: nowrap; color: var(--sl-ink); }.authors sup { color: var(--sl-gray); }
.hero .subtitle.fs-4 { font-size: clamp(1.72rem, 3.2vw, 2.18rem) !important; line-height: 1.2; }
.hero .authors { font-size: 1.12rem; }
.hero .authors + .subtitle:not(.small) { font-size: 1.08rem; }
.hero .subtitle.small { font-size: .9rem !important; }
.hero .pill { font-size: 1rem; }
.affiliations { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: .38rem .72rem; }
.affiliation { display: inline-flex; align-items: center; gap: .28rem; white-space: nowrap; }
.affiliation sup { margin-right: .02rem; }
.affiliation-logo { display: inline-block; width: 1.08rem; height: 1.08rem; flex: 0 0 auto; object-fit: contain; vertical-align: middle; }
.affiliation-logo-thu { border-radius: 50%; }
.affiliation-logo-oxford { width: .86rem; height: 1.08rem; }
.affiliation-logo-stanford { width: .72rem; height: 1.08rem; }
.affiliations .affiliation-logo { width: auto !important; height: .9em !important; max-width: 1.05em !important; max-height: .9em !important; }
.pill { display: inline-flex; align-items: center; gap: .46rem; border-radius: 999px; padding: .45rem 1.08rem; font-size: .95rem; font-weight: 500; }.pill:hover { transform: translateY(-1px); }.button-icon { width: 1.25rem; height: 1.25rem; flex: 0 0 1.25rem; color: currentColor; }.button-icon-github { width: 1.3rem; height: 1.3rem; flex-basis: 1.3rem; }.button-note { margin-left: -.12rem; color: #aeb4bb; font-size: .72rem; }
.pill .button-icon { display: none; }
.pill::before { width: 1.3rem; height: 1.3rem; flex: 0 0 1.3rem; background-position: center; background-repeat: no-repeat; background-size: contain; content: ""; }
.pill[href^="https://arxiv.org/abs/"]::before { background-image: url("https://raw.githubusercontent.com/simple-icons/simple-icons/develop/icons/arxiv.svg"); filter: brightness(0) invert(1); }
.pill[href*="github.com"]::before { background-image: url("https://cdn.simpleicons.org/github/ffffff"); }
.pill[href*="huggingface.co/datasets"]::before { background-image: url("https://cdn.simpleicons.org/huggingface/FFD21E"); }

.main-video { position: relative; overflow: hidden; aspect-ratio: 16 / 9; border-radius: .8rem; background: #e7edf3; box-shadow: 0 8px 28px rgba(16, 25, 40, .12); }
.project-video { display: block; width: 100%; height: 100%; object-fit: cover; background: #e7edf3; }
.video-note { display: flex; align-items: center; justify-content: center; gap: .7rem; max-width: 940px; margin: .72rem auto 0; color: #4d5964; font-family: Georgia, "Times New Roman", serif; font-size: .9rem; font-style: italic; letter-spacing: .008em; line-height: 1.45; text-align: center; }.video-note::before, .video-note::after { width: 1.55rem; height: 1px; flex: 0 0 1.55rem; background: var(--sl-logo-blue); content: ""; }
.video-grid { position: absolute; inset: 0; opacity: .55; background-image: linear-gradient(rgba(102,158,211,.11) 1px, transparent 1px), linear-gradient(90deg, rgba(102,158,211,.11) 1px, transparent 1px), radial-gradient(circle at 20% 25%, rgba(103,166,81,.2), transparent 20%), radial-gradient(circle at 80% 72%, rgba(216,94,93,.18), transparent 24%); background-size: 34px 34px, 34px 34px, auto, auto; }
.video-placeholder { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; color: var(--sl-ink); text-align: center; }.video-placeholder p { color: var(--sl-blue); font-size: .76rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }.video-placeholder strong { font-size: clamp(1.25rem, 2.5vw, 2rem); font-weight: 700; }.video-placeholder small { margin-top: .35rem; color: var(--sl-gray); font-size: .83rem; }.play-button { display: grid; place-items: center; width: 4.15rem; height: 4.15rem; margin-bottom: 1.15rem; border: 1px solid rgba(0,113,188,.35); border-radius: 50%; color: #fff; background: var(--sl-blue); box-shadow: 0 5px 18px rgba(0,113,188,.25); cursor: pointer; }.play-button span { display: block; width: 0; height: 0; margin-left: .25rem; border-top: .55rem solid transparent; border-bottom: .55rem solid transparent; border-left: .78rem solid currentColor; }.video-corner { position: absolute; right: 1rem; bottom: .8rem; color: var(--sl-gray); font-family: ui-monospace, monospace; font-size: .6rem; letter-spacing: .09em; }
.figure-plain { max-width: var(--fig-w); margin-inline: auto; }.figure-plain img { display: block; width: 100%; height: auto; }.fig-caption { max-width: var(--fig-w); margin: .85rem auto 0; text-align: left; }

.section-title { margin-bottom: .35rem; color: var(--sl-ink); font-family: var(--display-font); font-weight: 700; letter-spacing: -.025em; }.section-rule { width: 3rem; height: 3px; margin-bottom: 1.75rem; border-radius: 2px; background: var(--sl-blue); }
.lead-abstract { font-size: 1.03rem; line-height: 1.75; text-align: justify; -webkit-hyphens: auto; hyphens: auto; orphans: 3; widows: 3; }.res-text { max-width: 820px; font-size: .98rem; line-height: 1.7; }.res-head { color: var(--sl-ink); font-weight: 700; }.res-head::before { display: inline-block; width: .45rem; height: .45rem; margin: 0 .55rem .13rem 0; border-radius: 50%; background: var(--sl-logo-blue); content: ""; }
.section-narrow { max-width: 820px; margin: 0 auto 2.25rem; }.takeaway { max-width: 820px; padding: .72rem 1rem; border-left: 3px solid var(--sl-logo-blue); border-radius: 0 .45rem .45rem 0; color: #3f4851; background: #f7fafd; line-height: 1.65; }.takeaway strong { color: var(--sl-ink); }.results-figure { max-width: 820px; }

/* Editorial result blocks: a strong heading, a framed visual, one claim, then the evidence. */
.page-wide { max-width: 940px; }
.paper-section { scroll-margin-top: 1rem; }
.section-heading { max-width: 820px; margin: 0 auto 1.65rem; }
.section-kicker { display: block; margin-bottom: .65rem; color: var(--sl-blue); font-family: var(--display-font); font-size: .86rem; font-weight: 700; letter-spacing: .14em; line-height: 1.2; text-transform: uppercase; }
.section-heading .section-title { margin-bottom: .55rem; font-size: clamp(1.85rem, 3.1vw, 2.62rem); line-height: 1.08; }
.section-dek { max-width: 760px; margin: 0; color: var(--sl-gray); font-size: 1.08rem; line-height: 1.58; }
.story-card { padding: 1rem 1.1rem 1.35rem; border: 1px solid #e0e7ef; border-radius: .85rem; background: #fff; box-shadow: 0 8px 25px rgba(31, 52, 76, .07); }
.story-card-muted { background: #f7f9fb; }
.story-card .figure-plain, .figure-shell .figure-plain { max-width: none; }
.story-label { display: flex; align-items: center; gap: .55rem; margin: .1rem 0 .8rem; color: var(--sl-gray); font-size: .73rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.story-index { display: inline-grid; place-items: center; width: 1.55rem; height: 1.55rem; border-radius: 50%; color: #fff; background: var(--sl-blue); font-size: .7rem; letter-spacing: 0; }
.story-card .fig-caption { max-width: 900px; margin-top: .8rem; padding: 0 .3rem; font-size: .84rem; line-height: 1.5; }
.motivation-panels { display: flex; flex-wrap: wrap; gap: .5rem 1.2rem; margin: .15rem .2rem .7rem; color: var(--sl-gray); font-size: .71rem; font-weight: 700; letter-spacing: .04em; }.motivation-panels b { color: var(--sl-blue); font-size: .82rem; }
.motivation-legend { display: flex; flex-wrap: wrap; gap: .4rem 1rem; max-width: 900px; margin: .72rem auto 0; padding: .55rem .7rem; border: 1px solid #e2e8ee; border-radius: .45rem; color: var(--sl-gray); background: #fbfcfd; font-size: .7rem; line-height: 1.45; }.motivation-legend span { display: inline-flex; align-items: center; gap: .38rem; }.motivation-legend strong { color: var(--sl-ink); }.legend-swatch { display: inline-block; width: .65rem; height: .65rem; border-radius: 50%; }.legend-etr { background: #5e9cce; }.legend-length { background: #e6a86a; }
.motivation-contrast { display: grid; grid-template-columns: 1fr auto 1fr; align-items: stretch; gap: .7rem; max-width: 820px; margin: 1.25rem auto 1rem; }.contrast-card { display: flex; flex-direction: column; justify-content: center; min-height: 88px; padding: .85rem 1rem; border: 1px solid #dfe7ef; border-radius: .65rem; background: #f8fafc; }.contrast-card-accent { border-color: #b9d5e7; background: #f1f8fc; }.contrast-kicker { display: block; margin-bottom: .28rem; color: var(--sl-blue); font-size: .66rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }.contrast-card strong { color: var(--sl-ink); font-size: .96rem; line-height: 1.3; }.contrast-card small { margin-top: .28rem; color: var(--sl-gray); font-size: .72rem; line-height: 1.35; }.contrast-symbol { display: grid; place-items: center; color: var(--sl-logo-blue); font-size: 1.45rem; font-weight: 700; }
.observation-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; max-width: 860px; margin: 1.15rem auto 1rem; }.observation-grid article { padding: .95rem 1.05rem; border-top: 3px solid #b9d5e7; border-radius: .55rem; background: #f7fafd; }.observation-grid article + article { border-top-color: #a8d1bb; }.observation-kicker { display: block; margin-bottom: .35rem; color: var(--sl-blue); font-size: .65rem; font-weight: 800; letter-spacing: .11em; }.observation-grid h3 { margin: 0 0 .3rem; color: var(--sl-ink); font-size: 1rem; }.observation-grid p { margin: 0; color: #4a535d; font-size: .83rem; line-height: 1.52; }.motivation-bridge { padding-top: 1rem; border-top: 1px solid #e2e8ee; }
.insight-callout { margin: 1.2rem 0 1rem; padding: 1.15rem 1.45rem 1.15rem 1.35rem; border-left: 4px solid var(--sl-logo-blue); border-radius: 0 .65rem .65rem 0; color: #394653; background: #f3f7fb; font-size: clamp(1.05rem, 1.6vw, 1.26rem); line-height: 1.45; }
.insight-callout p { margin: 0; }
.callout-kicker, .mini-kicker { display: block; margin-bottom: .35rem; color: var(--sl-blue); font-size: .7rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.story-copy { max-width: 860px; margin: 0 auto; color: #3f4851; font-size: 1.03rem; line-height: 1.7; }
.proxy-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; margin: 1.35rem auto .25rem; max-width: 900px; }
.proxy-item { display: flex; gap: .7rem; padding: .9rem .85rem; border: 1px solid #e2e8ee; border-radius: .65rem; background: rgba(255,255,255,.68); }
.proxy-number { display: grid; flex: 0 0 1.55rem; place-items: center; width: 1.55rem; height: 1.55rem; border-radius: 50%; color: #fff; background: var(--sl-gray); font-size: .68rem; font-weight: 800; }
.proxy-item strong { display: block; margin-bottom: .2rem; color: var(--sl-ink); font-size: .9rem; }.proxy-item em { display: block; margin-bottom: .35rem; color: var(--sl-blue); font-size: .7rem; font-style: normal; font-weight: 700; line-height: 1.35; }.proxy-item p { margin: 0; color: var(--sl-gray); font-size: .78rem; line-height: 1.45; }
.response-strip { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: center; gap: .6rem; margin: .15rem auto 1.15rem; padding: .9rem 1rem; border: 1px solid #e2e8ee; border-radius: .65rem; background: #f8fafc; text-align: center; }
.response-pipeline { grid-template-columns: 1fr auto 1.2fr auto 1fr auto 1.45fr; }
.response-strip > div:not(.response-arrow) { display: flex; flex-direction: column; gap: .1rem; }.response-label { color: var(--sl-blue); font-size: .64rem; font-weight: 800; letter-spacing: .13em; }.response-strip strong { color: var(--sl-ink); font-family: Georgia, serif; font-size: 1.7rem; font-weight: 700; }.response-strip small { color: var(--sl-gray); font-size: .7rem; }.response-arrow { color: var(--sl-logo-blue); font-size: 1.45rem; }
.response-insight-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; max-width: 860px; margin: 1.15rem auto 1rem; }.response-insight-grid article { padding: .95rem 1.05rem; border-top: 3px solid #8bbade; border-radius: .55rem; background: #f7fafd; }.response-insight-grid article + article { border-top-color: #a8d1bb; }.response-insight-grid h3 { margin: 0 0 .3rem; color: var(--sl-ink); font-size: 1rem; }.response-insight-grid p { margin: 0; color: #4a535d; font-size: .83rem; line-height: 1.52; }
.metric-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: .85rem; margin: 0 auto 1.2rem; max-width: 900px; }
.metric-card { position: relative; display: flex; flex-direction: column; min-height: 236px; padding: 1.15rem 1.18rem 1.1rem; overflow: hidden; border: 1px solid #dbe4eb; border-radius: .7rem; background: #fff; box-shadow: 0 6px 18px rgba(31, 52, 76, .045); }.metric-card-blue { --metric-accent: #4d8fbd; --metric-tint: #edf6fc; }.metric-card-green { --metric-accent: #6b9a58; --metric-tint: #f0f8ed; }.metric-card-red { --metric-accent: #bd6b68; --metric-tint: #fff1ef; }.metric-number { display: flex; align-items: center; gap: .44rem; margin-bottom: .75rem; color: var(--metric-accent); font-family: var(--display-font); line-height: 1; }.metric-index { display: grid; place-items: center; width: 2.05rem; height: 2.05rem; border: 1px solid currentColor; border-radius: 50%; background: var(--metric-tint); font-family: var(--metric-font); font-size: .72rem; font-weight: 500; }.metric-slash { color: #b7c3cc; font-size: 1.05rem; font-weight: 400; }.metric-code { font-size: 1.18rem; font-weight: 700; letter-spacing: .025em; }.metric-card h3 { margin: 0 0 .72rem; color: var(--sl-ink); font-family: var(--display-font); font-size: 1.48rem; line-height: 1.1; }.metric-name { margin: .1rem 0 .8rem; color: var(--sl-gray); font-size: .78rem; font-weight: 700; }.metric-card p:not(.metric-name) { color: #4a535d; font-size: .87rem; line-height: 1.5; }.metric-formula { display: block; margin-top: .9rem; color: currentColor; font-family: var(--metric-font); font-size: .7rem; opacity: .82; }
.measurement-ladder { display: grid; grid-template-columns: 142px 1fr; align-items: center; gap: 1rem; max-width: 900px; margin: 0 auto 1.05rem; padding: .7rem .15rem; border-top: 1px solid #d9e3eb; border-bottom: 1px solid #d9e3eb; }.ladder-source { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: .08rem; padding-right: 1rem; color: var(--sl-gray); }.ladder-source::after { position: absolute; top: 4%; right: 0; width: 1px; height: 92%; background: #d8e2e9; content: ""; }.ladder-source small { color: var(--sl-gray); font-size: .56rem; font-weight: 800; letter-spacing: .1em; line-height: 1.15; text-transform: uppercase; }.ladder-source strong { color: var(--sl-ink); font-family: Georgia, serif; font-size: 1.7rem; font-style: italic; line-height: 1; }.ladder-source em { color: #8995a0; font-size: .6rem; font-style: normal; line-height: 1.2; }.ladder-track { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: center; gap: .5rem; }.ladder-step { position: relative; display: flex; flex-direction: column; gap: .12rem; min-height: 74px; justify-content: center; padding: .35rem .62rem; border: 0; border-radius: 0; background: transparent; }.ladder-step::before { display: none; }.ladder-step b { display: block; margin-bottom: .28rem; color: currentColor; font-family: var(--metric-font); font-size: .62rem; font-weight: 500; }.ladder-step strong { color: var(--sl-ink); font-family: var(--display-font); font-size: .98rem; line-height: 1.1; }.ladder-step small { color: var(--sl-gray); font-size: .68rem; }.ladder-step-blue { color: var(--sl-blue); }.ladder-step-green { color: var(--sl-green); }.ladder-step-red { color: var(--sl-red); }.ladder-track > i { color: #a9b6c1; font-size: .85rem; font-style: normal; }
.metric-asks { display: block; margin: .7rem 0 .55rem; color: currentColor; font-size: .69rem; font-weight: 800; letter-spacing: .03em; line-height: 1.35; text-transform: uppercase; }.metric-scope { display: block; margin-top: auto; padding-top: .8rem; color: currentColor; font-family: ui-monospace, monospace; font-size: .68rem; font-weight: 700; }.metric-guard { display: block; margin-top: .35rem; color: var(--sl-gray); font-size: .68rem; line-height: 1.35; }.metric-rubric { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .85rem; }.metric-rubric span { padding: .28rem .4rem; border: 1px solid #e3d8d7; border-radius: 999px; color: #7e6664; background: #fffafa; font-size: .62rem; line-height: 1.2; }.metric-rubric .rubric-active { border-color: rgba(216,94,93,.52); color: #a64443; background: #fff0ef; font-weight: 800; }
.measurement-examples { max-width: 900px; margin: 1.2rem auto 1rem; padding: 1rem 1.1rem; border: 1px solid #dfe7ef; border-radius: .75rem; background: #f7f9fb; }.examples-heading { margin-bottom: .7rem; }.examples-heading h3 { margin: 0; color: var(--sl-ink); font-size: 1.08rem; }.example-row { display: grid; grid-template-columns: 1.45fr .9fr; gap: 1rem; align-items: center; padding: .62rem 0; border-top: 1px solid #e1e8ee; }.example-text { display: flex; flex-direction: column; gap: .18rem; }.example-label { color: var(--sl-blue); font-size: .65rem; font-weight: 800; letter-spacing: .1em; }.example-text code { color: #3f4b55; background: transparent; font-size: .78rem; }.example-reading { display: flex; flex-direction: column; gap: .12rem; color: var(--sl-gray); font-size: .72rem; }.example-reading strong { color: var(--sl-ink); font-size: .78rem; }.measurement-guardrail { display: flex; flex-wrap: wrap; justify-content: center; gap: .45rem; max-width: 900px; margin: 1rem auto; }.measurement-guardrail span { padding: .38rem .65rem; border: 1px solid #d8e3eb; border-radius: 999px; color: #496476; background: #f5f9fc; font-size: .7rem; font-weight: 700; }
.rubric-box { display: grid; grid-template-columns: minmax(180px, .75fr) 1.25fr; gap: 1.2rem; align-items: center; max-width: 900px; margin: 0 auto 1.25rem; padding: 1.1rem 1.25rem; border: 1px solid #dfe7ef; border-radius: .75rem; background: #f7fafd; }.rubric-box h3 { margin: 0; color: var(--sl-ink); font-size: 1.08rem; }.rubric-list { display: flex; flex-wrap: wrap; gap: .45rem; }.rubric-list span { padding: .42rem .6rem; border: 1px solid #d9e1e9; border-radius: 999px; color: var(--sl-gray); background: #fff; font-size: .72rem; }.rubric-list .rubric-active { border-color: rgba(216,94,93,.4); color: #aa4545; background: #fff7f6; font-weight: 700; }
.finding-block { display: grid; grid-template-columns: 118px 1fr; gap: 1.35rem; max-width: 900px; margin: 0 auto; padding: 1.1rem 0; border-top: 1px solid #dfe7ed; background: transparent; }.finding-meta { display: flex; flex-direction: column; gap: .35rem; color: var(--sl-gray); font-size: .67rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }.finding-number { color: var(--sl-blue); font-family: var(--metric-font); font-size: 2.1rem; letter-spacing: -.03em; line-height: 1; }.finding-body h3 { margin: 0 0 .35rem; color: var(--sl-ink); font-family: var(--display-font); font-size: 1.28rem; }.finding-body p { margin: 0 0 .75rem; color: #4a535d; font-size: .91rem; line-height: 1.55; }.finding-order { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; }.finding-order span { padding: .12rem .05rem; border-bottom: 2px solid currentColor; border-radius: 0; color: var(--sl-blue); background: transparent; font-family: var(--display-font); font-size: .91rem; font-weight: 700; }.finding-order i { color: var(--sl-gray); font-style: normal; font-weight: 700; }.finding-order small { margin-left: .4rem; color: var(--sl-gray); font-size: .7rem; }.finding-order-compact span:first-child { color: #a44d4c; background: transparent; }.finding-order-compact span:nth-of-type(2) { color: #4f9140; background: transparent; }
.definition-panel { display: grid; grid-template-columns: minmax(180px, .62fr) 1.38fr; gap: .7rem 1.4rem; max-width: 900px; margin: 0 auto 1.05rem; padding: .95rem 0 1rem; border-top: 1px solid #d7e2e9; border-bottom: 1px solid #d7e2e9; background: transparent; }.definition-panel h3 { margin: 0; color: var(--sl-ink); font-family: var(--display-font); font-size: 1.48rem; }.definition-panel > p { margin: 0; color: #3f4a55; font-size: .94rem; line-height: 1.62; }.definition-chips { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; padding-top: .7rem; border-top: 1px solid #dbe7f0; }.definition-chips span { padding: .18rem 0; border: 0; color: #3e647e; background: transparent; font-family: var(--display-font); font-size: .73rem; font-weight: 600; }.definition-chips i { color: var(--sl-logo-blue); font-style: normal; }
.figure-shell { max-width: 900px; margin: 1.25rem auto; padding: .65rem 0 .85rem; border-top: 1px solid #d7e2e9; border-bottom: 1px solid #d7e2e9; background: transparent; }.figure-shell-head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; margin: 0 .2rem .65rem; color: var(--sl-gray); font-size: .68rem; letter-spacing: .09em; text-transform: uppercase; }.figure-shell-head strong { color: var(--sl-ink); font-size: .68rem; letter-spacing: .04em; }.figure-shell .fig-caption { max-width: none; margin-inline: .2rem; }
.finding-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 1.4rem; max-width: 900px; margin: 1rem auto 0; border-top: 1px solid #dfe7ed; }.finding-pair article { padding: .95rem 0 .2rem; border-radius: 0; background: transparent; }.finding-pair article + article { border-left: 1px solid #dfe7ed; padding-left: 1.4rem; }.finding-pair h3 { margin: 0 0 .35rem; color: var(--sl-ink); font-family: var(--display-font); font-size: 1.05rem; }.finding-pair p { margin: 0; color: #4a535d; font-size: .87rem; line-height: 1.55; }
.validation-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .8rem; max-width: 900px; margin: 0 auto 1.25rem; }.validation-card { display: flex; gap: .75rem; min-height: 130px; padding: 1rem; border: 1px solid #dfe7ef; border-radius: .7rem; background: #fff; }.validation-icon { display: grid; flex: 0 0 1.8rem; place-items: center; width: 1.8rem; height: 1.8rem; border-radius: .45rem; color: #fff; background: var(--sl-logo-blue); font-family: Georgia, serif; font-size: 1rem; font-weight: 700; }.validation-card strong { display: block; margin-bottom: .3rem; color: var(--sl-ink); font-size: .9rem; }.validation-card p { margin: 0; color: var(--sl-gray); font-size: .78rem; line-height: 1.5; }

.news-list { max-width: 820px; padding-left: 0; list-style: none; }.news-list li { display: grid; grid-template-columns: 6rem 1fr; gap: 1rem; padding: .45rem 0; }.news-list time { color: var(--sl-blue); font-family: ui-monospace, monospace; font-size: .82rem; font-weight: 700; }.news-list span { color: var(--sl-gray); }
.toc-wrap { border-left: 3px solid var(--sl-logo-blue); padding-left: 1.15rem; }.toc-list { display: grid; grid-template-columns: 1fr 1fr; gap: .55rem 2rem; margin: 0; padding-left: 1.3rem; }.toc-list a { color: var(--sl-gray); font-weight: 600; text-decoration: none; }.toc-list a:hover { color: var(--sl-blue); }

.metric-tabs { display: flex; flex-wrap: wrap; gap: .45rem; margin: 1.3rem 0 1rem; }.metric-tab { padding: .36rem .85rem; border: 1px solid rgba(0,0,0,.13); border-radius: 999px; color: var(--sl-gray); background: #fff; cursor: pointer; font-size: .84rem; transition: background .15s, color .15s, border-color .15s; }.metric-tab:hover, .metric-tab.active { border-color: var(--sl-logo-blue); color: #fff; background: var(--sl-logo-blue); }.metric-tab span { margin-right: .35rem; opacity: .63; font-family: ui-monospace, monospace; font-size: .68rem; }.metric-description { min-height: 3.25rem; margin-bottom: 1.3rem; padding: .8rem 1rem; border-left: 3px solid var(--sl-logo-blue); border-radius: 0 .45rem .45rem 0; color: #3f4851; background: #f7fafd; line-height: 1.6; }.metric-table-wrap { overflow-x: auto; }.metric-table { width: 100%; border-collapse: collapse; font-size: .9rem; }.metric-table th, .metric-table td { padding: .72rem .78rem; border: 1px solid rgba(0,0,0,.1); text-align: left; vertical-align: top; }.metric-table thead th { color: var(--sl-ink); background: #f7f9fb; font-weight: 700; }.metric-table tbody th { width: 4rem; color: var(--sl-blue); font-family: ui-monospace, monospace; }.metric-table code { padding: .1rem .25rem; color: #4c5660; background: #f0f3f6; font-size: .84em; }

.result-statline { display: flex; flex-wrap: wrap; align-items: center; gap: .55rem; margin: 1rem 0 .9rem; }.result-statline b { color: var(--sl-gray); font-size: 1.1rem; }.result-statline small { margin-left: .45rem; color: var(--sl-gray); font-size: .82rem; }.stat-pill { display: inline-block; min-width: 4.5rem; padding: .6rem .9rem; border: 1px solid rgba(0,113,188,.23); border-radius: .65rem; color: var(--sl-blue); background: #fbfcfe; font-size: 1.15rem; font-weight: 700; text-align: center; }.stat-pill.warm { border-color: rgba(216,94,93,.28); color: var(--sl-red); }.stat-pill.cool { border-color: rgba(103,166,81,.35); color: #4f9140; }
.human-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; max-width: 650px; }.human-grid > div { padding: .9rem 1rem; border: 1px solid rgba(0,0,0,.09); border-radius: .7rem; background: #fbfcfe; }.human-grid strong { display: block; color: var(--sl-blue); font-size: 1.9rem; line-height: 1.1; }.human-grid span { color: var(--sl-gray); font-size: .78rem; }
.quick-start { margin-top: 1.25rem; }.bibtex-wrap { position: relative; padding: 1.1rem 1.2rem; border: 1px solid rgba(0,0,0,.11); border-radius: .7rem; background: #fbfcfe; }.bibtex-wrap pre { margin: 0; overflow-x: auto; color: #3d4650; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .83rem; line-height: 1.6; }.copy-bib { position: absolute; top: .7rem; right: .7rem; padding: .25rem .58rem; border: 1px solid rgba(0,0,0,.13); border-radius: .35rem; color: var(--sl-blue); background: #fff; cursor: pointer; font-size: .73rem; }.copy-status { display: block; min-height: 1rem; margin-top: .45rem; color: var(--sl-blue); font-size: .73rem; }
.reveal { opacity: 0; transform: translateY(30px); transition: opacity .8s cubic-bezier(.22,.68,.32,1), transform .8s cubic-bezier(.22,.68,.32,1); }.reveal.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; }.reveal { opacity: 1; transform: none; transition: none; } }
@media (max-width: 760px) { .proxy-grid, .metric-cards, .validation-grid, .observation-grid, .response-insight-grid { grid-template-columns: 1fr; }.rubric-box, .definition-panel { grid-template-columns: 1fr; }.measurement-ladder { grid-template-columns: 1fr; gap: .6rem; padding-block: .75rem; }.ladder-source { flex-direction: row; align-items: baseline; gap: .42rem; padding: 0 0 .55rem; border-bottom: 1px solid #d8e2e9; }.ladder-source::after { display: none; }.ladder-source strong { font-size: 1.45rem; }.ladder-track { grid-template-columns: 1fr; gap: .2rem; }.ladder-track > i { justify-self: center; transform: rotate(90deg); }.example-row { grid-template-columns: 1fr; gap: .3rem; }.finding-block { grid-template-columns: 1fr; gap: .55rem; }.finding-meta { flex-direction: row; align-items: baseline; }.finding-pair { grid-template-columns: 1fr; }.finding-pair article + article { border-top: 1px solid #dfe7ed; border-left: 0; padding-left: 0; }.response-strip { grid-template-columns: 1fr; gap: .35rem; }.response-arrow { transform: rotate(90deg); }.figure-shell-head { flex-direction: column; gap: .25rem; } }
@media (max-width: 680px) { .hero .display-4 { font-size: 2.55rem; }.toc-list { grid-template-columns: 1fr; }.news-list li { grid-template-columns: 4.6rem 1fr; }.human-grid { grid-template-columns: 1fr; max-width: 260px; }.video-placeholder strong { font-size: 1.2rem; }.video-placeholder small { font-size: .72rem; }.video-note { gap: .45rem; font-size: .78rem; }.video-note::before, .video-note::after { width: .8rem; flex-basis: .8rem; }.pill { font-size: .88rem; padding-inline: .9rem; }.story-card { padding-inline: .7rem; }.insight-callout { padding-inline: 1rem; }.section-heading .section-title { font-size: 1.6rem; }.motivation-contrast { grid-template-columns: 1fr; }.contrast-symbol { min-height: 1rem; transform: rotate(90deg); }.motivation-panels { gap: .35rem .8rem; } }
@media (max-width: 680px) { .response-demo-section { padding-top: 1.65rem; }.response-demo { padding: .9rem .7rem .72rem; }.response-demo-top { align-items: flex-start; flex-direction: column; gap: .7rem; }.think-switch { align-self: flex-start; }.demo-response-grid { grid-template-columns: 1fr; }.demo-question { gap: .55rem; }.demo-footer { flex-wrap: wrap; }.demo-foot-rule { display: none; } }

/* Compact response demo: the interaction carries the explanation. */
.response-demo-section { padding-top: 1.8rem; }
.response-demo-heading { margin-bottom: .85rem; }
.response-demo-heading h2 { font-size: clamp(1.45rem, 2.4vw, 1.9rem); }
.response-demo-heading p { margin-top: .25rem; color: #4d5964; font-family: Georgia, "Times New Roman", serif; font-size: .9rem; font-style: italic; letter-spacing: .008em; line-height: 1.45; }
.response-demo { padding: .72rem .95rem .62rem; border-radius: 1rem; }
.response-demo-top { padding-bottom: .72rem; }
.demo-eyebrow { margin-bottom: .12rem; font-size: .56rem; }
.response-demo-top strong { font-family: Georgia, serif; font-size: 1.22rem; font-weight: 700; }
.think-switch { padding: .2rem .42rem .2rem .22rem; }
.demo-response-grid { gap: .58rem; margin-top: .72rem; }
.demo-pane { min-height: 142px; padding: .78rem .88rem .72rem; }
.demo-pane-head { margin-bottom: .56rem; }
.demo-pane-head > span { display: inline-flex; align-items: baseline; gap: .3rem; }
.demo-pane-head > span::first-line { letter-spacing: .08em; }
.demo-pane-head strong { font-size: .9rem; }
.demo-trace { margin-bottom: 0; font-size: 1.01rem; line-height: 1.48; }
.demo-answer { margin-bottom: 0; font-size: 2rem; }
.demo-trace-note[hidden], .demo-answer-note[hidden] { display: none; }
.demo-footer { margin-top: .58rem; font-size: .55rem; }
.response-demo[data-state="strict"] .demo-pane-trace { border-top-style: dashed; background: #fbfdfb; }
.response-demo[data-state="strict"] .demo-trace { color: #83a08b; font-family: var(--metric-font); font-size: 1.35rem; }

/* Framed response board: use one visual surface instead of stacked AI-style cards. */
.response-demo-section .section-kicker { letter-spacing: .04em; text-transform: none; }
.response-demo { padding: 0 .95rem .72rem; border: 1px solid #dbe4ee; border-radius: 1rem; background: #f1f5fa; box-shadow: 0 12px 28px rgba(45, 67, 91, .08); }
.response-demo-top { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; margin: 0 -.95rem; padding: .9rem 1.15rem; border: 0; border-radius: 1rem 1rem 0 0; background: #dce7f2; }
.demo-eyebrow { margin-bottom: .14rem; color: #4f7599; font-family: var(--display-font); font-size: .67rem; font-weight: 700; letter-spacing: .02em; text-transform: none; }
.response-demo-top strong { color: #18232f; font-size: 1.18rem; }
.think-switch { border-color: rgba(82, 111, 137, .25); color: #314c64; background: rgba(255, 255, 255, .78); }
.response-demo-top .think-switch { grid-column: 2; grid-row: 1; justify-self: center; }
.demo-top-kicker { grid-column: 3; grid-row: 1; justify-self: end; color: var(--sl-ink); font-family: var(--display-font); font-size: .82rem; font-weight: 700; letter-spacing: .01em; white-space: nowrap; }
.switch-label { font-family: var(--display-font); font-size: .69rem; font-weight: 700; letter-spacing: 0; text-transform: none; }
.demo-response-grid { margin-top: 1rem; padding: 0 .05rem; }
.demo-pane { min-height: 112px; padding: .66rem .82rem .58rem; border: 0; border-radius: .78rem; box-shadow: none; }
.demo-pane-trace { background: #d2e4f2; }
.demo-pane-answer { background: #d2e4f2; }
.demo-pane-head { color: #395b78; }
.demo-pane-head > span { color: inherit; font-family: var(--display-font); font-size: .87rem; font-weight: 600; letter-spacing: 0; }
.demo-pane-head strong { color: inherit; font-family: Georgia, serif; font-size: 1.05rem; }
.demo-pane-head em { border-color: rgba(255, 255, 255, .55); color: #fff; background: rgba(255, 255, 255, .13); font-family: var(--display-font); font-size: .63rem; font-weight: 600; letter-spacing: 0; text-transform: none; }
.demo-pane-answer .demo-pane-head { color: #395b78; }
.demo-pane-answer .demo-pane-head em { border-color: rgba(57, 91, 120, .25); color: #395b78; background: rgba(255, 255, 255, .42); }
.demo-trace { color: #18232d; font-size: .98rem; line-height: 1.42; }
.demo-answer { color: #397e3b; font-size: 1.85rem; }
.demo-footer { margin: .7rem .15rem 0; padding-top: .62rem; border-top: 1px solid #d6e0ea; color: #60778b; font-family: var(--display-font); font-size: .7rem; letter-spacing: 0; }
.demo-foot-rule { background: #c4d1dd; }
.response-demo[data-state="strict"] .demo-pane-trace { border-top: 0; background: #d2e4f2; }
.response-demo[data-state="strict"] .demo-trace { color: #395b78; font-size: 1.2rem; }

@media (max-width: 680px) { .response-demo-top { display: flex; align-items: flex-start; flex-direction: column; gap: .55rem; }.response-demo-top .think-switch { align-self: center; order: 2; }.demo-top-kicker { align-self: flex-end; order: 3; }.response-demo-top > div { order: 1; } }