/* tdc-games.css — the shared pieces of every game, in the games' ORIGINAL look (restored Sept 29 2026):
   centered page, gold segmented buttons, rounded bg2 panels, a centered result card.
   Each game page keeps its own original inline CSS for its board; this file only styles what
   tdc-games.js builds (mode switch, result card, stats, toast) plus the common segmented control. */

/* segmented control (Free play / Daily, difficulty) — the original .seg */
.gm-modes, .seg{display:inline-flex;background:var(--bg2);border:1px solid var(--border2);border-radius:9px;padding:3px;gap:3px;flex-wrap:wrap;justify-content:center;}
.gm-modes button, .seg button{font-size:12px;font-weight:800;letter-spacing:.02em;padding:6px 15px;border:none;border-radius:6px;background:none;color:var(--text3);cursor:pointer;font-family:inherit;transition:background .12s,color .12s;}
.gm-modes button.on, .seg button.on{background:var(--accent);color:#221c08;}
.gm-modes button small, .seg button small{display:block;font-size:9px;font-weight:700;letter-spacing:.03em;opacity:.7;margin-top:2px;}
.gm-modewrap{text-align:center;margin:10px 0 4px;}
.gm-note{font-size:12px;color:var(--text3);text-align:center;margin-top:6px;}

/* buttons */
.gm-btn{display:inline-flex;align-items:center;gap:6px;padding:11px 22px;font:700 14px 'Inter',system-ui,sans-serif;border-radius:10px;border:none;cursor:pointer;background:var(--accent);color:#221c08;}
.gm-btn.ghost{background:var(--bg);color:var(--text);border:1.5px solid var(--border2);}
.gm-btn.ghost:hover{border-color:var(--accent);}
.gm-btn:disabled{opacity:.45;cursor:default;}

/* end-of-game result card + stats (built by tdc-games.js) */
.gm-result{text-align:center;margin:24px auto 0;max-width:560px;border:1px solid var(--border);border-radius:16px;background:var(--bg2);padding:22px 18px 18px;animation:gmPop .35s cubic-bezier(.34,1.46,.64,1);}
@keyframes gmPop{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);}}
.gm-result-h{font-family:'Playfair Display',Georgia,serif;font-weight:800;font-size:30px;margin-bottom:4px;}
.gm-result-l{font-size:14px;color:var(--text2);line-height:1.5;margin-bottom:14px;}
.gm-result-a{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-bottom:16px;}
.gm-stats{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 22px;margin:0;padding-top:14px;border-top:1px solid var(--border);}
.gm-stats > div{display:flex;flex-direction:column;align-items:center;min-width:58px;}
.gm-stats dd{font-family:'Playfair Display',Georgia,serif;font-size:24px;font-weight:800;color:var(--text);font-variant-numeric:tabular-nums;order:1;}
.gm-stats dt{font-size:9.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--text3);order:2;margin-top:2px;}
.gm-next{font-size:12px;color:var(--text3);margin-top:12px;}
.gm-done{text-align:center;font-size:13px;color:var(--text2);padding:10px 0;}
.gm-done b{color:var(--text);}

.gm-toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);background:var(--text);color:var(--bg);font:700 13px 'Inter',system-ui,sans-serif;padding:10px 16px;border-radius:999px;z-index:500;transition:opacity .4s;}
.gm-toast.out{opacity:0;}

@media(max-width:560px){ .gm-modes button, .seg button{padding:6px 10px;} .gm-result-h{font-size:26px;} }
