:root { color-scheme:light; --ink:#202b3b; --muted:#5f6b7b; --accent:#286892; --line:#e2e8ee; --surface:#f6f8fa; --green:#98bc89; --orange:#e4aa7c; --geometry:#8c56c9; --geometry-soft:#f3edfb; --affordance:#2f9f73; --affordance-soft:#eaf7f1; --rgb-world:#3b80d6; --action:#e9752d; --max:1120px; --pad:clamp(20px,5vw,64px); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:24px; }
body { margin:0; background:#fff; color:var(--ink); font:16px/1.75 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif; -webkit-font-smoothing:antialiased; }
body.lightbox-open { overflow:hidden; }
a { color:var(--accent); }
button { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
button:focus-visible,a:focus-visible { outline:3px solid #7eb2d4; outline-offset:4px; }
img { display:block; max-width:100%; height:auto; }
sup { font-size:.65em; line-height:0; margin-left:2px; }
::selection { background:#dbeaf4; }
.sr-only,.skip-link:not(:focus) { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link:focus { position:fixed; z-index:100; top:8px; left:8px; background:#fff; padding:12px; }
/* Paper identity comes before navigation and figures. */
.hero { max-width:calc(var(--max) + var(--pad)*2); padding:60px var(--pad) 0; margin:auto; text-align:center; }
.hero h1 { max-width:1080px; margin:0 auto 28px; font-size:clamp(29px,3.3vw,43px); line-height:1.25; font-weight:730; letter-spacing:-.035em; text-wrap:balance; }
.paper-name { color:var(--accent); }
.hero-meta { max-width:920px; margin:auto; }
.authors { display:flex; justify-content:center; flex-wrap:wrap; gap:8px 23px; font-size:17px; font-weight:500; }
.authors span { white-space:nowrap; }
.authors .author-row-break { flex-basis:100%; height:0; }
.authors sup { color:var(--accent); }
.affiliations { display:flex; flex-wrap:wrap; justify-content:center; gap:5px 22px; margin-top:16px; font-size:14px; }
.affiliations a { color:var(--muted); text-decoration:none; }
.affiliations a:hover { color:var(--accent); text-decoration:underline; }
.author-note { margin:12px 0 0; font-size:12px; color:var(--muted); }
.hero-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin:25px 0 22px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:9px 19px; min-height:43px; border:1px solid var(--line); border-radius:7px; background:#fff; color:var(--ink); font-size:14px; font-weight:600; line-height:1.4; text-decoration:none; cursor:pointer; }
.button-primary { color:#fff; background:var(--accent); border-color:var(--accent); }
.button-primary:hover { background:#205679; }
.button-ghost:hover { background:#eef4f8; border-color:#c3d5e3; }
.button-muted { background:var(--surface); color:var(--muted); cursor:default; }
.button-muted small { font-size:11px; font-weight:400; }
.site-nav { display:flex; flex-wrap:wrap; justify-content:center; gap:12px 28px; margin:0 auto 38px; font-size:13px; }
.site-nav a { color:var(--muted); text-decoration:none; }
.site-nav a:hover { color:var(--accent); text-decoration:underline; }
.hero-visual { margin:0; }
.hero-visual figcaption { max-width:900px; margin:20px auto 0; font-size:15px; color:var(--muted); }
.hero-visual figcaption strong { color:var(--ink); }
/* Scientific figures always retain their intrinsic proportions, without cropping. */
.image-frame { position:relative; display:block; width:100%; height:auto; margin:0; padding:0; border:0; border-radius:0; background:#fff; cursor:zoom-in; }
.image-frame img,.gallery-card img { display:block; width:100%; height:auto; max-width:100%; object-fit:contain; }
.expand-hint { position:absolute; right:8px; bottom:8px; padding:4px 9px; border:1px solid var(--line); border-radius:4px; background:rgba(255,255,255,.96); color:var(--accent); font-size:11px; opacity:0; transition:opacity .15s; }
.image-frame:hover .expand-hint,.image-frame:focus-visible .expand-hint { opacity:1; }
.metric-rail { display:grid; grid-template-columns:repeat(2,1fr); max-width:560px; margin:35px auto 0; padding:24px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.metric-rail>div { display:flex; min-width:0; align-items:center; justify-content:center; gap:12px; border-right:1px solid var(--line); }
.metric-rail>div:last-child { border:0; }
.metric-rail strong { color:var(--accent); font-size:30px; line-height:1.2; font-weight:650; letter-spacing:-.03em; }
.metric-rail span { color:var(--muted); font-size:11px; line-height:1.5; text-align:left; }
.section { padding:76px var(--pad); }
.section>* { max-width:var(--max); margin-left:auto; margin-right:auto; }
.section-light,.section-paper,.section-results { background:#fff; }
.section-dark,.section-citation { background:var(--surface); }
.section-heading { margin-bottom:32px; }
.section-index { margin:0 0 10px; color:var(--accent); font-size:11px; font-weight:650; letter-spacing:.13em; text-transform:uppercase; }
h2,h3 { text-wrap:balance; }
.section-heading h2,.citation-copy h2 { margin:0; font-size:clamp(25px,2.7vw,33px); font-weight:650; line-height:1.3; letter-spacing:-.025em; }
.geometry-term { color:var(--geometry); }
.affordance-term { color:var(--affordance); }
.section-heading-split { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:end; }
.section-heading-split>p { margin:0; color:var(--muted); font-size:15px; }
.idea-grid { display:grid; grid-template-columns:1.2fr 1fr; gap:56px; align-items:start; }
.idea-copy p { margin:0 0 18px; color:var(--muted); }
.idea-copy .lead { color:var(--ink); font-size:18px; line-height:1.75; }
.idea-pills { display:flex; flex-wrap:wrap; gap:8px; }
.idea-pills span { padding:4px 10px; background:#eef4f8; color:var(--accent); border-radius:4px; font-size:12px; }
.signal-stack { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.signal-card { padding:14px 0; border-top:2px solid var(--line); }
.signal-card>span { color:#8393a3; font-size:11px; }
.signal-card h3 { margin:8px 0 5px; font-size:17px; font-weight:600; }
.signal-card p { margin:0; color:var(--muted); font-size:13px; }
.signal-card b { display:block; margin-top:12px; color:var(--accent); font-size:11px; font-weight:600; }
.signal-rgb { border-color:#93b7ce; }.signal-depth { border-color:#b4a8cc; }.signal-aff { border-color:#a7bea0; }.signal-action { border-color:#d4b498; }
.branch-explorer { display:grid; grid-template-columns:190px 1fr; gap:32px; padding:24px; border:1px solid var(--line); border-radius:8px; background:#fff; }
.branch-tabs { display:grid; align-content:start; gap:5px; }
.branch-tabs button { padding:9px 13px; border:0; border-radius:5px; text-align:left; background:transparent; color:var(--muted); font-size:14px; cursor:pointer; }
.branch-tabs button:hover,.branch-tabs button[aria-selected="true"] { color:var(--accent); background:#edf4f8; }
.branch-tabs button[aria-selected="true"] { font-weight:650; }
.branch-tabs button[data-branch="affordance"][aria-selected="true"] { color:var(--affordance); background:var(--affordance-soft); }
.branch-tabs button[data-branch="geometry"][aria-selected="true"] { color:var(--geometry); background:var(--geometry-soft); }
.branch-tabs button[data-branch="rgb"][aria-selected="true"] { color:var(--rgb-world); background:#edf4fd; }
.branch-tabs button[data-branch="action"][aria-selected="true"] { color:var(--action); background:#fff2e9; }
.branch-panel { padding:4px 0; }
.branch-kicker { margin:0 0 5px; color:var(--accent); font-size:12px; }
.branch-explorer[data-active-branch="affordance"] .branch-kicker { color:var(--affordance); }
.branch-explorer[data-active-branch="geometry"] .branch-kicker { color:var(--geometry); }
.branch-explorer[data-active-branch="rgb"] .branch-kicker { color:var(--rgb-world); }
.branch-explorer[data-active-branch="action"] .branch-kicker { color:var(--action); }
.branch-panel h3 { margin:0; font-size:23px; font-weight:600; line-height:1.4; }
.branch-panel>p:not(.branch-kicker) { color:var(--muted); margin:12px 0; font-size:14px; }
.branch-panel>p strong { color:var(--ink); font-weight:650; }
.paper-figure { margin-top:32px; margin-bottom:0; }
.method-figure { margin-top:0; }
.method-summary { max-width:850px; margin-top:22px; margin-bottom:20px; color:var(--muted); font-size:15px; }
.paper-figure .image-frame { padding:12px; border:1px solid var(--line); border-radius:6px; }
.paper-figure figcaption { display:flex; align-items:baseline; gap:16px; margin-top:14px; color:var(--muted); font-size:13px; }
.paper-figure figcaption span { flex-shrink:0; color:var(--accent); font-weight:650; }
.paper-figure-flat { margin:0; }
.evidence-grid { display:grid; grid-template-columns:1.55fr 1fr; gap:36px; align-items:center; }
.evidence-copy article { display:grid; grid-template-columns:25px 1fr; gap:12px; padding:20px 0; border-bottom:1px solid var(--line); }
.evidence-num { color:var(--accent); font-size:11px; }
.evidence-copy h3 { margin:0 0 7px; font-size:17px; font-weight:600; }
.evidence-copy p { margin:0; color:var(--muted); font-size:13px; }
.horizon-card { display:grid; grid-template-columns:1fr 1.2fr; gap:50px; margin-top:40px; padding:30px; border:1px solid var(--line); border-radius:8px; background:var(--surface); }
.mini-label { margin:0 0 10px; color:var(--accent); font-size:11px; font-weight:600; }
.horizon-card h3 { margin:0; font-size:22px; line-height:1.4; font-weight:600; }
.horizon-card>div:first-child>p:last-child { margin-bottom:0; color:var(--muted); font-size:13px; }
.horizon-chart { display:grid; gap:16px; align-content:center; }
.chart-legend { display:flex; flex-wrap:wrap; gap:16px; font-size:11px; color:var(--muted); }
.chart-legend span { display:inline-flex; align-items:center; gap:6px; }
.dot { display:inline-block; width:8px; height:8px; border-radius:50%; }.dot-green { background:var(--green); }.dot-orange { background:var(--orange); }.dot-blue { background:#739ebd; }
.chart-row { display:grid; grid-template-columns:65px 1fr 1fr; gap:12px; align-items:center; }
.chart-row>span { color:var(--muted); font-size:11px; }
.chart-row>div { position:relative; height:28px; border-radius:3px; background:#e8edf0; overflow:hidden; }
.chart-row i { position:absolute; inset:0 auto 0 0; width:var(--value); background:var(--green); }
.chart-row>div:last-child i { background:var(--orange); }
.chart-row b { position:relative; display:flex; align-items:center; height:100%; padding-left:8px; font-size:11px; font-weight:600; }
.result-switcher { border:1px solid var(--line); border-radius:8px; overflow:hidden; }
.result-tabs { display:flex; border-bottom:1px solid var(--line); background:var(--surface); }
.result-tabs button { flex:1; padding:15px 10px; border:0; border-bottom:2px solid transparent; background:transparent; color:var(--muted); font-size:13px; font-weight:550; cursor:pointer; }
.result-tabs button[aria-selected="true"] { color:var(--accent); border-bottom-color:var(--accent); background:#fff; }
.result-panel { display:grid; grid-template-columns:.6fr 1.4fr; align-items:center; gap:44px; padding:36px; }
.result-summary span { color:var(--accent); font-size:12px; }
.result-summary strong { display:block; font-size:64px; font-weight:650; line-height:1.2; letter-spacing:-.05em; }
.result-summary p { margin:8px 0 0; color:var(--muted); font-size:12px; }
.bar-chart { display:grid; gap:13px; }
.bar-row { display:grid; grid-template-columns:137px 1fr 35px; align-items:center; gap:12px; }
.bar-row>span { color:var(--muted); font-size:12px; text-align:right; }
.bar-row>div { height:22px; border-radius:3px; background:#f0f3f6; overflow:hidden; }
.bar-row i { display:block; width:var(--score); height:100%; background:#c5d3dd; border-radius:inherit; }
.bar-row:first-child i { background:var(--accent); }
.bar-row:first-child span,.bar-row:first-child b { color:var(--accent); font-weight:650; }
.bar-row b { font-size:12px; }
.qualitative-block,.gallery { margin-top:60px; padding-top:40px; border-top:1px solid var(--line); }
.qualitative-head { max-width:850px; margin-bottom:26px; }
.qualitative-head h3,.gallery-heading h3 { margin:0; font-size:26px; font-weight:600; line-height:1.4; letter-spacing:-.02em; }
.qualitative-head>p:last-child { color:var(--muted); font-size:15px; }
.gallery { display:grid; grid-template-columns:1fr; gap:30px; }
.gallery-card { display:block; width:100%; height:auto; min-width:0; padding:14px; border:1px solid var(--line); border-radius:6px; background:#fff; cursor:zoom-in; text-align:left; }
.gallery-card>span { display:flex; flex-wrap:wrap; gap:8px 20px; padding:14px 2px 0; margin-top:14px; border-top:1px solid var(--line); color:var(--ink); }
.gallery-card b { font-size:14px; font-weight:600; }
.gallery-card small { color:var(--muted); font-size:12px; }
.citation-copy { margin-bottom:26px; }
.bibtex-card { border:1px solid var(--line); border-radius:7px; background:#fff; overflow:hidden; }
.bibtex-card pre { margin:0; padding:22px; overflow:auto; color:#415369; font:12px/1.8 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; }
.site-footer { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:25px var(--pad); border-top:1px solid var(--line); color:var(--muted); background:#fff; font-size:11px; }
.site-footer p { margin:0; }.site-footer a { text-decoration:none; }
.brand { display:inline-flex; align-items:center; gap:7px; color:var(--accent); font-size:13px; font-weight:600; }.brand svg { width:22px; height:22px; fill:var(--accent); }.brand .mark-cut { fill:#fff; }
.lightbox { width:min(96vw,1700px); max-width:none; max-height:94vh; padding:0; border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--ink); box-shadow:0 20px 90px #53667940; }
.lightbox::backdrop { background:rgba(230,237,243,.92); backdrop-filter:blur(4px); }
.lightbox-inner { max-height:93vh; overflow:auto; padding:46px 16px 16px; }
.lightbox img { width:100%; height:auto; object-fit:contain; }
.lightbox p { max-width:1050px; margin:18px auto 0; color:var(--muted); font-size:13px; }
.lightbox-close { position:absolute; right:10px; top:8px; z-index:1; width:32px; height:32px; border:1px solid var(--line); border-radius:50%; background:#fff; color:var(--ink); font-size:23px; line-height:1; cursor:pointer; }
.reveal { opacity:1; transform:none; }
@media(max-width:900px) {
  .authors .author-row-break { display:none; }
  .hero { padding-top:40px; }.title-break { display:none; }
  .section-heading-split,.idea-grid,.evidence-grid,.horizon-card { grid-template-columns:1fr; gap:24px; }
  .section-heading-split>p { max-width:760px; }
  .evidence-copy { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }.evidence-copy article { grid-template-columns:1fr; align-content:start; gap:6px; }
  .signal-stack { grid-template-columns:repeat(4,1fr); gap:18px; }.result-panel { gap:25px; padding:28px; }
}
@media(max-width:600px) {
  .hero { padding-top:32px; }.hero h1 { font-size:29px; line-height:1.3; margin-bottom:22px; }
  .authors { font-size:14px; gap:7px 16px; }.affiliations { font-size:12px; gap:5px 14px; }.author-note { font-size:10px; line-height:1.7; }
  .hero-actions { gap:7px; margin-top:20px; }.hero-actions .button { padding:8px 13px; font-size:12px; }
  .site-nav { gap:10px 17px; font-size:12px; margin-bottom:26px; }.hero-visual figcaption { margin-top:16px; text-align:left; font-size:13px; }
  .metric-rail { grid-template-columns:repeat(2,1fr); gap:20px 0; margin-top:24px; padding:20px 0; }.metric-rail>div:nth-child(2) { border-right:0; }.metric-rail strong { font-size:27px; }
  .section { padding-top:46px; padding-bottom:46px; }.section-heading { margin-bottom:24px; }.idea-copy .lead { font-size:16px; }.idea-copy p { font-size:14px; }
  .signal-stack { grid-template-columns:1fr 1fr; }.branch-explorer { grid-template-columns:1fr; gap:18px; padding:16px; }.branch-tabs { grid-template-columns:1fr 1fr; }.branch-tabs button { font-size:12px; }.branch-panel h3 { font-size:20px; }
  .paper-figure .image-frame { padding:5px; }.paper-figure figcaption { display:block; font-size:12px; }.paper-figure figcaption span { margin-right:8px; }
  .evidence-copy { grid-template-columns:1fr; gap:0; }.evidence-copy article { grid-template-columns:25px 1fr; gap:10px; padding:14px 0; }
  .horizon-card { padding:20px 16px; margin-top:28px; }.chart-row { grid-template-columns:53px 1fr 1fr; gap:8px; }
  .result-tabs button { padding:12px 6px; font-size:11px; }.result-panel { grid-template-columns:1fr; padding:24px 14px; }.result-summary strong { font-size:52px; }
  .bar-row { grid-template-columns:108px 1fr 30px; gap:7px; }.bar-row>span,.bar-row b { font-size:10px; }
  .qualitative-block,.gallery { margin-top:38px; padding-top:28px; }.qualitative-head h3,.gallery-heading h3 { font-size:23px; }
  .gallery-card { padding:5px; }.gallery-card>span { display:grid; gap:2px; padding:10px 6px 6px; }
  .bibtex-card pre { padding:16px; font-size:11px; }.site-footer { flex-wrap:wrap; gap:12px; }.site-footer p { flex-basis:100%; order:3; }.lightbox-inner { padding-left:6px; padding-right:6px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition:none!important; animation:none!important; } }