:root{
  --paper:#faf5ea; --ink:#211a12; --muted:#6b5f4e; --line:#ddd0ba;
  --accent:#7c1f14; --accent-ink:#fff8ef; --card:#fffdf6; --wash:#f1e7d3;
  --dot:#7c1f14; --dot-dim:#c9b995; --refuge:#1f4d7c; --ok:#1e6b34; --bad:#8c1d12;
  --sea:#e9e2cf; --ro:#e4c98f; --land:#efe7d2; --river:#7fa3b8;
  color-scheme:light;
}
[data-theme="dark"]{
  --paper:#171310; --ink:#efe6d4; --muted:#b3a68c; --line:#3d342a;
  --accent:#e08a6d; --accent-ink:#1c1008; --card:#221c16; --wash:#262019;
  --dot:#e08a6d; --dot-dim:#5c5240; --refuge:#7fb3e0; --ok:#7fd09a; --bad:#f0937f;
  --sea:#241e17; --ro:#6b5636; --land:#2b251c; --river:#4d7a94;
  color-scheme:dark;
}
*{box-sizing:border-box}
.no-js .card-buttons,.no-js .map-controls,.no-js .score-actions,.no-js .reset{display:none}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--paper);color:var(--ink);
  font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
  font-size:1.075rem;line-height:1.65}
a{color:var(--accent)}
img{max-width:100%;height:auto}
.skip{position:absolute;left:-9999px}
.skip:focus{left:0.5rem;top:0.5rem;z-index:50;background:var(--accent);color:var(--accent-ink);padding:0.5rem 1rem}
.topbar{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:0.75rem;
  padding:0.35rem 1rem;background:var(--card);border-bottom:1px solid var(--line);min-height:2.6rem}
.topbar .home{font-weight:700;text-decoration:none;white-space:nowrap}
.topnav{display:flex;gap:0.15rem;margin-left:auto;overflow-x:auto;scrollbar-width:none}
.topnav a{padding:0.3rem 0.5rem;text-decoration:none;white-space:nowrap;font-size:0.95rem}
.topnav a:hover{text-decoration:underline}
.langmenu{display:flex;gap:0.25rem;align-items:center}
.langmenu a{padding:0.2rem 0.45rem;border:1px solid var(--line);border-radius:999px;text-decoration:none;font-size:0.85rem}
.langmenu a[aria-current="true"]{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
#theme{background:none;border:1px solid var(--line);border-radius:999px;cursor:pointer;
  width:2.2rem;height:2.2rem;display:inline-flex;align-items:center;justify-content:center;color:var(--ink)}
#theme svg{width:1.1rem;height:1.1rem}
#theme .i-sun{display:none}
[data-theme="dark"] #theme .i-sun{display:block}
[data-theme="dark"] #theme .i-moon{display:none}
.wrap{max-width:44rem;margin:0 auto;padding:0 1rem}
.wrap.wide{max-width:60rem}
header.hero{padding:2.5rem 0 1rem}
.kicker{color:var(--accent);font-variant:small-caps;letter-spacing:0.08em;margin:0 0 0.4rem;font-size:1rem}
h1{font-size:2.3rem;line-height:1.15;margin:0 0 0.7rem;letter-spacing:-0.01em}
.deck{font-size:1.2rem;color:var(--muted);margin:0 0 0.7rem}
.byline{font-size:0.9rem;color:var(--muted);margin:0 0 1.2rem}
.hero figure,.figure{margin:1.4rem 0}
.hero img{width:100%;border-radius:6px;display:block}
figcaption{font-size:0.9rem;color:var(--muted);margin-top:0.4rem}
.credit{overflow-wrap:anywhere}
.overview{font-size:1.15rem;border-left:4px solid var(--accent);padding:0.2rem 0 0.2rem 1rem;margin:1.4rem 0}
.calendar{font-size:0.9rem;color:var(--muted)}
section.block{padding:1.6rem 0;border-top:1px solid var(--line)}
.chapter-head{display:flex;align-items:baseline;gap:0.8rem}
.seal{display:inline-flex;align-items:center;justify-content:center;min-width:2.4rem;height:2.4rem;
  border-radius:50%;background:var(--accent);color:var(--accent-ink);font-weight:700}
h2{font-size:1.7rem;margin:0}
.dates{color:var(--muted);margin:0.2rem 0 0.8rem}
.scene{border:1px solid var(--line);border-left:4px solid var(--accent);background:var(--card);
  border-radius:0 6px 6px 0;padding:0.9rem 1.1rem;margin:1.2rem 0}
.scene blockquote{margin:0 0 0.4rem;font-style:italic;font-size:1.12rem}
.scene cite{font-style:normal;font-size:0.9rem;color:var(--muted)}
.scene .scene-k{font-size:0.8rem;text-transform:uppercase;letter-spacing:0.08em;color:var(--muted);margin:0 0 0.3rem}
.meanwhile{background:var(--wash);border-radius:6px;padding:0.8rem 1.1rem;margin:1.2rem 0;font-size:1rem}
.meanwhile strong{font-variant:small-caps;letter-spacing:0.06em}
.figure img{width:100%;border-radius:6px;display:block}
/* map */
.map-controls{display:flex;flex-wrap:wrap;gap:0.4rem;margin:1rem 0;align-items:center}
.week-btn,.map-play{min-height:2.75rem;padding:0.4rem 0.8rem;border:1px solid var(--line);border-radius:999px;
  background:var(--card);color:var(--ink);cursor:pointer;font-size:1rem;font-family:inherit}
.week-btn[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.hud{display:flex;gap:0.6rem;align-items:baseline;margin:0.4rem 0}
.hud-name{font-weight:700;font-size:1.2rem}
.hud-range{color:var(--muted)}
.map-frame{border:1px solid var(--line);border-radius:6px;background:var(--sea);overflow:hidden}
.map{width:100%;height:auto;display:block}
.bm-sea{fill:var(--sea)}
.bm-land{fill:var(--land);stroke:var(--muted);stroke-width:1}
.bm-ro{fill:var(--ro);stroke:var(--accent);stroke-width:1.2}
.bm-river{fill:none;stroke:var(--river);stroke-width:1.6;opacity:0.8}
.bm-frame{fill:none;stroke:var(--muted);stroke-width:1.5}
.dot circle{fill:var(--dot);stroke:var(--paper);stroke-width:1.5}
.dot.refuge circle{fill:var(--refuge)}
.dot text{font-size:17px;fill:var(--ink);paint-order:stroke;stroke:var(--paper);stroke-width:3px}
.map[data-show="1"] .dot:not([data-week="1"]){opacity:0.18}
.map[data-show="2"] .dot:not([data-week="1"]):not([data-week="2"]){opacity:0.18}
.map[data-show="3"] .dot:not([data-week="1"]):not([data-week="2"]):not([data-week="3"]){opacity:0.18}
.map[data-show="4"] .dot:not([data-week="5"]):not(.refuge){opacity:1}
.map[data-show="4"] .dot[data-week="5"]{opacity:0.18}
.map[data-show="5"] .dot{opacity:1}
.legend{display:flex;gap:1.2rem;list-style:none;padding:0;color:var(--muted);font-size:0.9rem}
.legend i{display:inline-block;width:0.7rem;height:0.7rem;border-radius:50%;background:var(--dot);margin-right:0.3rem}
.legend .sw-refuge{background:var(--refuge)}
.table-scroll{overflow-x:auto;margin-top:1rem}
.places{width:100%;min-width:34rem;border-collapse:collapse;font-size:0.92rem}
.places caption{text-align:left;font-weight:700;padding:0.4rem 0}
.places th,.places td{border-top:1px solid var(--line);padding:0.35rem 0.5rem;text-align:left;vertical-align:top}
.places th{font-variant:small-caps;letter-spacing:0.05em}
/* game */
.card{border:1px solid var(--line);border-radius:6px;background:var(--card);padding:1rem 1.1rem;margin:0 0 1rem}
.card-claim{font-size:1.12rem;margin:0 0 0.7rem}
.card-buttons{display:flex;gap:0.6rem;flex-wrap:wrap}
.card-buttons button{min-height:2.9rem;padding:0.5rem 1.1rem;font-size:1.02rem;font-family:inherit;
  border:1px solid var(--accent);border-radius:6px;background:transparent;color:var(--ink);cursor:pointer}
.card-buttons button:hover{background:var(--wash)}
.card.answered .card-buttons button{opacity:0.55}
.card.answered .card-buttons button.picked{opacity:1;font-weight:700}
.card.right{border-color:var(--ok)}
.card.wrong{border-color:var(--bad)}
.card-note{margin:0.7rem 0 0}
.card-answer{margin-top:0.7rem}
.card-answer summary{cursor:pointer;font-weight:700}
.verdict-right{color:var(--ok)}
.verdict-wrong{color:var(--bad)}
.score{font-size:1.2rem;font-weight:700}
.score-done{margin:0.6rem 0}
.score-actions{display:flex;gap:0.6rem;margin-top:0.6rem}
.score-actions button{min-height:2.75rem;padding:0.4rem 1rem;font-size:1rem;font-family:inherit;
  border:1px solid var(--line);border-radius:6px;background:var(--card);color:var(--ink);cursor:pointer}
/* myths, numbers, sources */
.myth{border-top:1px solid var(--line);padding:1rem 0}
.myth h3{margin:0 0 0.4rem;font-size:1.25rem}
.myth p{margin:0 0 0.4rem}
.myth .verdict{font-weight:700;color:var(--accent)}
.numbers{display:grid;grid-template-columns:repeat(3,1fr);gap:0.8rem;list-style:none;padding:0;margin:1rem 0}
.numbers li{border:1px solid var(--line);border-radius:6px;background:var(--card);padding:0.8rem;text-align:center}
.numbers b{display:block;font-size:1.7rem;font-variant-numeric:tabular-nums}
.numbers span{font-size:0.88rem;color:var(--muted)}
.src-group{margin:0 0 1.2rem}
.src-group h3{font-size:1.05rem;margin:0 0 0.3rem;font-variant:small-caps;letter-spacing:0.05em}
.src-group ul{margin:0;padding-left:1.2rem}
.src-group li{margin:0.25rem 0}
.src-group a{word-break:break-all}
footer.site{border-top:1px solid var(--line);margin-top:2rem;padding:1.2rem 0 3rem;color:var(--muted);font-size:0.9rem}
@media (max-width:40rem){
  h1{font-size:1.8rem}
  .numbers{grid-template-columns:repeat(2,1fr)}
  .topnav{display:none}
  .dot text{font-size:20px}
}