/* AllFun — game + tool styles (loaded only on play/tools/quiz/daily pages) */
.seg{display:inline-flex;border:2px solid var(--edge);border-radius:var(--r-pill);overflow:hidden;background:var(--surface)}
.segbtn{border:0;background:transparent;color:var(--ink);font:700 .92rem/1 var(--f-body);padding:9px 14px;cursor:pointer}
.segbtn[aria-selected="true"]{background:#1F1A4D;color:#fff}
.mini-select{width:auto;margin:0;padding:8px 12px;border:2px solid var(--edge);border-radius:var(--r-pill);background:var(--surface);color:var(--ink);font:700 .92rem/1.2 var(--f-body)}

/* FiveWord */
.fw-board{display:grid;gap:6px;max-width:330px;margin:4px auto 0}
.fw-row{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.fw-tile{aspect-ratio:1;border:2px solid color-mix(in srgb,var(--edge) 28%,transparent);border-radius:10px;display:grid;place-items:center;font:800 clamp(1.5rem,6vw,2rem)/1 var(--f-display);text-transform:uppercase;background:var(--surface)}
.fw-tile.filled{border-color:var(--edge)}
.fw-tile.correct{background:var(--mint);border-color:#1F1A4D;color:#1F1A4D}
.fw-tile.present{background:var(--sun);border-color:#1F1A4D;color:#1F1A4D}
.fw-tile.absent{background:#9C98C9;border-color:#1F1A4D;color:#1F1A4D}
.fw-row.shake{animation:shake .4s}
@keyframes shake{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
.fw-actions{justify-content:center;margin:10px 0}
.fw-keys{margin:14px auto 0;max-width:520px;display:grid;gap:6px}
.fw-krow{display:flex;gap:5px;justify-content:center}
.fw-key{flex:1;max-width:44px;height:52px;border:2px solid var(--edge);border-radius:9px;background:var(--sunk);color:var(--ink);font:700 1rem/1 var(--f-body);text-transform:uppercase;cursor:pointer;padding:0}
.fw-key.wide{max-width:70px;flex:1.5;font-size:.8rem}
.fw-key.correct{background:var(--mint);color:#1F1A4D} .fw-key.present{background:var(--sun);color:#1F1A4D} .fw-key.absent{background:#9C98C9;color:#1F1A4D;opacity:.75}

/* Memory */
.mm-grid{display:grid;gap:8px;max-width:560px;margin:0 auto}
.mm-card{aspect-ratio:1;border:2px solid #1F1A4D;border-radius:12px;background:var(--sky) repeating-linear-gradient(45deg,transparent 0 8px,rgba(255,255,255,.18) 8px 16px);cursor:pointer;display:grid;place-items:center;font-size:clamp(1.3rem,5vw,2.2rem);padding:0;transition:transform .2s,background-color .2s}
.mm-face{opacity:0;transition:opacity .15s}
.mm-card.up,.mm-card.done{background:var(--surface);transform:rotateY(0)}
.mm-card.up .mm-face,.mm-card.done .mm-face{opacity:1}
.mm-card.done{background:var(--mint)}

/* Tile merge */
.tm-board{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;background:#1F1A4D;padding:10px;border-radius:16px;max-width:420px;margin:0 auto;touch-action:none}
.tm-cell{aspect-ratio:1;border-radius:10px;background:rgba(255,255,255,.12);display:grid;place-items:center;font:800 clamp(1.3rem,6vw,2.2rem)/1 var(--f-display);color:#1F1A4D}
.tm-cell.v2{background:#EEF0FF}.tm-cell.v4{background:#DCD3FF}.tm-cell.v8{background:#B9A6FF}.tm-cell.v16{background:#7FD8FF}.tm-cell.v32{background:#5B95FF}.tm-cell.v64{background:#22C7A9}
.tm-cell.v128{background:#9BE15D;font-size:clamp(1.1rem,5vw,1.9rem)}.tm-cell.v256{background:#FFE17A;font-size:clamp(1.1rem,5vw,1.9rem)}.tm-cell.v512{background:#FFC93C;font-size:clamp(1.1rem,5vw,1.9rem)}
.tm-cell.v1024{background:#FF9F45;font-size:clamp(.95rem,4.2vw,1.6rem)}.tm-cell.v2048{background:#FF5C8A;font-size:clamp(.95rem,4.2vw,1.6rem)}.tm-cell.v4096{background:#fff;font-size:clamp(.95rem,4.2vw,1.6rem)}
.tm-cell.fresh{animation:popin .18s ease-out}
.tm-cell.merged{animation:bump .18s ease-out}
@keyframes bump{50%{transform:scale(1.1)}}

/* Canvas games */
.canvas-box{position:relative;max-width:480px;margin:0 auto}
.canvas-box canvas{width:100%;aspect-ratio:1;border:2px solid var(--edge);border-radius:14px;touch-action:none;background:var(--surface)}

/* Minesweeper */
.ms-scroll{overflow-x:auto;padding-bottom:6px}
.ms-grid{--ms:clamp(26px,8.6vw,36px);display:grid;gap:2px;justify-content:center;width:max-content;margin:0 auto;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.ms-grid.wide{--ms:clamp(24px,3.2vw,30px)}
.ms-cell{width:var(--ms);height:var(--ms);border:0;border-radius:5px;background:var(--sky);box-shadow:inset 0 -3px 0 rgba(31,26,77,.35);font:800 calc(var(--ms)*.5)/1 var(--f-display);cursor:pointer;padding:0;color:#1F1A4D}
.ms-cell.open{background:var(--sunk);box-shadow:none;color:var(--ink)}
.ms-cell.flag{background:var(--sun)}
.ms-cell.boom{background:var(--pop)}
.ms-cell.n1{color:#2D6BE0}.ms-cell.n2{color:#0F8A6C}.ms-cell.n3{color:#D12F5C}.ms-cell.n4{color:#5B3FC4}.ms-cell.n5{color:#B4600A}.ms-cell.n6{color:#0A8A9A}.ms-cell.n7,.ms-cell.n8{color:var(--ink)}

/* Sudoku */
.sd-grid{display:grid;grid-template-columns:repeat(9,1fr);max-width:450px;margin:0 auto;border:3px solid var(--edge);border-radius:10px;overflow:hidden;background:var(--edge);gap:1px}
.sd-cell{aspect-ratio:1;border:0;background:var(--surface);color:var(--sky);font:700 clamp(1.05rem,4.6vw,1.6rem)/1 var(--f-display);cursor:pointer;padding:0;position:relative}
:root[data-theme="dark"] .sd-cell{color:#8DB5FF}
.sd-cell.given{color:var(--ink)}
.sd-cell.br{margin-right:2px} .sd-cell.bb{margin-bottom:2px}
.sd-cell.peer{background:var(--sunk)}
.sd-cell.same{background:#DCD3FF;color:#1F1A4D}
.sd-cell.sel{background:var(--sun);color:#1F1A4D}
.sd-cell.bad{color:var(--err);background:#FFD3DF}
.sd-notes{position:absolute;inset:2px;display:grid;grid-template-columns:repeat(3,1fr);font:400 clamp(.5rem,1.8vw,.7rem)/1 var(--f-body);color:var(--ink-2)}
.sd-notes i{font-style:normal;display:grid;place-items:center}
.sd-pad{display:grid;grid-template-columns:repeat(9,1fr);gap:6px;max-width:450px;margin:14px auto 0}
.sd-num{aspect-ratio:1;border:2px solid var(--edge);border-radius:10px;background:var(--surface);color:var(--ink);font:800 1.2rem/1 var(--f-display);cursor:pointer;padding:0}
.sd-num:hover{background:var(--sun);color:#1F1A4D}
.sd-tools{justify-content:center;margin-top:12px}

/* Four in a row */
.fr-board{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;background:var(--sky);border:3px solid #1F1A4D;border-radius:18px;padding:8px;max-width:460px;margin:0 auto}
.fr-col{display:grid;gap:6px;border:0;background:transparent;padding:4px;border-radius:12px;cursor:pointer}
.fr-col:hover{background:rgba(255,255,255,.25)}
.fr-slot{aspect-ratio:1;border-radius:50%;background:var(--surface);border:2px solid #1F1A4D;display:block}
.fr-slot.p1{background:var(--sun)} .fr-slot.p2{background:var(--pop)}
.fr-slot.win{box-shadow:0 0 0 4px #fff,0 0 0 6px #1F1A4D}

/* Tic-tac-toe */
.ttt{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:340px;margin:0 auto}
.ttt-cell{aspect-ratio:1;border:2px solid var(--edge);border-radius:16px;background:var(--surface);font:800 clamp(2.4rem,12vw,4rem)/1 var(--f-display);cursor:pointer;color:var(--ink);padding:0}
.ttt-cell.x{color:#2D6BE0} .ttt-cell.o{color:#D12F5C}
.ttt-cell.win{background:var(--sun);color:#1F1A4D}

/* Reaction */
.rt-pad{display:flex;flex-direction:column;gap:8px;align-items:center;justify-content:center;width:100%;min-height:300px;border:3px solid #1F1A4D;border-radius:20px;background:var(--sky);color:#1F1A4D;cursor:pointer;padding:24px;touch-action:manipulation;user-select:none}
.rt-pad[data-state="wait"]{background:var(--pop)}
.rt-pad[data-state="go"]{background:var(--mint)}
.rt-pad[data-state="early"]{background:var(--sun)}
.rt-big{font:800 clamp(2rem,6vw,3.2rem)/1.1 var(--f-display)}
.rt-small{font-size:1rem}
.rt-list{display:flex;flex-wrap:wrap;gap:8px;padding:0;list-style:none;margin:14px 0 0;justify-content:center}
.rt-list li{background:var(--sunk);border-radius:var(--r-pill);padding:4px 12px;font-weight:700}

/* Typing */
.ty-text{font:400 clamp(1.15rem,2.4vw,1.45rem)/1.9 var(--f-body);background:var(--sunk);border-radius:14px;padding:16px 18px;height:9.2em;overflow:hidden;margin-bottom:12px}
.ty-text .ok{color:var(--ok)} .ty-text .no{color:var(--err);text-decoration:line-through}
.ty-text .cur{background:var(--sun);color:#1F1A4D;border-radius:5px;padding:0 3px}
.ty-text .cur.err{background:var(--pop)}
.ty-input{font-size:1.25rem!important}

/* Pattern echo */
.pe-board{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:360px;margin:0 auto}
.pe-pad{aspect-ratio:1;border:3px solid #1F1A4D;border-radius:22px;cursor:pointer;opacity:.55;transition:opacity .08s,transform .08s;font:800 1.2rem/1 var(--f-display);color:#1F1A4D;display:flex;align-items:flex-end;justify-content:flex-end;padding:12px}
.pe-pad.sun{background:var(--sun)} .pe-pad.sky{background:var(--sky)} .pe-pad.pop{background:var(--pop)} .pe-pad.mint{background:var(--mint)}
.pe-pad.lit{opacity:1;transform:scale(1.04);box-shadow:0 0 0 5px #fff,0 0 0 8px #1F1A4D}

/* Mole pop */
.mp-field{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:420px;margin:0 auto;background:#9BE15D;border:3px solid #1F1A4D;border-radius:22px;padding:14px}
.mp-hole{aspect-ratio:1;border-radius:50%;border:3px solid #1F1A4D;background:radial-gradient(circle at 50% 70%,#3A2E1F 0 55%,#5A4630 56%);cursor:pointer;overflow:hidden;position:relative;padding:0;touch-action:manipulation}
.mp-who{position:absolute;left:0;right:0;bottom:-60%;font-size:clamp(2rem,9vw,3.2rem);transition:bottom .12s;line-height:1}
.mp-hole.up .mp-who{bottom:18%}
.mp-hole.hit{background:radial-gradient(circle at 50% 70%,#FFC93C 0 55%,#5A4630 56%)}

/* Tools */
.tool-out{font:800 clamp(2.4rem,8vw,4.4rem)/1 var(--f-display);text-align:center;margin:12px 0}
.coin{width:180px;height:180px;margin:10px auto;position:relative;transform-style:preserve-3d;transition:transform 1.1s cubic-bezier(.2,.8,.2,1)}
.coin .side{position:absolute;inset:0;border-radius:50%;border:4px solid #1F1A4D;display:grid;place-items:center;font:800 1.6rem/1 var(--f-display);backface-visibility:hidden;color:#1F1A4D}
.coin .heads{background:radial-gradient(circle at 35% 30%,#FFE59A,#FFC93C 60%,#E3A91A)}
.coin .tails{background:radial-gradient(circle at 35% 30%,#C9F3EA,#22C7A9 60%,#159479);transform:rotateY(180deg)}
.dice{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin:14px 0}
.die{width:84px;height:84px;border:3px solid #1F1A4D;border-radius:18px;background:#fff;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);padding:10px;box-shadow:4px 4px 0 #1F1A4D}
.die i{width:14px;height:14px;border-radius:50%;background:#1F1A4D;place-self:center;visibility:hidden}
.die.big{display:grid;place-items:center;font:800 2rem/1 var(--f-display);color:#1F1A4D;grid-template-columns:1fr;grid-template-rows:1fr}
.die.roll{animation:roll .5s ease-out}
@keyframes roll{0%{transform:rotate(-30deg) scale(.8)}60%{transform:rotate(12deg) scale(1.08)}100%{transform:none}}
.big-card{background:var(--surface);border:2px solid var(--edge);border-radius:22px;padding:clamp(18px,4vw,34px);box-shadow:6px 6px 0 var(--drop);text-align:center}
.wyr{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:stretch}
.wyr .or{align-self:center;font:800 1.3rem/1 var(--f-display)}
.wyr button{border:2px solid #1F1A4D;border-radius:18px;padding:22px 18px;font:700 1.15rem/1.35 var(--f-body);cursor:pointer;color:#1F1A4D;min-height:150px;position:relative;overflow:hidden}
.wyr .a{background:var(--sky)} .wyr .b{background:var(--pop)}
.wyr button .pct{display:block;margin-top:10px;font:800 1.6rem/1 var(--f-display)}
.wyr button[disabled]{cursor:default}
.wyr button.picked{box-shadow:0 0 0 4px var(--sun),4px 4px 0 6px #1F1A4D}
@media (max-width:640px){.wyr{grid-template-columns:1fr}.wyr .or{justify-self:center}}
.teams{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr));gap:14px;margin-top:16px}
.team{border:2px solid #1F1A4D;border-radius:16px;padding:14px;color:#1F1A4D}
.team h3{font-size:1.1rem}
.team ul{margin:0;padding-left:1.1em}
.history{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;justify-content:center}
.history span{background:var(--sunk);border-radius:var(--r-pill);padding:3px 10px;font-size:.9rem}
.tool-controls{display:grid;gap:12px;max-width:520px;margin:0 auto}
.wheel-tool{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:28px;align-items:start}
@media (max-width:900px){.wheel-tool{grid-template-columns:1fr}}
.timer-bar{height:12px;border-radius:9px;background:var(--sunk);overflow:hidden;border:1.5px solid var(--edge);margin:10px 0}
.timer-bar i{display:block;height:100%;background:var(--mint);width:100%;transition:width .2s linear}
