:root{--ink:#22283a;--ink2:#4b5266;--paper:#f7f1e3;--card:#fffaf0;--navy:#1f3a5f;--red:#9b2f2a;--gold:#c9973b;--gold-lt:#f0cf73;--green:#4f7a4a;--ne:#8fb0cf;--mid:#d9b46a;--south:#b9d097;--serif:Georgia,"Iowan Old Style",Palatino,serif;--sans:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--radius:14px}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:18px/1.6 var(--serif)}
a{color:var(--navy)}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--red);outline-offset:2px}
.skip{position:absolute;left:-999px;top:0;background:#fff;padding:8px 12px;z-index:9}.skip:focus{left:8px}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{max-width:1040px;margin:0 auto;padding:0 18px}.prose{max-width:68ch}
.site-head{background:var(--navy);color:#fff}.site-head .bar{max-width:1040px;margin:auto;padding:10px 18px;display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center;justify-content:space-between}
.brand{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font-weight:700;font-size:1.1rem}.brand svg{width:36px;height:36px}
.head-nav{display:flex;flex-wrap:wrap;gap:6px 16px;font-family:var(--sans);font-size:.95rem}.head-nav a{color:#fff}
.stripes{height:8px;background:repeating-linear-gradient(90deg,var(--red) 0 26px,#fff 26px 52px)}
.crumbs ol{list-style:none;padding:0;margin:16px 0;display:flex;flex-wrap:wrap;gap:6px;font-family:var(--sans);font-size:.9rem}.crumbs li+li:before{content:"›";margin-right:6px}
.kicker{font-family:var(--sans);text-transform:uppercase;letter-spacing:.08em;color:var(--red);font-weight:700;font-size:.85rem;margin:0}
h1{font-size:clamp(2rem,5vw,3rem);line-height:1.15;margin:.2em 0}h2{color:var(--navy);margin-top:2em;border-bottom:2px solid var(--gold);padding-bottom:4px}h3{margin-bottom:.3em}
.sub{font-size:1.15rem;color:var(--ink2)}
.hero{display:grid;gap:20px;align-items:center}@media(min-width:800px){.hero{grid-template-columns:1.3fr 1fr}}
.hero svg{width:100%;height:auto}
.toc{background:var(--card);border:1px solid #e2d3b0;border-radius:var(--radius);padding:10px 18px;font-family:var(--sans);font-size:.95rem}.toc ul{columns:2;margin:6px 0}
.cards{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));padding:0;list-style:none}
.card{background:var(--card);border:1px solid #e2d3b0;border-radius:var(--radius);padding:14px 16px}.card h3{margin-top:0}
.card.soon{opacity:.8;border-style:dashed}.badge{font-family:var(--sans);font-size:.75rem;font-weight:700;background:var(--gold-lt);border-radius:99px;padding:2px 8px}
.region{border-left:8px solid var(--ne);padding-left:14px}.region.mid{border-color:var(--mid)}.region.south{border-color:var(--south)}
table{border-collapse:collapse;width:100%;font-family:var(--sans);font-size:.95rem;background:var(--card)}th,td{border:1px solid #e2d3b0;padding:6px 8px;text-align:left;vertical-align:top}th{background:#efe3c6}
.tablewrap{overflow-x:auto}
.callout{background:#e9eef5;border-left:6px solid var(--navy);padding:10px 16px;border-radius:8px;margin:1em 0}
.callout.hard{background:#f6e6e3;border-color:var(--red)}
blockquote{margin:1em 0;padding:10px 18px;background:var(--card);border-left:6px solid var(--gold);font-style:italic}blockquote cite{display:block;font-style:normal;font-family:var(--sans);font-size:.9rem;margin-top:6px}
.map{background:#cfe3ef;border-radius:var(--radius);padding:8px}.map svg{width:100%;height:auto;display:block}
.map polygon{stroke:#3a2c1a;stroke-width:2;stroke-linejoin:round}.map .ne{fill:var(--ne)}.map .mid{fill:var(--mid)}.map .south{fill:var(--south)}
.map text{font:600 13px var(--sans);fill:#1d1d1d}.map .ct{font-weight:400;font-size:11px}.map .city{fill:var(--red)}.map .lead{stroke:#333}.map .sea{font:italic 16px var(--serif);fill:#2f5875;letter-spacing:.12em}.map .land{fill:#6b5b3f;font-size:13px;letter-spacing:0}
.legend{display:flex;flex-wrap:wrap;gap:6px 18px;font-family:var(--sans);font-size:.9rem;list-style:none;padding:0}.legend i{display:inline-block;width:14px;height:14px;border:1px solid #444;margin-right:6px;vertical-align:-2px}
.timeline{list-style:none;padding:0;border-left:4px solid var(--gold);margin-left:8px}.timeline li{position:relative;padding:4px 0 10px 18px}.timeline li:before{content:"";position:absolute;left:-10px;top:12px;width:14px;height:14px;border-radius:50%;background:var(--red);border:2px solid var(--paper)}.timeline b{font-family:var(--sans);color:var(--red)}
.quiz fieldset{border:2px solid #e2d3b0;border-radius:var(--radius);margin:0 0 14px;padding:10px 16px;background:var(--card)}.quiz legend{font-weight:bold;padding:2px 8px;background:var(--card);border-radius:6px}
.quiz label{display:block;padding:6px 4px;font-family:var(--sans);cursor:pointer;min-height:40px}.quiz input{margin-right:8px;transform:scale(1.2)}
.quiz .explain{font-family:var(--sans);font-size:.95rem;margin:4px 0 6px}.ok{color:var(--green);font-weight:700}.no{color:var(--red);font-weight:700}
.btn{font:700 1rem var(--sans);background:var(--navy);color:#fff;border:0;border-radius:10px;padding:10px 18px;cursor:pointer;margin:4px 8px 4px 0}.btn.alt{background:var(--ink2)}
.score{font-family:var(--sans);font-weight:700;font-size:1.1rem}
.talk li{margin:.5em 0}
.pager{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;margin:36px 0 10px;font-family:var(--sans);font-weight:700;padding:14px 0;border-top:2px dashed #c9b88f}.pager .soon-text{color:var(--ink2);font-weight:600}
.sources ol{font-size:.95rem}.sources li{margin:.35em 0}
.site-foot{background:var(--ink);color:#efe6cf;margin-top:40px;padding:22px 0 28px;font-size:.95rem}.site-foot a{color:var(--gold-lt)}
.jugami-more{margin-top:10px;font-family:var(--sans);display:flex;flex-wrap:wrap;gap:4px 10px}.jugami-more span{font-weight:700}
@media print{.site-head,.site-foot,.skip,.quiz .btn{display:none}}
/* tap targets (Mandy r1) */
.head-nav a,.crumbs a,.toc li a,.jugami-more a,.site-foot a,.pager a{display:inline-block;min-height:44px;line-height:44px}
.sources a{display:inline-block;min-height:44px;padding:12px 0}
.quiz label,.btn{min-height:44px}
.btn{display:inline-block}
