/* GENERATED by scripts/build-theme.mjs from packages/ui/themes.json. Edit that file, never this one. */
:root {
  --surface: light-dark(#ffffff, #171a21);
  --on-accent: light-dark(#ffffff, #0f1115);
  --accent-2: var(--accent);
  --tint: light-dark(#e5e8ef, #2b2f3a);
  --tint-2: var(--tint);
  --emblem-bg: var(--tint);
  --emblem-ink: light-dark(#2b2f3a, #ffffff);
  --accent-light: #1f5eff;
  --accent-dark: #5b8bff;
}
/* Mode: system = no attribute. Embeds keep their own scheme (data-embed-theme in tokens.css). On SCREEN only: a printout
   is paper, so the mode and the body background below never reach it (tokens.css has its own print rule). */
@media screen {
  html[data-mode="light"]:not([data-embed]) { color-scheme: light; --lightningcss-light: initial; --lightningcss-dark: ; }
  html[data-mode="dark"]:not([data-embed]) { color-scheme: dark; --lightningcss-light: ; --lightningcss-dark: initial; }
  /* Beats each tool page's pre-React flash background so a chosen theme never flashes the default. */
  html[data-theme] body, html[data-mode] body { background: var(--bg); }
}
/* Indigo */
html[data-theme="indigo"] {
  --bg: light-dark(#eef2ff, #0b1020);
  --surface: light-dark(#ffffff, #141b33);
  --ink: light-dark(#0e1424, #eef2ff);
  --ink-soft: light-dark(#4d5a7c, #98a3c7);
  --rule: light-dark(#c9d3ef, #252e50);
  --accent: light-dark(#1f5eff, #7099ff);
  --on-accent: light-dark(#ffffff, #0b1020);
  --accent-2: light-dark(#e8572a, #ff9466);
  --tint: light-dark(#dce5ff, #1b2654);
  --tint-2: light-dark(#ffe6dc, #3a2218);
  --accent-light: #1f5eff;
  --accent-dark: #7099ff;
}
html[data-theme="indigo"] { --emblem-bg: var(--tint); --emblem-ink: var(--accent); }
/* Gachapon */
html[data-theme="gachapon"] {
  --bg: light-dark(#f4f6fb, #101320);
  --surface: light-dark(#ffffff, #191d2d);
  --ink: light-dark(#121521, #f1f3fa);
  --ink-soft: light-dark(#596079, #9aa1b9);
  --rule: light-dark(#d6dbe8, #2a2f45);
  --accent: light-dark(#1f5eff, #6a92ff);
  --on-accent: light-dark(#ffffff, #101320);
  --accent-2: light-dark(#e5384b, #ff6b78);
  --tint: light-dark(#e1e9ff, #1c2650);
  --tint-2: light-dark(#ffe2e5, #3d1a22);
  --accent-light: #1f5eff;
  --accent-dark: #6a92ff;
}
html[data-theme="gachapon"] { --emblem-bg: var(--tint); --emblem-ink: var(--accent); }
html[data-theme="gachapon"] [data-cat="video"],
html[data-theme="gachapon"] [data-cat="text"],
html[data-theme="gachapon"] [data-cat="crafts"],
html[data-theme="gachapon"] [data-cat="dev-web"],
html[data-theme="gachapon"] [data-cat="diy-trades"],
html[data-theme="gachapon"] [data-cat="random"],
html[data-theme="gachapon"] [data-cat="food-drink"],
html[data-theme="gachapon"] [data-cat="productivity-print"],
html[data-theme="gachapon"] [data-cat="timers-clocks"],
html[data-theme="gachapon"] [data-cat="units"] { --emblem-bg: var(--tint-2); --emblem-ink: var(--accent-2); }
/* Spectra */
html[data-theme="spectra"] {
  --bg: light-dark(#f4f6fa, #0f1218);
  --surface: light-dark(#ffffff, #181c25);
  --ink: light-dark(#101420, #eef1f7);
  --ink-soft: light-dark(#576079, #99a1b5);
  --rule: light-dark(#d6dbe6, #283040);
  --accent: light-dark(#1f5eff, #6f97ff);
  --on-accent: light-dark(#ffffff, #0f1218);
  --accent-2: light-dark(#0c8f6a, #3fd19f);
  --tint: light-dark(#e3eaff, #1c2750);
  --tint-2: light-dark(#d9f3ea, #12302a);
  --accent-light: #1f5eff;
  --accent-dark: #6f97ff;
}
html[data-theme="spectra"] { --emblem-bg: var(--tint); --emblem-ink: var(--accent); }
html[data-theme="spectra"] [data-cat="image"],
html[data-theme="spectra"] [data-cat="diy-trades"],
html[data-theme="spectra"] [data-cat="food-drink"] { --emblem-ink: light-dark(#e8590c, #ff8c42); --emblem-bg: color-mix(in srgb, light-dark(#e8590c, #ff8c42) 14%, var(--surface)); }
html[data-theme="spectra"] [data-cat="video"],
html[data-theme="spectra"] [data-cat="games"],
html[data-theme="spectra"] [data-cat="random"],
html[data-theme="spectra"] [data-cat="health-fitness"] { --emblem-ink: light-dark(#d6336c, #ff6b9e); --emblem-bg: color-mix(in srgb, light-dark(#d6336c, #ff6b9e) 14%, var(--surface)); }
html[data-theme="spectra"] [data-cat="audio"],
html[data-theme="spectra"] [data-cat="dev-web"],
html[data-theme="spectra"] [data-cat="timers-clocks"] { --emblem-ink: light-dark(#7048e8, #a08bff); --emblem-bg: color-mix(in srgb, light-dark(#7048e8, #a08bff) 14%, var(--surface)); }
html[data-theme="spectra"] [data-cat="text"],
html[data-theme="spectra"] [data-cat="data"],
html[data-theme="spectra"] [data-cat="math-geometry"],
html[data-theme="spectra"] [data-cat="units"] { --emblem-ink: light-dark(#1f5eff, #6f97ff); --emblem-bg: color-mix(in srgb, light-dark(#1f5eff, #6f97ff) 14%, var(--surface)); }
html[data-theme="spectra"] [data-cat="pdf"],
html[data-theme="spectra"] [data-cat="hardware-system"],
html[data-theme="spectra"] [data-cat="productivity-print"] { --emblem-ink: light-dark(#d9302c, #ff6b66); --emblem-bg: color-mix(in srgb, light-dark(#d9302c, #ff6b66) 14%, var(--surface)); }
html[data-theme="spectra"] [data-cat="crafts"],
html[data-theme="spectra"] [data-cat="finance"],
html[data-theme="spectra"] [data-cat="science-nature"] { --emblem-ink: light-dark(#0c8f6a, #3fd19f); --emblem-bg: color-mix(in srgb, light-dark(#0c8f6a, #3fd19f) 14%, var(--surface)); }
/* Laguna */
html[data-theme="laguna"] {
  --bg: light-dark(#eef7f6, #091517);
  --surface: light-dark(#ffffff, #10201f);
  --ink: light-dark(#0d1f22, #e6f4f2);
  --ink-soft: light-dark(#4b6669, #8fb0ad);
  --rule: light-dark(#c8e0de, #1f3533);
  --accent: light-dark(#0a7c76, #2fd1c5);
  --on-accent: light-dark(#ffffff, #091517);
  --accent-2: light-dark(#d9620f, #ffa261);
  --tint: light-dark(#d3eeeb, #0f302d);
  --tint-2: light-dark(#ffe6d3, #3a2412);
  --accent-light: #0a7c76;
  --accent-dark: #2fd1c5;
}
html[data-theme="laguna"] { --emblem-bg: var(--tint); --emblem-ink: var(--accent); }
/* Tango */
html[data-theme="tango"] {
  --bg: light-dark(#f3f4f8, #11141f);
  --surface: light-dark(#ffffff, #1a1e2d);
  --ink: light-dark(#141a2e, #f3f4f8);
  --ink-soft: light-dark(#565f7a, #9aa1b8);
  --rule: light-dark(#d7dbe7, #2b3044);
  --accent: light-dark(#c34606, #ff8a3d);
  --on-accent: light-dark(#ffffff, #11141f);
  --accent-2: light-dark(#2747d6, #8aa0ff);
  --tint: light-dark(#ffe7d7, #3a2416);
  --tint-2: light-dark(#e2e7ff, #1e2550);
  --accent-light: #c34606;
  --accent-dark: #ff8a3d;
}
html[data-theme="tango"] { --emblem-bg: var(--tint); --emblem-ink: var(--accent); }
/* Ube */
html[data-theme="ube"] {
  --bg: light-dark(#f5f2fb, #120e1d);
  --surface: light-dark(#ffffff, #1c1630);
  --ink: light-dark(#1b1430, #f3effb);
  --ink-soft: light-dark(#625a7c, #a59cc0);
  --rule: light-dark(#ddd5ee, #2e2645);
  --accent: light-dark(#6236d0, #a585ff);
  --on-accent: light-dark(#ffffff, #120e1d);
  --accent-2: light-dark(#8a6400, #ffd34d);
  --tint: light-dark(#ebe3fb, #28204a);
  --tint-2: light-dark(#fff0bf, #3a3010);
  --accent-light: #6236d0;
  --accent-dark: #a585ff;
}
html[data-theme="ube"] { --emblem-bg: var(--tint); --emblem-ink: var(--accent); }
/* Matcha */
html[data-theme="matcha"] {
  --bg: light-dark(#f1f5ee, #0e130e);
  --surface: light-dark(#ffffff, #161d16);
  --ink: light-dark(#141d14, #ecf3e8);
  --ink-soft: light-dark(#556353, #9cad97);
  --rule: light-dark(#d3dfcd, #263226);
  --accent: light-dark(#2b7330, #7ccf6a);
  --on-accent: light-dark(#ffffff, #0e130e);
  --accent-2: light-dark(#c9442f, #ff8170);
  --tint: light-dark(#dcedd5, #1b2d19);
  --tint-2: light-dark(#ffe2dc, #3a1c17);
  --accent-light: #2b7330;
  --accent-dark: #7ccf6a;
}
html[data-theme="matcha"] { --emblem-bg: var(--tint); --emblem-ink: var(--accent); }
/* Sakura */
html[data-theme="sakura"] {
  --bg: light-dark(#fbf3f5, #151013);
  --surface: light-dark(#ffffff, #1f181c);
  --ink: light-dark(#1d1418, #f8eef1);
  --ink-soft: light-dark(#6d5a62, #b39ba4);
  --rule: light-dark(#efd9df, #34282e);
  --accent: light-dark(#c42a61, #ff7aa8);
  --on-accent: light-dark(#ffffff, #151013);
  --accent-2: light-dark(#2b59c3, #8fadff);
  --tint: light-dark(#fde1ea, #3a1d29);
  --tint-2: light-dark(#e1e9ff, #1d2547);
  --accent-light: #c42a61;
  --accent-dark: #ff7aa8;
}
html[data-theme="sakura"] { --emblem-bg: var(--tint); --emblem-ink: var(--accent); }
html[data-theme="sakura"] [data-cat="video"],
html[data-theme="sakura"] [data-cat="text"],
html[data-theme="sakura"] [data-cat="crafts"],
html[data-theme="sakura"] [data-cat="dev-web"],
html[data-theme="sakura"] [data-cat="diy-trades"],
html[data-theme="sakura"] [data-cat="random"],
html[data-theme="sakura"] [data-cat="food-drink"],
html[data-theme="sakura"] [data-cat="productivity-print"],
html[data-theme="sakura"] [data-cat="timers-clocks"],
html[data-theme="sakura"] [data-cat="units"] { --emblem-bg: var(--tint-2); --emblem-ink: var(--accent-2); }
/* Lumen */
html[data-theme="lumen"] {
  --bg: light-dark(#f4f5fa, #0d0e1f);
  --surface: light-dark(#ffffff, #171933);
  --ink: light-dark(#151832, #f2f2fa);
  --ink-soft: light-dark(#5a5f80, #a0a3c4);
  --rule: light-dark(#d8dbea, #2a2c4d);
  --accent: light-dark(#a04f00, #ffb547);
  --on-accent: light-dark(#ffffff, #0d0e1f);
  --accent-2: light-dark(#4b3fd6, #9d95ff);
  --tint: light-dark(#fdebd6, #3a2a12);
  --tint-2: light-dark(#e6e4ff, #221f4d);
  --accent-light: #a04f00;
  --accent-dark: #ffb547;
}
html[data-theme="lumen"] { --emblem-bg: var(--tint); --emblem-ink: var(--accent); }