/* ───────────────────────────────────────────────────────────────────────── * education/challenges/ch.css — Mock Tests hub + every board / exam page. [2026-09-27] * * The first half is the 2026-09-10 /words/-language sheet that challenges.php carried inline, * moved here unchanged so the hub, the board pages and the exam pages share one set of rules. * The second half (below "hub + tracks") is new: track cards, the class ladder, pattern facts * and the practice browser. * * Every class is `ch-` prefixed: the shell loads after the page and answers generic names * (.hero, .card, .grid) with its own rules. Palette tokens are read from the shell by NAME with * fallbacks — never write the shell stylesheet's file name in this file or in a page, or * bootstrap.php believes it is already linked and skips injecting it. * ───────────────────────────────────────────────────────────────────────── */ :root{ --c-bg:var(--bg,#fdfcfa); --c-card:var(--card,#fff); --c-border:var(--border,#eadfce); --c-border-soft:var(--border-soft,#f0ebe0); --c-primary:var(--primary,#ea7a27); --c-deep:var(--primary-deep,#b85c12); --c-soft:var(--accent-soft,#fdf0dc); --c-mist:var(--mist,#fdf0dd); --c-ink:var(--ink,#171717); --c-ink2:var(--ink-2,#404040); --c-ink3:var(--ink-3,#737373); --c-r:14px; --c-r-lg:20px; --c-shadow:0 6px 24px rgba(120,72,20,.05); --c-shadow-lg:0 16px 44px rgba(120,72,20,.10); --c-spring:cubic-bezier(.22,1,.36,1); } /* overflow-x:clip, NOT hidden. `hidden` on the root makes its own dead * scroll container and the global sheet's overscroll-behavior:contain then stops * it chaining to the viewport — wheel and touch scroll die. Written `html body` * so it beats the global `body{overflow-x:hidden}` that lands after this file. */ html{overflow-x:clip} html body{overflow-x:clip;background:var(--c-bg);color:var(--c-ink); font-family:'Inter',system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased} /* ── section furniture ── */ .ch-sec{margin:0 0 3rem} .ch-hd{display:flex;align-items:flex-end;gap:.7rem;flex-wrap:wrap;margin-bottom:1.25rem} .ch-hd h2{font-family:'Playfair Display',Georgia,serif;font-weight:700;font-size:clamp(1.3rem,2.7vw,1.75rem); letter-spacing:-.3px;color:var(--c-ink);border-bottom:2px solid var(--c-primary);padding-bottom:.2rem;margin:0} .ch-hd .ch-sub{font-size:.82rem;color:var(--c-ink3);margin-left:auto;padding-bottom:.25rem} @media(max-width:640px){.ch-hd .ch-sub{display:none}} .ch-eye{font-size:.75rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--c-primary)} /* ── hero ── * A

, deliberately not a

: the shell owns the page header and * a second one at page level is a fight this page does not need to have. */ .ch-hero{padding:2.5rem 0 1.9rem;text-align:center;position:relative;overflow:hidden; background:radial-gradient(ellipse 70% 60% at 12% -12%,rgba(234,122,39,.12) 0%,transparent 60%), linear-gradient(135deg,#fffdf9 0%,#fdf4e7 100%); border-bottom:1px solid rgba(234,88,12,.12)} .ch-hero h1{font-family:'Outfit',sans-serif;font-weight:900;font-size:clamp(1.9rem,5.4vw,3.4rem); line-height:1.05;letter-spacing:-.02em;margin:.65rem 0 .3rem;color:var(--c-ink)} .ch-hero h1 em{font-style:italic;color:var(--c-primary)} .ch-lede{font-size:.95rem;color:var(--c-ink2);max-width:46rem;margin:.55rem auto 0;line-height:1.6} .ch-chip{display:inline-flex;align-items:center;gap:.4rem;font-size:.75rem;font-weight:800;letter-spacing:.13em; text-transform:uppercase;color:var(--c-primary);background:var(--c-mist);border:1px solid var(--c-soft); padding:.32rem .75rem;border-radius:999px} .ch-stats{display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem 1.4rem;margin:1.35rem 0 0;padding:0;list-style:none} .ch-stats li{display:flex;align-items:center;gap:.45rem;font-size:.83rem;font-weight:600;color:var(--c-ink2); background:rgba(255,255,255,.72);border:1px solid var(--c-border);padding:.42rem 1rem;border-radius:999px} .ch-stats b{color:var(--c-primary);font-weight:900;font-size:1.1rem} /* ── setup panels ── */ .ch-panel{background:var(--c-card);border:1px solid var(--c-border);border-radius:var(--c-r-lg); box-shadow:var(--c-shadow);padding:1.15rem 1.25rem} .ch-panel + .ch-panel{margin-top:.85rem} /* Grid, not flex. minmax(0,1fr) tracks CANNOT be pushed wider than their share, * which is the whole bug the old flex row had: a