/* ════════════════════════════════════════════════════════════════════════
   CertAnvil cert-app · dg-system FOUNDATION (REBRAND Batch 3)
   ────────────────────────────────────────────────────────────────────────
   Recipe = the proven landing/diagnostic reskin, adapted: the cert app is
   FULLY token-driven (components use var(--accent/--surface/--bg/--text…)),
   so the foundation REDEFINES the app's own token names to the dg OKLCH
   palette via a 4-block cascade that out-specifies the styles.css token
   layer (:root / [data-theme="light"] = spec (0,1,0); ours html:root /
   html[data-theme] = (0,1,1), wins + later source order). One file recolours
   all ~30 pages coherently. Plus de-card primitives over the structural
   class contract (.card/.btn/.option/.chip…). ZERO markup + ZERO render-JS
   change. Per-surface fine-tuning + the ~500 hardcoded-hex/[data-theme]
   residuals are Batches 4+.
   Loaded by index.html AFTER styles.css. Cache-bump every deploy.
   0 hardcoded hex in COLOR values (rgb triplets for legacy rgba() glows are
   sRGB approximations of the dg accent, intentional · 0 em-dash · 0 emoji.
   ════════════════════════════════════════════════════════════════════════ */

/* ── 4-block cascade · REDEFINE the cert-app's own tokens to dg OKLCH ───── */
html:root{
  --bg:oklch(0.17 0.008 275);
  --surface:oklch(0.205 0.009 275);--surface2:oklch(0.205 0.009 275);--surface3:oklch(0.23 0.009 275);
  --border:oklch(0.32 0.011 275);
  --accent:oklch(0.80 0.155 64);--accent-light:oklch(0.86 0.135 64);--accent-dim:color-mix(in oklab,oklch(0.80 0.155 64) 28%,transparent);
  --accent-rgb:225,170,95;
  --text:oklch(0.96 0.006 275);--text-mid:oklch(0.80 0.012 275);--text-dim:oklch(0.725 0.013 275);
  --green:oklch(0.74 0.150 152);--green-bg:color-mix(in oklab,oklch(0.74 0.150 152) 9%,transparent);--green-border:color-mix(in oklab,oklch(0.74 0.150 152) 38%,transparent);--green-rgb:90,205,150;
  --red:oklch(0.66 0.17 25);--red-bg:color-mix(in oklab,oklch(0.66 0.17 25) 9%,transparent);--red-border:color-mix(in oklab,oklch(0.66 0.17 25) 38%,transparent);--red-rgb:225,110,105;
  --yellow:oklch(0.80 0.14 70);--yellow-rgb:235,185,90;
  --blue:oklch(0.74 0.150 152);--orange:oklch(0.80 0.155 64);
  --radius:12px;--radius-sm:9px;
  --correct-text:oklch(0.86 0.13 152);--correct-text2:oklch(0.90 0.10 152);--correct-text3:oklch(0.80 0.13 152);
  --wrong-text:oklch(0.80 0.13 25);--wrong-text2:oklch(0.86 0.10 25);
  --dg-rule-soft:oklch(0.255 0.010 275);
}
@media (prefers-color-scheme: light){html:root{
  --bg:oklch(0.975 0.007 85);
  --surface:oklch(0.945 0.008 85);--surface2:oklch(0.945 0.008 85);--surface3:oklch(0.915 0.008 85);
  --border:oklch(0.85 0.011 85);
  --accent:oklch(0.50 0.155 55);--accent-light:oklch(0.58 0.150 55);--accent-dim:color-mix(in oklab,oklch(0.50 0.155 55) 22%,transparent);
  --accent-rgb:150,95,40;
  --text:oklch(0.26 0.015 280);--text-mid:oklch(0.42 0.014 280);--text-dim:oklch(0.50 0.013 280);
  --green:oklch(0.50 0.15 150);--green-bg:color-mix(in oklab,oklch(0.50 0.15 150) 8%,transparent);--green-border:color-mix(in oklab,oklch(0.50 0.15 150) 32%,transparent);--green-rgb:25,140,75;
  --red:oklch(0.52 0.19 25);--red-bg:color-mix(in oklab,oklch(0.52 0.19 25) 8%,transparent);--red-border:color-mix(in oklab,oklch(0.52 0.19 25) 32%,transparent);--red-rgb:200,55,55;
  --yellow:oklch(0.58 0.14 65);--yellow-rgb:150,95,30;
  --blue:oklch(0.50 0.15 150);--orange:oklch(0.50 0.155 55);
  --correct-text:oklch(0.40 0.13 150);--correct-text2:oklch(0.45 0.12 150);--correct-text3:oklch(0.40 0.13 150);
  --wrong-text:oklch(0.45 0.17 25);--wrong-text2:oklch(0.50 0.16 25);
  --dg-rule-soft:oklch(0.90 0.009 85);
}}
html[data-theme="dark"]{
  --bg:oklch(0.17 0.008 275);
  --surface:oklch(0.205 0.009 275);--surface2:oklch(0.205 0.009 275);--surface3:oklch(0.23 0.009 275);
  --border:oklch(0.32 0.011 275);
  --accent:oklch(0.80 0.155 64);--accent-light:oklch(0.86 0.135 64);--accent-dim:color-mix(in oklab,oklch(0.80 0.155 64) 28%,transparent);
  --accent-rgb:225,170,95;
  --text:oklch(0.96 0.006 275);--text-mid:oklch(0.80 0.012 275);--text-dim:oklch(0.725 0.013 275);
  --green:oklch(0.74 0.150 152);--green-bg:color-mix(in oklab,oklch(0.74 0.150 152) 9%,transparent);--green-border:color-mix(in oklab,oklch(0.74 0.150 152) 38%,transparent);--green-rgb:90,205,150;
  --red:oklch(0.66 0.17 25);--red-bg:color-mix(in oklab,oklch(0.66 0.17 25) 9%,transparent);--red-border:color-mix(in oklab,oklch(0.66 0.17 25) 38%,transparent);--red-rgb:225,110,105;
  --yellow:oklch(0.80 0.14 70);--yellow-rgb:235,185,90;
  --blue:oklch(0.74 0.150 152);--orange:oklch(0.80 0.155 64);
  --radius:12px;--radius-sm:9px;
  --correct-text:oklch(0.86 0.13 152);--correct-text2:oklch(0.90 0.10 152);--correct-text3:oklch(0.80 0.13 152);
  --wrong-text:oklch(0.80 0.13 25);--wrong-text2:oklch(0.86 0.10 25);
  --dg-rule-soft:oklch(0.255 0.010 275);
}
html[data-theme="light"]{
  --bg:oklch(0.975 0.007 85);
  --surface:oklch(0.945 0.008 85);--surface2:oklch(0.945 0.008 85);--surface3:oklch(0.915 0.008 85);
  --border:oklch(0.85 0.011 85);
  --accent:oklch(0.50 0.155 55);--accent-light:oklch(0.58 0.150 55);--accent-dim:color-mix(in oklab,oklch(0.50 0.155 55) 22%,transparent);
  --accent-rgb:150,95,40;
  --text:oklch(0.26 0.015 280);--text-mid:oklch(0.42 0.014 280);--text-dim:oklch(0.50 0.013 280);
  --green:oklch(0.50 0.15 150);--green-bg:color-mix(in oklab,oklch(0.50 0.15 150) 8%,transparent);--green-border:color-mix(in oklab,oklch(0.50 0.15 150) 32%,transparent);--green-rgb:25,140,75;
  --red:oklch(0.52 0.19 25);--red-bg:color-mix(in oklab,oklch(0.52 0.19 25) 8%,transparent);--red-border:color-mix(in oklab,oklch(0.52 0.19 25) 32%,transparent);--red-rgb:200,55,55;
  --yellow:oklch(0.58 0.14 65);--yellow-rgb:150,95,30;
  --blue:oklch(0.50 0.15 150);--orange:oklch(0.50 0.155 55);
  --correct-text:oklch(0.40 0.13 150);--correct-text2:oklch(0.45 0.12 150);--correct-text3:oklch(0.40 0.13 150);
  --wrong-text:oklch(0.45 0.17 25);--wrong-text2:oklch(0.50 0.16 25);
  --dg-rule-soft:oklch(0.90 0.009 85);
}

/* ── de-card primitives over the structural class contract ─────────────────
   Token redefinition recolours everything; these flatten the glassy
   soft-card system into the dg hairline aesthetic. Specificity
   html[data-theme] body beats styles.css's per-component [data-theme] rules
   (the Batch-1 lesson, at 10x scale: 500 themed selectors). */
html[data-theme] body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;}
html[data-theme] body .card{background:none;border:1px solid var(--dg-rule-soft);border-radius:var(--radius);box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;}
html[data-theme] body .btn{border-radius:var(--radius-sm);box-shadow:none;}
html[data-theme] body .btn-primary{background:var(--accent);color:var(--bg);}
html[data-theme] body .btn-primary:hover{background:var(--accent);filter:brightness(1.05);transform:none;box-shadow:none;}
html[data-theme] body .btn-secondary{background:none;border:1px solid var(--border);color:var(--text-mid);}
html[data-theme] body .btn-secondary:hover{background:var(--surface2);color:var(--text);}
html[data-theme] body .btn-ghost{background:none;border:1px solid var(--border);color:var(--text-dim);}
html[data-theme] body .btn-ghost:hover{border-color:var(--accent);color:var(--accent);background:none;}
html[data-theme] body .btn-danger{background:var(--red-bg);border:1px solid var(--red-border);color:var(--red);}
html[data-theme] body .btn-danger:hover{background:color-mix(in oklab,var(--red) 14%,transparent);}
html[data-theme] body .btn-exam{background:none;border:1px solid var(--border);color:var(--text);}
html[data-theme] body .btn-exam:hover{border-color:var(--accent);color:var(--accent);box-shadow:none;}
html[data-theme] body .option{background:none;border:1px solid var(--dg-rule-soft);box-shadow:none;}
html[data-theme] body .option:hover{border-color:var(--accent);}
html[data-theme] body .chip{box-shadow:none;}
html[data-theme] body h3{color:var(--text-dim);}

/* ════════════════════════════════════════════════════════════════════════
   PER-SURFACE STRUCTURAL RESKIN · Batch 4 · HOME (#page-setup)
   ────────────────────────────────────────────────────────────────────────
   Faithful build of mockups/netplus-home-concept.html. NOT a recolor: the
   home markup is rebuilt to the editorial structure (dgh-* namespaced so it
   cannot collide with any not-yet-rebuilt page or the app's own .row/.stat/
   .chip). Mockup --dg-* tokens are mapped onto the app tokens the 4-block
   cascade above already redefines to dg OKLCH, so there is ONE color system.
   The render-fn id contract is preserved (legacy hero/.readiness-card kept
   as CSS-hidden stubs), so zero app.js render-logic changes. Scoped to
   #page-setup. 0 hardcoded hex · 0 em-dash · 0 emoji. -->
   ════════════════════════════════════════════════════════════════════════ */
#page-setup{--t-1:12px;--t0:14px;--t1:18px;--t2:23px;--t3:30px;--t4:42px;--dgh-ease:cubic-bezier(0.16,1,0.3,1);}
html[data-theme] body #page-setup{background:var(--bg);color:var(--text);}

/* visibility-guard: the render fns toggle [hidden] (renderNextBestMove,
   renderReadinessCardV2) and .is-hidden (renderDiagnosticSurface,
   renderSrReviewCard, renderWrongBankBtn, renderSetupDomainGrid,
   renderTodayPlan/Section). Scoped .dgh-* display rules out-specify the
   app's global .is-hidden / [hidden] base, so re-assert them with the same
   scope + !important or bands show when the render fn meant to hide them. */
#page-setup .dgh-band[hidden],#page-setup .dgh-band.is-hidden,#page-setup .dgh-opt.is-hidden,#page-setup .dgh-dom.is-hidden,#page-setup #hero-v2-cta[hidden],#page-setup #rc-v2-whatif[hidden],#page-setup #today-section.is-hidden,#page-setup #today-plan.is-hidden,#page-setup [hidden],#page-setup .is-hidden{display:none!important;}
/* renderNextBestMove injects an emoji into #hero-v2-cta-icon; dg = 0 emoji */
#page-setup #hero-v2-cta-icon{display:none;}

/* legacy dual-DOM stubs stay rendered-but-invisible (finish()/submitExam()/
   renderTodaySection still write them; do not display) */
#page-setup .hero,#page-setup #readiness-card,#page-setup #daily-goal-card,#page-setup #marathon-section,#page-setup #wrong-preset-tile,#page-setup #wrong-preset-sub,#page-setup #modes-ladder.modes-ladder>.modes-tier,#page-setup .modes-ladder .ed-section-head{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}

#page-setup .ch-wrap{max-width:1440px;margin:0 auto;padding:0 26px 90px;}
/* Visual band styling only — does NOT set display, so styles.css keeps full
   ownership of the [data-cert] gate (pass-proof shows in netplus, private
   in secplus; never both). The earlier blanket display:flex force-showed
   the secplus banner in netplus = redundant stacked chrome (editorial
   AI-tell). data-cert is on <html> (index.html:67). */
/* v3 reimagining — refined status pill (was a full-bleed bottom-ruled
   band). Visual only; the [data-cert] display gate below is preserved
   EXACTLY (pass-proof in netplus, private in secplus, never both). */
html[data-theme] body #page-setup .pass-proof-banner,html[data-theme] body #page-setup .secplus-private-banner{align-items:center;justify-content:flex-start;gap:11px;width:fit-content;max-width:100%;margin:22px auto 4px;padding:8px 16px 8px 12px;border:1px solid color-mix(in oklab,var(--accent) 22%,var(--border));border-bottom:1px solid color-mix(in oklab,var(--accent) 22%,var(--border));border-radius:999px;background:color-mix(in oklab,var(--accent) 6%,var(--surface));box-shadow:none;font-size:var(--t-1);color:var(--text-mid);text-align:left;}
/* scoped per cert so the gate holds (do NOT add a blanket display) */
#page-setup .pass-proof-banner{display:flex;}
html[data-cert="secplus"] body #page-setup .pass-proof-banner{display:none;}
html[data-cert="secplus"] body #page-setup .secplus-private-banner{display:flex;}
/* dg = 0 emoji: the ✓ / 🔒 dingbats are decorative (aria-hidden); the
   banner sentence carries the meaning. The SVG sits in an accent chip. */
#page-setup .pass-proof-icon,#page-setup .secplus-private-icon{display:grid!important;place-items:center;width:22px;height:22px;border-radius:50%;flex:none;background:var(--accent);}
#page-setup .pass-proof-icon svg,#page-setup .secplus-private-icon svg{color:var(--bg);width:13px;height:13px;}
html[data-theme] body #page-setup .pass-proof-text strong,html[data-theme] body #page-setup .secplus-private-text strong{color:var(--text);font-weight:700;}
html[data-theme] body #page-setup .pass-proof-text em,html[data-theme] body #page-setup .secplus-private-text em{font-style:normal;color:var(--accent);font-weight:600;}

/* ── codex-home 2-column grid (mockups/codex-home-concept.html) ────────────
   Mockup hex mapped onto the app OKLCH tokens so dark / light / cert all
   keep working. The render-output blocks below (tplan-* / dc-* / sd-* /
   setup-domain-grid dg-* / custom-quiz interior / banners / legacy clips /
   visibility guards) are RETAINED untouched. */
#page-setup .home-grid{display:grid;grid-template-columns:minmax(0,1fr) 372px;gap:22px;align-items:start;padding:26px 0 10px;}
#page-setup .col-main{display:flex;flex-direction:column;gap:16px;min-width:0;}
#page-setup .col-side{display:flex;flex-direction:column;gap:14px;min-width:0;}

/* hero — v3 editorial voice (Fraunces display) */
#page-setup .ch-hero{padding:6px 0 4px;}
#page-setup .hero-date{display:flex;align-items:center;gap:11px;font-size:11px;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;color:var(--accent);margin-bottom:16px;}
#page-setup .hero-date::after{content:"";height:1px;flex:1;max-width:120px;background:linear-gradient(90deg,var(--accent),transparent);}
html[data-theme] body #page-setup h1.hero-greet{font-family:'Fraunces',Georgia,serif;font-size:clamp(34px,5vw,58px);font-weight:600;letter-spacing:-0.025em;line-height:1.0;margin:0;color:var(--text);}
#page-setup h1.hero-greet .name,#page-setup h1.hero-greet i{font-style:normal;color:var(--accent);}
#page-setup .hero-body{font-size:clamp(15px,1.25vw,17px);color:var(--text-mid);max-width:46ch;line-height:1.6;margin:20px 0 0;}
#page-setup .hero-body a,#page-setup .hero-body strong{color:var(--text);text-decoration:none;font-weight:700;border-bottom:2px solid color-mix(in oklab,var(--accent) 40%,transparent);}

/* shared card primitive */
html[data-theme] body #page-setup .card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:20px 22px;box-shadow:none;backdrop-filter:none;}
#page-setup .card-eyebrow{font-size:10px;font-weight:800;letter-spacing:0.14em;text-transform:uppercase;color:var(--text-dim);margin-bottom:9px;}
#page-setup .card-eyebrow .tag{display:inline-block;padding:1px 6px;border-radius:4px;font-size:9px;font-weight:800;letter-spacing:0.05em;}
#page-setup .card-eyebrow .tag-new{background:var(--accent);color:var(--bg);}
html[data-theme] body #page-setup .card-title{font-family:'Fraunces',Georgia,serif;font-size:var(--t1);font-weight:600;letter-spacing:-0.01em;line-height:1.2;color:var(--text);}
#page-setup .card-desc{font-size:var(--t-1);color:var(--text-dim);margin-top:6px;line-height:1.55;}

/* stat row — v3: ONE de-carded divided strip (dashboards anti-slop:
   no repeated metric-card spam) */
#page-setup .stat-row{display:flex;gap:0;border:1px solid var(--border);border-radius:14px;overflow:hidden;background:var(--surface);}
html[data-theme] body #page-setup .stat-card{flex:1;display:block;align-items:initial;gap:0;padding:16px 20px;background:none;border:0;border-radius:0;box-shadow:none;}
html[data-theme] body #page-setup .stat-card+.stat-card{border-left:1px solid var(--border);}
#page-setup .stat-info{flex:1;min-width:0;}
#page-setup .stat-label{font-size:10.5px;font-weight:800;letter-spacing:0.13em;text-transform:uppercase;color:var(--text-dim);}
#page-setup .stat-big{font-family:'Fraunces',Georgia,serif;font-size:26px;font-weight:600;color:var(--text);line-height:1.1;margin-top:7px;letter-spacing:-0.01em;font-variant-numeric:tabular-nums;}
#page-setup .stat-big .mini-sub{font-family:Inter,-apple-system,sans-serif;font-size:13px;font-weight:600;color:var(--text-dim);}
#page-setup .stat-sub{font-size:11.5px;color:var(--text-dim);margin-top:5px;}

/* drill chips (renderReadinessCardV2 fills #rc-v2-whatif-row) */
#page-setup .drill-section{padding:2px 0;}
#page-setup .drill-header{font-size:10px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-dim);margin-bottom:9px;}
#page-setup .drill-chips,#page-setup #rc-v2-whatif-row{display:flex;flex-wrap:wrap;gap:8px;}
html[data-theme] body #page-setup #rc-v2-whatif-row .rc-v2-whatif-chip,html[data-theme] body #page-setup #rc-v2-whatif-row button{display:inline-flex;align-items:center;gap:7px;background:none;border:1px solid color-mix(in oklab,var(--accent) 36%,transparent);color:var(--accent);border-radius:999px;padding:7px 14px;font-size:11px;font-weight:600;cursor:pointer;box-shadow:none;}
html[data-theme] body #page-setup #rc-v2-whatif-row button:hover{background:color-mix(in oklab,var(--accent) 9%,transparent);}

/* diagnostic card */
html[data-theme] body #page-setup .diag-card{border:1px dashed color-mix(in oklab,var(--accent) 34%,var(--border));background:color-mix(in oklab,var(--accent) 4%,transparent);}
#page-setup .diag-skip{display:inline-block;margin-top:11px;font-size:12px;color:var(--text-dim);text-decoration:none;cursor:pointer;}
#page-setup .diag-stats{display:flex;gap:28px;margin-top:16px;}
#page-setup .diag-stat{text-align:left;}
#page-setup .diag-stat-num{font-family:'Fraunces',Georgia,serif;font-size:var(--t2);font-weight:600;color:var(--accent);line-height:1;letter-spacing:-0.01em;font-variant-numeric:tabular-nums;}
#page-setup .diag-stat-label{font-size:10.5px;font-weight:700;letter-spacing:0.09em;text-transform:uppercase;color:var(--text-dim);margin-top:4px;}

/* buttons: primary / white-on-accent / ghost */
html[data-theme] body #page-setup .btn-primary{display:inline-flex;align-items:center;gap:8px;margin-top:14px;background:var(--accent);color:var(--bg);border:0;border-radius:11px;font:800 var(--t0)/1 Inter,-apple-system,sans-serif;padding:13px 22px;cursor:pointer;text-decoration:none;box-shadow:none;}
html[data-theme] body #page-setup .btn-primary:hover{filter:brightness(1.06);box-shadow:none;}
html[data-theme] body #page-setup .btn-white{display:inline-flex;align-items:center;gap:7px;background:var(--bg);color:var(--accent);border:0;border-radius:11px;font:800 var(--t-1)/1 Inter,-apple-system,sans-serif;padding:12px 20px;cursor:pointer;white-space:nowrap;box-shadow:none;}
html[data-theme] body #page-setup .btn-white:hover{filter:brightness(1.04);}
html[data-theme] body #page-setup .btn-ghost{display:inline-flex;align-items:center;gap:7px;background:none;color:var(--accent);border:1px solid color-mix(in oklab,var(--accent) 30%,var(--border));border-radius:10px;font:650 var(--t-1)/1 Inter,-apple-system,sans-serif;padding:10px 16px;cursor:pointer;white-space:nowrap;box-shadow:none;}
html[data-theme] body #page-setup .btn-ghost:hover{border-color:var(--accent);background:color-mix(in oklab,var(--accent) 8%,transparent);color:var(--accent);}
/* emil-design-eng — buttons must feel responsive (press feedback). The
   transition for transform is already declared in the micro-interactions
   block; reduced-motion there neutralises it. */
html[data-theme] body #page-setup .btn-primary:active,html[data-theme] body #page-setup .btn-white:active,html[data-theme] body #page-setup .btn-ghost:active{transform:scale(0.97);}

/* today's plan as a card (renderTodayPlan emits .tplan-* inside; the
   retained #today-plan flat-band rule below is beaten by .plan-card) */
html[data-theme] body #page-setup #today-plan.plan-card{display:block;background:var(--surface);border:1px solid var(--border);border-bottom:1px solid var(--border);border-radius:12px;padding:18px 20px;margin:0;}

/* readiness card */
/* v3 reimagining — the readiness INSTRUMENT (dashboards hero data-viz).
   Bespoke over the generic .card (later source order beats .card at
   equal specificity). The bar-fill width transition is the data reveal
   (kept); the count-up stays JS-owned by renderReadinessCardV2. */
html[data-theme] body #page-setup .readiness-card{position:relative;overflow:hidden;background:linear-gradient(180deg,var(--surface),color-mix(in oklab,var(--surface) 84%,var(--bg)));border:1px solid color-mix(in oklab,var(--accent) 26%,var(--border));border-radius:20px;padding:24px 24px 26px;box-shadow:none;}
#page-setup .readiness-card::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 80% at 100% 0%,color-mix(in oklab,var(--accent) 9%,transparent),transparent 60%);pointer-events:none;}
#page-setup .readiness-eyebrow{position:relative;font-size:10.5px;font-weight:800;letter-spacing:0.14em;text-transform:uppercase;color:var(--accent);margin-bottom:14px;}
/* v5.5.10 — hero treatment (founder: "like a hero shot, big and in my
   face"; picked candidate A at 140px max). Score becomes the poster-number
   protagonist on its own line; the inline sibling span is demoted to a
   small uppercase caption directly below (the index.html text content was
   tweaked " / 900" → "out of 900" for clean caption read). */
#page-setup .readiness-score{position:relative;display:flex;flex-direction:column;align-items:baseline;gap:0;font-variant-numeric:tabular-nums;}
html[data-theme] body #page-setup .readiness-score #rc-v2-num{display:block;font-family:'Fraunces',Georgia,serif;font-weight:600;font-size:clamp(94px,11.5vw,140px);line-height:1;letter-spacing:-0.03em;color:var(--text);font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"lnum","tnum";}
html[data-theme] body #page-setup .readiness-score span:not(#rc-v2-num){display:block;margin-top:14px;font-family:Inter,-apple-system,sans-serif;font-weight:600;font-size:13.5px;line-height:1;letter-spacing:0.08em;text-transform:uppercase;color:var(--text-dim);}
#page-setup .readiness-tier{position:relative;display:inline-flex;align-items:center;gap:7px;font-size:10.5px;font-weight:800;letter-spacing:0.07em;text-transform:uppercase;color:var(--accent);background:color-mix(in oklab,var(--accent) 12%,transparent);border:1px solid color-mix(in oklab,var(--accent) 26%,transparent);padding:5px 11px;border-radius:7px;margin:12px 0 0;}
#page-setup .readiness-prob{position:relative;font-size:13px;color:var(--text-mid);margin:12px 0 0;line-height:1.5;font-variant-numeric:tabular-nums;}
#page-setup .readiness-prob b,#page-setup .readiness-prob strong{color:var(--text);font-weight:700;}
#page-setup .readiness-bar-track{position:relative;height:12px;border-radius:99px;background:color-mix(in oklab,var(--text) 12%,transparent);overflow:visible;margin-top:34px;}
#page-setup .readiness-bar-fill{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--accent),color-mix(in oklab,var(--accent) 64%,var(--yellow)));width:0;transition:width 1.1s var(--dgh-ease);}
#page-setup .readiness-bar-mark{position:absolute;top:-7px;bottom:-7px;height:auto;width:2px;background:var(--text-mid);border-radius:1px;}
#page-setup .readiness-bar-mark::after{content:"PASS 720";position:absolute;top:-17px;left:50%;transform:translateX(-50%);font:800 8px/1 Inter,-apple-system,sans-serif;letter-spacing:0.09em;color:var(--text-mid);white-space:nowrap;}
#page-setup .readiness-range{display:flex;justify-content:space-between;align-items:baseline;margin-top:24px;padding-top:14px;border-top:1px solid var(--border);font-size:12px;color:var(--text-dim);font-variant-numeric:tabular-nums;}
#page-setup .readiness-range #rc-v2-delta{font-weight:650;color:var(--text-mid);}
#page-setup .readiness-range b{color:var(--text);font-weight:700;}
#page-setup .readiness-traj{position:relative;margin-top:12px;font-size:12px;color:var(--text-dim);line-height:1.5;}

/* next best move (accent-filled card) */
/* v3 reimagining — Next Best Move = the one focal action card */
html[data-theme] body #page-setup .nbm-card{position:relative;overflow:hidden;background:linear-gradient(150deg,var(--accent),color-mix(in oklab,var(--accent) 76%,black));border:0;border-color:transparent;border-radius:20px;box-shadow:0 20px 44px -22px color-mix(in oklab,var(--accent) 60%,transparent);}
#page-setup .nbm-card::before{content:"";position:absolute;right:-30px;top:-30px;width:160px;height:160px;border-radius:50%;background:color-mix(in oklab,var(--bg) 16%,transparent);pointer-events:none;}
#page-setup .nbm-card .card-eyebrow{position:relative;display:flex;align-items:center;gap:8px;color:color-mix(in oklab,var(--bg) 72%,transparent);}
#page-setup .nbm-card .card-eyebrow span{display:grid;place-items:center;width:18px;height:18px;}
#page-setup .nbm-card .card-eyebrow span svg{width:14px;height:14px;}
html[data-theme] body #page-setup .nbm-card .card-title{position:relative;color:var(--bg);}
#page-setup .nbm-card .card-desc{position:relative;color:color-mix(in oklab,var(--bg) 82%,transparent);}
#page-setup .nbm-header{position:relative;display:flex;align-items:flex-end;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-top:6px;}

/* spaced-rep + daily-challenge cards */
#page-setup .sr-header,#page-setup .challenge-header{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;}
#page-setup .sr-meta{font-size:11.5px;color:var(--accent);font-weight:600;margin-top:8px;}
html[data-theme] body #page-setup #daily-challenge-card.challenge-card{background:color-mix(in oklab,var(--accent) 7%,transparent);border:1px solid color-mix(in oklab,var(--accent) 16%,transparent);border-radius:12px;padding:18px 20px;display:flex;align-items:flex-start;justify-content:space-between;gap:18px;flex-wrap:wrap;margin:0;}

/* domain section header (the grid uses the retained #setup-domain-grid rules) */
#page-setup .domain-section{padding:8px 0 2px;}
#page-setup .domain-header{display:flex;align-items:baseline;gap:11px;margin-bottom:4px;flex-wrap:wrap;}
html[data-theme] body #page-setup .domain-header h3{font-size:var(--t1);font-weight:800;letter-spacing:-0.01em;color:var(--text);text-transform:none;}
#page-setup .domain-header .desc{font-size:12px;color:var(--text-dim);}

/* compact custom-quiz row */
#page-setup .custom-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 18px;background:var(--surface);border:1px solid var(--border);border-radius:12px;font-size:var(--t-1);color:var(--text-dim);}
#page-setup .custom-label{color:var(--text-mid);}
#page-setup .custom-label b{color:var(--text);font-weight:700;}
html[data-theme] body #page-setup .custom-config{background:none;border:0;color:var(--accent);font-weight:700;font-size:var(--t-1);cursor:pointer;white-space:nowrap;}

/* session picker re-housed as a sidebar card; wide grids collapse to fit */
html[data-theme] body #page-setup .col-side .dgh-sess{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:18px 18px 8px;margin:0;}
#page-setup .col-side .dgh-sec-k{font-size:10px;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:var(--text-dim);}
html[data-theme] body #page-setup .col-side .dgh-sec-t{font-size:var(--t1);font-weight:800;letter-spacing:-0.01em;margin:6px 0 3px;color:var(--text);}
#page-setup .col-side .dgh-sess>.dgh-sub{max-width:none;font-size:12px;}
#page-setup .col-side .dgh-grp{margin-top:18px;}
#page-setup .col-side .dgh-opts{grid-template-columns:1fr;}
html[data-theme] body #page-setup .col-side .dgh-opt{border-right:0;padding:13px 0;}
html[data-theme] body #page-setup .col-side .dgh-opt:hover{padding-left:8px;}
#page-setup .col-side .dgh-dbd{grid-template-columns:1fr 1fr;}
html[data-theme] body #page-setup .col-side .dgh-db{border-right:0;}
html[data-theme] body #page-setup .col-side .dgh-opt[aria-hidden="true"]{display:none;}

/* reveal animation */
#page-setup .reveal{opacity:0;transform:translateY(15px);transition:opacity .55s var(--dgh-ease),transform .55s var(--dgh-ease);}
#page-setup .reveal.visible{opacity:1;transform:none;}

/* ── full-width domain matrix (taste-skill · dashboards: a wide 5-domain
   data table needs room; trapped in .col-main its cells clipped). The
   squash root cause: default 1fr == minmax(auto,1fr) → the auto MIN is
   max-content, so long domain names ("Network Troubleshooting") force
   overflow + clip. minmax(0,1fr) lets every column shrink so text wraps. */
#page-setup .home-domain{margin-top:6px;}
#page-setup #setup-domain-grid.dgh-dom-grid{grid-template-columns:repeat(5,minmax(0,1fr));}
#page-setup #setup-domain-grid .domain-cell{overflow:visible;min-width:0;}
html[data-theme] body #page-setup #setup-domain-grid .domain-cell{padding:20px 14px;}
html[data-theme] body #page-setup #setup-domain-grid .dg-name{white-space:normal;overflow-wrap:break-word;word-break:normal;hyphens:none;}
#page-setup #setup-domain-grid .dg-topic{white-space:normal;overflow-wrap:break-word;word-break:normal;}
@media (max-width:900px){#page-setup #setup-domain-grid.dgh-dom-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:560px){#page-setup #setup-domain-grid.dgh-dom-grid{grid-template-columns:1fr;}}

/* ── micro-interactions (taste-skill · dashboards: purposeful + restrained
   — clickable surfaces lift, the domain column you scan highlights, buttons
   give press feedback. No glow, no decorative motion without a data role). */
#page-setup .card,#page-setup .stat-card,#page-setup .custom-row{transition:transform .22s var(--dgh-ease),box-shadow .22s var(--dgh-ease),border-color .22s var(--dgh-ease);}
html[data-theme] body #page-setup .card:hover,html[data-theme] body #page-setup .stat-card:hover,html[data-theme] body #page-setup .custom-row:hover{transform:translateY(-2px);border-color:color-mix(in oklab,var(--accent) 34%,var(--border));box-shadow:0 6px 20px color-mix(in oklab,var(--text) 8%,transparent);}
html[data-theme] body #page-setup .nbm-card:hover{border-color:var(--accent);box-shadow:0 8px 24px color-mix(in oklab,var(--accent) 30%,transparent);}
#page-setup .btn-primary,#page-setup .btn-white,#page-setup .btn-ghost,#page-setup .custom-config,#page-setup .diag-skip{transition:transform .16s var(--dgh-ease),filter .16s var(--dgh-ease),box-shadow .2s var(--dgh-ease),background .16s var(--dgh-ease),color .16s var(--dgh-ease),border-color .16s var(--dgh-ease);}
html[data-theme] body #page-setup .btn-primary:hover{transform:translateY(-1px);box-shadow:0 5px 16px color-mix(in oklab,var(--accent) 38%,transparent);}
html[data-theme] body #page-setup .btn-primary:active,html[data-theme] body #page-setup .btn-white:active,html[data-theme] body #page-setup .btn-ghost:active{transform:translateY(0) scale(.985);}
#page-setup .custom-config{display:inline-block;transform-origin:right center;}
html[data-theme] body #page-setup .custom-config:hover{transform:translateX(3px);}
html[data-theme] body #page-setup .diag-skip:hover{color:var(--text-mid);}
#page-setup #setup-domain-grid .domain-cell{transition:background .2s var(--dgh-ease);}
html[data-theme] body #page-setup #setup-domain-grid .domain-cell:hover{background:color-mix(in oklab,var(--accent) 6%,transparent);}
#page-setup #rc-v2-whatif-row button{transition:background .18s var(--dgh-ease),border-color .18s var(--dgh-ease),transform .18s var(--dgh-ease);}
html[data-theme] body #page-setup #rc-v2-whatif-row button:hover{transform:translateY(-1px);border-color:var(--accent);}
#page-setup .col-side .dgh-opt .on,#page-setup .col-side .dgh-opt .od{transition:color .16s var(--dgh-ease);}
html[data-theme] body #page-setup .col-side .dgh-opt:hover .on{color:var(--accent);}
html[data-theme] body #page-setup .col-side .dgh-db{transition:background .18s var(--dgh-ease),padding-left .14s var(--dgh-ease);}
html[data-theme] body #page-setup .col-side .dgh-db:hover{background:color-mix(in oklab,var(--accent) 6%,transparent);}

/* responsive: collapse to one column, side rail flows under main */
@media (max-width:1040px){#page-setup .home-grid{grid-template-columns:minmax(0,1fr);}#page-setup .col-side{order:2;}}
@media (max-width:560px){#page-setup .stat-row{grid-template-columns:1fr;}#page-setup .diag-stats{gap:18px;}}

/* reduced-motion: neutralise every transform / transition / sweep added above */
@media (prefers-reduced-motion:reduce){
  #page-setup .reveal{opacity:1;transform:none;transition:none;}
  #page-setup .readiness-bar-fill{transition:none;}
  #page-setup .card,#page-setup .stat-card,#page-setup .custom-row,#page-setup .btn-primary,#page-setup .btn-white,#page-setup .btn-ghost,#page-setup .custom-config,#page-setup .diag-skip,#page-setup #setup-domain-grid .domain-cell,#page-setup #rc-v2-whatif-row button,#page-setup .col-side .dgh-opt .on,#page-setup .col-side .dgh-db{transition:none!important;}
  html[data-theme] body #page-setup .card:hover,html[data-theme] body #page-setup .stat-card:hover,html[data-theme] body #page-setup .custom-row:hover,html[data-theme] body #page-setup .nbm-card:hover,html[data-theme] body #page-setup .btn-primary:hover,html[data-theme] body #page-setup .btn-primary:active,html[data-theme] body #page-setup .btn-white:active,html[data-theme] body #page-setup .btn-ghost:active,html[data-theme] body #page-setup .custom-config:hover,html[data-theme] body #page-setup #rc-v2-whatif-row button:hover{transform:none!important;box-shadow:none!important;}
}

#page-setup .dgh-sess,#page-setup .dgh-dom{padding:30px 0 8px;}
#page-setup .dgh-sec-k{font-size:10px;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;color:var(--text-dim);}
html[data-theme] body #page-setup .dgh-sec-t{font-size:var(--t2);font-weight:800;letter-spacing:-0.02em;margin:7px 0 3px;color:var(--text);}
#page-setup .dgh-sec-t i,#page-setup .dgh-sec-t em{font-style:normal;color:var(--accent);}
#page-setup .dgh-sess>.dgh-sub{max-width:560px;}
#page-setup .dgh-grp{margin-top:26px;}
#page-setup .dgh-grp-h{display:flex;align-items:baseline;gap:12px;padding-bottom:10px;border-bottom:1px solid var(--border);}
#page-setup .dgh-grp-h .t{font-size:10px;font-weight:800;letter-spacing:0.13em;text-transform:uppercase;color:var(--text-mid);}
#page-setup .dgh-grp-h .d{font-size:11px;color:var(--text-dim);}
#page-setup .dgh-opts{display:grid;grid-template-columns:repeat(3,1fr);gap:0;}
html[data-theme] body #page-setup .dgh-opt{text-align:left;background:none;border:0;border-right:1px solid var(--dg-rule-soft);border-bottom:1px solid var(--dg-rule-soft);border-radius:0;padding:18px 20px 18px 0;cursor:pointer;transition:padding-left 0.14s var(--dgh-ease);box-shadow:none;}
#page-setup .dgh-opt:hover{padding-left:10px;}
#page-setup .dgh-opt:nth-child(3n){border-right:0;}
#page-setup .dgh-opt .on{display:block;font-size:var(--t0);font-weight:800;letter-spacing:-0.01em;color:var(--text);}
#page-setup .dgh-opt.exam .on{color:var(--text);}
#page-setup .dgh-opt .od{display:block;font-size:11px;color:var(--text-dim);margin-top:5px;line-height:1.5;}
#page-setup .dgh-dbd{display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin-top:2px;}
html[data-theme] body #page-setup .dgh-db{text-align:left;background:none;border:0;border-right:1px solid var(--dg-rule-soft);border-radius:0;padding:16px 16px 16px 0;cursor:pointer;transition:padding-left 0.14s var(--dgh-ease);box-shadow:none;}
#page-setup .dgh-db:hover{padding-left:8px;}
#page-setup .dgh-db:last-child{border-right:0;}
#page-setup .dgh-db .dbk{font-size:11px;font-weight:800;color:var(--accent);font-variant-numeric:tabular-nums;}
#page-setup .dgh-db .dbn{display:block;font-size:var(--t-1);font-weight:700;margin-top:5px;letter-spacing:-0.01em;color:var(--text);}
#page-setup .dgh-db .dbm{display:block;font-size:10px;color:var(--text-dim);margin-top:4px;}
#page-setup .dgh-strict{display:flex;align-items:center;gap:11px;margin-top:18px;padding:14px 0;border-top:1px solid var(--dg-rule-soft);font-size:var(--t-1);color:var(--text-dim);cursor:pointer;}
#page-setup .dgh-strict input{position:absolute;opacity:0;width:0;height:0;}
#page-setup .dgh-strict .box{width:15px;height:15px;border:1px solid var(--border);border-radius:4px;flex:none;transition:background 0.12s,border-color 0.12s;}
#page-setup .dgh-strict input:checked~.box{background:var(--accent);border-color:var(--accent);}
#page-setup .dgh-strict b{color:var(--text-mid);font-weight:700;}

/* ════════════════════════════════════════════════════════════════════════
   v5.5.3 · SECTION 3 RESHUFFLE — "Pick your session" pulled out of the
   372px .col-side rail into a FULL-WIDTH HORIZONTAL board (founder ask:
   "horizontal not vertical"). Scoped under #page-setup #modes-ladder so
   the id-pair specificity (2,1,0) beats the base html[data-theme] body
   #page-setup .dgh-* rules above without !important. The three commitment
   tiers read left→right as an effort ladder; Drill-by-domain a 5-up
   strip; Strict + Custom Quiz a footer bar. Locked bronze + Fraunces +
   emil motion (hover gated to fine pointers, :active press, reduced-
   motion neutralised; entrance rides the page's existing .reveal IIFE).
════════════════════════════════════════════════════════════════════════ */
html[data-theme] body #page-setup #modes-ladder{display:block;background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:clamp(22px,2.6vw,30px);margin:0 0 18px;box-shadow:none;}
#page-setup #modes-ladder .dgh-sess-head{display:flex;align-items:baseline;justify-content:space-between;gap:18px;flex-wrap:wrap;padding-bottom:18px;border-bottom:1px solid var(--border);}
#page-setup #modes-ladder .dgh-sec-k{font-size:10px;font-weight:800;letter-spacing:0.16em;text-transform:uppercase;color:var(--text-dim);}
html[data-theme] body #page-setup #modes-ladder .dgh-sec-t{font-family:'Fraunces',Georgia,serif;font-size:var(--t2);font-weight:600;letter-spacing:-0.02em;margin:6px 0 0;color:var(--text);}
#page-setup #modes-ladder .dgh-sec-t i,#page-setup #modes-ladder .dgh-sec-t em{font-style:normal;color:var(--accent);}
#page-setup #modes-ladder>.dgh-sess-head>.dgh-sub{max-width:42ch;font-size:12.5px;color:var(--text-dim);margin:0;}
#page-setup #modes-ladder .dgh-board{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:22px;}
#page-setup #modes-ladder .dgh-grp{margin:0;padding:0 26px;border-right:1px solid var(--dg-rule-soft);}
#page-setup #modes-ladder .dgh-grp:first-child{padding-left:0;}
#page-setup #modes-ladder .dgh-grp:last-child{padding-right:0;border-right:0;}
#page-setup #modes-ladder .dgh-grp-h{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding-bottom:13px;border-bottom:1px solid var(--border);margin-bottom:6px;}
#page-setup #modes-ladder .dgh-grp-h .t{font-size:10.5px;font-weight:800;letter-spacing:0.13em;text-transform:uppercase;color:var(--accent);}
#page-setup #modes-ladder .dgh-grp-h .d{font-size:11px;color:var(--text-dim);}
#page-setup #modes-ladder .dgh-opts{display:flex;flex-direction:column;gap:0;}
html[data-theme] body #page-setup #modes-ladder .dgh-opt{display:flex;flex-direction:column;gap:3px;text-align:left;background:none;border:0;border-bottom:1px solid var(--dg-rule-soft);border-radius:8px;padding:14px 12px;cursor:pointer;box-shadow:none;transition:background .16s var(--dgh-ease),padding-left .16s var(--dgh-ease);}
#page-setup #modes-ladder .dgh-opt:last-of-type{border-bottom:0;}
#page-setup #modes-ladder .dgh-opt[aria-hidden="true"]{display:none;}
#page-setup #modes-ladder .dgh-opt .on{display:block;font-size:var(--t0);font-weight:700;letter-spacing:-0.01em;color:var(--text);transition:color .16s var(--dgh-ease);}
#page-setup #modes-ladder .dgh-opt .od{display:block;font-size:11.5px;color:var(--text-dim);line-height:1.45;}
#page-setup #modes-ladder .dgh-opt.exam .on{color:var(--accent);}
@media (hover:hover) and (pointer:fine){
  html[data-theme] body #page-setup #modes-ladder .dgh-opt:hover{background:color-mix(in oklab,var(--accent) 8%,transparent);padding-left:18px;}
  html[data-theme] body #page-setup #modes-ladder .dgh-opt:hover .on{color:var(--accent);}
}
#page-setup #modes-ladder .dgh-opt:active{transform:scale(0.985);}
#page-setup #modes-ladder .dgh-dbd-wrap{margin-top:22px;padding-top:20px;border-top:1px solid var(--border);}
#page-setup #modes-ladder .dgh-grp-h.dbd-h{flex-direction:row;align-items:baseline;gap:12px;border:0;padding:0;margin-bottom:14px;}
#page-setup #modes-ladder .dgh-dbd{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:0;}
html[data-theme] body #page-setup #modes-ladder .dgh-db{display:flex;flex-direction:column;gap:5px;text-align:left;background:var(--surface-2,color-mix(in oklab,var(--text) 4%,var(--surface)));border:1px solid var(--border);border-right:1px solid var(--border);border-radius:12px;padding:14px 15px;cursor:pointer;box-shadow:none;transition:background .16s var(--dgh-ease),border-color .16s var(--dgh-ease),transform .16s var(--dgh-ease);}
@media (hover:hover) and (pointer:fine){
  html[data-theme] body #page-setup #modes-ladder .dgh-db:hover{border-color:color-mix(in oklab,var(--accent) 40%,var(--border));background:color-mix(in oklab,var(--accent) 6%,transparent);transform:translateY(-2px);padding-left:15px;}
}
#page-setup #modes-ladder .dgh-db:active{transform:scale(0.98);}
#page-setup #modes-ladder .dgh-db .dbk{display:block;font-size:10px;font-weight:800;letter-spacing:0.07em;text-transform:uppercase;color:var(--accent);font-variant-numeric:tabular-nums;margin:0;}
#page-setup #modes-ladder .dgh-db .dbn{display:block;font-size:12.5px;font-weight:700;letter-spacing:-0.01em;color:var(--text);margin:0;line-height:1.3;}
#page-setup #modes-ladder .dgh-db .dbm{display:block;font-size:10.5px;color:var(--text-dim);margin:0;}
#page-setup #modes-ladder .dgh-foot{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-top:22px;padding-top:18px;border-top:1px solid var(--border);}
#page-setup #modes-ladder .dgh-strict{display:inline-flex;align-items:center;gap:10px;margin:0;padding:0;border:0;font-size:12px;color:var(--text-mid);cursor:pointer;}
#page-setup #modes-ladder .dgh-strict .box{width:18px;height:18px;border-radius:5px;}
#page-setup #modes-ladder .dgh-strict b{color:var(--text);font-weight:700;}
html[data-theme] body #page-setup #modes-ladder .dgh-foot .custom-row{display:inline-flex;align-items:center;gap:12px;background:none;border:0;border-radius:0;padding:0;}
#page-setup #modes-ladder .dgh-foot .custom-label{font-size:12.5px;color:var(--text-dim);}
#page-setup #modes-ladder .dgh-foot .custom-config{font-size:12.5px;font-weight:700;color:var(--accent);background:none;border:0;cursor:pointer;}
@media (max-width:900px){
  #page-setup #modes-ladder .dgh-board{grid-template-columns:1fr;gap:0;}
  #page-setup #modes-ladder .dgh-grp{padding:0 0 18px;border-right:0;border-bottom:1px solid var(--dg-rule-soft);margin-bottom:18px;}
  #page-setup #modes-ladder .dgh-grp:last-child{border-bottom:0;padding-bottom:0;margin-bottom:0;}
  #page-setup #modes-ladder .dgh-dbd{grid-template-columns:repeat(2,1fr);}
}
@media (prefers-reduced-motion:reduce){
  #page-setup #modes-ladder .dgh-opt,#page-setup #modes-ladder .dgh-db,#page-setup #modes-ladder .dgh-opt .on{transition:none!important;transform:none!important;}
}

#page-setup .dgh-plan-h{display:flex;align-items:baseline;gap:13px;flex-wrap:wrap;margin-bottom:5px;}
#page-setup .dgh-chips{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 14px;}
html[data-theme] body #page-setup .dgh-chips .chip{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border);border-radius:999px;padding:9px 15px;font-size:var(--t-1);font-weight:600;color:var(--text-mid);cursor:pointer;background:none;box-shadow:none;}
html[data-theme] body #page-setup .dgh-chips .chip:hover{border-color:var(--accent);color:var(--accent);}

/* ── Today's Plan · Daily Challenge · Streak Defender ──────────────────
   These 3 are painted by innerHTML render fns (renderTodayPlan /
   renderDailyChallengeCard / renderStreakDefender) that emit clean
   semantic classes; the purple gradient + glass card + ::before quote
   glyph + emoji all come from styles.css / emoji literals. COMPLETE
   high-specificity (#page-setup #id) override -> editorial band. Zero
   app.js change; every onclick (startSession/focusTopic/openWeakSpotBridge/
   startDailyChallenge/startStreakSave) preserved. The earlier failure was
   an INCOMPLETE override, not the approach. */
/* #today-section is a styles.css card wrapper (surface bg + border +
   radius + padding) around the conditional cards; flatten to a plain
   container so its children read as editorial bands, not a boxed group. */
html[data-theme] body #page-setup #today-section{background:none;border:0;border-radius:0;box-shadow:none;padding:0;margin:0;gap:0;display:block;}
html[data-theme] body #page-setup #today-plan,
html[data-theme] body #page-setup #daily-challenge-card,
html[data-theme] body #page-setup #streak-defender{
  background:none;color:var(--text);border:0;border-bottom:1px solid var(--border);
  border-radius:0;box-shadow:none;backdrop-filter:none;overflow:visible;
  padding:26px 0;margin:0;display:block;}
#page-setup #today-plan::before,#page-setup #streak-defender::before,#page-setup #daily-challenge-card::before{content:none!important;display:none!important;}

/* Today's Plan */
#page-setup #today-plan .tplan-eyebrow{margin:0 0 6px;color:var(--accent);font-size:var(--t-1);font-weight:700;letter-spacing:0.14em;text-transform:uppercase;}
#page-setup #today-plan .tplan-headline{margin:0 0 6px;color:var(--text);font-size:var(--t2);font-weight:800;letter-spacing:-0.02em;line-height:1.2;}
#page-setup #today-plan .tplan-headline em{font-style:normal;color:var(--accent);}
#page-setup #today-plan .tplan-sub{margin:0 0 16px;color:var(--text-dim);font-size:var(--t-1);line-height:1.6;max-width:620px;}
#page-setup #today-plan .tplan-chips,#page-setup #today-plan .tplan-bridges{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px;}
html[data-theme] body #page-setup #today-plan .tplan-chip,html[data-theme] body #page-setup #today-plan .tplan-bridge-btn{display:inline-flex;align-items:center;gap:8px;background:none;border:1px solid var(--border);border-left-width:1px;border-radius:999px;color:var(--text-mid);font-weight:600;font-size:var(--t-1);padding:9px 15px;box-shadow:none;cursor:pointer;}
html[data-theme] body #page-setup #today-plan .tplan-chip:hover,html[data-theme] body #page-setup #today-plan .tplan-bridge-btn:hover{border-color:var(--accent);color:var(--accent);background:none;transform:none;}
#page-setup #today-plan .tplan-chip[data-signal]{border-left-color:var(--border);}
#page-setup #today-plan .tplan-chip::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--text-dim);flex:none;}
#page-setup #today-plan .tplan-chip[data-signal="weak"]::before{background:var(--accent);}
#page-setup #today-plan .tplan-chip[data-signal="stale"]::before{background:var(--yellow);}
#page-setup #today-plan .tplan-chip-icon,#page-setup #today-plan .tplan-bridge-icon{display:none;}
#page-setup #today-plan .tplan-chip-arrow,#page-setup #today-plan .tplan-bridge-arrow{color:var(--text-dim);}
#page-setup #today-plan .tplan-foot{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:0;padding-top:14px;border-top:1px solid var(--border);}
#page-setup #today-plan .tplan-foot-meta{flex:1;min-width:160px;color:var(--text-dim);font-size:10px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;}
html[data-theme] body #page-setup #today-plan .tplan-cta,
html[data-theme] body #page-setup #daily-challenge-card .dc-btn,
html[data-theme] body #page-setup #streak-defender .sd-btn{background:var(--accent);color:var(--bg);border:0;border-radius:9px;padding:13px 20px;font:800 var(--t0)/1 Inter,-apple-system,sans-serif;cursor:pointer;white-space:nowrap;box-shadow:none;flex:none;}
html[data-theme] body #page-setup #today-plan .tplan-cta:hover,
html[data-theme] body #page-setup #daily-challenge-card .dc-btn:hover,
html[data-theme] body #page-setup #streak-defender .sd-btn:hover{filter:brightness(1.05);transform:none;box-shadow:none;}

/* Daily Challenge + Streak Defender share the band layout */
#page-setup #daily-challenge-card,#page-setup #streak-defender{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;flex-wrap:wrap;}
#page-setup #daily-challenge-card .dc-icon,#page-setup #streak-defender .sd-icon{display:none;}
#page-setup #daily-challenge-card .dc-body,#page-setup #streak-defender .sd-body{flex:1;min-width:260px;}
#page-setup #daily-challenge-card .dc-title{margin:0 0 8px;color:var(--accent);font-size:10px;font-weight:800;letter-spacing:0.14em;text-transform:uppercase;}
#page-setup #streak-defender .sd-title{margin:0 0 5px;color:var(--text);font-size:var(--t1);font-weight:800;letter-spacing:-0.01em;}
#page-setup #daily-challenge-card .dc-sub,#page-setup #streak-defender .sd-sub{color:var(--text-dim);font-size:var(--t-1);line-height:1.6;}
#page-setup #daily-challenge-card .dc-sub strong{color:var(--text-mid);font-weight:700;}

#page-setup .dgh-dom-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:0;border-top:1px solid var(--border);margin-top:18px;}
html[data-theme] body #page-setup #setup-domain-grid .domain-cell{padding:20px 18px;border:0;border-right:1px solid var(--dg-rule-soft);border-radius:0;background:none;box-shadow:none;text-align:left;}
#page-setup #setup-domain-grid .domain-cell:last-child{border-right:0;}
/* domain-cell interior — editorial (mockup .dc anatomy):
   .dck (Domain N + weight%) → h3 (name) → .tl (topic text) → .dcm (mastery).
   Production anatomy: .dg-weight → .dg-bar-col(HIDE) → .dg-body(.dg-num+.dg-name+ul.dg-topic-list) → .dg-pct-wrap → .dg-status.
   Reshape via CSS to match mockup: column layout, no bar, simple topic text, semantic mastery colour. */
#page-setup #setup-domain-grid .domain-cell{display:flex;flex-direction:column;gap:0;}
/* kill the rainbow per-domain top border from styles.css */
html[data-theme] body #page-setup #setup-domain-grid .domain-cell[data-domain-idx]{border-top:0!important;}
/* hide the visual bar — mockup has no bar */
#page-setup #setup-domain-grid .dg-bar-col{display:none!important;}
/* weight badge — mockup .w: small dim tabular */
html[data-theme] body #page-setup #setup-domain-grid .dg-weight{display:inline;background:none!important;border:0!important;border-radius:0;padding:0;font-size:10px;font-weight:700;color:var(--text-dim);letter-spacing:0.04em;font-variant-numeric:tabular-nums;}
/* domain number — mockup .n */
#page-setup #setup-domain-grid .dg-num{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;color:var(--text-dim);margin-bottom:2px;}
/* domain name — mockup h3 */
html[data-theme] body #page-setup #setup-domain-grid .dg-name{font-size:var(--t0);font-weight:800;letter-spacing:-0.01em;color:var(--text);margin-bottom:10px;}
/* topic list — mockup .tl: plain text with <br>, weak = accent .on */
#page-setup #setup-domain-grid .dg-topic-list{list-style:none;padding:0;margin:0 0 12px;display:block;}
#page-setup #setup-domain-grid .dg-topic{display:block;font-size:var(--t-1);line-height:1.7;color:var(--text-dim);}
#page-setup #setup-domain-grid .dg-topic-dot{display:none!important;}
#page-setup #setup-domain-grid .dg-topic-weak{color:var(--accent);font-weight:600;}
#page-setup #setup-domain-grid .dg-topic-studied{color:var(--text-mid);}
#page-setup #setup-domain-grid .dg-topic-untouched{color:var(--text-dim);font-style:normal;}
/* mastery — mockup .dcm: border-top separator + semantic colour */
#page-setup #setup-domain-grid .dg-pct-wrap{margin-top:auto;padding-top:10px;border-top:1px solid var(--dg-rule-soft);}
html[data-theme] body #page-setup #setup-domain-grid .dg-pct{font-size:var(--t1);font-weight:800;letter-spacing:-0.01em;color:var(--text);}
#page-setup #setup-domain-grid .dg-pct-sub{font-size:var(--t-1);color:var(--text-dim);font-weight:700;}
/* semantic mastery colours via data-tier on the cell (set by render fn) */
#page-setup #setup-domain-grid .domain-cell[data-tier="mastered"] .dg-pct{color:var(--green);}
#page-setup #setup-domain-grid .domain-cell[data-tier="proficient"] .dg-pct{color:var(--yellow);}
#page-setup #setup-domain-grid .domain-cell[data-tier="developing"] .dg-pct,#page-setup #setup-domain-grid .domain-cell[data-tier="novice"] .dg-pct{color:var(--text-dim);}
html[data-theme] body #page-setup #setup-domain-grid .dg-status{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:0.1em;color:var(--text-dim);margin-top:3px;}
#page-setup .dgh-customq{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:26px;padding:18px 0;border-top:1px solid var(--border);font-size:var(--t-1);color:var(--text-dim);}
#page-setup .dgh-customq b{color:var(--text);font-weight:700;}
#page-setup .dgh-customq .go{color:var(--accent);font-weight:700;cursor:pointer;background:none;border:0;font-size:var(--t-1);}

html[data-theme] body #page-setup details.custom-quiz-section{background:none;border:1px solid var(--dg-rule-soft);border-radius:var(--radius);box-shadow:none;backdrop-filter:none;margin-top:26px;}

/* ── Custom Quiz interior · COMPLETE editorial override ────────────────
   styles.css hardcodes purple literals (rgba(124,111,247), #6355e0,
   #5b4bdc, #7c6ff7...), !important tier-colour chips, [data-theme=light]
   white/purple (founder's primary theme), per-domain colour-coding +
   emoji icons. Force editorial; scoped to #custom-quiz-section;
   !important / html[data-theme] body specificity exactly where styles.css
   needs beating. Chip data-v contract untouched (style only). */
html[data-theme] body #custom-quiz-section .cq-section-head{border-bottom:1px solid var(--border);}
html[data-theme] body #custom-quiz-section .cq-section-title{color:var(--text-dim);}
#custom-quiz-section .cq-section-ico,#custom-quiz-section .cq-mode-ico,#custom-quiz-section .cq-generate-ico{display:none!important;}
html[data-theme] body #custom-quiz-section .topic-quickpicks{border-bottom:1px solid var(--border);}
html[data-theme] body #custom-quiz-section .topic-domain-prefill{border-bottom:1px solid var(--border);}

html[data-theme] body #custom-quiz-section .chip{background:none;border:1px solid var(--border);color:var(--text-mid);box-shadow:none;}
html[data-theme] body #custom-quiz-section .chip.on{background:color-mix(in oklab,var(--accent) 14%,transparent);border-color:var(--accent);color:var(--accent);}
html[data-theme] body #custom-quiz-section .chip-smart{border-color:var(--border);color:var(--text-mid);background:none;}
html[data-theme] body #custom-quiz-section .chip-smart.on{border-color:var(--accent);color:var(--accent);background:color-mix(in oklab,var(--accent) 14%,transparent);}

#custom-quiz-section .chip-tier-found,#custom-quiz-section .chip-tier-exam,#custom-quiz-section .chip-tier-hard,#custom-quiz-section .chip-tier-mixed{border-color:var(--border)!important;color:var(--text-mid)!important;background:none!important;}
#custom-quiz-section .chip-tier-found.on,#custom-quiz-section .chip-tier-exam.on,#custom-quiz-section .chip-tier-hard.on,#custom-quiz-section .chip-tier-mixed.on{border-color:var(--accent)!important;color:var(--accent)!important;background:color-mix(in oklab,var(--accent) 14%,transparent)!important;}

#custom-quiz-section .chip-count{background:none!important;border:1px solid var(--border)!important;box-shadow:none!important;}
#custom-quiz-section .chip-count.on{background:color-mix(in oklab,var(--accent) 14%,transparent)!important;border-color:var(--accent)!important;box-shadow:none!important;}
#custom-quiz-section .chip-count .chip-count-num{color:var(--text);}
#custom-quiz-section .chip-count .chip-count-sub{color:var(--text-dim);}
#custom-quiz-section .chip-count.on .chip-count-num,#custom-quiz-section .chip-count.on .chip-count-sub{color:var(--accent);}

html[data-theme] body #custom-quiz-section .cq-mode-card{background:none;border:1px solid var(--border);box-shadow:none;}
html[data-theme] body #custom-quiz-section .cq-mode-card:hover{background:none;border-color:var(--accent);box-shadow:none;transform:none;}
html[data-theme] body #custom-quiz-section .cq-mode-card.on{background:color-mix(in oklab,var(--accent) 12%,transparent);border-color:var(--accent);box-shadow:none;}
html[data-theme] body #custom-quiz-section .cq-mode-card .cq-mode-title{color:var(--text);}
html[data-theme] body #custom-quiz-section .cq-mode-card.on .cq-mode-title{color:var(--accent);}
#custom-quiz-section .cq-mode-sub{color:var(--text-dim);}

/* editorial: domain accordions are a divided list inside the ONE custom-quiz
   panel, NOT individually-bordered boxes nested in a bordered box (box-in-box
   AI-tell). Hairline bottom rule instead of a full border. */
html[data-theme] body #custom-quiz-section .topic-domain-group{background:none;border:0!important;border-bottom:1px solid var(--dg-rule-soft)!important;border-radius:0;overflow:visible;}
html[data-theme] body #custom-quiz-section .topic-domain-group:last-of-type{border-bottom:0!important;}
html[data-theme] body #custom-quiz-section .topic-domain-group[open]{border-color:var(--dg-rule-soft);}
#custom-quiz-section .topic-domain-group .dom-weight,#custom-quiz-section .topic-domain-group[open] .dom-weight{background:color-mix(in oklab,var(--accent) 14%,transparent)!important;color:var(--accent)!important;}
html[data-theme] body #custom-quiz-section .topic-domain-group > summary:hover{background:none;}
html[data-theme] body #custom-quiz-section .tdp-pill{background:none;border:1px solid var(--border)!important;color:var(--text-mid);}
html[data-theme] body #custom-quiz-section .tdp-pill:hover{background:none;border-color:var(--accent)!important;color:var(--accent);transform:none;}

html[data-theme] body #custom-quiz-section .cq-summary-bar{background:none;border:0;border-top:1px solid var(--border);border-radius:0;box-shadow:none;}
#custom-quiz-section .cq-summary-prose{color:var(--text-dim);}
#custom-quiz-section .cq-summary-prose strong{color:var(--accent);}
#custom-quiz-section .cq-summary-prose em{color:var(--text-mid);font-style:normal;}
html[data-theme] body #custom-quiz-section .cq-summary-cta{background:var(--accent)!important;color:var(--bg)!important;border:0!important;box-shadow:none!important;}
html[data-theme] body #custom-quiz-section .cq-summary-cta:hover{filter:brightness(1.05);transform:none;box-shadow:none!important;}

/* ════════════════════════════════════════════════════════════════════════
   v5.5.4 · SECTION 5 — Custom Quiz HORIZONTAL MODAL (JS-portal build).
   Founder: a pop-up off Configure →, not an on-page never-ending column.
   app.js portals <details id="custom-quiz-section"> to <body> on open
   (toggle-event driven, all entry points) so NO ancestor transform /
   containment can break position:fixed (the CSS-only attempt fought the
   page-nav system + flaky SW cache). Selectors are #page-setup-free so
   they apply when portaled; type tokens re-declared here because the
   --t*/--dgh-ease vars live on #page-setup (colour tokens are global on
   html[data-theme] so they inherit on <body>). Contract byte-exact:
   every id / data-v / .cq-* / onclick preserved; index.html source
   unchanged (runtime reparent only) so UAT guards stay green.
   emil modal: scale(0.96)+opacity (never scale(0)), ease-out ~220ms,
   transform-origin centre (modals stay centred), backdrop fade, JS
   scroll-lock, Esc + backdrop + native summary-× dismiss, reduced-
   motion = fade only. taste-skill→dashboards: focused configurator
   overlay, sticky Generate footer, restraint. */
#custom-quiz-section{--t-1:12px;--t0:14px;--t1:18px;--t2:23px;--t3:30px;--t4:42px;--dgh-ease:cubic-bezier(0.16,1,0.3,1);}
html body #custom-quiz-section{display:none;}
html body #custom-quiz-section[open]{display:flex;flex-direction:column;align-items:center;justify-content:center;position:fixed;inset:0;z-index:140;margin:0;padding:clamp(16px,4vh,46px);background:color-mix(in oklab,var(--bg) 70%,transparent);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);border:0;border-radius:0;box-shadow:none;overflow:auto;animation:cqModalFade .2s cubic-bezier(0.16,1,0.3,1);}
@keyframes cqModalFade{from{opacity:0}to{opacity:1}}
#custom-quiz-section[open]>.custom-quiz-summary,#custom-quiz-section[open]>.custom-quiz-body{width:min(1040px,calc(100vw - clamp(28px,7vw,84px)));flex:none;animation:cqModalPanel .24s cubic-bezier(0.16,1,0.3,1);}
@keyframes cqModalPanel{from{opacity:0;transform:scale(0.96)}to{opacity:1;transform:none}}
html[data-theme] body #custom-quiz-section[open]>.custom-quiz-summary{display:flex;align-items:center;justify-content:space-between;gap:16px;list-style:none;cursor:pointer;background:var(--surface);border:1px solid var(--border);border-bottom:0;border-radius:16px 16px 0 0;padding:20px 26px;margin:0;font-family:'Fraunces',Georgia,serif;font-size:var(--t1);font-weight:600;color:var(--text);letter-spacing:-0.01em;}
#custom-quiz-section[open]>.custom-quiz-summary::-webkit-details-marker{display:none;}
#custom-quiz-section[open]>.custom-quiz-summary::after{content:"\2715";font-family:Inter,-apple-system,sans-serif;font-size:15px;font-weight:600;color:var(--text-dim);width:32px;height:32px;display:grid;place-items:center;border:1px solid var(--border);border-radius:9px;flex:none;}
@media (hover:hover) and (pointer:fine){#custom-quiz-section[open]>.custom-quiz-summary:hover::after{color:var(--accent);border-color:color-mix(in oklab,var(--accent) 45%,var(--border));}}
#custom-quiz-section .adv-hint{font-family:Inter,-apple-system,sans-serif;font-size:11.5px;font-weight:600;color:var(--text-dim);letter-spacing:0;}
html[data-theme] body #custom-quiz-section[open]>.custom-quiz-body{max-height:min(82vh,680px);overflow-y:auto;background:var(--surface);border:1px solid var(--border);border-radius:0 0 16px 16px;padding:24px clamp(20px,2.4vw,28px) 0;box-shadow:0 40px 80px -34px rgba(0,0,0,.5);}
#custom-quiz-section .cq-section-ico,#custom-quiz-section .cq-mode-ico,#custom-quiz-section .cq-generate-ico{display:none;}
html[data-theme] body #custom-quiz-section .cq-section-title{font-family:'Fraunces',Georgia,serif;font-size:var(--t1);font-weight:600;letter-spacing:-0.01em;color:var(--text);}
#custom-quiz-section[open] #topic-group{display:grid;grid-template-columns:1fr 1fr;gap:10px 22px;align-items:start;}
#custom-quiz-section[open] #topic-group>.cq-section-head,#custom-quiz-section[open] #topic-group>.topic-domain-prefill,#custom-quiz-section[open] #topic-group>.topic-quickpicks{grid-column:1 / -1;}
#custom-quiz-section[open] #topic-group>.topic-quickpicks{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
html[data-theme] body #custom-quiz-section[open] .topic-domain-group{align-self:start;background:color-mix(in oklab,var(--text) 3%,var(--surface));border:1px solid var(--border)!important;border-bottom:1px solid var(--border)!important;border-radius:12px;overflow:hidden;}
#custom-quiz-section[open] .cq-options-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,80px);align-items:start;margin-top:24px;}
#custom-quiz-section[open] .cq-options-grid>div{min-width:0;}
#custom-quiz-section[open] .cq-options-grid .chip-group{display:flex;flex-wrap:wrap;gap:10px;}
#custom-quiz-section[open] #diff-group .chip{flex:1 1 calc(50% - 5px);justify-content:center;text-align:center;}
#custom-quiz-section[open] #count-group .chip-count{flex:1 1 0;min-width:64px;}
@media (max-width:760px){#custom-quiz-section[open] .cq-options-grid{grid-template-columns:1fr;gap:24px;}}
/* emil-design-eng — the v4.99.x rebrand set transform:none on these for
   editorial calm. The Custom Quiz is a focused configurator you actively
   click, so restore tactile feedback: crisp hover + press scale. Scoped
   html[data-theme] body #…[open] so it outranks the rebrand's
   transform:none without !important. transform/opacity only (GPU),
   durations in emil's press/hover range, --dgh-ease (strong ease-out),
   hover gated to fine pointers, reduced-motion neutralised. */
html[data-theme] body #custom-quiz-section[open] .chip,html[data-theme] body #custom-quiz-section[open] .cq-mode-card,html[data-theme] body #custom-quiz-section[open] .tdp-pill,html[data-theme] body #custom-quiz-section[open] .cq-summary-cta,html[data-theme] body #custom-quiz-section[open] .topic-domain-group>summary{transition:transform .15s cubic-bezier(0.16,1,0.3,1),border-color .15s cubic-bezier(0.16,1,0.3,1),background .15s cubic-bezier(0.16,1,0.3,1),color .15s cubic-bezier(0.16,1,0.3,1),filter .15s cubic-bezier(0.16,1,0.3,1);}
@media (hover:hover) and (pointer:fine){
  html[data-theme] body #custom-quiz-section[open] .chip:hover,html[data-theme] body #custom-quiz-section[open] .tdp-pill:hover{border-color:color-mix(in oklab,var(--accent) 50%,var(--border));color:var(--accent);}
  html[data-theme] body #custom-quiz-section[open] .cq-mode-card:hover{border-color:color-mix(in oklab,var(--accent) 45%,var(--border));transform:translateY(-1px);}
  html[data-theme] body #custom-quiz-section[open] .topic-domain-group>summary:hover{background:color-mix(in oklab,var(--accent) 6%,transparent);}
  html[data-theme] body #custom-quiz-section[open] .cq-summary-cta:hover{filter:brightness(1.06);transform:translateY(-1px);}
}
html[data-theme] body #custom-quiz-section[open] .chip:active,html[data-theme] body #custom-quiz-section[open] .cq-mode-card:active,html[data-theme] body #custom-quiz-section[open] .tdp-pill:active,html[data-theme] body #custom-quiz-section[open] .cq-summary-cta:active{transform:scale(0.97);}
@media (prefers-reduced-motion:reduce){html[data-theme] body #custom-quiz-section[open] .chip,html[data-theme] body #custom-quiz-section[open] .cq-mode-card,html[data-theme] body #custom-quiz-section[open] .tdp-pill,html[data-theme] body #custom-quiz-section[open] .cq-summary-cta,html[data-theme] body #custom-quiz-section[open] .topic-domain-group>summary{transition:none!important;transform:none!important;}}
html[data-theme] body #custom-quiz-section[open] .cq-summary-bar{position:sticky;bottom:0;margin:18px clamp(-20px,-2.4vw,-28px) 0;padding:16px clamp(20px,2.4vw,28px);background:color-mix(in oklab,var(--surface) 92%,var(--bg));border:0;border-top:1px solid var(--border);border-radius:0;box-shadow:none;display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);}
@media (prefers-reduced-motion:reduce){#custom-quiz-section[open],#custom-quiz-section[open]>.custom-quiz-summary,#custom-quiz-section[open]>.custom-quiz-body{animation:cqModalFade .15s ease!important;}}
@media (max-width:760px){#custom-quiz-section[open] #topic-group,#custom-quiz-section[open] #topic-group>.topic-quickpicks{grid-template-columns:1fr;}}

@media (prefers-reduced-motion: reduce){#page-setup .dgh-rd-fill,#page-setup .dgh-opt,#page-setup .dgh-db,#page-setup .dgh-cta{transition:none!important;}}
@media (max-width:860px){#page-setup .dgh-opts{grid-template-columns:1fr;}#page-setup .dgh-dbd,#page-setup .dgh-dom-grid{grid-template-columns:1fr 1fr;}#page-setup .dgh-opt,#page-setup .dgh-db,#page-setup #setup-domain-grid .domain-cell{border-right:0;}#page-setup .dgh-top{flex-direction:column;}#page-setup .dgh-rd{width:100%;}}

/* ════════════════════════════════════════════════════════════════════════
   PER-SURFACE STRUCTURAL RESKIN · Batch 4b · PROGRESS (#page-progress)
   ────────────────────────────────────────────────────────────────────────
   Faithful build of mockups/netplus-progress-concept.html. The page is
   render-painted (_renderProgressSummary/#progress-summary,
   _renderProgressGrouped/#progress-topic-grid, renderProgressRecommendation
   /#progress-rec-host via the SHARED _pageRecCard). Same proven approach as
   Home: COMPLETE high-specificity scoped override of the emitted markup ->
   editorial bands; soft-cards/emoji/data-domain-idx rainbow/legend-pills
   killed; every onclick (drillTopic/focusTopic/setProgressFilter/
   setProgressSort/filterProgressPage/goSetup) + ids preserved (style only,
   zero app.js render-logic change). Scoped #page-progress so the shared
   _pageRecCard on subnet/drills pages is untouched. 0 emoji · 0 hex. */
#page-progress{--t-1:12px;--t0:14px;--t1:18px;--t2:23px;--t4:42px;}
html[data-theme] body #page-progress{background:var(--bg);color:var(--text);}
html[data-theme] body #page-progress .page,#page-progress{max-width:none;}
#page-progress{max-width:920px;margin:0 auto;padding:46px 26px 90px;}

/* head -> .top */
html[data-theme] body #page-progress .ed-pagehead{display:block;background:none;border:0;box-shadow:none;padding:0;margin:0 0 26px;}
#page-progress .ed-pagehead-back{background:none!important;border:0!important;box-shadow:none!important;color:var(--text-dim)!important;font-size:var(--t-1);font-weight:600;padding:0 0 14px!important;}
#page-progress .ed-pagehead-back:hover{color:var(--accent)!important;}
#page-progress .ed-pagehead-eyebrow{font-size:10px;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;color:var(--text-dim);}
#page-progress .ed-pagehead-eyebrow::before{content:none!important;display:none!important;}
html[data-theme] body #page-progress h1.ed-pagehead-display{font-size:var(--t4);font-weight:800;letter-spacing:-0.03em;margin:12px 0 0;color:var(--text);}
#page-progress h1.ed-pagehead-display em,#page-progress h1.ed-pagehead-display i{font-style:normal;color:var(--accent);}

/* recommendation (_pageRecCard) -> .focus band */
/* _pageRecCard emits FLAT children (eyebrow/headline/sub/btn/reason) with
   no .focus-l wrapper, so flex+space-between scatters them. Block-stack
   like Home's NBM band: eyebrow -> headline -> sub -> CTA -> reason. */
html[data-theme] body #page-progress #progress-rec-host .page-rec-card{display:block;background:none;border:0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);border-radius:0;box-shadow:none;padding:24px 0;margin:0;}
#page-progress #progress-rec-host .page-rec-icon{display:none!important;}
#page-progress #progress-rec-host .page-rec-eyebrow{margin:0;}
#page-progress #progress-rec-host .page-rec-eyebrow-text{font-size:10px;font-weight:800;letter-spacing:0.14em;text-transform:uppercase;color:var(--accent);}
html[data-theme] body #page-progress #progress-rec-host .page-rec-headline{font-size:var(--t2);font-weight:800;letter-spacing:-0.02em;color:var(--text);margin:9px 0 5px;}
#page-progress #progress-rec-host .page-rec-sub{font-size:var(--t-1);color:var(--text-dim);max-width:520px;line-height:1.6;}
html[data-theme] body #page-progress #progress-rec-host .page-rec-btn{display:inline-flex;align-items:center;background:var(--accent);color:var(--bg);border:0;border-radius:9px;font:800 var(--t0)/1 Inter,-apple-system,sans-serif;padding:13px 20px;cursor:pointer;box-shadow:none;margin-top:14px;}
html[data-theme] body #page-progress #progress-rec-host .page-rec-btn:hover{filter:brightness(1.05);transform:none;box-shadow:none;}
#page-progress #progress-rec-host .page-rec-reason{font-size:11px;color:var(--text-dim);margin-top:10px;}

/* summary (_renderProgressSummary) -> .mast band */
html[data-theme] body #page-progress #progress-summary .progress-card{display:block;background:none;border:0;border-bottom:1px solid var(--border);border-radius:0;box-shadow:none;backdrop-filter:none;padding:24px 0;margin:0;}
#page-progress #progress-summary .progress-card-ico,#page-progress #progress-summary .ps2-stat-ico,#page-progress #progress-summary .progress-card-legend{display:none!important;}
#page-progress #progress-summary .progress-card-head{display:block;padding:0;border:0;margin:0 0 4px;}
#page-progress #progress-summary .progress-card-title{font-size:10px;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:var(--text-dim);}
#page-progress #progress-summary .progress-card-sub{font-size:var(--t1);font-weight:800;letter-spacing:-0.01em;color:var(--text);margin-top:8px;}
#page-progress #progress-summary .progress-card-sub strong{color:var(--accent);font-weight:800;}
#page-progress #progress-summary .ps2-cover-bar{height:4px;border-radius:2px;background:var(--surface);overflow:hidden;margin:14px 0 4px;}
#page-progress #progress-summary .ps2-cover-fill{height:100%;border-radius:2px;background:var(--accent);}
html[data-theme] body #page-progress #progress-summary .ps2-grid{display:flex;flex-wrap:wrap;gap:30px;background:none;margin-top:16px;}
html[data-theme] body #page-progress #progress-summary .ps2-stat{display:block;background:none;border:0;border-radius:0;box-shadow:none;padding:0;text-align:left;min-width:0;}
#page-progress #progress-summary .ps2-stat-val{font-size:var(--t2);font-weight:800;letter-spacing:-0.02em;font-variant-numeric:tabular-nums;color:var(--text);}
#page-progress #progress-summary .ps2-stat-val .ps2-stat-sub{font-size:var(--t-1);color:var(--text-dim);font-weight:600;}
#page-progress #progress-summary .ps2-strong .ps2-stat-val{color:var(--green);}
#page-progress #progress-summary .ps2-untouched .ps2-stat-val{color:var(--yellow);}
#page-progress #progress-summary .ps2-stat-lbl{font-size:10px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--text-dim);margin-top:6px;}

/* toolbar -> .controls */
html[data-theme] body #page-progress .progress-toolbar{display:flex;align-items:center;gap:10px;background:none;border:0;border-bottom:1px solid var(--border);border-radius:0;box-shadow:none;padding:20px 0;margin:0;flex-wrap:wrap;}
html[data-theme] body #page-progress .progress-search{flex:1;min-width:200px;background:none;border:1px solid var(--border);border-radius:8px;color:var(--text);font:400 var(--t-1) Inter,sans-serif;padding:10px 13px;box-shadow:none;}
#page-progress .progress-search::placeholder{color:var(--text-dim);}
#page-progress .progress-filters{display:flex;gap:2px;border:1px solid var(--dg-rule-soft);border-radius:8px;padding:3px;}
html[data-theme] body #page-progress .prog-filter-btn{background:none;border:0;border-radius:5px;color:var(--text-dim);font:600 11px/1 Inter,sans-serif;padding:8px 11px;cursor:pointer;box-shadow:none;}
html[data-theme] body #page-progress .prog-filter-btn:hover{color:var(--text);background:none;}
html[data-theme] body #page-progress .prog-filter-btn.prog-filter-active{color:var(--text);background:var(--surface);box-shadow:inset 0 0 0 1px var(--border);}
#page-progress .progress-sort{display:flex;align-items:center;gap:8px;}
#page-progress .prog-sort-label{font-size:10px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--text-dim);}
html[data-theme] body #page-progress .prog-sort-select{background:none;border:1px solid var(--border);border-radius:8px;color:var(--text);font:600 11px Inter,sans-serif;padding:8px 11px;box-shadow:none;}

/* topic grid (_renderProgressGrouped + _progressRowHtml) -> .dom / .t-row */
#page-progress #progress-topic-grid{margin-top:30px;}
html[data-theme] body #page-progress .progress-domain{display:block;background:none;border:0!important;border-radius:0;box-shadow:none;margin:0 0 30px;padding:0;}
html[data-theme] body #page-progress .progress-domain-head{display:flex;align-items:baseline;justify-content:space-between;gap:14px;flex-wrap:wrap;list-style:none;background:none;border:0;border-bottom:1px solid var(--border);border-radius:0;padding:0 0 11px;cursor:pointer;}
#page-progress .progress-domain-head::-webkit-details-marker{display:none;}
#page-progress .progress-domain-head::before,#page-progress .progress-domain-head::after{content:none!important;display:none!important;}
#page-progress .progress-domain-head .pd-name{font-size:var(--t1);font-weight:800;letter-spacing:-0.02em;color:var(--text);}
#page-progress .progress-domain-head .pd-weight{font-size:10px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-dim);}
#page-progress .progress-domain-head .pd-bar{flex:0 0 90px;height:4px;border-radius:2px;background:var(--surface);overflow:hidden;}
#page-progress .progress-domain-head .pd-bar-fill{height:100%;border-radius:2px;}
#page-progress .progress-domain-head .pd-avg{font-size:var(--t-1);font-weight:800;font-variant-numeric:tabular-nums;}
#page-progress .progress-domain-head .pd-count{font-size:var(--t-1);color:var(--text-dim);font-variant-numeric:tabular-nums;}
#page-progress .progress-domain-rows{padding:0;}
html[data-theme] body #page-progress .topic-row{display:grid;grid-template-columns:1fr 132px 70px 30px;gap:16px;align-items:center;background:none;border:0;border-bottom:1px solid var(--dg-rule-soft);border-radius:0;box-shadow:none;padding:13px 2px;cursor:pointer;}
html[data-theme] body #page-progress .topic-row:hover{background:none;}
#page-progress .topic-row .topic-rag{display:none!important;}
#page-progress .topic-row .topic-info{min-width:0;display:block;}
#page-progress .topic-row .topic-name-line{display:flex;align-items:baseline;gap:7px;}
#page-progress .topic-row .topic-obj-badge{background:none!important;border:0!important;color:var(--text-dim)!important;font:700 10px/1 var(--mono,ui-monospace,Menlo,monospace)!important;padding:0!important;letter-spacing:0.04em;}
#page-progress .topic-row .topic-name{font-size:var(--t-1);font-weight:700;color:var(--text);}
#page-progress .topic-row .topic-meta{font-size:11px;color:var(--text-dim);margin-top:3px;}
#page-progress .topic-row .topic-mini-bar{grid-column:2;height:4px;border-radius:2px;background:var(--surface);overflow:hidden;align-self:center;}
#page-progress .topic-row .topic-mini-fill{height:100%;border-radius:2px;}
#page-progress .topic-row .topic-pct-lbl{grid-column:3;font-size:var(--t-1);font-weight:800;text-align:right;font-variant-numeric:tabular-nums;}
#page-progress .topic-row .topic-trend{margin-left:5px;font-size:11px;}
html[data-theme] body #page-progress .topic-row .topic-play-btn{grid-column:4;justify-self:end;background:none;border:0;box-shadow:none;color:var(--text-dim);width:26px;height:26px;display:grid;place-items:center;border-radius:6px;cursor:pointer;font-size:11px;}
html[data-theme] body #page-progress .topic-row .topic-play-btn:hover{color:var(--accent);background:var(--surface);}

@media (max-width:680px){#page-progress .topic-row{grid-template-columns:1fr 60px 26px;}#page-progress .topic-row .topic-mini-bar{display:none;}#page-progress .topic-row .topic-pct-lbl{grid-column:2;}#page-progress .topic-row .topic-play-btn{grid-column:3;}}

/* ════════════════════════════════════════════════════════════════════════
   PER-SURFACE STRUCTURAL RESKIN · Batch 4c · ANALYTICS (#page-analytics)
   ────────────────────────────────────────────────────────────────────────
   Faithful build of mockups/netplus-analytics-concept.html. The page is
   render-painted (renderAnalytics orchestrates 13 _renderAna* helpers into
   #analytics-content + renderAnalyticsActionHeadline into
   #ana-action-headline). ~60 ana-* classes / soft cards / emoji icons /
   colored pills. Same proven approach as Home+Progress: COMPLETE scoped
   #page-analytics override -> editorial bands (de-carded, hairline, bronze,
   pass/warn, calm). Charts (SVG trend, flex bars, heatmap, constellation)
   are kept as data-viz, de-carded + recoloured to dg tokens. Every onclick/
   id preserved (style only, zero markup/app.js render-logic change). The
   inline bar colours use var(--green/red/warn) which the cascade already
   dg-tones. 0 emoji (icon spans display:none) · 0 hex. */
#page-analytics{--t-1:12px;--t0:14px;--t1:18px;--t2:23px;--t3:30px;--t4:42px;--t5:60px;}
html[data-theme] body #page-analytics{background:var(--bg);color:var(--text);}
#page-analytics{max-width:960px;margin:0 auto;padding:46px 26px 90px;}

/* head -> .top (same recipe as Progress) */
html[data-theme] body #page-analytics .ed-pagehead{display:block;background:none;border:0;box-shadow:none;padding:0;margin:0 0 24px;}
#page-analytics .ed-pagehead-back{background:none!important;border:0!important;box-shadow:none!important;color:var(--text-dim)!important;font-size:var(--t-1);font-weight:600;padding:0 0 14px!important;}
#page-analytics .ed-pagehead-back:hover{color:var(--accent)!important;}
#page-analytics .ed-pagehead-eyebrow{font-size:10px;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;color:var(--text-dim);}
#page-analytics .ed-pagehead-eyebrow::before{content:none!important;display:none!important;}
html[data-theme] body #page-analytics h1.ed-pagehead-display{font-size:var(--t4);font-weight:800;letter-spacing:-0.03em;margin:12px 0 0;color:var(--text);}
#page-analytics h1.ed-pagehead-display em,#page-analytics h1.ed-pagehead-display i{font-style:normal;color:var(--accent);}

/* universal de-card: every ana card/section -> editorial band */
html[data-theme] body #page-analytics .ana-card,
html[data-theme] body #page-analytics #analytics-content [class$="-card"],
html[data-theme] body #page-analytics #ana-action-headline,
html[data-theme] body #page-analytics .ana-ready-hero,
html[data-theme] body #page-analytics .ana-empty-card{background:none!important;border:0!important;border-bottom:1px solid var(--border)!important;border-radius:0!important;box-shadow:none!important;backdrop-filter:none!important;padding:30px 0!important;margin:0!important;}
/* kill every decorative emoji/icon glyph + the streak flame */
#page-analytics [class*="-icon"],#page-analytics [class*="-ico"],#page-analytics .ana-streak-flame,#page-analytics .ana-empty-icon,#page-analytics .ana-hero-stat-icon,#page-analytics .ana-ready-datechip-icon{display:none!important;}
/* eyebrows / titles / subtitles -> editorial type */
#page-analytics [class*="-eyebrow"],#page-analytics [class$="-head"]>.ana-subtitle,#page-analytics .ana-subtitle,#page-analytics .ana-accchart-eyebrow,#page-analytics .ana-heatmap-eyebrow,#page-analytics .ana-action-eyebrow{font-size:10px!important;font-weight:700!important;letter-spacing:0.16em!important;text-transform:uppercase!important;color:var(--text-dim)!important;}
#page-analytics .ana-action-eyebrow{color:var(--accent)!important;font-weight:800!important;letter-spacing:0.14em!important;}
html[data-theme] body #page-analytics [class*="-title"]{font-size:var(--t2);font-weight:800;letter-spacing:-0.02em;color:var(--text);margin:7px 0 4px;}
#page-analytics [class*="-title"] i,#page-analytics [class*="-title"] em,#page-analytics [class*="-title"] b{font-style:normal;color:var(--accent);font-weight:800;}
#page-analytics [class$="-head"]{display:flex;align-items:baseline;justify-content:space-between;gap:14px;flex-wrap:wrap;background:none;border:0;padding:0;margin:0 0 6px;}

/* readiness -> .ready typographic verdict */
#page-analytics .ana-ready-num{font-size:var(--t5);font-weight:800;letter-spacing:-0.03em;line-height:1;font-variant-numeric:tabular-nums;color:var(--text);}
#page-analytics .ana-ready-denom{font-size:var(--t2);color:var(--text-dim);font-weight:700;}
#page-analytics .ana-ready-badge,#page-analytics .ana-ready-title{font-size:11px;font-weight:800;letter-spacing:0.1em;text-transform:uppercase;color:var(--yellow);background:none!important;border:0!important;padding:0!important;}
#page-analytics .ana-ready-bar,#page-analytics .ana-ready-bar-wrap{height:6px;border-radius:3px;background:var(--surface)!important;overflow:hidden;border:0!important;box-shadow:none!important;}
#page-analytics .ana-ready-bar-fill{height:100%;border-radius:3px;background:var(--accent)!important;box-shadow:none!important;}
#page-analytics .ana-ready-bar-passtick{background:var(--text-dim)!important;}
#page-analytics .ana-ready-bar-passlabel,#page-analytics .ana-ready-bar-scale{color:var(--text-dim)!important;font-size:10px;}
html[data-theme] body #page-analytics .ana-ready-datechip{background:none;border:1px solid var(--border);border-radius:8px;box-shadow:none;color:var(--text-dim);}
#page-analytics .ana-ready-datechip-days,#page-analytics .ana-ready-datechip-date{color:var(--text-mid);}

/* why-score -> .comp weighted component rows + .verdict callout */
#page-analytics .ana-why-score,#page-analytics .why-bar-row{display:grid;gap:15px;}
#page-analytics .why-bar-row{grid-template-columns:230px 1fr 46px;align-items:center;}
#page-analytics .why-bar-row [class*="track"],#page-analytics .why-bar-row [class*="-bar"]:not(button){height:8px;border-radius:4px;background:var(--surface)!important;overflow:hidden;}
#page-analytics .why-bar-row [class*="fill"]{height:100%;border-radius:4px;}
#page-analytics .ana-why-verdict,#page-analytics [class*="verdict"]{border:1px solid color-mix(in oklab,var(--yellow) 40%,var(--border))!important;border-radius:10px!important;padding:15px 17px!important;background:color-mix(in oklab,var(--yellow) 7%,transparent)!important;font-size:var(--t-1);color:var(--text-mid);line-height:1.6;}
#page-analytics [class*="verdict"] b,#page-analytics [class*="verdict"] strong{color:var(--text);font-weight:800;}

/* generic bars/tracks/fills across diff/domain/trend/exam/ms -> hairline */
#page-analytics .ana-diff-bar,#page-analytics .ana-domain-bar,#page-analytics .ana-ms-track,#page-analytics .ana-diff-grid .ana-diff-item [class*="bar"],#page-analytics [class*="-track"]{height:6px!important;border-radius:3px!important;background:var(--surface)!important;overflow:hidden;border:0!important;}
#page-analytics .ana-diff-fill,#page-analytics .ana-domain-fill,#page-analytics .ana-ms-fill,#page-analytics [class*="-fill"]{height:100%!important;border-radius:3px!important;box-shadow:none!important;}
#page-analytics .ana-diff-pct,#page-analytics .ana-domain-pct,#page-analytics [class*="-pct"],#page-analytics [class*="-val"]{font-weight:800;font-variant-numeric:tabular-nums;}
#page-analytics .ana-domain-dot{display:none!important;}
#page-analytics .ana-domain-row,#page-analytics .dm-row{display:grid;grid-template-columns:1fr 150px 110px;gap:18px;align-items:center;padding:15px 2px;border-bottom:1px solid var(--dg-rule-soft)!important;background:none!important;border-left:0!important;border-radius:0!important;}
#page-analytics .ana-domain-name,#page-analytics .dm-row .ana-domain-name{font-size:var(--t-1);font-weight:700;color:var(--text);}
#page-analytics .ana-domain-meta,#page-analytics .ana-domain-weight,#page-analytics .ana-domain-target{font-size:11px;color:var(--text-dim);}

/* difficulty + diff grid -> .diff rows */
#page-analytics .ana-diff-grid{display:grid;gap:14px;}
#page-analytics .ana-diff-item{display:grid;grid-template-columns:120px 1fr 80px;gap:16px;align-items:center;background:none!important;border:0!important;padding:0!important;}
#page-analytics .ana-diff-name{font-size:var(--t-1);font-weight:600;color:var(--text-mid);}

/* accuracy chart + heatmap + constellation: de-card container, keep viz */
#page-analytics .ana-accchart-wrap,#page-analytics .ana-heatmap-wrap,#page-analytics .ana-chart{margin-top:18px;}
#page-analytics .ana-accchart-tabs,#page-analytics .ana-nav{display:flex;gap:2px;border:1px solid var(--dg-rule-soft);border-radius:8px;padding:3px;background:none;flex-wrap:wrap;}
html[data-theme] body #page-analytics .ana-accchart-tab,html[data-theme] body #page-analytics .ana-nav-pill{background:none!important;border:0!important;border-radius:5px!important;color:var(--text-dim)!important;font:600 11px/1 Inter,sans-serif!important;padding:8px 11px!important;box-shadow:none!important;}
html[data-theme] body #page-analytics .ana-accchart-tab-active,html[data-theme] body #page-analytics .ana-nav-pill.active,html[data-theme] body #page-analytics .ana-nav-pill[aria-current="true"]{color:var(--text)!important;background:var(--surface)!important;box-shadow:inset 0 0 0 1px var(--border)!important;}
#page-analytics .ana-nav{margin:0 0 22px;}
#page-analytics .ana-chart-bars,#page-analytics .ana-bar-wrap{display:flex;align-items:flex-end;gap:6px;height:120px;}
#page-analytics .ana-bar,#page-analytics .ana-chart-bars i{flex:1;background:var(--green)!important;border-radius:3px 3px 0 0;display:block;}
#page-analytics .ana-bar.bad,#page-analytics .ana-bar-bad{background:var(--red)!important;}
#page-analytics .ana-chart-lbl,#page-analytics .ana-bar-tip,#page-analytics .ana-avg{font-size:11px;color:var(--text-dim);}
#page-analytics .ana-constellation,#page-analytics .ana-calendar,#page-analytics .ana-heatmap-svg,#page-analytics .ana-accchart-svg{border:1px solid var(--dg-rule-soft)!important;border-radius:10px!important;background:none!important;box-shadow:none!important;}
#page-analytics .ana-cal-day,#page-analytics .ana-cal-day-sm{border-radius:3px;}
#page-analytics .ana-heatmap-legend,#page-analytics .ana-heatmap-stats,#page-analytics .ana-heatmap-stat,#page-analytics .ana-cal-legend,#page-analytics .ana-cal-num{font-size:11px;color:var(--text-dim);}

/* hero stats -> .stats 4-col hairline strip */
#page-analytics .ana-hero-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);margin:0;}
html[data-theme] body #page-analytics .ana-hero-stat{background:none!important;border:0!important;border-right:1px solid var(--dg-rule-soft)!important;border-radius:0!important;box-shadow:none!important;padding:18px 20px!important;text-align:left;}
#page-analytics .ana-hero-stat:last-child{border-right:0!important;}
#page-analytics .ana-hero-stat-lbl{font-size:10px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-dim);}
#page-analytics .ana-hero-stat-val{font-size:var(--t2);font-weight:800;margin-top:7px;letter-spacing:-0.02em;font-variant-numeric:tabular-nums;color:var(--text);}
#page-analytics .ana-hero-stat-spark{opacity:0.5;}

/* action headline -> .nbm band; topics cta + exams + 2-col + streak + ms */
#page-analytics #ana-action-headline{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;}
#page-analytics .ana-action-body{min-width:260px;flex:1;}
html[data-theme] body #page-analytics .ana-action-topic,html[data-theme] body #page-analytics .ana-action-text{font-size:var(--t2);font-weight:800;letter-spacing:-0.02em;color:var(--text);margin:9px 0 5px;}
#page-analytics .ana-action-meta{font-size:var(--t-1);color:var(--text-dim);}
html[data-theme] body #page-analytics .ana-action-btn,html[data-theme] body #page-analytics .ana-topics-cta-btn,html[data-theme] body #page-analytics .ana-empty-cta{background:var(--accent)!important;color:var(--bg)!important;border:0!important;border-radius:9px!important;font:800 var(--t0)/1 Inter,-apple-system,sans-serif!important;padding:14px 22px!important;box-shadow:none!important;cursor:pointer;flex:none;}
html[data-theme] body #page-analytics .ana-action-btn:hover,html[data-theme] body #page-analytics .ana-topics-cta-btn:hover,html[data-theme] body #page-analytics .ana-empty-cta:hover{filter:brightness(1.05);transform:none;box-shadow:none!important;}
#page-analytics .ana-grid-2col{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid var(--border);}
html[data-theme] body #page-analytics .ana-grid-2col>*{background:none!important;border:0!important;border-right:1px solid var(--dg-rule-soft)!important;border-radius:0!important;box-shadow:none!important;padding:22px 24px 22px 0!important;}
#page-analytics .ana-grid-2col>*:last-child{border-right:0!important;padding-left:24px!important;}
#page-analytics .ana-streak-grid,#page-analytics .ana-streak-week{display:flex;gap:4px;flex-wrap:wrap;}
#page-analytics .ana-streak-day,#page-analytics .ana-streak-day-dot{width:11px;height:11px;border-radius:3px;background:var(--surface)!important;}
#page-analytics .ana-streak-day-on,#page-analytics .ana-streak-day.on{background:var(--accent)!important;}
#page-analytics .ana-streak-day-today{box-shadow:inset 0 0 0 1px var(--accent)!important;}
#page-analytics .ana-streak-num,#page-analytics .ana-streak-big{font-size:var(--t3);font-weight:800;font-variant-numeric:tabular-nums;color:var(--text);}
#page-analytics .ana-streak-lbl,#page-analytics .ana-streak-msg,#page-analytics .ana-streak-meta,#page-analytics .ana-streak-info{font-size:var(--t-1);color:var(--text-dim);}
#page-analytics .ana-ms-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--dg-rule-soft);}
html[data-theme] body #page-analytics .ana-ms-grid>*,html[data-theme] body #page-analytics .ana-ms-item{background:none!important;border:0!important;border-right:1px solid var(--dg-rule-soft)!important;border-radius:0!important;padding:15px 16px 15px 0!important;}
#page-analytics .ana-ms-grid>*:last-child{border-right:0!important;}
#page-analytics .ana-empty-card{text-align:center;}
#page-analytics .ana-empty-title{font-size:var(--t3);font-weight:800;color:var(--text);}
#page-analytics .ana-empty-body,#page-analytics .ana-empty-foot{color:var(--text-dim);}

/* ── Batch 4c · live-audit residual fixes (visual caught what mapping missed) ── */
/* styles.css puts a persistent outline + radius on the analytics h1 */
#page-analytics h1.ed-pagehead-display{outline:0!important;border-radius:0!important;}
/* kill ALL styles.css ::before pseudo-glyphs (em-dash on eyebrows, ▶/▸ on
   the milestones <details> summary) — same class of bug as Progress */
#page-analytics [class*="-eyebrow"]::before,#page-analytics [class*="subtitle"]::before,#page-analytics .ana-accchart-eyebrow::before,#page-analytics .ana-heatmap-eyebrow::before,#page-analytics .ed-cardhead-eyebrow::before,#page-analytics .ana-ms-details::before,#page-analytics .ana-ms-details>summary::before,#page-analytics [class*="ana-ms"]>summary::before{content:none!important;display:none!important;}
/* streak: de-card the filled .ana-streak-big block + kill off-day dot border */
html[data-theme] body #page-analytics .ana-streak-big{background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;padding:0!important;}
#page-analytics .ana-streak-day-dot{border:0!important;background:var(--surface)!important;}
/* milestone tiles -> editorial .mi (de-carded, hairline divider, no box) */
#page-analytics .ana-ms-recent{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--dg-rule-soft);margin-top:14px;}
html[data-theme] body #page-analytics .ana-milestone{background:none!important;border:0!important;border-right:1px solid var(--dg-rule-soft)!important;border-radius:0!important;box-shadow:none!important;padding:15px 16px 15px 0!important;}
#page-analytics .ana-ms-recent .ana-milestone:last-child{border-right:0!important;}
#page-analytics .ana-milestone-label{font-size:var(--t-1);font-weight:800;color:var(--text);}
#page-analytics .ana-milestone-desc{font-size:11px;color:var(--text-dim);margin-top:4px;line-height:1.5;}
html[data-theme] body #page-analytics .ana-ms-details{background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;padding:0!important;}
#page-analytics .ana-ms-section-title{font-size:10px;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;color:var(--text-dim);margin:0 0 4px;}
/* activity: compact contribution heatmap (was a 4-col 86px giant-block grid) */
#page-analytics .ana-calendar{grid-template-columns:repeat(14,1fr)!important;gap:5px!important;}
html[data-theme] body #page-analytics .ana-cal-day{aspect-ratio:1;width:auto!important;height:auto!important;min-width:0!important;min-height:0!important;padding:0!important;border-radius:3px!important;display:block!important;}
#page-analytics .ana-cal-day .ana-cal-num{display:none!important;}
#page-analytics .ana-cal-day-sm{width:13px;height:13px;border-radius:3px;}

@media (max-width:760px){#page-analytics .ana-hero-stats{grid-template-columns:1fr 1fr;}#page-analytics .ana-grid-2col,#page-analytics .ana-ms-grid{grid-template-columns:1fr;}#page-analytics .why-bar-row,#page-analytics .ana-domain-row,#page-analytics .dm-row,#page-analytics .ana-diff-item{grid-template-columns:1fr;}}

/* ════════════════════════════════════════════════════════════════════════
   PER-SURFACE STRUCTURAL RESKIN · Batch 4d · QUIZ (#page-quiz)
   ────────────────────────────────────────────────────────────────────────
   Faithful build of mockups/netplus-quiz-concept.html. The quiz is a STATIC
   shell render() populates (sets text/classes on fixed ids + paints
   #options via renderMCQ/renderMultiSelect/etc + #quiz-prog-dots). Highest-
   focus surface: strip everything that is not the question. Complete scoped
   #page-quiz override -> slim .qbar, question as a TYPOGRAPHIC BLOCK (not a
   card), options as hairline rows (correct = pass-tint + pass rule, not a
   big green soft card), quiet explanation block, bronze Next, calm. Zero
   render-logic change (style only); every onclick/id preserved. The 🔥
   #live-streak prefix (3 JS sites, display-only) + 📦 cache-notice (static
   markup) are stripped separately; ✏️ .revisit-banner-icon is a span ->
   hidden here. 0 emoji · 0 hex. */
#page-quiz{--t-1:12px;--t0:14px;--t1:18px;--t2:23px;--mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;}
html[data-theme] body #page-quiz{background:var(--bg);color:var(--text);}

/* slim quiz bar */
html[data-theme] body #page-quiz .quiz-topbar{display:flex;align-items:center;justify-content:space-between;gap:18px;background:none!important;border:0;border-bottom:1px solid var(--dg-rule-soft);border-radius:0;box-shadow:none;padding:12px 26px;margin:0;}
html[data-theme] body #page-quiz .back-btn{display:inline-flex;align-items:center;gap:7px;background:none!important;border:1px solid var(--border)!important;border-radius:8px!important;color:var(--text-dim)!important;font:600 var(--t-1)/1 Inter,sans-serif;padding:8px 12px!important;cursor:pointer;box-shadow:none!important;}
html[data-theme] body #page-quiz .back-btn:hover{border-color:var(--accent)!important;color:var(--accent)!important;}
#page-quiz .quiz-stats{display:flex;align-items:center;gap:10px;}
html[data-theme] body #page-quiz .stat-pill,html[data-theme] body #page-quiz .flag-btn,html[data-theme] body #page-quiz #cache-notice{display:flex;align-items:center;gap:7px;background:none!important;border:1px solid var(--border)!important;border-radius:999px!important;color:var(--text-mid)!important;font:700 var(--t-1)/1 Inter,sans-serif;padding:6px 12px!important;box-shadow:none!important;font-variant-numeric:tabular-nums;}
html[data-theme] body #page-quiz .flag-btn{border-radius:8px!important;color:var(--text-dim)!important;cursor:pointer;}
html[data-theme] body #page-quiz .flag-btn:hover,html[data-theme] body #page-quiz .flag-btn.flagged{border-color:var(--accent)!important;color:var(--accent)!important;}
html[data-theme] body #page-quiz .stat-pill.streak{color:var(--accent)!important;border-color:color-mix(in oklab,var(--accent) 40%,transparent)!important;}
#page-quiz #cache-notice{display:none;}
#page-quiz #cache-notice.show{display:flex;}

/* progress + pips */
#page-quiz .progress-wrap{max-width:780px;margin:0 auto;padding:24px 26px 0;background:none;border:0;}
#page-quiz .progress-label{display:flex;align-items:center;justify-content:space-between;gap:16px;color:var(--text-dim);font-size:var(--t-1);font-variant-numeric:tabular-nums;}
#page-quiz #q-label,#page-quiz #q-pct{color:var(--text-dim);}
html[data-theme] body #page-quiz .quiz-nav-arrow{width:30px;height:30px;border-radius:50%;border:1px solid var(--border)!important;background:none!important;color:var(--text-dim)!important;display:grid;place-items:center;cursor:pointer;box-shadow:none!important;font-size:var(--t-1);}
html[data-theme] body #page-quiz .quiz-nav-arrow:hover:not(:disabled){border-color:var(--accent)!important;color:var(--accent)!important;}
#page-quiz .quiz-nav-arrow:disabled{opacity:0.4;cursor:default;}
#page-quiz .progress-bar{height:3px;border-radius:2px;background:var(--surface)!important;margin:14px 0 0;overflow:hidden;border:0!important;}
#page-quiz .progress-fill{height:100%;background:var(--accent)!important;border-radius:2px;}
#page-quiz .quiz-prog-dots{display:flex;gap:8px;flex-wrap:wrap;margin:22px 0 0;}
html[data-theme] body #page-quiz .quiz-prog-dots>*{width:28px;height:28px;border-radius:50%;border:1px solid var(--border)!important;background:none!important;display:grid;place-items:center;font-size:var(--t-1);font-weight:700;color:var(--text-dim)!important;font-variant-numeric:tabular-nums;box-shadow:none!important;}
html[data-theme] body #page-quiz .quiz-prog-dots>.correct,html[data-theme] body #page-quiz .quiz-prog-dots>.done{border-color:var(--green)!important;color:var(--green)!important;}
html[data-theme] body #page-quiz .quiz-prog-dots>.wrong{border-color:var(--red)!important;color:var(--red)!important;}
html[data-theme] body #page-quiz .quiz-prog-dots>.current,html[data-theme] body #page-quiz .quiz-prog-dots>.active{background:var(--accent)!important;border-color:var(--accent)!important;color:var(--bg)!important;}

/* the question — typographic block, NOT a card */
html[data-theme] body #page-quiz .q-card{max-width:780px;margin:0 auto;background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;backdrop-filter:none!important;padding:26px 26px 60px!important;}
#page-quiz .q-meta{display:flex;align-items:center;gap:12px;margin-bottom:14px;}
#page-quiz .q-num{font-size:var(--t-1);font-weight:800;color:var(--text-dim);font-variant-numeric:tabular-nums;}
html[data-theme] body #page-quiz .diff-badge{font-size:10px!important;font-weight:800!important;letter-spacing:0.12em!important;text-transform:uppercase!important;color:var(--accent)!important;background:none!important;border:0!important;padding:0!important;border-radius:0!important;}
html[data-theme] body #page-quiz .pbq-badge{font-size:10px;font-weight:800;letter-spacing:0.1em;text-transform:uppercase;color:var(--text-dim);background:none!important;border:1px solid var(--border)!important;border-radius:999px;padding:3px 9px!important;}
html[data-theme] body #page-quiz .q-text{font-size:var(--t2)!important;font-weight:800!important;letter-spacing:-0.02em!important;line-height:1.35!important;color:var(--text)!important;margin-bottom:26px!important;}
html[data-theme] body #page-quiz .q-scenario{background:color-mix(in oklab,var(--accent) 5%,transparent)!important;border:1px solid var(--dg-rule-soft)!important;border-left:2px solid var(--accent)!important;border-radius:10px!important;padding:14px 16px!important;margin-bottom:20px!important;font-size:var(--t-1);color:var(--text-mid);box-shadow:none!important;}

/* options — hairline rows; correct = pass-tint + pass rule (not a big card) */
#page-quiz .options{display:block;}
html[data-theme] body #page-quiz .option{display:flex;align-items:center;gap:16px;width:100%;text-align:left;background:none!important;border:1px solid var(--dg-rule-soft)!important;border-radius:11px!important;padding:16px 18px!important;margin-bottom:11px!important;cursor:pointer;color:var(--text-mid)!important;font:600 var(--t0)/1.45 Inter,sans-serif!important;box-shadow:none!important;transform:none!important;}
html[data-theme] body #page-quiz .option:hover:not(.correct):not(.wrong):not(.reveal-correct){border-color:var(--accent)!important;color:var(--text)!important;background:none!important;}
html[data-theme] body #page-quiz .option .opt-letter,html[data-theme] body #page-quiz .option .ms-checkbox{flex:none;width:28px;height:28px;border-radius:7px;background:var(--surface)!important;display:grid;place-items:center;font-weight:800;font-size:var(--t-1);color:var(--text-dim)!important;border:0!important;}
#page-quiz .option .opt-text{flex:1;min-width:0;}
html[data-theme] body #page-quiz .option.correct,html[data-theme] body #page-quiz .option.reveal-correct{border-color:var(--green)!important;background:color-mix(in oklab,var(--green) 9%,transparent)!important;color:var(--text)!important;}
html[data-theme] body #page-quiz .option.correct .opt-letter,html[data-theme] body #page-quiz .option.reveal-correct .opt-letter,html[data-theme] body #page-quiz .option.correct .ms-checkbox{background:var(--green)!important;color:var(--bg)!important;}
html[data-theme] body #page-quiz .option.wrong{border-color:var(--red)!important;background:color-mix(in oklab,var(--red) 9%,transparent)!important;color:var(--text)!important;}
html[data-theme] body #page-quiz .option.wrong .opt-letter{background:var(--red)!important;color:var(--bg)!important;}
html[data-theme] body #page-quiz .option.exam-selected,html[data-theme] body #page-quiz .option.ms-selected,html[data-theme] body #page-quiz .option.selected{border-color:var(--accent)!important;background:color-mix(in oklab,var(--accent) 8%,transparent)!important;color:var(--text)!important;}

/* explanation — quiet bordered block */
html[data-theme] body #page-quiz .explanation-box{margin-top:18px!important;background:color-mix(in oklab,var(--green) 5%,transparent)!important;border:1px solid var(--dg-rule-soft)!important;border-left:2px solid var(--green)!important;border-radius:10px!important;padding:18px 20px!important;box-shadow:none!important;color:var(--text-mid)!important;}
#page-quiz .explanation-box.is-hidden{display:none!important;}
html[data-theme] body #page-quiz #exp-label{display:block;font-size:var(--t-1);font-weight:800;color:var(--green)!important;margin-bottom:9px;}
#page-quiz #exp-text{font-size:var(--t0);line-height:1.65;color:var(--text-mid);}
#page-quiz #exp-text strong,#page-quiz #exp-box strong{color:var(--text);font-weight:700;}
#page-quiz .exp-wrong-explain{margin-top:10px;color:var(--text-dim);font-size:var(--t-1);}
/* generic ghost for explanation action buttons (Explain Further / Report) */
html[data-theme] body #page-quiz #exp-box button:not(.btn-next){display:inline-flex;align-items:center;gap:7px;border:1px solid var(--border)!important;border-radius:8px!important;padding:9px 13px!important;font:600 var(--t-1)/1 Inter,sans-serif;color:var(--text-dim)!important;background:none!important;box-shadow:none!important;cursor:pointer;margin:0 9px 0 0;}
html[data-theme] body #page-quiz #exp-box button:not(.btn-next):hover{border-color:var(--accent)!important;color:var(--accent)!important;}
#page-quiz #exp-box .resource-link{margin-top:16px;margin-bottom:9px;}
/* the Study link is the PROMINENT accent affordance (mockup .study) — wins
   over the generic ghost above via later source order + equal specificity */
html[data-theme] body #page-quiz #exp-box a,html[data-theme] body #page-quiz #exp-box .study-link,html[data-theme] body #page-quiz #exp-box [class*="study"],html[data-theme] body #page-quiz #exp-box .resource-link button,html[data-theme] body #page-quiz #exp-box .resource-dive-btn{display:inline-flex;align-items:center;gap:8px;border:1px solid color-mix(in oklab,var(--accent) 40%,transparent)!important;border-radius:8px!important;padding:9px 13px!important;font:700 var(--t-1)/1 Inter,sans-serif!important;color:var(--accent)!important;background:color-mix(in oklab,var(--accent) 8%,transparent)!important;text-decoration:none;box-shadow:none!important;cursor:pointer;}
html[data-theme] body #page-quiz #exp-box .resource-link button:hover,html[data-theme] body #page-quiz #exp-box .resource-dive-btn:hover{filter:brightness(1.08);}

/* revisit banner — quiet note; hide the ✏️ icon span */
html[data-theme] body #page-quiz .quiz-revisit-banner{background:none!important;border:0!important;border-top:1px solid var(--dg-rule-soft)!important;border-radius:0!important;box-shadow:none!important;padding:14px 0 0!important;margin-top:16px!important;font-size:var(--t-1);color:var(--text-dim)!important;}
#page-quiz .quiz-revisit-banner.is-hidden{display:none!important;}
#page-quiz .revisit-banner-icon{display:none!important;}

/* Next + keyboard hints */
#page-quiz .next-btn-row{display:flex;justify-content:flex-end;margin-top:24px;}
html[data-theme] body #page-quiz .btn-next{display:inline-flex;align-items:center;gap:9px;background:var(--accent)!important;color:var(--bg)!important;border:0!important;border-radius:10px!important;font:800 var(--t0)/1 Inter,-apple-system,sans-serif!important;padding:15px 26px!important;cursor:pointer;box-shadow:none!important;}
html[data-theme] body #page-quiz .btn-next:hover{filter:brightness(1.05);transform:none;box-shadow:none!important;}
#page-quiz .quiz-kbd-hints{display:flex;align-items:center;justify-content:center;gap:22px;max-width:780px;margin:34px auto 0;font-size:var(--t-1);color:var(--text-dim);flex-wrap:wrap;}
#page-quiz .quiz-kbd-hints span{display:inline-flex;align-items:center;gap:8px;}
html[data-theme] body #page-quiz .quiz-kbd-hints kbd{font:600 10px/1 var(--mono)!important;border:1px solid var(--border)!important;border-bottom-width:2px!important;border-radius:4px!important;padding:4px 6px!important;color:var(--text-mid)!important;background:var(--surface)!important;box-shadow:none!important;}

@media (max-width:680px){#page-quiz .quiz-topbar{padding-left:18px;padding-right:18px;}#page-quiz .q-card,#page-quiz .progress-wrap,#page-quiz .quiz-kbd-hints{padding-left:18px;padding-right:18px;}#page-quiz .q-text{font-size:var(--t1)!important;}#page-quiz .quiz-stats .stat-pill{display:none;}}

/* ────────────────────────────────────────────────────────────────────────
   PER-SURFACE STRUCTURAL RESKIN · Batch 4e · QUIZ RESULTS (#page-results)
   ────────────────────────────────────────────────────────────────────────
   Faithful build of mockups/netplus-quiz-results-concept.html. #page-results
   is a STATIC shell finish() populates (sets #result-headline innerHTML +
   #result-sub/#r-correct/#r-wrong/#r-v2-pct/#r-elapsed/#r-streak/#r-v2-score
   text, toggles #r-v2-verdict .results-v2-verdict-pass|-fail, paints
   #diff-breakdown via renderResultsDifficultyBreakdown + #results-review-list
   via _renderResultsReviewList). The locked mockup de-slops the legacy glossy
   purple gradient hero + radial glow blob + soft-card review list + COLOURED
   PILL verdicts into: score-as-typographic-VERDICT, hairline stat ledger,
   hairline difficulty pair, de-carded hairline review rows with a TEXT
   Correct/Wrong verdict (never a pill), the genuine fail signal on the
   scoped --dg-danger semantic. Complete scoped #page-results override; zero
   render-logic change (style only); every onclick/id preserved. The score
   count-up is the app's existing animateCount('r-v2-score') (the mockup's one
   purposeful motion — already present, not added). Inline emoji CSS can't
   hide (text nodes / innerHTML literals): static 🔥 "Best streak", 📋 #btn-
   review, 🎯 #btn-drill-mistakes (markup) + 🎯 finish() drillBtn.innerHTML
   are stripped separately, display-only, same precedent + 0-emoji bar as the
   prior 4 surfaces. 0 emoji · 0 hex. */
#page-results{--t-1:12px;--t0:14px;--t1:18px;--t2:23px;--t3:30px;--t4:42px;--t5:64px;--mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;}
html[data-theme] body #page-results{background:var(--bg);color:var(--text);}
#page-results [hidden],#page-results .is-hidden{display:none!important;}

/* shell wrap — editorial measure */
#page-results .results-v2{max-width:880px;margin:0 auto;padding:46px 26px 70px;}

/* eyebrow + display heading + lede (kill the legacy hairline ::before) */
html[data-theme] body #page-results .results-v2-eyebrow{display:block;font-size:11px;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;color:var(--accent)!important;font-family:inherit;margin:0 0 4px;}
#page-results .results-v2-eyebrow::before{content:none!important;display:none!important;}
html[data-theme] body #page-results h1.results-v2-display{font-size:var(--t5);font-weight:800;letter-spacing:-0.035em;line-height:1.02;color:var(--text)!important;margin:16px 0 8px;}
html[data-theme] body #page-results .results-v2-display em{font-style:normal;color:var(--accent)!important;font-weight:800;}
html[data-theme] body #page-results .results-v2-lede{font-size:var(--t1);line-height:1.5;color:var(--text-mid)!important;margin:0;max-width:560px;}

/* verdict — typographic, NOT a glossy card (kill gradient/glow/shadow/radius) */
html[data-theme] body #page-results .results-v2-hero{display:grid;grid-template-columns:1.1fr 1fr;gap:0;margin:34px 0 0!important;background:none!important;border:0!important;border-top:1px solid var(--border)!important;border-bottom:1px solid var(--border)!important;border-radius:0!important;box-shadow:none!important;overflow:visible;}
#page-results .results-v2-hero::before{content:none!important;display:none!important;}
html[data-theme] body #page-results .results-v2-big{position:relative;padding:34px 36px 34px 0!important;color:var(--text)!important;border:0!important;border-right:1px solid var(--dg-rule-soft)!important;}
html[data-theme] body #page-results .results-v2-big-label{font-size:10px;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:var(--text-dim)!important;font-family:inherit;margin:0 0 14px;}
html[data-theme] body #page-results .results-v2-big-score{font-size:var(--t5);font-weight:800;letter-spacing:-0.035em;line-height:1;color:var(--text)!important;font-variant-numeric:tabular-nums;display:flex;align-items:baseline;gap:8px;margin:0 0 16px;}
html[data-theme] body #page-results .results-v2-big-score em{font-style:normal;font-size:var(--t2);font-weight:700;color:var(--text-dim)!important;letter-spacing:0;}
html[data-theme] body #page-results .results-v2-verdict{display:inline-flex;align-items:center;gap:8px;font-size:var(--t-1);font-weight:800;font-family:inherit;letter-spacing:0;padding:7px 14px;border-radius:999px;border:1px solid transparent;background:none;}
html[data-theme] body #page-results .results-v2-verdict-pass{color:var(--green)!important;border-color:color-mix(in oklab,var(--green) 40%,transparent)!important;background:color-mix(in oklab,var(--green) 8%,transparent)!important;}
html[data-theme] body #page-results .results-v2-verdict-fail{color:var(--red)!important;border-color:color-mix(in oklab,var(--red) 45%,transparent)!important;background:color-mix(in oklab,var(--red) 8%,transparent)!important;}

/* stat ledger — de-carded hairline column */
html[data-theme] body #page-results .results-v2-side{position:relative;padding:14px 0 14px 36px!important;display:flex;flex-direction:column;gap:0;color:var(--text)!important;background:none!important;}
html[data-theme] body #page-results .results-v2-row{display:flex;justify-content:space-between;align-items:center;padding:11px 0!important;border:0!important;border-bottom:1px solid var(--dg-rule-soft)!important;}
html[data-theme] body #page-results .results-v2-row:last-child{border-bottom:0!important;}
html[data-theme] body #page-results .results-v2-row .k{font-size:10px;font-weight:600;font-family:inherit;letter-spacing:0.04em;text-transform:uppercase;color:var(--text-dim)!important;}
html[data-theme] body #page-results .results-v2-row .v{font-size:var(--t1);font-weight:800;color:var(--text)!important;font-variant-numeric:tabular-nums;letter-spacing:-0.01em;}
html[data-theme] body #page-results .results-v2-row .v#r-correct{color:var(--green)!important;}
html[data-theme] body #page-results .results-v2-row .v#r-wrong{color:var(--red)!important;}

/* difficulty split — hairline pair (override legacy flex + kill .dstat card + rainbow inline color) */
#page-results #diff-breakdown:empty{display:none!important;}
html[data-theme] body #page-results #diff-breakdown.diff-breakdown{display:grid;grid-template-columns:1fr 1fr;gap:0!important;margin:0!important;border-bottom:1px solid var(--border)!important;flex-wrap:nowrap;}
html[data-theme] body #page-results #diff-breakdown .dstat{flex:none;min-width:0;padding:20px 24px!important;background:none!important;border:0!important;border-right:1px solid var(--dg-rule-soft)!important;border-radius:0!important;text-align:center;}
html[data-theme] body #page-results #diff-breakdown .dstat:last-child{border-right:0!important;}
html[data-theme] body #page-results #diff-breakdown .dstat .dv{font-size:var(--t2)!important;font-weight:800;font-variant-numeric:tabular-nums;color:var(--text-dim)!important;}
html[data-theme] body #page-results #diff-breakdown .dstat:first-child .dv{color:var(--accent)!important;}
html[data-theme] body #page-results #diff-breakdown .dstat .dl{font-size:10px;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:var(--text-dim)!important;margin-top:5px;}

/* review — de-carded hairline rows, TEXT verdict (never a coloured pill) */
html[data-theme] body #page-results .results-v2-review{margin-top:46px!important;padding-top:0!important;border-top:0!important;}
#page-results .results-v2-review::before{content:none!important;display:none!important;}
#page-results .results-v2-review-head{margin-bottom:18px;}
html[data-theme] body #page-results .results-v2-review-eyebrow{font-size:11px;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;color:var(--accent)!important;font-family:inherit;margin:0 0 10px;padding-left:0!important;}
#page-results .results-v2-review-eyebrow::before{content:none!important;display:none!important;}
html[data-theme] body #page-results .results-v2-review-title{font-size:var(--t4);font-weight:800;letter-spacing:-0.03em;margin:0;color:var(--text)!important;}
html[data-theme] body #page-results .results-v2-review-title em{font-style:normal;color:var(--accent)!important;}
html[data-theme] body #page-results .results-v2-review-list{display:flex;flex-direction:column;border:0!important;border-radius:0!important;overflow:visible!important;}
html[data-theme] body #page-results .results-v2-review-row{display:grid;grid-template-columns:42px 1fr 96px;gap:18px;align-items:center;padding:16px 4px!important;background:none!important;border:0!important;border-top:1px solid var(--dg-rule-soft)!important;cursor:pointer;text-align:left;font-family:inherit;color:var(--text)!important;transition:padding-left .15s ease;}
html[data-theme] body #page-results .results-v2-review-row:last-child{border-bottom:1px solid var(--dg-rule-soft)!important;}
html[data-theme] body #page-results .results-v2-review-row:hover{padding-left:10px!important;background:none!important;}
html[data-theme] body #page-results .results-v2-review-num{font:700 var(--t-1)/1 var(--mono)!important;color:var(--text-dim)!important;letter-spacing:0;text-transform:none;}
#page-results .results-v2-review-body{min-width:0;}
html[data-theme] body #page-results .results-v2-review-q{font-size:var(--t0);font-weight:600;line-height:1.45;letter-spacing:0;margin-bottom:6px;color:var(--text)!important;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
html[data-theme] body #page-results .results-v2-review-meta{font:700 10px/1.3 inherit!important;color:var(--text-dim)!important;letter-spacing:0.1em;text-transform:uppercase;opacity:1;}
html[data-theme] body #page-results .results-v2-review-mark{justify-self:end;font-size:11px;font-weight:800;font-family:inherit;letter-spacing:0.08em;text-transform:uppercase;padding:0!important;border:0!important;border-radius:0!important;background:none!important;}
html[data-theme] body #page-results .results-v2-review-mark-ok{color:var(--green)!important;}
html[data-theme] body #page-results .results-v2-review-mark-bad{color:var(--red)!important;}
html[data-theme] body #page-results .results-v2-review-empty{padding:26px 0!important;background:none!important;border:0!important;color:var(--text-dim)!important;font-size:var(--t-1);}

/* actions — flex row (kill the dashed accent border-top) */
html[data-theme] body #page-results .results-v2-cta-row{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:40px!important;padding-top:0!important;border-top:0!important;}
#page-results .results-v2-cta-right{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-left:auto;}
html[data-theme] body #page-results .results-v2-cta-row .btn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border)!important;border-radius:9px!important;font:600 var(--t-1)/1 Inter,-apple-system,sans-serif!important;padding:14px 18px!important;cursor:pointer;background:none!important;color:var(--text-mid)!important;box-shadow:none!important;transition:border-color .15s,color .15s;}
html[data-theme] body #page-results .results-v2-cta-row .btn:hover{border-color:var(--accent)!important;color:var(--accent)!important;transform:none;}
html[data-theme] body #page-results .results-v2-cta-row .btn.btn-primary{background:var(--accent)!important;border-color:var(--accent)!important;color:var(--bg)!important;}
html[data-theme] body #page-results .results-v2-cta-row .btn.btn-primary:hover{filter:brightness(1.05);color:var(--bg)!important;}
html[data-theme] body #page-results .results-v2-cta-back{font-size:var(--t-1);}

@media (prefers-reduced-motion: reduce){#page-results .results-v2-review-row,#page-results .results-v2-cta-row .btn{transition:none;}}
@media (max-width:720px){#page-results .results-v2{padding-left:18px;padding-right:18px;}#page-results .results-v2-hero,#page-results #diff-breakdown.diff-breakdown{grid-template-columns:1fr;}#page-results .results-v2-big{border-right:0!important;border-bottom:1px solid var(--dg-rule-soft)!important;padding:24px 0!important;}#page-results .results-v2-side{padding:14px 0!important;}#page-results #diff-breakdown .dstat{border-right:0!important;border-bottom:1px solid var(--dg-rule-soft)!important;}#page-results #diff-breakdown .dstat:last-child{border-bottom:0!important;}#page-results .results-v2-review-row{grid-template-columns:30px 1fr 70px;gap:12px;}html[data-theme] body #page-results h1.results-v2-display{font-size:var(--t4);}#page-results .results-v2-cta-right{margin-left:0;width:100%;}}

/* ────────────────────────────────────────────────────────────────────────
   PER-SURFACE STRUCTURAL RESKIN · Batch 4f · QUIZ LOADING (#page-loading)
   ────────────────────────────────────────────────────────────────────────
   Faithful build of mockups/netplus-quiz-loading-concept.html. The AI-
   generating / loading state shown while fetchQuestions builds the set.
   `#page-loading` is a STATIC skeleton page; app.js only sets #loading-msg
   text + drives #load-bar-fill width via _loadingProgress* (pure DOM) +
   toggles #load-progress / #topic-brief .is-hidden + fills #topic-brief-
   text. The locked mockup de-slops the legacy soft-CARD skeleton (.skel-
   card = surface bg+border+radius+28px = box-in-box) + the .skel-status
   opacity PULSE + the purple .topic-brief into: a chrome-light frame that
   matches the real quiz layout (zero-jump continuity), hairline-neutral
   skeleton placeholders on the real stem/option rhythm, ONE calm transform-
   only shimmer (reduced-motion gated), an honest status line + a THIN
   accent progress bar, de-purpled editorial topic-brief. Complete scoped
   #page-loading override; zero render-logic change (style only); the JS-
   driven #load-bar-fill inline width is left untouched (we only restyle
   bg/height/colour, never set width). The legacy .load-bar-fill::after
   loadBarShimmer is hidden (not removed — styles.css keeps it so UAT
   v4.82.1 guards stay green) for editorial calm. The 📚 #topic-brief h3
   (`&#128218;` — a text node CSS can't hide, NOT UAT-guarded; the 4871
   guard is a different "How to build" string) is stripped separately,
   display-only (static label, never read/compared). 0 emoji · 0 hex. */
#page-loading{--t-1:12px;--t0:14px;--t1:18px;--t2:23px;--t3:30px;--ld-ease:cubic-bezier(0.16,1,0.3,1);}
html[data-theme] body #page-loading{background:var(--bg);color:var(--text);}
#page-loading [hidden],#page-loading .is-hidden{display:none!important;}

/* editorial wrap — same measure as the quiz screen for zero-jump continuity */
#page-loading .skeleton-loader{max-width:780px;margin:0 auto;padding:54px 26px 60px;}

/* skeleton base — hairline-neutral fill + ONE calm transform-only shimmer */
html[data-theme] body #page-loading .skel-block{background:color-mix(in oklab,var(--text) 7%,transparent)!important;border-radius:6px!important;position:relative;overflow:hidden;}
#page-loading .skel-block::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,color-mix(in oklab,var(--text) 6%,transparent),transparent);animation:skelShimmer 1.5s var(--ld-ease) infinite;}
@media (prefers-reduced-motion: reduce){#page-loading .skel-block::after{display:none!important;}}

/* topbar skeleton — slim hairline row, calm (quiz qbar rhythm; the real
   global chrome is the separately-flagged surface, not rebuilt here) */
#page-loading .skel-topbar{display:flex;align-items:center;gap:14px;margin:0 0 26px;padding:0 0 16px;border-bottom:1px solid var(--dg-rule-soft);}
html[data-theme] body #page-loading .skel-back{width:64px;height:30px;border-radius:7px!important;}
html[data-theme] body #page-loading .skel-pill{width:96px;height:14px;border-radius:5px!important;}
#page-loading .skel-pill:last-child{margin-left:0;}
#page-loading .skel-pill:first-of-type{margin-left:auto;}

/* progress placeholder — thin hairline (matches the quiz progress position) */
#page-loading .skel-progress{margin:0 0 30px;}
html[data-theme] body #page-loading .skel-bar{width:100%;height:4px;border-radius:3px!important;}

/* DE-CARD the skeleton card — the box-in-box kill (mockup has no card) */
html[data-theme] body #page-loading .skel-card{background:none!important;border:0!important;border-radius:0!important;padding:0!important;box-shadow:none!important;}

/* meta + stem rhythm — exactly the mockup .sk-meta / .sk-stem.w1/.w2 */
html[data-theme] body #page-loading .skel-badge-row{width:120px;height:14px;border-radius:5px!important;margin:0 0 22px;}
html[data-theme] body #page-loading .skel-title{width:78%;height:22px;margin:0 0 10px;}
html[data-theme] body #page-loading .skel-title-short{width:54%;height:22px;margin:0 0 30px;}

/* options — hairline 56px rows, the real quiz .opt rhythm (continuity) */
html[data-theme] body #page-loading .skel-option{width:100%;height:56px;margin:0 0 11px;border:1px solid var(--dg-rule-soft)!important;border-radius:11px!important;background:none!important;}
#page-loading .skel-option::after{display:none!important;}
#page-loading .skel-option:last-child{margin-bottom:0;}

/* status line — honest, calm (kill the legacy skelPulse opacity animation) */
html[data-theme] body #page-loading .skel-status{margin:44px 0 0!important;text-align:center;font-size:var(--t1)!important;font-weight:700!important;letter-spacing:-0.01em;color:var(--text-mid)!important;animation:none!important;opacity:1!important;}

/* progress block — thin accent bar + dim sub (mockup .status .pbar/.sub) */
#page-loading .load-progress{margin:22px auto 0!important;max-width:360px!important;}
html[data-theme] body #page-loading .load-bar{height:4px!important;background:var(--surface)!important;border:0!important;border-radius:3px!important;overflow:hidden;}
html[data-theme] body #page-loading .load-bar-fill{background:var(--accent)!important;border-radius:3px!important;transition:width 1.6s var(--ld-ease);}
#page-loading .load-bar-fill::after{display:none!important;}
html[data-theme] body #page-loading #load-progress-label{margin-top:14px!important;font-size:var(--t-1)!important;color:var(--text-dim)!important;text-align:center;font-weight:600;}

/* topic-brief — de-purpled, de-carded, editorial (kill rgba(124,111,247)
   bg + accent-dim border + accent-light h3) */
html[data-theme] body #page-loading .topic-brief{margin:34px auto 0!important;max-width:560px!important;background:none!important;border:0!important;border-top:1px solid var(--dg-rule-soft)!important;border-radius:0!important;padding:22px 0 0!important;text-align:left;}
html[data-theme] body #page-loading .topic-brief h3{font-size:11px!important;font-weight:700!important;letter-spacing:0.16em;text-transform:uppercase;color:var(--accent)!important;margin:0 0 11px!important;}
html[data-theme] body #page-loading .topic-brief-text{font-size:var(--t0)!important;line-height:1.7;color:var(--text-mid)!important;}

@media (max-width:680px){#page-loading .skeleton-loader{padding-left:18px;padding-right:18px;}}

   PER-SURFACE STRUCTURAL RESKIN · Batch 4h · PAYWALL / PRO-GATE MODAL
   (.quota-exceeded-modal — shared by _showProOnlyUI + the daily-quota
   -exceeded twin; both appended to <body>, no #page- ancestor)
   ────────────────────────────────────────────────────────────────────────
   No locked mockup — redesigned with the taste-skill (editorial-premium)
   per founder directive. The legacy modal is textbook AI-slop: a ⚡ emoji
   in a red-tinted glow square, a soft red-bordered card with a heavy 0 20px
   60px shadow, and a hardcoded PURPLE gradient CTA (#5b4fdb→#7c6ff7 — the
   #1 editorial-premium AI-tell). One job: state the value, upgrade or
   dismiss. Editorial: de-card to a calm hairline card on a quiet backdrop,
   hide the decorative emoji icon (it's a dedicated div — CSS-hidden, zero
   render change), typographic title, bronze --accent CTA (matches every
   other primary in the rebrand), editorial ghost dismiss. Pure CSS, scoped
   to the modal's own class so it covers BOTH the pro-gate and the quota
   twin (same slop, same fix — desirable). 0 emoji · 0 hex. */
html[data-theme] body .quota-exceeded-modal{background:color-mix(in oklab,var(--bg) 72%,#000)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;}
html[data-theme] body .quota-exceeded-card{background:var(--bg)!important;border:1px solid var(--border)!important;border-radius:14px!important;box-shadow:none!important;padding:34px 32px!important;max-width:460px!important;text-align:left!important;}
html[data-theme] body .quota-exceeded-icon,html[data-theme] body .pro-only-icon{display:none!important;}
html[data-theme] body .quota-exceeded-card::before{content:"PRO";display:inline-block;font-size:10px;font-weight:700;letter-spacing:0.18em;color:var(--accent);margin-bottom:14px;}
html[data-theme] body .quota-exceeded-title{font-size:24px!important;font-weight:800!important;letter-spacing:-0.02em;color:var(--text)!important;margin-bottom:10px!important;line-height:1.2;}
html[data-theme] body .quota-exceeded-sub{font-size:14px!important;color:var(--text-mid)!important;line-height:1.6;margin-bottom:24px!important;}
html[data-theme] body .quota-exceeded-sub strong{color:var(--text)!important;font-weight:700;}
html[data-theme] body .quota-exceeded-actions{display:flex;gap:12px;justify-content:flex-start!important;flex-wrap:wrap;}
html[data-theme] body .quota-exceeded-cta{display:inline-flex;align-items:center;gap:8px;background:var(--accent)!important;color:var(--bg)!important;padding:13px 22px!important;font-size:13px;font-weight:800;border-radius:9px!important;text-decoration:none;border:0;cursor:pointer;box-shadow:none!important;transition:filter .15s ease;}
html[data-theme] body .quota-exceeded-cta:hover{filter:brightness(1.05);transform:none!important;color:var(--bg)!important;}
html[data-theme] body .quota-exceeded-dismiss{background:none!important;color:var(--text-dim)!important;border:1px solid var(--border)!important;padding:13px 20px!important;font-size:13px;font-weight:600;border-radius:9px!important;cursor:pointer;font-family:inherit;transition:border-color .15s ease,color .15s ease;}
html[data-theme] body .quota-exceeded-dismiss:hover{border-color:var(--accent)!important;color:var(--accent)!important;}
@media (prefers-reduced-motion: reduce){html[data-theme] body .quota-exceeded-cta,html[data-theme] body .quota-exceeded-dismiss{transition:none!important;}}

/* ════════════════════════════════════════════════════════════════════════
   PER-SURFACE STRUCTURAL RESKIN · Batch 4l · SETTINGS  (#page-settings)
   ════════════════════════════════════════════════════════════════════════
   Applies the account-page-concept.html editorial SYSTEM (founder choice:
   reskin the REAL settings surface, not build the net-new account product)
   onto the existing #page-settings content — Study setup health / Exam date
   / Daily goal / Data & backups / Danger zone. De-cards the .card sections
   into hairline editorial sections + left-aligned label/value rows (mockup
   .s-head/.s-no/.defrow/.subhead/.btn/.lnk language), keeps the existing
   numbered §-group structure (it already matched the mockup's numbered
   sections), maps the danger zone onto ONE scoped --dg-danger token used
   ONLY for the destructive zone (the mockup's impeccable discipline). Pure
   scoped CSS over the existing DOM + emitted render markup; every id/onclick
   preserved; styles.css untouched (its #page-settings/.settings-* CSS guards
   stay green) → no UAT migration. Theme-safe tokens (no var(--surface) for
   subtle elevation — the v4.99.75 dark near-white lesson). 0 emoji · 0 hex
   in colour values. */
#page-settings{--t-1:12px;--t0:14px;--t1:18px;--t2:24px;--t3:34px;--dg-danger:oklch(0.66 0.17 25);}
html[data-theme="light"] #page-settings{--dg-danger:oklch(0.52 0.19 25);}

/* editorial page header — eyebrow + display + ghost back (mockup .eyebrow/h1).
   Kill the legacy purple + decorative ::before glyph (the ACL-Builder catch). */
html[data-theme] body #page-settings .ed-pagehead{background:none!important;border:0!important;box-shadow:none!important;padding:38px 0 0!important;}
html[data-theme] body #page-settings .ed-pagehead-eyebrow{color:var(--accent)!important;font-size:var(--t-1)!important;font-weight:700!important;letter-spacing:0.18em!important;text-transform:uppercase!important;}
#page-settings .ed-pagehead-eyebrow::before{content:none!important;display:none!important;}
#page-settings .ed-pagehead::after,#page-settings .ed-pagehead::before{content:none!important;display:none!important;background:none!important;}
html[data-theme] body #page-settings .ed-pagehead-display{font-size:var(--t3)!important;font-weight:800!important;letter-spacing:-0.025em!important;color:var(--text)!important;margin-top:10px!important;outline:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;padding:0!important;background:none!important;}
html[data-theme] body #page-settings .ed-pagehead-display em{color:var(--accent)!important;font-style:normal!important;background:none!important;-webkit-text-fill-color:var(--accent)!important;}
html[data-theme] body #page-settings .ed-pagehead-back{background:none!important;border:1px solid var(--border)!important;border-radius:8px!important;color:var(--text-dim)!important;font:600 var(--t-1)/1 Inter,sans-serif!important;padding:8px 12px!important;box-shadow:none!important;}
html[data-theme] body #page-settings .ed-pagehead-back:hover{border-color:var(--accent)!important;color:var(--accent)!important;}

/* layout measure + section rhythm (mockup .wrap / section) */
#page-settings .settings-layout{max-width:760px;margin:0 auto;padding:0 4px 96px;}
#page-settings .settings-group{margin-top:52px;}
#page-settings .settings-group[data-group]:first-of-type{margin-top:40px;}

/* group head → mockup .s-head (baseline flex + hairline rule) */
html[data-theme] body #page-settings .settings-group-head{display:flex!important;align-items:baseline!important;gap:14px!important;padding:0 0 14px!important;border-bottom:1px solid var(--dg-rule-soft)!important;background:none!important;margin:0!important;}
html[data-theme] body #page-settings .settings-group-num{font-size:var(--t-1)!important;font-weight:700!important;letter-spacing:0.12em!important;text-transform:uppercase!important;color:var(--text-dim)!important;flex:none;}
#page-settings .settings-group-titles{display:flex;flex-direction:column;gap:8px;min-width:0;}
html[data-theme] body #page-settings .settings-group-h{font-size:var(--t2)!important;font-weight:800!important;letter-spacing:-0.02em!important;color:var(--text)!important;margin:0!important;}
html[data-theme] body #page-settings .settings-group-h em{color:var(--accent)!important;font-style:normal!important;background:none!important;-webkit-text-fill-color:var(--accent)!important;}
html[data-theme] body #page-settings .settings-group-sub{font-size:var(--t-1)!important;color:var(--text-dim)!important;margin:0!important;max-width:70ch;line-height:1.55;}

/* de-card every .settings-section (mockup has NO inner cards) */
html[data-theme] body #page-settings .settings-section,html[data-theme] body #page-settings .card.settings-section{background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;padding:18px 0 0!important;margin:0!important;}
html[data-theme] body #page-settings .settings-section-title{font-size:10px!important;font-weight:700!important;letter-spacing:0.14em!important;text-transform:uppercase!important;color:var(--text-dim)!important;margin:6px 0 4px!important;}
html[data-theme] body #page-settings .settings-health-eyebrow{color:var(--text-dim)!important;font-weight:600!important;letter-spacing:0!important;text-transform:none!important;}
html[data-theme] body #page-settings .settings-section-hint{font-size:var(--t-1)!important;color:var(--text-dim)!important;max-width:70ch;line-height:1.55;}
html[data-theme] body #page-settings .settings-section-hint strong{color:var(--text-mid)!important;font-weight:700;}

/* §01 health card → de-carded hairline label/value rows (mockup .defrow);
   icon glyph span hidden, tier conveyed by semantic value colour */
#page-settings .settings-health-grid{display:block!important;}
html[data-theme] body #page-settings .settings-health-row{display:flex!important;align-items:center!important;gap:16px!important;padding:14px 2px!important;border-bottom:1px solid var(--dg-rule-soft)!important;background:none!important;border-radius:0!important;}
#page-settings .settings-health-grid .settings-health-row:last-child{border-bottom:0!important;}
#page-settings .settings-health-icon{display:none!important;}
html[data-theme] body #page-settings .settings-health-text{display:flex!important;align-items:baseline!important;gap:18px!important;flex-wrap:wrap!important;min-width:0;}
html[data-theme] body #page-settings .settings-health-label{font-size:var(--t-1)!important;font-weight:700!important;letter-spacing:0.04em!important;text-transform:uppercase!important;color:var(--text-dim)!important;min-width:120px;}
html[data-theme] body #page-settings .settings-health-value{font-size:var(--t0)!important;color:var(--text)!important;}
html[data-theme] body #page-settings .settings-health-ok .settings-health-value{color:var(--green)!important;}
html[data-theme] body #page-settings .settings-health-mid .settings-health-value{color:var(--accent)!important;}
html[data-theme] body #page-settings .settings-health-warn .settings-health-value{color:var(--text-dim)!important;}

/* exam-date row + daily-goal editor (shared exam chip already editorial via
   the Batch-4 foundation — only tune the local container + the goal input) */
#page-settings .settings-exam-row{margin:14px 0 0;}
/* shared exam-date chip — hide the decorative 🎯 icon span + editorialise
   (mirrors the Analytics v4.99.67 scoped treatment; scoped so Home/Analytics
   keep their own; the icon is a <span> → CSS-hide = zero render change) */
#page-settings .ana-ready-datechip-icon{display:none!important;}
html[data-theme] body #page-settings .ana-ready-datechip,html[data-theme] body #page-settings .ana-exam-date-btn{background:none!important;border:1px solid var(--border)!important;border-radius:8px!important;box-shadow:none!important;color:var(--text-dim)!important;}
html[data-theme] body #page-settings .ana-ready-datechip:hover,html[data-theme] body #page-settings .ana-exam-date-btn:hover{border-color:var(--accent)!important;color:var(--accent)!important;}
#page-settings .ana-ready-datechip-days,#page-settings .ana-ready-datechip-date{color:var(--text-mid)!important;}
html[data-theme] body #page-settings .settings-daily-row{display:flex!important;align-items:center!important;gap:12px!important;flex-wrap:wrap!important;margin:14px 0 0!important;}
html[data-theme] body #page-settings .settings-daily-input{background:none!important;border:1px solid var(--border)!important;border-radius:8px!important;color:var(--text)!important;font:600 var(--t0)/1 Inter,sans-serif!important;padding:11px 12px!important;width:96px!important;box-shadow:none!important;}
html[data-theme] body #page-settings .settings-daily-input:focus{border-color:var(--accent)!important;outline:none!important;}
html[data-theme] body #page-settings .settings-daily-unit{font-size:var(--t-1)!important;color:var(--text-dim)!important;}
html[data-theme] body #page-settings .settings-daily-save{background:var(--accent)!important;color:var(--bg)!important;border:0!important;border-radius:9px!important;font:700 var(--t-1)/1 Inter,sans-serif!important;padding:12px 18px!important;box-shadow:none!important;}
html[data-theme] body #page-settings .settings-daily-save:hover{filter:brightness(1.06)!important;}
#page-settings .settings-daily-presets{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 0;}
html[data-theme] body #page-settings .settings-daily-chip{background:none!important;border:1px solid var(--dg-rule-soft)!important;border-radius:7px!important;color:var(--text-dim)!important;font:600 var(--t-1)/1 Inter,sans-serif!important;padding:8px 13px!important;box-shadow:none!important;}
html[data-theme] body #page-settings .settings-daily-chip:hover{border-color:var(--border)!important;color:var(--text)!important;}
html[data-theme] body #page-settings .settings-daily-chip.is-active{background:color-mix(in oklab,var(--accent) 14%,transparent)!important;border-color:var(--accent)!important;color:var(--accent)!important;}

/* §02 data & backups — editorial ghost buttons + de-carded backup rows */
html[data-theme] body #page-settings .settings-section .btn.btn-ghost{background:none!important;border:1px solid var(--border)!important;border-radius:9px!important;color:var(--text-mid)!important;font-weight:600!important;box-shadow:none!important;}
html[data-theme] body #page-settings .settings-section .btn.btn-ghost:hover{border-color:var(--accent)!important;color:var(--accent)!important;}
#page-settings .autobackup-list{margin:14px 0 0;}
html[data-theme] body #page-settings .ab-empty{font-size:var(--t-1)!important;color:var(--text-dim)!important;padding:14px 2px!important;background:none!important;border:0!important;}
html[data-theme] body #page-settings .ab-row{display:flex!important;align-items:center!important;gap:16px!important;padding:16px 2px!important;border-bottom:1px solid var(--dg-rule-soft)!important;background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;}
html[data-theme] body #page-settings .ab-row:last-child{border-bottom:0!important;}
#page-settings .ab-row-info{flex:1;min-width:0;}
html[data-theme] body #page-settings .ab-row-date{font-size:var(--t0)!important;font-weight:700!important;color:var(--text)!important;}
html[data-theme] body #page-settings .ab-row-meta{margin-top:4px!important;font-size:11px!important;color:var(--text-dim)!important;font-family:var(--mono,ui-monospace,"SF Mono",Menlo,Consolas,monospace);}
#page-settings .ab-row-actions{display:flex;gap:8px;flex:none;}
html[data-theme] body #page-settings .ab-row-actions .btn{background:none!important;border:1px solid var(--border)!important;border-radius:8px!important;color:var(--text-mid)!important;font:600 11px/1 Inter,sans-serif!important;padding:9px 13px!important;box-shadow:none!important;}
html[data-theme] body #page-settings .ab-row-actions .btn:hover{border-color:var(--accent)!important;color:var(--accent)!important;}

/* §03 danger zone → mockup .danger-zone (the ONLY --dg-danger surface) */
html[data-theme] body #page-settings .settings-group-danger{margin-top:52px!important;border:1px solid color-mix(in oklab,var(--dg-danger) 40%,transparent)!important;border-radius:12px!important;padding:22px 24px!important;background:none!important;}
html[data-theme] body #page-settings .settings-group-head-danger{border-bottom:0!important;padding-bottom:0!important;}
html[data-theme] body #page-settings .settings-group-danger .settings-group-num{color:var(--dg-danger)!important;}
html[data-theme] body #page-settings .settings-group-danger .settings-group-h{font-size:var(--t1)!important;color:var(--dg-danger)!important;}
html[data-theme] body #page-settings .settings-group-danger .settings-group-h em{color:var(--dg-danger)!important;-webkit-text-fill-color:var(--dg-danger)!important;}
html[data-theme] body #page-settings .settings-section-danger{padding-top:14px!important;}
html[data-theme] body #page-settings #wrong-bank-clear{background:none!important;border:1px solid var(--dg-danger)!important;border-radius:10px!important;color:var(--dg-danger)!important;font-weight:700!important;box-shadow:none!important;}
html[data-theme] body #page-settings #wrong-bank-clear:hover{background:color-mix(in oklab,var(--dg-danger) 12%,transparent)!important;border-color:var(--dg-danger)!important;color:var(--dg-danger)!important;}
html[data-theme] body #page-settings .wrong-count-badge{background:color-mix(in oklab,var(--dg-danger) 16%,transparent)!important;color:var(--dg-danger)!important;border:0!important;font-weight:700;}

/* ══════════════════════════════════════════════════════════════════════════
   BATCH 5s — SIDEBAR + TOPBAR PANEL editorial rebrand (v4.99.86)
   Global chrome visible on all ~30 pages. De-purples light mode, replaces
   Unicode glyph icons with monoline SVG, editorial bronze accent, hairline
   layout. Scoped via #app-sidebar / #app-topbar / .app-sidebar / .app-topbar.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Sidebar base ── */
html[data-theme] body #app-sidebar{background:var(--bg)!important;border-right:1px solid var(--border)!important;}
html[data-theme] body .app-sidebar{background:var(--bg)!important;border-right:1px solid var(--border)!important;}

/* ── Brand mark de-purple ── */
html[data-theme] body .sb-brand-mark{border-radius:9px!important;border:1px solid var(--border)!important;background:none!important;}
html[data-theme] body .sb-brand-c{stroke:var(--accent)!important;}
html[data-theme] body .sb-brand-slash{stroke:var(--text-dim)!important;}
html[data-theme] body .sb-brand-a{stroke:var(--accent)!important;}
html[data-theme] body .sb-brand-cert{color:var(--accent)!important;}

/* ── Section labels ── */
html[data-theme] body .sb-section-label{font-size:10px!important;font-weight:700!important;letter-spacing:0.14em!important;text-transform:uppercase!important;color:var(--text-dim)!important;}

/* ── Nav items ── */
html[data-theme] body .sb-item{border-radius:8px!important;font-size:13px!important;font-weight:500!important;color:var(--text-mid,var(--text-dim))!important;transition:background 0.12s ease,color 0.12s ease!important;}
html[data-theme] body .sb-item:hover{background:color-mix(in oklab,var(--accent) 7%,transparent)!important;color:var(--text)!important;}
html[data-theme] body .sb-item.sb-item-active{background:color-mix(in oklab,var(--accent) 12%,transparent)!important;color:var(--text)!important;}
html[data-theme] body .sb-item.sb-item-active::before{background:var(--accent)!important;}

/* ── Nav item SVG icons ── */
html[data-theme] body .sb-item-icon{width:18px!important;height:18px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;font-size:0!important;line-height:0!important;}
html[data-theme] body .sb-item-icon svg{width:16px!important;height:16px!important;color:var(--text-dim)!important;}
html[data-theme] body .sb-item.sb-item-active .sb-item-icon svg{color:var(--accent)!important;}
html[data-theme] body .sb-item:hover .sb-item-icon svg{color:var(--text)!important;}

/* ── Pro lock badge ── */
html[data-theme] body .sb-item-lock{font-size:9px!important;font-weight:800!important;letter-spacing:0.1em!important;text-transform:uppercase!important;color:var(--accent)!important;opacity:0.7!important;background:none!important;border:0!important;border-radius:0!important;padding:0!important;}

/* ── Streak footer · v5.5.8 redesign ──
   Founder: the legacy element is "ugly" — styles.css .sb-streak is a dark
   gradient pill (linear-gradient(135deg,#1e1b2e,#0f0c1b)) marooned in the
   light hairline editorial sidebar (card-spam in a de-carded system). The
   v4.99.86 rebrand only recoloured the num/label + hid the old flame; it
   never de-carded the container. styles.css is left UNTOUCHED (the
   v4.54.10 css guards 6448/6450/6452 read styles.css → stay green, no
   migration) — this scoped block de-cards it to an editorial hairline
   footer with the founder's brand flame. taste-skill; the v4.99.86
   sidebar language. Beats styles.css via html[data-theme] body + later
   source + !important (the established sidebar override pattern). */
html[data-theme] body .sb-streak{display:flex!important;align-items:center!important;gap:13px!important;width:100%!important;text-align:left!important;background:none!important;border:0!important;border-top:1px solid var(--border)!important;border-radius:0!important;box-shadow:none!important;padding:16px 14px 14px!important;margin:0!important;color:var(--text)!important;cursor:pointer;}
html[data-theme] body .sb-streak.sb-streak-empty{cursor:default;}
html[data-theme] body .sb-streak .sb-streak-flame{display:none!important;}
html[data-theme] body .sb-streak-ico{flex:none!important;width:30px!important;height:30px!important;display:grid!important;place-items:center!important;color:var(--accent)!important;filter:none!important;}
html[data-theme] body .sb-streak-ico svg{width:26px!important;height:26px!important;}
html[data-theme] body .sb-streak-text{display:flex!important;flex-direction:column!important;gap:2px!important;min-width:0!important;flex:1!important;}
html[data-theme] body .sb-streak-top{display:flex!important;align-items:baseline!important;gap:7px!important;}
html[data-theme] body .sb-streak-num{font-family:'Fraunces',Georgia,serif!important;font-size:26px!important;font-weight:600!important;line-height:1!important;letter-spacing:-0.02em!important;color:var(--accent)!important;}
html[data-theme] body .sb-streak-label{font-family:Inter,-apple-system,sans-serif!important;font-size:10.5px!important;font-weight:800!important;letter-spacing:0.13em!important;text-transform:uppercase!important;color:var(--text-dim)!important;}
html[data-theme] body .sb-streak-sub{font-size:11px!important;color:var(--text-dim)!important;font-variant-numeric:tabular-nums!important;}
html[data-theme] body .sb-streak-sub b{color:var(--text-mid)!important;font-weight:650!important;}
html[data-theme] body .sb-streak-empty{color:var(--text-dim)!important;}
html[data-theme] body .sb-streak-empty .sb-streak-ico{color:var(--text-dim)!important;opacity:0.55!important;}
html[data-theme] body .sb-streak-empty .sb-streak-core{fill:none!important;stroke:currentColor!important;opacity:0.6!important;}
html[data-theme] body .sb-streak-empty-t{font-size:12.5px!important;font-weight:700!important;color:var(--text-mid)!important;}
html[data-theme] body .sb-streak-empty-s{font-size:11px!important;color:var(--text-dim)!important;margin-top:2px!important;}
html[data-theme] body .sb-streak.sb-streak-active{transition:background 0.16s ease,transform 0.14s ease!important;}
@media (hover:hover) and (pointer:fine){html[data-theme] body .sb-streak.sb-streak-active:hover{background:color-mix(in oklab,var(--accent) 7%,transparent)!important;transform:none!important;box-shadow:none!important;}}
html[data-theme] body .sb-streak.sb-streak-active:active{transform:scale(0.99)!important;box-shadow:none!important;}
@media (prefers-reduced-motion:reduce){html[data-theme] body .sb-streak,html[data-theme] body .sb-streak.sb-streak-active{transition:none!important;transform:none!important;}}

/* ── SW update toast · v5.5.9 redesign ──
   Founder: the "New version available" banner is off-system. styles.css
   .sw-update-banner styles a white button as color:var(--accent2,#5b4fdb)
   → the PURPLE "Refresh" the rebrand stripped, on a flat gradient card.
   styles.css is UNTOUCHED (UAT 16400/16404/16409/16410/16412 stay green,
   no migration) — this scoped block de-purples + de-gradients it into an
   editorial toast with the brand sync-arrows. The banner is appended to
   <body> (NOT #page-setup) so global dg tokens are used and easing is a
   LITERAL cubic-bezier (var(--dgh-ease) is #page-setup-scoped — a non-
   ancestor var() would invalidate the declaration: the v5.5.4 lesson).
   taste-skill + emil-design-eng. Beats styles.css via html[data-theme]
   body + later source + !important (the v5.5.8 global-chrome pattern). */
html[data-theme] body .sw-update-banner{background:var(--surface)!important;color:var(--text)!important;border:1px solid var(--border)!important;border-radius:14px!important;box-shadow:0 1px 0 color-mix(in oklab,var(--text) 4%,transparent),0 18px 40px -16px color-mix(in oklab,var(--text) 24%,transparent)!important;gap:14px!important;animation:swBannerEditorialIn 0.36s cubic-bezier(0.16,1,0.3,1)!important;}
html[data-theme] body .sw-banner-icon{flex:none!important;width:38px!important;height:38px!important;display:grid!important;place-items:center!important;border-radius:10px!important;color:var(--accent)!important;background:color-mix(in oklab,var(--accent) 9%,transparent)!important;border:1px solid color-mix(in oklab,var(--accent) 22%,var(--border))!important;font-size:0!important;}
html[data-theme] body .sw-banner-icon svg{width:22px!important;height:22px!important;}
html[data-theme] body .sw-banner-title{color:var(--text)!important;font-weight:700!important;font-size:14px!important;letter-spacing:-0.005em!important;}
html[data-theme] body .sw-banner-sub{color:var(--text-dim)!important;font-size:12px!important;}
html[data-theme] body .sw-banner-cta{background:var(--accent)!important;color:var(--bg)!important;border:1px solid color-mix(in oklab,var(--accent) 60%,var(--text))!important;padding:9px 18px!important;border-radius:10px!important;font-weight:700!important;font-size:13px!important;transition:transform 0.15s cubic-bezier(0.16,1,0.3,1),filter 0.16s ease!important;}
html[data-theme] body .sw-banner-cta:active{transform:scale(0.97)!important;}
html[data-theme] body .sw-banner-dismiss{color:var(--text-dim)!important;border-radius:7px!important;transition:color 0.15s ease,background 0.15s ease!important;}
@media (hover:hover) and (pointer:fine){
  html[data-theme] body .sw-banner-cta:hover{filter:brightness(1.06)!important;transform:translateY(-1px)!important;}
  html[data-theme] body .sw-banner-dismiss:hover{color:var(--text)!important;background:color-mix(in oklab,var(--accent) 10%,transparent)!important;}
}
@keyframes swBannerEditorialIn{from{opacity:0;transform:translateY(16px) scale(0.98);}to{opacity:1;transform:none;}}
@media (prefers-reduced-motion:reduce){
  @keyframes swBannerEditorialIn{from{opacity:0;}to{opacity:1;}}
  html[data-theme] body .sw-update-banner{animation:swBannerEditorialIn 0.2s ease!important;}
  html[data-theme] body .sw-banner-cta,html[data-theme] body .sw-banner-dismiss{transition:none!important;}
  html[data-theme] body .sw-banner-cta:hover{transform:none!important;}
}

/* ── TOPBAR ── */
html[data-theme] body #app-topbar{border-bottom:1px solid var(--border)!important;background:var(--bg)!important;}
html[data-theme] body .app-topbar{border-bottom:1px solid var(--border)!important;background:var(--bg)!important;}

/* ── Topbar icon buttons ── */
html[data-theme] body .topbar-iconbtn{width:30px!important;height:30px!important;border-radius:7px!important;border:1px solid var(--border)!important;background:none!important;color:var(--text-dim)!important;display:inline-grid!important;place-items:center!important;font-size:0!important;line-height:0!important;transition:border-color 0.12s ease,color 0.12s ease!important;}
html[data-theme] body .topbar-iconbtn:hover{border-color:var(--accent)!important;color:var(--accent)!important;}
html[data-theme] body .topbar-iconbtn svg{width:15px!important;height:15px!important;}

/* ── Topbar toggle (hamburger) ── */
html[data-theme] body .topbar-toggle{border:1px solid var(--border)!important;border-radius:7px!important;background:none!important;color:var(--text-dim)!important;transition:border-color 0.12s ease,color 0.12s ease!important;}
html[data-theme] body .topbar-toggle:hover{border-color:var(--accent)!important;color:var(--accent)!important;}

/* ── Topbar breadcrumb ── */
html[data-theme] body .topbar-crumb{font-size:13px!important;font-weight:600!important;color:var(--text-mid,var(--text-dim))!important;letter-spacing:-0.01em!important;}

/* ── Topbar countdown chip (dot indicator, no emoji) ── */
html[data-theme] body .topbar-countdown{border:1px solid var(--border)!important;border-radius:6px!important;background:none!important;color:var(--text-mid,var(--text-dim))!important;font-size:11px!important;font-weight:700!important;transition:border-color 0.12s ease!important;}
html[data-theme] body .topbar-countdown:hover{border-color:var(--accent)!important;}
html[data-theme] body .topbar-countdown-dot{width:6px!important;height:6px!important;border-radius:50%!important;display:inline-block!important;flex:none!important;}
html[data-theme] body .topbar-countdown-ok .topbar-countdown-dot{background:var(--green)!important;}
html[data-theme] body .topbar-countdown-soon .topbar-countdown-dot{background:var(--yellow,oklch(0.80 0.14 70))!important;}
html[data-theme] body .topbar-countdown-urgent .topbar-countdown-dot{background:var(--red,oklch(0.66 0.17 25))!important;}
html[data-theme] body .topbar-countdown-past .topbar-countdown-dot{background:var(--green)!important;}
/* Hide legacy ico span if it still renders */
html[data-theme] body .topbar-countdown-ico{display:none!important;}

/* ── Topbar time ── */
html[data-theme] body .topbar-time{font-size:11px!important;font-weight:500!important;color:var(--text-dim)!important;}

/* ── Topbar quota chip ── */
html[data-theme] body .topbar-quota-chip{border:1px solid var(--border)!important;border-radius:5px!important;background:none!important;font-size:11px!important;font-weight:600!important;color:var(--text-dim)!important;}
html[data-theme] body .topbar-quota-chip .quota-chip-icon{display:none!important;}

/* ── Topbar version pill ── */
html[data-theme] body .topbar-version-pill{font-size:10px!important;font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace!important;color:var(--text-dim)!important;letter-spacing:.04em!important;}

/* ── Light mode sidebar de-purple ── */
html[data-theme="light"] body .app-sidebar,html[data-theme="light"] body #app-sidebar{background:var(--bg)!important;}
html[data-theme="light"] body .sb-item:hover{background:color-mix(in oklab,var(--accent) 7%,transparent)!important;color:var(--text)!important;}
html[data-theme="light"] body .sb-item.sb-item-active{background:color-mix(in oklab,var(--accent) 12%,transparent)!important;color:var(--text)!important;}
html[data-theme="light"] body .sb-item.sb-item-active::before{background:var(--accent)!important;}

/* ══════════════════════════════════════════════════════════════════════
   Batch 8 — EXAM MODE + EXAM RESULTS + REVIEW + DRILLS LAUNCHER
   Scoped to #page-exam, #page-exam-results, #page-review, #page-sr-review,
   #exam-modal, #page-drills (both certs)
   ══════════════════════════════════════════════════════════════════════ */

/* ── Exam Mode: topbar ── */
html[data-theme] body #page-exam .exam-topbar{background:none!important;box-shadow:none!important;border-bottom:1px solid var(--border)!important;}
html[data-theme] body #page-exam .exam-timer{font-family:'SF Mono',ui-monospace,monospace!important;font-weight:700!important;color:var(--text)!important;}
html[data-theme] body #page-exam .timer-label{font-size:10px!important;text-transform:uppercase!important;letter-spacing:.08em!important;color:var(--text-dim)!important;}
html[data-theme] body #page-exam .exam-q-counter{font-size:14px!important;font-weight:700!important;color:var(--text)!important;}
html[data-theme] body #page-exam .exam-answered-lbl{font-size:11px!important;color:var(--text-dim)!important;}

/* ── Exam Mode: flag button ── */
html[data-theme] body #page-exam .exam-flag-btn{background:none!important;border:1px solid var(--border)!important;border-radius:6px!important;color:var(--text-dim)!important;font-size:12px!important;font-weight:600!important;box-shadow:none!important;}
html[data-theme] body #page-exam .exam-flag-btn:hover{border-color:var(--accent)!important;color:var(--accent)!important;}
html[data-theme] body #page-exam .exam-flag-btn.flagged{border-color:var(--accent)!important;color:var(--accent)!important;background:color-mix(in oklab,var(--accent) 8%,transparent)!important;}

/* ── Exam Mode: end exam button ── */
html[data-theme] body #page-exam .end-exam-btn{background:var(--accent)!important;color:#fff!important;border:0!important;border-radius:6px!important;font-weight:700!important;box-shadow:none!important;}
html[data-theme] body #page-exam .end-exam-btn:hover{filter:brightness(1.1)!important;}

/* ── Exam Mode: question navigator ── */
html[data-theme] body #page-exam .qnav-toggle{background:none!important;border:1px solid var(--border)!important;border-radius:6px!important;color:var(--text-dim)!important;font-size:13px!important;box-shadow:none!important;}
html[data-theme] body #page-exam .qnav-sq{background:none!important;border:1px solid var(--border)!important;border-radius:4px!important;color:var(--text-dim)!important;box-shadow:none!important;}
html[data-theme] body #page-exam .qnav-sq.current{background:color-mix(in oklab,var(--accent) 15%,transparent)!important;border-color:var(--accent)!important;color:var(--accent)!important;}
html[data-theme] body #page-exam .qnav-sq.answered{background:color-mix(in oklab,var(--accent) 8%,transparent)!important;border-color:color-mix(in oklab,var(--accent) 30%,transparent)!important;}
html[data-theme] body #page-exam .qnav-sq.flagged{border-color:var(--yellow)!important;color:var(--yellow)!important;}

/* ── Exam Mode: question card ── */
html[data-theme] body #page-exam .q-card{background:none!important;border:1px solid var(--border)!important;border-radius:10px!important;box-shadow:none!important;}
html[data-theme] body #page-exam .q-text{font-size:clamp(17px,2.2vw,22px)!important;font-weight:600!important;color:var(--text)!important;line-height:1.45!important;}
html[data-theme] body #page-exam .q-meta{font-size:11px!important;color:var(--text-dim)!important;}

/* ── Exam Mode: options ── */
html[data-theme] body #page-exam .option{background:none!important;border:1px solid var(--border)!important;border-radius:8px!important;box-shadow:none!important;transition:border-color .15s,background .15s!important;}
html[data-theme] body #page-exam .option:hover{border-color:var(--accent)!important;background:color-mix(in oklab,var(--accent) 5%,transparent)!important;}
html[data-theme] body #page-exam .option.exam-selected{border-color:var(--accent)!important;background:color-mix(in oklab,var(--accent) 10%,transparent)!important;}

/* ── Exam Mode: nav row ── */
html[data-theme] body #page-exam .exam-nav-row .btn-ghost{color:var(--text-dim)!important;border:1px solid var(--border)!important;border-radius:6px!important;box-shadow:none!important;background:none!important;}
html[data-theme] body #page-exam .exam-nav-row .btn-ghost:hover{color:var(--accent)!important;border-color:var(--accent)!important;}
html[data-theme] body #page-exam .exam-nav-row .btn-primary{background:var(--accent)!important;color:#fff!important;border:0!important;border-radius:6px!important;box-shadow:none!important;}

/* ── Exam Mode: shortfall banner ── */
html[data-theme] body #page-exam .exam-shortfall-icon{display:none!important;}
html[data-theme] body #page-exam .exam-shortfall-banner{background:color-mix(in oklab,var(--yellow) 8%,transparent)!important;border:1px solid color-mix(in oklab,var(--yellow) 25%,transparent)!important;border-radius:8px!important;box-shadow:none!important;}

/* ── Exam Mode: kbd hints ── */
html[data-theme] body #page-exam .quiz-kbd-hints{color:var(--text-dim)!important;font-size:11px!important;}
html[data-theme] body #page-exam .quiz-kbd-hints kbd{background:color-mix(in oklab,var(--text) 8%,transparent)!important;border:1px solid var(--border)!important;border-radius:3px!important;color:var(--text-dim)!important;}

/* ── Exam Modal ── */
html[data-theme] body #exam-modal .modal-box{background:var(--bg)!important;border:1px solid var(--border)!important;border-radius:12px!important;box-shadow:none!important;}
html[data-theme] body #exam-modal .ed-modalhead-eyebrow{font-size:11px!important;text-transform:uppercase!important;letter-spacing:.08em!important;color:var(--text-dim)!important;}
html[data-theme] body #exam-modal .ed-modalhead-title{color:var(--text)!important;font-weight:800!important;}
html[data-theme] body #exam-modal .ed-modalhead-title em{color:var(--accent)!important;font-style:italic!important;}
html[data-theme] body #exam-modal .modal-stat .ms-val{font-weight:700!important;}
html[data-theme] body #exam-modal .modal-stat .ms-lbl{font-size:11px!important;color:var(--text-dim)!important;text-transform:uppercase!important;letter-spacing:.06em!important;}
html[data-theme] body #exam-modal .modal-actions .btn-ghost{color:var(--text-dim)!important;border:1px solid var(--border)!important;border-radius:6px!important;background:none!important;box-shadow:none!important;}
html[data-theme] body #exam-modal .modal-actions .btn-ghost:hover{color:var(--accent)!important;border-color:var(--accent)!important;}
html[data-theme] body #exam-modal .modal-actions .btn-primary{background:var(--accent)!important;color:#fff!important;border:0!important;border-radius:6px!important;box-shadow:none!important;}
html[data-theme] body #exam-modal .modal-actions .btn-danger{color:var(--red)!important;background:none!important;border:1px solid color-mix(in oklab,var(--red) 30%,transparent)!important;border-radius:6px!important;box-shadow:none!important;}
html[data-theme] body #exam-modal .modal-actions .btn-danger:hover{background:color-mix(in oklab,var(--red) 8%,transparent)!important;}

/* ── Exam Results: hero ── */
html[data-theme] body #page-exam-results .ed-pagehead-eyebrow{font-size:11px!important;text-transform:uppercase!important;letter-spacing:.08em!important;color:var(--text-dim)!important;}
html[data-theme] body #page-exam-results .ed-pagehead-eyebrow::before{content:none!important;}
html[data-theme] body #page-exam-results .exam-results-v2-display{color:var(--text)!important;font-weight:800!important;}
html[data-theme] body #page-exam-results .exam-results-v2-display em{color:var(--accent)!important;font-style:italic!important;}
html[data-theme] body #page-exam-results .exam-results-v2-big{background:none!important;border:1px solid var(--border)!important;border-radius:10px!important;box-shadow:none!important;}
html[data-theme] body #page-exam-results .exam-results-v2-big-label{font-size:11px!important;text-transform:uppercase!important;letter-spacing:.08em!important;color:var(--text-dim)!important;}
html[data-theme] body #page-exam-results .exam-results-v2-big-score{font-weight:800!important;}
html[data-theme] body #page-exam-results .pass-badge{background:var(--green)!important;color:#fff!important;border-radius:4px!important;font-size:11px!important;font-weight:800!important;letter-spacing:.1em!important;box-shadow:none!important;}
html[data-theme] body #page-exam-results .badge-fail{background:var(--red)!important;}
html[data-theme] body #page-exam-results .hardcore-badge{background:color-mix(in oklab,var(--accent) 12%,transparent)!important;color:var(--accent)!important;border:1px solid color-mix(in oklab,var(--accent) 30%,transparent)!important;border-radius:4px!important;font-size:11px!important;font-weight:800!important;box-shadow:none!important;}
html[data-theme] body #page-exam-results .exam-results-v2-msg{color:var(--text-dim)!important;font-size:14px!important;}
html[data-theme] body #page-exam-results .exam-results-v2-threshold{font-size:12px!important;color:var(--text-dim)!important;}

/* ── Exam Results: side stats ── */
html[data-theme] body #page-exam-results .exam-results-v2-side{background:none!important;border:1px solid var(--border)!important;border-radius:10px!important;box-shadow:none!important;}
html[data-theme] body #page-exam-results .results-v2-row .k{font-size:12px!important;color:var(--text-dim)!important;}
html[data-theme] body #page-exam-results .results-v2-row .v{font-weight:700!important;color:var(--text)!important;}

/* ── Exam Results: domain breakdown ── */
html[data-theme] body #page-exam-results .exam-domain-breakdown{background:none!important;border:1px solid var(--border)!important;border-radius:10px!important;box-shadow:none!important;}
html[data-theme] body #page-exam-results .exam-domain-breakdown-title{color:var(--text)!important;font-weight:700!important;}
html[data-theme] body #page-exam-results .exam-domain-breakdown-title em{color:var(--accent)!important;font-style:italic!important;}
html[data-theme] body #page-exam-results .exam-domain-breakdown-sub{font-size:13px!important;color:var(--text-dim)!important;}
html[data-theme] body #page-exam-results .exam-domain-row{border-bottom:1px solid var(--border)!important;box-shadow:none!important;}
html[data-theme] body #page-exam-results .exam-domain-row:last-child{border-bottom:0!important;}
html[data-theme] body #page-exam-results .exam-domain-proficient{border-color:color-mix(in oklab,var(--accent) 30%,transparent)!important;background:color-mix(in oklab,var(--accent) 6%,transparent)!important;}
html[data-theme] body #page-exam-results .exam-domain-proficient .exam-domain-row-pct{color:var(--accent)!important;}
html[data-theme] body #page-exam-results .exam-domain-row-name{color:var(--text)!important;font-size:13px!important;font-weight:600!important;}
html[data-theme] body #page-exam-results .exam-domain-row-pct{font-weight:700!important;font-family:'SF Mono',ui-monospace,monospace!important;}

/* ── Exam Results: CTA row ── */
html[data-theme] body #page-exam-results .results-v2-cta-row .btn-ghost{color:var(--text-dim)!important;border:1px solid var(--border)!important;border-radius:6px!important;background:none!important;box-shadow:none!important;}
html[data-theme] body #page-exam-results .results-v2-cta-row .btn-ghost:hover{color:var(--accent)!important;border-color:var(--accent)!important;}
html[data-theme] body #page-exam-results .results-v2-cta-row .btn-exam{background:var(--accent)!important;color:#fff!important;border:0!important;border-radius:6px!important;box-shadow:none!important;}
html[data-theme] body #page-exam-results .results-v2-cta-row .btn-exam:hover{filter:brightness(1.1)!important;}

/* ── Review: filter chips ── */
html[data-theme] body #page-review .review-filter-bar{background:none!important;border:1px solid var(--border)!important;border-radius:8px!important;box-shadow:none!important;}
html[data-theme] body #page-review .review-filter-chip{background:none!important;border:1px solid var(--border)!important;border-radius:6px!important;color:var(--text-dim)!important;font-size:12px!important;font-weight:600!important;box-shadow:none!important;transition:border-color .15s,color .15s!important;}
html[data-theme] body #page-review .review-filter-chip:hover{border-color:var(--accent)!important;color:var(--accent)!important;}
html[data-theme] body #page-review .review-filter-chip.is-active{border-color:var(--accent)!important;color:var(--accent)!important;background:color-mix(in oklab,var(--accent) 8%,transparent)!important;}
html[data-theme] body #page-review .review-filter-meta{font-size:11px!important;color:var(--text-dim)!important;}

/* ── Review: empty state ── */
html[data-theme] body #page-review .review-filter-empty-ico{display:none!important;}
html[data-theme] body #page-review .review-filter-empty{background:none!important;border:1px solid var(--border)!important;border-radius:10px!important;box-shadow:none!important;text-align:center!important;padding:32px!important;}
html[data-theme] body #page-review .review-filter-empty-title{font-size:15px!important;font-weight:700!important;color:var(--text)!important;}
html[data-theme] body #page-review .review-filter-empty-body{font-size:13px!important;color:var(--text-dim)!important;}
html[data-theme] body #page-review .review-filter-empty-cta{background:var(--accent)!important;color:#fff!important;border:0!important;border-radius:6px!important;font-weight:700!important;box-shadow:none!important;}

/* ── Review: item rows ── */
html[data-theme] body #page-review .review-list{background:none!important;box-shadow:none!important;}
html[data-theme] body #page-review .review-row{background:none!important;border-bottom:1px solid var(--border)!important;box-shadow:none!important;border-radius:0!important;}
html[data-theme] body #page-review .review-row:hover{background:color-mix(in oklab,var(--text) 4%,transparent)!important;}
html[data-theme] body #page-review .review-row:last-child{border-bottom:0!important;}
html[data-theme] body #page-review .review-q-text{font-size:14px!important;font-weight:600!important;color:var(--text)!important;}
html[data-theme] body #page-review .review-tag{font-size:10px!important;font-weight:700!important;text-transform:uppercase!important;letter-spacing:.06em!important;border-radius:4px!important;border:1px solid var(--border)!important;background:none!important;box-shadow:none!important;}
html[data-theme] body #page-review .review-tag-correct{color:var(--green)!important;border-color:color-mix(in oklab,var(--green) 30%,transparent)!important;}
html[data-theme] body #page-review .review-tag-wrong{color:var(--red)!important;border-color:color-mix(in oklab,var(--red) 30%,transparent)!important;}
html[data-theme] body #page-review .review-tag-flagged{color:var(--yellow)!important;border-color:color-mix(in oklab,var(--yellow) 30%,transparent)!important;}
html[data-theme] body #page-review .review-tag-skipped{color:var(--text-dim)!important;}

/* ── Review: back button ── */
html[data-theme] body #page-review .ed-pagehead-back{color:var(--text-dim)!important;border:1px solid var(--border)!important;border-radius:6px!important;background:none!important;box-shadow:none!important;}
html[data-theme] body #page-review .ed-pagehead-back:hover{color:var(--accent)!important;border-color:var(--accent)!important;}

/* ── SR Review: page editorial ── */
html[data-theme] body #page-sr-review .ed-pagehead{background:none!important;box-shadow:none!important;}
html[data-theme] body #page-sr-review .ed-pagehead-eyebrow{font-size:11px!important;text-transform:uppercase!important;letter-spacing:.08em!important;color:var(--text-dim)!important;}
html[data-theme] body #page-sr-review .ed-pagehead-eyebrow::before{content:none!important;}
html[data-theme] body #page-sr-review .ed-pagehead-display{color:var(--text)!important;font-weight:800!important;}
html[data-theme] body #page-sr-review .ed-pagehead-display em{color:var(--accent)!important;font-style:italic!important;}
html[data-theme] body #page-sr-review .ed-pagehead::after{content:none!important;}
html[data-theme] body #page-sr-review .ed-pagehead::before{content:none!important;}
html[data-theme] body #page-sr-review .ed-pagehead-back{color:var(--text-dim)!important;border:1px solid var(--border)!important;border-radius:6px!important;background:none!important;box-shadow:none!important;}
html[data-theme] body #page-sr-review .ed-pagehead-back:hover{color:var(--accent)!important;border-color:var(--accent)!important;}

/* ── SR Review: progress bar ── */
html[data-theme] body #page-sr-review .sr-progress-row{background:none!important;border:1px solid var(--border)!important;border-radius:8px!important;box-shadow:none!important;}
html[data-theme] body #page-sr-review .sr-progress-text{font-size:12px!important;font-weight:600!important;color:var(--text-dim)!important;}
html[data-theme] body #page-sr-review .sr-progress-bar{background:color-mix(in oklab,var(--text) 8%,transparent)!important;border-radius:4px!important;}
html[data-theme] body #page-sr-review .sr-progress-fill{background:var(--accent)!important;border-radius:4px!important;}

/* ── SR Review: card editorial ── */
html[data-theme] body #page-sr-review .sr-card{background:none!important;border:1px solid var(--border)!important;border-radius:10px!important;box-shadow:none!important;}
html[data-theme] body #page-sr-review .sr-card-meta{font-size:11px!important;color:var(--text-dim)!important;}
html[data-theme] body #page-sr-review .sr-question{font-size:clamp(16px,2vw,20px)!important;font-weight:600!important;color:var(--text)!important;line-height:1.45!important;}
html[data-theme] body #page-sr-review .sr-option{background:none!important;border:1px solid var(--border)!important;border-radius:8px!important;box-shadow:none!important;transition:border-color .15s!important;}
html[data-theme] body #page-sr-review .sr-option:hover{border-color:var(--accent)!important;}
html[data-theme] body #page-sr-review .sr-option.is-picked{border-color:var(--accent)!important;background:color-mix(in oklab,var(--accent) 8%,transparent)!important;}
html[data-theme] body #page-sr-review .sr-option.is-correct{border-color:var(--green)!important;background:color-mix(in oklab,var(--green) 8%,transparent)!important;}
html[data-theme] body #page-sr-review .sr-option.is-wrong{border-color:var(--red)!important;background:color-mix(in oklab,var(--red) 8%,transparent)!important;}
html[data-theme] body #page-sr-review .sr-option.is-missed{border-color:var(--yellow)!important;background:color-mix(in oklab,var(--yellow) 5%,transparent)!important;}
html[data-theme] body #page-sr-review .sr-option-letter{font-weight:700!important;font-size:12px!important;}
html[data-theme] body #page-sr-review .sr-explanation{background:none!important;border:1px solid var(--border)!important;border-radius:8px!important;box-shadow:none!important;font-size:13px!important;color:var(--text-dim)!important;}

/* ── SR Review: confidence buttons ── */
html[data-theme] body #page-sr-review .sr-confidence-label{font-size:13px!important;font-weight:600!important;color:var(--text)!important;}
html[data-theme] body #page-sr-review .sr-confidence-btn{background:none!important;border:1px solid var(--border)!important;border-radius:8px!important;box-shadow:none!important;font-size:14px!important;font-weight:600!important;color:var(--text)!important;transition:border-color .15s!important;}
html[data-theme] body #page-sr-review .sr-confidence-btn:hover{border-color:var(--accent)!important;color:var(--accent)!important;}
html[data-theme] body #page-sr-review .sr-confidence-confident:hover{border-color:var(--green)!important;color:var(--green)!important;}
html[data-theme] body #page-sr-review .sr-confidence-wrong:hover{border-color:var(--red)!important;color:var(--red)!important;}
html[data-theme] body #page-sr-review .sr-confidence-hint{font-size:11px!important;color:var(--text-dim)!important;font-weight:400!important;}
html[data-theme] body #page-sr-review .sr-self-grade-banner{background:color-mix(in oklab,var(--yellow) 8%,transparent)!important;border:1px solid color-mix(in oklab,var(--yellow) 25%,transparent)!important;border-radius:8px!important;font-size:13px!important;color:var(--text-dim)!important;box-shadow:none!important;}
html[data-theme] body #page-sr-review .sr-multi-submit-btn{background:var(--accent)!important;color:#fff!important;border:0!important;border-radius:6px!important;font-weight:700!important;box-shadow:none!important;}
html[data-theme] body #page-sr-review .sr-multi-hint{font-size:12px!important;color:var(--text-dim)!important;}

/* ── SR Review: empty/complete states ── */
html[data-theme] body #page-sr-review .sr-empty-icon{display:none!important;}
html[data-theme] body #page-sr-review .sr-empty{background:none!important;border:1px solid var(--border)!important;border-radius:10px!important;box-shadow:none!important;text-align:center!important;}
html[data-theme] body #page-sr-review .sr-empty h2{color:var(--text)!important;font-weight:700!important;}
html[data-theme] body #page-sr-review .sr-empty p{color:var(--text-dim)!important;font-size:14px!important;}
html[data-theme] body #page-sr-review .sr-empty .btn-primary{background:var(--accent)!important;color:#fff!important;border:0!important;border-radius:6px!important;box-shadow:none!important;}

/* ── Drills Launcher: page header de-purple ── */
html[data-theme] body #page-drills .ed-pagehead{background:none!important;box-shadow:none!important;}
html[data-theme] body #page-drills .ed-pagehead-eyebrow{font-size:11px!important;text-transform:uppercase!important;letter-spacing:.08em!important;color:var(--text-dim)!important;}
html[data-theme] body #page-drills .ed-pagehead-eyebrow::before{content:none!important;}
html[data-theme] body #page-drills .ed-pagehead-display{color:var(--text)!important;font-weight:800!important;outline:none!important;border-radius:0!important;}
html[data-theme] body #page-drills .ed-pagehead-display em{color:var(--accent)!important;font-style:italic!important;}
html[data-theme] body #page-drills .ed-pagehead::after{content:none!important;}
html[data-theme] body #page-drills .ed-pagehead::before{content:none!important;}
html[data-theme] body #page-drills .ed-pagehead-lede{font-size:14px!important;color:var(--text-dim)!important;}

/* ── Drills Launcher: tile icons hidden ── */
html[data-theme] body #page-drills .drills-tile-icon{display:none!important;}

/* ── Drills Launcher: tile styling ── */
html[data-theme] body #page-drills .drills-tile{background:none!important;border:1px solid var(--border)!important;border-radius:10px!important;box-shadow:none!important;transition:border-color .15s!important;}
html[data-theme] body #page-drills .drills-tile:hover{border-color:var(--accent)!important;box-shadow:none!important;background:color-mix(in oklab,var(--accent) 4%,transparent)!important;}
html[data-theme] body #page-drills .drills-tile::after{background:var(--accent)!important;}
html[data-theme] body #page-drills .drills-tile-title{font-size:15px!important;font-weight:700!important;color:var(--text)!important;}
html[data-theme] body #page-drills .drills-tile-sub{font-size:12px!important;color:var(--text-dim)!important;line-height:1.4!important;}
html[data-theme] body #page-drills .drills-tile-pbq-badge{font-size:9px!important;font-weight:800!important;text-transform:uppercase!important;letter-spacing:.08em!important;background:color-mix(in oklab,var(--accent) 12%,transparent)!important;color:var(--accent)!important;border-radius:3px!important;border:0!important;box-shadow:none!important;}

/* ── Drills Launcher: NEW tile de-purple ── */
html[data-theme] body #page-drills .drills-tile-new{background:none!important;border:1px solid var(--border)!important;}
html[data-theme] body #page-drills .drills-tile-new:hover{background:color-mix(in oklab,var(--accent) 4%,transparent)!important;}
html[data-theme] body #page-drills .drills-tile-new-badge{font-size:9px!important;font-weight:800!important;text-transform:uppercase!important;letter-spacing:.08em!important;background:color-mix(in oklab,var(--green) 12%,transparent)!important;color:var(--green)!important;border-radius:3px!important;border:0!important;box-shadow:none!important;}

/* ── Drills Launcher: recommendation card de-purple ── */
html[data-theme] body #page-drills .page-rec-card{background:color-mix(in oklab,var(--accent) 6%,transparent)!important;border:1px solid color-mix(in oklab,var(--accent) 20%,transparent)!important;border-radius:10px!important;box-shadow:none!important;}
html[data-theme] body #page-drills .page-rec-icon{display:none!important;}
html[data-theme] body #page-drills .page-rec-eyebrow-text{font-size:11px!important;text-transform:uppercase!important;letter-spacing:.08em!important;color:var(--text-dim)!important;}
html[data-theme] body #page-drills .page-rec-headline{font-size:18px!important;font-weight:700!important;color:var(--text)!important;}
html[data-theme] body #page-drills .page-rec-sub{font-size:13px!important;color:var(--text-dim)!important;}
html[data-theme] body #page-drills .page-rec-btn{background:var(--accent)!important;color:#fff!important;border:0!important;border-radius:6px!important;font-weight:700!important;box-shadow:none!important;}
html[data-theme] body #page-drills .page-rec-btn:hover{filter:brightness(1.1)!important;background:var(--accent)!important;}
html[data-theme] body #page-drills .page-rec-reason{font-size:12px!important;color:var(--text-dim)!important;}

/* ── Drills Launcher: Sec+ tiles ── */
html[data-theme] body .secplus-drill-tile-icon{display:none!important;}
html[data-theme] body .secplus-drill-tile{background:none!important;border:1px solid var(--border)!important;border-radius:10px!important;box-shadow:none!important;transition:border-color .15s!important;}
html[data-theme] body .secplus-drill-tile:hover{border-color:var(--accent)!important;box-shadow:none!important;background:color-mix(in oklab,var(--accent) 4%,transparent)!important;}
html[data-theme] body .secplus-drill-tile-title{font-size:15px!important;font-weight:700!important;color:var(--text)!important;}
html[data-theme] body .secplus-drill-tile-sub{font-size:12px!important;color:var(--text-dim)!important;line-height:1.4!important;}
html[data-theme] body .secplus-drill-tile-meta{font-size:11px!important;color:var(--text-dim)!important;}
html[data-theme] body .secplus-drill-tile-badge{font-size:9px!important;font-weight:800!important;text-transform:uppercase!important;letter-spacing:.08em!important;background:color-mix(in oklab,var(--green) 12%,transparent)!important;color:var(--green)!important;border-radius:3px!important;border:0!important;box-shadow:none!important;}
html[data-theme] body .secplus-drill-tile-flagship{border-color:color-mix(in oklab,var(--accent) 30%,transparent)!important;box-shadow:none!important;}
html[data-theme] body .secplus-drill-tile-badge.is-flagship{background:color-mix(in oklab,var(--accent) 15%,transparent)!important;color:var(--accent)!important;}

/* ══════════════════════════════════════════════════════════════════
   BATCH 9 — Account Dropdown + Web Vitals editorial
   ══════════════════════════════════════════════════════════════════ */

/* ── Account Dropdown: editorial ── */
html[data-theme] body .topbar-account-dropdown{background:var(--bg)!important;border:1px solid var(--border)!important;border-radius:14px!important;padding:6px!important;box-shadow:0 18px 44px -16px color-mix(in oklab,var(--text) 22%,transparent)!important;}
html[data-theme] body .tad-icon{display:none!important;}
html[data-theme] body .tad-header{padding:12px 12px 11px!important;border:0!important;}
html[data-theme] body .tad-email{font-size:12px!important;font-weight:700!important;color:var(--text)!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;}
html[data-theme] body .tad-tier{margin-top:6px!important;font-size:11.5px!important;color:var(--text-dim)!important;letter-spacing:.02em!important;}
html[data-theme] body .tad-sync-status{padding:8px 12px!important;font-size:11px!important;color:var(--text-dim)!important;border:0!important;background:none!important;}
html[data-theme] body .tad-sync-now{font-size:11px!important;color:var(--accent)!important;text-decoration:none!important;}
html[data-theme] body .tad-sync-now:hover{text-decoration:underline!important;color:var(--accent)!important;}
html[data-theme] body .tad-divider{height:1px!important;background:var(--border)!important;margin:5px 6px!important;border:0!important;}
html[data-theme] body .tad-link{display:flex!important;align-items:center!important;gap:11px!important;width:100%!important;background:none!important;border:0!important;text-align:left!important;padding:10px 12px!important;border-radius:9px!important;font-size:12.5px!important;font-weight:600!important;line-height:1.2!important;color:var(--text-mid)!important;text-decoration:none!important;transition:background .12s ease,color .12s ease!important;}
html[data-theme] body .tad-link:hover,html[data-theme] body .tad-link:focus-visible{background:color-mix(in oklab,var(--text) 6%,transparent)!important;color:var(--text)!important;outline:none!important;}
html[data-theme] body .tad-link.is-admin{color:var(--accent)!important;}
html[data-theme] body .tad-link.is-admin:hover{color:var(--accent)!important;background:color-mix(in oklab,var(--accent) 8%,transparent)!important;}
html[data-theme] body .tad-link.is-danger{color:var(--text-dim)!important;}
html[data-theme] body .tad-link.is-danger:hover,html[data-theme] body .tad-link.is-danger:focus-visible{color:var(--accent)!important;background:color-mix(in oklab,var(--text) 6%,transparent)!important;}
html[data-theme] body .tad-cert-section{border-top:1px solid var(--border)!important;border-bottom:1px solid var(--border)!important;margin:5px 0!important;padding:6px!important;background:none!important;}
html[data-theme] body .tad-cert-section-label{font-size:10px!important;font-weight:700!important;letter-spacing:.1em!important;text-transform:uppercase!important;color:var(--text-dim)!important;padding:6px 12px 4px!important;}
html[data-theme] body .tad-cert-row{padding:9px 12px!important;border-radius:8px!important;border:0!important;background:none!important;transition:background .12s ease!important;}
html[data-theme] body .tad-cert-row:hover{background:color-mix(in oklab,var(--text) 6%,transparent)!important;}
html[data-theme] body .tad-cert-row.is-active{background:color-mix(in oklab,var(--accent) 10%,transparent)!important;}
html[data-theme] body .tad-cert-name{font-size:12.5px!important;font-weight:700!important;color:var(--text)!important;}
html[data-theme] body .tad-cert-code{font-size:10.5px!important;color:var(--text-dim)!important;font-family:ui-monospace,"SF Mono",Menlo,monospace!important;}
/* v7.1.0 Sec+ public launch — "PRO" badge on Pro-tier cert row for Free users */
html[data-theme] body .tad-cert-tier-pill{margin-left:auto!important;display:inline-block!important;font-size:9.5px!important;font-weight:800!important;letter-spacing:0.08em!important;color:var(--accent)!important;background:color-mix(in oklab,var(--accent) 12%,transparent)!important;border:1px solid color-mix(in oklab,var(--accent) 30%,transparent)!important;border-radius:999px!important;padding:2px 7px!important;text-transform:uppercase!important;line-height:1!important;}
html[data-theme] body .tad-cert-check{color:var(--accent)!important;}

/* ── Web Vitals: editorial ── */
html[data-theme] body #page-web-vitals{max-width:1120px!important;margin:0 auto!important;padding:0 28px 90px!important;}
html[data-theme] body #page-web-vitals>div:first-child{display:flex!important;align-items:center!important;gap:14px!important;margin-bottom:6px!important;}
html[data-theme] body #page-web-vitals .btn-ghost{background:none!important;border:1px solid var(--border)!important;border-radius:8px!important;color:var(--text-dim)!important;font-size:12px!important;font-weight:600!important;padding:8px 14px!important;transition:border-color .15s,color .15s!important;}
html[data-theme] body #page-web-vitals .btn-ghost:hover{border-color:var(--accent)!important;color:var(--accent)!important;}
html[data-theme] body #page-web-vitals h2{font-size:24px!important;font-weight:800!important;letter-spacing:-.02em!important;color:var(--text)!important;margin:0!important;}
html[data-theme] body #page-web-vitals>p{font-size:13px!important;color:var(--text-dim)!important;margin:0 0 24px!important;}
html[data-theme] body #page-web-vitals .wv-summary-grid{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:0!important;border:1px solid var(--border)!important;border-radius:12px!important;overflow:hidden!important;}
html[data-theme] body #page-web-vitals .wv-card{padding:20px 22px!important;border-left:1px solid var(--border)!important;border:0!important;border-left:1px solid var(--border)!important;border-radius:0!important;background:none!important;box-shadow:none!important;}
html[data-theme] body #page-web-vitals .wv-card:first-child{border-left:0!important;}
html[data-theme] body #page-web-vitals .wv-card-label{font-size:11px!important;font-weight:700!important;letter-spacing:.1em!important;text-transform:uppercase!important;color:var(--text-dim)!important;}
html[data-theme] body #page-web-vitals .wv-card-value{margin-top:12px!important;font-size:28px!important;font-weight:800!important;letter-spacing:-.02em!important;line-height:1!important;font-variant-numeric:tabular-nums!important;}
html[data-theme] body #page-web-vitals .wv-card.wv-good{background:none!important;border-color:var(--border)!important;}
html[data-theme] body #page-web-vitals .wv-card.wv-mid{background:none!important;border-color:var(--border)!important;}
html[data-theme] body #page-web-vitals .wv-card.wv-bad{background:none!important;border-color:var(--border)!important;}
html[data-theme] body #page-web-vitals .wv-card.wv-good .wv-card-value{color:var(--green)!important;}
html[data-theme] body #page-web-vitals .wv-card.wv-mid .wv-card-value{color:var(--yellow,#fbbf24)!important;}
html[data-theme] body #page-web-vitals .wv-card.wv-bad .wv-card-value{color:var(--red,#f87171)!important;}
html[data-theme] body #page-web-vitals .wv-card-sub{font-size:10px!important;color:var(--text-dim)!important;font-weight:600!important;margin-top:9px!important;}
html[data-theme] body #page-web-vitals .wv-meta{font-size:11px!important;color:var(--text-dim)!important;text-align:right!important;margin-top:10px!important;}
html[data-theme] body #page-web-vitals .wv-section{margin-top:36px!important;}
html[data-theme] body #page-web-vitals .wv-section-title{font-size:14px!important;font-weight:800!important;letter-spacing:-.01em!important;color:var(--text)!important;text-transform:none!important;margin:0 0 12px!important;padding-bottom:10px!important;border-bottom:1px solid var(--border)!important;}
html[data-theme] body #page-web-vitals .wv-row{display:grid!important;grid-template-columns:1fr auto auto!important;gap:14px!important;align-items:center!important;background:none!important;border:0!important;border-bottom:1px solid var(--border)!important;border-radius:0!important;padding:13px 14px!important;margin:0!important;font-size:13px!important;}
html[data-theme] body #page-web-vitals .wv-row:last-child{border-bottom:0!important;}
html[data-theme] body #page-web-vitals .wv-row-label{font-weight:700!important;color:var(--text)!important;font-family:ui-monospace,"SF Mono",Menlo,monospace!important;font-variant-numeric:tabular-nums!important;}
html[data-theme] body #page-web-vitals .wv-row-meta{font-size:11px!important;color:var(--text-dim)!important;}
html[data-theme] body #page-web-vitals .wv-row-val{font-weight:700!important;font-variant-numeric:tabular-nums!important;}
html[data-theme] body #page-web-vitals .wv-row-val.wv-good{color:var(--green)!important;}
html[data-theme] body #page-web-vitals .wv-row-val.wv-mid{color:var(--yellow,#fbbf24)!important;}
html[data-theme] body #page-web-vitals .wv-row-val.wv-bad{color:var(--red,#f87171)!important;}
html[data-theme] body #page-web-vitals .wv-row-val.wv-na{color:var(--text-dim)!important;font-weight:600!important;}
html[data-theme] body #page-web-vitals .wv-table-wrap{overflow-x:auto!important;background:none!important;border:1px solid var(--border)!important;border-radius:12px!important;box-shadow:none!important;margin-top:4px!important;}
html[data-theme] body #page-web-vitals .wv-table{width:100%!important;border-collapse:collapse!important;font-size:12px!important;min-width:720px!important;}
html[data-theme] body #page-web-vitals .wv-table th{background:none!important;color:var(--text-dim)!important;text-align:left!important;padding:13px 14px!important;font-size:11px!important;text-transform:uppercase!important;letter-spacing:.1em!important;font-weight:700!important;border-bottom:1px solid var(--border)!important;}
html[data-theme] body #page-web-vitals .wv-table td{padding:13px 14px!important;border-bottom:1px solid var(--border)!important;color:var(--text-mid)!important;font-family:ui-monospace,"SF Mono",Menlo,monospace!important;font-variant-numeric:tabular-nums!important;font-size:11.5px!important;}
html[data-theme] body #page-web-vitals .wv-table tbody tr{transition:background .12s ease!important;}
html[data-theme] body #page-web-vitals .wv-table tbody tr:hover{background:color-mix(in oklab,var(--text) 4%,transparent)!important;}
html[data-theme] body #page-web-vitals .wv-table tr:last-child td{border-bottom:0!important;}
html[data-theme] body #page-web-vitals .wv-table td:first-child{color:var(--text)!important;font-weight:600!important;}
html[data-theme] body #page-web-vitals .wv-loading,html[data-theme] body #page-web-vitals .wv-empty,html[data-theme] body #page-web-vitals .wv-error{background:none!important;border:1px solid var(--border)!important;border-radius:12px!important;padding:32px 24px!important;font-size:13px!important;color:var(--text-dim)!important;text-align:center!important;box-shadow:none!important;}
html[data-theme] body #page-web-vitals .wv-error{color:var(--red,#f87171)!important;border-color:color-mix(in oklab,var(--red,#f87171) 30%,transparent)!important;}

/* ── P1: Global primitives de-purple ── */
html[data-theme] body *:focus-visible{box-shadow:0 0 0 4px color-mix(in oklab,var(--accent) 20%,transparent)!important;outline:none!important;}
html[data-theme] body .chip.on{background:color-mix(in oklab,var(--accent) 18%,transparent)!important;border-color:var(--accent)!important;color:var(--accent)!important;}
html[data-theme] body .chip-smart.on{background:color-mix(in oklab,var(--accent) 25%,transparent)!important;border-color:var(--accent)!important;color:var(--accent)!important;}
@keyframes chipFlash{0%{box-shadow:0 0 0 6px color-mix(in oklab,var(--accent) 35%,transparent);}100%{box-shadow:0 0 0 0 transparent;}}

/* ── P3: Milestone + A2HS emoji hide ── */
html[data-theme] body .ana-milestone-icon{display:none!important;}
html[data-theme] body .a2hs-banner-icon{display:none!important;}

/* ── P2: Session transition + complete ── */
html[data-theme] body #page-session-transition .session-emoji,html[data-theme] body #page-session-complete .session-emoji{display:none!important;}
html[data-theme] body #page-session-transition .session-hero-eyebrow,html[data-theme] body #page-session-complete .session-hero-eyebrow{color:var(--text-dim)!important;padding-left:0!important;}
html[data-theme] body #page-session-transition .session-hero-eyebrow::before,html[data-theme] body #page-session-complete .session-hero-eyebrow::before{content:none!important;}
html[data-theme] body #page-session-transition .session-hero-display,html[data-theme] body #page-session-complete .session-hero-display{color:var(--text)!important;}
html[data-theme] body #page-session-transition .session-hero-display em,html[data-theme] body #page-session-complete .session-hero-display em{color:var(--accent)!important;}
html[data-theme] body #page-session-transition .session-result-row{background:none!important;border:1px solid var(--border)!important;border-radius:10px!important;box-shadow:none!important;}
html[data-theme] body #page-session-transition .card{background:none!important;border:0!important;border-bottom:1px solid var(--border)!important;border-radius:0!important;box-shadow:none!important;padding:16px 0!important;}
html[data-theme] body #page-session-transition .card h3{font-size:10px!important;font-weight:700!important;letter-spacing:.12em!important;text-transform:uppercase!important;color:var(--text-dim)!important;}

/* ── P2: Diagnostic quiz ── */
html[data-theme] body #page-diagnostic-quiz .diag-conf-icon{display:none!important;}
html[data-theme] body #page-diagnostic-quiz .diag-quiz-pill.objective{background:color-mix(in oklab,var(--accent) 15%,transparent)!important;color:var(--accent)!important;}
html[data-theme] body #page-diagnostic-quiz .diag-quiz-option.selected{border-color:var(--accent)!important;background:color-mix(in oklab,var(--accent) 8%,transparent)!important;}
html[data-theme] body #page-diagnostic-quiz .diag-quiz-option.selected .diag-quiz-option-letter{background:var(--accent)!important;}
html[data-theme] body #page-diagnostic-quiz .diag-conf-tier.selected[data-tier="confident"]{border-color:var(--green)!important;background:color-mix(in oklab,var(--green) 10%,transparent)!important;}
html[data-theme] body #page-diagnostic-quiz .diag-conf-tier.selected[data-tier="uncertain"]{border-color:var(--accent)!important;background:color-mix(in oklab,var(--accent) 10%,transparent)!important;}
html[data-theme] body #page-diagnostic-quiz .diag-conf-tier.selected[data-tier="guessing"]{border-color:var(--text-dim)!important;background:color-mix(in oklab,var(--text) 6%,transparent)!important;}
html[data-theme] body #page-diagnostic-quiz .diag-quiz-card{background:none!important;border:1px solid var(--border)!important;box-shadow:none!important;}

/* ── P2: Diagnostic result / Pass Plan ── */
html[data-theme] body #page-diagnostic-result .pass-plan-hero{background:none!important;border:1px solid var(--border)!important;box-shadow:none!important;}
html[data-theme] body #page-diagnostic-result .pass-plan-hero::before{display:none!important;}
html[data-theme] body #page-diagnostic-result .pass-plan-section-h .icon{display:none!important;}
html[data-theme] body #page-diagnostic-result .pass-plan-review-icon{display:none!important;}
html[data-theme] body #page-diagnostic-result .pass-plan-pbq-icon{display:none!important;}
html[data-theme] body #page-diagnostic-result .pass-plan-section{background:none!important;border:0!important;border-bottom:1px solid var(--border)!important;border-radius:0!important;box-shadow:none!important;padding:18px 0!important;}
html[data-theme] body #page-diagnostic-result .pass-plan-section-h{font-size:14px!important;font-weight:800!important;color:var(--text)!important;letter-spacing:-.01em!important;}
html[data-theme] body #page-diagnostic-result .pass-plan-pbq-rec{background:none!important;border:1px solid var(--border)!important;border-radius:10px!important;box-shadow:none!important;}
html[data-theme] body #page-diagnostic-result .pass-plan-pbq-cta{color:var(--accent)!important;}
html[data-theme] body #page-diagnostic-result .pass-plan-review-seeded{background:none!important;border:1px solid var(--border)!important;border-radius:10px!important;box-shadow:none!important;}
html[data-theme] body #page-diagnostic-result .pass-plan-final-cta .btn-primary{background:var(--accent)!important;border-color:var(--accent)!important;color:var(--bg)!important;}

/* ── P2: Production Monitor ── */
html[data-theme] body #page-monitor h2{font-size:22px!important;font-weight:800!important;letter-spacing:-.02em!important;color:var(--text)!important;}
html[data-theme] body #page-monitor .btn-ghost{background:none!important;border:1px solid var(--border)!important;border-radius:8px!important;color:var(--text-dim)!important;font-weight:600!important;}
html[data-theme] body #page-monitor .btn-ghost:hover{border-color:var(--accent)!important;color:var(--accent)!important;}
html[data-theme] body #page-monitor .btn-danger{background:none!important;border:1px solid color-mix(in oklab,var(--red,#f87171) 40%,transparent)!important;border-radius:8px!important;color:var(--red,#f87171)!important;box-shadow:none!important;}
html[data-theme] body #page-monitor .monitor-log{background:none!important;border:1px solid var(--border)!important;border-radius:10px!important;box-shadow:none!important;}

/* ── P7: Inline purple overrides ── */
html[data-theme] body .deep-explain{border-left-color:var(--accent)!important;background:var(--surface)!important;border-color:var(--border)!important;color:var(--text)!important;}
html[data-theme] body .deep-explain strong{color:var(--accent)!important;}
html[data-theme] body .deep-explain-text{color:var(--text)!important;}
html[data-theme] body .deep-explain-text a{color:var(--accent)!important;}
html[data-theme] body .qnav-sq.current{background:color-mix(in oklab,var(--accent) 25%,transparent)!important;border-color:var(--accent)!important;color:var(--accent)!important;}
html[data-theme] body .qnav-sq.answered{background:color-mix(in oklab,var(--accent) 12%,transparent)!important;border-color:var(--accent)!important;color:var(--accent)!important;}

/* ── Reduced-motion gate ── */
@media (prefers-reduced-motion: reduce){.sb-item,.topbar-iconbtn,.topbar-toggle,.topbar-countdown,.st-focus-chip,.pt-focus-chip,.st-mode-btn,.pt-mode-btn,.os-mode-btn,.cb-mode-btn,.os-diff-btn,.os-tab-btn,.cb-tab-btn,.na-tab,.ptr-tab-btn,.na-option,.ptr-opt,.ptr-prog-dot,.exam-flag-btn,.qnav-sq,.option,.review-filter-chip,.sr-option,.sr-confidence-btn,.drills-tile,.secplus-drill-tile,.tad-link,.tad-cert-row{transition:none!important;}}

/* ════════════════════════════════════════════════════════════════
   v5.5.5 · THE CONTINUE ANCHOR — the right rail's always-present
   bottom. Founder spotted dead space below Daily Challenge: on a
   low-data account #hero-v2-cta (NBM) + #sr-review-card collapse
   while the tall left column keeps going, leaving a bottom-right
   wedge. taste-skill → dashboards: the operator's next action,
   ALWAYS rendered (rail can't collapse → void fixed structurally)
   + ALWAYS prescriptive (earns its slot → not the filler the
   anti-slop rule bans). Quiet hairline card — NBM keeps the one
   bronze fill — faint accent radial + accent eyebrow = "your live
   thread". Scoped #continue-card (unique id) + html[data-theme]
   body #page-setup .continue-card to beat the styles.css .card
   glass. App tokens only; cert + theme aware. The generic
   #page-setup .card hover-lift + reduced-motion gate already cover
   the card (it carries class card); only the .cc-* specifics +
   button motion are added here. Net-new additive DOM, zero
   contract touched. */
html[data-theme] body #page-setup .continue-card{position:relative;overflow:hidden;background:linear-gradient(180deg,var(--surface),color-mix(in oklab,var(--surface) 84%,var(--bg)));border:1px solid color-mix(in oklab,var(--accent) 20%,var(--border));border-radius:18px;padding:22px 22px 24px;box-shadow:none;margin:0;}
#page-setup .continue-card::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(120% 78% at 100% 0%,color-mix(in oklab,var(--accent) 8%,transparent),transparent 58%);}
#page-setup .continue-card .cc-eyebrow{position:relative;display:flex;align-items:center;gap:9px;font-size:10px;font-weight:800;letter-spacing:0.14em;text-transform:uppercase;color:var(--accent);margin-bottom:14px;}
#page-setup .continue-card .cc-eyebrow svg{width:13px;height:13px;flex:none;}
#page-setup .continue-card .cc-momentum{position:relative;display:flex;border:1px solid var(--border);border-radius:11px;overflow:hidden;margin-bottom:18px;background:color-mix(in oklab,var(--accent) 3%,transparent);}
#page-setup .continue-card .cc-m{flex:1;padding:11px 14px;text-align:left;}
#page-setup .continue-card .cc-m+.cc-m{border-left:1px solid var(--border);}
html[data-theme] body #page-setup .continue-card .cc-mn{font-family:'Fraunces',Georgia,serif;font-size:21px;font-weight:600;color:var(--text);letter-spacing:-0.01em;display:block;line-height:1;}
#page-setup .continue-card .cc-mn.is-accent{color:var(--accent);}
#page-setup .continue-card .cc-ml{font-size:10px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--text-dim);margin-top:6px;display:block;}
#page-setup .continue-card .cc-body{position:relative;}
html[data-theme] body #page-setup .continue-card .cc-headline{font-family:'Fraunces',Georgia,serif;font-size:var(--t1);font-weight:600;color:var(--text);letter-spacing:-0.012em;line-height:1.18;}
#page-setup .continue-card .cc-context{font-size:12.5px;color:var(--text-dim);line-height:1.55;margin-top:7px;max-width:38ch;}
#page-setup .continue-card .cc-context b{color:var(--text-mid);font-weight:650;}
html[data-theme] body #page-setup .continue-card .cc-action{position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;margin-top:18px;font-family:Inter,-apple-system,sans-serif;font-size:13.5px;font-weight:700;color:var(--accent);text-align:left;background:color-mix(in oklab,var(--accent) 5%,transparent);border:1px solid color-mix(in oklab,var(--accent) 30%,transparent);padding:13px 16px;border-radius:11px;cursor:pointer;}
#page-setup .continue-card .cc-arrow{font-size:15px;}
#page-setup .continue-card[data-state="fresh"] .cc-momentum{display:none;}
html[data-theme] body #page-setup .continue-card[data-state="fresh"]{border-color:color-mix(in oklab,var(--accent) 26%,var(--border));}
#page-setup .continue-card .cc-action{transition:transform .16s var(--dgh-ease),background .18s var(--dgh-ease),border-color .18s var(--dgh-ease);}
#page-setup .continue-card .cc-arrow{transition:transform .2s var(--dgh-ease);}
html[data-theme] body #page-setup .continue-card .cc-action:active{transform:scale(0.985);}
@media (hover:hover) and (pointer:fine){
  html[data-theme] body #page-setup .continue-card .cc-action:hover{background:color-mix(in oklab,var(--accent) 11%,transparent);border-color:color-mix(in oklab,var(--accent) 48%,transparent);}
  html[data-theme] body #page-setup .continue-card .cc-action:hover .cc-arrow{transform:translateX(3px);}
}
@media (prefers-reduced-motion:reduce){
  #page-setup .continue-card .cc-action,#page-setup .continue-card .cc-arrow{transition:none!important;transform:none!important;}
}
/* ────────────────────────────────────────────────────────────
   v5.6.x · Bug-Report Drawer (portal to <body>)
   Light + dark via existing OKLCH tokens. Mockup-faithful to
   .superpowers/brainstorm/.../components-light-v4-final.html
   ──────────────────────────────────────────────────────────── */

/* [hidden] attribute is overridden by component display:flex rules below;
   re-assert it for every br-* surface so JS toggling .hidden actually hides. */
#br-portal [hidden],
#bug-report-drawer [hidden],
.br-toast[hidden]{ display:none !important; }

.br-backdrop{
  position:fixed; inset:0; z-index:9000;
  background:color-mix(in oklab, var(--text) 36%, transparent);
  opacity:0; transition:opacity 220ms cubic-bezier(0.16,1,0.3,1);
}
.br-backdrop.open{ opacity:1; }

#bug-report-drawer{
  position:fixed; top:14px; right:14px;
  width:min(540px, 49vw); max-height:calc(100vh - 28px);
  z-index:9001;
  background:linear-gradient(180deg, var(--surface), var(--surface-2));
  border:1px solid var(--border); border-radius:14px;
  box-shadow:0 1px 0 color-mix(in oklab, var(--bg) 55%, transparent),
             0 18px 40px -16px color-mix(in oklab, var(--text) 25%, transparent);
  display:flex; flex-direction:column; overflow:hidden;
  color:var(--text); font-family:Inter,sans-serif;
  transform:translateX(100%); transition:transform 220ms cubic-bezier(0.16,1,0.3,1);
}
#bug-report-drawer.open{ transform:translateX(0); }

.br-head{
  display:flex; align-items:flex-start; justify-content:space-between; gap:14px;
  padding:22px 22px 18px; border-bottom:1px solid var(--border-soft); flex:none;
}
.br-eyebrow{
  font-family:Inter,sans-serif; font-size:10px; font-weight:700; letter-spacing:.18em;
  text-transform:uppercase; color:var(--accent); margin:0 0 12px;
  display:flex; align-items:center; gap:10px;
}
.br-eyebrow::before{ content:""; display:inline-block; width:24px; height:1px; background:var(--accent); }
.br-title{
  font-family:'Fraunces',Georgia,serif; font-weight:600; font-size:20px;
  letter-spacing:-.012em; line-height:1.1; color:var(--text); margin:0;
  /* override the global h3{text-transform:uppercase} from styles.css so the
     locked mockup's mixed-case "Report an issue" reads correctly. */
  text-transform:none;
}
.br-close{
  flex:none; width:30px; height:30px; border-radius:8px;
  background:none; border:0; color:var(--text-dim);
  cursor:pointer; font-size:18px; display:grid; place-items:center; line-height:1;
  transition:color .15s ease, background .15s ease;
}
.br-close:hover{ color:var(--text); background:color-mix(in oklab, var(--text) 6%, transparent); }
.br-close:active{ transform:scale(0.97); }

.br-body{
  flex:0 1 auto; overflow-y:auto;
  padding:20px 22px 22px; display:flex; flex-direction:column; gap:18px;
  background:var(--bg);
}
.br-field{ display:flex; flex-direction:column; gap:7px; }
.br-label{
  font-family:Inter,sans-serif; font-size:10.5px; font-weight:800; letter-spacing:.12em;
  text-transform:uppercase; color:var(--text-dim);
  display:flex; align-items:center;
}
.br-req{ color:var(--accent); margin-left:3px; }
.br-counter{ margin-left:auto; font-weight:600; letter-spacing:0; text-transform:none; font-size:11px;
  font-family:ui-monospace,Menlo,monospace; color:var(--text-dim); }
.br-counter.warn{ color:oklch(0.62 0.13 75); }
.br-input,.br-textarea{
  background:var(--surface); border:1px solid var(--border); border-radius:8px;
  padding:9px 12px; color:var(--text);
  font-family:Inter,sans-serif; font-size:13px; line-height:1.5;
}
.br-textarea{ min-height:78px; resize:vertical; white-space:pre-wrap; }
.br-input.err,.br-textarea.err{ border-color:oklch(0.50 0.13 25); }
.br-caption{ font-size:11px; line-height:1.4; margin-top:-2px; }
.br-caption-err{ color:oklch(0.50 0.13 25); font-weight:600; display:flex; align-items:center; gap:6px; }
.br-caption-err::before{
  content:"!"; width:14px; height:14px; border-radius:50%;
  background:oklch(0.50 0.13 25); color:#fff;
  display:grid; place-items:center; font-size:9px; font-weight:800; flex:none;
}

.br-steps-link{
  display:inline-flex; align-items:center; gap:8px; background:none; border:0; padding:2px 0;
  font-family:Inter,sans-serif; font-size:12px; font-weight:600;
  color:var(--text-mid); cursor:pointer; text-align:left; align-self:flex-start;
  border-bottom:1px solid transparent; transition:color .15s ease, border-color .15s ease;
}
.br-steps-link:hover{ color:var(--accent); border-bottom-color:var(--accent); }
.br-steps-link .br-plus{
  width:14px; height:14px; border-radius:50%; display:grid; place-items:center;
  background:color-mix(in oklab, var(--accent) 12%, transparent);
  color:var(--accent); font-size:14px; font-weight:600; line-height:1; flex:none;
}
.br-steps-link[hidden]{ display:none; }

.br-ctx{
  padding:11px 14px;
  background:color-mix(in oklab, var(--accent) 4.5%, transparent);
  border:1px solid color-mix(in oklab, var(--accent) 18%, transparent);
  border-radius:8px;
  font-size:11px; color:var(--text-mid); line-height:1.55;
  display:flex; flex-direction:column; gap:6px;
}
.br-ctx-h{
  font-weight:700; color:var(--accent); text-transform:uppercase;
  letter-spacing:.1em; font-size:9.5px;
  display:flex; align-items:center; gap:7px;
}
.br-ctx-h::after{
  content:""; flex:1; height:1px;
  background:color-mix(in oklab, var(--accent) 18%, transparent);
  max-width:80px;
}
.br-ctx-fields{ font-family:ui-monospace,Menlo,monospace; font-size:11px;
  color:var(--text-mid); line-height:1.7; word-break:break-word; }
.br-ctx-fields b{ color:var(--text); font-weight:600; }

.br-no-token{
  padding:11px 14px;
  background:color-mix(in oklab, oklch(0.50 0.13 25) 5%, transparent);
  border:1px solid color-mix(in oklab, oklch(0.50 0.13 25) 25%, transparent);
  border-radius:8px; font-size:11.5px; color:var(--text); line-height:1.5;
  display:flex; flex-direction:column; gap:5px;
}
.br-no-token b{ color:oklch(0.50 0.13 25); font-weight:700;
  text-transform:uppercase; letter-spacing:.08em; font-size:10px; }
.br-no-token a{ color:var(--accent); font-weight:600; text-decoration:none;
  border-bottom:1px solid var(--accent); }

.br-foot{
  padding:16px 22px; border-top:1px solid var(--border-soft);
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  background:var(--surface-2); flex:none;
}
.br-cancel{
  background:none; border:0; color:var(--text-dim);
  font-family:Inter,sans-serif; font-size:12.5px; font-weight:600;
  cursor:pointer; padding:6px 2px; transition:color .15s ease;
}
.br-cancel:hover{ color:var(--text); }
.br-cancel:active{ transform:scale(0.97); }
.br-send{
  font-family:Inter,sans-serif; font-size:13px; font-weight:700;
  padding:10px 20px; border-radius:9px;
  background:var(--accent); color:var(--on-accent, var(--bg));
  border:1px solid var(--accent-deep, var(--accent)); cursor:pointer; letter-spacing:0;
  transition:filter .15s ease, transform .12s ease;
}
.br-send:hover{ filter:brightness(1.05); }
.br-send:active{ transform:scale(0.97); }
.br-send:disabled{ opacity:.5; cursor:not-allowed; }

/* Toast (reuse the existing sw-update banner pattern at body level) */
.br-toast{
  position:fixed; left:18px; bottom:18px; z-index:9002;
  display:flex; align-items:center; gap:11px;
  padding:11px 14px; max-width:320px;
  background:var(--surface); border:1px solid var(--border-soft);
  border-radius:11px; box-shadow:0 1px 0 color-mix(in oklab, var(--bg) 55%, transparent),
                                  0 18px 40px -16px color-mix(in oklab, var(--text) 25%, transparent);
  color:var(--text); font-family:Inter,sans-serif; font-size:12px;
  transform:translateY(120%); transition:transform 260ms cubic-bezier(0.16,1,0.3,1);
}
.br-toast.open{ transform:translateY(0); }
.br-toast.ok{ border-color:color-mix(in oklab, oklch(0.52 0.13 150) 55%, transparent); }
.br-toast.amber{ border-color:color-mix(in oklab, oklch(0.62 0.13 75) 55%, transparent); }
.br-toast.red{ border-color:color-mix(in oklab, oklch(0.50 0.13 25) 55%, transparent); }
.br-toast-i{
  width:24px; height:24px; border-radius:6px; display:grid; place-items:center;
  font-weight:800; font-size:13px; flex:none;
}
.br-toast.ok .br-toast-i{ color:oklch(0.52 0.13 150);
  background:color-mix(in oklab, oklch(0.52 0.13 150) 14%, transparent);
  border:1px solid color-mix(in oklab, oklch(0.52 0.13 150) 35%, transparent); }
.br-toast.amber .br-toast-i{ color:oklch(0.62 0.13 75);
  background:color-mix(in oklab, oklch(0.62 0.13 75) 14%, transparent);
  border:1px solid color-mix(in oklab, oklch(0.62 0.13 75) 35%, transparent); }
.br-toast.red .br-toast-i{ color:oklch(0.50 0.13 25);
  background:color-mix(in oklab, oklch(0.50 0.13 25) 14%, transparent);
  border:1px solid color-mix(in oklab, oklch(0.50 0.13 25) 35%, transparent); }
.br-toast-t{ font-weight:700; color:var(--text); }
.br-toast-l{ font-size:11px; color:var(--text-dim); }
.br-toast-l b{ color:var(--accent); }
.br-toast-link{ color:var(--accent); cursor:pointer; }

/* Topbar bug iconbtn — visible queue dot when count > 0 */
.topbar-iconbtn.has-queue::after{
  content:""; position:absolute; top:6px; right:6px;
  width:6px; height:6px; border-radius:50%; background:var(--accent);
}
#topbar-bug-report{ position:relative; }

/* Settings → Reports panel */
.br-sp-hd{ display:flex; flex-direction:column; gap:6px; margin-bottom:14px; }
.br-sp-eyb{ font-size:10px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--accent); display:flex; align-items:center; gap:10px; }
.br-sp-eyb::before{ content:""; display:inline-block; width:24px; height:1px; background:var(--accent); }
.br-sp-hd h4{ font-family:'Fraunces',Georgia,serif; font-weight:600; font-size:17px; letter-spacing:-.012em; margin:0; }
.br-sp-meta{ font-size:11.5px; color:var(--text-dim); }
.br-sp-list{ display:flex; flex-direction:column; }
.br-sp-row{ padding:14px 0; border-bottom:1px solid var(--border-soft);
  display:grid; grid-template-columns:80px 1fr auto auto; gap:14px; align-items:center; }
.br-sp-row:last-child{ border-bottom:0; }
.br-sp-status{ font-size:9.5px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; display:flex; align-items:center; gap:6px; }
.br-sp-dot{ width:7px; height:7px; border-radius:50%; flex:none; }
.br-sp-tr{ color:oklch(0.62 0.13 75); } .br-sp-tr .br-sp-dot{ background:oklch(0.62 0.13 75); }
.br-sp-hf{ color:oklch(0.50 0.13 25); } .br-sp-hf .br-sp-dot{ background:oklch(0.50 0.13 25); }
.br-sp-body{ display:flex; flex-direction:column; gap:3px; }
.br-sp-title{ font-size:12.5px; font-weight:600; color:var(--text); }
.br-sp-sub{ font-size:11px; color:var(--text-dim); font-family:ui-monospace,Menlo,monospace; }
.br-sp-when{ font-size:11px; color:var(--text-dim); font-variant-numeric:tabular-nums; }
.br-sp-acts{ display:flex; gap:4px; }
.br-sp-acts button{ background:none; border:0; color:var(--text-dim); font-size:11px; font-weight:600; padding:4px 8px; border-radius:5px; cursor:pointer; border-bottom:1px solid transparent; }
.br-sp-acts button:hover{ color:var(--accent); border-bottom-color:var(--accent); }
.br-sp-empty{ padding:14px 0; color:var(--text-dim); font-size:12.5px; font-style:italic; }

/* Mobile bottom sheet — viewport <768px (Q1 default) */
@media (max-width: 767px){
  #bug-report-drawer{
    top:auto; right:0; left:0; bottom:0;
    width:100vw; max-width:100vw; max-height:85vh;
    border-radius:14px 14px 0 0;
    transform:translateY(100%);
  }
  #bug-report-drawer.open{ transform:translateY(0); }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .br-backdrop,#bug-report-drawer,.br-toast{ transition:none !important; }
  .br-send,.br-close,.br-cancel{ transition:none !important; }
}