:root { color-scheme: light; font: 16px/1.6 system-ui, sans-serif; color: #183037; background: #f3f5f1; }
* { box-sizing: border-box; }
body { margin: 0; }
a { color: #075d6e; text-underline-offset: .2em; }
a:focus-visible, select:focus-visible, summary:focus-visible { outline: 3px solid #b76812; outline-offset: 4px; }
nav, main, footer { max-width: 1120px; margin: auto; padding: 24px; }
nav { display: flex; gap: 28px; border-bottom: 1px solid #ccd5cf; }
nav a:first-child { font-weight: 800; margin-right: auto; }
.intro { max-width: 850px; margin: 24px 0 32px; }
.eyebrow, .family { text-transform: uppercase; letter-spacing: .1em; font-size: .8rem; font-weight: 700; }
h1 { font-size: clamp(3rem, 8vw, 5.5rem); letter-spacing: -.055em; line-height: 1.05; margin: 12px 0; }
h2 { font-size: 2rem; line-height: 1.25; margin: 12px 0; }
h3 { font-size: 1.55rem; line-height: 1.25; margin: 12px 0; }
.subtitle { font-size: 1.6rem; }
.scope, .boundary { border-left: 3px solid #648178; padding-left: 16px; color: #40565c; }
#verification { padding: 14px 18px; background: #dfe9e2; border-radius: 8px; }
body[data-ready="error"] #verification { background: #f7deda; color: #7c2620; }
.portfolio-section { margin-top: 48px; padding-top: 24px; border-top: 1px solid #ccd5cf; scroll-margin-top: 24px; }
.section-intro { max-width: 800px; }
.analysis-checks { scroll-margin-top: 24px; }
.analysis-checks h2 { font-size: 1.4rem; }
.analysis-checks .section-intro p { margin: 8px 0; }
.verification-note { margin-top: 20px; }
.verification-note details { color: #40565c; }
.verification-note details p { max-width: 800px; }
.empty-state { padding: 24px; border: 1px dashed #afc1b9; border-radius: 8px; }
.filters { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin: 30px 0 12px; }
label { font-weight: 600; font-size: .85rem; }
select { display: block; width: 100%; margin-top: 6px; padding: 12px; border: 1px solid #afc1b9; border-radius: 6px; background: white; color: inherit; }
.section-count, .metadata { color: #4e6468; font-size: .88rem; }
.contrast-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; }
.contrast { padding: 26px; background: white; border: 1px solid #c6d3cb; border-top: 5px solid #306d60; border-radius: 10px; }
.contrast.synthetic { border-top-color: #817245; }
.contrast.empirical { border-top-color: #506b91; }
.control-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: start; }
.control-check { aspect-ratio: 1; padding: 20px; display: flex; flex-direction: column; gap: 12px; }
.control-check h3 { font-size: 1.4rem; margin: 0; }
.check-expected { margin: 0; color: #756434; font-size: .75rem; font-weight: 700; }
.check-copy { margin: 0; font-size: .88rem; }
.check-metric { margin: auto 0 0; }
.check-metric span, .check-metric strong { display: block; }
.check-metric span { font-size: .75rem; color: #4e6468; }
.check-metric strong { font-size: clamp(1.2rem, 2.2vw, 1.65rem); letter-spacing: -.03em; }
.control-check > .verdict { align-self: start; font-size: .73rem; }
.check-details { border-top: 1px solid #e1e5dd; padding-top: 10px; }
.check-details > summary { font-size: .8rem; }
.check-details .scores { grid-template-columns: 1fr; }
.verdict { display: inline-block; border-radius: 4px; padding: 3px 9px; font-size: .8rem; background: #e6eeea; }
.verdict.negative { background: #f7dfd5; color: #763b24; }
.verdict.not-evaluated, .verdict.indeterminate { background: #ececf0; color: #545266; }
dt { font-weight: 700; }
dd { margin: 0 0 12px; }
.scores { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.scores div { background: #f0f4f0; border-radius: 6px; padding: 12px; }
.scores span, .scores strong { display: block; }
.scores span { font-size: .8rem; }
.scores strong { font-size: 1rem; margin-top: 8px; }
.boundary, .null-result, .null-caveat, details { font-size: .87rem; }
.null-caveat { color: #755322; }
summary { cursor: pointer; font-weight: 600; }
.artifact-links { display: flex; flex-wrap: wrap; gap: 12px 20px; }
.protocol-census { width: 100%; border-collapse: collapse; margin: 20px 0; font-size: .85rem; }
.protocol-census caption { text-align: left; color: #4e6468; margin-bottom: 10px; }
.protocol-census th, .protocol-census td { text-align: left; vertical-align: top; padding: 10px 6px; border-bottom: 1px solid #dce4df; }
.protocol-census td span { display: block; font-size: .75rem; }
.experimental-protocol { border-top: 1px solid #dce4df; margin-top: 14px; padding-top: 14px; }
code { overflow-wrap: anywhere; font-size: .75rem; }
footer { margin-top: 36px; border-top: 1px solid #ccd5cf; color: #4e6468; }
@media (max-width: 740px) { .contrast-grid { grid-template-columns: 1fr; } .filters { grid-template-columns: repeat(2, minmax(0, 1fr)); } nav { flex-wrap: wrap; gap: 16px; } }
@media (max-width: 859px) { .control-grid { grid-template-columns: 1fr; } .control-check { aspect-ratio: auto; } .check-metric strong { font-size: 1.65rem; } }