/* ===========================================================================
   themes.css — three complete, self-consistent palettes. Each theme defines the
   full set of chrome variables plus a tile ramp (2 → 8192 with a fallback for
   anything higher). The structure and the tile-value -> variable mapping live
   in base.css; switching theme is purely swapping these values, so no re-render
   is needed.

   Variable reference:
     --bg               app background        --surface / --surface-border  cards, pills, buttons
     --board / --cell   board + empty cells    --text / --text-dim           primary / secondary text
     --accent / --accent-ink   accent + text on it
     --wm-bg / --wm-ink wordmark badge         --hint                        hint line
     --tile-shadow      tile/card shadow        --overlay                    win/over board scrim
     --tile-radius      tile corner radius
     --tN-bg / --tN-fg  tile N background/text  --tbig-*                     fallback for >8192
   =========================================================================== */

/* ----------------------------- Blossom — soft pastel -------------------- */
.theme-blossom {
  --bg: #fbf6f4;
  --board: #f2e6e6;
  --cell: #e9dbdb;
  --surface: #ffffff;
  --surface-border: #f0e2e4;
  --text: #5a3a45;
  --text-dim: #b69ca6;
  --accent: #d4537e;
  --accent-ink: #fff4f8;
  --wm-bg: #d4537e;
  --wm-ink: #fff0f4;
  --hint: #c2a8b0;
  --tile-shadow: 0 2px 6px rgba(150, 90, 110, 0.16);
  --overlay: rgba(251, 246, 244, 0.86);
  --tile-radius: 14px;

  --t2-bg: #f6ecec; --t2-fg: #836164;
  --t4-bg: #f3e3ec; --t4-fg: #7f5d70;
  --t8-bg: #fad9c8; --t8-fg: #80573a;
  --t16-bg: #f7c4b0; --t16-fg: #7f4631;
  --t32-bg: #f2b6c4; --t32-fg: #80384b;
  --t64-bg: #e59bb4; --t64-fg: #6f2a41;
  --t128-bg: #c9c2ee; --t128-fg: #4c43a9;
  --t256-bg: #aedfd0; --t256-fg: #0e654f;
  --t512-bg: #f8d49a; --t512-fg: #815411;
  --t1024-bg: #e7a9c6; --t1024-fg: #7a2e55;
  --t2048-bg: #c8a2e0; --t2048-fg: #3c3489;
  --t4096-bg: #88c9b0; --t4096-fg: #0e513e;
  --t8192-bg: #e89bb0; --t8192-fg: #5a1528;
  --tbig-bg: #c9c2ee; --tbig-fg: #26215c;
}

/* ----------------------- Daylight — warm light (default) ---------------- */
.theme-daylight {
  --bg: #f7f3eb;
  --board: #e8dfce;
  --cell: #d9cfba;
  --surface: #ffffff;
  --surface-border: #e8e0d0;
  --text: #2b2924;
  --text-dim: #a89d88;
  --accent: #d8843a;
  --accent-ink: #fff6ee;
  --wm-bg: #2b2924;
  --wm-ink: #f4c188;
  --hint: #b3a88f;
  --tile-shadow: 0 2px 6px rgba(90, 70, 40, 0.18);
  --overlay: rgba(247, 243, 235, 0.86);
  --tile-radius: 9px;

  --t2-bg: #f1ebde; --t2-fg: #726858;
  --t4-bg: #eee2c5; --t4-fg: #696253;
  --t8-bg: #f4c188; --t8-fg: #764713;
  --t16-bg: #f0a85c; --t16-fg: #6a3a0f;
  --t32-bg: #ee8050; --t32-fg: #5d2309;
  --t64-bg: #e85c30; --t64-fg: #3c1307;
  --t128-bg: #efcd66; --t128-fg: #6b5410;
  --t256-bg: #ecc850; --t256-fg: #67510f;
  --t512-bg: #ecc23b; --t512-fg: #5e4a0f;
  --t1024-bg: #e7bb22; --t1024-fg: #503f0b;
  --t2048-bg: #e0ae12; --t2048-fg: #554207;
  --t4096-bg: #2b2924; --t4096-fg: #f4c188;
  --t8192-bg: #221f1a; --t8192-fg: #ffd37a;
  --tbig-bg: #1a1714; --tbig-fg: #ffe08c;
}

/* ----------------------- Midnight — dark, teal signature ---------------- */
.theme-midnight {
  --bg: #0e1217;
  --board: #1a222b;
  --cell: #232d38;
  --surface: #19222b;
  --surface-border: #2a3744;
  --text: #e4f0f4;
  --text-dim: #7e97a6;
  --accent: #34c7a0;
  --accent-ink: #04241c;
  --wm-bg: #34c7a0;
  --wm-ink: #04241c;
  --hint: #5e7585;
  --tile-shadow: 0 2px 8px rgba(0, 0, 0, 0.45);
  --overlay: rgba(14, 18, 23, 0.88);
  --tile-radius: 8px;

  --t2-bg: #2e3c47; --t2-fg: #93a7b5;
  --t4-bg: #44586a; --t4-fg: #cfe0ec;
  --t8-bg: #1e5e63; --t8-fg: #86e8e0;
  --t16-bg: #167e7c; --t16-fg: #ecfcfa;
  --t32-bg: #1fa39a; --t32-fg: #042521;
  --t64-bg: #34c7a0; --t64-fg: #04241c;
  --t128-bg: #5bd9b0; --t128-fg: #053026;
  --t256-bg: #8fe9c9; --t256-fg: #063228;
  --t512-bg: #2ab6d6; --t512-fg: #042830;
  --t1024-bg: #3fd0e6; --t1024-fg: #04303a;
  --t2048-bg: #ffd86e; --t2048-fg: #3a2a00;
  --t4096-bg: #ffc23d; --t4096-fg: #3a2600;
  --t8192-bg: #ffffff; --t8192-fg: #1f6e58;
  --tbig-bg: #e2fbf1; --tbig-fg: #073026;
}