/* DEBATEGAME: game pages. Uses the site tokens from dn.css (dark by default, light on request). */
.gwrap{max-width:1120px;margin:0 auto;padding:14px 16px 28px;display:grid;grid-template-columns:minmax(0,1fr);gap:22px;min-width:0}
.gwrap h1{font-size:clamp(2rem,8vw,3.4rem)}
.gh{font-size:1.15rem;margin:8px 0 10px}
.gfine{font-size:.85rem}
.ghero{display:grid;gap:16px;align-items:center}
.gface{position:relative;width:96px;height:96px;flex:none;border-radius:22px;overflow:hidden;box-shadow:0 0 0 2px var(--acc),0 10px 30px var(--glow)}
.gface img{width:100%;height:100%;object-fit:cover;display:block}
.gface .gbadge{position:absolute;left:0;right:0;bottom:0;background:rgba(8,10,18,.85);color:#F3F5FA;font-size:.5rem;font-weight:800;text-align:center;padding:2px}
.gface.big{width:140px;height:140px}.gface.big .gbadge{font-size:.62rem;padding:3px}
/* hub cards */
.gcards{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.gcard{display:flex;align-items:center;gap:14px;background:var(--card);border:1.5px solid var(--line);border-radius:var(--r);padding:16px;color:var(--text);text-decoration:none;min-height:84px;transition:transform .15s ease,border-color .15s ease}
.gcard:hover,.gcard:focus-visible{border-color:var(--acc-text);transform:translateY(-2px)}
.gic{width:52px;height:52px;flex:none;border-radius:16px;display:grid;place-items:center;background:var(--bg2);color:var(--acc-text)}
.gct{display:grid;gap:2px;min-width:0;flex:1}.gct b{font-size:1.1rem}.gct span{color:var(--muted);font-size:.92rem}
.gtag{flex:none;font-size:.7rem;font-weight:900;text-transform:uppercase;letter-spacing:.1em;border:1px solid var(--line);border-radius:999px;padding:3px 10px;color:var(--muted)}
.g-tom .gtag,.g-daily .gtag{color:var(--win);border-color:var(--win)}
/* mode nav */
.gmodes ul{list-style:none;margin:0;padding:2px;display:flex;gap:8px;overflow-x:auto;scrollbar-width:none}
.gmodes ul::-webkit-scrollbar{display:none}
.gmodes a{display:flex;align-items:center;gap:8px;white-space:nowrap;min-height:44px;padding:6px 14px;border-radius:999px;border:1.5px solid var(--line);background:var(--card);color:var(--muted);text-decoration:none;font-weight:800;font-size:.9rem}
.gmodes a svg{width:20px;height:20px}
.gmodes a[aria-current=page]{color:var(--acc-ink);background:var(--acc);border-color:var(--acc)}
/* player bar */
.gplayer{display:flex;flex-wrap:wrap;align-items:center;gap:10px;background:var(--card);border:1.5px solid var(--line);border-radius:16px;padding:10px 14px}
.gname{font-weight:900}.gschool{color:var(--muted);font-weight:700}
.gplayer .btn{margin-left:auto}
/* card games */
.gplay{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;min-width:0}
.gintro .lead{margin-bottom:14px}
.ghud{display:flex;align-items:center;gap:12px;font-weight:800}
.gtimer{flex:1;height:10px;border-radius:999px;background:var(--bg2);overflow:hidden;border:1px solid var(--line)}
.gtimer i{display:block;height:100%;background:var(--acc);transform-origin:left;transition:transform .2s linear}
#gClock{min-width:2ch;text-align:right;font-variant-numeric:tabular-nums;font-size:1.2rem}
.gsc{color:var(--muted)}.gsc b{color:var(--text)}
.gstep{color:var(--acc-text)}
.gdeck{min-height:252px;display:grid;place-items:center;overflow:hidden;padding:6px 4px;border-radius:28px;max-width:100%}
.gcard-claim{width:min(100%,560px);min-height:220px;display:grid;align-content:center;gap:10px;background:var(--card);border:2px solid var(--line);border-radius:26px;padding:24px 22px;box-shadow:var(--shadow);touch-action:pan-y;user-select:none;cursor:grab;transition:transform .2s ease,opacity .2s ease,border-color .15s}
.gcard-claim.lean-t{border-color:var(--win)}.gcard-claim.lean-m{border-color:var(--hot)}
.gcard-claim.fly-t{transform:translateX(120%) rotate(12deg);opacity:0}.gcard-claim.fly-m{transform:translateX(-120%) rotate(-12deg);opacity:0}
.gtopicname{font-size:.72rem;font-weight:900;text-transform:uppercase;letter-spacing:.12em;color:var(--acc-text)}
.gclaim{font-size:clamp(1.3rem,5.4vw,1.8rem);font-weight:900;line-height:1.2;margin:0}
.ghint{font-size:.8rem;color:var(--muted)}
.gpicks{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:560px;width:100%;margin:0 auto}
.gbtn{min-height:64px;border-radius:20px;border:2px solid;font:inherit;font-size:1.25rem;font-weight:900;cursor:pointer;letter-spacing:.02em}
.gbtn.myth{background:color-mix(in srgb,var(--hot) 14%,var(--card));border-color:var(--hot);color:var(--text)}
.gbtn.true{background:color-mix(in srgb,var(--win) 14%,var(--card));border-color:var(--win);color:var(--text)}
.gbtn:active{transform:scale(.97)}.gbtn[disabled]{opacity:.6}
.glast{max-width:560px;width:100%;margin:0 auto;display:grid;gap:4px;border-radius:16px;padding:12px 14px;background:var(--bg2);border:1.5px solid var(--line);min-height:96px}
.glast.ok{border-color:var(--win)}.glast.no{border-color:var(--hot)}
.glast.ok b{color:var(--win)}.glast.no b{color:var(--hot)}
.glast.big{font-size:1.05rem;min-height:140px}
.gline{color:var(--text)}
.gsrcl{font-size:.85rem;color:var(--muted)}.gsrc{overflow-wrap:anywhere}
.gnext{text-align:center;margin:0}
.gresult{background:var(--card);border:1.5px solid var(--line);border-radius:var(--r);padding:20px;display:grid;grid-template-columns:minmax(0,1fr);gap:10px;min-width:0}
.gresult:focus{outline:none}
.gbig{font-size:clamp(2.4rem,10vw,3.6rem);margin:0}.gbig b{color:var(--acc-text)}
.ggrid{display:flex;gap:4px;flex-wrap:wrap;margin:0}.ggrid i{width:18px;height:18px;border-radius:5px;background:var(--hot)}.ggrid i.y{background:var(--win)}
.gmeta{margin:0;font-weight:800}.gmeta.ok{color:var(--win)}
.gbadges{display:flex;flex-wrap:wrap;gap:8px;margin:0}
.gbadge-new{background:color-mix(in srgb,var(--acc) 20%,transparent);border:1px solid var(--acc);color:var(--text);border-radius:999px;padding:4px 12px;font-weight:800;font-size:.85rem}
.gbtns{display:flex;flex-wrap:wrap;gap:10px;margin:0}
.grecap summary{cursor:pointer;font-weight:800;color:var(--acc-text);min-height:44px;display:flex;align-items:center}
.grecap ol{padding-left:20px;display:grid;gap:8px;margin:6px 0 0}
.grecap li.ok b{color:var(--win)}.grecap li.no b{color:var(--hot)}
.grecap .gline{display:block;color:var(--muted);font-size:.92rem}
/* boards */
.gboards{display:grid;gap:16px}
.gboard{background:var(--card);border:1.5px solid var(--line);border-radius:var(--r);padding:16px;min-width:0}
.gboard h2{font-size:1.05rem;text-transform:uppercase;letter-spacing:.08em}
.glist{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.glist li{display:flex;align-items:center;gap:10px;min-height:36px}
.glist .rk{width:28px;flex:none;text-align:center;font-weight:900;color:var(--acc-text)}.glist .rk svg{width:20px;height:20px;vertical-align:middle}
.glist .nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:700}
.glist .ppl{font-size:.8rem;color:var(--muted)}
.glist b{font-variant-numeric:tabular-nums}
.trophy{display:flex;align-items:center;gap:8px;color:var(--acc-text);font-weight:800}
/* debates */
.gtopics{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.gtopic{width:100%;text-align:left;display:grid;gap:2px;background:var(--card);border:1.5px solid var(--line);border-radius:16px;padding:12px 14px;color:var(--text);font:inherit;cursor:pointer;min-height:56px}
.gtopic span{font-weight:800}.gtopic small{color:var(--muted)}
button.gtopic:hover,button.gtopic:focus-visible{border-color:var(--acc-text)}
.gtopic.locked{opacity:.55;cursor:default;border-style:dashed}
.gladder{display:grid;gap:18px}
.grungs{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.grungs li{display:grid;gap:2px;border-radius:14px;padding:10px 14px;border:1.5px solid var(--line);background:var(--card)}
.grungs li span{font-size:.85rem;color:var(--muted)}
.grungs li.cur{border-color:var(--acc);box-shadow:0 0 0 3px var(--glow)}
.grungs li.done{border-color:var(--win)}.grungs li.done span{color:var(--win)}
.grungs li.lock{opacity:.6}
.gdebate{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;background:var(--bg2);border:1.5px solid var(--line);border-radius:var(--r);padding:16px;scroll-margin-top:12px;min-width:0}
.gdhead{display:flex;gap:14px;align-items:center}.gdhead h2{margin:0;font-size:1.2rem}.gdhead .gface{width:72px;height:72px}
.gthread{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.gt{border-radius:18px;padding:12px 14px;max-width:94%;overflow-wrap:anywhere}
.gt .who{font-size:.7rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase;margin:0 0 4px}
.gt .txt{margin:0}
.gt.you{background:var(--acc);color:var(--acc-ink);justify-self:end}
.gt.he{background:var(--card);border:1.5px solid var(--line)}.gt.he .who{color:var(--muted)}
.gnate-typing{display:flex;align-items:center;gap:6px;color:var(--muted)}
.gnate-typing span{width:8px;height:8px;border-radius:50%;background:var(--muted);animation:bob 1s infinite}.gnate-typing span:nth-child(2){animation-delay:.15s}.gnate-typing span:nth-child(3){animation-delay:.3s}
.gnate-typing b{font-weight:700;margin-left:6px}
.gask{display:grid;gap:8px}.gask label{font-weight:800}
.gask textarea{width:100%;min-height:96px;border-radius:16px;border:1.5px solid var(--line);background:var(--card);color:var(--text);font:inherit;font-size:1.05rem;padding:12px;resize:vertical}
.gask textarea:focus{border-color:var(--acc-text);outline:none}
.gaskrow{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.gmsg{color:var(--hot);font-weight:700;margin:0}.gmsg:empty{display:none}
#gSchoolMsg{color:var(--text)}
.gts:empty{display:none}
.glimit{background:var(--card);border:1.5px solid var(--acc-text);border-radius:var(--r);padding:16px}
.gsplit{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.gsplit li{display:grid;grid-template-columns:76px 1fr 36px;align-items:center;gap:10px;font-weight:800}
.gsplit i{height:10px;border-radius:999px;background:linear-gradient(90deg,var(--acc) var(--w),var(--bg2) var(--w));border:1px solid var(--line)}
.gsplit b{text-align:right}
.gschoolpick{display:grid;gap:8px;max-width:520px;margin-bottom:12px}.gschoolpick label{font-weight:800}
.gschoolpick select{flex:1 1 220px;min-width:0}
.gpts{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.gpts li{display:flex;justify-content:space-between;gap:10px;background:var(--card);border:1.5px solid var(--line);border-radius:14px;padding:10px 14px}.gpts span{color:var(--muted)}
.gvs{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;text-align:center}
.gvs div{background:var(--card);border:1.5px solid var(--line);border-radius:var(--r);padding:16px;display:grid}
.gvs div.win{border-color:var(--acc)}.gvs b{font-size:2.6rem;font-weight:900}.gvs i{font-style:normal;font-weight:900;color:var(--muted)}
.gdlg{border:1.5px solid var(--line);border-radius:24px;background:var(--card);color:var(--text);padding:20px;width:min(92vw,440px)}
.gdlg::backdrop{background:rgba(4,6,12,.8)}
.gdlg input{width:100%;min-height:48px;border-radius:14px;border:1.5px solid var(--line);background:var(--bg2);color:var(--text);font:inherit;padding:8px 14px}
.gshare{min-height:46px}
@media (min-width:900px){
  .ghero{grid-template-columns:auto 1fr}
  .gcards{grid-template-columns:repeat(2,1fr)}
  .gboards{grid-template-columns:1fr 1fr}
  .gtopics{grid-template-columns:repeat(2,1fr)}
  .gladder{grid-template-columns:300px 1fr;align-items:start}
}
@media (prefers-reduced-motion:reduce){.gcard-claim,.gtimer i{transition:none}}