/* by jqu224 — semantic tokens for index page (colors + typography + radii).
 * Loaded after index-home-search.css. Theme ids match index-home.js (DARK_THEME_IDS + LIGHT_THEME_IDS).
 */

html {
  --hm-body-bg: linear-gradient(
    135deg,
    #0f0c29 0%,
    #1a1040 25%,
    #1e2a4a 50%,
    #1a3a4a 75%,
    #0d1a2a 100%
  );
  --hm-text: #fff;
  --hm-glow-tl: radial-gradient(circle, #6366f12e 0%, #0000 60%);
  --hm-glow-br: radial-gradient(circle, #ec48991f 0%, #0000 60%);
  --hm-section-title: #ffffff61;
  --hm-section-line: #ffffff14;
  --hm-card-bg: #ffffff0d;
  --hm-card-border: #ffffff17;
  --hm-card-hover-bg: #ffffff17;
  --hm-card-hover-border: #fff3;
  --hm-card-shadow: 0 12px 40px #00000059;
  --hm-card-info-bg: #0a0a12f2;
  --hm-card-title: #f4f4f8;
  --hm-card-genre: #a8a8c8;
  --hm-card-visual-overlay: linear-gradient(#0000, #00000059);
  --hm-cv1: linear-gradient(135deg, #1a2f4a, #0f1f3a);
  --hm-cv2: linear-gradient(135deg, #1a2a1a, #0f200f);
  --hm-cv3: linear-gradient(135deg, #2a1a2a, #1f0f1f);
  --hm-cv4: linear-gradient(135deg, #1a3a2a, #0f200f);
  --hm-cv5: linear-gradient(135deg, #2a1a0f, #1f0f07);
  --hm-cv6: linear-gradient(135deg, #0f2a2a, #07201f);
  --hm-cv7: linear-gradient(135deg, #1a1a2a, #0f0f1f);
  --hm-footer-main: #fff3;
  --hm-footer-tagline: #fff3;
  --hm-footer-dot: #ffffff26;
  --hm-footer-clock: #ffffff24;
  --hm-nav-text: #cbd5e1c4;
  --hm-nav-text-hover: #f1f5f9;
  --hm-nav-bg: transparent;
  --hm-nav-bg-hover: rgba(255, 255, 255, 0.06);
  --hm-nav-border: rgba(255, 255, 255, 0.12);
  --hm-nav-active-text: #f8fafc;
  --hm-nav-active-accent: #a78bfa;
  --hm-nav-active-bg: rgba(99, 102, 241, 0.15);
  --hm-sub-text: #94a3b8d0;
  --hm-sub-text-hover: #e2e8f0;
  --hm-sub-active-text: #e0e7ff;
  --hm-sub-active-bg: rgba(79, 70, 229, 0.18);
  --hm-sub-active-border: rgba(129, 140, 248, 0.45);
  --hm-search-text: #e2e8f0;
  --hm-search-bg: #ffffff10;
  --hm-search-border: #ffffff24;
  --hm-search-placeholder: #94a3b88c;
  --hm-search-hover-bg: #ffffff14;
  --hm-search-hover-border: #ffffff38;
  --hm-search-focus-bg: #ffffff12;
  --hm-search-focus-border: #a78bfa98;
  --hm-search-focus-ring: rgba(99, 102, 241, 0.2);
  --hm-search-clear-text: #cbd5e1b8;
  --hm-search-clear-bg: #ffffff12;
  --hm-search-clear-border: #ffffff20;
  --hm-search-clear-hover-text: #f1f5f9;
  --hm-search-clear-hover-bg: #ffffff1f;
  --hm-search-icon-opacity: 0.55;
  --hm-meta-text: rgba(203, 213, 225, 0.55);
  --hm-nav-context: #cbd5e1b8;
  --hm-sub-shelf-title: #e2e8f0;
  --hm-strip-scrollbar: #ffffff2a;
  --hm-empty-title: rgba(255, 255, 255, 0.85);
  --hm-empty-hint: rgba(255, 255, 255, 0.55);
  --hm-theme-toggle-fg: #e2e8f0;
  --hm-theme-toggle-bg: rgba(255, 255, 255, 0.1);
  --hm-theme-toggle-border: rgba(255, 255, 255, 0.28);
  --hm-theme-toggle-hover-bg: rgba(255, 255, 255, 0.16);
  --hm-theme-toggle-shadow: 0 4px 18px rgba(0, 0, 0, 0.18);
  --hm-search-radius: 999px;
  /* Typography + layout (dark default — Inter / Outfit) */
  --hm-font-sans: Inter, "Noto Sans SC", system-ui, -apple-system, sans-serif;
  --hm-font-hero: Outfit, Inter, system-ui, sans-serif;
  /* Card copy follows theme stack; override in a theme block for a different face. */
  --hm-font-card: var(--hm-font-sans);
  --hm-font-mono: ui-monospace, "JetBrains Mono", monospace;
  --hm-root-font-size: 14.4px;
  --hm-weight-body: 400;
  --hm-weight-semibold: 600;
  --hm-weight-bold: 700;
  --hm-card-title-size: 11px;
  --hm-card-genre-size: 9px;
  --hm-section-title-size: 9px;
  --hm-nav-font-size: 12px;
  --hm-sub-font-size: 11px;
  --hm-footer-font-size: 10px;
  --hm-catalog-meta-size: 11px;
  --hm-search-input-size: 13px;
  --hm-sub-shelf-title-size: 11px;
  --hm-radius-card: 14px;
  --hm-radius-theme-toggle: 10px;
  --hm-lh-title-size: clamp(28px, 8vw, 40px);
  --hm-lh-title-weight: 900;
  --hm-lh-eyebrow-size: 11px;
  --hm-lh-byline-size: 10px;
  --hm-lh-stat-n-size: 22px;
  --hm-lh-stat-l-size: 9px;
  --hm-lh-c-name-size: 15px;
  --hm-lh-c-sub-size: 11px;
  --hm-hero-title-gradient: linear-gradient(100deg, #ff7eb3 0%, #b388ff 50%, #c084fc 100%);
  --hm-tracking-hero-title: -0.02em;
  --hm-tracking-section: 2px;
  --hm-fx-opacity: 0.85;
  --hm-fx-blend: screen;
}

/* Shared defaults for `light`, `light-warm`, `light-cool`, … (overrides follow). */
html[data-theme^="light"] {
  --hm-body-bg: radial-gradient(1200px 800px at 20% 12%, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0) 60%),
    radial-gradient(900px 700px at 82% 18%, rgba(255, 255, 255, 0.75) 0%, rgba(255, 255, 255, 0) 62%),
    linear-gradient(180deg, #f5f5f7 0%, #ffffff 32%, #f5f5f7 100%);
  --hm-text: #0f172a;
  --hm-glow-tl: radial-gradient(circle, rgba(15, 23, 42, 0.06) 0%, transparent 62%);
  --hm-glow-br: radial-gradient(circle, rgba(15, 23, 42, 0.045) 0%, transparent 62%);
  --hm-section-title: rgba(15, 23, 42, 0.45);
  --hm-section-line: rgba(15, 23, 42, 0.1);
  --hm-card-bg: rgba(255, 255, 255, 0.72);
  --hm-card-border: rgba(15, 23, 42, 0.08);
  --hm-card-hover-bg: #fff;
  --hm-card-hover-border: rgba(99, 102, 241, 0.25);
  --hm-card-shadow: 0 12px 36px rgba(15, 23, 42, 0.1);
  --hm-card-info-bg: rgba(255, 255, 255, 0.96);
  --hm-card-title: #0f172a;
  --hm-card-genre: #64748b;
  --hm-card-visual-overlay: linear-gradient(transparent, rgba(15, 23, 42, 0.06));
  --hm-cv1: linear-gradient(135deg, #e0f2fe, #dbeafe);
  --hm-cv2: linear-gradient(135deg, #fef3c7, #fde68a);
  --hm-cv3: linear-gradient(135deg, #fce7f3, #fbcfe8);
  --hm-cv4: linear-gradient(135deg, #d1fae5, #a7f3d0);
  --hm-cv5: linear-gradient(135deg, #ffedd5, #fed7aa);
  --hm-cv6: linear-gradient(135deg, #ccfbf1, #99f6e4);
  --hm-cv7: linear-gradient(135deg, #e0e7ff, #f1f5f9);
  --hm-footer-main: rgba(15, 23, 42, 0.42);
  --hm-footer-tagline: rgba(15, 23, 42, 0.42);
  --hm-footer-dot: rgba(15, 23, 42, 0.2);
  --hm-footer-clock: rgba(15, 23, 42, 0.35);
  --hm-nav-text: rgba(15, 23, 42, 0.72);
  --hm-nav-text-hover: rgba(15, 23, 42, 0.92);
  --hm-nav-bg: transparent;
  --hm-nav-bg-hover: rgba(15, 23, 42, 0.06);
  --hm-nav-border: rgba(15, 23, 42, 0.12);
  --hm-nav-active-text: rgba(15, 23, 42, 0.95);
  --hm-nav-active-accent: #6366f1;
  --hm-nav-active-bg: rgba(99, 102, 241, 0.12);
  --hm-sub-text: rgba(15, 23, 42, 0.58);
  --hm-sub-text-hover: rgba(15, 23, 42, 0.85);
  --hm-sub-active-text: rgba(67, 56, 202, 0.95);
  --hm-sub-active-bg: rgba(99, 102, 241, 0.12);
  --hm-sub-active-border: rgba(99, 102, 241, 0.32);
  --hm-search-text: #0f172a;
  --hm-search-bg: rgba(255, 255, 255, 0.72);
  --hm-search-border: rgba(15, 23, 42, 0.1);
  --hm-search-placeholder: #64748b;
  --hm-search-hover-bg: #fff;
  --hm-search-hover-border: rgba(15, 23, 42, 0.14);
  --hm-search-focus-bg: #fff;
  --hm-search-focus-border: rgba(99, 102, 241, 0.45);
  --hm-search-focus-ring: rgba(99, 102, 241, 0.15);
  --hm-search-clear-text: #64748b;
  --hm-search-clear-bg: rgba(15, 23, 42, 0.06);
  --hm-search-clear-border: rgba(15, 23, 42, 0.08);
  --hm-search-clear-hover-text: #0f172a;
  --hm-search-clear-hover-bg: rgba(15, 23, 42, 0.08);
  --hm-search-icon-opacity: 0.5;
  --hm-meta-text: rgba(15, 23, 42, 0.5);
  --hm-nav-context: rgba(15, 23, 42, 0.55);
  --hm-sub-shelf-title: rgba(15, 23, 42, 0.88);
  --hm-strip-scrollbar: rgba(15, 23, 42, 0.2);
  --hm-empty-title: rgba(15, 23, 42, 0.88);
  --hm-empty-hint: rgba(15, 23, 42, 0.5);
  --hm-theme-toggle-fg: #0f172a;
  --hm-theme-toggle-bg: rgba(255, 255, 255, 0.92);
  --hm-theme-toggle-border: rgba(15, 23, 42, 0.12);
  --hm-theme-toggle-hover-bg: #fff;
  --hm-theme-toggle-shadow: 0 4px 18px rgba(15, 23, 42, 0.08);
  --hm-search-radius: 999px;
  --hm-font-sans: Inter, "Noto Sans SC", system-ui, sans-serif;
  --hm-font-hero: Outfit, Inter, system-ui, sans-serif;
  --hm-root-font-size: 14.4px;
  --hm-card-title-size: 11px;
  --hm-section-title-size: 9px;
  --hm-nav-font-size: 12px;
  --hm-search-input-size: 13px;
  --hm-sub-shelf-title-size: 11px;
  --hm-radius-card: 14px;
  --hm-radius-theme-toggle: 10px;
  --hm-lh-title-size: clamp(28px, 8vw, 40px);
  --hm-lh-title-weight: 900;
  --hm-hero-title-gradient: linear-gradient(100deg, #6366f1 0%, #8b5cf6 50%, #a855f7 100%);
  --hm-tracking-hero-title: -0.02em;
  --hm-fx-opacity: 0.68;
  --hm-fx-blend: normal;
}

/* --- Light variants (distinct color + type + radii) --- */

html[data-theme="light-warm"] {
  --hm-body-bg: radial-gradient(900px 700px at 15% 10%, rgba(255, 248, 240, 0.95) 0%, transparent 55%),
    radial-gradient(800px 600px at 85% 20%, rgba(255, 237, 213, 0.6) 0%, transparent 58%),
    linear-gradient(180deg, #faf7f2 0%, #fffdfb 40%, #f8f1e8 100%);
  --hm-text: #292524;
  --hm-glow-tl: radial-gradient(circle, rgba(234, 88, 12, 0.08) 0%, transparent 62%);
  --hm-glow-br: radial-gradient(circle, rgba(180, 83, 9, 0.06) 0%, transparent 62%);
  --hm-section-title: rgba(41, 37, 36, 0.5);
  --hm-section-line: rgba(120, 113, 108, 0.18);
  --hm-card-bg: rgba(255, 255, 255, 0.82);
  --hm-card-border: rgba(120, 113, 108, 0.12);
  --hm-card-hover-bg: #fff;
  --hm-card-hover-border: rgba(234, 88, 12, 0.35);
  --hm-card-shadow: 0 12px 32px rgba(41, 37, 36, 0.08);
  --hm-card-info-bg: rgba(255, 253, 250, 0.96);
  --hm-card-title: #1c1917;
  --hm-card-genre: #78716c;
  --hm-card-visual-overlay: linear-gradient(transparent, rgba(28, 25, 23, 0.07));
  --hm-cv1: linear-gradient(135deg, #ffedd5, #fed7aa);
  --hm-cv2: linear-gradient(135deg, #fecaca, #fca5a5);
  --hm-cv3: linear-gradient(135deg, #fde68a, #fcd34d);
  --hm-cv4: linear-gradient(135deg, #bbf7d0, #86efac);
  --hm-cv5: linear-gradient(135deg, #e9d5ff, #d8b4fe);
  --hm-cv6: linear-gradient(135deg, #cffafe, #a5f3fc);
  --hm-cv7: linear-gradient(135deg, #fce7f3, #fbcfe8);
  --hm-footer-main: rgba(68, 64, 60, 0.55);
  --hm-footer-tagline: rgba(68, 64, 60, 0.55);
  --hm-footer-dot: rgba(68, 64, 60, 0.25);
  --hm-footer-clock: rgba(68, 64, 60, 0.4);
  --hm-nav-text: rgba(41, 37, 36, 0.72);
  --hm-nav-text-hover: rgba(28, 25, 23, 0.95);
  --hm-nav-bg-hover: rgba(234, 88, 12, 0.06);
  --hm-nav-border: rgba(120, 113, 108, 0.15);
  --hm-nav-active-text: #1c1917;
  --hm-nav-active-accent: #ea580c;
  --hm-nav-active-bg: rgba(234, 88, 12, 0.1);
  --hm-sub-text: rgba(87, 83, 78, 0.75);
  --hm-sub-text-hover: rgba(28, 25, 23, 0.9);
  --hm-sub-active-text: #9a3412;
  --hm-sub-active-bg: rgba(234, 88, 12, 0.1);
  --hm-sub-active-border: rgba(234, 88, 12, 0.35);
  --hm-search-text: #292524;
  --hm-search-bg: rgba(255, 255, 255, 0.88);
  --hm-search-border: rgba(120, 113, 108, 0.18);
  --hm-search-placeholder: #78716c;
  --hm-search-hover-bg: #fff;
  --hm-search-hover-border: rgba(234, 88, 12, 0.25);
  --hm-search-focus-bg: #fff;
  --hm-search-focus-border: rgba(234, 88, 12, 0.55);
  --hm-search-focus-ring: rgba(234, 88, 12, 0.12);
  --hm-search-clear-text: #78716c;
  --hm-search-clear-bg: rgba(254, 243, 199, 0.35);
  --hm-search-clear-border: rgba(234, 88, 12, 0.15);
  --hm-search-clear-hover-text: #1c1917;
  --hm-search-clear-hover-bg: rgba(254, 243, 199, 0.55);
  --hm-meta-text: rgba(87, 83, 78, 0.65);
  --hm-nav-context: rgba(87, 83, 78, 0.6);
  --hm-sub-shelf-title: rgba(28, 25, 23, 0.88);
  --hm-strip-scrollbar: rgba(120, 113, 108, 0.35);
  --hm-empty-title: rgba(28, 25, 23, 0.9);
  --hm-empty-hint: rgba(87, 83, 78, 0.55);
  --hm-theme-toggle-fg: #9a3412;
  --hm-theme-toggle-bg: rgba(255, 255, 255, 0.92);
  --hm-theme-toggle-border: rgba(234, 88, 12, 0.22);
  --hm-theme-toggle-hover-bg: #fff7ed;
  --hm-theme-toggle-shadow: 0 4px 18px rgba(234, 88, 12, 0.1);
  --hm-search-radius: 12px;
  --hm-font-sans: "Source Serif 4", "Noto Serif SC", "Noto Sans SC", Georgia, serif;
  --hm-font-hero: Syne, "Source Serif 4", sans-serif;
  --hm-root-font-size: 15px;
  --hm-card-title-size: 12px;
  --hm-section-title-size: 8.5px;
  --hm-nav-font-size: 12.5px;
  --hm-radius-card: 12px;
  --hm-radius-theme-toggle: 12px;
  --hm-lh-title-size: clamp(26px, 7.5vw, 38px);
  --hm-lh-title-weight: 800;
  --hm-hero-title-gradient: linear-gradient(100deg, #ea580c 0%, #f97316 45%, #fb923c 100%);
  --hm-tracking-hero-title: -0.03em;
  --hm-tracking-section: 1.5px;
}

html[data-theme="light-cool"] {
  --hm-body-bg: radial-gradient(1000px 800px at 20% 0%, rgba(241, 245, 249, 0.95) 0%, transparent 58%),
    radial-gradient(700px 500px at 90% 30%, rgba(224, 242, 254, 0.7) 0%, transparent 55%),
    linear-gradient(185deg, #f1f5f9 0%, #ffffff 45%, #e2e8f0 100%);
  --hm-text: #0f172a;
  --hm-glow-tl: radial-gradient(circle, rgba(59, 130, 246, 0.08) 0%, transparent 62%);
  --hm-glow-br: radial-gradient(circle, rgba(14, 165, 233, 0.06) 0%, transparent 62%);
  --hm-section-title: rgba(15, 23, 42, 0.42);
  --hm-section-line: rgba(51, 65, 85, 0.14);
  --hm-card-bg: rgba(255, 255, 255, 0.78);
  --hm-card-border: rgba(51, 65, 85, 0.1);
  --hm-card-hover-bg: #fff;
  --hm-card-hover-border: rgba(59, 130, 246, 0.35);
  --hm-card-shadow: 0 10px 40px rgba(15, 23, 42, 0.08);
  --hm-card-info-bg: rgba(248, 250, 252, 0.97);
  --hm-card-title: #0f172a;
  --hm-card-genre: #64748b;
  --hm-nav-active-accent: #2563eb;
  --hm-nav-active-bg: rgba(37, 99, 235, 0.1);
  --hm-sub-active-text: #1d4ed8;
  --hm-sub-active-bg: rgba(37, 99, 235, 0.08);
  --hm-search-focus-border: rgba(37, 99, 235, 0.5);
  --hm-search-focus-ring: rgba(37, 99, 235, 0.14);
  --hm-theme-toggle-fg: #1e40af;
  --hm-theme-toggle-border: rgba(37, 99, 235, 0.2);
  --hm-search-radius: 8px;
  --hm-font-sans: Inter, "Noto Sans SC", system-ui, sans-serif;
  --hm-font-hero: Inter, system-ui, sans-serif;
  --hm-root-font-size: 14px;
  --hm-radius-card: 8px;
  --hm-radius-theme-toggle: 8px;
  --hm-lh-title-weight: 800;
  --hm-hero-title-gradient: linear-gradient(95deg, #2563eb 0%, #0ea5e9 50%, #38bdf8 100%);
  --hm-tracking-hero-title: -0.04em;
}

html[data-theme="light-paper"] {
  --hm-card-visual-flat: #faf8f5;
  --hm-card-visual-overlay: transparent;
  --hm-fx-opacity: 0.52;
  --hm-body-bg: linear-gradient(180deg, #f5f0e8 0%, #faf8f5 35%, #ede8df 100%);
  --hm-text: #1a1a1a;
  --hm-glow-tl: radial-gradient(circle, rgba(0, 0, 0, 0.04) 0%, transparent 60%);
  --hm-glow-br: radial-gradient(circle, rgba(0, 0, 0, 0.03) 0%, transparent 60%);
  --hm-section-title: rgba(26, 26, 26, 0.48);
  --hm-section-line: rgba(26, 26, 26, 0.12);
  --hm-card-bg: rgba(255, 252, 247, 0.92);
  --hm-card-border: rgba(26, 26, 26, 0.1);
  --hm-card-hover-border: rgba(26, 26, 26, 0.22);
  --hm-card-info-bg: rgba(255, 252, 247, 0.98);
  --hm-nav-active-accent: #1a1a1a;
  --hm-nav-active-bg: rgba(26, 26, 26, 0.06);
  --hm-sub-active-text: #111;
  --hm-search-radius: 4px;
  --hm-font-sans: "Source Serif 4", "Noto Serif SC", "Noto Sans SC", serif;
  --hm-font-hero: "Source Serif 4", Georgia, serif;
  --hm-root-font-size: 15.2px;
  --hm-card-title-size: 12.5px;
  --hm-section-title-size: 8px;
  --hm-nav-font-size: 11.5px;
  --hm-radius-card: 4px;
  --hm-radius-theme-toggle: 4px;
  --hm-lh-title-size: clamp(24px, 7vw, 34px);
  --hm-lh-title-weight: 700;
  --hm-hero-title-gradient: linear-gradient(100deg, #1a1a1a 0%, #404040 50%, #1a1a1a 100%);
  --hm-tracking-hero-title: 0;
  --hm-tracking-section: 3px;
}

html[data-theme="light-contrast"] {
  --hm-card-visual-flat: #ffffff;
  --hm-card-visual-overlay: transparent;
  --hm-body-bg: linear-gradient(180deg, #ffffff 0%, #f8fafc 50%, #e2e8f0 100%);
  --hm-text: #020617;
  --hm-section-title: rgba(2, 6, 23, 0.55);
  --hm-section-line: rgba(2, 6, 23, 0.2);
  --hm-card-bg: #ffffff;
  --hm-card-border: rgba(2, 6, 23, 0.12);
  --hm-card-hover-bg: #f8fafc;
  --hm-card-hover-border: #020617;
  --hm-card-shadow: 0 8px 24px rgba(2, 6, 23, 0.12);
  --hm-nav-active-accent: #020617;
  --hm-nav-active-bg: rgba(2, 6, 23, 0.06);
  --hm-sub-active-text: #020617;
  --hm-search-bg: #ffffff;
  --hm-search-border: rgba(2, 6, 23, 0.2);
  --hm-search-focus-border: #020617;
  --hm-search-focus-ring: rgba(2, 6, 23, 0.12);
  --hm-search-radius: 6px;
  --hm-font-sans: Inter, "Noto Sans SC", system-ui, sans-serif;
  --hm-font-hero: Inter, system-ui, sans-serif;
  --hm-font-mono: "JetBrains Mono", ui-monospace, monospace;
  --hm-root-font-size: 14px;
  --hm-radius-card: 6px;
  --hm-radius-theme-toggle: 6px;
  --hm-lh-title-weight: 900;
  --hm-hero-title-gradient: linear-gradient(90deg, #020617 0%, #334155 100%);
  --hm-tracking-hero-title: -0.05em;
}

html[data-theme="light-mint"] {
  --hm-body-bg: radial-gradient(1000px 700px at 10% 15%, rgba(236, 253, 245, 0.95) 0%, transparent 55%),
    radial-gradient(800px 600px at 88% 25%, rgba(167, 243, 208, 0.45) 0%, transparent 58%),
    linear-gradient(175deg, #ecfdf5 0%, #ffffff 42%, #d1fae5 100%);
  --hm-text: #064e3b;
  --hm-glow-tl: radial-gradient(circle, rgba(16, 185, 129, 0.12) 0%, transparent 62%);
  --hm-glow-br: radial-gradient(circle, rgba(5, 150, 105, 0.08) 0%, transparent 62%);
  --hm-section-title: rgba(6, 78, 59, 0.5);
  --hm-card-border: rgba(16, 185, 129, 0.2);
  --hm-card-hover-border: rgba(5, 150, 105, 0.45);
  --hm-nav-active-accent: #059669;
  --hm-nav-active-bg: rgba(16, 185, 129, 0.12);
  --hm-sub-active-text: #047857;
  --hm-search-focus-border: #10b981;
  --hm-search-focus-ring: rgba(16, 185, 129, 0.18);
  --hm-theme-toggle-fg: #047857;
  --hm-search-radius: 16px;
  --hm-font-sans: "DM Sans", Inter, "Noto Sans SC", sans-serif;
  --hm-font-hero: "DM Sans", Outfit, sans-serif;
  --hm-root-font-size: 14.6px;
  --hm-radius-card: 16px;
  --hm-radius-theme-toggle: 14px;
  --hm-lh-title-size: clamp(30px, 8vw, 42px);
  --hm-hero-title-gradient: linear-gradient(100deg, #059669 0%, #34d399 50%, #6ee7b7 100%);
  --hm-tracking-hero-title: -0.02em;
}

/* --- Brand-inspired dark palettes (approximate; not affiliated) --- */

html[data-theme="cursor"] {
  --hm-body-bg: linear-gradient(160deg, #0f0f0f 0%, #1a1a2e 40%, #0d1117 100%);
  --hm-glow-tl: radial-gradient(circle, rgba(0, 200, 150, 0.12) 0%, transparent 55%);
  --hm-glow-br: radial-gradient(circle, rgba(100, 100, 255, 0.08) 0%, transparent 55%);
  --hm-nav-active-accent: #00d9a5;
  --hm-nav-active-bg: rgba(0, 217, 165, 0.12);
  --hm-search-focus-border: rgba(0, 217, 165, 0.55);
  --hm-search-focus-ring: rgba(0, 217, 165, 0.15);
  --hm-font-sans: "DM Sans", Inter, "Noto Sans SC", sans-serif;
  --hm-font-hero: "DM Sans", Outfit, sans-serif;
  --hm-radius-card: 12px;
  --hm-root-font-size: 14px;
  --hm-hero-title-gradient: linear-gradient(100deg, #00d9a5 0%, #22d3ee 40%, #a78bfa 100%);
}

html[data-theme="vercel"] {
  --hm-card-visual-flat: #0a0a0a;
  --hm-card-visual-overlay: transparent;
  --hm-body-bg: linear-gradient(180deg, #000000 0%, #0a0a0a 50%, #111 100%);
  --hm-glow-tl: radial-gradient(circle, rgba(255, 255, 255, 0.04) 0%, transparent 60%);
  --hm-glow-br: radial-gradient(circle, rgba(255, 255, 255, 0.03) 0%, transparent 60%);
  --hm-nav-active-accent: #fafafa;
  --hm-nav-active-bg: rgba(255, 255, 255, 0.08);
  --hm-card-border: rgba(255, 255, 255, 0.12);
  --hm-fx-opacity: 0.55;
  --hm-font-sans: Inter, "Noto Sans SC", system-ui, sans-serif;
  --hm-font-hero: Inter, system-ui, sans-serif;
  --hm-radius-card: 8px;
  --hm-search-radius: 8px;
  --hm-radius-theme-toggle: 8px;
  --hm-tracking-hero-title: -0.06em;
  --hm-hero-title-gradient: linear-gradient(95deg, #fafafa 0%, #a3a3a3 100%);
}

html[data-theme="linear"] {
  --hm-body-bg: linear-gradient(135deg, #0d0d12 0%, #1a1423 50%, #12101c 100%);
  --hm-glow-tl: radial-gradient(circle, rgba(94, 106, 210, 0.25) 0%, transparent 55%);
  --hm-glow-br: radial-gradient(circle, rgba(168, 85, 247, 0.12) 0%, transparent 55%);
  --hm-nav-active-accent: #5e6ad2;
  --hm-nav-active-bg: rgba(94, 106, 210, 0.2);
  --hm-search-focus-border: #5e6ad2;
  --hm-search-focus-ring: rgba(94, 106, 210, 0.25);
  --hm-font-sans: Inter, "Noto Sans SC", system-ui, sans-serif;
  --hm-font-hero: Inter, system-ui, sans-serif;
  --hm-radius-card: 10px;
  --hm-nav-font-size: 11.5px;
  --hm-hero-title-gradient: linear-gradient(100deg, #5e6ad2 0%, #a855f7 50%, #c084fc 100%);
}

html[data-theme="stripe"] {
  --hm-body-bg: linear-gradient(145deg, #0a2540 0%, #1a1f6a 45%, #0f172a 100%);
  --hm-glow-tl: radial-gradient(circle, rgba(99, 91, 255, 0.2) 0%, transparent 55%);
  --hm-glow-br: radial-gradient(circle, rgba(0, 212, 170, 0.1) 0%, transparent 55%);
  --hm-nav-active-accent: #635bff;
  --hm-nav-active-bg: rgba(99, 91, 255, 0.18);
  --hm-search-focus-border: #635bff;
  --hm-font-sans: "DM Sans", Inter, "Noto Sans SC", sans-serif;
  --hm-font-hero: "DM Sans", sans-serif;
  --hm-radius-card: 11px;
  --hm-hero-title-gradient: linear-gradient(100deg, #635bff 0%, #00d4aa 100%);
}

html[data-theme="notion"] {
  --hm-card-visual-flat: #252525;
  --hm-card-visual-overlay: transparent;
  --hm-body-bg: linear-gradient(180deg, #191919 0%, #2f2f2f 100%);
  --hm-glow-tl: radial-gradient(circle, rgba(235, 87, 87, 0.08) 0%, transparent 55%);
  --hm-glow-br: radial-gradient(circle, rgba(255, 255, 255, 0.04) 0%, transparent 60%);
  --hm-nav-active-accent: #eb5757;
  --hm-nav-active-bg: rgba(235, 87, 87, 0.12);
  --hm-font-sans: Inter, "Noto Sans SC", ui-sans-serif, sans-serif;
  --hm-font-hero: Inter, system-ui, sans-serif;
  --hm-radius-card: 6px;
  --hm-root-font-size: 14.2px;
  --hm-hero-title-gradient: linear-gradient(100deg, #eb5757 0%, #f87171 50%, #fca5a5 100%);
}

html[data-theme="spotify"] {
  --hm-body-bg: linear-gradient(160deg, #121212 0%, #1a1a1a 40%, #0b3d2e 100%);
  --hm-glow-tl: radial-gradient(circle, rgba(30, 215, 96, 0.15) 0%, transparent 55%);
  --hm-glow-br: radial-gradient(circle, rgba(30, 215, 96, 0.06) 0%, transparent 60%);
  --hm-nav-active-accent: #1ed760;
  --hm-nav-active-bg: rgba(30, 215, 96, 0.15);
  --hm-search-focus-border: #1ed760;
  --hm-font-sans: Circular, Inter, "Noto Sans SC", sans-serif;
  --hm-font-hero: Inter, system-ui, sans-serif;
  --hm-radius-card: 16px;
  --hm-search-radius: 999px;
  --hm-hero-title-gradient: linear-gradient(100deg, #1ed760 0%, #1db954 50%, #86efac 100%);
}

html[data-theme="supabase"] {
  --hm-body-bg: linear-gradient(135deg, #0c1117 0%, #0f2e24 50%, #0c1117 100%);
  --hm-glow-tl: radial-gradient(circle, rgba(62, 207, 142, 0.18) 0%, transparent 55%);
  --hm-glow-br: radial-gradient(circle, rgba(62, 207, 142, 0.08) 0%, transparent 60%);
  --hm-nav-active-accent: #3ecf8e;
  --hm-nav-active-bg: rgba(62, 207, 142, 0.15);
  --hm-search-focus-border: #3ecf8e;
  --hm-font-sans: "DM Sans", Inter, "Noto Sans SC", sans-serif;
  --hm-radius-card: 12px;
  --hm-hero-title-gradient: linear-gradient(100deg, #3ecf8e 0%, #22c55e 100%);
}

html[data-theme="github"] {
  --hm-card-visual-flat: #161b22;
  --hm-card-visual-overlay: transparent;
  --hm-body-bg: linear-gradient(180deg, #0d1117 0%, #161b22 100%);
  --hm-glow-tl: radial-gradient(circle, rgba(88, 166, 255, 0.12) 0%, transparent 55%);
  --hm-glow-br: radial-gradient(circle, rgba(240, 246, 252, 0.04) 0%, transparent 60%);
  --hm-nav-active-accent: #58a6ff;
  --hm-nav-active-bg: rgba(88, 166, 255, 0.12);
  --hm-card-border: rgba(240, 246, 252, 0.1);
  --hm-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans SC", Helvetica, Arial, sans-serif;
  --hm-font-mono: ui-monospace, "JetBrains Mono", "SFMono-Regular", monospace;
  --hm-radius-card: 6px;
  --hm-hero-title-gradient: linear-gradient(100deg, #58a6ff 0%, #a371f7 100%);
}

html[data-theme="framer"] {
  --hm-body-bg: linear-gradient(135deg, #000 0%, #0a1628 50%, #000 100%);
  --hm-glow-tl: radial-gradient(circle, rgba(0, 153, 255, 0.2) 0%, transparent 55%);
  --hm-glow-br: radial-gradient(circle, rgba(0, 153, 255, 0.06) 0%, transparent 60%);
  --hm-nav-active-accent: #09f;
  --hm-nav-active-bg: rgba(0, 153, 255, 0.15);
  --hm-font-sans: Inter, "Noto Sans SC", system-ui, sans-serif;
  --hm-font-hero: Inter, sans-serif;
  --hm-radius-card: 14px;
  --hm-lh-title-weight: 850;
  --hm-hero-title-gradient: linear-gradient(95deg, #09f 0%, #00e5ff 50%, #a78bfa 100%);
}

html[data-theme="raycast"] {
  --hm-body-bg: linear-gradient(165deg, #1a1a1c 0%, #2d1f3d 50%, #121214 100%);
  --hm-glow-tl: radial-gradient(circle, rgba(255, 94, 94, 0.12) 0%, transparent 55%);
  --hm-glow-br: radial-gradient(circle, rgba(168, 85, 247, 0.1) 0%, transparent 55%);
  --hm-nav-active-accent: #ff5e5e;
  --hm-nav-active-bg: rgba(255, 94, 94, 0.12);
  --hm-font-sans: Inter, "Noto Sans SC", system-ui, sans-serif;
  --hm-radius-card: 10px;
  --hm-hero-title-gradient: linear-gradient(100deg, #ff5e5e 0%, #a855f7 100%);
}

html[data-theme="claude"] {
  --hm-card-visual-flat: #1c1712;
  --hm-card-visual-overlay: transparent;
  --hm-body-bg: linear-gradient(135deg, #1a1510 0%, #2d2118 50%, #1a1510 100%);
  --hm-glow-tl: radial-gradient(circle, rgba(217, 119, 87, 0.2) 0%, transparent 55%);
  --hm-glow-br: radial-gradient(circle, rgba(217, 119, 87, 0.08) 0%, transparent 60%);
  --hm-nav-active-accent: #d97757;
  --hm-nav-active-bg: rgba(217, 119, 87, 0.15);
  --hm-font-sans: "Source Serif 4", "Noto Serif SC", "Noto Sans SC", serif;
  --hm-font-hero: "Source Serif 4", Georgia, serif;
  --hm-root-font-size: 14.6px;
  --hm-radius-card: 12px;
  --hm-hero-title-gradient: linear-gradient(100deg, #d97757 0%, #ea580c 50%, #fbbf24 100%);
}

html[data-theme="ollama"] {
  --hm-card-visual-flat: #121212;
  --hm-card-visual-overlay: transparent;
  --hm-body-bg: linear-gradient(180deg, #0a0a0a 0%, #1a1a1a 100%);
  --hm-glow-tl: radial-gradient(circle, rgba(255, 255, 255, 0.05) 0%, transparent 60%);
  --hm-glow-br: radial-gradient(circle, rgba(200, 200, 200, 0.04) 0%, transparent 60%);
  --hm-nav-active-accent: #e0e0e0;
  --hm-nav-active-bg: rgba(255, 255, 255, 0.08);
  --hm-font-sans: Inter, "Noto Sans SC", system-ui, sans-serif;
  --hm-radius-card: 8px;
  --hm-tracking-hero-title: -0.03em;
  --hm-hero-title-gradient: linear-gradient(90deg, #e5e5e5 0%, #a3a3a3 100%);
}

html[data-theme="airbnb"] {
  --hm-body-bg: linear-gradient(135deg, #1a0f0f 0%, #2d1810 50%, #1f0f0a 100%);
  --hm-glow-tl: radial-gradient(circle, rgba(255, 56, 92, 0.15) 0%, transparent 55%);
  --hm-glow-br: radial-gradient(circle, rgba(255, 90, 95, 0.08) 0%, transparent 60%);
  --hm-nav-active-accent: #ff385c;
  --hm-nav-active-bg: rgba(255, 56, 92, 0.12);
  --hm-font-sans: Circular, "DM Sans", Inter, "Noto Sans SC", sans-serif;
  --hm-radius-card: 14px;
  --hm-hero-title-gradient: linear-gradient(100deg, #ff385c 0%, #f43f5e 50%, #fb7185 100%);
}

html[data-theme="coinbase"] {
  --hm-body-bg: linear-gradient(145deg, #0c2340 0%, #0a2540 50%, #051a30 100%);
  --hm-glow-tl: radial-gradient(circle, rgba(0, 82, 255, 0.18) 0%, transparent 55%);
  --hm-glow-br: radial-gradient(circle, rgba(0, 200, 255, 0.08) 0%, transparent 60%);
  --hm-nav-active-accent: #0052ff;
  --hm-nav-active-bg: rgba(0, 82, 255, 0.15);
  --hm-font-sans: Inter, "Noto Sans SC", system-ui, sans-serif;
  --hm-radius-card: 10px;
  --hm-hero-title-gradient: linear-gradient(100deg, #0052ff 0%, #06b6d4 100%);
}

html[data-theme="figma"] {
  --hm-body-bg: linear-gradient(135deg, #1e1e1e 0%, #2c2c2c 50%, #181818 100%);
  --hm-glow-tl: radial-gradient(circle, rgba(163, 89, 255, 0.15) 0%, transparent 55%);
  --hm-glow-br: radial-gradient(circle, rgba(255, 115, 179, 0.1) 0%, transparent 55%);
  --hm-nav-active-accent: #a259ff;
  --hm-nav-active-bg: rgba(162, 89, 255, 0.15);
  --hm-font-sans: Inter, "Noto Sans SC", system-ui, sans-serif;
  --hm-radius-card: 8px;
  --hm-hero-title-gradient: linear-gradient(100deg, #a259ff 0%, #f472b6 50%, #fb923c 100%);
}

html[data-theme="miro"] {
  --hm-body-bg: linear-gradient(160deg, #1a1a1a 0%, #2d2510 50%, #1a1a1a 100%);
  --hm-glow-tl: radial-gradient(circle, rgba(255, 208, 0, 0.18) 0%, transparent 55%);
  --hm-glow-br: radial-gradient(circle, rgba(255, 220, 50, 0.08) 0%, transparent 60%);
  --hm-nav-active-accent: #ffd00f;
  --hm-nav-active-bg: rgba(255, 208, 0, 0.12);
  --hm-text: #fafafa;
  --hm-font-sans: "DM Sans", Inter, "Noto Sans SC", sans-serif;
  --hm-font-hero: Syne, "DM Sans", sans-serif;
  --hm-radius-card: 12px;
  --hm-hero-title-gradient: linear-gradient(100deg, #ffd00f 0%, #facc15 50%, #fde047 100%);
}

html[data-theme="mintlify"] {
  --hm-body-bg: linear-gradient(135deg, #0a1f16 0%, #0d2818 50%, #071510 100%);
  --hm-glow-tl: radial-gradient(circle, rgba(52, 211, 153, 0.18) 0%, transparent 55%);
  --hm-glow-br: radial-gradient(circle, rgba(16, 185, 129, 0.08) 0%, transparent 60%);
  --hm-nav-active-accent: #34d399;
  --hm-nav-active-bg: rgba(52, 211, 153, 0.12);
  --hm-font-sans: Inter, "Noto Sans SC", system-ui, sans-serif;
  --hm-radius-card: 11px;
  --hm-hero-title-gradient: linear-gradient(100deg, #34d399 0%, #10b981 100%);
}

html[data-theme="ibm"] {
  --hm-card-visual-flat: #151a24;
  --hm-card-visual-overlay: transparent;
  --hm-body-bg: linear-gradient(180deg, #0f131a 0%, #1a1f2e 100%);
  --hm-glow-tl: radial-gradient(circle, rgba(15, 98, 254, 0.15) 0%, transparent 55%);
  --hm-glow-br: radial-gradient(circle, rgba(15, 98, 254, 0.06) 0%, transparent 60%);
  --hm-nav-active-accent: #0f62fe;
  --hm-nav-active-bg: rgba(15, 98, 254, 0.12);
  --hm-font-sans: "IBM Plex Sans", Inter, "Noto Sans SC", sans-serif;
  --hm-font-hero: "IBM Plex Sans", Inter, sans-serif;
  --hm-radius-card: 4px;
  --hm-search-radius: 4px;
  --hm-radius-theme-toggle: 4px;
  --hm-hero-title-gradient: linear-gradient(90deg, #0f62fe 0%, #4589ff 100%);
}

html[data-theme="nike"] {
  --hm-card-visual-flat: #111111;
  --hm-card-visual-overlay: transparent;
  --hm-body-bg: linear-gradient(135deg, #0a0a0a 0%, #1a1a1a 50%, #0d0d0d 100%);
  --hm-glow-tl: radial-gradient(circle, rgba(255, 255, 255, 0.06) 0%, transparent 60%);
  --hm-glow-br: radial-gradient(circle, rgba(255, 255, 255, 0.03) 0%, transparent 60%);
  --hm-nav-active-accent: #ffffff;
  --hm-nav-active-bg: rgba(255, 255, 255, 0.1);
  --hm-font-sans: "Helvetica Neue", Helvetica, Arial, "Noto Sans SC", sans-serif;
  --hm-font-hero: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --hm-lh-title-weight: 950;
  --hm-tracking-hero-title: -0.08em;
  --hm-hero-title-gradient: linear-gradient(100deg, #ffffff 0%, #a3a3a3 100%);
}

html[data-theme="tesla"] {
  --hm-body-bg: linear-gradient(180deg, #0a0a0a 0%, #1c1c1c 50%, #0a0a0a 100%);
  --hm-glow-tl: radial-gradient(circle, rgba(220, 38, 38, 0.1) 0%, transparent 55%);
  --hm-glow-br: radial-gradient(circle, rgba(255, 255, 255, 0.04) 0%, transparent 60%);
  --hm-nav-active-accent: #e82127;
  --hm-nav-active-bg: rgba(232, 33, 39, 0.12);
  --hm-font-sans: Inter, "Noto Sans SC", system-ui, sans-serif;
  --hm-font-hero: Inter, system-ui, sans-serif;
  --hm-radius-card: 6px;
  --hm-tracking-hero-title: -0.04em;
  --hm-hero-title-gradient: linear-gradient(95deg, #e82127 0%, #f87171 50%, #ffffff 100%);
}

html[data-theme="dark"] {
  /* explicit alias — same as html default tokens */
}

/* Canvas background FX (index-home-bg-fx.js): accent/secondary from --hm-nav-active-accent + --hm-search-focus-border.
 * --hm-bg-fx-mode: streak | meteor | h-matrix | v-matrix | stars | clouds | bubbles | bloom | none | random
 *   (empty = random). Explicit keyword pins the mode; random or unset picks a new mode on each IndexBgFx.restart() (e.g. theme change). */
.index-bg-fx {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
  opacity: var(--hm-fx-opacity, 0.75);
  mix-blend-mode: var(--hm-fx-blend, screen);
}