@font-face{font-family:Fraunces;src:url(fonts/fraunces-normal-latin.woff2?v=48282a415e) format("woff2");font-weight:400 900;font-display:swap;unicode-range:U+0000-00FF}
@font-face{font-family:Fraunces;src:url(fonts/fraunces-normal-latin-ext.woff2?v=f120089b94) format("woff2");font-weight:400 900;font-display:swap;unicode-range:U+0100-024F,U+1E00-1EFF}
@font-face{font-family:Fraunces;src:url(fonts/fraunces-italic-ro.woff2?v=f1751b020e) format("woff2");font-style:italic;font-display:swap;unicode-range:U+0218-021B}
@font-face{font-family:Fraunces;src:url(fonts/fraunces-italic-az.woff2?v=3ac919fb21) format("woff2");font-style:italic;font-display:swap;unicode-range:U+0041-007A}
@font-face{font-family:"IBM Plex Sans";src:url(fonts/IBMPlexSans-latin.woff2?v=056e4e2459) format("woff2");font-weight:400 700;font-display:swap;unicode-range:U+0000-00FF}
@font-face{font-family:"IBM Plex Sans";src:url(fonts/IBMPlexSans-latin-ext.woff2?v=ae1d854fef) format("woff2");font-weight:400 700;font-display:swap;unicode-range:U+0100-024F,U+1E00-1EFF}
:root{
  --abyss:#06231F; --lagoon:#0E5F56; --gold:#D9A441; --laterite:#B4552D;
  --bone:#F3EAD8; --ink:#122B22; --paper:#E9EDE2; --paper-2:#DFE5D4;
  --line:#33544A; --line-soft:#B9C4B2; --vh:1vh;
  --bg:var(--paper); --fg:var(--ink); --muted:#3D554A; --card:#F6F7EF;
}
html[data-theme="dark"]{--bg:#081A16;--fg:var(--bone);--muted:#BCD0C2;--card:#0C2B25;--line-soft:#33544A}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]){--bg:#081A16;--fg:var(--bone);--muted:#BCD0C2;--card:#0C2B25;--line-soft:#33544A}}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bg);color:var(--fg);font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:18px;line-height:1.62}
.skip{position:absolute;left:-9999px;top:0;background:var(--gold);color:#1A1405;padding:.6rem 1rem;z-index:60}
.skip:focus{left:0}
.topbar{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:1rem;height:44px;padding:0 1rem;background:var(--abyss);color:var(--bone);border-bottom:1px solid var(--line)}
.topbar a{color:var(--bone);text-decoration:none}
.home{font-family:Fraunces,Georgia,serif;font-weight:700;font-size:1.05rem;letter-spacing:.01em}
.topnav{display:flex;gap:.9rem;margin-inline:auto;font-size:.88rem}
.top-actions{display:flex;align-items:center;gap:.7rem;margin-left:auto}
.icon-btn,.lang{font:inherit;font-size:.88rem;background:none;border:1px solid var(--line);color:var(--bone);padding:.18rem .55rem;border-radius:999px}
.icon-btn{min-width:36px}
.hero{background:var(--abyss);color:var(--bone);padding:clamp(2rem,6vw,4.5rem) 1.25rem clamp(1.6rem,4vw,2.6rem)}
.hero-copy{max-width:56rem;margin:0 auto}
h1{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:clamp(2.1rem,5.4vw,3.9rem);line-height:1.04;margin:0 0 1rem}
.deck{font-size:clamp(1.05rem,2vw,1.3rem);line-height:1.55;max-width:44rem;margin:0 0 1rem}
.hero-cta{color:var(--gold);font-weight:600;margin:0}
.story{display:block}
.stage-col{position:relative}
.stage{position:relative;background:var(--abyss);color:var(--bone);overflow:hidden}
.stage canvas{display:block;width:100%;height:100%}
.static-map{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
[hidden]{display:none!important}
.hud{position:absolute;top:.8rem;left:.8rem;display:grid;gap:.15rem;font-size:.85rem}
.hud-row{display:flex;gap:.6rem;justify-content:space-between;min-width:17rem}
.hud-label{color:#BCD0C2}
.hud strong{font-variant-numeric:tabular-nums;color:var(--bone)}
#hudSea{color:var(--gold);font-size:1.05rem}
.staff{position:absolute;top:50%;right:.7rem;transform:translateY(-50%);display:flex;align-items:stretch;gap:.45rem;height:min(62%,26rem)}
.staff label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.staff input[type="range"]{writing-mode:vertical-lr;direction:rtl;accent-color:var(--gold);width:30px;height:100%;margin:0}
.staff-marks{display:flex;flex-direction:column;justify-content:space-between;font-size:.78rem;font-variant-numeric:tabular-nums;color:#BCD0C2;padding:.1rem 0}
.stage-controls{position:absolute;left:.8rem;bottom:.8rem;display:flex;gap:.5rem;flex-wrap:wrap}
.stage-controls button,.finder-row button,.quiz-score button{font:inherit;font-size:.92rem;background:var(--gold);color:#1A1405;border:0;padding:.5rem .85rem;border-radius:6px;font-weight:600}
#wholeBtn,#finderReset{background:var(--card);color:var(--fg);border:1px solid var(--line-soft)}
.map-note{position:absolute;right:.8rem;bottom:.55rem;max-width:21rem;margin:0;font-size:.74rem;line-height:1.45;color:#BCD0C2;text-align:right}
.city-card{position:absolute;background:var(--bone);color:#122B22;padding:.65rem .8rem;border-radius:8px;font-size:.9rem;line-height:1.45;max-width:17rem;box-shadow:0 8px 28px rgba(0,0,0,.35)}
.chapters{padding:0 1.25rem}
.chapter{max-width:38rem;margin:0 auto;padding:clamp(2.2rem,7vw,4rem) 0;border-top:1px solid var(--line-soft)}
.chapter:first-child{border-top:0}
.ch-num{font-family:Fraunces,Georgia,serif;font-size:2.2rem;line-height:1;color:var(--laterite);margin:0 0 .4rem;font-weight:600}
h2{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:clamp(1.55rem,3.4vw,2.15rem);line-height:1.15;margin:0 0 1rem}
.chapter p{margin:0 0 1rem}
.chapter .stat{font-size:1.12rem;color:var(--lagoon);border-left:3px solid var(--gold);padding-left:.8rem;margin-top:1.4rem}
html[data-theme="dark"] .chapter .stat{color:var(--gold)}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) .chapter .stat{color:var(--gold)}}
.chapter.is-active h2{color:var(--laterite)}
.finder-row{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap;margin:1rem 0}
.finder-row select{font:inherit;padding:.5rem;border-radius:6px;border:1px solid var(--line-soft);background:var(--card);color:var(--fg);min-height:44px}
.finder-result{font-size:1.05rem;min-height:1.6em}
.plain{max-width:44rem;margin:0 auto;padding:clamp(2rem,6vw,3.5rem) 1.25rem;border-top:1px solid var(--line-soft)}
.quiz-q{border:1px solid var(--line-soft);border-radius:10px;padding:1rem;margin:0 0 1rem;background:var(--card)}
.quiz-q legend{font-weight:700;padding:0 .4rem}
.q-num{display:inline-grid;place-items:center;width:1.7rem;height:1.7rem;border-radius:50%;background:var(--abyss);color:var(--gold);margin-right:.35rem;font-size:.95rem}
.quiz-opt{display:block;width:100%;text-align:left;font:inherit;margin:.45rem 0;padding:.6rem .8rem;border-radius:8px;border:1px solid var(--line-soft);background:var(--bg);color:var(--fg);min-height:44px}
.quiz-opt[aria-pressed="true"]{border-color:var(--gold);outline:2px solid var(--gold)}
.quiz-opt.is-right{background:#14532D;color:#D9F2E0;border-color:#14532D}
.quiz-opt.is-wrong{background:#6B2110;color:#F6DDD2;border-color:#6B2110}
.quiz-verdict{min-height:1.4em;margin:.5rem 0 0}
.quiz-score{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}
.sources{padding-left:1.2rem}
.sources li{margin:.45rem 0}
.share-row{display:flex;gap:.5rem;align-items:center;margin:2rem 0 1rem;font-size:.92rem;color:var(--muted)}
.share-row a,.share-row button{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid var(--line-soft);color:var(--fg);text-decoration:none;background:transparent;font-size:1rem}
@media (pointer:coarse){.share-row a,.share-row button{width:44px;height:44px}}
.share-row a:hover,.share-row button:hover{color:var(--laterite);border-color:var(--laterite)}
.footer-note{color:var(--muted)}
.rail{position:fixed;right:.55rem;top:50%;transform:translateY(-50%);z-index:40;display:none;flex-direction:column;gap:.55rem}
.rail a{position:relative;display:block;width:14px;height:14px}
.rail-dot{display:block;width:9px;height:9px;margin:2.5px;border-radius:50%;border:1.5px solid var(--muted);background:transparent}
.rail a[aria-current="true"] .rail-dot{background:var(--laterite);border-color:var(--laterite)}
.rail-label{position:absolute;right:20px;top:50%;transform:translateY(-50%);white-space:nowrap;background:var(--abyss);color:var(--bone);font-size:.8rem;padding:.25rem .55rem;border-radius:5px;opacity:0;pointer-events:none}
.rail a:hover .rail-label,.rail a:focus-visible .rail-label{opacity:1}
.to-top{position:fixed;right:1rem;bottom:calc(1rem + env(safe-area-inset-bottom));z-index:45;width:44px;height:44px;border-radius:50%;border:1px solid var(--to-top-fg,var(--muted));background:var(--to-top-bg,var(--card));color:var(--to-top-fg,var(--fg));opacity:.85;font-size:1rem}
html:not(.js) .needs-js{display:none}
@media (min-width:1000px){
  .story{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:start}
  .stage-col{order:2;position:sticky;top:44px;height:calc(var(--vh) * 100 - 44px)}
  .stage{height:100%}
  .chapters{order:1;padding:0 2rem 0 2.4rem}
  .chapter{margin:0;min-height:calc(var(--vh) * 78);display:flex;flex-direction:column;justify-content:center}
  .rail{display:flex}
}
@media (max-width:999.98px){
  .stage-col{position:sticky;top:44px;z-index:30;height:calc(var(--vh) * 46)}
  .stage{height:100%}
  .hud-row{min-width:13.5rem}
  .map-note{max-width:15.5rem;font-size:.66rem;background:rgba(6,35,31,.55);padding:.3rem .45rem;border-radius:6px}
  .topnav{display:none}
}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
@media print{.topbar,.rail,.to-top,.stage-controls,.staff,.share-row{display:none}.stage-col{position:static;height:60vh}}

/* ---- v2: atlas additions ---- */
.static-map{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
html.map-ready .static-map{display:none}
.stage canvas{position:relative;z-index:1}
.hud{z-index:3;pointer-events:none}
.hud-area strong{color:var(--bone);font-weight:500;font-size:.8rem}
.hud-label{min-width:6.6rem}
.stage-controls{z-index:3}
.stage-controls .ghost,.pair-btn{background:rgba(6,35,31,.72);color:var(--bone);border:1px solid #33544A;padding:.5rem .8rem;border-radius:6px;font:inherit;font-size:.86rem}
.stage-controls .ghost[aria-pressed="true"]{border-color:var(--gold)}
.staff{z-index:3}
.map-note{z-index:3;max-width:19rem}
.site-card{position:absolute;z-index:5;left:.8rem;right:.8rem;bottom:3.6rem;max-width:23rem;background:var(--bone);color:#122B22;padding:.7rem .9rem;border-radius:8px;font-size:.88rem;line-height:1.45;box-shadow:0 8px 28px rgba(0,0,0,.4)}
.site-card strong{display:block;font-size:.98rem}
.site-card span{display:block;color:#7A3A1C;font-weight:600;margin:.1rem 0 .3rem}
.site-card p{margin:0}
.site-card .x{position:absolute;top:.2rem;right:.35rem;background:none;border:0;font-size:1.3rem;line-height:1;color:#122B22;min-width:32px;min-height:32px}
.chart{width:100%}
.chart svg{width:100%;height:auto;display:block;touch-action:pan-y;cursor:crosshair}
.chart .cg{stroke:var(--line-soft);stroke-width:1;stroke-dasharray:2 4}
.chart .ct{fill:var(--muted);font:12px "IBM Plex Sans",sans-serif}
.chart .ct-b{fill:var(--laterite)}
.chart .cl-s{fill:none;stroke:var(--laterite);stroke-width:3;stroke-linejoin:round}
.chart .cl-g{fill:none;stroke:var(--lagoon);stroke-width:2.4;stroke-dasharray:6 4}
html[data-theme="dark"] .chart .cl-g{stroke:#6FC8BE}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) .chart .cl-g{stroke:#6FC8BE}}
.chart .cp{fill:var(--bg);stroke:var(--laterite);stroke-width:2.4}
.chart .cb{fill:var(--gold);opacity:.22}
.chart .cm-l{stroke:var(--fg);stroke-width:1;stroke-dasharray:3 3}
.chart .cm-c{fill:var(--gold);stroke:var(--fg);stroke-width:2}
.chart-hint{font-size:.9rem;color:var(--muted);margin:.4rem 0 1rem}
table.data{width:100%;border-collapse:collapse;font-size:.9rem;line-height:1.35;margin:1.1rem 0}
table.data caption{text-align:left;font-weight:700;margin-bottom:.4rem}
table.data th,table.data td{padding:.45rem .5rem;border-bottom:1px solid var(--line-soft);text-align:left;vertical-align:top}
table.data th{font-weight:600;color:var(--muted)}
table.fauna td{text-align:center;color:var(--lagoon);font-size:1.05rem}
html[data-theme="dark"] table.fauna td{color:var(--gold)}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) table.fauna td{color:var(--gold)}}
.pair-btn{background:var(--card);color:var(--fg);border:1px solid var(--line-soft);text-align:left;min-height:44px;width:100%}
.pair-btn[aria-pressed="true"]{border-color:var(--laterite);outline:2px solid var(--laterite)}
.no-js-only{display:none}
html:not(.js) .no-js-only{display:inline}
html:not(.js) .quiz-static.no-js-only{display:block}
.linklike{background:none;border:0;color:var(--laterite);text-decoration:underline;font:inherit;padding:.2rem 0;min-height:44px}
.sites ul{list-style:none;padding:0;margin:.4rem 0 1rem;display:grid;gap:.4rem}
.sites button{width:100%;text-align:left;font:inherit;background:var(--card);color:var(--fg);border:1px solid var(--line-soft);border-radius:8px;padding:.5rem .7rem;min-height:44px}
.sites button[aria-pressed="true"]{border-color:var(--laterite);outline:2px solid var(--laterite)}
.sites button span{display:block;color:var(--muted);font-size:.86rem}
.sites h3{font-size:1rem;margin:1rem 0 .3rem}
.finder-row label{font-size:.86rem;color:var(--muted)}
.finder-hint{font-size:.9rem;color:var(--muted)}
.chapter.finder{display:block}
.finder-row select{min-width:9rem}
#finderGo{background:var(--laterite);color:#fff}
@media (max-width:999.98px){
  .stage-col{height:calc(var(--vh) * 40)}
  .hud-row{min-width:11.8rem}
  .map-note{left:.6rem;right:auto;bottom:3.1rem;max-width:calc(100% - 4.5rem);text-align:left;font-size:.66rem}
  .mn-long{display:none}
  .stage-controls{gap:.3rem}
  .stage-controls button{padding:.4rem .55rem;font-size:.78rem}
  .chapter{padding:1.6rem 0}
}

.hud,.hud-label{text-shadow:0 0 5px rgba(4,16,22,.95),0 0 2px rgba(4,16,22,.95)}
@media (max-width:999.98px){
  .stage-controls{left:0;right:0;bottom:0;padding:.35rem .5rem;background:rgba(4,20,26,.88);flex-wrap:nowrap;gap:.3rem}
  .stage-controls button{flex:1 1 auto;white-space:nowrap;padding:.4rem .4rem;font-size:.74rem;min-height:40px}
  .staff{height:min(52%,15rem);top:46%}
}

.mn-short{display:none}
@media (max-width:999.98px){.mn-short{display:inline}}

/* ---- critic pass ---- */
.hud{background:rgba(4,20,26,.66);padding:.45rem .6rem;border-radius:8px;top:.6rem;left:.6rem}
.chapter,.plain{scroll-margin-top:60px}
@media (min-width:1000px){
  .staff{right:2.6rem}
  .to-top{left:1rem;right:auto}
  .map-note{left:.8rem;right:auto;bottom:3.9rem;max-width:21rem;text-align:left;background:rgba(4,20,26,.62);padding:.35rem .5rem;border-radius:6px}
  .stage-controls{left:.8rem}
}
@media (max-width:999.98px){
  .to-top{display:none}
  .staff{right:.4rem}
  .site-card p{display:none}
  .site-card{max-width:calc(100% - 4.4rem);bottom:3.3rem;padding:.45rem .7rem}
  table.bridges,table.bridges tbody,table.bridges tr,table.bridges td{display:block;width:100%}
  table.bridges thead{display:none}
  table.bridges tr{border-bottom:1px solid var(--line-soft);padding:.5rem 0}
  table.bridges td{border:0;padding:.15rem 0}
  table.bridges td:nth-child(2)::before{content:attr(data-l2) " ";color:var(--muted)}
  table.bridges td:nth-child(3)::before{content:attr(data-l3) " ";color:var(--muted)}
  table.bridges td:nth-child(4)::before{content:attr(data-l4) " ";color:var(--muted)}
}

/* ---- critic pass 2 ---- */
.stage:not([data-overlay="land"]):not([data-overlay="rivers"]) .map-note{display:none}
.staff{flex-direction:row-reverse}
.hud-label{min-width:5.2rem}
table.bridges caption{display:block;width:100%}
.to-top{background:rgba(4,20,26,.72);color:var(--bone);border-color:#33544A}
@media (min-width:1000px){.to-top{left:auto;right:.6rem;bottom:.6rem}.staff{right:2.9rem}}

/* ---- pass 3 ---- */
#wholeBtn,#finderReset{background:rgba(6,35,31,.72);color:var(--bone);border:1px solid #33544A}
.chapter #finderReset{background:var(--card);color:var(--fg);border:1px solid var(--line-soft)}
@media (max-width:999.98px){
  .hud{display:flex;flex-wrap:wrap;gap:.1rem .7rem;align-items:baseline;max-width:calc(100% - 3.6rem);padding:.3rem .5rem}
  .hud-row{min-width:0;gap:.3rem}
  .hud-label{display:none}
  .hud-area{display:none}
}

/* ---- pass 4 ---- */
.hero{background:linear-gradient(90deg,var(--abyss) 36%,rgba(6,35,31,.55) 62%,rgba(6,35,31,0) 85%),url(map-poster.jpg?v=53622ab52a) right 40% / auto 150% no-repeat,var(--abyss);min-height:min(62vh,34rem)}
@media (max-width:999.98px){.hero{background:linear-gradient(180deg,rgba(6,35,31,.92) 30%,rgba(6,35,31,.55) 100%),url(map-poster.jpg?v=53622ab52a) center / cover no-repeat,var(--abyss);min-height:0}}
.stage:not([data-overlay="land"]) .map-note{display:none}
@media (min-width:1000px){.rail{right:auto;left:.5rem}.rail-label{right:auto;left:20px}.chapters{padding-left:2.6rem}}
.finder-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem .9rem;align-items:end}
.finder-row .field{display:grid;gap:.2rem}
.finder-row select{width:100%}
.finder-row button{grid-column:span 2}
@media (max-width:999.98px){.finder-row{scroll-margin-top:calc(var(--vh)*40 + 60px)}}
.staff input[type=range]{-webkit-appearance:none;appearance:none;background:transparent;width:34px}
.staff input[type=range]::-webkit-slider-runnable-track{width:8px;background:#3E655A;border-radius:4px}
.staff input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;border-radius:50%;background:var(--gold);border:2px solid #04141a;margin-left:-9px}
.staff input[type=range]::-moz-range-track{width:8px;background:#3E655A;border-radius:4px}
.staff input[type=range]::-moz-range-thumb{width:24px;height:24px;border-radius:50%;background:var(--gold);border:2px solid #04141a}
.staff-marks{color:#E1ECE4;font-size:.8rem;text-shadow:0 0 4px #04141a}