/* Hero layout adapted from OS-Symphony; see OS-SYMPHONY-LICENSE. */
:root { color-scheme: light; --ink: #173147; --muted: #55717f; --line: #d7e6ec; --accent: #267e91; --reading-width: 1000px; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 28px; }
body { margin: 0; color: var(--ink); background: #fff; font-family: Charter, Georgia, "Times New Roman", serif; line-height: 1.65; }
a { color: #237a9c; text-underline-offset: 3px; }
img { max-width: 100%; }
a:focus-visible, button:focus-visible, [tabindex]:focus-visible { outline: 3px solid #3aae9f; outline-offset: 5px; }
.header-wrapper { background: linear-gradient(138deg, #142b46 6%, #286c9c 56%, #6bbda4 100%); }
.header-outer { max-width: 1500px; margin: auto; }
.navbar { display: flex; justify-content: flex-start; gap: 18px; padding: 16px 50px; min-height: 70px; align-items: center; position: relative; z-index: 10; }
.research-menu { flex: 0 0 auto; }
.research-menu { position: relative; font-family: Arial, sans-serif; }
.research-toggle { border: 1px solid #c4e9ec55; border-radius: 24px; padding: 10px 19px; background: #ffffff09; color: #eefaf9; font: 600 14px/1.3 Arial, sans-serif; cursor: pointer; display: flex; align-items: center; gap: 14px; white-space: nowrap; }
.research-toggle:hover, .research-toggle[aria-expanded="true"] { background: #ffffff20; }
.research-chevron { display: block; width: 16px; height: 16px; flex: 0 0 16px; transform-origin: 50% 50%; transform-box: view-box; transition: transform .15s; }
.research-toggle[aria-expanded="true"] .research-chevron { transform: rotate(180deg); }
.research-links { position: absolute; top: calc(100% + 10px); left: 0; width: 350px; max-width: calc(100vw - 32px); max-height: min(680px, 78vh); overflow-y: auto; margin: 0; padding: 9px; list-style: none; background: #fff; border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 18px 60px #0d283e40; }
.research-links[hidden] { display: none; }
.research-links a { display: flex; align-items: center; gap: 13px; padding: 10px 11px; border-radius: 9px; color: var(--ink); text-decoration: none; font-size: 14px; font-weight: 700; line-height: 1.35; }
.research-links a:hover, .research-links a:focus-visible { background: #ecf7f6; }
.research-links img { height: 40px; width: 40px; flex-shrink: 0; object-fit: contain; border-radius: 7px; }
.research-links small { display: block; color: var(--muted); font-size: 11px; font-weight: 400; margin-top: 3px; }
.external-arrow { margin-left: auto; color: #79929c; }
#header-container { display: flex; align-items: center; justify-content: space-between; gap: 45px; padding: 32px 50px 68px; }
.header-content { width: 52%; color: #f5fbff; }
.header-content h1 { font-size: clamp(3.1rem, 4.9vw, 5rem); letter-spacing: -.045em; margin: 0 0 .18em; line-height: 1.2; color: #d6f8f3; }
.site-title { display: flex; align-items: center; gap: .15em; }
.site-title img { display: block; width: .84em; height: .84em; flex: 0 0 auto; }
.header-content .paper-subtitle { font-size: clamp(1.5rem, 2.2vw, 2.2rem); letter-spacing: -.018em; margin: 0 0 .6em; line-height: 1.22; color: #fff; }
.header-content strong { color: #c7f3bf; }
.header-content > p { font-size: 1.2rem; line-height: 1.55; color: #e8f6f8; }
.icon-container { display: flex; flex-direction: column; gap: 16px; }
.icon-item { display: flex; align-items: flex-start; color: #eef9fa; font-size: .96rem; line-height: 1.48; }
.icon-item img { flex: 0 0 auto; width: 30px; height: 30px; margin: 2px 1em 0 0; filter: brightness(0) invert(1); opacity: .9; }
.button-container { margin-top: 25px; display: flex; flex-wrap: wrap; gap: 9px; }
.button { display: inline-flex; align-items: center; gap: 8px; padding: 10px 15px; border: 2px solid #b5e4e7; border-radius: 20px; background: #e9f7f5; color: #164c67; font: 700 .83rem/1.4 Arial, sans-serif; text-decoration: none; }
a.button:hover { background: #d2eff2; }
.button img { width: 17px; height: 17px; object-fit: contain; }
.resource-pending { background: #e9f7f514; color: #e4f6f8; border-color: #b5e4e766; font-weight: 400; }
.resource-pending img { filter: brightness(0) invert(1); }
.header-image { width: 48%; }
.header-image img { display: block; width: 100%; height: auto; filter: drop-shadow(0 20px 26px #0b2b3f2e); }
d-article { display: block; max-width: 1320px; margin: 0 auto; padding: 0 40px 85px; }
.byline { border-bottom: 1px solid var(--line); padding: 28px 0 32px; }
.byline-container { text-align: center; }
.author-list { font-size: 1.08rem; line-height: 2.05; margin: 0; }
sup { font-size: .7em; }
.author-note { font: .8rem/1.5 Arial, sans-serif; color: var(--muted); margin: 12px 0 0; }
.affiliations { display: grid; grid-template-columns: repeat(8, minmax(0,1fr)); align-items: start; gap: 18px; margin: 30px auto 0; }
.affiliation { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; }
.affiliation img { width: 100%; height: 67px; object-fit: contain; }
.affiliation span { color: #526775; font: .7rem/1.5 Arial, sans-serif; }
.result-strip { display: grid; grid-template-columns: repeat(4,1fr); margin: 36px 0 30px; padding: 28px 0; background: #f3f9fa; border: 1px solid #e1edef; border-radius: 16px; }
.result-strip > div { text-align: center; display: flex; flex-direction: column; justify-content: center; gap: 10px; padding: 0 14px; border-right: 1px solid var(--line); }
.result-strip > div:last-child { border: 0; }
.result-strip strong { color: #247c85; font: 700 clamp(1.7rem,2.8vw,2.7rem)/1.2 Arial,sans-serif; letter-spacing: -.04em; }
.result-strip strong span { font-size: .52em; letter-spacing: 0; }
.result-strip > div > span { font: 600 .88rem/1.4 Arial,sans-serif; white-space: nowrap; }
.section-nav { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 6px; margin: 0; min-width: 0; flex: 1; }
.section-nav a { text-decoration: none; font: 600 .79rem/1.4 Arial,sans-serif; padding: 8px 10px; background: transparent; border: 1px solid transparent; border-radius: 20px; color: #e7f6f7; }
.section-nav a:hover { background: #ffffff18; border-color: #c4e9ec55; }
.paper-section { padding-top: 14px; margin-top: 64px; }
.paper-section + .paper-section { border-top: 1px solid var(--line); padding-top: 52px; }
.section-title { font-size: clamp(2.05rem,3.3vw,2.85rem); line-height: 1.2; color: #193c55; text-align: center; max-width: 1040px; margin: 0 auto 30px; letter-spacing: -.025em; }
.subsection-title { font-size: clamp(1.45rem,2.2vw,1.85rem); line-height: 1.3; color: #27526b; text-align: center; max-width: 1000px; margin: 48px auto 22px; }
.text { max-width: var(--reading-width); margin: 20px auto; font-size: 1.14rem; line-height: 1.8; }
.paper-figure { margin: 32px auto; max-width: 1130px; }
.paper-figure a { display: block; border-radius: 6px; }
.paper-figure img { width: 100%; height: auto; display: block; }
#sec\:overview .paper-figure { max-width: 820px; }
figcaption { max-width: 960px; margin: 16px auto 0; text-align: center; font: .84rem/1.65 Arial,sans-serif; color: var(--muted); }
.figure-hint { color: #257890; white-space: nowrap; }
.table-block { max-width: var(--reading-width); margin: 30px auto 40px; }
.table-container { width: 100%; overflow-x: auto; border: 1px solid #d8e5e9; border-radius: 12px; background: #fff; }
.data-table { border-collapse: collapse; width: 100%; min-width: 650px; color: #23475d; font: .95rem/1.45 Arial,sans-serif; font-variant-numeric: tabular-nums; }
.data-table caption { text-align: left; padding: 15px 18px; font-size: .9rem; font-weight: 700; color: #315d72; background: #f8fbfc; }
.data-table th, .data-table td { padding: 12px 10px; border-bottom: 1px solid #dfe9ed; text-align: right; white-space: nowrap; }
.data-table th:first-child { text-align: left; white-space: normal; min-width: 175px; }
.data-table thead th { color: #3e697d; background: #eef5f7; font-size: .84rem; }
.data-table tbody th { font-weight: 500; }
.data-table tbody tr:nth-child(even):not(.highlight):not(.table-group) { background: #fafcfd; }
.data-table .table-group th { text-align: left; background: #e9f0f3; font-size: .76rem; font-weight: 700; color: #526e7b; letter-spacing: .025em; padding: 9px 15px; }
.data-table .highlight { background: #e9f7f2; }
.data-table .highlight th, .data-table .highlight td:last-child { font-weight: 700; color: #156f66; }
.data-table tbody tr:last-child th, .data-table tbody tr:last-child td { border-bottom: 0; }
.table-note { margin: 12px 4px 0; font: .81rem/1.65 Arial,sans-serif; color: var(--muted); }
footer { border-top: 1px solid var(--line); background: #f6fbfc; padding: 24px; text-align: center; font: .85rem/1.6 Arial,sans-serif; }
footer a { text-decoration: none; font-weight: 700; }
footer p { margin: 6px 0 0; font-size: .76rem; color: var(--muted); }
@media (max-width: 1100px) { .affiliations { grid-template-columns: repeat(4,1fr); row-gap: 26px; max-width: 780px; } .affiliation img { max-width: 130px; } #header-container { gap: 25px; padding-inline: 32px; } }
@media (max-width: 760px) { #header-container { flex-direction: column; padding: 24px 24px 45px; gap: 24px; } .header-content,.header-image { width: 100%; } .header-image { max-width: 480px; } .header-content h1 { font-size: 3.35rem; } .header-content .paper-subtitle { font-size: 1.7rem; } .header-content > p { font-size: 1.08rem; } d-article { padding-inline: 20px; } .author-list { font-size: .96rem; } .result-strip { grid-template-columns: repeat(2,1fr); gap: 25px 0; } .result-strip > div:nth-child(2) { border: 0; } .text { font-size: 1.06rem; line-height: 1.75; } .section-title { margin-bottom: 25px; } .paper-section { margin-top: 46px; } .paper-section + .paper-section { padding-top: 38px; } .data-table { font-size: .86rem; } .data-table th,.data-table td { padding: 11px 13px; } }
@media (max-width: 430px) { .affiliations { grid-template-columns: repeat(2,1fr); gap: 22px 16px; } .affiliation img { height: 59px; } .affiliation span { font-size: .72rem; } .button { font-size: .76rem; padding: 9px 12px; } .section-nav { gap: 7px; } .section-nav a { padding: 7px 10px; font-size: .75rem; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { transition: none !important; } }

.author { display: inline-block; white-space: nowrap; }
@media (max-width: 760px) { .table-block::before { content: "Scroll the table horizontally to see all columns →"; display: block; color: var(--muted); font: .73rem/1.4 Arial,sans-serif; margin: 0 0 8px; } }

@media (max-width: 1100px) { .navbar { align-items: flex-start; gap: 12px; padding-inline: 32px; } .section-nav { justify-content: flex-end; } }
@media (max-width: 760px) { .navbar { flex-direction: column; align-items: stretch; padding: 12px 24px; } .research-menu { align-self: flex-start; } .section-nav { flex-wrap: nowrap; overflow-x: auto; justify-content: flex-start; padding-bottom: 6px; } .section-nav a { white-space: nowrap; flex-shrink: 0; } }

.citation-block { max-width: var(--reading-width); margin: 25px auto 0; border: 1px solid var(--line); border-radius: 12px; background: #f7fafb; overflow: hidden; }
.citation-label { padding: 12px 20px; border-bottom: 1px solid var(--line); color: var(--muted); font: 600 .85rem/1.5 Arial,sans-serif; }
.citation-block pre { min-height: 130px; margin: 0; padding: 20px; overflow-x: auto; white-space: pre; font: .9rem/1.65 monospace; }

/* Distinct resource colors, preserving the established Code button. */
.button-paper { background: #fff0f0; color: #8b2528; border-color: #efb5b7; font-weight: 700; }
.button-models { background: #fff8df; color: #73521a; border-color: #efcf79; font-weight: 700; }
.button-paper img, .button-code img, .button-models img { filter: none; }
.button-code { background: #f2ecff; color: #594176; border-color: #cdbce5; }
a.button-code:hover { background: #e6daf7; }
.score-delta { display: block; margin-top: 2px; font-size: .7rem; line-height: 1.2; font-weight: 500; }
.delta-up { color: #187948; }
.delta-down { color: #c23b36; }

.button-models img { width: 22px; height: 21px; }

@media (max-width: 760px) { .result-strip > div > span { font-size: .72rem; } .result-strip > div { padding-inline: 8px; } }