@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:400 600;font-display:swap;src:url(/f/sourceserif4-latin-normal.ec37040cca.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:400 600;font-display:swap;src:url(/f/sourceserif4-latin-ext-normal.763d546322.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:"Source Serif 4";font-style:italic;font-weight:400 600;font-display:swap;src:url(/f/sourceserif4-latin-italic.7cab5a87c8.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Source Serif 4";font-style:italic;font-weight:400 600;font-display:swap;src:url(/f/sourceserif4-latin-ext-italic.3dd3f4b9f7.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400;font-display:swap;src:url(/f/jetbrainsmono-latin-400.14425ba9c6.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400;font-display:swap;src:url(/f/jetbrainsmono-latin-ext-400.505dfba8ec.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:500;font-display:swap;src:url(/f/jetbrainsmono-latin-500.cb182feeed.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:500;font-display:swap;src:url(/f/jetbrainsmono-latin-ext-500.879df9319f.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  --ink:#0B1F2A; --slate:#334155; --stone:#E5E7EB; --paper:#FAFAF8;
  --sage:#6B8F7A; --teal:#0EA5A4; --cobalt:#2563EB; --saffron:#F59E0B;
  --vermilion:#EF4444; --pin:#F43F5E;
  --land:#DCE7E3; --sea:#EAF2F6; --grat:#CBD5E1;
  --surface:#FFFFFF; --rmap:8px;
  --shadow:0 1px 2px rgba(11,31,42,.05),0 8px 24px rgba(11,31,42,.06);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --ink:#F1F5F9; --slate:#94A3B8; --stone:#1F2937; --paper:#0B1220;
  --sage:#7DD3A9; --teal:#22D3EE; --cobalt:#3B82F6; --saffron:#FBBF24;
  --vermilion:#F87171; --pin:#F87171;
  --land:#1C2A33; --sea:#0E1A24; --grat:#243642;
  --surface:#111B27;
  --shadow:0 1px 2px rgba(0,0,0,.45),0 10px 30px rgba(0,0,0,.35);
}}
:root[data-theme="dark"]{
  --ink:#F1F5F9; --slate:#94A3B8; --stone:#1F2937; --paper:#0B1220;
  --sage:#7DD3A9; --teal:#22D3EE; --cobalt:#3B82F6; --saffron:#FBBF24;
  --vermilion:#F87171; --pin:#F87171;
  --land:#1C2A33; --sea:#0E1A24; --grat:#243642;
  --surface:#111B27;
  --shadow:0 1px 2px rgba(0,0,0,.45),0 10px 30px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{height:100%}
body{margin:0;background:var(--paper);color:var(--ink);
  font:400 16px/1.6 "Source Serif 4",Georgia,serif;-webkit-font-smoothing:antialiased}
.wrap{--wx:16px;--wt:18px;max-width:720px;margin:0 auto;padding-inline:var(--wx);padding-block:var(--wt) 40px}

header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px;
  position:sticky;top:0;z-index:40;background:var(--paper);margin-inline:calc(-1 * var(--wx,16px));padding:var(--wt,18px) var(--wx,16px) 8px;margin-top:calc(-1 * var(--wt,18px));transition:box-shadow .2s,padding .2s}
body.scrolled header{padding-top:calc(8px + env(safe-area-inset-top));box-shadow:0 1px 0 var(--stone),0 6px 14px -10px rgba(11,31,42,.25)}
.mark{height:34px;width:auto;display:block}
.mark.dk{display:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .mark.lt{display:none}
  :root:not([data-theme="light"]) .mark.dk{display:block}}
:root[data-theme="dark"] .mark.lt{display:none}
:root[data-theme="dark"] .mark.dk{display:block}
.meta{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:11px;line-height:1.4;
  color:var(--slate);letter-spacing:.06em}

.pips{display:flex;gap:4px;margin:0 0 18px}
.pip{height:3px;flex:1;background:var(--stone);border-radius:2px;transition:background .3s}
.pip.done{background:var(--teal)} .pip.now{background:var(--ink)}

.prompt{text-align:center;margin:4px 0 14px}
.ask{font-family:"JetBrains Mono",monospace;font-size:11px;line-height:1.4;
  letter-spacing:.14em;text-transform:uppercase;color:var(--slate);margin-bottom:8px}
.word{font-family:"Tiempos Headline","Source Serif 4",Georgia,serif;font-weight:400;
  font-size:clamp(40px,11vw,56px);line-height:1.1;letter-spacing:-.015em;text-wrap:balance}

.mapwrap{position:relative;border:1px solid var(--stone);border-radius:var(--rmap);
  background:var(--sea);overflow:hidden;aspect-ratio:4/3;box-shadow:var(--shadow)}
svg.map{display:block;width:100%;height:100%}
.land{fill:var(--land);stroke:none;fill-rule:evenodd}
.grat{stroke:var(--grat);stroke-width:.25;fill:none;opacity:.7}

.pin{cursor:pointer}
.pin circle.dot{fill:var(--surface);stroke:var(--slate);stroke-width:calc(var(--u,1)*1px);transition:all .18s}
.pin text{font-family:"JetBrains Mono",monospace;font-size:calc(var(--u,1)*3.6px);
  font-weight:500;fill:var(--ink);paint-order:stroke;stroke:var(--sea);
  stroke-width:calc(var(--u,1)*1.6px);stroke-linejoin:round}
.pin:hover circle.dot{fill:var(--teal);stroke:var(--teal)}
.pin.locked{pointer-events:none}
.pin.right circle.dot{fill:var(--teal);stroke:var(--teal)}
.pin.wrong circle.dot{fill:var(--pin);stroke:var(--pin)}
.pin.dim{opacity:.3}

.route{fill:none;stroke-linecap:round;
  stroke-linejoin:round;stroke-dasharray:var(--len);stroke-dashoffset:var(--len)}
.route.go{transition:stroke-dashoffset 1.5s cubic-bezier(.4,0,.2,1);stroke-dashoffset:0}
.hop{opacity:0} .hop.show{opacity:1;transition:opacity .35s}
.hop circle.node{fill:var(--teal);stroke:var(--sea);stroke-width:.6}
.hop circle.start{fill:var(--saffron)}
.hop circle.end{fill:var(--pin)}
.hop text{paint-order:stroke;stroke:var(--sea);
  stroke-width:calc(var(--u,1)*1.7px);stroke-linejoin:round}
.hop text.lang{font-family:"Source Serif 4",serif;font-size:calc(var(--u,1)*4px);
  font-weight:600;fill:var(--ink)}
.hop text.place{font-family:"JetBrains Mono",monospace;font-size:calc(var(--u,1)*3.1px);
  fill:var(--slate)}
.scalebar{font-family:"JetBrains Mono",monospace;font-size:calc(var(--u,1)*3px);fill:var(--slate)}
.scalebar line{stroke:var(--slate);stroke-width:.3}
.compass{stroke:var(--slate);stroke-width:.3;fill:none}

.panel{margin-top:14px;min-height:90px}
.choices{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.choice{font:400 16px/1.6 "Source Serif 4",serif;color:var(--ink);background:var(--surface);
  border:1px solid var(--stone);border-radius:8px;padding:12px 14px;cursor:pointer;
  text-align:left;transition:all .15s}
.choice:hover{border-color:var(--teal)}
.choice.out{opacity:.35;text-decoration:line-through;cursor:default;border-color:var(--stone)}
.feedback{margin-bottom:10px;padding:10px 12px;border-radius:8px;background:var(--surface);
  border:1px solid var(--stone);font-size:14px;color:var(--slate)}
.feedback b{color:var(--vermilion);font-weight:600}
.coach{margin:10px 0;padding:11px 13px;border-radius:10px;background:#E6F6F5;border:1px solid #9ED9D5;color:#0B3B3A;font-size:15px;line-height:1.4}
.coach b{color:#0B6E6A}
.coach .pt{display:inline-block;animation:coachbob 1.1s ease-in-out infinite}
@keyframes coachbob{0%,100%{transform:translateY(0)}50%{transform:translateY(4px)}}
.btn.guidego{position:sticky;bottom:14px;z-index:6;box-shadow:0 6px 18px rgba(11,31,42,.25);animation:guidepulse 1.6s ease-in-out infinite}
@keyframes guidepulse{0%,100%{box-shadow:0 6px 18px rgba(11,31,42,.25)}50%{box-shadow:0 6px 18px rgba(11,31,42,.25),0 0 0 6px rgba(14,165,164,.35)}}
@media (prefers-reduced-motion:reduce){.coach .pt,.btn.guidego{animation:none}}
/* first game on the campaign page: nothing but the word, the answers and the map */
html.easy .hud,html.easy .shelf,html.easy .goal,html.easy .howline{display:none!important}
@media (max-width:560px){
  html.easy #game .panel:not(.revealed){order:1;margin-top:0;padding-top:2px}
  html.easy #game:has(.panel:not(.revealed)) .mapwrap{order:2;margin-top:12px;flex:1 1 0;aspect-ratio:auto;min-height:96px;max-height:34vh}
  html.easy #game .panel:not(.revealed) .coach{margin-top:0}
}
/* easy answer card: just the verdict, the meaning and the route; it moves on by itself */
html.easy .panel.revealed .quote,html.easy .panel.revealed .lorenote,html.easy .panel.revealed .tell,
html.easy .panel.revealed .replink,html.easy .panel.revealed .rankprog,html.easy .panel.revealed .collrow{display:none}
.btn.autogo{background-image:linear-gradient(90deg,rgba(14,165,164,.55),rgba(14,165,164,.55));background-repeat:no-repeat;
  background-size:0% 100%;animation:autofill var(--automs,4s) linear forwards}
@keyframes autofill{to{background-size:100% 100%}}
.keepcard{margin:16px 0 6px;padding:18px 16px 16px;border-radius:14px;background:#0B1F2A;color:#FAFAF8;text-align:center}
.keepcard b{display:block;font-size:21px;line-height:1.25;margin-bottom:6px}
.keepcard span{display:block;font-size:15px;line-height:1.4;opacity:.85;margin-bottom:14px}
.guestname{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end;margin:10px 0}.guestname label{flex:1 1 160px;font-size:14px;text-align:left}
.guestname input{display:block;width:100%;box-sizing:border-box;font-size:16px;margin-top:4px;padding:10px 12px;border:1px solid #CBD5E1;border-radius:10px}
.guestname .btn{width:auto!important;flex:0 0 auto;margin:0!important;padding:10px 18px}.guestname small{flex-basis:100%;color:#B91C1C}.lbgn{font-weight:600}
.keepcard .btn.keepgo{width:100%;background:#0EA5A4;color:#fff;border-color:#0EA5A4}
.keepform input,.keepcode input{display:block;width:100%;box-sizing:border-box;margin:0 0 10px;padding:13px 14px;border-radius:10px;border:1px solid #2B4756;background:#FAFAF8;color:#0B1F2A;font-size:17px;text-align:center}
.keepcode input{letter-spacing:.3em;font-size:20px}
.keepform input[hidden]{display:none}
.keepcard small{display:block;font-size:13px;opacity:.75;margin-top:8px}
.keepcard .bad{color:#FCA5A5}.acconfirm .bad{color:#B91C1C}.keepcard strong{word-break:break-all}
.acconfirm{margin:10px 0;padding:12px;border-radius:12px;background:#FEF3C7;color:#0B1F2A}
.acconfirm b{display:block}.acconfirm span{display:block;font-size:14px;margin:4px 0 10px}
.acconfirm .keepcode input{border-color:#D6B656}
#game.wwout{opacity:0;transform:translateX(-28px);transition:opacity .2s ease,transform .2s ease}
#game.wwin{animation:wwin .38s cubic-bezier(.2,.8,.2,1)}
@keyframes wwin{from{opacity:0;transform:translateX(28px)}to{opacity:1;transform:none}}
.tries{display:flex;gap:5px;justify-content:center;margin-bottom:10px}
.tries i{width:6px;height:6px;border-radius:50%;background:var(--stone);display:block}
.tries i.used{background:var(--vermilion)}
.choice:focus-visible{outline:2px solid var(--cobalt);outline-offset:2px}

.card{background:var(--surface);border:1px solid var(--stone);border-radius:8px;padding:16px}
.rtop{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.verdict{font-family:"Tiempos Headline","Source Serif 4",Georgia,serif;font-size:28px;
  line-height:1.3;font-weight:400;display:flex;align-items:center;gap:9px}
.verdict img{height:26px;width:26px}
.pts{font-family:"JetBrains Mono",monospace;font-size:12px;letter-spacing:.04em;
  color:var(--slate);font-variant-numeric:tabular-nums}
.path{font-family:"JetBrains Mono",monospace;font-size:11px;line-height:1.7;color:var(--slate)}
.path b{color:var(--ink);font-weight:500}
.collrow{display:flex;align-items:center;gap:9px;margin-top:12px}
.collrow img{width:30px;height:30px}
.chip{display:inline-block;font-family:"JetBrains Mono",monospace;font-size:10px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--teal);
  border:1px solid var(--teal);border-radius:4px;padding:4px 8px}
.tell{margin-top:12px;font-size:14px;line-height:1.5;color:var(--slate);
  border-top:1px solid var(--stone);padding-top:12px}
.tell em{color:var(--ink);font-style:normal;font-weight:600}

.btn{margin-top:12px;width:100%;font:400 16px "Source Serif 4",serif;background:var(--ink);
  color:var(--paper);border:0;border-radius:8px;padding:14px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:8px}
.btn:hover{background:var(--cobalt)}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--stone)}
.btn.ghost:hover{background:var(--surface);border-color:var(--cobalt)}
.hint{display:flex;align-items:center;gap:11px;margin-top:10px;width:100%;
  background:var(--surface);border:1px solid var(--stone);border-radius:8px;
  padding:11px 13px;cursor:pointer;text-align:left;font:400 14px "Source Serif 4",serif;
  color:var(--ink)}
.hint:hover{border-color:var(--teal)}
.hint .play{flex:0 0 auto;width:28px;height:28px;border-radius:50%;
  background:color-mix(in srgb,var(--teal) 16%,transparent);display:grid;place-items:center;
  color:var(--teal);font-size:11px}
.hint small{display:block;font-family:"JetBrains Mono",monospace;font-size:10px;
  letter-spacing:.06em;color:var(--slate)}

.final{text-align:center;padding:6px 0}
.final .tiermark{width:52px;height:52px;margin-bottom:6px}
.score{font-family:"Tiempos Headline","Source Serif 4",Georgia,serif;font-weight:400;
  font-size:clamp(48px,13vw,56px);line-height:1.1;font-variant-numeric:tabular-nums}
.slabel{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--slate);margin-top:4px}
.grid{font-family:"JetBrains Mono",monospace;font-size:18px;letter-spacing:.16em;margin:16px 0 2px}
.embgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:18px 0 4px}
.emb{text-align:center;opacity:.22}
.emb.got{opacity:1}
.emb img{width:52px;height:52px}
.emb span{display:block;font-family:"JetBrains Mono",monospace;font-size:9px;
  letter-spacing:.06em;color:var(--slate);margin-top:4px}
.iq{margin-top:16px;padding-top:14px;border-top:1px solid var(--stone);
  font-size:14px;color:var(--slate)}
.iq b{color:var(--ink);font-family:"JetBrains Mono",monospace}
.iqcard{margin-top:16px;padding:18px 18px 14px;border-radius:12px;text-align:center;border:1px solid color-mix(in srgb,var(--teal) 35%,var(--stone));
  background:linear-gradient(180deg,color-mix(in srgb,var(--teal) 9%,var(--surface)),var(--surface))}
.iqk{font:500 11px "JetBrains Mono",monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--teal)}
.iqrow{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:2px}
.iqn{font:600 64px/1 "Tiempos Headline","Source Serif 4",Georgia,serif;color:var(--ink);font-variant-numeric:tabular-nums}
.iqd{font:700 13px "JetBrains Mono",monospace;padding:3px 8px;border-radius:999px}
.iqd.up{color:#1F7A3E;background:#EEF8F1;border:1px solid #9FD3B0}.iqd.down{color:#B0302A;background:#FDEEEC;border:1px solid #F0B4AE}
.iqband{font:400 20px "Source Serif 4",Georgia,serif;color:var(--ink);margin:4px 0 12px}
.iqscale{position:relative;height:10px;border-radius:999px;background:color-mix(in srgb,var(--stone) 70%,transparent);margin:0 6px}
.iqfill{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:999px;background:linear-gradient(90deg,var(--saffron),var(--teal),var(--cobalt));transition:width 1.1s cubic-bezier(.2,.8,.2,1)}
.iqmark{position:absolute;top:50%;left:0;width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;background:var(--surface);border:3px solid var(--ink);
  box-shadow:0 2px 6px rgba(11,31,42,.25);transition:left 1.1s cubic-bezier(.2,.8,.2,1)}
.iqticks{display:flex;justify-content:space-between;margin:8px 0 0;font:500 10px "JetBrains Mono",monospace;color:var(--slate)}
.iqfoot{margin-top:10px;font-size:14px;color:var(--slate)}.iqfoot b{color:var(--ink)}
@media (prefers-reduced-motion:reduce){.iqfill,.iqmark{transition:none}}
footer{margin-top:24px;font-family:"JetBrains Mono",monospace;font-size:10px;
  line-height:1.6;letter-spacing:.06em;color:var(--slate);text-align:center}

@media (prefers-reduced-motion:reduce){.route.go{transition:none;stroke-dashoffset:0}
  .hop.show{transition:none}}
/* ---- mode chrome ---- */
.ask .tag{display:inline-block;margin-right:8px;padding:2px 6px;border-radius:3px;
  background:color-mix(in srgb,var(--teal) 14%,transparent);color:var(--teal);
  letter-spacing:.12em;font-size:10px;vertical-align:1px}
.word.small{font-size:clamp(30px,8vw,40px)}
.ancq{display:inline-grid;place-items:center;width:68px;height:68px;border-radius:50%;
  border:1px dashed var(--stone);color:var(--slate);font-size:30px;line-height:1}
.mapwrap[hidden]{display:none}

/* ---- one-per-row choices (meanings, definitions) ---- */
.choices.one{grid-template-columns:1fr}
.choices.words{grid-template-columns:repeat(2,1fr)}
.choice.word-opt{text-align:center;font-family:"Tiempos Headline","Source Serif 4",Georgia,serif;
  font-size:22px;padding:18px 12px}
.choice.defn{line-height:1.45}
.choice.defn b{font-weight:600}
.choice.defn small{display:block;margin-top:3px;font-size:13px;color:var(--slate);
  font-family:"Source Serif 4",serif}

/* ---- order mode ---- */
.trail{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-height:46px;
  padding:9px 10px;border:1px dashed var(--stone);border-radius:8px;background:var(--surface)}
.trailhint{font-size:13px;color:var(--slate)}
.trail .arrow{color:var(--slate);font-family:"JetBrains Mono",monospace;font-size:12px}
.tray{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}
.tchip{font:400 14px "Source Serif 4",serif;color:var(--ink);background:var(--surface);
  border:1px solid var(--stone);border-radius:999px;padding:7px 13px;cursor:pointer;
  transition:all .15s}
.tchip:hover{border-color:var(--teal)}
.trail .tchip{background:color-mix(in srgb,var(--teal) 12%,transparent);border-color:var(--teal)}
.tray.fixed .tchip{position:relative;padding-left:12px}
.tray.fixed .tchip .tnum:empty{visibility:hidden}
.tray.fixed .tchip .tnum{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;margin-right:7px;border-radius:50%;
  background:#fff;color:var(--cobalt);font:700 12px/1 "JetBrains Mono",monospace;font-style:normal}
.tray.fixed .tchip.picked{background:var(--cobalt);border-color:var(--cobalt);color:#fff}
.trail .tstep{font:500 14px "Source Serif 4",serif;color:var(--ink);padding:3px 0}
.trail .trailleft{margin-left:auto;font:500 11px "JetBrains Mono",monospace;letter-spacing:.06em;color:var(--slate)}
.ordcheck{margin-top:12px}
.pin.show{pointer-events:none}
.trail .tchip:hover{background:color-mix(in srgb,var(--vermilion) 12%,transparent);
  border-color:var(--vermilion)}

/* ---- reveal rows (kin, coinage) ---- */
.krow{font-size:14px;line-height:1.55;color:var(--slate);margin-top:6px}
.krow b{color:var(--ink);font-weight:600}

/* ---- end screen additions ---- */
.modes{font-family:"JetBrains Mono",monospace;font-size:9px;letter-spacing:.1em;
  color:var(--slate);margin-top:2px}
.streakrow{display:flex;justify-content:center;gap:22px;margin-top:14px;
  font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--slate)}
.streakrow b{display:block;font-size:19px;letter-spacing:0;color:var(--ink);
  font-variant-numeric:tabular-nums}
.streakrow span{text-align:center}


/* word modes: the words are the hero, no map */
.choices.words .choice{min-height:104px;display:grid;place-items:center}
.choices.one .choice{min-height:60px;display:flex;flex-direction:column;justify-content:center}
#word[hidden]{display:none}
.prompt:has(#word[hidden]){margin-bottom:22px}
/* order mode */
.pin .ord{font-family:"JetBrains Mono",monospace;font-size:calc(var(--u,1)*2.6px);
  font-weight:500;fill:var(--paper);stroke:none;paint-order:normal}
.pin.placed circle.dot{fill:var(--teal);stroke:var(--teal)}
.draft{fill:none;stroke:var(--teal);stroke-width:calc(var(--u,1)*1.7px);
  stroke-dasharray:calc(var(--u,1)*3.2px) calc(var(--u,1)*3.2px);
  stroke-linecap:round;stroke-linejoin:round;opacity:.8}
.leader{stroke:var(--slate);stroke-width:calc(var(--u,1)*.5px);
  fill:none;opacity:.55}

/* ---- header HUD ---- */
.hud{display:flex;align-items:center;gap:10px}
.hbtn{display:flex;align-items:center;gap:5px;font-family:"JetBrains Mono",monospace;
  font-size:12px;font-variant-numeric:tabular-nums;color:var(--ink);background:var(--surface);
  border:1px solid var(--stone);border-radius:999px;padding:5px 11px;cursor:pointer;
  transition:border-color .15s}
.hbtn.flat{cursor:default}
.hbtn:active{transform:scale(.94)}.hbtn{transition:border-color .15s,background-color .15s,transform .1s}
header img.mark{transition:transform .12s,opacity .12s;transform-origin:left center}
/* the wordmark with its claim tucked under "anderwort": the W's long stroke runs down beside the two lines.
   Only the old drawn tagline is cut from the image (bottom-right band); the W's tail stays. */
.markw{position:relative;display:block;flex:none;transition:padding .25s ease}
header .markw img.mark{height:40px;clip-path:polygon(0 0,100% 0,100% 80%,24% 80%,24% 100%,0 100%);transition:height .25s ease}
/* sits from the "a" (23.4% in) to the end of the ink (96.1%), from just under the letters (66%) */
.markclaim{position:absolute;left:23.4%;top:66%;width:72.7%;margin:0;font:500 8px/1.2 "JetBrains Mono",monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--slate);pointer-events:none;
  max-height:30px;overflow:hidden;transition:max-height .25s ease,opacity .2s ease}
.markclaim>span{display:block;width:max-content;white-space:nowrap}
header{padding-top:max(8px,calc(var(--wt,18px) - 8px));margin-top:calc(-1 * var(--wt,18px));padding-bottom:6px}
/* scrolled: a slimmer wordmark, and the claim folds away */
body.scrolled header{padding-top:calc(6px + env(safe-area-inset-top));padding-bottom:6px}
body.scrolled header .markw img.mark{height:28px}
body.scrolled .markclaim{max-height:0;opacity:0}
body.scrolled .markw{padding-bottom:0!important}
@media (max-width:560px){header .markw img.mark{height:36px}body.scrolled header .markw img.mark{height:26px}}
@media (max-width:400px){header .markw img.mark{height:34px}body.scrolled header .markw img.mark{height:24px}}
@media (max-width:350px){header .markw img.mark{height:28px}body.scrolled header .markw img.mark{height:22px}header .hbtn .hlab{white-space:nowrap}}
@media (max-width:340px){header{gap:6px}header .markw img.mark{height:26px}header .hud .hbtn{padding-left:4px;padding-right:4px}}
header img.mark:hover{opacity:.85}header img.mark:active{transform:scale(.93)}
header img.mark.tap{animation:markpop .32s ease-out}
@keyframes markpop{0%{transform:scale(1)}35%{transform:scale(.9);opacity:.7}75%{transform:scale(1.04);opacity:1}100%{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){header img.mark.tap{animation:none}.hbtn:active{transform:none}}
.mewrap{position:relative;display:inline-flex}
.nbadge{position:absolute;top:-7px;right:-7px;z-index:3;min-width:22px;height:22px;padding:0 6px;border-radius:11px;border:2px solid var(--paper);
  background:#D2493F;color:#fff;font:700 11.5px/18px "JetBrains Mono",monospace;cursor:pointer;animation:nbpop .4s cubic-bezier(.2,1.6,.4,1) both}
.nbadge[hidden]{display:none}
@keyframes nbpop{from{transform:scale(0)}to{transform:scale(1)}}
body:has(.ntov) #rankbtn{background:var(--ink);color:#FAFAF8;border-color:var(--ink)}
.ntlist{display:flex;flex-direction:column;gap:8px;margin-top:4px}
.ntrow{display:flex;align-items:center;gap:10px;padding:11px 12px;border:1px solid var(--stone);border-radius:12px;background:var(--surface)}
.ntrow.challenge{border-color:color-mix(in srgb,var(--cobalt) 45%,var(--stone))}
.ntrow.news.read{opacity:.65}
.ntic{flex:none;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--teal) 12%,transparent);color:var(--teal)}
.ntrow.challenge .ntic{background:color-mix(in srgb,var(--cobalt) 12%,transparent);color:var(--cobalt)}
.nttx{flex:1;min-width:0}.nttx b{display:block;font-weight:600;font-size:15px}.nttx small{display:block;color:var(--slate);font-size:13.5px;line-height:1.35}
.ntgo{flex:none;width:auto!important;margin:0!important;padding:8px 14px!important;font-size:14px!important}
.ntx{flex:none;width:32px;height:32px;border:0;border-radius:50%;background:transparent;color:var(--slate);font-size:20px;cursor:pointer}
.ntx:hover{background:rgba(0,0,0,.08)}
.ntempty{color:var(--slate);font-size:14.5px;margin:6px 2px}
/* the header button whose page or panel is open stays lit, with a caret pointing at what it opened */
.hbtn{position:relative}
body:has(#atlas:not([hidden])[data-view="profile"]) #rankbtn,body:has(#atlas:not([hidden])[data-view="badges"]) #rankbtn,
body:has(#atlas:not([hidden])[data-view="friends"]) #rankbtn,
body:has(#atlas:not([hidden])[data-view="atlas"]) #atlasbtn,body:has(.hwov:not(.out)) #howbtn,body:has(.glov) #glbtn,
body:has(#atlas:not([hidden])[data-view="board"]) #lbbtn{
  background:var(--ink);color:var(--paper);border-color:var(--ink);box-shadow:0 0 0 3px color-mix(in srgb,var(--teal) 40%,transparent)}
body:has(#atlas:not([hidden])[data-view="profile"]) #rankbtn::after,body:has(#atlas:not([hidden])[data-view="badges"]) #rankbtn::after,body:has(#atlas:not([hidden])[data-view="friends"]) #rankbtn::after,
body:has(#atlas:not([hidden])[data-view="atlas"]) #atlasbtn::after,body:has(#atlas:not([hidden])[data-view="board"]) #lbbtn::after{content:"";position:absolute;left:50%;bottom:-11px;
  transform:translateX(-50%);border:7px solid transparent;border-top-color:var(--ink)}
body:has(#atlas:not([hidden])[data-view="profile"]) #rankbtn .hico,body:has(#atlas:not([hidden])[data-view="badges"]) #rankbtn .hico,body:has(#atlas:not([hidden])[data-view="friends"]) #rankbtn .hico,body:has(#atlas:not([hidden])[data-view="atlas"]) #atlasbtn .hico,body:has(#atlas:not([hidden])[data-view="board"]) #lbbtn .hico{color:var(--paper)}
.hbtn.on .hlab{color:color-mix(in srgb,var(--paper) 78%,transparent)}
.glsheet .gltab{display:grid;grid-template-columns:auto 1fr auto;gap:8px 12px;align-items:baseline;margin:6px 0 14px;font-size:15px}
.glsheet .gltab b{font-weight:600}.glsheet .gltab span{color:var(--slate)}
.glsheet .gltab i{font:600 13px "JetBrains Mono",monospace;font-style:normal;color:#B7791F;white-space:nowrap}
.glsheet h3{font:600 12px "JetBrains Mono",monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--slate);margin:14px 0 6px}
.glsheet ul{margin:0 0 12px;padding-left:18px;font-size:15px;line-height:1.5}
.glsheet .glbig{font:700 44px/1 "Source Serif 4",Georgia,serif;color:#B7791F;margin:2px 0 4px}
.glsheet .shx,.hw .hwx{width:44px;height:44px;border-radius:50%;border:1px solid var(--stone);background:var(--surface);
  display:flex;align-items:center;justify-content:center;font-size:26px;line-height:1;color:var(--ink);cursor:pointer;padding:0}
.hw .hwx{border-color:#CBD5E1;background:#FFFFFF;color:#0B1F2A;margin-left:10px;flex:none}
.hw .hwx:hover,.hw .hwx:focus-visible{background:#0B1F2A;color:#FFFFFF}
.hwtop .hwr{display:flex;align-items:center}
.hbtn:not(.flat):hover{border-color:var(--teal)}
.hico{font-size:11px;color:var(--slate)}
.hico.gl{color:var(--saffron)}
header .meta{text-align:right}
@media (max-width:430px){header .meta{display:none}}

/* ---- helps ---- */
.helps{margin-top:12px;border-top:1px solid var(--stone);padding-top:11px}
.helprow{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.help{display:flex;flex-direction:column;align-items:flex-start;gap:3px;cursor:pointer;
  background:var(--surface);border:1px solid var(--stone);border-radius:7px;padding:8px 9px;
  font:400 12px/1.25 "Source Serif 4",serif;color:var(--ink);text-align:left;transition:all .15s}
.help:hover:not(:disabled){border-color:var(--teal)}
.help .hc{font-family:"JetBrains Mono",monospace;font-size:10px;color:var(--saffron)}
.help .hc::before{content:"\25C6 ";font-size:8px}
.help:disabled{cursor:default;opacity:.4}
.help.spent{opacity:.45;border-style:dashed}
.helpnote{margin-top:9px;font-size:13px;line-height:1.5;color:var(--slate)}
.helpnote b{color:var(--ink);font-weight:600}
.helpnote.hidden{display:none}
.pts .pen{color:var(--vermilion)}
@media (max-width:430px){.helprow{grid-template-columns:repeat(2,1fr)}}

/* ---- atlas ---- */
.atop{text-align:center;margin-bottom:14px}
.atitle{font-family:"Tiempos Headline","Source Serif 4",Georgia,serif;
  font-size:clamp(30px,8vw,38px);line-height:1.1}
.asub{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--slate);margin-top:6px}
.atlasmap{aspect-ratio:2/1}
.aroute{fill:none;stroke:var(--teal);stroke-width:calc(var(--u,1)*.45px);stroke-linecap:round;
  stroke-linejoin:round;opacity:.5}
.aterr{fill:var(--saffron);stroke:var(--paper);stroke-width:calc(var(--u,1)*.4px)}
.ahead{font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--slate);margin:20px 0 9px}
.mastery{display:flex;flex-direction:column;gap:7px}
.mastery.tight{margin-bottom:4px}
.mrow{display:grid;grid-template-columns:110px 1fr 40px 44px;align-items:center;gap:9px;
  font-family:"JetBrains Mono",monospace;font-size:11px;color:var(--slate)}
.mastery.tight .mrow{grid-template-columns:110px 1fr 40px}
.mrow .mk{color:var(--ink)}
.mbar{height:5px;background:var(--stone);border-radius:3px;overflow:hidden}
.mbar i{display:block;height:100%;background:var(--teal);border-radius:3px}
.mrow .mp{text-align:right;color:var(--ink);font-variant-numeric:tabular-nums}
.mrow .mn{text-align:right;font-variant-numeric:tabular-nums}
.terrs{display:flex;flex-wrap:wrap;gap:6px}
.tchip.terr{cursor:default;border-color:var(--saffron);
  background:color-mix(in srgb,var(--saffron) 10%,transparent);font-size:13px;padding:6px 11px}
.tchip.terr b{font-family:"JetBrains Mono",monospace;font-size:10px;color:var(--slate);
  font-weight:400;margin-left:6px}
.empty{font-size:14px;line-height:1.55;color:var(--slate);text-align:center;margin:16px 0}
.gained{font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--teal);margin-top:12px}
.grid .gh{opacity:.45}
.streakrow span b{margin-bottom:2px}
.btn.done{opacity:.55}

/* ============ touch + small screens ============ */
button,.pin,.choice,.tchip,.help,.hbtn{-webkit-tap-highlight-color:transparent;
  touch-action:manipulation;user-select:none;-webkit-user-select:none}
html{-webkit-text-size-adjust:100%}
body{overscroll-behavior-y:contain}
/* hover effects only where a pointer exists, so they don't stick after a tap */
@media (hover:none){
  .choice:hover,.tchip:hover,.help:hover,.hbtn:not(.flat):hover,.hint:hover{border-color:var(--stone)}
  .btn:hover{background:var(--ink)}
  .btn.ghost:hover{background:transparent;border-color:var(--stone)}
  .pin:hover circle.dot{fill:var(--surface);stroke:var(--slate)}
}
/* press feedback, since there is no hover on touch */
.choice:active:not(:disabled),.tchip:active,.help:active:not(:disabled){
  transform:scale(.975);border-color:var(--teal)}
.btn:active{transform:scale(.99);opacity:.9}
.pin:active circle.dot{fill:var(--teal);stroke:var(--teal)}

@media (max-width:560px){
  /* the round fills the screen exactly: nothing a thumb needs falls below the fold */
  .wrap{min-height:100dvh;display:flex;flex-direction:column;
    --wx:14px;--wt:max(10px,env(safe-area-inset-top));padding-inline:var(--wx);
    padding-block:var(--wt) max(14px,env(safe-area-inset-bottom))}
  #game{flex:1 1 auto;display:flex;flex-direction:column;min-height:0}
  .prompt{flex:0 0 auto;margin:2px 0 10px}
  .mapwrap{flex:0 1 auto;aspect-ratio:2/1;min-height:132px}
  /* answers sit at the bottom of the screen, where a thumb reaches */
  .panel{flex:0 0 auto;margin-top:auto;padding-top:10px;min-height:0}
  .panel.revealed{margin-top:12px}
  #game:has(.panel.revealed) .mapwrap{flex:0 0 auto}

  .mark{height:27px}
  header{margin-bottom:11px}
  .pips{margin-bottom:12px}
  .word{font-size:clamp(30px,8.5vw,42px)}
  .ask{font-size:10px;letter-spacing:.1em}
  .ask .tag{margin-right:6px}

  /* short answers stay two-up; long ones go full width */
  .choices{gap:7px}
  .choices.one{grid-template-columns:1fr}
  .choice{padding:13px 12px;min-height:50px}
  .choice.word-opt{min-height:74px;font-size:20px;padding:12px 8px}
  .choices.one .choice{min-height:52px}
  .choice.defn{padding:11px 12px}
  .choice.defn small{font-size:12px}

  /* four helps on one row, each a legal touch target */
  .helps{margin-top:10px;padding-top:9px}
  .helprow{grid-template-columns:repeat(4,1fr);gap:5px}
  .help{align-items:center;text-align:center;padding:8px 4px;min-height:46px;
    font-size:12px;gap:2px}
  .helpnote{margin-top:8px;font-size:12.5px}

  /* order mode: chips were 32px tall, under the 44px minimum */
  .tchip{min-height:44px;display:inline-flex;align-items:center;padding:8px 14px;font-size:15px}
  .trail{min-height:60px;padding:8px}
  .tray{gap:6px;margin-top:8px}

  .btn{padding:15px;min-height:52px}
  .hint{padding:12px}
  .card{padding:14px}
  .verdict{font-size:24px}
}
/* very short screens (SE in landscape, small Androids): give the map less */
@media (max-width:560px) and (max-height:700px){
  .word{font-size:clamp(27px,7.5vw,34px)}
  .mapwrap{min-height:118px;aspect-ratio:2.2/1}
  .prompt{margin:0 0 8px}
  .choice{min-height:46px;padding:11px 12px}
  .choice.word-opt{min-height:62px}
  .help{min-height:44px;font-size:11px}
}
/* landscape phones: the map goes beside the answers */
@media (max-height:520px) and (orientation:landscape){
  .wrap{max-width:none;--wt:8px;padding-block:8px}
  #game{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}
  .prompt{grid-column:1/-1;margin:0 0 4px}
  .word{font-size:28px}
  .mapwrap{aspect-ratio:4/3;min-height:0}
  .panel{margin-top:0}
  .panel{margin-top:0}
  .helprow{grid-template-columns:repeat(4,1fr)}
}
.choice.sel{border-color:var(--cobalt);border-width:2px;
  background:var(--cobalt);color:#fff;box-shadow:0 0 0 3px color-mix(in srgb,var(--cobalt) 25%,transparent)}
.choice.sel::after{content:" \2713";font-weight:700}
.choice.hit{border-color:var(--teal);
  background:color-mix(in srgb,var(--teal) 13%,transparent);opacity:1}

/* ---- acknowledgement toast ---- */
.toast{position:fixed;left:50%;top:calc(12px + env(safe-area-inset-top));
  transform:translate(-50%,-140%);z-index:50;display:flex;align-items:center;gap:11px;
  background:var(--ink);color:var(--paper);border-radius:10px;padding:12px 16px;
  box-shadow:0 10px 34px rgba(11,31,42,.28);max-width:min(420px,calc(100vw - 28px));
  opacity:0;transition:transform .32s cubic-bezier(.2,.9,.3,1),opacity .32s}
.toast.in{transform:translate(-50%,0);opacity:1}
.toast img{width:26px;height:26px;flex:0 0 auto}
.toast .tdot{color:var(--saffron);font-size:18px}
.toast .tt b{display:block;font:600 15px/1.3 "Source Serif 4",serif}
.toast .tt small{display:block;font-family:"JetBrains Mono",monospace;font-size:10px;
  letter-spacing:.06em;opacity:.72;margin-top:2px}
@media (prefers-reduced-motion:reduce){.toast{transition:opacity .2s}}

/* ---- rank ---- */
.rankrow{display:flex;align-items:center;gap:10px;margin-top:16px;padding:12px 14px;
  background:var(--surface);border:1px solid var(--stone);border-radius:8px}
.rankrow img{width:28px;height:28px}
.rankrow .rn{font-family:"Tiempos Headline","Source Serif 4",Georgia,serif;font-size:21px}
.rankrow .rnext{margin-left:auto;font-family:"JetBrains Mono",monospace;font-size:10px;
  letter-spacing:.08em;text-transform:uppercase;color:var(--slate);text-align:right}
.rankbar{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:4px 0 6px}
.rstep{display:flex;flex-direction:column;align-items:center;gap:3px;opacity:.3;
  padding:9px 2px;border:1px solid var(--stone);border-radius:8px}
.rstep.on{opacity:1;border-color:var(--teal)}
.rstep img{width:24px;height:24px}
.rstep b{font-size:11px;font-weight:600;text-align:center;line-height:1.2}
.rstep small{font-family:"JetBrains Mono",monospace;font-size:9px;color:var(--slate)}

/* ---- badges ---- */
.badges{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.badges.won{grid-template-columns:1fr}
.badge{display:grid;grid-template-columns:30px 1fr;grid-template-rows:auto auto;
  column-gap:10px;align-items:center;padding:11px 12px;background:var(--surface);
  border:1px solid var(--stone);border-radius:8px;opacity:.42}
.badge.got{opacity:1;border-color:var(--teal)}
.badge img{grid-row:1/3;width:30px;height:30px}
.badge b{font:600 14px/1.25 "Source Serif 4",serif}
.badge small{font-size:11.5px;line-height:1.35;color:var(--slate)}
.badge i{display:none}
@media (max-width:560px){
  .badges{grid-template-columns:1fr}
  .rankbar{gap:4px}
  .rstep b{font-size:10px}
}

/* ---- challenge ---- */
.chal{display:flex;align-items:center;gap:10px;margin-bottom:12px;padding:10px 13px;
  border:1px solid var(--cobalt);border-radius:8px;
  background:color-mix(in srgb,var(--cobalt) 8%,transparent)}
.chal .cwho{font:600 14px/1.3 "Source Serif 4",serif}
.chal .cscore{margin-left:auto;font-family:"JetBrains Mono",monospace;font-size:11px;
  letter-spacing:.06em;color:var(--cobalt);white-space:nowrap}
.vs{display:flex;align-items:center;gap:8px;margin-top:10px;padding-top:10px;
  border-top:1px solid var(--stone);font-family:"JetBrains Mono",monospace;font-size:11px;
  color:var(--slate)}
.vs .vsep{margin:0 auto;letter-spacing:.1em;text-transform:uppercase;font-size:9px}
.vs .w{color:var(--teal);font-weight:500}
.h2h{margin-top:16px;padding:16px;border-radius:8px;text-align:center;
  border:1px solid var(--stone);background:var(--surface)}
.h2h.win{border-color:var(--teal);background:color-mix(in srgb,var(--teal) 9%,transparent)}
.h2h.lose{border-color:var(--vermilion);background:color-mix(in srgb,var(--vermilion) 7%,transparent)}
.h2hv{font-family:"Tiempos Headline","Source Serif 4",Georgia,serif;font-size:26px}
.h2hs{display:flex;justify-content:center;gap:26px;margin-top:8px;
  font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--slate)}
.h2hs b{display:block;font-size:19px;letter-spacing:0;color:var(--ink);
  font-variant-numeric:tabular-nums}
.h2hg{display:flex;justify-content:center;gap:5px;margin-top:12px}
.h2hg i{width:22px;height:5px;border-radius:3px;background:var(--stone);display:block}
.h2hg i.w{background:var(--teal)} .h2hg i.l{background:var(--vermilion)}
.h2hg i.d{background:var(--saffron)}
.chalcard{margin-top:12px;padding:14px;border:1px solid color-mix(in srgb,var(--cobalt) 35%,var(--stone));border-radius:12px;background:color-mix(in srgb,var(--cobalt) 5%,var(--surface))}
.chalhead b{display:block;font:600 17px "Source Serif 4",Georgia,serif;color:var(--cobalt)}
.chalhead span{display:block;font-size:14px;color:var(--slate);margin:2px 0 10px}
.chalfriends{display:flex;flex-wrap:wrap;gap:8px}
.chalchip{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:1px;padding:8px 30px 8px 12px;border-radius:12px;
  border:1px solid var(--cobalt);background:var(--surface);color:var(--ink);cursor:pointer;font:inherit;text-align:left;min-height:44px}
.chalchip b{font:600 15px "Source Serif 4",Georgia,serif}.chalchip small{font:500 11px "JetBrains Mono",monospace;color:var(--slate);letter-spacing:.04em}
.chalchip:hover,.chalchip:focus-visible{background:var(--cobalt);color:#fff}.chalchip:hover small,.chalchip:focus-visible small{color:#E0E7FF}
.chalchip.new{border-style:dashed;padding-right:12px}
.chalchip.app{border-color:var(--teal)}.chalchip.app small{color:var(--teal)}
.chalchip.app:hover,.chalchip.app:focus-visible{background:var(--teal)}
.chalrm{position:absolute;top:2px;right:4px;width:22px;height:22px;display:flex;align-items:center;justify-content:center;border-radius:50%;font-size:16px;color:var(--slate)}
.chalrm:hover{background:rgba(0,0,0,.12)}
.chalme{margin-top:10px;font-size:13px;color:var(--slate)}.chalme a{color:var(--cobalt)}
.chalchip.played{border-style:solid;border-color:var(--stone);background:var(--surface)}.chalchip.played.won{border-color:var(--teal)}.chalchip.played.won small{color:var(--teal)}
.chalchip.played.lost small{color:#C2410C}
.chalinv{display:flex;align-items:center;gap:12px;margin-top:14px;padding-top:12px;border-top:1px dashed color-mix(in srgb,var(--cobalt) 30%,var(--stone))}
.chalinv>span{flex:1;min-width:0}.chalinv b{display:block;font:600 15.5px "Source Serif 4",Georgia,serif;color:var(--ink)}.chalinv small{display:block;font-size:13px;line-height:1.35;color:var(--slate);margin-top:1px}
.chalinvbtn{flex:none;width:auto;margin:0;padding:9px 14px;font-size:15px}
.chalmake label i{font-style:normal;text-transform:none;letter-spacing:0;opacity:.8}
.chalmake label+label{margin-top:10px}
.chalmake{margin-top:12px;padding:13px;border:1px solid var(--stone);border-radius:8px;
  background:var(--surface)}
.chalmake label{display:block;font-family:"JetBrains Mono",monospace;font-size:10px;
  letter-spacing:.1em;text-transform:uppercase;color:var(--slate)}
.chalmake input{display:block;width:100%;margin-top:6px;padding:11px 12px;
  font:400 16px "Source Serif 4",serif;color:var(--ink);background:var(--paper);
  border:1px solid var(--stone);border-radius:7px}
.chalmake input:focus{outline:2px solid var(--cobalt);outline-offset:1px}
.chalmake textarea{display:block;width:100%;margin-top:6px;padding:11px 12px;resize:vertical;min-height:74px;
  font:400 16px "Source Serif 4",serif;color:var(--ink);background:var(--paper);border:1px solid var(--stone);border-radius:7px}
.chalmake textarea:focus{outline:2px solid var(--cobalt);outline-offset:1px}
.replink{display:block;margin:12px 0 0 auto;padding:4px 0;background:none;border:0;cursor:pointer;
  font:400 13px "Source Serif 4",serif;color:var(--slate);text-decoration:underline;text-decoration-color:var(--stone);text-underline-offset:3px}
.replink:hover{color:var(--ink)}
.repsub{margin:2px 0 0;font-size:15px;color:var(--slate)}
.rpkinds{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 2px}
.rpk{padding:7px 12px;border:1px solid var(--stone);border-radius:999px;background:var(--surface);cursor:pointer;
  font:400 14px "Source Serif 4",serif;color:var(--ink)}
.rpk.on{background:var(--ink);border-color:var(--ink);color:#FAFAF8}
.repform{margin-bottom:12px}

.ppin{fill:var(--pin);stroke:var(--paper);stroke-width:calc(var(--u,1)*.5px)}
.ppind{fill:var(--paper)}
.route{stroke-linecap:round;stroke-linejoin:round}

/* on reveal the route is the subject; the answer markers recede to small rings */
.map.revealed .leader{display:none}
.map.revealed .pin circle.dot{fill:none;stroke-width:calc(var(--u,1)*1.6px);opacity:.75}
.map.revealed .pin.right circle.dot{stroke:var(--teal)}
.map.revealed .pin.wrong circle.dot{stroke:var(--pin)}
.map.revealed .pin.dim{display:none}
.emb em{display:block;font-family:"JetBrains Mono",monospace;font-size:10px;
  font-style:normal;color:var(--teal);margin-top:2px;font-variant-numeric:tabular-nums}
.emb:not(.got) em{color:var(--slate)}

/* ---- the win moment ---- */
.cheer{font-family:"Tiempos Headline","Source Serif 4",Georgia,serif;font-size:19px;
  line-height:1.3;color:var(--teal);margin:2px 0 8px}
.defn-line{font-size:14.5px;line-height:1.5;color:var(--ink);margin-bottom:10px}
.evo{border-top:1px solid var(--stone);padding-top:10px;margin-bottom:2px}
.evohead{font-family:"JetBrains Mono",monospace;font-size:9px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--slate);margin-bottom:6px}
.evorow{display:grid;grid-template-columns:1fr auto 78px;gap:10px;align-items:baseline;
  padding:3px 0;border-bottom:1px dotted var(--stone)}
.evorow:last-child{border-bottom:0}
.evorow .el{font-family:"JetBrains Mono",monospace;font-size:11px;color:var(--slate)}
.evorow .ef{font-family:"Tiempos Headline","Source Serif 4",Georgia,serif;font-size:16px;
  color:var(--ink)}
.evorow:last-child .ef{color:var(--teal)}
.evorow .ep{font-family:"JetBrains Mono",monospace;font-size:9.5px;color:var(--slate);
  text-align:right}
.quote{margin:11px 0 0;padding:10px 0 0;border-top:1px solid var(--stone);
  font-style:italic;font-size:15px;line-height:1.5;color:var(--ink)}
.quote cite{display:block;font-style:normal;font-family:"JetBrains Mono",monospace;
  font-size:10px;letter-spacing:.06em;color:var(--slate);margin-top:5px}
.lorenote{margin-top:10px;font-size:13.5px;line-height:1.5;color:var(--slate)}
.lorenote em{color:var(--ink);font-style:italic}
@media (max-width:560px){
  .cheer{font-size:17px}
  .evorow{grid-template-columns:1fr auto;gap:8px}
  .evorow .ep{display:none}
  .evorow .ef{font-size:15px}
}

@media (max-width:560px){
  /* the reveal is a reading screen: let it scroll, but never let the action leave the thumb */
  .panel.revealed .btn{position:sticky;bottom:calc(8px + env(safe-area-inset-bottom));z-index:5;
    box-shadow:0 6px 22px rgba(11,31,42,.22)}
  .card{padding:13px}
  .cheer{margin:0 0 7px}
  .defn-line{margin-bottom:8px;font-size:14px}
  .evo{padding-top:8px}
  .evorow{padding:2px 0}
  .lorenote{margin-top:8px}
  .quote{margin-top:9px;padding-top:9px;font-size:14.5px}
  /* once the route is drawn the map has done its job; give the words the room */
  #game:has(.map.revealed) .mapwrap{aspect-ratio:2.5/1}
}
@media (max-width:560px) and (max-height:700px){
  #game:has(.map.revealed) .mapwrap{aspect-ratio:3/1}
}

/* ---- profile ---- */
.hbtn.me{padding:4px 11px 4px 5px;gap:7px}
.hbtn.me img{width:22px;height:22px;border-radius:50%}
.idcard{display:flex;align-items:center;gap:13px;padding:14px;border:1px solid var(--stone);
  border-radius:10px;background:var(--surface)}
.avat{padding:0;border:0;background:none;cursor:pointer;line-height:0;border-radius:50%;
  outline-offset:3px}
.avat img{width:54px;height:54px;border-radius:50%;border:1px solid var(--stone)}
.avat:hover img{border-color:var(--teal)}
.idtext{min-width:0;flex:1}
.idname{font-family:"Tiempos Headline","Source Serif 4",Georgia,serif;font-size:24px;
  line-height:1.15;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.idrank{display:flex;align-items:center;gap:6px;margin-top:4px;
  font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.07em;
  text-transform:uppercase;color:var(--slate)}
.idrank img{width:15px;height:15px}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
.st{display:block;padding:11px 8px;border:1px solid var(--stone);border-radius:8px;
  background:var(--surface);text-align:center;font-family:"JetBrains Mono",monospace;
  font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--slate)}
.st b{display:block;font-size:20px;letter-spacing:0;color:var(--ink);margin-bottom:3px;
  font-variant-numeric:tabular-nums}
.panelbox{padding:13px;border:1px solid var(--stone);border-radius:8px;background:var(--surface)}
.panelbox+.panelbox{margin-top:9px}
.panelbox label{display:block;font-family:"JetBrains Mono",monospace;font-size:10px;
  letter-spacing:.1em;text-transform:uppercase;color:var(--slate);margin-bottom:9px}
.panelbox input,.panelbox textarea{display:block;width:100%;margin-top:6px;padding:11px 12px;
  font:400 16px "Source Serif 4",serif;color:var(--ink);background:var(--paper);
  border:1px solid var(--stone);border-radius:7px;resize:vertical}
.panelbox input:focus,.panelbox textarea:focus{outline:2px solid var(--cobalt);outline-offset:1px}
.acctnote{font-size:13.5px;line-height:1.55;color:var(--slate)}
.acctnote b{color:var(--ink)} .acctnote b.bad{color:var(--vermilion)}
.acctrow{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:11px}
.frbox{margin-top:12px;padding-top:12px;border-top:1px solid var(--stone)}
.frhead{display:flex;align-items:center;gap:8px;margin-bottom:8px}.frhead b{font-size:15px}
.frhead span{font:600 12px "JetBrains Mono",monospace;color:var(--teal);background:color-mix(in srgb,var(--teal) 12%,transparent);border-radius:999px;padding:1px 8px}
.frlist{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.frchip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px 4px 4px;border:1px solid var(--stone);border-radius:999px;font-size:14px;background:var(--paper)}
.frchip img{width:22px;height:22px;border-radius:50%}
.frnone{font-size:13.5px;color:var(--slate);margin:0 0 10px}
.acctout{display:block;margin:16px 0 0}
#lbbtn.would #lbrank{opacity:.55}
.hbtn.lab{flex-direction:column;justify-content:center;gap:1px;line-height:1.05;padding-top:3px;padding-bottom:3px}
.hval{display:flex;align-items:center;gap:5px}
.hlab{font:500 8.5px "JetBrains Mono",monospace;letter-spacing:.06em;text-transform:uppercase;color:var(--slate)}
.shbtn.pref{outline:2px solid var(--teal);outline-offset:2px;border-radius:12px}
.pwwrap{position:relative;display:block;margin-top:6px}
.pwwrap input{margin-top:0!important;padding-right:52px!important}
.pweye{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:44px;height:40px;border:0;border-radius:8px;
  background:none;color:var(--slate);cursor:pointer;display:grid;place-items:center;padding:0}
.pweye:hover{color:var(--ink)}.pweye:focus-visible{outline:2px solid var(--cobalt);outline-offset:1px}
@media (max-width:400px){header .mark{height:30px}.hud{gap:3px}.hbtn{padding:4px 6px}.hbtn .hico{margin-right:2px}#lbrank .lbh{display:none}}
@media (max-width:350px){header .mark{height:25px}}
#lbbtn.up{animation:lbpop .9s ease}
@keyframes lbpop{0%{transform:scale(1)}30%{transform:scale(1.2)}100%{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){#lbbtn.up{animation:none}}
.lbcard{margin:14px 0;padding:16px;border:1px solid var(--stone);border-radius:12px;background:var(--surface)}
.lbk{font:500 10.5px "JetBrains Mono",monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--teal)}
.lbv{margin:6px 0 4px;font-size:15px;color:var(--slate)}
.lbv b{font-size:34px;color:var(--ink);font-variant-numeric:tabular-nums;margin-right:6px}
.lbw{font-size:14px;color:var(--slate);margin-bottom:12px}.lbw b{color:var(--ink)}
.lbup{font-style:normal;color:var(--sage);font-weight:600}
.lbtabs{display:flex;gap:6px;margin:8px 0 14px}
.lbtabs button{flex:1;font:500 11px "JetBrains Mono",monospace;letter-spacing:.08em;text-transform:uppercase;padding:10px 6px;
  border-radius:999px;border:1px solid var(--stone);background:var(--surface);color:var(--ink);cursor:pointer}
.lbtabs button.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.lbhero{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin:4px 0 12px}
.lbhero b{font-size:44px;line-height:1;font-variant-numeric:tabular-nums}
.lbhero span{color:var(--slate);font-size:15px}
.lbhero i{font:600 11px "JetBrains Mono",monospace;font-style:normal;color:var(--teal);
  background:color-mix(in srgb,var(--teal) 12%,transparent);border-radius:999px;padding:3px 9px}
.lbask{font-size:16px;margin:4px 0 12px}
.lblist{list-style:none;margin:0 0 16px;padding:0;border:1px solid var(--stone);border-radius:12px;background:var(--surface);overflow:hidden}
.lbrow{display:grid;grid-template-columns:34px 28px 1fr auto;align-items:center;gap:10px;padding:10px 14px;border-top:1px solid var(--stone);font-size:15px}
.lbrow:first-child{border-top:0}
.lbr{font:600 13px "JetBrains Mono",monospace;color:var(--slate);text-align:right;font-variant-numeric:tabular-nums}
.lbrow img{width:28px;height:28px;border-radius:50%}
.lbn{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lbn i{font:500 10px "JetBrains Mono",monospace;text-transform:uppercase;letter-spacing:.08em;color:var(--teal);margin-left:6px;font-style:normal}
.lbs{font-variant-numeric:tabular-nums;font-weight:600}
.lbrow.me{background:color-mix(in srgb,var(--teal) 10%,var(--surface))}
.lbrow.p1 .lbr{color:var(--saffron)}.lbrow.p3 .lbr{color:#B45309}
.lbgap{text-align:center;color:var(--slate);padding:2px;border-top:1px solid var(--stone);letter-spacing:.3em}
.lbfr .lbrow{grid-template-columns:28px 1fr 58px 64px}
.lbfr .lbhd{font:500 10px "JetBrains Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--slate);padding:8px 14px}
.lbfr .lbs{text-align:right}.lbfr .lbs.dim{color:var(--slate);font-weight:400}
.lbname{margin:0 0 14px}
.acform .acctrow{grid-template-columns:1fr}
.acswitch{display:block;margin:12px 0 4px}
.acnotify{display:flex;gap:10px;align-items:flex-start;margin:12px 0 4px;font-size:14.5px;line-height:1.4;color:var(--ink);cursor:pointer}
.acnotify input{margin-top:3px;width:18px;height:18px;flex:none}
.acctline{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin:-4px 2px 14px;font-size:14px;color:var(--slate)}
.acctline b{color:var(--ink);font-weight:600}.acctline .linkbtn{margin-left:auto}
.homelogin{margin-top:10px;font-size:15px;color:var(--hs)}.homelogin .linkbtn{font:inherit;padding:0;color:var(--ht);font-weight:600}
.aclinks{display:flex;flex-wrap:wrap;gap:4px 16px;margin:10px 0 2px}
.accode input{font:600 22px/1.2 "JetBrains Mono",monospace;letter-spacing:.3em;text-align:center}
.accode input::placeholder{font-size:15px;letter-spacing:.04em;font-weight:400}
.acform input[readonly]{opacity:.7}
.frtop{grid-template-columns:1fr;margin:4px 0 6px}
.frbody .ntrow{margin-bottom:8px;align-items:flex-start}
.frbody .ntrow .ntgo,.frbody .ntrow .ntx{align-self:center}
.frav{width:36px;height:36px;border-radius:50%;flex:none}
.frn{font:600 11px "JetBrains Mono",monospace;color:var(--teal);background:color-mix(in srgb,var(--teal) 12%,transparent);border-radius:999px;padding:1px 7px;margin-left:6px}
.frress{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.frres{display:inline-block;font:600 11.5px "JetBrains Mono",monospace;border-radius:999px;padding:2px 8px;background:var(--paper);border:1px solid var(--stone);color:var(--slate)}
.nttx>.frres{margin-top:6px}
.frres.won{color:#1F7A3E;border-color:#9FD3B0;background:#EEF8F1}.frres.lost{color:#B0302A;border-color:#F0B4AE;background:#FDEEEC}
.frres.tie{color:#8F6C00;border-color:#EBD58A;background:#FFFBEA}
.btn.ntgo:disabled{opacity:.5;cursor:default}
.frpad{margin:6px 2px 12px}
.hubstrip{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:6px 0 10px}
.hubt{display:flex;flex-direction:column;align-items:center;gap:3px;padding:10px 4px;border:1px solid var(--stone);border-radius:12px;background:var(--surface);color:var(--ink);font:inherit;cursor:pointer}
.hubt:hover{border-color:var(--slate)}
.hubt b{font:700 22px/1.1 "Source Serif 4",Georgia,serif;font-variant-numeric:tabular-nums;white-space:nowrap}
.hubt small{font:500 10px "JetBrains Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--slate)}
.hubt.dim b{opacity:.55}.hubt.hot{border-color:var(--cobalt)}.hubt.hot b{color:var(--cobalt)}
/* stat tiles in the badge palette: the same warm-to-cool card as the badges, each figure in its own muted tone */
.hubt,.st{--ac:#4CA3A1;border-color:color-mix(in srgb,var(--ac) 40%,#E5E7EB);background:linear-gradient(120deg,#FBF3E2 0%,#EEF5F2 100%);box-shadow:inset 0 3px 0 color-mix(in srgb,var(--ac) 75%,transparent)}
.hubt b,.st b{color:color-mix(in srgb,var(--ac) 80%,#0B1F2A)}
.hubt:hover{border-color:var(--ac)}
.hubstrip>:nth-child(1){--ac:#E5A23B}.hubstrip>:nth-child(2){--ac:#5DA284}.hubstrip>:nth-child(3){--ac:#327478}
.stats>:nth-child(1){--ac:#4CA3A1}.stats>:nth-child(2){--ac:#E5A23B}.stats>:nth-child(3){--ac:#80A166}
.stats>:nth-child(4){--ac:#623470}.stats>:nth-child(5){--ac:#327478}.stats>:nth-child(6){--ac:#AAA14D}
.tabn{font-style:normal;background:var(--cobalt);color:#fff;border-radius:999px;padding:0 6px;margin-left:4px}
.lbtabs button.on .tabn{background:var(--paper);color:var(--ink)}
.hubfr .lbrow{align-items:start}.hubfr .lbrow img{margin-top:2px}
.hubfr .lbrow.tap{cursor:pointer}.hubfr .lbrow.tap:hover{background:color-mix(in srgb,var(--stone) 25%,var(--surface))}
.hubfr .lbrow.tap[aria-expanded="true"]{background:color-mix(in srgb,var(--cobalt) 7%,var(--surface))}
.lbn .lbsub{display:block;white-space:normal;font-size:12.5px;color:var(--slate);margin-top:2px;line-height:1.5}
.lbn .lbsub .frst{margin-top:0;padding:0 7px;font-size:10.5px}
.lbgo{color:var(--slate);margin-left:6px;font-size:16px}
.lbrow.tap[aria-expanded="true"] .lbgo{display:inline-block;transform:rotate(90deg)}
.rvbox{display:block;padding:12px 12px 4px;border-top:1px solid var(--stone);background:var(--paper)}
.rvbox .rvhead{margin:0 0 10px;padding:10px 8px}.rvbox .rvside b{font-size:26px}.rvbox .rvside img{width:32px;height:32px}
.rvbox .rvgo{margin:0 0 10px}.rvbox .ntrow{margin-bottom:8px}
.ntrow.tap{cursor:pointer;align-items:center!important}.ntrow.tap:hover{border-color:var(--slate)}
.frnum{font-weight:700;color:var(--ink)}
.frgo{flex:none;font-size:26px;line-height:1;color:var(--slate);padding:0 2px}
.frst{display:inline-block;margin-top:6px;font:600 11.5px "JetBrains Mono",monospace;border-radius:999px;padding:2px 8px;border:1px solid var(--stone);color:var(--slate);background:var(--paper)}
.frst.turn{color:#fff;background:var(--cobalt);border-color:var(--cobalt)}
.frst.wait{color:#8F6C00;border-color:#EBD58A;background:#FFFBEA}
.frfold{margin:14px 0 4px}.frfold summary{cursor:pointer;font:600 12px "JetBrains Mono",monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--slate);padding:6px 2px;list-style-position:inside}
.frfold[open] summary{margin-bottom:8px}
.rvhead{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;margin:6px 0 14px;padding:16px 10px;border:1px solid var(--stone);border-radius:16px;background:var(--surface)}
.rvside{display:flex;flex-direction:column;align-items:center;gap:2px;opacity:.75}.rvside.top{opacity:1}
.rvside img{width:44px;height:44px;border-radius:50%}
.rvside b{font:700 34px/1.05 "Source Serif 4",Georgia,serif;color:var(--ink)}.rvside.top b{color:var(--saffron)}
.rvside small{font-size:13px;color:var(--slate);max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rvmid{text-align:center;font:600 12px "JetBrains Mono",monospace;letter-spacing:.06em;text-transform:uppercase;color:var(--slate)}
.rvmid small{display:block;margin-top:4px;text-transform:none;letter-spacing:0}
.ntrow.rv .nttx>.frres,.ntrow.rv .nttx>.frst{margin-top:6px}
.bgvs{display:flex;align-items:flex-end;justify-content:center;gap:20px;margin:4px 0 2px;font-size:13px;color:var(--slate)}
.bgvs>div{display:flex;flex-direction:column;align-items:center}.bgvs i{font:700 26px/1.1 "Source Serif 4",Georgia,serif;font-style:normal;color:var(--ink)}
.bgvs .top i{color:var(--saffron)}.bgvs .bgx{font:600 11px "JetBrains Mono",monospace;padding-bottom:6px}
.bigcard .b2{margin-top:0}
.bigcard b.bgplus{display:inline;font:600 16px/1.4 inherit;font-family:inherit;color:#8F6C00}
.ntfr{margin-top:12px}
.chalall{display:inline-block;margin-top:10px;font-size:13.5px;color:var(--cobalt)}
.acctrow .btn{margin-top:0}
.avgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;margin-top:8px}
.avopt{padding:6px;border:1px solid var(--stone);border-radius:8px;background:var(--paper);
  cursor:pointer;line-height:0}
.avopt.on{border-color:var(--teal);background:color-mix(in srgb,var(--teal) 10%,transparent)}
.avopt img{width:100%;height:auto;border-radius:50%}
@media (max-width:560px){
  .stats{grid-template-columns:repeat(2,1fr)}
  .idname{font-size:21px}
  .avat img{width:46px;height:46px}
  .acctrow{grid-template-columns:1fr}
  .avgrid{grid-template-columns:repeat(4,1fr)}
}

/* ================= v3: fill the screen, readable type, explanations, footer, ads ================= */
.mark{height:40px}
.ask{font-size:12.5px;letter-spacing:.12em}
.ask .tag{font-size:11px}
.choice{font-size:17px}
.help{font-size:13px}
.help .hc{font-size:11px}
.howline{font-size:14.5px;line-height:1.45;color:var(--slate);text-align:center;
  margin:8px auto 0;max-width:32em;text-wrap:balance}
.howline a{color:var(--teal);text-decoration:none;border-bottom:1px solid currentColor;cursor:pointer}
#game:has(.panel.revealed) .howline{display:none}
#howbtn{font-weight:500;min-width:34px;justify-content:center}
circle.hit{fill:transparent;stroke:none}
/* map text is sized in real screen px: --k = map units per screen px */
.pin text{font-size:calc(var(--k,.4)*13px);stroke-width:calc(var(--k,.4)*4px)}
.pin .ord{font-size:calc(var(--k,.4)*10px)}
.hop text{stroke-width:calc(var(--k,.4)*4.5px)}
.hop text.lang{font-size:calc(var(--k,.4)*14.5px)}
.hop text.place{font-size:calc(var(--k,.4)*11px)}
svg#map .scalebar{font-size:calc(var(--k,.4)*10.5px)}
.mapwrap{aspect-ratio:16/10}

/* ---- ad slot (reserved height, never on the question screen) ---- */
.adslot{margin-top:14px;border:1px dashed var(--stone);border-radius:8px;padding:10px 12px 12px;
  background:var(--surface);min-height:96px}
.adslot .adl{font-family:"JetBrains Mono",monospace;font-size:9.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--slate);margin-bottom:6px}
.adslot.net{min-height:250px}
.loopend{margin-top:14px;min-height:250px}   /* space held for the network card: nothing jumps when it lands */
/* a box that will show nothing collapses completely: blocked, or the network sent nothing */
.loopend.adgone,.adslot.adgone,html.adblock .loopend,html.adblock .adslot,html.adblock [data-loop-unit]{display:none!important}
.house{display:flex;align-items:center;gap:12px;width:100%;min-height:100px;padding:0;border:0;background:none;
  text-align:left;cursor:pointer;color:var(--ink);font:inherit}
.house img{width:40px;height:40px;flex:0 0 auto}
.house b{display:block;font:600 16px/1.3 "Source Serif 4",serif}
.house small{display:block;font-size:13.5px;line-height:1.4;color:var(--slate);margin-top:2px}
.house .go{margin-left:auto;flex:0 0 auto;font-family:"JetBrains Mono",monospace;font-size:11px;
  letter-spacing:.08em;color:var(--teal);white-space:nowrap}

/* ---- how to play ---- */
.howov{position:fixed;inset:0;z-index:60;background:rgba(11,31,42,.55);display:flex;
  align-items:flex-end;justify-content:center;padding:0}
.howcard{background:var(--paper);color:var(--ink);width:100%;max-width:560px;max-height:92dvh;
  overflow:auto;border-radius:16px 16px 0 0;padding:22px 20px calc(18px + env(safe-area-inset-bottom));
  box-shadow:0 -10px 40px rgba(0,0,0,.25)}
@media (min-width:561px){.howov{align-items:center}.howcard{border-radius:14px}}
.howcard h2{font-family:"Tiempos Headline","Source Serif 4",Georgia,serif;font-weight:400;
  font-size:30px;line-height:1.15;margin:0 0 6px}
.howcard p{margin:0 0 12px;font-size:16px;line-height:1.55}
.howmodes{display:grid;gap:8px;margin:12px 0}
.howmodes div{display:grid;grid-template-columns:92px 1fr;gap:10px;align-items:baseline;
  padding:9px 11px;border:1px solid var(--stone);border-radius:8px;background:var(--surface);
  font-size:14.5px;line-height:1.4}
.howmodes span{font-family:"JetBrains Mono",monospace;font-size:10.5px;letter-spacing:.1em;color:var(--teal)}
.howcard .fine{font-size:13.5px;color:var(--slate)}
.howcard a{color:var(--teal)}

/* ================= v4: bigger, bolder, hooks ================= */
.mapwrap{border-radius:14px;border-color:color-mix(in srgb,var(--teal) 18%,var(--stone));
  background:radial-gradient(130% 100% at 50% 0%,color-mix(in srgb,var(--sea) 60%,var(--surface)) 0%,var(--sea) 70%)}
.land{fill:color-mix(in srgb,var(--land) 88%,var(--teal))}
.pin circle.dot{stroke-width:calc(var(--k,.4)*2.5px);fill:var(--surface)}
.pin text{font-size:calc(var(--k,.4)*15px);font-weight:600;stroke-width:calc(var(--k,.4)*5px)}
.pin circle.pulse{fill:none;stroke:var(--teal);stroke-width:calc(var(--k,.4)*2px);opacity:0;
  transform-box:fill-box;transform-origin:center;animation:pulse 2.4s ease-out infinite;pointer-events:none}
.pin:nth-of-type(2n) circle.pulse{animation-delay:.6s} .pin:nth-of-type(3n) circle.pulse{animation-delay:1.2s}
@keyframes pulse{0%{opacity:.7;transform:scale(1)}80%,100%{opacity:0;transform:scale(2.6)}}
.map.revealed circle.pulse,.pin.locked circle.pulse,.pin.dim circle.pulse{display:none}
.hop text.lang{font-size:calc(var(--k,.4)*16px)} .hop text.place{font-size:calc(var(--k,.4)*12px)}
.word.rise{animation:rise .45s cubic-bezier(.2,.9,.3,1)}
@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.choice{border-radius:12px;font-size:19px;box-shadow:0 1px 0 var(--stone)}
.choice.out{animation:shake .35s}
@keyframes shake{20%,60%{transform:translateX(-5px)}40%,80%{transform:translateX(5px)}}
.choice.hit{animation:pop .35s}
@keyframes pop{50%{transform:scale(1.04)}}
.verdict img{animation:pop .5s .1s both}
.hbtn{font-size:14px;padding:7px 13px;min-height:40px}
.hbtn.me img{width:26px;height:26px}
.pip{height:5px;border-radius:3px}
/* goal strip */
.goal{display:flex;align-items:center;gap:10px;width:100%;margin:0 0 10px;padding:7px 12px 7px 8px;
  background:var(--surface);border:1px solid var(--stone);border-radius:12px;cursor:pointer;
  color:var(--ink);font:inherit;text-align:left}
.goal .bimg{width:32px;height:32px;flex:0 0 auto}
.goal .gtext{display:flex;flex-direction:column;line-height:1.15;min-width:0}
.goal .gtext small{font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.12em;color:var(--slate)}
.goal .gtext b{font:600 15px/1.2 "Source Serif 4",serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.goal .gbar{flex:1 1 auto;height:6px;background:var(--stone);border-radius:3px;overflow:hidden;min-width:40px}
.goal .gbar i{display:block;height:100%;background:linear-gradient(90deg,var(--teal),var(--saffron));border-radius:3px;transition:width .8s cubic-bezier(.2,.9,.3,1)}
.goal .gsub{font-family:"JetBrains Mono",monospace;font-size:11px;color:var(--slate);white-space:nowrap}
.goal.bump{animation:pop .5s}
.pips[hidden]+.goal,.wrap:has(#endscreen:not([hidden])) .goal{display:none!important}
body:has(#endscreen:not([hidden])) .shelf,body:has(#atlas:not([hidden])) .shelf{display:none}
/* badge art */
.bimg{display:block;border-radius:50%}
.bimg.locked{filter:grayscale(1);opacity:.4}
.emb:not(.got){opacity:1} .emb:not(.got) img{filter:grayscale(1);opacity:.4} .emb:not(.got) span{opacity:.6}
.badge .bimg{grid-row:1/3;width:30px;height:30px}
.badge:not(.got){opacity:1} .badge:not(.got) b{color:var(--slate)}
/* earned badges stand out; the ones still to win sit back in grey */
.badge.got{grid-template-columns:42px 1fr;border:1.5px solid color-mix(in srgb,var(--teal) 70%,transparent);
  background:linear-gradient(135deg,color-mix(in srgb,var(--saffron) 16%,var(--surface)),color-mix(in srgb,var(--teal) 13%,var(--surface)));
  box-shadow:0 3px 12px color-mix(in srgb,var(--teal) 20%,transparent)}
.badge.got .bimg{width:42px;height:42px;box-shadow:0 0 0 2px var(--surface),0 0 0 4px color-mix(in srgb,var(--saffron) 75%,transparent)}
.badge.got b{color:var(--ink);font-weight:700}
.badge.got small{color:color-mix(in srgb,var(--ink) 75%,var(--slate))}
.badge:not(.got){background:color-mix(in srgb,var(--stone) 25%,var(--paper));border:1px dashed var(--stone);box-shadow:none}
.badge:not(.got) .bimg{filter:grayscale(1);opacity:.25}
.badge:not(.got) b{font-weight:500;opacity:.75}
.badge:not(.got) small{opacity:.65}
.bcell.on .bimg,.sb.on .bimg{box-shadow:0 0 0 2px var(--surface),0 0 0 4px color-mix(in srgb,var(--saffron) 75%,transparent)}
.bcell.on span{font-weight:700}
.bcell:not(.on) .bimg,.sb:not(.on) .bimg{opacity:.25}
.bcell:not(.on) span,.sb:not(.on) b{opacity:.65}
.sb.on{background:linear-gradient(135deg,color-mix(in srgb,var(--saffron) 14%,var(--surface)),color-mix(in srgb,var(--teal) 12%,var(--surface)))}
/* rank progress on the reveal */
.rankprog{display:grid;grid-template-columns:1fr auto;gap:6px 10px;margin-top:12px;padding-top:12px;
  border-top:1px solid var(--stone);font-size:14px;color:var(--slate)}
.rankprog b{color:var(--ink)}
.rankprog .rpn{font-family:"JetBrains Mono",monospace;font-size:11px;align-self:center}
.rankprog .rpb{grid-column:1/-1;height:7px;background:var(--stone);border-radius:4px;overflow:hidden}
.rankprog .rpb i{display:block;height:100%;background:linear-gradient(90deg,var(--teal),var(--saffron));
  border-radius:4px;transition:width 1.1s cubic-bezier(.2,.9,.3,1)}
/* countdown */
.countdown{margin:16px auto 0;padding:12px 14px;border:1px solid var(--stone);border-radius:12px;background:var(--surface);max-width:360px}
.countdown small{display:block;font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.14em;color:var(--slate)}
.countdown b#cdown{display:block;font-family:"JetBrains Mono",monospace;font-size:30px;font-weight:500;letter-spacing:.04em;font-variant-numeric:tabular-nums}
.countdown span{display:block;font-size:14px;color:var(--slate);margin-top:2px}
.countdown span b{color:var(--ink)}
/* badge grid on the result, shelf under the game */
.bgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.bcell{display:flex;flex-direction:column;align-items:center;gap:5px;padding:8px 2px;border:0;background:none;cursor:pointer;color:var(--slate);font:inherit}
.bcell .bimg{width:46px;height:46px}
.bcell span{font-family:"JetBrains Mono",monospace;font-size:9.5px;letter-spacing:.04em;text-align:center;line-height:1.25}
.bcell.on span{color:var(--ink)}
.shelf{max-width:720px;margin:0 auto;padding:22px 16px 6px}
.shelf .shead{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:10px}
.shelf .shead b{font:400 22px "Tiempos Headline","Source Serif 4",serif}
.shelf .shead span{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.08em;color:var(--slate);text-transform:uppercase}
.shelf .srow{display:grid;grid-auto-flow:column;grid-auto-columns:112px;gap:10px;overflow-x:auto;
  padding-bottom:8px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
.sb{scroll-snap-align:start;display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 8px;
  border:1px solid var(--stone);border-radius:12px;background:var(--surface);cursor:pointer;font:inherit;color:var(--slate)}
.sb .bimg{width:48px;height:48px}
.sb b{font:600 13.5px/1.2 "Source Serif 4",serif;text-align:center;color:var(--slate)}
.sb small{font-family:"JetBrains Mono",monospace;font-size:10px;text-align:center;line-height:1.3}
.sb.on{border-color:var(--teal)} .sb.on b{color:var(--ink)}
@media (max-width:560px){
  .mark{height:40px}
  .hud{gap:6px}
  .word{font-size:clamp(42px,12vw,56px)}
  .ask{font-size:13px}
  .choice{font-size:19px;min-height:62px;padding:14px}
  .help{font-size:14px;min-height:54px}
  .howline{font-size:14.5px}
  .goal{margin-bottom:8px}
  .bgrid{grid-template-columns:repeat(4,1fr)}
}
@media (max-width:560px) and (max-height:700px){ .goal{display:none} }
@media (max-width:560px) and (max-height:780px){ .howline{display:none} .mapwrap{min-height:150px} .goal{padding:5px 10px 5px 6px} .goal .bimg{width:26px;height:26px} }

/* ---- Plus ---- */
.adslot .adl{display:flex;justify-content:space-between;align-items:baseline}
.adfree{color:var(--teal);cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.plushero{text-align:center;margin:6px 0 14px}
.plushero img{width:56px;height:56px;margin-bottom:4px}
.plussub{font-size:17px;color:var(--slate);margin-top:4px}
.plusperks{display:grid;gap:8px;margin-bottom:14px}
.pluscmp{margin-bottom:14px}
.pluscmp table{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--stone);border-radius:12px;background:var(--surface);overflow:hidden;font-size:14.5px}
.pluscmp th{font:500 10.5px "JetBrains Mono",monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--slate);padding:10px 8px;text-align:center}
.pluscmp td{padding:11px 8px;border-top:1px solid var(--stone);text-align:center;color:var(--slate);vertical-align:middle}
.pluscmp td:first-child{text-align:left;padding-left:14px;color:var(--ink);width:56%}
.pluscmp .pc{background:color-mix(in srgb,var(--teal) 9%,var(--surface));color:var(--ink)}
.pluscmp th.pc{color:var(--teal)}
.pluscmp .fine{margin-top:8px}
.plusline{display:flex;align-items:center;gap:10px;width:100%;margin:12px 0;padding:10px 12px;border:1px dashed var(--stone);border-radius:12px;
  background:none;color:var(--ink);font:inherit;font-size:14px;text-align:left;cursor:pointer}
.plusline img{width:26px;height:26px}.plusline span{flex:1}.plusline em{font:500 10.5px "JetBrains Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--teal);font-style:normal;white-space:nowrap}
.plusline .plx{border:0;background:none;color:var(--slate);font-size:18px;padding:2px 4px;cursor:pointer}
.vidplus{margin-top:8px;font-size:13px;color:#CBD5E1;text-align:center}.vidplus a{color:#5EEAD4}
.plusperks div{padding:12px 14px;border:1px solid var(--stone);border-radius:12px;background:var(--surface)}
.plusperks b{display:block;font:600 17px/1.3 "Source Serif 4",serif}
.plusperks span{font-size:14.5px;color:var(--slate)}
.plusbox{margin-bottom:6px}
.plusprices{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}
.pbtn{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;padding:16px 8px;
  border:1px solid var(--stone);border-radius:12px;background:var(--surface);cursor:pointer;color:var(--ink);font:inherit}
.pbtn b{font:600 26px/1.1 "Source Serif 4",serif}
.pbtn span{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.08em;color:var(--slate);text-transform:uppercase}
.pbtn.best{border:2px solid var(--teal);background:color-mix(in srgb,var(--teal) 8%,var(--surface))}
.pbtn i{position:absolute;top:-10px;right:10px;background:var(--saffron);color:#0B1F2A;font:600 11px "JetBrains Mono",monospace;
  font-style:normal;padding:3px 7px;border-radius:999px}
.pbtn:disabled{opacity:.5}
.plusnow{padding:14px;border:2px solid var(--teal);border-radius:12px;background:color-mix(in srgb,var(--teal) 8%,var(--surface));font-size:16px;margin-bottom:6px}
.plusrow{display:flex;align-items:center;gap:12px;width:100%;margin-top:12px;padding:12px 14px;border:1px solid var(--teal);
  border-radius:12px;background:color-mix(in srgb,var(--teal) 7%,var(--surface));cursor:pointer;color:var(--ink);font:inherit;text-align:left}
.plusrow img{width:34px;height:34px}
.plusrow b{display:block;font:600 16px "Source Serif 4",serif}.plusrow small{color:var(--slate);font-size:13px;text-wrap:balance}
.plusrow em{margin-left:auto;font:500 11px "JetBrains Mono",monospace;font-style:normal;color:var(--teal);white-space:nowrap}
.hbtn.me.isplus{border-color:var(--saffron)}
#melog{display:none}
.hbtn.me.out{flex-direction:column;justify-content:center;gap:1px;padding:3px 7px;line-height:1.05}
.hbtn.me.out #rankname{display:none}.hbtn.me.out #melog{display:block}
.hbtn.me.out img{width:20px;height:20px}
html.plus .adslot,html.plus .loopend,html.noads .adslot,html.noads .loopend{display:none!important}
/* ---- percentiles, email ---- */
.pctlines{margin:12px 0 0;padding:12px 14px;border-radius:12px;background:var(--surface);border:1px solid var(--stone);
  font-size:15.5px;line-height:1.5;text-align:left}
.pctlines div+div{margin-top:4px}.pctlines b{color:var(--teal)}
.subcard{margin-top:12px;padding:14px;border:1px solid var(--stone);border-radius:12px;background:var(--surface);text-align:left}
.pushcard .subrow{display:flex;align-items:center;gap:14px}.pushcard .linkbtn{color:var(--slate);white-space:nowrap;flex:none}.pushcard .pushgo{flex:1}
.litehome{max-width:520px;margin:0 auto;padding:28px 0 8px;text-align:center}
.litehome h2{font:600 clamp(28px,7.4vw,40px)/1.12 "Source Serif 4",serif;letter-spacing:-.01em;margin:0 0 22px;text-wrap:balance}
.litepics{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:0 0 26px}
.litepics figure{margin:0}.litepics img{width:100%;aspect-ratio:190/132;object-fit:contain;border-radius:10px;background:var(--surface);border:1px solid var(--stone);padding:3px;box-sizing:border-box}
.litepics figcaption{font:500 10.5px "JetBrains Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--slate);margin-top:6px}
.litehome .homebig{width:100%}.litemeta{margin-top:10px;font-size:13.5px;color:var(--slate)}
.litehome .homest{margin:0 0 14px}.litehome .subcard{margin-top:22px}.litehome>.btn.ghost{margin-top:14px;width:100%}
html.app #supportbtn{display:none}
@media (max-width:560px){#supportbtn{display:none}}
.profdon{display:none;margin:14px auto 0;color:var(--slate);font-size:14px}@media (max-width:560px){.profdon{display:block}}html.app .profdon{display:none!important}
#invbtn .hico.inv{color:var(--cobalt);font-size:14px;line-height:1}
@media (max-width:340px){#invbtn .hico.inv{font-size:12px}header .hud{gap:3px}header .hud #invbtn{padding-left:2px;padding-right:2px}#invbtn .hlab{letter-spacing:0}}
.invstrip{display:flex;align-items:center;gap:12px;width:100%;margin-top:12px;padding:12px 14px;border:1px solid color-mix(in srgb,var(--cobalt) 45%,var(--stone));border-radius:12px;
  background:color-mix(in srgb,var(--cobalt) 7%,var(--surface));cursor:pointer;color:var(--ink);font:inherit;text-align:left}
.invstrip .invic{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--cobalt);color:#fff;font-size:17px}
.invstrip>span{flex:1;min-width:0}.invstrip b{display:block;font:600 16px "Source Serif 4",serif}.invstrip small{display:block;color:var(--slate);font-size:13px;text-wrap:balance}
.invstrip em{flex:none;font:500 12px "JetBrains Mono",monospace;letter-spacing:.06em;color:var(--cobalt);font-style:normal}
.invprog{display:flex;align-items:center;gap:8px;margin:12px 0 2px;font-size:13.5px;color:var(--slate)}
.invprog i{width:12px;height:12px;border-radius:50%;border:1.5px solid var(--cobalt);flex:none}.invprog i.on{background:var(--cobalt)}
.invprog span{margin-left:4px}
.acctdel{display:block;margin-top:14px;color:var(--slate);font-size:13px}.acdelok{display:block;margin:12px 0 4px;font-size:14px}.acdelok input{display:block;width:100%;margin-top:6px;padding:10px;font:600 15px "JetBrains Mono",monospace;letter-spacing:.1em;border:1px solid var(--stone);border-radius:8px;box-sizing:border-box;background:var(--surface);color:var(--ink)}
.btn.bad{background:#B3412E;color:#fff}.btn.bad:disabled{opacity:.45}
.hwgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}@media (min-width:640px){.hwgrid{grid-template-columns:repeat(4,1fr)}}
.hwgrid figure{margin:0;padding:10px;border:1px solid var(--stone);border-radius:12px;background:var(--surface);text-align:center}
.hwgrid img{width:100%;aspect-ratio:190/132;object-fit:contain}.hwgrid figcaption{margin-top:6px;font-size:13px;color:var(--slate);line-height:1.3}
.hwgrid figcaption b{display:block;font:500 11px "JetBrains Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--teal);margin-bottom:2px}
.hwfold{margin-top:10px}
details.story{padding:0}details.story>summary{list-style:none;cursor:pointer;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;padding:14px 16px}
details.story>summary::-webkit-details-marker{display:none}details.story>summary::after{content:"+";margin-left:auto;font:500 18px "JetBrains Mono",monospace;color:var(--slate)}
details.story[open]>summary::after{content:"\2212"}details.story>summary b{font:600 21px "Source Serif 4",serif}
details.story .storyroute{font:500 12px "JetBrains Mono",monospace;letter-spacing:.04em;color:var(--teal)}
details.story>:not(summary){margin:0 16px 12px}details.story .storyfull{font:500 12px "JetBrains Mono",monospace;color:var(--slate)}
.endprof{margin-top:16px}
.subcard>b{display:block;font:600 17px "Source Serif 4",serif}.subcard>span{display:block;font-size:13.5px;color:var(--slate);margin-bottom:10px}
.subrow{display:grid;grid-template-columns:1fr auto;gap:8px}.subrow .btn{margin-top:0;padding:12px 14px;min-height:0}
.subrow input{padding:12px;font:400 16px "Source Serif 4",serif;color:var(--ink);background:var(--paper);border:1px solid var(--stone);border-radius:8px;min-width:0}
.subsp{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:14px;color:var(--slate)}
.subsp input{width:18px;height:18px}
/* ---- share card ---- */
.sharecard{margin:16px 0 4px;padding:14px;border:2px solid var(--teal);border-radius:14px;
  background:color-mix(in srgb,var(--teal) 6%,var(--surface));text-align:left}
.sharehead{display:flex;flex-direction:column;margin-bottom:8px}
.sharehead b{font:600 18px "Source Serif 4",serif}.sharehead span{font-size:13.5px;color:var(--slate)}
.sharepre{margin:0 0 10px;padding:10px 12px;background:var(--paper);border:1px solid var(--stone);border-radius:10px;
  font:15px/1.5 ui-monospace,"JetBrains Mono",monospace;white-space:pre-wrap;word-break:break-word}
.sharerow{display:grid;grid-template-columns:2fr 1fr;gap:8px}.sharerow .btn{margin-top:0}
.chalbtn{background:var(--cobalt)}
.chalhint{font-size:13.5px;color:var(--slate);margin-top:8px}
/* ---- where am I ---- */
.helplab{font-size:13.5px;color:var(--slate);margin:0 0 6px}.helplab b{color:var(--ink);font-weight:600}
@media (max-height:700px){.helplab{display:none}}
.ask{font:500 17px/1.35 "Source Serif 4",Georgia,serif!important;letter-spacing:0!important;text-transform:none!important;color:var(--ink)!important}
.ask .tag{font:500 10.5px "JetBrains Mono",monospace;letter-spacing:.12em;vertical-align:2px}
@media (max-width:560px){.ask{font-size:17px!important}}
.roundmeta{display:flex;align-items:center;gap:12px;white-space:nowrap;margin:-4px 0 8px;font:400 11.5px "JetBrains Mono",monospace;
  letter-spacing:.06em;color:var(--slate)}
.roundmeta b{font-weight:500;color:var(--ink);letter-spacing:.1em}
.roundmeta .rmtot,.roundmeta .rmhow{margin-left:auto}
.roundmeta .rmrisk{color:#B45309;white-space:normal}
.roundmeta .rmhow{color:var(--teal);text-decoration:underline;cursor:pointer}
.pips[hidden]~.roundmeta,body:has(#endscreen:not([hidden])) .roundmeta,body:has(#atlas:not([hidden])) .roundmeta{display:none}
@media (max-width:380px){.roundmeta span:not(.rmtot):not(.rmspd){display:none}}
/* ---- speed bonus: a draining chip, then a ticking frame as the window closes ---- */
.roundmeta .rmspd{display:inline-flex;align-items:center;gap:5px;padding:3px 8px 3px 7px;border-radius:999px;font-weight:600;
  color:var(--mc);background:color-mix(in srgb,var(--mc) 12%,transparent);border:1px solid color-mix(in srgb,var(--mc) 40%,transparent);
  font-variant-numeric:tabular-nums;transition:color .2s,background .2s,border-color .2s}
.roundmeta .rmspd.gone{color:var(--slate);border-color:var(--stone);background:transparent;opacity:.75}
.roundmeta .rmspd.won{color:#0B1F2A;background:#F5C542;border-color:#E0A800}
.spdhost{position:relative}
.spdtimer{position:absolute;top:8px;right:8px;z-index:5;width:54px;height:54px;border-radius:50%;pointer-events:none;
  background:var(--surface);box-shadow:0 4px 14px rgba(11,31,42,.16);display:flex;flex-direction:column;align-items:center;justify-content:center;
  --tc:#E0A800;--tn:#8F6C00;background:#FFFBEA;transition:transform .3s,background .4s}
.choices.spdhost{border-radius:14px}.choices.spdhost .spdtimer{top:-16px;right:-10px}
.spdtimer svg{position:absolute;inset:3px;width:48px;height:48px;transform:rotate(-90deg)}
.spdtimer circle{fill:none;stroke-width:3.5}
.spdtimer .spdbg{stroke:color-mix(in srgb,var(--tc) 18%,transparent)}
.spdtimer .spdring{stroke:var(--tc);stroke-dasharray:100;stroke-dashoffset:0;stroke-linecap:round;transition:stroke-dashoffset .1s linear,stroke .4s}
.spdtimer b{position:relative;font:700 19px/1 "JetBrains Mono",monospace;color:var(--tn);transition:color .4s}
.spdtimer small{position:relative;font:600 8.5px/1 "JetBrains Mono",monospace;color:var(--slate);margin-top:2px;letter-spacing:.02em}
.spdtimer.p2{--tc:#E2803A;--tn:#B0561A;background:#FFF3EA}.spdtimer.p3{--tc:#D2493F;--tn:#B0302A;background:#FDEEEC}
.spdtimer.p3{animation:spdbeat .5s ease-in-out infinite}
.spdtimer.beattimer{width:84px;height:84px;top:10px;right:10px;--tc:#0E7C7B;--tn:#0B5E5D;background:#EEF7F6}
.spdtimer.beattimer svg{inset:4px;width:76px;height:76px}
.spdtimer.beattimer b{font-size:30px}
.spdtimer.beattimer small{font-size:9.5px;margin-top:3px}
.spdtimer.beattimer.p1{--tc:#E0A800;--tn:#8F6C00;background:#FFFBEA}
.spdtimer.beattimer.p2{--tc:#E2803A;--tn:#B0561A;background:#FFF3EA}
.spdtimer.beattimer.p3{--tc:#D2493F;--tn:#B0302A;background:#FDEEEC}
.spdtimer.beattimer.out{--tc:#94A3B8;--tn:#64748B;background:#F1F5F9;animation:none}
.choices.spdhost .spdtimer.beattimer,.tray.spdhost .spdtimer.beattimer{top:-30px;right:-8px}
.roundmeta .rmbeat{color:#0B5E5D;background:#EEF7F6;border-color:#9CCFCB}
.roundmeta .rmbeat.won{color:#0B1F2A;background:#9FE0C0;border-color:#3E9B57}
.pts .spdok.beatok{background:#9FE0C0}.pts .spdok.beatok.slow{background:#F1F5F9;color:#64748B}
@keyframes spdbeat{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
.spdg1{animation:spdglow1 1.8s ease-in-out infinite}
.spdg2{animation:spdglow2 1s ease-in-out infinite}
.spdg3{animation:spdglow3 .5s ease-in-out infinite}
@keyframes spdglow1{0%,100%{box-shadow:0 0 0 0 transparent}50%{box-shadow:0 0 0 3px color-mix(in srgb,var(--mc) 35%,transparent),0 0 22px 2px color-mix(in srgb,var(--mc) 30%,transparent)}}
@keyframes spdglow2{0%,100%{box-shadow:0 0 0 1px color-mix(in srgb,#E0A800 20%,transparent)}50%{box-shadow:0 0 0 3px color-mix(in srgb,#E0A800 55%,transparent),0 0 26px 3px color-mix(in srgb,#E0A800 38%,transparent)}}
@keyframes spdglow3{0%,100%{box-shadow:0 0 0 2px color-mix(in srgb,#E2803A 35%,transparent)}50%{box-shadow:0 0 0 4px color-mix(in srgb,#E2803A 70%,transparent),0 0 30px 4px color-mix(in srgb,#E2803A 45%,transparent)}}
@media (prefers-reduced-motion:reduce){.spdg1,.spdg2,.spdg3,.spdtimer.p3{animation:none}
  .spdg1{box-shadow:0 0 0 3px color-mix(in srgb,var(--mc) 35%,transparent)}.spdg2{box-shadow:0 0 0 3px #E0A800}.spdg3{box-shadow:0 0 0 4px #E2803A}}
.rtop .verdict{white-space:nowrap}.rtop .pts{text-align:right}
.pts .spdok{display:block;width:max-content;margin:4px 0 0 auto;padding:1px 7px;border-radius:999px;background:#F5C542;color:#0B1F2A;font-weight:700;letter-spacing:.04em}
.modeintro .mispd{font:600 13px "JetBrains Mono",monospace;letter-spacing:.04em;color:var(--mc);
  background:color-mix(in srgb,var(--mc) 12%,transparent);border-radius:999px;padding:5px 11px;margin-top:4px}
/* ---- small text link, rewarded video ---- */
.linkbtn{background:none;border:0;padding:10px 0 0;color:var(--teal);cursor:pointer;
  font:400 14px "Source Serif 4",serif;text-decoration:underline;text-underline-offset:3px}
.linkbtn:disabled{opacity:.5}
.vidov{align-items:center;padding:16px;background:rgba(11,31,42,.8)}
.vidcard{width:100%;max-width:560px;background:var(--paper);border-radius:12px;padding:12px 12px 14px;
  box-shadow:0 20px 60px rgba(0,0,0,.4)}
.vidtop{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.vidtop .adl{font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--slate)}
.vidx{width:36px;height:36px;border-radius:50%;border:1px solid var(--stone);background:var(--surface);
  color:var(--ink);font-size:20px;line-height:1;cursor:pointer}
.vidbox{aspect-ratio:16/9;background:#FAFAF8;border-radius:8px;overflow:hidden}
.vidbox video{display:block;width:100%;height:100%;object-fit:contain}
.vidbar{height:4px;background:var(--stone);border-radius:2px;margin-top:10px;overflow:hidden}
.vidbar i{display:block;height:100%;width:0;background:var(--teal);transition:width .25s linear}
.vidmsg{margin-top:8px;font-size:14px;color:var(--slate);min-height:21px}
.vidmsg b{color:var(--ink)} .vidmsg b.bad{color:var(--vermilion)}
footer.site .copy a{color:var(--slate);text-decoration:none}
/* ---- how to play: one screen, graphic (the designer's layout and art) ---- */
.hwov{position:fixed;inset:0;z-index:70;background:rgba(11,31,42,.5);display:flex;justify-content:center;
  align-items:stretch;animation:hwin .25s ease-out}
.hwov.out{opacity:0;transition:opacity .2s}
@keyframes hwin{from{opacity:0}}
.hw{--hp:#F3F2EB;--hc:#FAF8F5;--hi:#0B1F2A;--ht:#0E7C7B;--hs:#334155;--hl:#E2E4E4;
  background:var(--hp);color:var(--hi);width:100%;max-width:520px;overflow:auto;
  padding:calc(14px + env(safe-area-inset-top)) 22px calc(16px + env(safe-area-inset-bottom));
  display:flex;flex-direction:column}
@media (min-width:561px){.hwov{align-items:center;padding:20px}.hw{border-radius:18px;max-height:calc(100dvh - 40px)}}
.hwtop{display:flex;align-items:center;justify-content:space-between}
.hwmark{height:38px;width:auto}
.hwdate{font:400 12px "JetBrains Mono",monospace;letter-spacing:.08em;color:#64748B}
.hwkick{display:flex;align-items:center;gap:14px;margin:14px 0 6px;font:500 12px "JetBrains Mono",monospace;
  letter-spacing:.22em;color:var(--ht)}
.hwkick img{height:12px;width:auto}
.hw h2{font:600 clamp(28px,8.4vw,40px)/1.04 "Tiempos Headline","Source Serif 4",Georgia,serif;
  letter-spacing:-.02em;margin:0 0 10px}
.hwlede{margin:0 0 14px;font-size:17px;line-height:1.45}
.hwc{display:grid;grid-template-columns:80px 1fr 1fr;align-items:center;gap:0;background:var(--hc);
  border:1px solid var(--hl);border-radius:10px;padding:8px 12px;margin-bottom:9px;min-height:74px;
  animation:hwcard .45s cubic-bezier(.2,.9,.3,1) both}
@keyframes hwcard{from{opacity:0;transform:translateY(12px)}}
.hwn{border-right:1px solid var(--hl);padding-right:8px;height:100%;display:flex;flex-direction:column;justify-content:center}
.hwn b{font:400 30px/1 "Source Serif 4",Georgia,serif;color:var(--ht)}
.hwn span{font:500 10px "JetBrains Mono",monospace;letter-spacing:.2em;color:var(--ht);margin-top:5px}
.hwc img{width:100%;max-width:150px;max-height:66px;object-fit:contain;justify-self:center}
.hwt{font:400 18px/1.25 "Source Serif 4",Georgia,serif;padding-left:8px}
.hwwin{margin-top:auto!important;display:flex;flex-direction:column;gap:3px;background:#FAF8F5;border:1px solid #E2E4E4;border-left:4px solid #E0A020;
  border-radius:10px;padding:10px 13px;margin:2px 0 8px;font-size:15px;line-height:1.4}
.hwwin b{font:500 11px "JetBrains Mono",monospace;letter-spacing:.2em;color:var(--ht)}
.hwwin em{font-style:normal;font-weight:600}
.hwplus{font-size:13.5px;color:var(--hs);text-align:center;margin:2px 0 10px}
.hwplus b{font:500 11px "JetBrains Mono",monospace;letter-spacing:.12em;color:var(--ht)}
.hwfacts{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #CBD5E1;
  padding:10px 2px;font-size:15px;margin-top:auto}
.hwfacts span{display:flex;align-items:center;gap:8px} .hwfacts img{width:24px;height:24px}
.hwfacts i{color:#64748B;font-style:normal}
.hwgo{width:100%;background:var(--hi);color:#FAFAF8;border:0;border-radius:8px;padding:15px;min-height:54px;
  font:400 20px "Source Serif 4",Georgia,serif;cursor:pointer;display:flex;justify-content:center;gap:12px}
.hwgo:active{transform:scale(.99)}
.hwfoot{display:flex;justify-content:space-between;align-items:center;margin-top:10px;font-size:13px;color:#64748B}
.hwfoot a{color:var(--ht);font-size:15px}
.homepg{max-width:none;margin:0 auto 8px;border:1px solid var(--hl);border-radius:18px;overflow:visible;padding:16px 18px 18px}
.homepg .hwgo{margin:4px 0 14px}.homepg .hwkick{margin-top:2px}
.homest{background:var(--hc);border:1px solid var(--hl);border-radius:10px;padding:10px 12px;margin:0 0 10px;font-size:15px}
.homelinks{display:flex;justify-content:center;flex-wrap:wrap;gap:6px 20px;margin-top:14px;font-size:15px}
.homelinks{align-items:baseline}.homelinks a,.homelinks .linkbtn{color:var(--ht);font:inherit;padding:0}
body.athome #roundmeta{display:none}
body:not(.athome) #playbar{display:none}
.homebig{font-size:19px;min-height:60px;background:#0B1F2A;color:#FAFAF8}
.homemeta{display:flex;justify-content:space-between;flex-wrap:wrap;gap:4px 12px;margin-top:2px;font:400 12px "JetBrains Mono",monospace;letter-spacing:.04em;color:#64748B}
.homesec{margin:22px 0 0}.homesec .ahead{margin-bottom:10px}
.homeflat{border:0;padding:0;background:transparent;margin:0}
.homenote{color:var(--slate);font-size:15px;line-height:1.5;margin:10px 2px 12px}
.homelink{margin:10px 0 0;text-align:right}.homelink a{color:var(--teal)}
.stories{display:grid;gap:10px}
.story{background:var(--surface);border:1px solid var(--stone);border-radius:14px;padding:14px 16px}
.story h3{margin:0 0 4px;font:600 24px/1.15 "Source Serif 4",Georgia,serif}
.storyroute{font:500 11.5px "JetBrains Mono",monospace;letter-spacing:.04em;color:var(--teal);margin-bottom:6px}
.story p{margin:4px 0 0;font-size:15.5px;line-height:1.5}.story .storydef{color:var(--slate)}
.homeplus{width:100%}
.homefaq{border-top:1px solid var(--stone);padding:10px 2px}.homefaq:last-of-type{border-bottom:1px solid var(--stone)}
.homefaq summary{cursor:pointer;font-weight:600;font-size:16px}.homefaq p{margin:8px 0 2px;color:var(--ink);line-height:1.55}
.homefaq a{color:var(--teal)}
.homeend{margin:24px 0 8px}
.playbar{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:60;max-width:520px;margin:0 auto;
  background:#0B1F2A;color:#FAFAF8;border:0;border-radius:12px;padding:15px;font:500 17px/1.2 "Source Serif 4",Georgia,serif;
  box-shadow:0 10px 30px rgba(11,31,42,.35);cursor:pointer}
.playbar[hidden]{display:none}
.playbar.plus{background:var(--saffron);color:#1b1400}.playbar small{font:500 12px "JetBrains Mono",monospace;letter-spacing:.04em;opacity:.8;margin-left:6px;white-space:nowrap}
@media (max-width:370px){.hwc{grid-template-columns:66px 1fr 1fr;padding:7px 9px}.hwt{font-size:16px}.hwfacts{font-size:13px}}
@media (max-height:700px){.hwgo{position:sticky;bottom:0;box-shadow:0 -8px 16px var(--hp)}.hwkick{margin-top:6px}.hwwin{padding:8px 11px;font-size:14px}.hwplus{display:none}.hwlede{font-size:15px;margin-bottom:8px}.hwc{min-height:58px}.hwc{min-height:64px;margin-bottom:7px}.hwc img{max-height:54px}.hwkick{margin-top:8px}}
/* ---- site footer ---- */
footer.site{display:block;max-width:720px;margin:0 auto;padding:22px 16px calc(28px + env(safe-area-inset-bottom));
  border-top:1px solid var(--stone);text-align:center;color:var(--slate);
  font:400 13.5px/1.6 "Source Serif 4",serif;letter-spacing:0}
footer.site nav{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 16px;margin-bottom:10px;
  font-family:"JetBrains Mono",monospace;font-size:12px;letter-spacing:.04em}
footer.site nav a{color:var(--ink);text-decoration:none;padding:6px 0}
footer.site nav a:hover{color:var(--teal)}
footer.site p{margin:4px auto;max-width:36em}
footer.site p a{color:var(--slate)}
footer.site .copy{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.06em;margin-top:10px}

@media (min-width:561px){ .mapwrap{aspect-ratio:auto;height:clamp(260px,calc(100dvh - 470px),470px)} .atlasmap{height:auto;aspect-ratio:2/1} }
@media (max-width:560px){
  .mark{height:36px}
  header{margin-bottom:10px}
  .ask{font-size:12px;letter-spacing:.08em}
  .word{font-size:clamp(34px,9.5vw,46px)}
  .howline{font-size:14px;margin-top:6px}
  /* the map takes all the height the round does not need: no dead band */
  .mapwrap{flex:1 1 0;aspect-ratio:auto;min-height:200px}
  .panel{margin-top:12px}
  /* word modes: the answer cards grow to fill the screen instead of floating in it */
  #game:has(.mapwrap[hidden]) .prompt{margin-bottom:16px}
  #game:has(.mapwrap[hidden]) .panel:not(.revealed){flex:1 1 auto;display:flex;flex-direction:column;margin-top:0}
  #game:has(.mapwrap[hidden]) .panel:not(.revealed) .choices{flex:1 1 auto;grid-auto-rows:1fr;max-height:560px}
  #game:has(.mapwrap[hidden]) .panel:not(.revealed) .helps{margin-top:auto;padding-top:10px}
  #game:has(.mapwrap[hidden]) .choices.words .choice.word-opt{font-size:clamp(24px,7.4vw,30px)}
  #game:has(.mapwrap[hidden]) .panel:not(.revealed) .choices + .helps{margin-top:10px}
  #game:has(.map.revealed) .mapwrap,#game:has(.panel.revealed) .mapwrap{flex:0 0 auto;aspect-ratio:2.4/1;min-height:0}
  .choice{font-size:17px;min-height:54px}
  .choice.word-opt{font-size:23px;min-height:96px}
  .choices.words .choice{min-height:112px}
  .choice.defn small{font-size:13px}
  .help{font-size:13px;min-height:50px}
  .tchip{font-size:16px}
  .feedback{font-size:15px}
  .defn-line{font-size:15.5px}
  .lorenote,.krow,.tell{font-size:14.5px}
  .evorow .el{font-size:12px}
  .evorow .ef{font-size:17px}
  .path{font-size:12px}
  .pts{font-size:13px}
}
@media (max-width:560px) and (max-height:700px){
  .mapwrap{min-height:150px}
  .howline{display:none}
}
@media (max-width:560px){ .mapwrap.atlasmap{flex:none;aspect-ratio:2/1;min-height:0} }
@media (max-width:400px){ #rankname{display:none} .hbtn.me{padding:4px} .hud{gap:6px} .hbtn{padding:5px 9px} }
@media (max-height:520px) and (orientation:landscape){
  .howline{display:none} .mark{height:28px} header{margin-bottom:6px} .pips{margin-bottom:6px}
  .ask{font-size:11px} .word{font-size:28px} .prompt{margin:0 0 6px}
  .mapwrap{flex:none;aspect-ratio:auto;height:calc(100dvh - 130px);min-height:180px}
  .choice{min-height:46px;padding:9px 12px} .help{min-height:44px}
}

/* ---- bonus word + celebration ---- */
.bonuscard{display:grid;grid-template-columns:44px 1fr;gap:6px 14px;align-items:center;margin:14px 0;padding:16px 18px;
  border:1.5px solid var(--saffron);border-radius:12px;background:color-mix(in srgb,var(--saffron) 9%,transparent)}
.bonuscard .bgift{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-size:20px;
  background:var(--saffron);color:#fff;animation:bpulse 1.8s ease-in-out infinite}
.bonuscard .btxt b{display:block;font-size:18px}.bonuscard .btxt span{font-size:15px;opacity:.8}
.bonuscard .btn{grid-column:1/-1;margin-top:6px}
.bonuscard.done{border-color:var(--sage);background:transparent}.bonuscard.done .bgift{background:var(--sage);animation:none}
@keyframes bpulse{50%{transform:scale(1.08)}}
.celebr{position:fixed;left:50%;top:42%;width:0;height:0;z-index:60;pointer-events:none}
.celebr i{position:absolute;left:-6px;top:-5px;width:13px;height:9px;border-radius:2px;opacity:0;
  animation:cburst 1.1s cubic-bezier(.15,.7,.3,1) forwards}
.celebr.big i{width:16px;height:11px;animation-duration:2.5s}
@keyframes cburst{0%{opacity:1;transform:translate(0,0) rotate(0)}
  70%{opacity:1}100%{opacity:0;transform:translate(var(--x),calc(var(--y) + 120px)) rotate(var(--r))}}
.celebr .cmsg{position:absolute;left:50%;top:0;transform:translate(-50%,-50%);text-align:center;white-space:nowrap;
  background:var(--ink);color:var(--paper);padding:14px 26px;border-radius:14px;box-shadow:0 10px 30px rgba(0,0,0,.25);
  animation:cpop 2.2s ease forwards}
.celebr .cmsg b{display:block;font-size:26px;letter-spacing:.01em}.celebr .cmsg span{font-size:15px;opacity:.85}
.celebr.glossy i{border-radius:0;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);
  background:linear-gradient(135deg,#FFF7D1 0%,#F5C542 35%,#B7791F 60%,#FFE9A0 85%,#FFFFFF 100%);
  background-size:200% 200%;filter:drop-shadow(0 0 4px rgba(245,197,66,.8));
  animation:cburst 2.6s cubic-bezier(.15,.7,.3,1) forwards,glshine .5s linear infinite}
.celebr.glossy i.spk{clip-path:polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%);background:#FFFBEA}
@keyframes glshine{0%{background-position:0 0}100%{background-position:200% 200%}}
.celebr.glossy .cmsg b{color:#8F6C00;text-shadow:0 1px 0 #FFF7D1}
@keyframes cpop{0%{opacity:0;transform:translate(-50%,-50%) scale(.6)}12%{opacity:1;transform:translate(-50%,-50%) scale(1.06)}
  20%{transform:translate(-50%,-50%) scale(1)}80%{opacity:1}100%{opacity:0;transform:translate(-50%,-60%) scale(1)}}
@media (prefers-reduced-motion:reduce){.bonuscard .bgift{animation:none}}

/* ================= play-screen overhaul ================= */
/* each puzzle type has its own colour, used on its tag, the current pip, the hint glow and its intro card */
body{--mc:var(--teal)}
body[data-mode="order"],.modeintro[data-mode="order"]{--mc:var(--cobalt)}
body[data-mode="shift"],.modeintro[data-mode="shift"]{--mc:var(--saffron)}
body[data-mode="kin"],.modeintro[data-mode="kin"]{--mc:var(--pin)}
body[data-mode="pair"],.modeintro[data-mode="pair"]{--mc:var(--sage)}
body[data-mode="neo"],.modeintro[data-mode="neo"]{--mc:var(--vermilion)}
.modeintro[data-mode="hop"]{--mc:var(--teal)}
#game .ask .tag{background:var(--mc)!important;color:#fff!important;border:0!important;padding:3px 8px;border-radius:4px}
.pips .pip.now{background:var(--mc)}
#game .mapwrap{border-color:color-mix(in srgb,var(--mc) 45%,var(--stone))}
.modeintro{position:fixed;inset:0;z-index:65;display:flex;align-items:center;justify-content:center;padding:24px;
  background:color-mix(in srgb,var(--paper) 82%,transparent);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
  animation:mifade .22s ease both;cursor:pointer}
.modeintro.out{animation:mifade .25s ease reverse both}
.modeintro .mi{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;max-width:340px;
  background:var(--surface);border:3px solid var(--mc);border-radius:22px;padding:26px 26px 20px;
  box-shadow:0 18px 50px rgba(11,31,42,.22);animation:mipop .38s cubic-bezier(.2,1.4,.4,1) both}
.modeintro img{width:84px;height:84px;object-fit:contain}
.modeintro small{font:600 12px "JetBrains Mono",monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--slate)}
.modeintro b{font:700 38px/1.05 "Source Serif 4",Georgia,serif;color:var(--mc)}
.modeintro span{font:400 18px/1.35 "Source Serif 4",Georgia,serif;color:var(--ink)}
.modeintro em{font:500 12px "JetBrains Mono",monospace;letter-spacing:.1em;color:var(--slate);font-style:normal;margin-top:6px}
@keyframes mifade{from{opacity:0}to{opacity:1}}
.modeintro .mi{position:relative}
.modeintro .mix{position:absolute;top:8px;right:8px;width:40px;height:40px;border:0;border-radius:50%;background:transparent;
  color:var(--slate);font:400 30px/1 "Source Serif 4",Georgia,serif;cursor:pointer;display:flex;align-items:center;justify-content:center}
.modeintro .mix:hover,.modeintro .mix:focus-visible{background:color-mix(in srgb,var(--mc) 14%,transparent);color:var(--ink)}
.modeintro .mibar{display:block;width:120px;height:4px;border-radius:2px;background:color-mix(in srgb,var(--mc) 18%,transparent);overflow:hidden;margin-top:2px}
.modeintro .mibar i{display:block;height:100%;background:var(--mc);transform-origin:left;animation:mibar linear both}
@keyframes mibar{from{transform:scaleX(1)}to{transform:scaleX(0)}}
@media (prefers-reduced-motion:reduce){.modeintro .mibar{display:none}}
@keyframes mipop{from{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}

/* hints: a visible, warm block that glows when the player is stuck */
#game .helps{margin-top:10px;border:1.5px solid color-mix(in srgb,var(--saffron) 60%,transparent);border-top-width:1.5px;
  background:color-mix(in srgb,var(--saffron) 9%,var(--surface));border-radius:14px;padding:8px 8px 8px}
#game .helplab{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:0 2px 6px;font-size:14px}
#game .helplab .hlt{font-weight:600;color:var(--ink)}
#game .helplab .glc{font:500 12px "JetBrains Mono",monospace;color:var(--slate)}
#game .helplab .glc b{color:var(--saffron);font-size:14px}
#game .help{border:1px solid color-mix(in srgb,var(--saffron) 55%,var(--stone));background:var(--surface);min-height:46px}
#game .help .hc{font-size:12px;font-weight:600}
#game .help.poor{opacity:.7;border-style:dashed}
#game .helps.nudge{animation:hglow 1.1s ease-in-out 3}
#game .helps.nudge .hlt{color:var(--saffron)}
@keyframes hglow{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--saffron) 0%,transparent);transform:none}
  50%{box-shadow:0 0 0 7px color-mix(in srgb,var(--saffron) 35%,transparent);transform:scale(1.015)}}

/* sheets: share panel and out-of-glosses */
.sheetov{position:fixed;inset:0;z-index:75;background:rgba(11,31,42,.5);display:flex;align-items:flex-end;justify-content:center}
.sheet{width:100%;max-width:520px;max-height:92dvh;overflow:auto;background:var(--paper);color:var(--ink);
  border-radius:20px 20px 0 0;padding:16px 16px calc(18px + env(safe-area-inset-bottom));animation:shup .25s ease both}
@media (min-width:600px){.sheetov{align-items:center}.sheet{border-radius:20px}}
@keyframes shup{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
.shtop{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.shtop b{font:700 22px "Source Serif 4",Georgia,serif}
.shx{border:0;background:transparent;font-size:28px;line-height:1;color:var(--slate);cursor:pointer;padding:4px 8px}
.shp,.shnote{margin:0 0 10px;font-size:15px}.shnote{color:var(--slate);font-size:13.5px;margin-top:12px}
.sheet .btn{margin-top:8px}
.plusbtn{display:flex;flex-direction:column;align-items:center;gap:2px;background:var(--saffron)!important;color:#1b1400!important}
.plusbtn small{font-size:13px;opacity:.85}
.supamts{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:14px 0 4px}
.supamts button,.supother{font:600 17px "Source Serif 4",serif;color:var(--ink);background:var(--surface);border:1px solid var(--stone);border-radius:12px;min-height:50px;cursor:pointer}
.supamts button.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.supother{display:flex;align-items:center;gap:2px;padding:0 8px;cursor:text}.supother span{color:var(--slate)}
.supother input{width:100%;min-width:0;border:0;background:none;font:inherit;color:inherit;outline:none;padding:0}
.supother:focus-within{border-color:var(--teal);box-shadow:0 0 0 2px color-mix(in srgb,var(--teal) 30%,transparent)}
.supgo:disabled{opacity:.55}
.supother input::-webkit-outer-spin-button,.supother input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.supother input{-moz-appearance:textfield;appearance:textfield}
.hico.heart{color:#E0457B}
@media (max-width:440px){header #supportbtn .hlab{display:none}header #supportbtn{padding:4px 8px;min-width:0}header #supportbtn .hico{margin:0}}
@media (max-width:440px){header .hud{gap:4px}header .hbtn.lab{padding-left:6px;padding-right:6px}}
@media (max-width:374px){header .hud{gap:3px}header .mark{height:27px}header .hbtn.lab{padding-left:4px;padding-right:4px}header #howbtn{padding-left:8px;padding-right:8px}}
.homemore{margin-top:16px;display:flex;flex-direction:column;gap:2px}.homemore .btn{margin-top:0}.homemore .plusline{margin:10px 0 0}.homemore .subcard{margin-top:10px;text-align:left}
.shpre{margin:0 0 12px;padding:10px 12px;background:var(--surface);border:1px solid var(--stone);border-radius:10px;
  font:14px/1.45 "JetBrains Mono",monospace;white-space:pre-wrap;word-break:break-word}
.shgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.shbtn{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 4px;border:1px solid var(--stone);
  border-radius:12px;background:var(--surface);color:var(--ink);cursor:pointer;font:500 12.5px "JetBrains Mono",monospace}
.shbtn i{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:#fff;font:700 17px "Source Serif 4",serif;font-style:normal}
.shbtn:hover,.shbtn:focus-visible{border-color:var(--teal)}
.shdone{min-height:0;margin-top:10px;font-size:14px;color:var(--teal)}.shdone:empty{display:none}

/* share card on the result screen: squares with a key */
.sharesq{display:flex;justify-content:center;gap:10px;margin:6px 0 8px}
.sharesq span{display:flex;flex-direction:column;align-items:center;gap:4px}
.sharesq i{width:46px;height:46px;border-radius:9px;display:block}
.sharesq small{font:500 9.5px "JetBrains Mono",monospace;letter-spacing:.06em;color:var(--slate)}
.sharekey{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 14px;margin:0 0 10px;font-size:13px;color:var(--slate)}
.sharekey span{display:inline-flex;align-items:center;gap:5px}.sharekey i{width:11px;height:11px;border-radius:3px;display:inline-block}
.sharerow{grid-template-columns:1fr!important}
.chalbtn{display:flex;flex-direction:column;align-items:center;gap:2px}
.chalbtn small{font-size:13px;opacity:.85}

/* big moments: badge, rank, notices */
.bigov{position:fixed;inset:0;z-index:80;display:flex;align-items:center;justify-content:center;padding:24px;
  background:rgba(11,31,42,.55);animation:mifade .2s ease both;cursor:pointer}
.bigov.out{animation:mifade .22s ease reverse both}
.bigcard{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;max-width:360px;
  background:var(--surface);color:var(--ink);border-radius:24px;padding:28px 26px 22px;border:3px solid var(--saffron);
  box-shadow:0 24px 70px rgba(0,0,0,.35);animation:mipop .45s cubic-bezier(.2,1.5,.4,1) both}
.bigcard img{width:120px;height:120px;object-fit:contain;animation:bspin 1s cubic-bezier(.2,1.2,.4,1) both}
.bigcard small{font:600 12px "JetBrains Mono",monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--saffron)}
.bigcard b{font:700 32px/1.1 "Source Serif 4",Georgia,serif}
.bigcard span{font-size:16px;color:var(--slate);line-height:1.4}
.bigcard em{font:500 11px "JetBrains Mono",monospace;letter-spacing:.1em;color:var(--slate);font-style:normal;margin-top:4px}
.bigcard .btn{margin-top:10px}
@keyframes bspin{from{transform:rotate(-25deg) scale(.4);opacity:0}to{transform:none;opacity:1}}
.celebr{z-index:85}

/* practice + video */
.rmprac{color:var(--vermilion)!important;font-weight:600}
.final.practice .pk{font:600 12px "JetBrains Mono",monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--vermilion)}
.vidbox{position:relative}
.vidplay{position:absolute;inset:0;margin:auto;width:max-content;height:max-content;padding:14px 22px;border:0;border-radius:999px;
  background:var(--ink);color:var(--paper);font:600 18px "Source Serif 4",serif;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.3)}

/* atlas: named places */
.aplace{fill:var(--surface);stroke:var(--ink)}
.aterr{stroke:var(--ink)}
.aplbl{fill:var(--ink);stroke:var(--sea);paint-order:stroke;stroke-linejoin:round;font-family:"JetBrains Mono",monospace;font-weight:500}
.aplbl.t{font-weight:700}

/* ONE SCREEN: while a word is being played the page is exactly the screen's height.
   The map takes whatever room is left; after an answer only the answer card scrolls. */
.wrap:has(> #game:not([hidden])){height:100dvh;min-height:0;display:flex;flex-direction:column;overflow:hidden;
  padding-block:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-bottom))}
.wrap:has(> #game:not([hidden])) > header{flex:0 0 auto}
.wrap:has(> #game:not([hidden])) #game{flex:1 1 auto;display:flex;flex-direction:column;min-height:0}
#game .prompt{flex:0 0 auto}
#game .mapwrap{flex:1 1 0;height:auto!important;aspect-ratio:auto!important;min-height:80px!important}
#game .panel{flex:0 0 auto;margin-top:10px;min-height:0}
#game .panel.revealed{flex:1 1 auto;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding-bottom:4px}
#game:has(.panel.revealed) .mapwrap{flex:0 0 26%!important;min-height:70px!important}
#game .panel.revealed .btn{position:sticky;bottom:0;z-index:5;box-shadow:0 6px 22px rgba(11,31,42,.22)}
#game:has(.mapwrap[hidden]) .panel:not(.revealed){flex:1 1 auto;display:flex;flex-direction:column;margin-top:0}
#game:has(.mapwrap[hidden]) .panel:not(.revealed) .choices{flex:1 1 auto}
#game:has(.mapwrap[hidden]) .panel:not(.revealed) .helps{margin-top:auto}
@media (max-height:760px){#game .howline{display:none}.wrap:has(> #game:not([hidden])) .goal{display:none!important}}
@media (max-height:640px){#game .word{font-size:clamp(28px,8vw,38px)}#game .choice{min-height:44px;padding-block:8px}#game .help{min-height:40px}}

.aplaces{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 14px}
.aplaces span{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;border:1px solid var(--stone);
  background:var(--surface);font-size:14px}
.aplaces span.t{border-color:var(--saffron);background:color-mix(in srgb,var(--saffron) 12%,var(--surface));font-weight:600}
.aplaces em{font:500 11px "JetBrains Mono",monospace;font-style:normal;color:var(--slate)}
.h2hn{font-size:14px;color:var(--slate);margin-top:8px}
.h2h{margin:0 0 18px;padding:18px 16px}
.h2hk{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--slate);margin-bottom:4px}
.h2h .h2hv{font-size:30px;line-height:1.15}
.h2hm{font-size:15px;color:var(--slate);margin-top:2px}
.h2hs{align-items:flex-end;margin-top:12px}
.h2hs b{font-size:26px}
.h2hs span.top b{color:var(--teal)}
.h2h.lose .h2hs span.top b{color:var(--vermilion)}
.h2hx{align-self:center;font-size:12px}
.h2hw{display:grid;grid-template-columns:1fr auto auto;gap:6px 16px;max-width:340px;margin:14px auto 0;text-align:left;
  font-size:15px;align-items:center}
.h2hw .h2hwd{display:flex;align-items:center;gap:8px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.h2hw i{flex:none;width:8px;height:8px;border-radius:50%;background:var(--stone)}
.h2hw i.w{background:var(--teal)} .h2hw i.l{background:var(--vermilion)} .h2hw i.d{background:var(--saffron)}
.h2hw b{font-family:"JetBrains Mono",monospace;font-weight:400;font-size:13px;color:var(--slate);text-align:right;font-variant-numeric:tabular-nums}
.h2hw b.on{font-weight:700;color:var(--ink)}
.h2hw small{font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--slate);text-align:right;max-width:80px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.h2hb{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}
.h2hb .btn{margin-top:0}
.h2h .h2hhome{margin-top:8px}
.h2hdaily{margin-top:14px;padding:10px 12px;border-radius:10px;background:var(--paper);border:1px solid var(--stone);font-size:14.5px;line-height:1.45;color:var(--ink);text-align:left}
.h2h .h2hfr{margin-top:12px;border-color:var(--teal);color:var(--teal)}
.nudge{display:flex;align-items:center;gap:10px;margin:12px 0;padding:12px 12px 12px 14px;border:1px solid color-mix(in srgb,var(--teal) 40%,var(--stone));
  border-radius:12px;background:color-mix(in srgb,var(--teal) 7%,var(--surface))}
.nudge .ndx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.nudge .ndx b{font:600 16px "Source Serif 4",Georgia,serif;color:var(--ink)}.nudge .ndx small{font-size:13.5px;color:var(--slate);line-height:1.35}
.nudge .ndgo{flex:none;width:auto;margin:0;padding:9px 14px;font-size:14px;white-space:nowrap}
.nudge .ntx{flex:none}
.glnudge{display:block;margin:12px auto 0;text-align:center}
.joinwhy{margin:8px 0 12px;padding-left:1.1em;color:var(--ink);font-size:15px;line-height:1.6}
@media (max-width:420px){.nudge{flex-wrap:wrap}.nudge .ndx{flex-basis:calc(100% - 40px)}.nudge .ndgo{flex:1}}
.h2h .btn{margin-top:10px}
/* ---- Map Drill ---- */
.drhero{display:grid;gap:10px;margin:0 0 6px}
.drminimap{height:auto;aspect-ratio:360/165;border:1px solid var(--stone);border-radius:14px;background:var(--surface)}
.drdot{fill:var(--teal);opacity:.85}
.drlede{font-size:16.5px;line-height:1.5;color:var(--slate);margin:0}
.drlvs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0 2px}
.drlv{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;padding:11px 12px;border:1px solid var(--stone);border-radius:12px;background:var(--surface);color:var(--ink);cursor:pointer;font:inherit}
.drlv b{font:600 17px "Source Serif 4",serif}.drlv small{font-size:13px;line-height:1.3;color:var(--slate)}
.drlv i{font:500 10px "JetBrains Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--teal);font-style:normal;margin-top:2px}
.drlv.on{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.drgo{margin-top:14px}
.drleft,.drbest{text-align:center;font-size:14px;color:var(--slate);margin:8px 0 0}.drbest b{color:var(--ink)}
.drbar{display:flex;align-items:center;gap:10px;font:500 10.5px "JetBrains Mono",monospace;letter-spacing:.1em;color:var(--slate);margin-bottom:10px}
.drbar b{color:var(--teal);font-weight:600}.drbar .drsc{margin-left:auto;color:var(--ink);font-size:13px}
.drword{text-align:center;margin:4px 0 10px}.drword i{display:block;font:italic 400 clamp(38px,11vw,54px)/1.05 "Source Serif 4",Georgia,serif;color:var(--ink)}
.drword small{display:block;margin-top:4px;font-size:15px;color:var(--slate)}
.drtrail{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 5px;margin:0 0 10px}
.drt{display:inline-flex;flex-direction:column;align-items:center;min-width:62px;padding:5px 10px;border:1px dashed var(--stone);border-radius:10px;background:var(--surface);line-height:1.2;transition:background .25s,border-color .25s}
.drt small{font:500 9px "JetBrains Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--slate)}
.drt b{font:600 14.5px "Source Serif 4",Georgia,serif;color:var(--slate)}
.drt.now{border:1px solid var(--ink)}
.drt.ok{border:1px solid var(--teal);background:color-mix(in srgb,var(--teal) 12%,var(--surface))}.drt.ok b{color:var(--ink)}
.drt.miss{border:1px solid #C2410C;background:color-mix(in srgb,#C2410C 9%,var(--surface))}.drt.miss b{color:var(--ink)}
.drt.lang{border:1px solid var(--ink);background:var(--ink)}.drt.lang b,.drt.lang small{color:var(--paper)}
.drsep{font-style:normal;color:var(--slate);font-size:16px}
@media (max-width:440px){.drt{min-width:0;padding:4px 7px}.drt b{font-size:13px}.drt small{font-size:8.5px}.drtrail{gap:5px 3px}}
.drmap{height:auto;aspect-ratio:360/165;border:1px solid var(--stone);border-radius:14px;background:var(--surface);transition:none}
.drmap.pinning{cursor:crosshair;border-color:var(--teal);box-shadow:0 0 0 2px color-mix(in srgb,var(--teal) 30%,transparent)}
.drpin{fill:var(--cobalt);stroke:#fff;stroke-width:.4}.drtrue{fill:var(--teal);stroke:#fff;stroke-width:.4}
.drline{stroke:var(--saffron);stroke-dasharray:1.5 1.2;fill:none}
.drstep{margin-top:12px}
.drq{display:flex;align-items:center;gap:8px;font:500 11px "JetBrains Mono",monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);margin-bottom:8px}
.drq span{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--ink);color:var(--paper);font-size:11px;letter-spacing:0}
.drops{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.drops .choice{min-height:52px;font-size:16.5px;padding:10px}
.choice.drmiss{border-color:#C2410C;background:color-mix(in srgb,#C2410C 10%,var(--surface))}
.drfb{margin-top:8px;font-size:15px;color:var(--slate)}.drfb.ok{color:var(--teal)}.drfb b{font-weight:700}
.drhint{font-size:15.5px;color:var(--slate);margin:0 0 6px}
.drlock{margin-top:6px}.drlock:disabled{opacity:.5}
.drrev{border:1px solid var(--stone);border-radius:14px;padding:14px 16px;background:var(--surface)}
.drrevk{font:500 11px "JetBrains Mono",monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--teal)}
.drrev h3{font:600 26px "Source Serif 4",serif;margin:4px 0 6px}.drrev p{margin:0 0 8px;font-size:16px;line-height:1.5}
.drrev .drdef{color:var(--slate);font-style:italic}
.drpts{font:500 12px "JetBrains Mono",monospace;color:var(--slate)}.drpts b{font-size:16px;color:var(--ink)}
.drsqs{font-size:26px;letter-spacing:4px;margin-top:6px}
.drlist{list-style:none;padding:0;margin:14px 0 4px;display:grid;gap:6px}
.drlist li{display:grid;grid-template-columns:28px 1fr auto auto;align-items:baseline;gap:8px;padding:8px 10px;border:1px solid var(--stone);border-radius:10px;background:var(--surface)}
.drlist b{font:600 17px "Source Serif 4",serif}.drlist small{color:var(--slate);font-size:13.5px}.drlist i{font:500 13px "JetBrains Mono",monospace;font-style:normal}
.gcwait{text-align:center;margin:10px 0 4px}.gcwait small{display:block;font:500 10.5px "JetBrains Mono",monospace;letter-spacing:.14em;color:var(--slate)}
.gcwait b{font:400 34px "JetBrains Mono",monospace;color:var(--ink)}
.gcno{display:block;margin:10px auto 0}
.homegames .gcard{display:grid;grid-template-columns:120px 1fr;gap:12px;align-items:center;width:100%;text-align:left;padding:12px;border:1px solid var(--stone);border-radius:14px;background:var(--surface);color:var(--ink);cursor:pointer;font:inherit}
.homegames .gcard .drminimap{border:0;border-radius:8px}
.homegames .gcard b{display:block;font:600 19px "Source Serif 4",serif}.homegames .gcard small{display:block;font-size:14px;line-height:1.35;color:var(--slate);margin-top:2px}
.homegames .gcard em{display:inline-block;margin-top:6px;font:500 10.5px "JetBrains Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--teal);font-style:normal}
.gclede{font-size:15.5px;line-height:1.5;color:var(--slate);margin:0 0 12px;text-align:center}
.gcgrid{display:grid;gap:8px}
.gcg{display:grid;grid-template-columns:84px 1fr;gap:12px;align-items:center;width:100%;text-align:left;padding:10px 12px;border:1px solid var(--stone);border-radius:14px;background:var(--surface);color:var(--ink);cursor:pointer;font:inherit}
.gcg img{width:84px;height:52px;object-fit:contain}.gcg .drminimap{width:84px;border:0;border-radius:6px}
.gcg b{display:block;font:600 18px "Source Serif 4",serif}.gcg b i{font:500 9.5px "JetBrains Mono",monospace;letter-spacing:.06em;color:var(--saffron);font-style:normal;vertical-align:middle;margin-left:4px}
.gcg small{display:block;font-size:13.5px;line-height:1.35;color:var(--slate);margin-top:1px}
.gcg em{display:inline-block;margin-top:5px;font:500 10px "JetBrains Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--teal);font-style:normal}.gcg em.off{color:var(--slate)}
.gcg.locked{opacity:.8;border-style:dashed}.gcg.locked img,.gcg.locked .drminimap{filter:grayscale(1);opacity:.7}
svg.lk{display:inline-block;width:13px;height:13px;margin-left:5px;vertical-align:-1px;color:var(--slate)}
.gcbar{display:block;height:6px;border-radius:3px;background:var(--stone);margin-top:7px;overflow:hidden}.gcbar i{display:block;height:100%;width:var(--p);background:var(--teal);border-radius:3px}
.gchow{display:grid;gap:9px;margin:0 0 14px}
.gchow>div{display:grid;grid-template-columns:26px 1fr;gap:10px;align-items:start;font-size:15px;line-height:1.45;color:var(--ink)}
.gchow>div>b{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--ink);color:var(--paper);font:500 12px "JetBrains Mono",monospace}
.gcpluscall{margin:0 0 18px;padding:14px;border:1px solid var(--saffron);border-radius:14px;background:color-mix(in srgb,var(--saffron) 9%,var(--surface));text-align:center}
.gcpluscall>b{display:block;font:600 19px "Source Serif 4",Georgia,serif}.gcpluscall>small{display:block;color:var(--slate);font-size:14px;margin:2px 0 0}
.gcsub{font-size:14.5px;line-height:1.45;color:var(--slate);margin:-2px 0 10px}
.gcprog{margin:4px 0 14px}.gcprog small{display:block;margin-top:6px;font-size:13.5px;color:var(--slate)}
.ways{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.way{display:flex;flex-direction:column;gap:4px;text-align:left;padding:14px;border:1px solid var(--stone);border-radius:14px;background:var(--surface);color:var(--ink);cursor:pointer;font:inherit}
.way.daily{border-color:var(--ink)}
.way small{font:500 10px "JetBrains Mono",monospace;letter-spacing:.08em;color:var(--slate)}
.way b{font:600 20px "Source Serif 4",Georgia,serif}
.way span{font-size:14.5px;line-height:1.45;color:var(--slate)}
.way em{margin-top:auto;padding-top:6px;font:500 10.5px "JetBrains Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--teal);font-style:normal}
@media (max-width:560px){.ways{grid-template-columns:1fr}}
.gcg.feat{border-color:var(--saffron)}
.gcplus{display:grid;gap:8px}
.gcrow{display:grid;grid-template-columns:1fr auto;gap:2px 10px;align-items:center;text-align:left;padding:12px 14px;border:1px dashed var(--stone);border-radius:12px;background:var(--surface);color:var(--ink);cursor:pointer;font:inherit}
.gcrow b{font:600 17px "Source Serif 4",serif}.gcrow small{grid-column:1;font-size:13.5px;color:var(--slate)}.gcrow i{grid-row:1/3;grid-column:2;font:500 10.5px "JetBrains Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--saffron);font-style:normal}
.gcarch{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:8px;margin:6px 0 10px}
.gcday{padding:14px 6px;border:1px solid var(--stone);border-radius:12px;background:var(--surface);color:var(--ink);cursor:pointer;font:inherit}
.rpbody.blur{filter:blur(5px);pointer-events:none;user-select:none}
.rpfams{display:grid;gap:6px}
.rpfam{display:grid;grid-template-columns:110px 1fr 44px;gap:4px 10px;align-items:center;font-size:15px}
.rpfam i{display:block;height:8px;border-radius:4px;background:linear-gradient(90deg,var(--teal) var(--p),var(--stone) var(--p))}
.rpfam b{text-align:right;font:500 13px "JetBrains Mono",monospace}.rpfam small{grid-column:2/4;font-size:12px;color:var(--slate);margin-top:-4px}
.rpnote{font-size:15.5px;margin:10px 0 0}
.rplock{margin:-40px 0 10px;position:relative;text-align:center;padding:16px;border:1px solid var(--stone);border-radius:14px;background:var(--paper)}
.rplock b{display:block;font:600 19px "Source Serif 4",serif}.rplock small{display:block;color:var(--slate);font-size:14px;margin-top:2px}
.gchead{margin:0 0 10px}.gchead b{display:block;font:600 24px/1.2 "Source Serif 4",Georgia,serif;color:var(--ink)}.gchead span{display:block;font-size:15px;color:var(--slate);margin-top:2px}
.gcar{position:relative;margin:0 0 4px}
.gctrack{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:2px 2px 8px;margin:0 -2px}
.gctrack::-webkit-scrollbar{display:none}
.gslide{transition:opacity .45s ease,transform .45s ease}
.gctrack.live .gslide{opacity:.42;transform:scale(.96)}.gctrack.live .gslide.on{opacity:1;transform:none}
.gctrack.live{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 9%,#000 91%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 9%,#000 91%,transparent 100%)}
@media (prefers-reduced-motion:reduce){.gslide{transition:none}}
.gslide{flex:0 0 74%;max-width:290px;scroll-snap-align:center;display:flex;flex-direction:column;gap:10px;text-align:left;padding:12px;border:1px solid var(--stone);border-radius:16px;background:var(--surface);color:var(--ink);cursor:pointer;font:inherit}
.gslide .gimg{display:grid;place-items:center;height:128px;border-radius:12px;background:color-mix(in srgb,var(--teal) 7%,var(--paper));overflow:hidden}
.gslide .gimg img{max-height:104px;max-width:88%;object-fit:contain}.gslide .gimg .drminimap{width:92%;border:0}
.gslide .gtx b{display:block;font:600 21px "Source Serif 4",Georgia,serif}
.gslide .gtx>span{display:block;font-size:16px;line-height:1.35;color:var(--ink);margin-top:2px}
.gslide .gtx em{display:block;margin-top:8px;font:500 10.5px "JetBrains Mono",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--teal);font-style:normal}
.gslide.locked .gimg img,.gslide.locked .gimg .drminimap{filter:grayscale(1);opacity:.6}.gslide.locked .gtx em{color:var(--slate)}
.gcdots{display:flex;justify-content:center;gap:6px;margin:4px 0 12px}.gcdots i{width:7px;height:7px;border-radius:4px;background:var(--stone);cursor:pointer;transition:width .3s,background .3s}.gcdots i.on{width:20px;background:var(--ink)}
.gcarr{position:absolute;top:64px;width:36px;height:36px;border-radius:50%;border:1px solid var(--stone);background:var(--surface);color:var(--ink);font-size:22px;line-height:1;cursor:pointer;display:grid;place-items:center;box-shadow:0 2px 8px rgba(11,31,42,.08)}
.gcarr.prev{left:-6px}.gcarr.next{right:-6px}
@media (hover:none){.gcarr{display:none}}
@media (min-width:600px){.gslide{flex-basis:calc((100% - 24px)/2.6)}}
.s168{display:inline-grid;place-items:center;min-width:34px;height:28px;padding:0 10px;border-radius:14px;white-space:nowrap;border:1.5px solid var(--saffron);
  background:color-mix(in srgb,var(--saffron) 16%,var(--surface));color:var(--ink);font:600 12px "JetBrains Mono",monospace;letter-spacing:.02em;vertical-align:middle;box-sizing:border-box;cursor:help}
.s168.sm{min-width:30px;height:20px;border-radius:10px;font-size:10.5px;padding:0 5px;border-width:1px}
.gslide .gimg{position:relative}.gslide .gimg .s168{position:absolute;top:8px;right:8px}
.gcg{position:relative}.gcg>.s168{position:absolute;top:8px;right:8px}
.gcwk.perfect{border-color:var(--saffron);background:color-mix(in srgb,var(--saffron) 12%,var(--surface))}.gcwk.perfect b{color:var(--ink)}
.gcwk{display:grid;grid-template-columns:auto 1fr;gap:0 10px;align-items:center;margin:12px 0;padding:12px 14px;border:1px solid color-mix(in srgb,var(--teal) 40%,var(--stone));border-radius:12px;background:color-mix(in srgb,var(--teal) 7%,var(--surface));cursor:pointer}
.gcwk b{grid-row:1/3;font:600 28px "Source Serif 4",Georgia,serif;color:var(--teal)}.gcwk span{font:600 16px "Source Serif 4",Georgia,serif;color:var(--ink)}.gcwk small{font-size:13px;color:var(--slate)}
.lbwk{font-size:14.5px;line-height:1.45;color:var(--slate);margin:0 0 8px;text-align:center}.lbmore{margin-top:0}
.pluscmp td small{display:block;font-size:12.5px;line-height:1.35;color:var(--slate);margin-top:2px;font-weight:400}
.wasline{margin:6px 0 10px;padding:10px 12px;border-left:3px solid var(--saffron);background:color-mix(in srgb,var(--saffron) 8%,var(--surface));border-radius:0 10px 10px 0}
.wasline small{display:block;font:500 10px "JetBrains Mono",monospace;letter-spacing:.08em;color:var(--slate)}
.wasline b{display:block;font:600 21px/1.25 "Source Serif 4",Georgia,serif;color:var(--ink);margin:2px 0}
.wasline span{display:block;font-size:15px;line-height:1.4;color:var(--slate)}
.pathk{font:500 10px "JetBrains Mono",monospace;letter-spacing:.08em;color:var(--slate);margin:4px 0 2px}
.lbtag{font:500 9.5px "JetBrains Mono",monospace;letter-spacing:.06em;text-transform:uppercase;color:var(--teal);margin-left:6px}