/* GeoKnow: shared base + one theme per game */
:root{--bg:#0b1b2e;--bgimg:none;--ink:#eef4fb;--mute:#9db3cc;--card:#12294a;--card2:#183760;--line:#244875;--accent:#ffb020;--accent-ink:#1b1200;--good:#2fbf71;--bad:#e5534b;--font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;--head:var(--font);--radius:16px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);background-image:var(--bgimg);background-attachment:fixed;color:var(--ink);font:16px/1.55 var(--font);min-height:100vh}
a{color:var(--accent)}
h1,h2,.q,.big{font-family:var(--head)}
.wrap{max-width:780px;margin:0 auto;padding:0 16px}
header.site{border-bottom:1px solid var(--line)}
header.site .bar{max-width:780px;margin:0 auto;padding:12px 16px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 16px}
.brand{display:flex;gap:8px;align-items:center;text-decoration:none;color:var(--ink);font-weight:800;font-size:20px}
.brand .mark{color:var(--accent)}
nav.top{display:flex;flex-wrap:wrap;gap:2px 14px}
nav.top a{color:var(--mute);text-decoration:none;font-size:14px}
nav.top a:hover,nav.top a.on{color:var(--ink)}
nav.top a.on{font-weight:700}
.hero{text-align:center;padding:24px 0 6px}
.hero h1{font-size:30px;line-height:1.2;margin:0 0 8px}
.hero p{color:var(--mute);margin:0 auto;max-width:540px}
/* difficulty tabs */
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin:16px 0 0;overflow-x:auto}
.tab{background:none;border:0;border-bottom:3px solid transparent;color:var(--mute);font:inherit;font-weight:600;padding:10px 14px;cursor:pointer;white-space:nowrap}
.tab.on{color:var(--ink);border-bottom-color:var(--accent)}
.tab .chk{font-style:normal;color:var(--good);margin-left:6px}
.subtabs{display:flex;gap:6px;align-items:center;margin:10px 0 0;font-size:13px;color:var(--mute);flex-wrap:wrap}
.sub{background:transparent;color:var(--mute);border:1px solid var(--line);border-radius:999px;padding:3px 12px;font:inherit;font-size:13px;cursor:pointer}
.sub.on{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:700}
/* game panel */
#game{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:18px;margin:12px 0 22px}
.top-row{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px;flex-wrap:wrap}
.pips{display:flex;gap:8px}
.pip{width:14px;height:14px;border-radius:50%;background:var(--line)}
.pip.now{background:var(--accent)}.pip.ok{background:var(--good)}.pip.bad{background:var(--bad)}
.modeTag{color:var(--mute);font-size:13px}
.modeTag strong{color:var(--ink)}
.q{text-align:center;font-weight:700;margin:6px 0 14px;font-size:18px}
.q .sub{display:block;font-weight:400;color:var(--mute);font-size:13px;margin-top:2px;border:0;padding:0;text-align:center;background:none}
.fb{text-align:center;margin:14px 0 8px;font-weight:600}
.fb.good{color:var(--good)}.fb.miss{color:var(--bad)}
.fine{color:var(--mute);font-size:13px;text-align:center}
.running{text-align:center;color:var(--mute);font-size:14px;margin:6px 0}
.btn{display:block;margin:10px auto 0;background:var(--accent);color:var(--accent-ink);border:0;border-radius:10px;padding:12px 24px;font:inherit;font-weight:800;cursor:pointer}
.btn.alt{background:transparent;color:var(--ink);border:2px solid var(--line)}
.btn[disabled]{opacity:.4;cursor:default}
.linkbtn{background:none;border:0;color:var(--accent);font:inherit;text-decoration:underline;cursor:pointer;padding:0 4px}
.actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.actions .btn{margin:6px 0 0}
.copied{white-space:pre-line;color:var(--mute);font-size:14px;min-height:20px;text-align:center}
.results{text-align:center}
.results .big{font-size:64px;font-weight:900;margin:0;line-height:1}
.results .big span{font-size:28px;color:var(--mute)}
.results .msg{font-size:20px;font-weight:700;margin:4px 0}
.results .grid{font-size:28px;letter-spacing:4px;margin:8px 0}
.results .streak{color:var(--accent);font-weight:700;margin:4px 0}
.noscript{text-align:center;color:var(--mute)}
/* shared list rows used in result summaries */
.rank-list{display:grid;gap:8px;margin:12px 0;text-align:left}
.rank-item{display:grid;grid-template-columns:34px auto 1fr;gap:10px;align-items:center;background:var(--card2);border:2px solid var(--line);border-radius:12px;padding:10px 12px}
.rank-item .badge{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;border:2px solid var(--line)}
.rank-item.right{border-color:var(--good)}.rank-item.right .badge{background:var(--good);border-color:var(--good);color:#06210f}
.rank-item.wrong{border-color:var(--bad)}.rank-item.wrong .badge{background:var(--bad);border-color:var(--bad);color:#fff}
.rank-item .rcodes{font-size:18px;font-weight:800;letter-spacing:1px;white-space:nowrap}
.rank-item .rcities{color:var(--mute);font-size:14px;text-align:right}
/* content below games */
section.copy{padding:6px 0 24px}
section.copy h2{font-size:21px;margin:24px 0 6px}
section.copy p,section.copy li{color:var(--ink);opacity:.85}
main.page{padding:24px 0 40px}
main.page h1{font-size:28px;margin:0 0 6px}
main.page h2{font-size:20px;margin:24px 0 6px}
main.page .updated{color:var(--mute);margin-top:0}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px}
footer.site{border-top:1px solid var(--line);padding:20px 16px;text-align:center;color:var(--mute);font-size:14px}
footer.site a{color:var(--mute);margin:0 8px;white-space:nowrap}

/* ===== HUB (home) ===== */
.hub{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;margin:18px 0 26px}
.gcard{display:flex;flex-direction:column;gap:6px;text-decoration:none;color:inherit;border-radius:18px;padding:18px;min-height:190px;position:relative;overflow:hidden;border:2px solid transparent;transition:transform .15s}
.gcard:hover{transform:translateY(-3px)}
.gcard h3{margin:0;font-size:22px;line-height:1.15}
.gcard p{margin:0;font-size:14px;opacity:.85}
.gcard .dots{margin-top:auto;display:flex;gap:6px;align-items:center;font-size:12px}
.gcard .dots i{width:11px;height:11px;border-radius:50%;background:currentColor;opacity:.25;display:inline-block}
.gcard .dots i.done{opacity:1}
.gcard .dots span{margin-left:4px;opacity:.8}
.gcard .art{font-size:34px;line-height:1}
.g-sky{background:linear-gradient(160deg,#7cc0f0,#e8f4ff);color:#0d2a4a}
.g-board{background:#0a0a0a;color:#ffc933;border-color:#3a3115;font-family:ui-monospace,Menlo,Consolas,monospace}
.g-sign{background:#000;color:#ffd400;border-color:#ffd400}
.g-radar{background:radial-gradient(circle at 70% 30%,#0b3a24,#03120a 70%);color:#7dffb4;border-color:#0f5a38;font-family:ui-monospace,Menlo,Consolas,monospace}
.g-atlas{background:#f1e7d0;color:#3a2c18;border-color:#cdb98f}
.g-atlas h3{font-family:Georgia,"Times New Roman",serif}
.g-map{background:linear-gradient(160deg,#0d3b66,#06121f);color:#cfe8ff;border-color:#1d5f99}
.progress{text-align:center;color:var(--mute);margin:8px 0 0}
.progress strong{color:var(--ink)}

/* ===== THEME: sky (Longer Flight) ===== */
body.t-sky{--bg:#cfe9fb;--bgimg:linear-gradient(180deg,#6fb8ee 0%,#cfe9fb 36%,#f3f9ff 100%);--ink:#0d2a4a;--mute:#4c6d8c;--card:rgba(255,255,255,.55);--card2:#fff;--line:#b6d3ea;--accent:#ff7a1a;--accent-ink:#fff;--good:#1f9d63;--bad:#d64545;--radius:24px}
body.t-sky #game{backdrop-filter:blur(6px);box-shadow:0 10px 30px rgba(13,42,74,.15)}
body.t-sky header.site{border-color:rgba(255,255,255,.5)}
.passes{display:grid;gap:10px}
.pass{display:grid;grid-template-columns:1fr auto;grid-template-areas:"pl pd" "pc pd" "pcity pd" "bar bar";gap:2px 12px;align-items:center;text-align:left;background:#fff;color:#0d2a4a;border:2px solid #b6d3ea;border-radius:18px;padding:14px 18px;font:inherit;cursor:pointer;width:100%;box-shadow:0 6px 16px rgba(13,42,74,.1);border-left:10px solid #ff7a1a}
.pass:not([disabled]):hover,.pass:not([disabled]):focus-visible{border-color:#ff7a1a;outline:none;transform:translateY(-2px)}
.pass[disabled]{cursor:default}
.pass .pl{grid-area:pl;font-size:11px;letter-spacing:2px;color:#4c6d8c;font-weight:700}
.pass .pcodes{grid-area:pc;display:flex;align-items:center;gap:8px;font-size:30px;letter-spacing:1px}
.pass .pcodes b{font-weight:900}
.pass .arc{width:60px;height:22px;color:#ff7a1a}
.pass .pcities{grid-area:pcity;color:#4c6d8c;font-size:14px}
.pass .pdist{grid-area:pd;text-align:right;font-size:18px;font-weight:700;min-width:110px}
.pass .pdist em{font-style:normal;font-size:26px;font-weight:900}
.pass .pdist .q{color:#b6d3ea}
.pass .pdist small{display:block;font-size:12px;color:#4c6d8c;font-weight:500}
.pass .pbar{grid-area:bar;height:8px;background:#e5f0fa;border-radius:6px;margin-top:8px;overflow:hidden}
.pass .pbar i{display:block;height:100%;background:#ff7a1a;border-radius:6px;transition:width .8s}
.pass.longer{border-color:#1f9d63;border-left-color:#1f9d63}.pass.longer .pbar i{background:#1f9d63}
.pass.shorter{opacity:.85}
.pass.mine{box-shadow:0 0 0 3px rgba(13,42,74,.25)}
.vs{text-align:center;color:#4c6d8c;font-weight:800;font-size:12px;letter-spacing:2px}

/* ===== THEME: board (Route Ranking) ===== */
body.t-board{--bg:#050505;--ink:#ffc933;--mute:#a48a3a;--card:#0d0d0d;--card2:#161616;--line:#3a3115;--accent:#ffb000;--accent-ink:#1a1200;--good:#3ddc84;--bad:#ff5a4d;--font:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;--head:ui-monospace,Menlo,Consolas,monospace;--radius:6px}
body.t-board #game{border:3px solid #2a2a2a;box-shadow:inset 0 0 40px rgba(255,176,0,.05)}
body.t-board .hero h1{letter-spacing:4px;text-transform:uppercase}
.board{display:grid;gap:6px}
.bhead{display:grid;grid-template-columns:44px auto 1fr;gap:10px;color:var(--mute);font-size:11px;letter-spacing:2px;padding:0 12px}
.brow{display:grid;grid-template-columns:44px auto 1fr;gap:10px;align-items:center;background:#161616;border:2px solid #262626;border-radius:4px;padding:10px 12px;color:inherit;font:inherit;text-align:left;cursor:pointer;width:100%}
.brow:not([disabled]):hover,.brow:not([disabled]):focus-visible{border-color:var(--accent);outline:none}
.brow[disabled]{cursor:default}
.brow.picked{border-color:#6b5300}
.brow.right{border-color:var(--good)}.brow.wrong{border-color:var(--bad)}
.fl{display:inline-block;font-style:normal;background:linear-gradient(#222 0 49%,#0a0a0a 50% 100%);border-radius:3px;padding:3px 6px;margin-right:2px;font-weight:800;font-size:20px;color:#ffc933;min-width:22px;text-align:center;border:1px solid #000}
.fl.amber{color:#ffb000}.fl.dim{color:#554a22}
.bcodes{display:flex;align-items:center;gap:2px;white-space:nowrap}
.bcodes em{font-style:normal;color:var(--accent);margin:0 6px}
.bcity{color:var(--mute);font-size:13px;text-align:right}
.bcity.km{color:var(--ink)}
.bcity.km .fl{font-size:15px;padding:2px 4px}
.bnote{text-align:center;color:var(--mute);font-size:14px}
@media(max-width:560px){.brow,.bhead{grid-template-columns:40px 1fr}.bcity{grid-column:1/-1;text-align:left}.bhead span:last-child{display:none}.fl{font-size:17px;padding:2px 5px}}

/* ===== THEME: sign (Code Quiz) ===== */
body.t-sign{--bg:#161616;--ink:#ffd400;--mute:#b59f2e;--card:#000;--card2:#0b0b0b;--line:#3b3300;--accent:#ffd400;--accent-ink:#000;--good:#2fd37c;--bad:#ff5a4d;--head:"Helvetica Neue",Helvetica,Arial,sans-serif;--radius:10px}
body.t-sign #game{border:4px solid #ffd400;box-shadow:0 0 0 6px #000,0 0 0 8px #ffd400 inset}
body.t-sign .hero h1,body.t-sign .q{text-transform:uppercase;letter-spacing:1px}
.sign{background:#ffd400;color:#000;border-radius:8px;padding:14px 18px;margin:8px 0 14px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.sign .arrow{font-size:26px;background:#000;color:#ffd400;border-radius:6px;padding:4px 10px}
.sign .cityname{font-size:32px;font-weight:900;text-transform:uppercase;line-height:1.1}
.sign .country{margin-left:auto;font-weight:700;text-transform:uppercase;opacity:.75;font-size:14px}
.hintline{text-align:center;margin:0 0 8px;color:var(--mute)}
.hintline strong{color:var(--ink);font-size:20px}
.tries{display:grid;gap:8px;justify-content:center;margin-bottom:12px}
.trow{display:flex;gap:8px;justify-content:center}
.tile{width:58px;height:58px;border:3px solid #3b3300;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:30px;font-weight:900;color:#ffd400;background:#0b0b0b}
.tile.t2{background:var(--good);border-color:var(--good);color:#00230f}
.tile.t1{background:#ffd400;border-color:#ffd400;color:#000}
.tile.t0{background:#2b2b2b;border-color:#2b2b2b;color:#888}
.codeform{display:flex;gap:10px;justify-content:center;align-items:center}
.codeform input{width:120px;text-align:center;text-transform:uppercase;font:inherit;font-size:26px;font-weight:900;letter-spacing:6px;padding:8px;border-radius:8px;border:3px solid #3b3300;background:#000;color:#ffd400}
.codeform input:focus{outline:none;border-color:#ffd400}
.codeform .btn{margin:0}

/* ===== THEME: radar (Plane Spotter) ===== */
body.t-radar{--bg:#03120a;--bgimg:radial-gradient(circle at 50% -10%,#0a3a22,#03120a 60%);--ink:#b9ffd6;--mute:#5fae85;--card:#06231a;--card2:#08301f;--line:#0f5a38;--accent:#3dff91;--accent-ink:#02150b;--good:#3dff91;--bad:#ff6b5a;--font:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;--head:ui-monospace,Menlo,Consolas,monospace;--radius:12px}
body.t-radar #game{box-shadow:0 0 30px rgba(61,255,145,.12) inset,0 0 20px rgba(61,255,145,.1)}
.radar{position:relative;width:min(100%,340px);aspect-ratio:1;margin:6px auto 12px;border-radius:50%;border:2px solid #0f5a38;background:radial-gradient(circle,rgba(61,255,145,.08),transparent 70%),repeating-radial-gradient(circle,transparent 0 38px,rgba(61,255,145,.18) 39px 40px),linear-gradient(90deg,transparent 49.6%,rgba(61,255,145,.18) 50%,transparent 50.4%),linear-gradient(0deg,transparent 49.6%,rgba(61,255,145,.18) 50%,transparent 50.4%);overflow:hidden;color:#b9ffd6}
.radar .sweep{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,rgba(61,255,145,.35),transparent 25%);animation:sweep 4s linear infinite}
@keyframes sweep{to{transform:rotate(360deg)}}
.radar svg.plane{position:absolute;inset:8%;width:84%;height:84%;filter:drop-shadow(0 0 4px rgba(61,255,145,.7))}
svg.plane{display:block}
svg.plane .eng rect{stroke:#06231a;stroke-width:.35}
svg.plane .disc{stroke:currentColor;stroke-width:.7;opacity:.55}
.options{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.opt{display:flex;gap:10px;align-items:center;text-align:left;background:#08301f;color:var(--ink);border:2px solid var(--line);border-radius:8px;padding:12px;font:inherit;font-weight:700;cursor:pointer}
.opt i{font-style:normal;color:var(--accent);border:1px solid var(--accent);border-radius:4px;padding:0 6px}
.opt:not([disabled]):hover,.opt:not([disabled]):focus-visible{border-color:var(--accent);outline:none}
.opt[disabled]{cursor:default}
.opt.right{border-color:var(--good);background:#0b4a2c}
.opt.wrong{border-color:var(--bad);background:#4a1a15}
.minis{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:10px;margin:14px 0}
.mini{background:#03120a;border:2px solid var(--line);border-radius:10px;padding:6px;font-size:12px;color:var(--ink)}
.mini.right{border-color:var(--good)}.mini.wrong{border-color:var(--bad)}
.mini span{display:block;margin-top:2px}
@media(max-width:420px){.options{grid-template-columns:1fr}}

/* ===== THEME: atlas (Population Match) ===== */
body.t-atlas{--bg:#efe3c8;--bgimg:radial-gradient(circle at 20% 10%,#f7eed8,#efe3c8 60%,#e6d6b2);--ink:#3a2c18;--mute:#7b6544;--card:#fbf5e6;--card2:#f6ecd2;--line:#cdb98f;--accent:#a8432a;--accent-ink:#fff;--good:#3d7a3a;--bad:#b3261e;--head:Georgia,"Times New Roman",serif;--radius:6px}
body.t-atlas #game{border:3px double #a8895a}
.popq{text-align:center;margin:8px 0 14px}
.popq .region{display:inline-block;color:#fff;background:var(--accent);font-weight:700;letter-spacing:2px;text-transform:uppercase;font-size:12px;padding:3px 12px;border-radius:2px}
.popq .target{display:block;font-family:var(--head);font-size:44px;font-weight:700;line-height:1.15;margin-top:4px}
.popq .sub{display:block;color:var(--mute);font-size:14px;font-style:italic}
.meter{position:relative;height:14px;background:#e9dcbb;border:1px solid var(--line);border-radius:8px;margin:6px 0;overflow:hidden}
.meter i{display:block;height:100%;background:var(--accent);transition:width .25s}
.chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:12px 0}
.chip{background:#fff;color:var(--ink);border:1.5px solid var(--line);border-radius:3px;padding:7px 12px;font:inherit;font-size:15px;cursor:pointer;box-shadow:0 1px 0 rgba(58,44,24,.15)}
.chip small{margin-left:6px;color:var(--mute)}
.chip:not([disabled]):hover,.chip:not([disabled]):focus-visible{border-color:var(--accent);outline:none}
.chip.on{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:700}
.chip.on small{color:#f3d9d0}
.chip[disabled]{cursor:default}.chip.dim{opacity:.4}
.rated{text-align:center}
.stamp{display:inline-block;font-family:var(--head);font-size:54px;font-weight:700;margin:6px 0 0;padding:2px 22px;border:5px double currentColor;border-radius:8px;transform:rotate(-4deg);animation:stamp .35s ease-out}
.stamp span{font-size:22px;opacity:.7}
.stamp.sgood{color:var(--good)}.stamp.sbad{color:var(--bad)}
@keyframes stamp{from{transform:rotate(-14deg) scale(1.9);opacity:0}to{transform:rotate(-4deg) scale(1);opacity:1}}
.rated .msg{font-size:20px;font-weight:700;margin:6px 0 0}

/* ===== THEME: map (Overflown) ===== */
body.t-map{--bg:#06121f;--bgimg:radial-gradient(circle at 50% -10%,#0d3b66,#06121f 65%);--ink:#d7ebff;--mute:#7ea6c9;--card:#0a2038;--card2:#0e2c4d;--line:#1d5f99;--accent:#ffbf3c;--accent-ink:#1a1200;--good:#3ddc97;--bad:#ff6b6b;--radius:18px}
.mapwrap{position:relative;border:2px solid #1d5f99;border-radius:14px;overflow:hidden;background:#0b4770;touch-action:none}
svg.map{display:block;width:100%;aspect-ratio:4/3;cursor:grab;user-select:none}
svg.map .sea{fill:#0b4770}
svg.map .ct{fill:#2c5d46;stroke:#0b2a40;stroke-width:.8px;vector-effect:non-scaling-stroke;cursor:pointer}
svg.map .ct:hover{fill:#3f7d5f}
svg.map .ct.sel{fill:#ffbf3c}
svg.map .ct.hit{fill:#3ddc97}
svg.map .ct.miss{fill:#2c5d46;stroke:#ffbf3c;stroke-width:3px;animation:pulse 1s infinite}
svg.map .ct.bad{fill:#ff6b6b}
@keyframes pulse{50%{stroke-opacity:.25}}
svg.map .route{stroke:#fff;stroke-width:2.5px;stroke-dasharray:7 6;filter:drop-shadow(0 0 3px rgba(255,255,255,.8));pointer-events:none}
svg.map .apt{fill:#fff;stroke:#ffbf3c;stroke-width:2px;vector-effect:non-scaling-stroke;pointer-events:none}
svg.map .aptl{fill:#fff;font-weight:800;paint-order:stroke;stroke:#06121f;stroke-width:3px;pointer-events:none}
svg.map .lab{fill:#e9f6ee;font-weight:600;text-anchor:middle;paint-order:stroke;stroke:#0b2a40;stroke-width:2.5px;pointer-events:none}
svg.map #plane path{fill:#fff;stroke:#06121f;stroke-width:.4;pointer-events:none}
svg.map #plane{pointer-events:none}
.mapbtns{position:absolute;right:8px;top:8px;display:grid;gap:6px}
.mapbtns button{width:34px;height:34px;border-radius:8px;border:1px solid #1d5f99;background:rgba(6,18,31,.8);color:#d7ebff;font-size:18px;font-weight:700;cursor:pointer}
.typebar{display:flex;gap:8px;margin:10px 0 0}
.typebar input{flex:1;min-width:0;padding:10px 12px;border-radius:10px;border:2px solid var(--line);background:#06121f;color:var(--ink);font:inherit}
.typebar input:focus{outline:none;border-color:var(--accent)}
.typebar .btn{margin:0;padding:10px 18px}
.shake{animation:shake .4s}
@keyframes shake{25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
.chosenlist{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin:8px 0}
.tag{background:var(--accent);color:var(--accent-ink);border:0;border-radius:999px;padding:4px 12px;font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.tag.good{background:var(--good);color:#04251a;cursor:default}.tag.badtag{background:var(--bad);color:#2a0606;cursor:default}
body.t-map .stamp{border-style:solid;animation:stamp .35s ease-out}
@media(max-width:560px){.pass{grid-template-columns:1fr;grid-template-areas:"pl" "pc" "pcity" "pd" "bar"}.pass .pdist{text-align:left}.sign .country{margin-left:0}}

/* ===== shared map extras ===== */
svg.map .mkr circle{stroke:#fff;stroke-width:2px;vector-effect:non-scaling-stroke;pointer-events:none}
svg.map .mkr text{font-weight:800;paint-order:stroke;stroke:#06121f;stroke-width:3px;fill:#fff;pointer-events:none}
svg.map .mkr.me circle{fill:#ff3b3b}
svg.map .mkr.truth circle{fill:#3ddc97}
svg.map .mline{stroke:#fff;stroke-width:2.5px;stroke-dasharray:6 5;vector-effect:non-scaling-stroke;pointer-events:none}
svg.map.nob .ct{stroke:none}
svg.map.nob .ct{stroke-width:0}
svg.map.faint .ct{fill:transparent;stroke:rgba(255,255,255,.25)}
svg.map.faint .ct:hover{fill:rgba(255,255,255,.08)}
svg.map.faint .ct.hit{fill:#3ddc97}svg.map.faint .ct.bad{fill:#ff6b6b}
.chain{display:flex;flex-wrap:wrap;gap:4px 6px;align-items:center;justify-content:center;margin:8px 0}
.chain .link{background:var(--accent);color:var(--accent-ink);border-radius:999px;padding:3px 12px;font-size:13px;font-weight:700}
.chain .link.end{outline:2px solid var(--good)}
.chain i{font-style:normal;color:var(--mute)}
.chain .hops{flex-basis:100%;text-align:center;color:var(--mute);font-size:13px}

/* ===== THEME: trail (Border Run) ===== */
body.t-trail{--bg:#10201a;--bgimg:radial-gradient(circle at 80% -10%,#1f4a36,#10201a 60%);--ink:#e9f2e4;--mute:#92b09c;--card:#173226;--card2:#1d4030;--line:#2e6a4b;--accent:#f0b429;--accent-ink:#1a1200;--good:#6be08f;--bad:#ff7b6b;--radius:14px}
body.t-trail svg.map .sea{fill:#0e2a3a}
body.t-trail svg.map .ct{fill:#35624a;stroke:#10201a}
body.t-trail svg.map .ct:hover{fill:#46805f}
body.t-trail svg.map .ct.trail{fill:#c98f1a}
body.t-trail svg.map .ct.beg{fill:#4aa3ff}
body.t-trail svg.map .ct.cur{fill:#ffd45c}
body.t-trail svg.map .ct.tgt{stroke:#6be08f;stroke-width:3px}
body.t-trail svg.map .ct.nxt{stroke:#ffd45c;stroke-width:2.5px;animation:pulse 1.2s infinite}
body.t-trail svg.map .ct.island{opacity:.55;pointer-events:none}
body.t-trail .q strong{color:var(--accent)}

/* ===== THEME: pin (Pinpoint) ===== */
body.t-pin{--bg:#e8eff6;--bgimg:linear-gradient(180deg,#f5f9fd,#dbe7f3);--ink:#14263a;--mute:#5a7088;--card:#fff;--card2:#f1f6fb;--line:#c3d3e3;--accent:#e63946;--accent-ink:#fff;--good:#1f9d63;--bad:#d64545;--radius:20px}
body.t-pin #game{box-shadow:0 10px 30px rgba(20,38,58,.1)}
body.t-pin svg.map .sea{fill:#cfe3f4}
body.t-pin svg.map .ct{fill:#f4efe2;stroke:#b9a98a}
body.t-pin svg.map .ct:hover{fill:#fff8e6}
body.t-pin svg.map.nob .ct{fill:#e9e1cc}
body.t-pin svg.map.faint .ct{fill:transparent;stroke:rgba(20,38,58,.18)}
body.t-pin svg.map .mkr text{stroke:#fff;fill:#14263a}
body.t-pin svg.map .mline{stroke:#14263a}

/* ===== THEME: anti (Antipode) ===== */
body.t-anti{--bg:#120a2a;--bgimg:radial-gradient(circle at 20% -10%,#3a1a6e,#120a2a 60%);--ink:#f1e9ff;--mute:#a995d6;--card:#1c1240;--card2:#271a58;--line:#4a3590;--accent:#ff4fd8;--accent-ink:#23002b;--good:#5af0b0;--bad:#ff7a8a;--radius:18px}
body.t-anti svg.map .sea{fill:#0c0820}
body.t-anti svg.map .ct{fill:#3a2a78;stroke:#120a2a}
body.t-anti svg.map .ct:hover{fill:#5640a8}
body.t-anti svg.map .ct.hit{fill:#5af0b0}body.t-anti svg.map .ct.bad{fill:#ff7a8a}
body.t-anti svg.map.faint .ct{fill:transparent;stroke:rgba(241,233,255,.22)}
body.t-anti .opt{background:#271a58;color:var(--ink);border-color:var(--line)}
body.t-anti .opt.right{background:#0f4a37;border-color:var(--good)}body.t-anti .opt.wrong{background:#55202b;border-color:var(--bad)}
.options .opt{justify-content:center;text-align:center}
.g-trail{background:linear-gradient(160deg,#1f4a36,#10201a);color:#f0d27a;border-color:#2e6a4b}
.g-pin{background:#fff;color:#14263a;border-color:#c3d3e3}
.g-pin .art{color:#e63946}
.g-anti{background:linear-gradient(160deg,#3a1a6e,#120a2a);color:#ffb3f0;border-color:#4a3590}

/* ===== THEME: cards (Population Showdown) ===== */
body.t-cards{--bg:#2a0e1b;--bgimg:radial-gradient(circle at 50% -10%,#5a1a38,#2a0e1b 62%);--ink:#fdf1dc;--mute:#d3b79a;--card:#3a1527;--card2:#4a1c33;--line:#7a3552;--accent:#e8b84a;--accent-ink:#2a1500;--good:#6ad59a;--bad:#ff7d7d;--head:Georgia,"Times New Roman",serif;--radius:14px}
.table{background:radial-gradient(circle at 50% 30%,#4a1c33,#2a0e1b);border:2px solid #7a3552;border-radius:16px;padding:12px;margin:6px 0 12px}
.botrow{text-align:center}
.botrow .lbl{color:var(--mute);font-size:12px;letter-spacing:1px;text-transform:uppercase}
.backs{display:flex;justify-content:center;gap:-10px;margin-top:6px;min-height:46px}
.backs .pcard.back{width:34px;height:46px;min-height:0;padding:0;margin:0 -6px;border-radius:5px;font-size:10px}
.trick{display:flex;align-items:center;justify-content:center;gap:10px;margin:12px 0 4px;flex-wrap:wrap}
.trick .vs{color:var(--accent);font-weight:800;font-family:var(--head)}
.slot{width:120px;height:150px;border:2px dashed #7a3552;border-radius:12px;display:flex;align-items:center;justify-content:center;text-align:center;color:var(--mute);font-size:12px;padding:8px}
.hand{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.pcard{width:120px;min-height:150px;background:linear-gradient(160deg,#fff8e8,#f2e3c0);color:#2a1500;border:3px solid #c99a2e;border-radius:12px;padding:10px 8px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;font:inherit;text-align:center;box-shadow:0 4px 10px rgba(0,0,0,.35)}
button.pcard{cursor:pointer;transition:transform .12s}
button.pcard:hover,button.pcard:focus-visible{transform:translateY(-6px);outline:none;border-color:#ffd666}
.pcard .reg{font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:#8a5a14;font-weight:700}
.pcard .cn{font-family:Georgia,serif;font-size:19px;line-height:1.15}
.pcard .pp{font-size:22px;font-weight:800;color:#7a1f3d}
.pcard .pp.hid{color:#c9b58a}
.pcard.back{background:repeating-linear-gradient(45deg,#7a1f3d 0 6px,#5a1a38 6px 12px);border-color:#e8b84a;color:#e8b84a;justify-content:center;font-weight:800;min-height:0;height:150px}
.pcard.won{border-color:#6ad59a;box-shadow:0 0 0 3px rgba(106,213,154,.4),0 4px 10px rgba(0,0,0,.35)}
.pcard.lost{opacity:.75;border-color:#a55}
.g-cards{background:linear-gradient(160deg,#5a1a38,#2a0e1b);color:#f6d58a;border-color:#7a3552}

/* ===== THEME: dossier (Mystery Country) ===== */
body.t-dossier{--bg:#2b2823;--bgimg:radial-gradient(circle at 50% -10%,#4a4339,#2b2823 65%);--ink:#f3ead3;--mute:#b9ab8a;--card:#e9dcb9;--card2:#f4ecd2;--line:#a99565;--accent:#b3261e;--accent-ink:#fff;--good:#2c7a3f;--bad:#b3261e;--font:"Courier New",Courier,monospace;--head:"Courier New",Courier,monospace;--radius:6px}
body.t-dossier #game{background:#e9dcb9;color:#2b2418;border:3px solid #8b7a4a}
body.t-dossier #game .modeTag,body.t-dossier #game .fine{color:#6b5b32}
body.t-dossier #game .q{color:#2b2418}
body.t-dossier #game .q .sub{color:#6b5b32}
body.t-dossier #game .btn.alt{color:#2b2418;border-color:#8b7a4a}
body.t-dossier .hero h1{text-transform:uppercase;letter-spacing:3px}
.dossier{position:relative}
.stamp2{position:absolute;right:6px;top:-6px;color:#b3261e;border:3px solid #b3261e;border-radius:4px;padding:0 8px;font-weight:900;letter-spacing:3px;font-size:13px;transform:rotate(6deg);opacity:.8}
body.t-dossier svg.map .sea{fill:#c9d8d6}
body.t-dossier svg.map .ct{fill:#d9c9a0;stroke:#a99565}
body.t-dossier svg.map .ct:hover{fill:#e8d9b0}
body.t-dossier svg.map .ct.conthl{fill:#c6b27a}
body.t-dossier svg.map .ct.nbrhl{fill:#e0a458}
body.t-dossier svg.map .ct.hit{fill:#2c7a3f}
body.t-dossier svg.map .ct.miss{fill:#b3261e}
body.t-dossier svg.map .ct.bad{fill:#e6b0aa}
.qbtns{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0 8px}
.qb{display:flex;gap:8px;align-items:center;text-align:left;background:#f4ecd2;color:#2b2418;border:2px solid #a99565;border-radius:6px;padding:10px;font:inherit;font-weight:700;cursor:pointer}
.qb span{font-size:20px}
.qb:not([disabled]):hover,.qb:not([disabled]):focus-visible{border-color:#b3261e;outline:none}
.qb.on{background:#d9c9a0;color:#6b5b32;border-style:dashed}
.qb[disabled]{cursor:default}
.clues{display:grid;gap:8px;margin:6px 0}
.clue{display:flex;gap:10px;align-items:flex-start;background:#fffaf0;border:1px solid #cdb98f;border-left:6px solid #b3261e;border-radius:4px;padding:8px 12px;color:#2b2418;animation:slide .3s ease-out}
.clue b{background:#b3261e;color:#fff;border-radius:50%;width:22px;height:22px;display:flex;align-items:center;justify-content:center;font-size:12px;flex:none}
.clue .ico{font-size:20px}
@keyframes slide{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.popbar{position:relative;height:10px;background:linear-gradient(90deg,#e0a458,#b3261e);border-radius:5px;margin:10px 0 16px}
.popbar i{position:absolute;top:-5px;width:4px;height:20px;background:#2b2418;border-radius:2px;transform:translateX(-50%)}
.popbar span{position:absolute;top:14px;font-size:10px;color:#6b5b32}
.popbar span:nth-of-type(1){left:0}.popbar span:nth-of-type(2){left:33%}.popbar span:nth-of-type(3){left:66%}.popbar span:nth-of-type(4){right:0}
.sw{display:inline-block;width:16px;height:16px;border-radius:50%;border:1px solid #2b2418;vertical-align:middle;margin-right:2px}
.boxes{display:inline-flex;gap:3px;vertical-align:middle;flex-wrap:wrap}
.boxes .bx{width:20px;height:24px;border:2px solid #2b2418;border-radius:3px;font-style:normal;font-weight:800;text-align:center;line-height:20px;background:#fff}
.boxes .gap{width:10px}.boxes .pun{font-style:normal;font-weight:800}
.wrongs{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0;justify-content:center}
.wchip{background:#f0c9c4;color:#7a1a14;border-radius:999px;padding:2px 10px;font-size:13px;font-weight:700}
body.t-dossier .typebar input{background:#fffaf0;color:#2b2418;border-color:#a99565}
body.t-dossier .typebar .btn{margin:0}
body.t-dossier .tag,body.t-dossier .rated .stamp{font-family:var(--head)}
body.t-dossier .rank-item{background:#f4ecd2;border-color:#a99565;color:#2b2418}
body.t-dossier .rank-item .rcities{color:#6b5b32}
body.t-dossier .results .msg,body.t-dossier .results .big{color:#2b2418}
.g-dossier{background:#e9dcb9;color:#2b2418;border-color:#8b7a4a;font-family:"Courier New",Courier,monospace}
@media(max-width:480px){.qbtns{grid-template-columns:1fr}}

/* ===== THEME: flag (Flag Mixer) ===== */
body.t-flag{--bg:#fff4cf;--bgimg:linear-gradient(180deg,#ffe9a0 0,#fff4cf 220px);--ink:#1b2a41;--mute:#6a6350;--card:#fffdf5;--card2:#fff;--line:#ecd68a;--accent:#e63946;--accent-ink:#fff;--good:#1f9d55;--bad:#d62828;--radius:22px}
body.t-flag header.site{border-image:repeating-linear-gradient(90deg,#e63946 0 40px,#ffd23f 40px 80px,#1f4eb4 80px 120px,#1f9d55 120px 160px) 1;border-bottom-width:6px}
body.t-flag #game{box-shadow:0 10px 30px rgba(27,42,65,.12)}
.flagbox{position:relative;max-width:360px;margin:8px auto 14px;padding-left:12px}
.flagbox .pole{position:absolute;left:0;top:-6px;bottom:-40px;width:8px;background:linear-gradient(90deg,#8d8d8d,#e8e8e8,#8d8d8d);border-radius:4px}
.flagbox .pole:before{content:"";position:absolute;top:-8px;left:-2px;width:12px;height:12px;border-radius:50%;background:#f2b705}
svg.flagsvg{display:block;width:100%;height:auto;border-radius:3px;box-shadow:6px 8px 16px rgba(27,42,65,.25)}
svg.flagsvg .reg.tap,svg.flagsvg .hit{cursor:pointer}
svg.flagsvg .reg.tap:hover{filter:brightness(1.08)}
svg.flagsvg .reg.sel{stroke:#e63946;stroke-width:2.2;filter:drop-shadow(0 0 2px #e63946)}
.palette{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:6px 0}
.swatch{width:46px;height:46px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 2px #1b2a41;cursor:pointer}
.swatch.on{box-shadow:0 0 0 4px #e63946;transform:scale(1.1)}
.g-flag{background:linear-gradient(135deg,#ffe9a0,#fff4cf);color:#1b2a41;border-color:#ecd68a}

/* ===== THEME: blueprint (Outline) ===== */
body.t-blueprint{--bg:#08213b;--bgimg:linear-gradient(rgba(120,180,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(120,180,255,.07) 1px,transparent 1px),radial-gradient(circle at 50% -10%,#134a7a,#08213b 65%);--ink:#e3f1ff;--mute:#8db6dc;--card:#0c2e52;--card2:#123a66;--line:#2b6aa8;--accent:#ffd23f;--accent-ink:#1a1500;--good:#4be3a0;--bad:#ff7b7b;--font:"Trebuchet MS",Verdana,sans-serif;--radius:12px}
body.t-blueprint{background-size:28px 28px,28px 28px,auto}
.blueprint{background:rgba(5,22,40,.6);border:2px dashed #2b6aa8;border-radius:12px;max-width:340px;margin:8px auto 14px;padding:8px}
svg.sil{display:block;width:100%;height:auto}
svg.sil path{fill:rgba(120,190,255,.18);stroke:#9fd2ff;stroke-width:.8;stroke-linejoin:round;filter:drop-shadow(0 0 3px rgba(120,190,255,.7))}
body.t-blueprint svg.map .sea{fill:#061a30}
body.t-blueprint svg.map .ct{fill:#123a66;stroke:#08213b}
body.t-blueprint svg.map .ct.hit{fill:#ffd23f}
.g-blueprint{background:linear-gradient(160deg,#134a7a,#08213b);color:#bfe0ff;border-color:#2b6aa8}

/* ===== THEME: rush (Neighbour Rush) ===== */
body.t-rush{--bg:#0f1318;--bgimg:radial-gradient(circle at 80% -10%,#10303a,#0f1318 60%);--ink:#eafcff;--mute:#80a5ae;--card:#161d24;--card2:#1d2832;--line:#27414c;--accent:#00e5ff;--accent-ink:#00222a;--good:#47f2a1;--bad:#ff5d73;--radius:14px}
body.t-rush svg.map .sea{fill:#0a1e2a}
body.t-rush svg.map .ct{fill:#26485a;stroke:#0f1318}
body.t-rush svg.map .ct:hover{fill:#356a82}
body.t-rush svg.map .ct.src{fill:#00e5ff}
body.t-rush svg.map .ct.hit{fill:#47f2a1}
body.t-rush svg.map .ct.bad{fill:#ff5d73}
body.t-rush svg.map .ct.miss{fill:#26485a;stroke:#ffd23f;stroke-width:3px;animation:pulse 1s infinite}
.timerbar{position:relative;height:16px;background:#0a1e2a;border:1px solid var(--line);border-radius:10px;overflow:hidden;margin:6px 0 10px}
.timerbar i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#00e5ff,#47f2a1);transition:width .2s linear}
.timerbar i.low{background:linear-gradient(90deg,#ff5d73,#ffb347);animation:blink .6s infinite}
.timerbar span{position:absolute;inset:0;text-align:center;font-size:11px;font-weight:800;line-height:16px;color:#fff;mix-blend-mode:difference}
@keyframes blink{50%{opacity:.6}}
.g-rush{background:linear-gradient(160deg,#10303a,#0f1318);color:#7ff3ff;border-color:#27414c}

/* compact game menu */
details.gm{position:relative}
details.gm summary{list-style:none;cursor:pointer;color:var(--ink);font-size:14px;font-weight:700;padding:4px 12px;border:1px solid var(--line);border-radius:999px}
details.gm summary::-webkit-details-marker{display:none}
details.gm summary:after{content:" \25BE"}
details.gm .gmenu{position:absolute;right:0;top:calc(100% + 6px);z-index:20;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:8px;display:grid;grid-template-columns:1fr 1fr;gap:2px 10px;min-width:min(420px,88vw);box-shadow:0 12px 30px rgba(0,0,0,.35)}
details.gm .gmenu a{color:var(--ink);text-decoration:none;padding:6px 8px;border-radius:8px;font-size:14px;opacity:.85}
details.gm .gmenu a:hover,details.gm .gmenu a.on{background:var(--card2);opacity:1;font-weight:700}
nav.top{align-items:center;gap:10px}
nav.top>a{font-size:14px}
svg.sil circle{fill:rgba(120,190,255,.55);stroke:#9fd2ff;stroke-width:.5;filter:drop-shadow(0 0 2px rgba(120,190,255,.8))}
/* keep label outlines a constant screen width at any zoom */
svg.map .mkr text,svg.map .aptl,svg.map .lab{vector-effect:non-scaling-stroke;stroke-linejoin:round}
svg.map .mkr text{stroke-width:3px}
svg.map .aptl{stroke-width:3px}
svg.map .lab{stroke-width:2.5px}
body.t-blueprint svg.map .mkr text{stroke:#08213b}

/* ===== THEME: postcard (Capital Hunt) ===== */
body.t-postcard{--bg:#f3e9d6;--bgimg:repeating-linear-gradient(135deg,rgba(0,0,0,.025) 0 2px,transparent 2px 14px),linear-gradient(180deg,#f8f0de,#f0e3c8);--ink:#2d2a26;--mute:#7a6f5c;--card:#fffaf0;--card2:#fff;--line:#d9c7a3;--accent:#0f766e;--accent-ink:#fff;--good:#2f8f4e;--bad:#c2342b;--head:Georgia,"Times New Roman",serif;--radius:10px}
body.t-postcard #game{border:2px solid #d9c7a3;box-shadow:0 0 0 6px #fffaf0,0 0 0 8px #d9c7a3}
.postcard{position:relative;text-align:center;background:#fffdf7;border:2px dashed #d9c7a3;border-radius:6px;padding:14px 10px;margin:8px 0 10px}
.postcard .stampbox{position:absolute;right:10px;top:8px;border:2px solid #c2342b;color:#c2342b;font-size:10px;letter-spacing:2px;padding:2px 6px;transform:rotate(5deg);font-weight:800}
.postcard .cap{margin:0;font-family:Georgia,serif;font-size:36px;font-weight:700}
.postcard .sub{margin:2px 0 0;color:var(--mute);font-style:italic}
body.t-postcard svg.map .sea{fill:#bfdde0}
body.t-postcard svg.map .ct{fill:#f6ecd2;stroke:#bba878}
body.t-postcard svg.map .ct:hover{fill:#fff4d6}
body.t-postcard svg.map .ct.bad{fill:#e8a39d}
body.t-postcard svg.map .ct.hit{fill:#7bc48f}
body.t-postcard svg.map .ct.miss{fill:#f6ecd2;stroke:#0f766e;stroke-width:3px;animation:pulse 1s infinite}
body.t-postcard svg.map.faint .ct{fill:transparent;stroke:rgba(45,42,38,.25)}
body.t-postcard svg.map.faint .ct.bad{fill:#e8a39d}body.t-postcard svg.map.faint .ct.hit{fill:#7bc48f}
.g-postcard{background:#f3e9d6;color:#2d2a26;border-color:#d9c7a3}
.g-postcard h3{font-family:Georgia,serif}

/* ===== THEME: chart (Shortcut) ===== */
body.t-chart{--bg:#e4efe9;--bgimg:linear-gradient(rgba(19,52,43,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(19,52,43,.05) 1px,transparent 1px);--ink:#13342b;--mute:#4f7468;--card:#f4faf6;--card2:#fff;--line:#a9c9bb;--accent:#e8590c;--accent-ink:#fff;--good:#1f8a4c;--bad:#c92a2a;--radius:12px}
body.t-chart{background-size:30px 30px}
svg.map .rt{stroke-width:4px;stroke-linecap:round;pointer-events:none}
svg.map .rtl circle{stroke:#fff;stroke-width:2px;vector-effect:non-scaling-stroke}
svg.map .rtl text{fill:#fff;font-weight:900;text-anchor:middle;pointer-events:none}
body.t-chart svg.map .sea{fill:#cfe6ef}
body.t-chart svg.map .ct{fill:#f1ead2;stroke:#c9bd94;pointer-events:none}
body.t-chart svg.map .mkr text{stroke:#fff;fill:#13342b}
.routebtns{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0}
.rb{display:flex;flex-direction:column;align-items:center;gap:4px;background:#fff;color:#13342b;border:3px solid;border-radius:10px;padding:10px;font:inherit;font-weight:800;cursor:pointer}
.rb i{display:block;width:34px;height:6px;border-radius:3px}
.rb small{font-weight:600;color:#4f7468}
.rb.right{background:#d9f2e2;border-color:#1f8a4c!important}
.rb.wrong{background:#fbe0e0;border-color:#c92a2a!important}
.rb[disabled]{cursor:default}
.g-chart{background:#e4efe9;color:#13342b;border-color:#a9c9bb}
