:root { --ink:#262a2d; --muted:#626970; --accent:#286580; --pale:#f6f7f8; --line:#e4e7e9; font-family:Arial,Helvetica,sans-serif; color:var(--ink); background:#fff; }
* { box-sizing:border-box; }
body { margin:0; font-size:16px; line-height:1.6; }
a { color:var(--accent); text-underline-offset:3px; }
button,a { -webkit-tap-highlight-color:transparent; }
a:focus-visible,button:focus-visible,summary:focus-visible,[tabindex]:focus-visible { outline:3px solid var(--accent); outline-offset:4px; }
.wrap { max-width:1020px; margin:auto; padding-left:30px; padding-right:30px; }
.skip { position:absolute; left:20px; top:-100px; padding:10px; background:white; z-index:2; }
.skip:focus { top:12px; }
.hero { text-align:center; padding-top:46px; padding-bottom:30px; }
.venue { color:var(--muted); font-size:14px; margin:0 0 12px; }
h1 { font-size:clamp(38px,6vw,58px); line-height:1.12; letter-spacing:-2px; margin:0 0 14px; font-weight:750; }
.subtitle { font-size:clamp(20px,2.5vw,26px); line-height:1.4; max-width:850px; margin:0 auto 20px; text-wrap:balance; }
.authors { display:flex; flex-wrap:wrap; justify-content:center; gap:2px 20px; font-size:16px; margin:0 0 5px; font-weight:600; }
sup { font-size:.65em; margin-left:2px; }
.affiliations { display:flex; flex-wrap:wrap; justify-content:center; gap:2px 16px; font-size:12px; color:var(--muted); margin:0; }
.hero-summary { max-width:810px; margin:0 auto; color:var(--muted); font-size:16px; }
.actions { display:flex; flex-wrap:wrap; justify-content:center; gap:9px; margin:22px 0 24px; }
.button { display:inline-flex; align-items:center; gap:8px; padding:8px 17px; border:1px solid var(--ink); border-radius:24px; background:var(--ink); color:#fff; text-decoration:none; font-size:14px; font-weight:600; line-height:1.5; }
.button:hover { background:#454d53; border-color:#454d53; }
.button svg { width:17px; height:17px; flex:none; }
.section { padding-top:34px; padding-bottom:34px; }
.section::before { content:""; display:block; border-top:1px solid var(--line); margin-bottom:28px; }
h2 { font-size:28px; line-height:1.25; letter-spacing:-.6px; margin:0 0 16px; }
h3 { font-size:18px; line-height:1.4; margin:0 0 10px; }
p { margin:0 0 16px; }
.lead { font-size:16px; margin:0 0 14px; }
figure { margin:0; }
img { display:block; max-width:100%; height:auto; }
.wide-figure { margin:22px 0 28px; }
.wide-figure a { display:block; }
figcaption { color:var(--muted); font-size:12px; line-height:1.55; margin:12px auto 0; max-width:850px; }
.two-column { display:grid; grid-template-columns:1fr 1fr; gap:30px; align-items:center; }
.dataset-details,.application-details { align-items:start; margin:24px 0; }
.dataset-details p,.application-details p { font-size:15px; margin:0 0 12px; }
.video-section { padding-top:22px; margin-top:18px; border-top:1px solid var(--line); }
.video-section p { font-size:15px; color:var(--muted); margin:0; }
video { width:100%; border-radius:4px; background:#222; display:block; }
.signal-section { margin-top:28px; padding-top:24px; border-top:1px solid var(--line); }
.signal-section>p { font-size:15px; }
.signal-figure { max-width:680px; margin:18px auto 0; }
.scope-note { font-size:14px; color:var(--muted); margin:20px 0 0; }
.table-scroll { overflow-x:auto; }
table { width:100%; border-collapse:collapse; font-size:15px; font-variant-numeric:tabular-nums; }
caption { text-align:left; font-weight:600; margin:8px 0 10px; }
th,td { padding:10px 16px; border-bottom:1px solid var(--line); text-align:right; white-space:nowrap; }
th:first-child { text-align:left; }
thead th { font-size:12px; background:var(--pale); }
.highlight { background:#edf4f6; }
.table-note { margin:8px 0 20px; font-size:12px; color:var(--muted); }
.protocols { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin:22px 0; }
.protocols h3 { font-size:16px; margin-bottom:6px; }
.protocols p { font-size:14px; margin:0; color:var(--muted); }
details { padding-top:14px; border-top:1px solid var(--line); font-size:14px; }
summary { cursor:pointer; font-weight:600; }
details p { margin:12px 0 0; color:var(--muted); }
.citation-head { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.citation-head h2 { margin:0; }
button { padding:7px 12px; background:#fff; border:1px solid var(--line); border-radius:6px; color:var(--ink); font:600 12px Arial,sans-serif; cursor:pointer; }
button:hover { background:var(--pale); }
pre { background:var(--pale); border-radius:6px; padding:18px; margin:16px 0 0; font-size:12px; line-height:1.55; white-space:pre-wrap; overflow-wrap:anywhere; }
.copy-status { font-size:12px; color:var(--muted); margin:8px 0 0; }
.copy-status:empty { display:none; }
.footer { display:flex; justify-content:space-between; gap:16px; padding-top:18px; padding-bottom:24px; border-top:1px solid var(--line); font-size:12px; color:var(--muted); }
.footer>div { display:flex; gap:16px; }
.footer a { color:var(--muted); }
@media(max-width:450px) { .hero .actions { display:grid; grid-template-columns:repeat(2,1fr); max-width:280px; margin-left:auto; margin-right:auto; } .button { justify-content:center; } }
@media(max-width:700px) { .wrap { padding-left:20px; padding-right:20px; } body { font-size:15px; } .hero { padding-top:30px; padding-bottom:18px; } .venue { font-size:12px; } h1 { letter-spacing:-1.4px; } .subtitle { font-size:20px; } .authors { font-size:14px; gap:3px 14px; } .affiliations { font-size:11px; gap:3px 12px; } .hero-summary { font-size:15px; text-align:left; } .actions { gap:7px; margin:20px 0; } .button { padding:8px 13px; gap:6px; font-size:13px; } .button svg { width:15px; height:15px; } .section { padding-top:20px; padding-bottom:20px; } .section::before { margin-bottom:22px; } h2 { font-size:25px; } h3 { font-size:17px; } .two-column,.protocols { grid-template-columns:1fr; gap:18px; } .lead { font-size:15px; } .wide-figure { margin:18px 0 24px; } .signal-section { margin-top:24px; padding-top:20px; } th,td { padding:9px 12px; } .footer { flex-wrap:wrap; gap:8px; } pre { padding:14px; font-size:11px; } }