/* =========================================================
   Theme A, "Play": the app's own palette.
   Blue #2B52A6 · Orange #F59E21 · Green #3D9E5C · Sky #A8D9ED
   · Indigo #4F46E5.  Rounded display type, soft chunky cards.
   Pairs with styles.css.  Fonts: Fredoka + Nunito Sans.
   ========================================================= */

:root{
  /* --- brand --- */
  --brand:#2B52A6;          /* primary chrome, 7.3:1 on white */
  --brand-600:#1f3f85;
  --brand-050:#eaf0fb;
  --brand-ink:#2B52A6;      /* safe for body-size text */

  --accent:#4F46E5;         /* progress, bonus/extra */
  --accent-050:#edecfd;
  --accent-ink:#4F46E5;     /* 6.3:1 */

  --warm:#F59E21;           /* hints, encouragement; fills only */
  --warm-050:#fdf1de;
  --warm-ink:#8a5a08;       /* 5.9:1, the text-safe orange */

  --good:#3D9E5C;           /* correct, goals; fills only */
  --good-050:#e6f4ea;
  --good-ink:#2d6b41;       /* 6.4:1, the text-safe green */

  --sky:#A8D9ED;

  /* --- surfaces --- */
  --ink:#172038;
  --ink-2:#3c4560;
  --muted:#5a647a;          /* 5.9:1 */
  --line:#e6ecf2;
  --line-strong:#cbd8e6;

  --bg:#ffffff;
  --bg-alt:#f2f8fc;
  --surface:#ffffff;
  --header-bg:rgba(255,255,255,.86);
  --hero-bg:linear-gradient(170deg,#eaf5fb 0%,#f6fbfd 46%,#ffffff 100%);

  --chip-bg:#eef6fb;
  --chip-line:#d3e6f2;
  --pill-grade-bg:#e6f4ea;  /* first eyebrow pill, the audience */
  --pill-grade-line:#c4e0ce;
  --pill-proof-bg:#edecfd;  /* second eyebrow pill, the claim */
  --pill-proof-line:#d7d4fa;

  --blob-a:rgba(168,217,237,.75);
  --blob-b:rgba(79,70,229,.16);

  /* --- privacy band --- */
  --band-bg:linear-gradient(150deg,#17306b 0%,#2B52A6 68%,#3a63bd 100%);
  --band-fg:#ffffff;
  --band-muted:rgba(255,255,255,.78);
  --band-kicker:#A8D9ED;
  --band-card:rgba(255,255,255,.09);
  --band-line:rgba(255,255,255,.18);
  --band-tile:rgba(255,255,255,.16);
  --band-tile-fg:#ffffff;

  /* --- cta --- */
  --cta-bg:linear-gradient(140deg,#A8D9ED 0%,#dcf0f8 55%,#eaf0fb 100%);
  --cta-fg:#132449;
  --cta-muted:#334368;

  /* --- footer --- */
  --footer-bg:#101a33;
  --footer-fg:#ffffff;
  --footer-muted:rgba(255,255,255,.62);
  --footer-line:rgba(255,255,255,.14);

  /* --- shape --- */
  --radius:20px;
  --radius-lg:28px;
  --radius-sm:14px;
  --radius-pill:999px;
  --radius-store:14px;

  --shadow-sm:0 2px 10px rgba(23,32,56,.05);
  --shadow:0 16px 40px -14px rgba(23,32,56,.20);
  --shadow-brand:0 12px 26px -10px rgba(43,82,166,.55);
  --device-shadow:drop-shadow(0 26px 40px rgba(23,32,56,.16));

  --focus:#4F46E5;
  --container:1160px;
  --ease:cubic-bezier(.22,.61,.36,1);

  /* --- type --- */
  --font-display:'Fredoka','Nunito Sans',system-ui,sans-serif;
  --font-body:'Nunito Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --display-weight:600;
  --display-tracking:-.005em;

  --tick-svg:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232d6b41' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.6l5.2 5.2L20 6.6'/%3E%3C/svg%3E");
}

/* Rounded display type wants a touch more optical weight at small sizes */
.brand__name{font-weight:600}
.stat b{font-weight:600}
