/* ug-theme v1 (Boss via Steve, 7 Oct 2026): Recallab UG — "A · Navy and gold".
   One layer over the PG-derived UG index.html. Load it LAST in <head>, after every inline
   <style>:  <link rel="stylesheet" href="/assets/ug-theme.css?v=1">
   Needs /assets/fonts/lexend-latin.woff2 and lexend-latin-ext.woff2 (Lexend, OFL;
   self-host them like Manrope; no Google Fonts call from the site).
   The logo files are untouched; the "UG" tab is drawn by CSS after .logo. */

@font-face{font-family:'Lexend';font-style:normal;font-weight:500 700;font-display:swap;src:url(/assets/fonts/lexend-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Lexend';font-style:normal;font-weight:500 700;font-display:swap;src:url(/assets/fonts/lexend-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ---------- 1. tokens: light (default, also on phones) ---------- */
:root:root{
  --ug-navy:#0B2E59; --ug-blue:#1E6FD9; --ug-gold:#F2B705; --ug-gold-ink:#3D2E00; --ug-gold-soft:#FFF4CC;
  --bg:#F3F7FC; --card:#FFFFFF; --ink:#0B2E59; --body:#24406A; --muted:#5B7396;
  --brand:#1E6FD9; --brand-deep:#0B2E59; --brand-ink:#FFFFFF; --brand-soft:#E4EFFC; --brand-softer:#F0F6FD;
  --line:#C9D8EC; --line-strong:#B3C7E2; --line-ui:#8AA3C4;
  --good:#12925A; --good-soft:#E3F6EC; --bad:#D92D20; --bad-soft:#FDECEA;
  --gold:#F2B705; --chart:#1E6FD9;
  --kf-bg:#E4EFFC; --kf-b:#1E6FD9; --kf-l:#0B2E59;
  --fig-border:#C9D8EC;
  --shadow-s:0 1px 2px rgba(11,46,89,.06);
  --shadow-m:0 1px 2px rgba(11,46,89,.06), 0 8px 24px -12px rgba(11,46,89,.18);
  --radius:20px;
}
/* ---------- 2. tokens: dark (navy-black) ---------- */
@media (prefers-color-scheme: dark){
  :root:root:not([data-theme="light"]){
    --ug-navy:#06162E; --ug-gold:#F5C842; --ug-gold-ink:#2B2000; --ug-gold-soft:#3A2F0A;
    --bg:#081A33; --card:#0E2445; --ink:#E8F0FB; --body:#C3D3EA; --muted:#8FA7C8;
    --brand:#5B9BF0; --brand-deep:#06162E; --brand-ink:#06162E; --brand-soft:#14305A; --brand-softer:#102A4F;
    --line:#1F3D66; --line-strong:#2A4E7F; --line-ui:#4D6E9A;
    --good:#4ADE94; --good-soft:#0F3B2A; --bad:#FF7A70; --bad-soft:#3D1716;
    --gold:#F5C842; --chart:#5B9BF0;
    --kf-bg:#14305A; --kf-b:#5B9BF0; --kf-l:#BFD8F8;
    --fig-border:#1F3D66;
    --shadow-s:0 1px 2px rgba(0,0,0,.3);
    --shadow-m:0 1px 2px rgba(0,0,0,.3), 0 10px 26px -14px rgba(0,0,0,.6);
  }
}
:root:root[data-theme="dark"]{
  --ug-navy:#06162E; --ug-gold:#F5C842; --ug-gold-ink:#2B2000; --ug-gold-soft:#3A2F0A;
  --bg:#081A33; --card:#0E2445; --ink:#E8F0FB; --body:#C3D3EA; --muted:#8FA7C8;
  --brand:#5B9BF0; --brand-deep:#06162E; --brand-ink:#06162E; --brand-soft:#14305A; --brand-softer:#102A4F;
  --line:#1F3D66; --line-strong:#2A4E7F; --line-ui:#4D6E9A;
  --good:#4ADE94; --good-soft:#0F3B2A; --bad:#FF7A70; --bad-soft:#3D1716;
  --gold:#F5C842; --chart:#5B9BF0;
  --kf-bg:#14305A; --kf-b:#5B9BF0; --kf-l:#BFD8F8;
  --fig-border:#1F3D66;
  --shadow-s:0 1px 2px rgba(0,0,0,.3);
  --shadow-m:0 1px 2px rgba(0,0,0,.3), 0 10px 26px -14px rgba(0,0,0,.6);
}

/* ---------- 3. type: Lexend headings, 17px body on phones ---------- */
html body h1, html body h2, html body h3, html body h4, html body .hero .tagline{font-family:'Lexend','Manrope',system-ui,sans-serif !important}   /* ug-lexend v1.1: beats the inherited per-card serif heading rules */
html body h1, html body h2, html body h3, html body h4,
html body .tile .tval, html body .spotttl h3, html body .sechead, html body .plan .price{font-family:'Lexend','Manrope',system-ui,sans-serif;letter-spacing:-.01em}
html body .sechead{letter-spacing:.06em}
@media (max-width:560px){ html body{font-size:17px} }

/* ---------- 4. header: always navy (PG tints it per app; UG does not), gold "UG" tab ---------- */
html body > header, html body:has(.card.spot) > header{--brand-deep:var(--ug-navy);background:var(--ug-navy) !important}
html body > header .logo picture{display:flex;align-items:center;gap:.4rem}
html body > header .logo picture::after{content:"UG";flex:0 0 auto;font:700 .74rem/1 'Lexend',sans-serif;letter-spacing:.06em;color:var(--ug-gold-ink);
  background:var(--ug-gold);border-radius:7px;padding:5px 7px 4px}
html body header nav button.active{box-shadow:inset 0 -3px 0 var(--ug-gold)}
@media (max-width:560px){
  html body header nav{background:var(--card)}
  html body header nav button.active{box-shadow:none;background:var(--brand-soft);color:var(--brand)}
}

/* ---------- 5. cards, buttons, options ---------- */
html body .card, html body .tile, html body .appbtn, html body .plan{border-radius:20px;border-color:var(--line);box-shadow:var(--shadow-m)}
html body .btn{border-radius:14px;min-height:48px;font-weight:800}
html body .btn:not(.secondary):not([class*="ghost"]){background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}
html body .opts .opt{border-radius:16px;min-height:56px;border-width:1.5px}
html body .opts .opt .letter, html body .opts .opt > span:first-child{border-radius:10px}
/* progress = gold */
html body progress::-webkit-progress-value{background:var(--ug-gold)}
html body .quotapill.pro{background:var(--ug-gold);color:var(--ug-gold-ink)}
html body .totchip .tck{color:var(--ug-gold)}

/* the Standard package was PG green: UG sky blue (Plus gold, Premium wine, Pro Learner slate stay) */
html body .pk-standard{--pk:#E4EFFC;--pk-ink:#0B2E59}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) body .pk-standard{--pk:#14305A;--pk-ink:#BFD8F8} }
:root[data-theme="dark"] body .pk-standard{--pk:#14305A;--pk-ink:#BFD8F8}

/* ---------- 6. app colours: each its own, none navy / brand blue / gold ---------- */
html body .appbtn[data-app="due"],       html body .card.spot.due{--ap:#0E7490;--aps:#DDF1F6;--brand:#0E7490;--brand-soft:#DDF1F6;--brand-softer:#EEF8FA;--brand-ink:#fff}
html body .appbtn[data-app="fresh"],     html body .card.spot.fresh{--ap:#DB2777;--aps:#FCE7F2;--brand:#DB2777;--brand-soft:#FCE7F2;--brand-softer:#FDF3F8;--brand-ink:#fff}
html body .appbtn[data-app="second"],    html body .card.spot.second{--ap:#EA580C;--aps:#FDEBDD;--brand:#C2410C;--brand-soft:#FDEBDD;--brand-softer:#FEF5EE;--brand-ink:#fff}
html body .appbtn[data-app="weakness"],  html body .card.spot.weak{--ap:#475569;--aps:#E8ECF1;--brand:#475569;--brand-soft:#E8ECF1;--brand-softer:#F3F5F8;--brand-ink:#fff}
html body .appbtn[data-app="plan"],      html body .card.spot.plapp{--ap:#4D7C0F;--aps:#ECF4DC;--brand:#4D7C0F;--brand-soft:#ECF4DC;--brand-softer:#F5F9ED;--brand-ink:#fff}
html body .appbtn[data-app="exam"],      html body .card.spot.exam{--ap:#A21CAF;--aps:#F8E6FA;--brand:#A21CAF;--brand-soft:#F8E6FA;--brand-softer:#FCF2FD;--brand-ink:#fff}
html body .appbtn[data-app="bookmarks"], html body .card.spot.bookmarks{--ap:#B45309;--aps:#FBEEDB;--brand:#B45309;--brand-soft:#FBEEDB;--brand-softer:#FDF6EC;--brand-ink:#fff}
html body .appbtn[data-app="quiz"]{--ap:#0369A1;--aps:#E0EEF8}
html body .appbtn[data-app="spot"],      html body .card.spot.sdx{--ap:#0F766E;--aps:#DDF3F1;--brand:#0F766E;--brand-soft:#DDF3F1;--brand-softer:#EEF9F8;--brand-ink:#fff}
html body .appbtn[data-app="notebook"],  html body .card.spot.notebook{--ap:#6D28D9;--aps:#EFE7FD;--brand:#6D28D9;--brand-soft:#EFE7FD;--brand-softer:#F7F3FE;--brand-ink:#fff}
html body .appbtn[data-app="falsecert"], html body .card.spot.falsecert{--ap:#B91C1C;--aps:#FDE8E8;--brand:#B91C1C;--brand-soft:#FDE8E8;--brand-softer:#FEF4F4;--brand-ink:#fff}
html body .appbtn[data-app="blind"],     html body .card.spot.blind{--ap:#57534E;--aps:#EEEDEB;--brand:#57534E;--brand-soft:#EEEDEB;--brand-softer:#F7F6F5;--brand-ink:#fff}
html body .appbtn[data-app="lucky"],     html body .card.spot.lucky{--ap:#15803D;--aps:#E1F4E7;--brand:#15803D;--brand-soft:#E1F4E7;--brand-softer:#F0F9F3;--brand-ink:#fff}
html body .appbtn[data-app="search"],    html body .card.spot.search{--ap:#831843;--aps:#FBE7F0;--brand:#831843;--brand-soft:#FBE7F0;--brand-softer:#FDF3F7;--brand-ink:#fff}
html body .appbtn[data-app="build"]{--ap:#3F3F46;--aps:#EDEDEF}
/* dark: the same hues, lifted */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) body .appbtn[data-app="due"],       :root:not([data-theme="light"]) body .card.spot.due{--ap:#5CC6E0;--aps:#0F3442;--brand:#5CC6E0;--brand-soft:#0F3442;--brand-softer:#0C2A36;--brand-ink:#06162E}
  :root:not([data-theme="light"]) body .appbtn[data-app="fresh"],     :root:not([data-theme="light"]) body .card.spot.fresh{--ap:#F472B6;--aps:#431633;--brand:#F472B6;--brand-soft:#431633;--brand-softer:#36122A;--brand-ink:#06162E}
  :root:not([data-theme="light"]) body .appbtn[data-app="second"],    :root:not([data-theme="light"]) body .card.spot.second{--ap:#FB923C;--aps:#45240E;--brand:#FB923C;--brand-soft:#45240E;--brand-softer:#381D0B;--brand-ink:#06162E}
  :root:not([data-theme="light"]) body .appbtn[data-app="weakness"],  :root:not([data-theme="light"]) body .card.spot.weak{--ap:#A3B1C6;--aps:#243349;--brand:#A3B1C6;--brand-soft:#243349;--brand-softer:#1D2A3D;--brand-ink:#06162E}
  :root:not([data-theme="light"]) body .appbtn[data-app="plan"],      :root:not([data-theme="light"]) body .card.spot.plapp{--ap:#A3D45A;--aps:#25351A;--brand:#A3D45A;--brand-soft:#25351A;--brand-softer:#1E2B15;--brand-ink:#06162E}
  :root:not([data-theme="light"]) body .appbtn[data-app="exam"],      :root:not([data-theme="light"]) body .card.spot.exam{--ap:#E879F9;--aps:#3D1442;--brand:#E879F9;--brand-soft:#3D1442;--brand-softer:#311036;--brand-ink:#06162E}
  :root:not([data-theme="light"]) body .appbtn[data-app="bookmarks"], :root:not([data-theme="light"]) body .card.spot.bookmarks{--ap:#F2A65A;--aps:#40290F;--brand:#F2A65A;--brand-soft:#40290F;--brand-softer:#34210C;--brand-ink:#06162E}
  :root:not([data-theme="light"]) body .appbtn[data-app="quiz"]{--ap:#7CC4F5;--aps:#123452}
  :root:not([data-theme="light"]) body .appbtn[data-app="spot"],      :root:not([data-theme="light"]) body .card.spot.sdx{--ap:#4FD1C5;--aps:#103B3A;--brand:#4FD1C5;--brand-soft:#103B3A;--brand-softer:#0D302F;--brand-ink:#06162E}
  :root:not([data-theme="light"]) body .appbtn[data-app="notebook"],  :root:not([data-theme="light"]) body .card.spot.notebook{--ap:#B99BF7;--aps:#2A1F52;--brand:#B99BF7;--brand-soft:#2A1F52;--brand-softer:#221943;--brand-ink:#06162E}
  :root:not([data-theme="light"]) body .appbtn[data-app="falsecert"], :root:not([data-theme="light"]) body .card.spot.falsecert{--ap:#F87171;--aps:#3F1818;--brand:#F87171;--brand-soft:#3F1818;--brand-softer:#331313;--brand-ink:#06162E}
  :root:not([data-theme="light"]) body .appbtn[data-app="blind"],     :root:not([data-theme="light"]) body .card.spot.blind{--ap:#C4BFB8;--aps:#2E2B28;--brand:#C4BFB8;--brand-soft:#2E2B28;--brand-softer:#252320;--brand-ink:#06162E}
  :root:not([data-theme="light"]) body .appbtn[data-app="lucky"],     :root:not([data-theme="light"]) body .card.spot.lucky{--ap:#5CD38A;--aps:#123A23;--brand:#5CD38A;--brand-soft:#123A23;--brand-softer:#0E2F1C;--brand-ink:#06162E}
  :root:not([data-theme="light"]) body .appbtn[data-app="search"],    :root:not([data-theme="light"]) body .card.spot.search{--ap:#F9A8D4;--aps:#3F1228;--brand:#F9A8D4;--brand-soft:#3F1228;--brand-softer:#330E20;--brand-ink:#06162E}
  :root:not([data-theme="light"]) body .appbtn[data-app="build"]{--ap:#D4D4D8;--aps:#2A2A30}
}
:root[data-theme="dark"] body .appbtn[data-app="due"],       :root[data-theme="dark"] body .card.spot.due{--ap:#5CC6E0;--aps:#0F3442;--brand:#5CC6E0;--brand-soft:#0F3442;--brand-softer:#0C2A36;--brand-ink:#06162E}
:root[data-theme="dark"] body .appbtn[data-app="fresh"],     :root[data-theme="dark"] body .card.spot.fresh{--ap:#F472B6;--aps:#431633;--brand:#F472B6;--brand-soft:#431633;--brand-softer:#36122A;--brand-ink:#06162E}
:root[data-theme="dark"] body .appbtn[data-app="second"],    :root[data-theme="dark"] body .card.spot.second{--ap:#FB923C;--aps:#45240E;--brand:#FB923C;--brand-soft:#45240E;--brand-softer:#381D0B;--brand-ink:#06162E}
:root[data-theme="dark"] body .appbtn[data-app="weakness"],  :root[data-theme="dark"] body .card.spot.weak{--ap:#A3B1C6;--aps:#243349;--brand:#A3B1C6;--brand-soft:#243349;--brand-softer:#1D2A3D;--brand-ink:#06162E}
:root[data-theme="dark"] body .appbtn[data-app="plan"],      :root[data-theme="dark"] body .card.spot.plapp{--ap:#A3D45A;--aps:#25351A;--brand:#A3D45A;--brand-soft:#25351A;--brand-softer:#1E2B15;--brand-ink:#06162E}
:root[data-theme="dark"] body .appbtn[data-app="exam"],      :root[data-theme="dark"] body .card.spot.exam{--ap:#E879F9;--aps:#3D1442;--brand:#E879F9;--brand-soft:#3D1442;--brand-softer:#311036;--brand-ink:#06162E}
:root[data-theme="dark"] body .appbtn[data-app="bookmarks"], :root[data-theme="dark"] body .card.spot.bookmarks{--ap:#F2A65A;--aps:#40290F;--brand:#F2A65A;--brand-soft:#40290F;--brand-softer:#34210C;--brand-ink:#06162E}
:root[data-theme="dark"] body .appbtn[data-app="quiz"]{--ap:#7CC4F5;--aps:#123452}
:root[data-theme="dark"] body .appbtn[data-app="spot"],      :root[data-theme="dark"] body .card.spot.sdx{--ap:#4FD1C5;--aps:#103B3A;--brand:#4FD1C5;--brand-soft:#103B3A;--brand-softer:#0D302F;--brand-ink:#06162E}
:root[data-theme="dark"] body .appbtn[data-app="notebook"],  :root[data-theme="dark"] body .card.spot.notebook{--ap:#B99BF7;--aps:#2A1F52;--brand:#B99BF7;--brand-soft:#2A1F52;--brand-softer:#221943;--brand-ink:#06162E}
:root[data-theme="dark"] body .appbtn[data-app="falsecert"], :root[data-theme="dark"] body .card.spot.falsecert{--ap:#F87171;--aps:#3F1818;--brand:#F87171;--brand-soft:#3F1818;--brand-softer:#331313;--brand-ink:#06162E}
:root[data-theme="dark"] body .appbtn[data-app="blind"],     :root[data-theme="dark"] body .card.spot.blind{--ap:#C4BFB8;--aps:#2E2B28;--brand:#C4BFB8;--brand-soft:#2E2B28;--brand-softer:#252320;--brand-ink:#06162E}
:root[data-theme="dark"] body .appbtn[data-app="lucky"],     :root[data-theme="dark"] body .card.spot.lucky{--ap:#5CD38A;--aps:#123A23;--brand:#5CD38A;--brand-soft:#123A23;--brand-softer:#0E2F1C;--brand-ink:#06162E}
:root[data-theme="dark"] body .appbtn[data-app="search"],    :root[data-theme="dark"] body .card.spot.search{--ap:#F9A8D4;--aps:#3F1228;--brand:#F9A8D4;--brand-soft:#3F1228;--brand-softer:#330E20;--brand-ink:#06162E}
:root[data-theme="dark"] body .appbtn[data-app="build"]{--ap:#D4D4D8;--aps:#2A2A30}