/* Brain Quest 2.0 additions */
button{-webkit-tap-highlight-color:transparent}
.btn[disabled]{opacity:.45;cursor:default;box-shadow:none;transform:none}
.btn.danger,.btn.ghost.danger{color:var(--warm);border-color:var(--warm)}
.btn.danger{background:var(--warm-bg);box-shadow:0 4px 0 var(--warm)}
.center-t{text-align:center}
.left{text-align:left;align-self:stretch}
.linkbtn{background:none;border:0;color:var(--primary);font:700 .95rem var(--body);text-decoration:underline;cursor:pointer;padding:10px}
.errmsg{background:var(--warm-bg);border:2px solid var(--warm);border-radius:12px;padding:8px 12px;font-weight:700;color:var(--ink)}
a{color:var(--primary);font-weight:700}
.copybox{width:100%;min-height:140px;border-radius:12px;border:2px solid var(--line);background:var(--bg);color:var(--ink);font:.9rem var(--body);padding:10px}
.tick-list{margin:0;padding-left:1.2em;display:flex;flex-direction:column;gap:6px}

/* home */
.goal{margin-top:4px}
.mi{flex:none;width:48px;height:48px;border-radius:14px;display:grid;place-items:center;font:800 1.15rem/1 var(--display);color:#fff}
.m1{background:#2a86d8}.m2{background:#1aa46f}.m3{background:#e0463b}.m4{background:#c98600}.m5{background:#9b57d3}.m6{background:#e0508f}
.tick{flex:none;width:34px;height:34px;border-radius:50%;border:2px dashed var(--line);display:grid;place-items:center;font-weight:800;color:var(--good)}
.tick.on{border:2px solid var(--good);background:var(--good-bg)}

/* lessons and teach cards */
.lbox{background:var(--bg);border-left:6px solid var(--sc,var(--primary));border-radius:12px;padding:10px 14px;display:flex;flex-direction:column;gap:4px;text-align:left}
.lbox h3{font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-family:var(--body);font-weight:700}
.lbox p{font-size:1.05rem}
.lbox.ex{border-left-color:var(--sun)}
.lbox.good{border-left-color:var(--good);background:var(--good-bg)}
.qrecap{font-weight:700;color:var(--muted)}
.teach .fbhead h2{font-size:1.4rem}

/* answering: tap, then lock in */
.opt{border-width:3px}
.opts{gap:12px}
.opt.sel{border-color:var(--primary);background:color-mix(in srgb,var(--primary) 12%,var(--surface));box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 30%,transparent)}
.opt.sel .l{background:var(--primary);color:#fff;border-color:var(--primary)}
.opt.sel .mk{color:var(--primary)}
.dock{position:sticky;bottom:calc(env(safe-area-inset-bottom,0px) + 8px);display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;background:var(--surface);padding:10px;border-radius:16px;border:2px solid var(--line);box-shadow:0 -6px 16px rgba(0,0,0,.06)}
.lockbtn{flex:1;min-width:160px;align-self:stretch;text-align:center}
.lockbtn:not([disabled]){background:var(--primary);color:#fff;box-shadow:0 4px 0 #2a2394}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .lockbtn:not([disabled]){color:#10163a;box-shadow:0 4px 0 #6a63cf}}
.stars{display:flex;gap:6px;justify-content:center}
.starsvg{fill:var(--line);stroke:var(--muted);stroke-width:1}
.starsvg.on{fill:var(--sun);stroke:var(--sun-deep)}
.stampline{display:flex;align-items:center;gap:14px;justify-content:center}
.pills .tp,.tp{display:inline-block}

/* chips */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip2{min-height:46px;min-width:46px;padding:6px 14px;border-radius:999px;border:2px solid var(--line);background:var(--surface);color:var(--ink);font:800 1rem var(--display);cursor:pointer}
.chip2.on{background:var(--primary);color:#fff;border-color:var(--primary)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .chip2.on{color:#10163a}}

/* games */
.ghead{display:flex;flex-wrap:wrap;align-items:center;gap:8px;justify-content:space-between}
.gtitle{font:800 1.25rem/1.1 var(--display)}
.optgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.optgrid .opt{justify-content:center;text-align:center;font-size:1.3rem;min-height:68px}
.optgrid .opt .t{text-align:center}
.optgrid .opt.right{border-color:var(--good);background:var(--good-bg)}
.optgrid .opt.wrong{border-color:var(--warm);background:var(--warm-bg)}
.bigq{font-size:clamp(1.8rem,8vw,2.6rem);text-align:center;font-weight:800}
.timebar{height:12px;background:var(--line);border-radius:8px;overflow:hidden}
.timebar b{display:block;height:100%;background:var(--sun);transition:width .25s linear}
.fbline{min-height:1.5em;font-weight:700}
.gpick .gd{font-size:.85rem}.gpick .gb{font-size:.82rem;color:var(--primary);font-weight:700}
.gico{--sz:54px}
.clockwrap{display:flex;justify-content:center}
.clock{width:min(70vw,260px);height:auto}
.clock .cf{fill:var(--surface);stroke:var(--ink);stroke-width:4}
.clock .cn{fill:var(--ink)}.clock .ct{stroke:var(--muted);stroke-width:1.5}
.clock .hh{stroke:var(--ink);stroke-width:7;stroke-linecap:round}
.clock .mh{stroke:var(--c-maths);stroke-width:4.5;stroke-linecap:round}
.clock .hub{fill:var(--ink)}
.clue{font:700 1.15rem/1.4 var(--body);text-align:center}
.slotsrow{display:flex;gap:6px;justify-content:center;flex-wrap:wrap}
.lt{width:40px;height:50px;border-bottom:4px solid var(--primary);display:grid;place-items:center;font:800 1.6rem/1 var(--display);text-transform:lowercase}
.slotsrow.good .lt{border-color:var(--good);color:var(--good)}
.slotsrow.bad .lt{border-color:var(--warm)}
.tilerow{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.tile{width:54px;height:54px;border-radius:14px;border:2px solid var(--line);background:var(--surface);color:var(--ink);font:800 1.5rem var(--display);cursor:pointer;box-shadow:0 3px 0 var(--line)}
.tile:disabled{opacity:.25;cursor:default}
.memgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.mcard{min-height:84px;border-radius:14px;border:3px solid var(--line);background:var(--primary);color:#fff;font:800 1.15rem/1.15 var(--display);cursor:pointer;padding:6px;word-break:break-word}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .mcard{color:#10163a}}
.mcard.up{background:var(--surface);color:var(--ink);border-color:var(--primary)}
.mcard.done{background:var(--good-bg);color:var(--ink);border-color:var(--good);opacity:.85}
.shaperow{display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap}
.qm{width:44px;height:44px;border-radius:12px;border:3px dashed var(--primary);display:grid;place-items:center;font:800 1.5rem var(--display);color:var(--primary)}
.opt.shp{justify-content:center}
.grid5{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;max-width:340px;width:100%;margin-inline:auto;aspect-ratio:1}
.cell{position:relative;background:var(--bg);border:2px solid var(--line);border-radius:10px;display:grid;place-items:center;min-height:50px}
.cell.wall{background:var(--ink);border-color:var(--ink)}
.cell .wl{color:var(--muted);font-size:1.2rem;opacity:.5}
.goalstar{fill:var(--sun);stroke:var(--sun-deep);stroke-width:1}
.bot{position:absolute;inset:0;display:grid;place-items:center;transition:transform .25s}
.bot svg{fill:var(--primary);stroke:var(--ink);stroke-width:1.2}
.prog2{display:flex;flex-wrap:wrap;gap:6px;min-height:42px;align-items:center;background:var(--bg);border-radius:12px;padding:8px}
.blk{width:38px;height:38px;border-radius:10px;background:var(--primary);color:#fff;display:grid;place-items:center;font:800 1.2rem var(--display)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .blk{color:#10163a}}

/* grown-up side */
.pin{display:flex;flex-direction:column;align-items:center;gap:16px;width:100%}
.dots{display:flex;gap:14px}
.dot{width:20px;height:20px;border-radius:50%;border:3px solid var(--primary)}
.dot.on{background:var(--primary)}
.pad{display:grid;grid-template-columns:repeat(3,76px);gap:10px;justify-content:center}
.key{height:62px;border-radius:16px;border:2px solid var(--line);background:var(--surface);color:var(--ink);font:800 1.5rem var(--display);cursor:pointer;box-shadow:0 3px 0 var(--line)}
.key:active{transform:translateY(2px);box-shadow:none}
.key.alt{background:var(--bg)}
.chk{display:flex;gap:12px;align-items:flex-start;text-align:left;width:100%;padding:12px;border:2px solid var(--line);border-radius:14px;background:var(--surface);color:var(--ink);font:inherit;cursor:pointer}
.chk.on{border-color:var(--good);background:var(--good-bg)}
.cb{flex:none;width:30px;height:30px;border-radius:8px;border:3px solid var(--primary);display:grid;place-items:center;font-weight:800;color:var(--good);background:var(--surface)}
.avgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
@media (max-width:420px){.avgrid{grid-template-columns:repeat(3,1fr)}}
.avbtn{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 4px;border-radius:14px;border:3px solid var(--line);background:var(--surface);color:var(--ink);font:700 .85rem var(--body);cursor:pointer}
.avbtn.on{border-color:var(--primary);background:color-mix(in srgb,var(--primary) 12%,var(--surface))}
.preview{display:flex;align-items:center;gap:14px;background:var(--bg);border-radius:16px;padding:12px}
.avph{width:64px;height:64px;border-radius:50%;border:3px dashed var(--line)}
.kidrow{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:10px 0;border-top:2px solid var(--line)}
.kidrow:first-child{border-top:0}
.kidrow .pt{flex:1;min-width:140px}
.avsvg{display:block;flex:none}
.overlay{position:fixed;inset:0;background:rgba(10,16,40,.72);z-index:50;display:grid;place-items:center;padding:16px}
.overlay .card{max-width:420px}
.chip .avsvg,.chip .pip{flex:none}

/* layout polish found in the phone-width check */
.brand{white-space:nowrap;font-size:1.15rem}
.chip{max-width:38vw}
.ghead{flex-wrap:nowrap}.gtitle{flex:1;min-width:0}
.ghead .btn.sm{flex:none}
.slotsrow{flex-wrap:nowrap;gap:4px}
.lt{width:clamp(24px,8.4vw,40px);height:46px;font-size:clamp(1.2rem,5vw,1.6rem)}
