:root{--bg:#f7f8fa;--ink:#15191f;--mut:#566070;--line:#dde2e8;--card:#fff;--acc:#1c64d4;--accl:#e6effc;
--ocean:#dde8f3;--land:#cbd3dd;--edge:#ffffff;--grat:rgba(60,90,130,.08);--rim:#c3cfdc;--halo:rgba(255,255,255,.85);color-scheme:light}
[data-theme=dark]{--bg:#11151b;--ink:#e8ebf0;--mut:#9aa3b2;--line:#2a313c;--card:#191e26;--acc:#5b9cff;--accl:#1b2b45;
--ocean:#16202c;--land:#384250;--edge:#16202c;--grat:rgba(160,190,230,.07);--rim:#2e3a4a;--halo:rgba(17,21,27,.85);color-scheme:dark}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:18px/1.55 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
a{color:var(--acc)}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:var(--card);padding:8px;z-index:9}
.wrap{max-width:1080px;margin:0 auto;padding:0 14px}
.top{border-bottom:1px solid var(--line);background:var(--card)}
.top .wrap{display:flex;align-items:center;gap:16px;height:50px}
.brand{font-weight:700;font-size:19px;color:var(--ink);text-decoration:none;display:flex;align-items:center;gap:8px;margin-right:auto;white-space:nowrap}
.brand span span{color:var(--acc)}
.top nav{display:flex;gap:16px;white-space:nowrap}
.top nav a{color:var(--ink);text-decoration:none;font-size:16px}
.top nav a[aria-current]{color:var(--acc);font-weight:600}
main{padding:10px 0 40px}
h1{font-size:24px;line-height:1.2;margin:6px 0 4px;text-align:center}
h2{font-size:22px;margin:30px 0 8px}h3{font-size:18px;margin:18px 0 4px}
.prose{max-width:720px;margin:0 auto}
.lead{color:var(--mut);text-align:center;margin:0 0 10px;min-height:28px}
.btn{font:inherit;font-size:16px;min-height:44px;padding:0 14px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;text-decoration:none}
.btn:hover{border-color:var(--mut)}.btn:disabled{opacity:.5;cursor:default}
.btn[aria-pressed=true]{background:var(--accl);border-color:var(--acc);color:var(--ink)}
.btn.primary{background:var(--acc);border-color:var(--acc);color:#fff;font-weight:600}
[data-theme=dark] .btn.primary{color:#0b1220}
.btn[hidden]{display:none}
/* game */
.game{display:grid;grid-template-columns:1fr;grid-template-areas:"filters" "form" "globe" "info" "list";gap:10px;max-width:560px;margin:0 auto}
.filters{grid-area:filters;display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.filters .btn{min-height:36px;font-size:14px;padding:0 10px;border-radius:18px}
.gform{grid-area:form;display:flex;gap:8px;position:relative}
.cb{position:relative;flex:1}
.cb input{width:100%;font:inherit;font-size:18px;min-height:50px;padding:0 14px;border:2px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink)}
.cb input:focus{outline:none;border-color:var(--acc)}
.gform .btn{min-height:50px;font-size:17px;padding:0 18px}
#gl{position:absolute;left:0;right:0;top:calc(100% + 4px);margin:0;padding:4px;list-style:none;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.14);z-index:6;max-height:320px;overflow:auto}
#gl[hidden]{display:none}
#gl li{padding:10px 12px;border-radius:8px;cursor:pointer;font-size:17px}
#gl li[aria-selected=true]{background:var(--accl)}
#gl small{color:var(--mut)}
.globe{grid-area:globe;position:relative;width:100%;aspect-ratio:1/1;touch-action:none;user-select:none;-webkit-user-select:none}
.globe canvas{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:grab}
.globe canvas:active{cursor:grabbing}
.globe .load{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--mut);margin:0;pointer-events:none}
.globe.ok .load{display:none}
.zoom{position:absolute;right:4px;bottom:4px;display:flex;flex-direction:column;gap:6px}
.zoom .btn{width:44px;padding:0;font-size:22px;font-weight:600;background:var(--card)}
.tip{position:absolute;transform:translate(-50%,-130%);background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:8px;padding:4px 10px;font-size:15px;white-space:nowrap;pointer-events:none;box-shadow:0 4px 14px rgba(0,0,0,.12)}
.tip[hidden]{display:none}
.legend{position:absolute;left:4px;bottom:6px;display:flex;align-items:center;gap:6px;font-size:13px;color:var(--mut);pointer-events:none}
.legend i{width:84px;height:10px;border-radius:5px;background:linear-gradient(90deg,#fff1b8,#ffd43b,#f59f00,#e8590c,#c92a2a,#8e0d1a);border:1px solid var(--line)}
.info{grid-area:info}
.status{min-height:56px;margin:0;font-size:18px;text-align:center}
.row{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:8px}
.count{color:var(--mut);font-size:15px;text-align:center;margin:6px 0 0;min-height:24px}
.hints{list-style:none;padding:0;margin:8px 0 0;text-align:center}
.hints li{display:inline-block;background:var(--accl);border-radius:8px;padding:4px 10px;margin:3px;font-size:16px}
.copied{text-align:center;color:var(--mut);font-size:15px;margin:6px 0 0;white-space:pre-line}
.copied:empty{display:none}
.list{grid-area:list}
.guesses{list-style:none;padding:0;margin:0}
.guesses li{display:flex;align-items:center;gap:10px;padding:8px 10px;border-bottom:1px solid var(--line);font-size:17px}
.guesses li i{width:18px;height:18px;border-radius:5px;flex:none;border:1px solid rgba(0,0,0,.12)}
.guesses li span{flex:1}
.guesses li b{font-variant-numeric:tabular-nums;font-weight:600}
.guesses li[aria-current]{background:var(--accl);border-radius:8px}
.guesses li.win b{color:var(--acc)}
.tools2{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:14px}
@media (min-width:900px){
 .game{max-width:none;grid-template-columns:minmax(0,600px) minmax(0,1fr);grid-template-areas:"filters filters" "globe form" "globe info" "globe list";grid-template-rows:auto auto auto 1fr;column-gap:28px;align-items:start}
 .status{text-align:left}.row,.tools2{justify-content:flex-start}.count,.hints,.copied{text-align:left}
}
dialog{border:1px solid var(--line);border-radius:14px;background:var(--card);color:var(--ink);max-width:420px;width:calc(100% - 28px);padding:18px}
dialog::backdrop{background:rgba(0,0,0,.35)}
dialog h2{margin:0 0 10px}
.nums{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;text-align:center}
.nums p{margin:0;font-size:13px;color:var(--mut);line-height:1.2}.nums b{display:block;font-size:26px;color:var(--ink)}
.bar2{display:flex;align-items:center;gap:8px;margin:4px 0;font-size:14px}.bar2 span{width:44px;flex:none}
.bar2 i{display:block;background:var(--acc);color:#fff;font-style:normal;text-align:right;padding:0 6px;border-radius:4px;min-width:22px}
.mut{color:var(--mut);font-size:14px}
.help{max-width:720px;margin:30px auto 0}
.help ul{padding-left:20px}
.prose table.kv th{text-align:left;padding-right:14px}
.ad-slot{margin:20px auto;max-width:728px}
.note{font-size:15px;color:var(--mut)}
.cta{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}
/* projector / classroom */
body.proj .top,body.proj footer,body.proj .help,body.proj h1,body.proj .lead,body.proj .cookie,body.proj .ad-slot{display:none}
body.proj main{max-width:none;padding:12px 18px}
body.proj{font-size:24px}
body.proj .game{max-width:none;grid-template-columns:min(calc(100vh - 40px),58vw) minmax(0,1fr);grid-template-areas:"globe filters" "globe form" "globe info" "globe list";grid-template-rows:auto auto auto 1fr;column-gap:28px;align-items:start}
body.proj .cb input{font-size:28px;min-height:64px}body.proj .gform .btn{font-size:24px;min-height:64px}
body.proj #gl li{font-size:26px}
body.proj .status{font-size:28px;text-align:left}
body.proj .guesses li{font-size:26px;padding:10px 12px}body.proj .guesses li i{width:26px;height:26px}
body.proj .btn{font-size:20px;min-height:52px}body.proj .row,body.proj .tools2,body.proj .filters{justify-content:flex-start}
body.proj .hints li{font-size:24px}body.proj .count{font-size:20px;text-align:left}
body.proj .legend{font-size:18px}
@media (max-width:899px){body.proj .game{grid-template-columns:1fr;grid-template-areas:"filters" "form" "globe" "info" "list"}}
footer{border-top:1px solid var(--line);margin-top:30px;padding:20px 0 90px;font-size:15px;color:var(--mut)}
footer ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:6px 16px}
footer a{color:var(--mut)}
.cookie{position:fixed;left:12px;right:12px;bottom:12px;max-width:640px;margin:0 auto;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 14px;display:flex;gap:12px;align-items:center;box-shadow:0 6px 24px rgba(0,0,0,.12);z-index:5;font-size:15px}
.cookie[hidden]{display:none}.cookie p{margin:0}
@media (max-width:520px){.top nav{gap:12px}.top nav a{font-size:15px}h1{font-size:21px}.brand{font-size:18px}}
@media (max-width:440px){.top nav a.hide-s{display:none}}
#dno{display:inline-block;min-width:24ch;text-align:left;white-space:nowrap}
