/*
 * Japanese Zen Themes
 * Visual themes inspired by Japanese aesthetics for PRO users
 *
 * STRUCTURE:
 *   1. Theme Variables
 *   2. Global Zen-Class Overrides
 *   3. Default (Neo-Brutalist) Overrides
 *   4. Wabi-Sabi (侘寂) Overrides — broken borders, imperfection
 *   5. Sumi-e (墨絵) Overrides — fog, ink wash, frosted glass
 *   6. Anime (アニメ) Overrides — gradients, sparkles, bounce
 *   7. Kabukicho (歌舞伎町) Dark Mode Overrides
 *  10. Matsuri (祭り) — Night Festival Overrides (Dark Mode)
 *  11. Shogun Castle (将軍の城) Overrides
 *  12. Yokai World (妖怪) — Spirit World Overrides (Dark Mode)
 *   8. Keyframes
 *   9. Transitions
 */

/* ==========================================================================
   1. THEME VARIABLES
   ========================================================================== */

/* --- DEFAULT (Neo-Brutalist) --- */
:root {
  --zen-bg: #FFFFFF;
  --zen-surface: #F5F5F5;
  --zen-text: #1A1A1A;
  --zen-accent: #FF6B6B;
  --zen-success: #51CF66;
  --zen-warning: #FFA94D;
  --zen-border: #000000;

  --border-width: 3px;
  --border-radius: 0px;
  --shadow: 6px 6px 0px 0px #000000;
  --shadow-hover: 8px 8px 0px 0px #000000;
  --shadow-sm: 3px 3px 0px 0px #000000;
}

/* --- WABI-SABI (侘寂) — Imperfection --- */
[data-theme="wabi_sabi"] {
  --zen-bg: #F5F3EE;
  --zen-surface: #EAE5DC;
  --zen-text: #3A3331;
  --zen-accent: #8B7355;
  --zen-success: #7A8450;
  --zen-warning: #B8956A;
  --zen-border: #5D4E37;

  --border-width: 1px;
  --border-radius: 3px;
  --shadow: 0 2px 8px rgba(93, 78, 55, 0.08);
  --shadow-hover: 0 4px 12px rgba(93, 78, 55, 0.14);
  --shadow-sm: 0 1px 4px rgba(93, 78, 55, 0.06);
}

[data-theme="wabi_sabi"] body {
  background-color: var(--zen-bg);
  color: var(--zen-text);
  background-image:
    url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100"><filter id="noise"><feTurbulence baseFrequency="0.9" /></filter><rect width="100" height="100" filter="url(%23noise)" opacity="0.03"/></svg>');
}

/* --- SUMI-E (墨絵) — Ink fog & mist --- */
[data-theme="sumi_e"] {
  --zen-bg: #F8F8F8;
  --zen-surface: #E8E8E8;
  --zen-text: #1A1A1A;
  --zen-accent: #4A4A4A;
  --zen-success: #2C2C2C;
  --zen-warning: #6B6B6B;
  --zen-border: #333333;

  --border-width: 1px;
  --border-radius: 0px;
  --shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
  --shadow-hover: 0 8px 30px rgba(0, 0, 0, 0.12);
  --shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.06);
}

[data-theme="sumi_e"] .ink-brush {
  background: linear-gradient(180deg, #1A1A1A 0%, #4A4A4A 100%);
}

/* --- KABUKICHO (歌舞伎町) — Neon cyberpunk --- */
[data-theme="kabukicho"] {
  --zen-bg: #0A0E1A;
  --zen-surface: #1A1F35;
  --zen-text: #E0E6FF;
  --zen-accent: #FF0080;
  --zen-success: #00FFD1;
  --zen-warning: #FFD700;
  --zen-border: #FF0080;

  --border-width: 2px;
  --border-radius: 4px;
  --shadow: 0 0 20px rgba(255, 0, 128, 0.3);
  --shadow-hover: 0 0 30px rgba(255, 0, 128, 0.5);
  --shadow-sm: 0 0 10px rgba(255, 0, 128, 0.2);
}

[data-theme="kabukicho"] body {
  background: linear-gradient(180deg, #0A0E1A 0%, #1A1F35 100%);
  color: var(--zen-text);
}

[data-theme="kabukicho"] .neon-glow {
  box-shadow: 0 0 10px currentColor, 0 0 20px currentColor;
  animation: neon-pulse 2s ease-in-out infinite;
}

[data-theme="kabukicho"] h1,
[data-theme="kabukicho"] h2,
[data-theme="kabukicho"] h3 {
  text-shadow: 0 0 10px rgba(255, 0, 128, 0.5);
}

/* --- ANIME (アニメ) — Kawaii overload --- */
[data-theme="anime"] {
  --zen-bg: #FFFFFF;
  --zen-surface: #FFF5F7;
  --zen-text: #2D1B4E;
  --zen-accent: #FF6B9D;
  --zen-success: #4ECDC4;
  --zen-warning: #FFE66D;
  --zen-border: #FF6B9D;

  --border-width: 3px;
  --border-radius: 16px;
  --shadow: 4px 4px 0 0 #4ECDC4;
  --shadow-hover: 6px 6px 0 0 #4ECDC4;
  --shadow-sm: 2px 2px 0 0 #4ECDC4;
}

[data-theme="anime"] .gradient-bg {
  background: linear-gradient(135deg, #FF6B9D 0%, #A8E6CF 100%);
}

/* --- SAKURA (桜) — Cherry blossom --- */
[data-theme="sakura"] {
  --zen-bg: #FFF5F8;
  --zen-surface: #FFE8EF;
  --zen-text: #4A2035;
  --zen-accent: #D4507A;
  --zen-success: #6BAF7B;
  --zen-warning: #E8A87C;
  --zen-border: #C4637A;

  --border-width: 1px;
  --border-radius: 12px;
  --shadow: 0 3px 12px rgba(212, 80, 122, 0.12);
  --shadow-hover: 0 6px 20px rgba(212, 80, 122, 0.20);
  --shadow-sm: 0 2px 6px rgba(212, 80, 122, 0.08);
}

/* --- MAIKO (舞妓) — Geisha apprentice --- */
[data-theme="maiko"] {
  --zen-bg: #FFF9FB;
  --zen-surface: #F5EDF2;
  --zen-text: #2D1B2E;
  --zen-accent: #B8336A;
  --zen-success: #5B8A72;
  --zen-warning: #C4956A;
  --zen-border: #8B6B7D;

  --border-width: 1px;
  --border-radius: 6px;
  --shadow: 0 2px 8px rgba(184, 51, 106, 0.12);
  --shadow-hover: 0 4px 16px rgba(184, 51, 106, 0.18);
  --shadow-sm: 0 1px 4px rgba(184, 51, 106, 0.08);
}

/* --- YUME (夢) — Dream world --- */
[data-theme="yume"] {
  --zen-bg: #F8F5FF;
  --zen-surface: #EDE5FF;
  --zen-text: #2A1B3D;
  --zen-accent: #8B5CF6;
  --zen-success: #6DD3CE;
  --zen-warning: #F0B6D8;
  --zen-border: #7C5CBF;

  --border-width: 2px;
  --border-radius: 20px;
  --shadow: 0 4px 20px rgba(139, 92, 246, 0.15);
  --shadow-hover: 0 8px 30px rgba(139, 92, 246, 0.25);
  --shadow-sm: 0 2px 10px rgba(139, 92, 246, 0.10);
}

/* --- TSUKIMI (月見) — Moonlit night (Dark) --- */
[data-theme="tsukimi"] {
  --zen-bg: #0D0B1A;
  --zen-surface: #1A1530;
  --zen-text: #E8E0F0;
  --zen-accent: #C9B8FF;
  --zen-success: #7DCEA0;
  --zen-warning: #F5D090;
  --zen-border: #4A3D6B;

  --border-width: 1px;
  --border-radius: 14px;
  --shadow: 0 0 20px rgba(201, 184, 255, 0.10);
  --shadow-hover: 0 0 30px rgba(201, 184, 255, 0.18);
  --shadow-sm: 0 0 10px rgba(201, 184, 255, 0.07);
}


/* ==========================================================================
   2. GLOBAL ZEN-CLASS OVERRIDES (all non-default themes)
   ========================================================================== */

/* Backgrounds */
[data-theme]:not([data-theme="default"]) .bg-zen-bg      { background-color: var(--zen-bg) !important; }
[data-theme]:not([data-theme="default"]) .bg-zen-surface  { background-color: var(--zen-surface) !important; }
[data-theme]:not([data-theme="default"]) .bg-zen-text     { background-color: var(--zen-text) !important; }
[data-theme]:not([data-theme="default"]) .bg-zen-accent   { background-color: var(--zen-accent) !important; }
[data-theme]:not([data-theme="default"]) .bg-zen-success  { background-color: var(--zen-success) !important; }
[data-theme]:not([data-theme="default"]) .bg-zen-warning  { background-color: var(--zen-warning) !important; }

/* Text */
[data-theme]:not([data-theme="default"]) .text-zen-text    { color: var(--zen-text) !important; }
[data-theme]:not([data-theme="default"]) .text-zen-accent  { color: var(--zen-accent) !important; }
[data-theme]:not([data-theme="default"]) .text-zen-success { color: var(--zen-success) !important; }
[data-theme]:not([data-theme="default"]) .text-zen-warning { color: var(--zen-warning) !important; }

/* Borders */
[data-theme]:not([data-theme="default"]) .border-black     { border-color: var(--zen-border) !important; }
[data-theme]:not([data-theme="default"]) .border-zen-accent { border-color: var(--zen-accent) !important; }

/* Shadows */
[data-theme]:not([data-theme="default"]) .shadow-neo       { box-shadow: var(--shadow) !important; }
[data-theme]:not([data-theme="default"]) .shadow-neo-hover { box-shadow: var(--shadow-hover) !important; }
[data-theme]:not([data-theme="default"]) .shadow-neo-sm    { box-shadow: var(--shadow-sm) !important; }

/* Canvas paper — always white, never overridden by dark themes */
.zen-canvas-paper {
  background-color: #FFFFFF !important;
}

/* Canvas border — adapts to theme */
.zen-canvas-border {
  border-color: var(--zen-border) !important;
}


/* ==========================================================================
   3. DEFAULT (Neo-Brutalist) OVERRIDES
   Bolder, punchier — thick borders, heavy shadows, accent stripes
   ========================================================================== */

[data-theme="default"] button {
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  border-width: 3px !important;
}

/* Primary button: red accent stripe at bottom */
[data-theme="default"] button.bg-zen-text {
  color: white !important;
  position: relative !important;
  overflow: hidden !important;
}

[data-theme="default"] button.bg-zen-text::after {
  content: '' !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 4px !important;
  background-color: var(--zen-accent) !important;
}

/* Active level tabs: colored shadow + tilt */
[data-theme="default"] button.bg-black.text-white {
  box-shadow: 6px 6px 0px 0px var(--zen-accent) !important;
  transform: translateY(-3px) rotate(-1deg) !important;
}

/* Non-button bg-black (badges, tags): accent shadow */
[data-theme="default"] .bg-black:not(button) {
  box-shadow: 3px 3px 0px 0px var(--zen-accent) !important;
}

/* Cards hover: tilt effect */
[data-theme="default"] .shadow-neo:hover {
  transform: translate(-2px, -2px) rotate(-0.5deg) !important;
  box-shadow: 8px 8px 0px 0px #000000 !important;
}

/* Nav active: thick left accent bar */
[data-theme="default"] nav button.bg-zen-text {
  border-left: 6px solid var(--zen-accent) !important;
}

/* Progress bar fill: diagonal stripes */
[data-theme="default"] .bg-zen-success.h-full {
  background: repeating-linear-gradient(
    -45deg,
    var(--zen-success),
    var(--zen-success) 4px,
    #3dba52 4px,
    #3dba52 8px
  ) !important;
}

/* Headings: tight tracking */
[data-theme="default"] h2 {
  letter-spacing: -0.03em !important;
}

/* Scrollbar: brutalist */
[data-theme="default"] ::-webkit-scrollbar-track { background: #F5F5F5 !important; }
[data-theme="default"] ::-webkit-scrollbar-thumb { background: #1A1A1A !important; }
[data-theme="default"] ::-webkit-scrollbar-thumb:hover { background: var(--zen-accent) !important; }


/* ==========================================================================
   4. WABI-SABI (侘寂) OVERRIDES
   Broken borders, organic imperfection, aged paper, incompleteness
   ========================================================================== */

/* bg-white → warm paper */
[data-theme="wabi_sabi"] .bg-white {
  background-color: var(--zen-surface) !important;
}

/* --- Broken/incomplete borders on buttons --- */
[data-theme="wabi_sabi"] button {
  border-style: dashed !important;
  border-width: 1.5px !important;
  border-color: var(--zen-border) !important;
  border-radius: 2px !important;
  border-image: repeating-linear-gradient(
    90deg,
    var(--zen-border) 0px,
    var(--zen-border) 8px,
    transparent 8px,
    transparent 12px
  ) 1 !important;
}

/* Primary button: solid top/bottom, hidden left — incomplete feel */
[data-theme="wabi_sabi"] button.bg-zen-text {
  border-top-style: solid !important;
  border-right-style: dashed !important;
  border-bottom-style: solid !important;
  border-left-style: hidden !important;
  border-image: none !important;
  border-width: 1.5px !important;
}

/* --- Cards: rotation + gap in border corner --- */
[data-theme="wabi_sabi"] .shadow-neo {
  transform: rotate(0.3deg) !important;
  border-style: solid !important;
  border-width: 1px !important;
  position: relative !important;
}

/* Gap pseudo-element: break in bottom-right corner */
[data-theme="wabi_sabi"] .shadow-neo::before {
  content: '' !important;
  position: absolute !important;
  bottom: -1px !important;
  right: 10px !important;
  width: 30px !important;
  height: 3px !important;
  background-color: var(--zen-bg) !important;
  z-index: 1 !important;
}

/* Alternate cards rotate opposite, gap on left */
[data-theme="wabi_sabi"] .shadow-neo:nth-child(even) {
  transform: rotate(-0.3deg) !important;
}

[data-theme="wabi_sabi"] .shadow-neo:nth-child(even)::before {
  right: auto !important;
  left: 15px !important;
}

/* Hover: straighten */
[data-theme="wabi_sabi"] .shadow-neo:hover {
  transform: rotate(0deg) !important;
  box-shadow: var(--shadow-hover) !important;
}

/* --- Active tabs: solid earth tone --- */
[data-theme="wabi_sabi"] button.bg-black {
  background-color: var(--zen-text) !important;
  color: var(--zen-surface) !important;
  border-style: solid !important;
  border-image: none !important;
  box-shadow: var(--shadow-sm) !important;
  transform: translateY(-2px) rotate(-0.5deg) !important;
}

[data-theme="wabi_sabi"] button.text-gray-400 {
  color: #9B8F82 !important;
}

/* --- Softer font weights for imperfect feel --- */
[data-theme="wabi_sabi"] .font-black { font-weight: 800 !important; }
[data-theme="wabi_sabi"] .font-bold  { font-weight: 600 !important; }

/* --- Sidebar: thin organic border --- */
[data-theme="wabi_sabi"] aside.border-r-2 {
  border-right-width: 1px !important;
  border-color: rgba(93, 78, 55, 0.2) !important;
}

/* --- Progress bar: gradient fill --- */
[data-theme="wabi_sabi"] .bg-zen-success.h-full {
  background: linear-gradient(
    90deg, var(--zen-success) 0%, #8a9458 60%, var(--zen-success) 100%
  ) !important;
  border-right: none !important;
}

/* --- Scrollbar: earthy --- */
[data-theme="wabi_sabi"] ::-webkit-scrollbar-track { background: var(--zen-bg) !important; }
[data-theme="wabi_sabi"] ::-webkit-scrollbar-thumb {
  background: var(--zen-border) !important;
  border-radius: 3px !important;
}


/* ==========================================================================
   5. SUMI-E (墨絵) OVERRIDES
   Ink fog, mist, frosted glass, wash gradients
   ========================================================================== */

/* --- Body: mist gradient background --- */
[data-theme="sumi_e"] body {
  background: linear-gradient(
    180deg, #F8F8F8 0%, #F0F0F0 30%, #E8E8E8 70%, #F0F0F0 100%
  ) !important;
  background-attachment: fixed !important;
  color: var(--zen-text) !important;
}

/* --- Fog overlay at bottom of screen --- */
[data-theme="sumi_e"] main {
  position: relative !important;
}

[data-theme="sumi_e"] main::after {
  content: '' !important;
  position: fixed !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 120px !important;
  background: linear-gradient(
    to top,
    rgba(232, 232, 232, 0.9) 0%,
    rgba(232, 232, 232, 0.4) 40%,
    transparent 100%
  ) !important;
  pointer-events: none !important;
  z-index: 20 !important;
}

/* --- Cards: white for contrast, ink wash top bar --- */
[data-theme="sumi_e"] .bg-white {
  background-color: #FFFFFF !important;
}

[data-theme="sumi_e"] .shadow-neo {
  border-width: 1px !important;
  border-color: rgba(0, 0, 0, 0.15) !important;
  position: relative !important;
  overflow: hidden !important;
}

/* Ink wash accent bar at card top */
[data-theme="sumi_e"] .shadow-neo::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 3px !important;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(26, 26, 26, 0.6) 20%,
    rgba(26, 26, 26, 0.8) 50%,
    rgba(26, 26, 26, 0.6) 80%,
    transparent 100%
  ) !important;
  z-index: 1 !important;
}

[data-theme="sumi_e"] .shadow-neo:hover {
  transform: translateY(-2px) !important;
}

/* --- Buttons: thin borders --- */
[data-theme="sumi_e"] button {
  border-width: 1px !important;
  border-color: rgba(0, 0, 0, 0.2) !important;
}

/* Primary: ink wash gradient */
[data-theme="sumi_e"] .bg-zen-text {
  background: linear-gradient(180deg, #2A2A2A 0%, #1A1A1A 40%, #333333 100%) !important;
  color: #F8F8F8 !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15) !important;
  border-color: transparent !important;
}

[data-theme="sumi_e"] .bg-zen-text.text-white { color: #FFFFFF !important; }

/* Secondary: frosted glass */
[data-theme="sumi_e"] button.bg-white {
  background-color: rgba(255, 255, 255, 0.7) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  border-color: rgba(0, 0, 0, 0.12) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05) !important;
}

[data-theme="sumi_e"] button.bg-white:hover {
  background-color: rgba(255, 255, 255, 0.9) !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08) !important;
}

/* --- Active tabs: ink gradient --- */
[data-theme="sumi_e"] button.bg-black {
  background: linear-gradient(180deg, #222 0%, #111 100%) !important;
  color: #F8F8F8 !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15) !important;
  border-color: transparent !important;
  transform: translateY(-2px) !important;
}

[data-theme="sumi_e"] button.text-gray-400 {
  color: #999999 !important;
}

[data-theme="sumi_e"] button.text-gray-400:hover {
  color: #333333 !important;
  background: rgba(0, 0, 0, 0.03) !important;
}

/* --- Non-button bg-black (badges): ink gradient --- */
[data-theme="sumi_e"] .bg-black:not(button) {
  background: linear-gradient(135deg, #1A1A1A 0%, #3A3A3A 100%) !important;
}

/* --- Nav: ink gradient + left bar --- */
[data-theme="sumi_e"] nav button.bg-zen-text {
  background: linear-gradient(90deg, #1A1A1A 0%, #2A2A2A 100%) !important;
  border-left: 4px solid #000000 !important;
  border-right: none !important;
  border-top: none !important;
  border-bottom: none !important;
}

[data-theme="sumi_e"] nav button.bg-white {
  background-color: transparent !important;
}

[data-theme="sumi_e"] nav button.bg-white:hover {
  background-color: rgba(0, 0, 0, 0.03) !important;
}

/* --- Sidebar: frosted glass --- */
[data-theme="sumi_e"] aside.border-r-2 {
  background-color: rgba(255, 255, 255, 0.8) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border-right-width: 1px !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
}

/* --- Progress bar: ink fill --- */
[data-theme="sumi_e"] .bg-zen-success.h-full {
  background: linear-gradient(90deg, #1A1A1A 0%, #2C2C2C 50%, #3A3A3A 100%) !important;
  border-right: none !important;
  box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.1) !important;
}

/* --- Headings: ink style --- */
[data-theme="sumi_e"] h2 {
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
}

/* --- Scrollbar: minimal ink --- */
[data-theme="sumi_e"] ::-webkit-scrollbar-track { background: transparent !important; }
[data-theme="sumi_e"] ::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.15) !important;
  border-radius: 4px !important;
}
[data-theme="sumi_e"] ::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.3) !important;
}


/* ==========================================================================
   6. ANIME (アニメ) OVERRIDES
   Kawaii gradients, sparkles, bounce, double shadows, shimmer
   ========================================================================== */

/* --- Body: pastel gradient --- */
[data-theme="anime"] body {
  background: linear-gradient(
    135deg, #FFFFFF 0%, #FFF5F7 30%, #F0FFF4 60%, #FFF5F7 100%
  ) !important;
  background-attachment: fixed !important;
}

/* --- Everything rounds out + bouncy transitions --- */
[data-theme="anime"] button {
  border-radius: 14px !important;
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
}

[data-theme="anime"] .rounded    { border-radius: 14px !important; }
[data-theme="anime"] .rounded-lg { border-radius: 18px !important; }

/* --- Primary button: pink→purple→blue gradient --- */
[data-theme="anime"] .bg-zen-text {
  background: linear-gradient(135deg, #FF6B9D 0%, #C06BFF 50%, #6B8BFF 100%) !important;
  color: #FFFFFF !important;
  border-color: #FF6B9D !important;
  box-shadow: 4px 4px 0 0 #4ECDC4 !important;
  border-radius: 14px !important;
}

[data-theme="anime"] .bg-zen-text:hover {
  transform: translateY(-4px) scale(1.03) rotate(-1deg) !important;
  box-shadow: 6px 6px 0 0 #4ECDC4, 0 8px 25px rgba(255, 107, 157, 0.3) !important;
}

[data-theme="anime"] .bg-zen-text:active {
  transform: translateY(0) scale(0.97) !important;
  box-shadow: 2px 2px 0 0 #4ECDC4 !important;
}

[data-theme="anime"] .bg-zen-text.text-white { color: #FFFFFF !important; }

/* Secondary: pastel gradient */
[data-theme="anime"] button.bg-white {
  background: linear-gradient(135deg, #FFFFFF 0%, #FFF0F5 100%) !important;
  border-color: #FF6B9D !important;
  border-radius: 14px !important;
}

[data-theme="anime"] button.bg-white:hover {
  transform: translateY(-3px) scale(1.02) !important;
  background: linear-gradient(135deg, #FFF0F5 0%, #FFE0EC 100%) !important;
  box-shadow: 4px 4px 0 0 #FFE66D !important;
}

/* Accent: warm gradient */
[data-theme="anime"] .bg-zen-accent {
  background: linear-gradient(135deg, #FF6B9D 0%, #FF8A80 50%, #FFB74D 100%) !important;
  border-color: #FF6B9D !important;
}

[data-theme="anime"] .bg-zen-accent:hover {
  transform: translateY(-3px) scale(1.03) rotate(1deg) !important;
  box-shadow: 5px 5px 0 0 #4ECDC4, 0 8px 25px rgba(255, 107, 157, 0.3) !important;
}

/* --- Cards: double shadow + sparkle star --- */
[data-theme="anime"] .shadow-neo {
  box-shadow: 4px 4px 0 0 #4ECDC4, 8px 8px 0 0 rgba(255, 107, 157, 0.3) !important;
  border-color: #FF6B9D !important;
  border-radius: 16px !important;
  position: relative !important;
  overflow: visible !important;
}

[data-theme="anime"] .shadow-neo:hover {
  box-shadow: 6px 6px 0 0 #4ECDC4, 12px 12px 0 0 rgba(255, 107, 157, 0.3) !important;
  transform: translateY(-4px) rotate(-0.5deg) !important;
}

/* Sparkle star on card */
[data-theme="anime"] .shadow-neo::after {
  content: '\2726' !important;
  position: absolute !important;
  top: -8px !important;
  right: -8px !important;
  font-size: 16px !important;
  color: #FFE66D !important;
  animation: anime-sparkle 2s ease-in-out infinite !important;
  pointer-events: none !important;
  z-index: 10 !important;
}

/* --- Active level tabs: purple gradient + bounce --- */
[data-theme="anime"] button.bg-black {
  background: linear-gradient(135deg, #2D1B4E 0%, #6B3FA0 50%, #9B59B6 100%) !important;
  color: #FFFFFF !important;
  border-color: #FF6B9D !important;
  border-radius: 12px !important;
  box-shadow: 4px 4px 0 0 #FFE66D !important;
  transform: translateY(-3px) scale(1.05) !important;
}

[data-theme="anime"] button.text-gray-400 {
  color: #C4A1D6 !important;
  border-radius: 12px !important;
}

[data-theme="anime"] button.text-gray-400:hover {
  color: #9B59B6 !important;
  background: rgba(255, 107, 157, 0.08) !important;
  transform: scale(1.05) !important;
}

/* Non-button bg-black (badges): purple gradient */
[data-theme="anime"] .bg-black:not(button) {
  background: linear-gradient(135deg, #2D1B4E 0%, #6B3FA0 100%) !important;
  border-color: #9B59B6 !important;
}

/* --- Nav: gradient active --- */
[data-theme="anime"] nav button.bg-zen-text {
  background: linear-gradient(135deg, #FF6B9D 0%, #C06BFF 100%) !important;
  color: #FFFFFF !important;
  border-radius: 14px !important;
  box-shadow: 3px 3px 0 0 #4ECDC4 !important;
}

[data-theme="anime"] nav button.bg-white:hover {
  background: rgba(255, 107, 157, 0.06) !important;
  border-color: #FFB6C8 !important;
  transform: translateX(4px) !important;
  border-radius: 14px !important;
}

/* --- Progress bar: rounded + shimmer --- */
[data-theme="anime"] .h-4.border-2.border-black.bg-white {
  border-color: #FF6B9D !important;
  border-radius: 9999px !important;
  background-color: #FFF5F7 !important;
  overflow: hidden !important;
}

[data-theme="anime"] .bg-zen-success.h-full {
  background: linear-gradient(90deg, #4ECDC4 0%, #45B7AA 50%, #6BDFCF 100%) !important;
  border-radius: 9999px !important;
  border-right: none !important;
  position: relative !important;
  overflow: hidden !important;
}

/* Shimmer on progress fill */
[data-theme="anime"] .bg-zen-success.h-full::after {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: -100% !important;
  width: 100% !important;
  height: 100% !important;
  background: linear-gradient(
    90deg, transparent 0%, rgba(255, 255, 255, 0.4) 50%, transparent 100%
  ) !important;
  animation: anime-shimmer 2s ease-in-out infinite !important;
}

/* --- Sidebar: pastel gradient + rounded edge --- */
[data-theme="anime"] aside.border-r-2 {
  background: linear-gradient(180deg, #FFFFFF 0%, #FFF5F7 50%, #F0FFF4 100%) !important;
  border-right-color: #FFB6C8 !important;
  border-right-width: 3px !important;
  border-radius: 0 20px 20px 0 !important;
}

/* --- Headings: gradient text --- */
[data-theme="anime"] h2 {
  background: linear-gradient(135deg, #2D1B4E 0%, #FF6B9D 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

/* --- Scrollbar: pink gradient --- */
[data-theme="anime"] ::-webkit-scrollbar-track { background: #FFF5F7 !important; border-radius: 4px !important; }
[data-theme="anime"] ::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #FF6B9D 0%, #C06BFF 100%) !important;
  border-radius: 4px !important;
}
[data-theme="anime"] ::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #FF8AB5 0%, #D08BFF 100%) !important;
}


/* ==========================================================================
   7. KABUKICHO (歌舞伎町) DARK MODE OVERRIDES
   Everything below ONLY affects [data-theme="kabukicho"].
   ========================================================================== */

/* --- 7a. bg-white → dark surface --- */
[data-theme="kabukicho"] .bg-white {
  background-color: var(--zen-surface) !important;
}

/* --- 7b. Text: black/gray → light --- */
[data-theme="kabukicho"] .text-black     { color: var(--zen-text) !important; }
[data-theme="kabukicho"] .text-gray-400  { color: var(--zen-success) !important; }
[data-theme="kabukicho"] .text-gray-500  { color: #A0A4D4 !important; }
[data-theme="kabukicho"] .text-gray-600  { color: #9DA1D2 !important; }
[data-theme="kabukicho"] .text-gray-700  { color: #B0B5E0 !important; }
[data-theme="kabukicho"] .text-gray-800  { color: #CDD0F0 !important; }
[data-theme="kabukicho"] .text-white     { color: #fff !important; }
[data-theme="kabukicho"] .text-green-600 { color: var(--zen-success) !important; }
[data-theme="kabukicho"] .text-green-800 { color: #00FFD1 !important; }
[data-theme="kabukicho"] .text-yellow-600 { color: #FFD700 !important; }
[data-theme="kabukicho"] .text-yellow-800 { color: #FFD700 !important; }
[data-theme="kabukicho"] .text-red-600   { color: #FF3050 !important; }
[data-theme="kabukicho"] .font-mono      { color: var(--zen-text); }

/* --- 7c. Backgrounds: gray/color → dark --- */
[data-theme="kabukicho"] .bg-gray-50  { background-color: #141830 !important; }
[data-theme="kabukicho"] .bg-gray-100 { background-color: #1A1F38 !important; }
[data-theme="kabukicho"] .bg-gray-200 { background-color: #252A45 !important; }

[data-theme="kabukicho"] .bg-green-50  { background-color: rgba(0, 255, 209, 0.08) !important; }
[data-theme="kabukicho"] .bg-green-100 { background-color: rgba(0, 255, 209, 0.15) !important; }
[data-theme="kabukicho"] .bg-yellow-50  { background-color: rgba(255, 215, 0, 0.08) !important; }
[data-theme="kabukicho"] .bg-yellow-100 { background-color: rgba(255, 215, 0, 0.15) !important; }
[data-theme="kabukicho"] .bg-yellow-400 { background-color: #FFD700 !important; }
[data-theme="kabukicho"] .bg-blue-50    { background-color: rgba(80, 120, 255, 0.1) !important; }
[data-theme="kabukicho"] .bg-red-50  { background-color: rgba(255, 60, 80, 0.1) !important; }
[data-theme="kabukicho"] .bg-red-100 { background-color: rgba(255, 0, 128, 0.2) !important; }
[data-theme="kabukicho"] .bg-red-200 { background-color: rgba(255, 0, 128, 0.3) !important; }

[data-theme="kabukicho"] .bg-cyan-100    { background-color: rgba(0, 255, 209, 0.15) !important; }
[data-theme="kabukicho"] .bg-pink-50     { background-color: rgba(255, 0, 128, 0.08) !important; }
[data-theme="kabukicho"] .bg-pink-100    { background-color: rgba(255, 0, 128, 0.15) !important; }
[data-theme="kabukicho"] .bg-purple-50   { background-color: rgba(180, 120, 255, 0.08) !important; }
[data-theme="kabukicho"] .bg-purple-100  { background-color: rgba(180, 120, 255, 0.15) !important; }
[data-theme="kabukicho"] .bg-blue-100    { background-color: rgba(80, 120, 255, 0.15) !important; }
[data-theme="kabukicho"] .bg-orange-50   { background-color: rgba(255, 160, 50, 0.08) !important; }
[data-theme="kabukicho"] .bg-orange-100  { background-color: rgba(255, 160, 50, 0.15) !important; }
[data-theme="kabukicho"] .bg-amber-50    { background-color: rgba(255, 215, 0, 0.08) !important; }
[data-theme="kabukicho"] .bg-amber-100   { background-color: rgba(255, 215, 0, 0.15) !important; }
[data-theme="kabukicho"] .bg-indigo-50   { background-color: rgba(130, 100, 255, 0.08) !important; }
[data-theme="kabukicho"] .bg-indigo-100  { background-color: rgba(130, 100, 255, 0.15) !important; }

/* --- 7b-ext. Missing text color overrides --- */
[data-theme="kabukicho"] .text-green-700  { color: #00FFD1 !important; }
[data-theme="kabukicho"] .text-blue-700   { color: #7B9FFF !important; }
[data-theme="kabukicho"] .text-blue-800   { color: #7B9FFF !important; }
[data-theme="kabukicho"] .text-purple-700 { color: #C8A0FF !important; }
[data-theme="kabukicho"] .text-purple-800 { color: #C8A0FF !important; }
[data-theme="kabukicho"] .text-pink-600   { color: #FF60A0 !important; }
[data-theme="kabukicho"] .text-pink-700   { color: #FF60A0 !important; }
[data-theme="kabukicho"] .text-cyan-700   { color: #00FFD1 !important; }
[data-theme="kabukicho"] .text-orange-600 { color: #FFB060 !important; }
[data-theme="kabukicho"] .text-orange-700 { color: #FFB060 !important; }
[data-theme="kabukicho"] .text-indigo-700 { color: #A090FF !important; }
[data-theme="kabukicho"] .text-amber-700  { color: #FFD700 !important; }
[data-theme="kabukicho"] .text-amber-900  { color: #FFD700 !important; }

/* --- 7c-ext. Border overrides for badges --- */
[data-theme="kabukicho"] .border-purple-200,
[data-theme="kabukicho"] .border-purple-500 { border-color: rgba(180, 120, 255, 0.4) !important; }
[data-theme="kabukicho"] .border-pink-200   { border-color: rgba(255, 0, 128, 0.4) !important; }
[data-theme="kabukicho"] .border-cyan-200   { border-color: rgba(0, 255, 209, 0.4) !important; }
[data-theme="kabukicho"] .border-orange-200,
[data-theme="kabukicho"] .border-orange-300 { border-color: rgba(255, 160, 50, 0.4) !important; }
[data-theme="kabukicho"] .border-amber-300,
[data-theme="kabukicho"] .border-amber-400,
[data-theme="kabukicho"] .border-amber-600 { border-color: rgba(255, 215, 0, 0.4) !important; }
[data-theme="kabukicho"] .border-indigo-200 { border-color: rgba(130, 100, 255, 0.4) !important; }
[data-theme="kabukicho"] .border-blue-400   { border-color: rgba(80, 120, 255, 0.4) !important; }

/* --- 7c-ext. Gradient overrides for RoleBadge --- */
[data-theme="kabukicho"] .from-yellow-100 { --tw-gradient-from: rgba(255, 215, 0, 0.15) !important; }
[data-theme="kabukicho"] .to-orange-100   { --tw-gradient-to: rgba(255, 160, 50, 0.15) !important; }
[data-theme="kabukicho"] .from-blue-100   { --tw-gradient-from: rgba(80, 120, 255, 0.15) !important; }
[data-theme="kabukicho"] .to-cyan-100     { --tw-gradient-to: rgba(0, 255, 209, 0.15) !important; }
[data-theme="kabukicho"] .from-purple-100 { --tw-gradient-from: rgba(180, 120, 255, 0.15) !important; }
[data-theme="kabukicho"] .to-pink-100     { --tw-gradient-to: rgba(255, 0, 128, 0.15) !important; }
[data-theme="kabukicho"] .from-amber-200  { --tw-gradient-from: rgba(255, 215, 0, 0.20) !important; }
[data-theme="kabukicho"] .to-yellow-300   { --tw-gradient-to: rgba(255, 215, 0, 0.25) !important; }

/* --- 7d. Primary buttons: bg-zen-text → neon cyan --- */
[data-theme="kabukicho"] .bg-zen-text {
  background-color: var(--zen-success) !important;
  color: #0A0E1A !important;
  box-shadow: 0 0 15px rgba(0, 255, 209, 0.6), inset 0 0 8px rgba(0, 255, 209, 0.2) !important;
}

[data-theme="kabukicho"] .bg-zen-text.text-white,
[data-theme="kabukicho"] .bg-zen-text.text-black {
  color: #0A0E1A !important;
}

[data-theme="kabukicho"] .bg-zen-text .text-white {
  color: #0A0E1A !important;
}

/* --- 7e. Active tabs: bg-black → neon cyan --- */
[data-theme="kabukicho"] button.bg-black {
  background-color: var(--zen-success) !important;
  color: #0A0E1A !important;
  box-shadow: 0 0 20px rgba(0, 255, 209, 0.5) !important;
}

[data-theme="kabukicho"] button.bg-black.text-white {
  color: #0A0E1A !important;
}

/* Non-button bg-black → neon magenta */
[data-theme="kabukicho"] .bg-black:not(button) {
  background-color: var(--zen-accent) !important;
}

/* --- 7f. Borders --- */
[data-theme="kabukicho"] .border-gray-200,
[data-theme="kabukicho"] .border-gray-300 { border-color: #2A2F50 !important; }
[data-theme="kabukicho"] .border-dashed   { border-color: #3A3F60 !important; }
[data-theme="kabukicho"] .border-green-300 { border-color: rgba(0, 255, 209, 0.4) !important; }
[data-theme="kabukicho"] .border-green-500 { border-color: var(--zen-success) !important; }
[data-theme="kabukicho"] .border-red-500   { border-color: #FF3050 !important; }
[data-theme="kabukicho"] .border-blue-300  { border-color: rgba(80, 120, 255, 0.5) !important; }
[data-theme="kabukicho"] .border-yellow-400 { border-color: #FFD700 !important; }

[data-theme="kabukicho"] .border-zen-success {
  border-color: var(--zen-success) !important;
  box-shadow: 0 0 8px rgba(0, 255, 209, 0.4), inset 0 0 6px rgba(0, 255, 209, 0.1) !important;
}

[data-theme="kabukicho"] .border-dashed.border-gray-300  { border-color: #3A3F60 !important; }
[data-theme="kabukicho"] .border-dashed.border-green-500 { border-color: var(--zen-success) !important; }
[data-theme="kabukicho"] .border-dashed.border-red-500   { border-color: #FF3050 !important; }

/* --- 7g. Hover states --- */
[data-theme="kabukicho"] .hover\:text-black:hover    { color: var(--zen-text) !important; }
[data-theme="kabukicho"] .hover\:bg-gray-50:hover    { background-color: #1A1F38 !important; }
[data-theme="kabukicho"] .hover\:bg-gray-100:hover   { background-color: #252A45 !important; }
[data-theme="kabukicho"] .hover\:bg-red-200:hover    { background-color: rgba(255, 0, 128, 0.3) !important; }
[data-theme="kabukicho"] .hover\:bg-zinc-800:hover   { background-color: rgba(0, 255, 209, 0.8) !important; }

[data-theme="kabukicho"] button:hover:not(.bg-zen-text):not(.bg-zen-accent):not(.bg-zen-success) {
  text-shadow: 0 0 6px currentColor;
}

/* --- 7h. Neon glow effects --- */
[data-theme="kabukicho"] .bg-zen-primary {
  background-color: var(--zen-accent) !important;
  box-shadow: 0 0 10px rgba(255, 0, 128, 0.5);
}

[data-theme="kabukicho"] .bg-zen-success {
  background-color: var(--zen-success) !important;
  box-shadow: 0 0 10px rgba(0, 255, 209, 0.5);
}

[data-theme="kabukicho"] .shadow-neo {
  box-shadow: 0 0 20px rgba(255, 0, 128, 0.2), 0 0 40px rgba(255, 0, 128, 0.05) !important;
}

/* --- 7i. Links --- */
[data-theme="kabukicho"] a       { color: var(--zen-success); }
[data-theme="kabukicho"] a:hover { color: var(--zen-accent); }

/* --- 7j. Scrollbar --- */
[data-theme="kabukicho"] ::-webkit-scrollbar-track {
  background: #0A0E1A;
  border-left-color: #FF0080;
}
[data-theme="kabukicho"] ::-webkit-scrollbar-thumb {
  background: #FF0080;
  border-color: #0A0E1A;
}
[data-theme="kabukicho"] ::-webkit-scrollbar-thumb:hover {
  background: #00FFD1;
}


/* ==========================================================================
   10. MATSURI (祭り) OVERRIDES
   Night festival — paper lanterns, fireworks, warm glows on indigo sky
   ========================================================================== */

/* --- Variables --- */
[data-theme="matsuri"] {
  --zen-bg: #0D0A1A;
  --zen-surface: #1A1530;
  --zen-text: #F5E6D0;
  --zen-accent: #FF6B35;
  --zen-success: #FFD700;
  --zen-warning: #FF4444;
  --zen-border: #C8553D;

  --border-width: 2px;
  --border-radius: 6px;
  --shadow: 0 0 15px rgba(255, 107, 53, 0.2), 0 4px 12px rgba(0, 0, 0, 0.3);
  --shadow-hover: 0 0 25px rgba(255, 107, 53, 0.35), 0 6px 20px rgba(0, 0, 0, 0.4);
  --shadow-sm: 0 0 8px rgba(255, 107, 53, 0.15);
}

/* --- Body: deep night sky --- */
[data-theme="matsuri"] body {
  background: linear-gradient(180deg, #0D0A1A 0%, #1A1530 40%, #0D0A1A 100%) !important;
  background-attachment: fixed !important;
  color: var(--zen-text) !important;
}

/* --- 10a. bg-white → dark surface --- */
[data-theme="matsuri"] .bg-white {
  background-color: var(--zen-surface) !important;
}

/* --- 10b. Text: black/gray → warm light --- */
[data-theme="matsuri"] .text-black     { color: var(--zen-text) !important; }
[data-theme="matsuri"] .text-gray-400  { color: #B8A080 !important; }
[data-theme="matsuri"] .text-gray-500  { color: #C4AA8A !important; }
[data-theme="matsuri"] .text-gray-600  { color: #D0B898 !important; }
[data-theme="matsuri"] .text-gray-700  { color: #DCC8A8 !important; }
[data-theme="matsuri"] .text-gray-800  { color: #E8D8B8 !important; }
[data-theme="matsuri"] .text-white     { color: #FFF !important; }
[data-theme="matsuri"] .text-green-600 { color: var(--zen-success) !important; }
[data-theme="matsuri"] .text-green-800 { color: #FFD700 !important; }
[data-theme="matsuri"] .text-yellow-600 { color: #FFD700 !important; }
[data-theme="matsuri"] .text-yellow-800 { color: #FFD700 !important; }
[data-theme="matsuri"] .text-red-600   { color: #FF6B35 !important; }
[data-theme="matsuri"] .font-mono      { color: var(--zen-text); }

/* --- 10c. Backgrounds: gray/color → dark --- */
[data-theme="matsuri"] .bg-gray-50  { background-color: #120E24 !important; }
[data-theme="matsuri"] .bg-gray-100 { background-color: #1A1530 !important; }
[data-theme="matsuri"] .bg-gray-200 { background-color: #241E3C !important; }

[data-theme="matsuri"] .bg-green-50  { background-color: rgba(255, 215, 0, 0.08) !important; }
[data-theme="matsuri"] .bg-green-100 { background-color: rgba(255, 215, 0, 0.15) !important; }
[data-theme="matsuri"] .bg-yellow-50  { background-color: rgba(255, 215, 0, 0.08) !important; }
[data-theme="matsuri"] .bg-yellow-100 { background-color: rgba(255, 215, 0, 0.15) !important; }
[data-theme="matsuri"] .bg-yellow-400 { background-color: #FFD700 !important; }
[data-theme="matsuri"] .bg-blue-50    { background-color: rgba(255, 107, 53, 0.1) !important; }
[data-theme="matsuri"] .bg-red-50  { background-color: rgba(255, 68, 68, 0.1) !important; }
[data-theme="matsuri"] .bg-red-100 { background-color: rgba(255, 68, 68, 0.2) !important; }
[data-theme="matsuri"] .bg-red-200 { background-color: rgba(255, 68, 68, 0.3) !important; }

[data-theme="matsuri"] .bg-cyan-100    { background-color: rgba(255, 215, 0, 0.15) !important; }
[data-theme="matsuri"] .bg-pink-50     { background-color: rgba(255, 107, 53, 0.08) !important; }
[data-theme="matsuri"] .bg-pink-100    { background-color: rgba(255, 107, 53, 0.15) !important; }
[data-theme="matsuri"] .bg-purple-50   { background-color: rgba(200, 140, 255, 0.08) !important; }
[data-theme="matsuri"] .bg-purple-100  { background-color: rgba(200, 140, 255, 0.15) !important; }
[data-theme="matsuri"] .bg-blue-100    { background-color: rgba(255, 107, 53, 0.15) !important; }
[data-theme="matsuri"] .bg-orange-50   { background-color: rgba(255, 107, 53, 0.08) !important; }
[data-theme="matsuri"] .bg-orange-100  { background-color: rgba(255, 107, 53, 0.15) !important; }
[data-theme="matsuri"] .bg-amber-50    { background-color: rgba(255, 215, 0, 0.08) !important; }
[data-theme="matsuri"] .bg-amber-100   { background-color: rgba(255, 215, 0, 0.15) !important; }
[data-theme="matsuri"] .bg-indigo-50   { background-color: rgba(200, 140, 255, 0.08) !important; }
[data-theme="matsuri"] .bg-indigo-100  { background-color: rgba(200, 140, 255, 0.15) !important; }

/* --- 10b-ext. Missing text color overrides --- */
[data-theme="matsuri"] .text-green-700  { color: #FFD700 !important; }
[data-theme="matsuri"] .text-blue-700   { color: #FFAA60 !important; }
[data-theme="matsuri"] .text-blue-800   { color: #FFAA60 !important; }
[data-theme="matsuri"] .text-purple-700 { color: #D8A0FF !important; }
[data-theme="matsuri"] .text-purple-800 { color: #D8A0FF !important; }
[data-theme="matsuri"] .text-pink-600   { color: #FF8B55 !important; }
[data-theme="matsuri"] .text-pink-700   { color: #FF8B55 !important; }
[data-theme="matsuri"] .text-cyan-700   { color: #FFD700 !important; }
[data-theme="matsuri"] .text-orange-600 { color: #FF8B55 !important; }
[data-theme="matsuri"] .text-orange-700 { color: #FFB870 !important; }
[data-theme="matsuri"] .text-indigo-700 { color: #D8A0FF !important; }
[data-theme="matsuri"] .text-amber-700  { color: #FFD700 !important; }
[data-theme="matsuri"] .text-amber-900  { color: #FFD700 !important; }

/* --- 10c-ext. Border overrides for badges --- */
[data-theme="matsuri"] .border-purple-200,
[data-theme="matsuri"] .border-purple-500 { border-color: rgba(200, 140, 255, 0.4) !important; }
[data-theme="matsuri"] .border-pink-200   { border-color: rgba(255, 107, 53, 0.4) !important; }
[data-theme="matsuri"] .border-cyan-200   { border-color: rgba(255, 215, 0, 0.4) !important; }
[data-theme="matsuri"] .border-orange-200,
[data-theme="matsuri"] .border-orange-300 { border-color: rgba(255, 107, 53, 0.4) !important; }
[data-theme="matsuri"] .border-amber-300,
[data-theme="matsuri"] .border-amber-400,
[data-theme="matsuri"] .border-amber-600 { border-color: rgba(255, 215, 0, 0.4) !important; }
[data-theme="matsuri"] .border-indigo-200 { border-color: rgba(200, 140, 255, 0.4) !important; }
[data-theme="matsuri"] .border-blue-400   { border-color: rgba(255, 107, 53, 0.4) !important; }

/* --- 10c-ext. Gradient overrides for RoleBadge --- */
[data-theme="matsuri"] .from-yellow-100 { --tw-gradient-from: rgba(255, 215, 0, 0.15) !important; }
[data-theme="matsuri"] .to-orange-100   { --tw-gradient-to: rgba(255, 107, 53, 0.15) !important; }
[data-theme="matsuri"] .from-blue-100   { --tw-gradient-from: rgba(255, 107, 53, 0.15) !important; }
[data-theme="matsuri"] .to-cyan-100     { --tw-gradient-to: rgba(255, 215, 0, 0.15) !important; }
[data-theme="matsuri"] .from-purple-100 { --tw-gradient-from: rgba(200, 140, 255, 0.15) !important; }
[data-theme="matsuri"] .to-pink-100     { --tw-gradient-to: rgba(255, 107, 53, 0.15) !important; }
[data-theme="matsuri"] .from-amber-200  { --tw-gradient-from: rgba(255, 215, 0, 0.20) !important; }
[data-theme="matsuri"] .to-yellow-300   { --tw-gradient-to: rgba(255, 215, 0, 0.25) !important; }

/* --- 10d. Primary buttons: warm fire gradient --- */
[data-theme="matsuri"] .bg-zen-text {
  background: linear-gradient(135deg, #FF6B35 0%, #C8553D 100%) !important;
  color: #FFF8F0 !important;
  box-shadow: 0 0 15px rgba(255, 107, 53, 0.5), inset 0 0 8px rgba(255, 215, 0, 0.15) !important;
}

[data-theme="matsuri"] .bg-zen-text.text-white,
[data-theme="matsuri"] .bg-zen-text.text-black {
  color: #FFF8F0 !important;
}

[data-theme="matsuri"] .bg-zen-text .text-white {
  color: #FFF8F0 !important;
}

/* --- 10e. Active tabs: gold gradient --- */
[data-theme="matsuri"] button.bg-black {
  background: linear-gradient(135deg, #FFD700 0%, #FFA500 100%) !important;
  color: #0D0A1A !important;
  box-shadow: 0 0 20px rgba(255, 215, 0, 0.4) !important;
}

[data-theme="matsuri"] button.bg-black.text-white {
  color: #0D0A1A !important;
}

/* Non-button bg-black → warm orange */
[data-theme="matsuri"] .bg-black:not(button) {
  background: linear-gradient(135deg, #FF6B35 0%, #C8553D 100%) !important;
}

/* --- 10f. Borders --- */
[data-theme="matsuri"] .border-gray-200,
[data-theme="matsuri"] .border-gray-300 { border-color: #2A2240 !important; }
[data-theme="matsuri"] .border-dashed   { border-color: #3A3250 !important; }
[data-theme="matsuri"] .border-green-300 { border-color: rgba(255, 215, 0, 0.4) !important; }
[data-theme="matsuri"] .border-green-500 { border-color: var(--zen-success) !important; }
[data-theme="matsuri"] .border-red-500   { border-color: #FF4444 !important; }
[data-theme="matsuri"] .border-blue-300  { border-color: rgba(255, 107, 53, 0.5) !important; }
[data-theme="matsuri"] .border-yellow-400 { border-color: #FFD700 !important; }

/* --- 10g. Cards: warm lantern glow bar on top --- */
[data-theme="matsuri"] .shadow-neo {
  box-shadow: 0 0 15px rgba(255, 107, 53, 0.15), 0 0 30px rgba(255, 215, 0, 0.05) !important;
  position: relative !important;
  overflow: hidden !important;
}

[data-theme="matsuri"] .shadow-neo::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 3px !important;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(255, 215, 0, 0.5) 20%,
    rgba(255, 107, 53, 0.8) 50%,
    rgba(255, 215, 0, 0.5) 80%,
    transparent 100%
  ) !important;
  z-index: 1 !important;
}

[data-theme="matsuri"] .shadow-neo:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 0 25px rgba(255, 107, 53, 0.25), 0 0 40px rgba(255, 215, 0, 0.1) !important;
}

/* --- 10h. Hover states --- */
[data-theme="matsuri"] .hover\:text-black:hover    { color: var(--zen-text) !important; }
[data-theme="matsuri"] .hover\:bg-gray-50:hover    { background-color: #1A1530 !important; }
[data-theme="matsuri"] .hover\:bg-gray-100:hover   { background-color: #241E3C !important; }
[data-theme="matsuri"] .hover\:bg-red-200:hover    { background-color: rgba(255, 68, 68, 0.3) !important; }
[data-theme="matsuri"] .hover\:bg-zinc-800:hover   { background-color: rgba(255, 215, 0, 0.8) !important; }

[data-theme="matsuri"] button:hover:not(.bg-zen-text):not(.bg-zen-accent):not(.bg-zen-success) {
  text-shadow: 0 0 6px rgba(255, 215, 0, 0.4);
}

/* --- 10i. Headings: warm glow --- */
[data-theme="matsuri"] h1,
[data-theme="matsuri"] h2,
[data-theme="matsuri"] h3 {
  text-shadow: 0 0 10px rgba(255, 107, 53, 0.4) !important;
}

/* --- 10j. Nav: gold left bar --- */
[data-theme="matsuri"] nav button.bg-zen-text {
  background: linear-gradient(90deg, #FF6B35 0%, #C8553D 100%) !important;
  border-left: 4px solid #FFD700 !important;
  border-right: none !important;
  border-top: none !important;
  border-bottom: none !important;
}

[data-theme="matsuri"] nav button.bg-white {
  background-color: transparent !important;
}

[data-theme="matsuri"] nav button.bg-white:hover {
  background-color: rgba(255, 107, 53, 0.08) !important;
}

/* --- 10k. Sidebar --- */
[data-theme="matsuri"] aside.border-r-2 {
  background-color: rgba(26, 21, 48, 0.9) !important;
  border-right-width: 1px !important;
  border-color: rgba(200, 85, 61, 0.3) !important;
}

/* --- 10l. Progress bar: fire gradient --- */
[data-theme="matsuri"] .bg-zen-success.h-full {
  background: linear-gradient(90deg, #FF6B35 0%, #FFD700 50%, #FF6B35 100%) !important;
  border-right: none !important;
}

/* --- 10m. Links --- */
[data-theme="matsuri"] a       { color: var(--zen-success); }
[data-theme="matsuri"] a:hover { color: var(--zen-accent); }

/* --- 10n. Scrollbar --- */
[data-theme="matsuri"] ::-webkit-scrollbar-track {
  background: #0D0A1A !important;
}
[data-theme="matsuri"] ::-webkit-scrollbar-thumb {
  background: #C8553D !important;
}
[data-theme="matsuri"] ::-webkit-scrollbar-thumb:hover {
  background: #FFD700 !important;
}

[data-theme="matsuri"] button.text-gray-400 {
  color: #B8A080 !important;
}

[data-theme="matsuri"] button.text-gray-400:hover {
  color: #FFD700 !important;
  background: rgba(255, 107, 53, 0.08) !important;
}


/* ==========================================================================
   11. SHOGUN_CASTLE (将軍の城) OVERRIDES
   Regal, powerful — castle walls, gold leaf, vermillion gates
   ========================================================================== */

/* --- Variables --- */
[data-theme="shogun_castle"] {
  --zen-bg: #F5F0E8;
  --zen-surface: #EDE5D8;
  --zen-text: #1A0F0A;
  --zen-accent: #8B0000;
  --zen-success: #2D5016;
  --zen-warning: #B8860B;
  --zen-border: #1A0F0A;

  --border-width: 3px;
  --border-radius: 0px;
  --shadow: 4px 4px 0 0 rgba(139, 0, 0, 0.3);
  --shadow-hover: 6px 6px 0 0 rgba(139, 0, 0, 0.4);
  --shadow-sm: 2px 2px 0 0 rgba(139, 0, 0, 0.2);
}

/* --- Body: aged parchment texture --- */
[data-theme="shogun_castle"] body {
  background-color: var(--zen-bg) !important;
  color: var(--zen-text) !important;
  background-image:
    url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100"><filter id="noise"><feTurbulence baseFrequency="0.7" /></filter><rect width="100" height="100" filter="url(%23noise)" opacity="0.02"/></svg>') !important;
}

/* --- bg-white → warm cream --- */
[data-theme="shogun_castle"] .bg-white {
  background-color: var(--zen-surface) !important;
}

/* --- Buttons: heavy, authoritative --- */
[data-theme="shogun_castle"] button {
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  border-width: 3px !important;
  border-color: var(--zen-border) !important;
}

/* Primary: dark vermillion gradient with gold top stripe */
[data-theme="shogun_castle"] button.bg-zen-text {
  background: linear-gradient(180deg, #8B0000 0%, #5C0000 100%) !important;
  color: #F5F0E8 !important;
  position: relative !important;
  overflow: hidden !important;
}

[data-theme="shogun_castle"] button.bg-zen-text::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 3px !important;
  background: linear-gradient(90deg, #B8860B 0%, #DAA520 50%, #B8860B 100%) !important;
  z-index: 1 !important;
}

[data-theme="shogun_castle"] .bg-zen-text.text-white { color: #F5F0E8 !important; }

/* --- Active tabs: deep crimson with gold shadow --- */
[data-theme="shogun_castle"] button.bg-black {
  background: linear-gradient(180deg, #8B0000 0%, #5C0000 100%) !important;
  color: #F5F0E8 !important;
  box-shadow: 4px 4px 0 0 #B8860B !important;
  transform: translateY(-2px) !important;
}

[data-theme="shogun_castle"] button.bg-black.text-white {
  color: #F5F0E8 !important;
}

[data-theme="shogun_castle"] button.text-gray-400 {
  color: #8B7355 !important;
}

[data-theme="shogun_castle"] button.text-gray-400:hover {
  color: #8B0000 !important;
  background: rgba(139, 0, 0, 0.05) !important;
}

/* Non-button bg-black: dark lacquer */
[data-theme="shogun_castle"] .bg-black:not(button) {
  background: linear-gradient(180deg, #1A0F0A 0%, #2C1810 100%) !important;
  box-shadow: 2px 2px 0 0 #B8860B !important;
}

/* --- Cards: gold accent bar on top (castle ornament) --- */
[data-theme="shogun_castle"] .shadow-neo {
  border-width: 3px !important;
  border-color: var(--zen-border) !important;
  position: relative !important;
  overflow: hidden !important;
}

[data-theme="shogun_castle"] .shadow-neo::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 3px !important;
  background: linear-gradient(90deg, #B8860B 0%, #DAA520 30%, #FFD700 50%, #DAA520 70%, #B8860B 100%) !important;
  z-index: 1 !important;
}

[data-theme="shogun_castle"] .shadow-neo:hover {
  transform: translate(-2px, -2px) !important;
  box-shadow: var(--shadow-hover) !important;
}

/* --- Nav: thick vermillion left bar --- */
[data-theme="shogun_castle"] nav button.bg-zen-text {
  background: linear-gradient(180deg, #8B0000 0%, #5C0000 100%) !important;
  border-left: 6px solid #B8860B !important;
  border-right: none !important;
  border-top: none !important;
  border-bottom: none !important;
  color: #F5F0E8 !important;
}

[data-theme="shogun_castle"] nav button.bg-white {
  background-color: transparent !important;
}

[data-theme="shogun_castle"] nav button.bg-white:hover {
  background-color: rgba(139, 0, 0, 0.04) !important;
}

/* --- Sidebar: warm parchment --- */
[data-theme="shogun_castle"] aside.border-r-2 {
  border-right-width: 3px !important;
  border-color: rgba(26, 15, 10, 0.15) !important;
}

/* --- Progress bar: dark green with diagonal stripes (samurai armor) --- */
[data-theme="shogun_castle"] .bg-zen-success.h-full {
  background: repeating-linear-gradient(
    -45deg,
    var(--zen-success),
    var(--zen-success) 4px,
    #1F3A0E 4px,
    #1F3A0E 8px
  ) !important;
  border-right: none !important;
}

/* --- Headings: tight, uppercase --- */
[data-theme="shogun_castle"] h2 {
  letter-spacing: -0.02em !important;
  text-transform: uppercase !important;
}

/* --- Scrollbar: dark lacquer + vermillion --- */
[data-theme="shogun_castle"] ::-webkit-scrollbar-track { background: #EDE5D8 !important; }
[data-theme="shogun_castle"] ::-webkit-scrollbar-thumb {
  background: #1A0F0A !important;
}
[data-theme="shogun_castle"] ::-webkit-scrollbar-thumb:hover {
  background: #8B0000 !important;
}

/* --- Softer font weights → heavier for authority --- */
[data-theme="shogun_castle"] .font-bold { font-weight: 800 !important; }


/* ==========================================================================
   12. YOKAI_WORLD (妖怪) OVERRIDES
   Supernatural, eerie — spectral mists, ghostly greens, purple void
   ========================================================================== */

/* --- Variables --- */
[data-theme="yokai_world"] {
  --zen-bg: #0A0D12;
  --zen-surface: #141A24;
  --zen-text: #D4CCE0;
  --zen-accent: #9B59B6;
  --zen-success: #3DED97;
  --zen-warning: #E6A0FF;
  --zen-border: #6B3FA0;

  --border-width: 1px;
  --border-radius: 8px;
  --shadow: 0 0 20px rgba(155, 89, 182, 0.15), 0 4px 16px rgba(0, 0, 0, 0.3);
  --shadow-hover: 0 0 30px rgba(155, 89, 182, 0.25), 0 8px 24px rgba(0, 0, 0, 0.4);
  --shadow-sm: 0 0 10px rgba(155, 89, 182, 0.1);
}

/* --- Body: dark gradient --- */
[data-theme="yokai_world"] body {
  background: linear-gradient(180deg, #0A0D12 0%, #141A24 50%, #0D1018 100%) !important;
  background-attachment: fixed !important;
  color: var(--zen-text) !important;
}

/* --- Spectral fog overlay at bottom --- */
[data-theme="yokai_world"] main {
  position: relative !important;
}

[data-theme="yokai_world"] main::after {
  content: '' !important;
  position: fixed !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 150px !important;
  background: linear-gradient(
    to top,
    rgba(10, 13, 18, 0.95) 0%,
    rgba(155, 89, 182, 0.08) 40%,
    transparent 100%
  ) !important;
  pointer-events: none !important;
  z-index: 20 !important;
}

/* --- 12a. bg-white → dark surface --- */
[data-theme="yokai_world"] .bg-white {
  background-color: var(--zen-surface) !important;
}

/* --- 12b. Text: black/gray → ghostly lavender --- */
[data-theme="yokai_world"] .text-black     { color: var(--zen-text) !important; }
[data-theme="yokai_world"] .text-gray-400  { color: #8B80A8 !important; }
[data-theme="yokai_world"] .text-gray-500  { color: #A8A0C0 !important; }
[data-theme="yokai_world"] .text-gray-600  { color: #ABA0C8 !important; }
[data-theme="yokai_world"] .text-gray-700  { color: #BBB0D0 !important; }
[data-theme="yokai_world"] .text-gray-800  { color: #CBC0D8 !important; }
[data-theme="yokai_world"] .text-white     { color: #FFF !important; }
[data-theme="yokai_world"] .text-green-600 { color: var(--zen-success) !important; }
[data-theme="yokai_world"] .text-green-800 { color: #3DED97 !important; }
[data-theme="yokai_world"] .text-yellow-600 { color: #E6A0FF !important; }
[data-theme="yokai_world"] .text-yellow-800 { color: #E6A0FF !important; }
[data-theme="yokai_world"] .text-red-600   { color: #FF5070 !important; }
[data-theme="yokai_world"] .font-mono      { color: var(--zen-text); }

/* --- 12c. Backgrounds: gray/color → dark --- */
[data-theme="yokai_world"] .bg-gray-50  { background-color: #0D1018 !important; }
[data-theme="yokai_world"] .bg-gray-100 { background-color: #141A24 !important; }
[data-theme="yokai_world"] .bg-gray-200 { background-color: #1E2636 !important; }

[data-theme="yokai_world"] .bg-green-50  { background-color: rgba(61, 237, 151, 0.08) !important; }
[data-theme="yokai_world"] .bg-green-100 { background-color: rgba(61, 237, 151, 0.15) !important; }
[data-theme="yokai_world"] .bg-yellow-50  { background-color: rgba(230, 160, 255, 0.08) !important; }
[data-theme="yokai_world"] .bg-yellow-100 { background-color: rgba(230, 160, 255, 0.15) !important; }
[data-theme="yokai_world"] .bg-yellow-400 { background-color: #E6A0FF !important; }
[data-theme="yokai_world"] .bg-blue-50    { background-color: rgba(155, 89, 182, 0.1) !important; }
[data-theme="yokai_world"] .bg-red-50  { background-color: rgba(255, 80, 112, 0.1) !important; }
[data-theme="yokai_world"] .bg-red-100 { background-color: rgba(255, 80, 112, 0.2) !important; }
[data-theme="yokai_world"] .bg-red-200 { background-color: rgba(255, 80, 112, 0.3) !important; }

[data-theme="yokai_world"] .bg-cyan-100    { background-color: rgba(61, 237, 151, 0.15) !important; }
[data-theme="yokai_world"] .bg-pink-50     { background-color: rgba(230, 160, 255, 0.08) !important; }
[data-theme="yokai_world"] .bg-pink-100    { background-color: rgba(230, 160, 255, 0.15) !important; }
[data-theme="yokai_world"] .bg-purple-50   { background-color: rgba(155, 89, 182, 0.10) !important; }
[data-theme="yokai_world"] .bg-purple-100  { background-color: rgba(155, 89, 182, 0.20) !important; }
[data-theme="yokai_world"] .bg-blue-100    { background-color: rgba(155, 89, 182, 0.15) !important; }
[data-theme="yokai_world"] .bg-orange-50   { background-color: rgba(255, 140, 60, 0.08) !important; }
[data-theme="yokai_world"] .bg-orange-100  { background-color: rgba(255, 140, 60, 0.15) !important; }
[data-theme="yokai_world"] .bg-amber-50    { background-color: rgba(230, 160, 255, 0.08) !important; }
[data-theme="yokai_world"] .bg-amber-100   { background-color: rgba(230, 160, 255, 0.15) !important; }
[data-theme="yokai_world"] .bg-indigo-50   { background-color: rgba(155, 89, 182, 0.08) !important; }
[data-theme="yokai_world"] .bg-indigo-100  { background-color: rgba(155, 89, 182, 0.15) !important; }

/* --- 12b-ext. Missing text color overrides --- */
[data-theme="yokai_world"] .text-green-700  { color: #3DED97 !important; }
[data-theme="yokai_world"] .text-blue-700   { color: #B890E0 !important; }
[data-theme="yokai_world"] .text-blue-800   { color: #B890E0 !important; }
[data-theme="yokai_world"] .text-purple-700 { color: #C8A0E8 !important; }
[data-theme="yokai_world"] .text-purple-800 { color: #C8A0E8 !important; }
[data-theme="yokai_world"] .text-pink-600   { color: #E6A0FF !important; }
[data-theme="yokai_world"] .text-pink-700   { color: #E6A0FF !important; }
[data-theme="yokai_world"] .text-cyan-700   { color: #3DED97 !important; }
[data-theme="yokai_world"] .text-orange-600 { color: #FF9F60 !important; }
[data-theme="yokai_world"] .text-orange-700 { color: #FF9F60 !important; }
[data-theme="yokai_world"] .text-indigo-700 { color: #B890E0 !important; }
[data-theme="yokai_world"] .text-amber-700  { color: #E6A0FF !important; }
[data-theme="yokai_world"] .text-amber-900  { color: #E6A0FF !important; }

/* --- 12c-ext. Border overrides for badges --- */
[data-theme="yokai_world"] .border-purple-200,
[data-theme="yokai_world"] .border-purple-500 { border-color: rgba(155, 89, 182, 0.4) !important; }
[data-theme="yokai_world"] .border-pink-200   { border-color: rgba(230, 160, 255, 0.4) !important; }
[data-theme="yokai_world"] .border-cyan-200   { border-color: rgba(61, 237, 151, 0.4) !important; }
[data-theme="yokai_world"] .border-orange-200,
[data-theme="yokai_world"] .border-orange-300 { border-color: rgba(255, 140, 60, 0.4) !important; }
[data-theme="yokai_world"] .border-amber-300,
[data-theme="yokai_world"] .border-amber-400,
[data-theme="yokai_world"] .border-amber-600 { border-color: rgba(230, 160, 255, 0.4) !important; }
[data-theme="yokai_world"] .border-indigo-200 { border-color: rgba(155, 89, 182, 0.4) !important; }
[data-theme="yokai_world"] .border-blue-400   { border-color: rgba(155, 89, 182, 0.4) !important; }

/* --- 12c-ext. Gradient overrides for RoleBadge --- */
[data-theme="yokai_world"] .from-yellow-100 { --tw-gradient-from: rgba(230, 160, 255, 0.15) !important; }
[data-theme="yokai_world"] .to-orange-100   { --tw-gradient-to: rgba(255, 140, 60, 0.15) !important; }
[data-theme="yokai_world"] .from-blue-100   { --tw-gradient-from: rgba(155, 89, 182, 0.15) !important; }
[data-theme="yokai_world"] .to-cyan-100     { --tw-gradient-to: rgba(61, 237, 151, 0.15) !important; }
[data-theme="yokai_world"] .from-purple-100 { --tw-gradient-from: rgba(155, 89, 182, 0.15) !important; }
[data-theme="yokai_world"] .to-pink-100     { --tw-gradient-to: rgba(230, 160, 255, 0.15) !important; }
[data-theme="yokai_world"] .from-amber-200  { --tw-gradient-from: rgba(230, 160, 255, 0.20) !important; }
[data-theme="yokai_world"] .to-yellow-300   { --tw-gradient-to: rgba(230, 160, 255, 0.25) !important; }

/* --- 12d. Primary buttons: purple gradient --- */
[data-theme="yokai_world"] .bg-zen-text {
  background: linear-gradient(135deg, #9B59B6 0%, #6B3FA0 100%) !important;
  color: #F0E8FF !important;
  box-shadow: 0 0 15px rgba(155, 89, 182, 0.5), inset 0 0 8px rgba(61, 237, 151, 0.1) !important;
}

[data-theme="yokai_world"] .bg-zen-text:hover {
  box-shadow: 0 0 25px rgba(61, 237, 151, 0.4), 0 0 40px rgba(155, 89, 182, 0.3) !important;
}

[data-theme="yokai_world"] .bg-zen-text.text-white,
[data-theme="yokai_world"] .bg-zen-text.text-black {
  color: #F0E8FF !important;
}

[data-theme="yokai_world"] .bg-zen-text .text-white {
  color: #F0E8FF !important;
}

/* --- 12e. Active tabs: spectral green --- */
[data-theme="yokai_world"] button.bg-black {
  background-color: var(--zen-success) !important;
  color: #0A0D12 !important;
  box-shadow: 0 0 20px rgba(61, 237, 151, 0.4) !important;
}

[data-theme="yokai_world"] button.bg-black.text-white {
  color: #0A0D12 !important;
}

/* Non-button bg-black → purple */
[data-theme="yokai_world"] .bg-black:not(button) {
  background: linear-gradient(135deg, #6B3FA0 0%, #9B59B6 100%) !important;
}

[data-theme="yokai_world"] button.text-gray-400 {
  color: #8B80A8 !important;
}

[data-theme="yokai_world"] button.text-gray-400:hover {
  color: #3DED97 !important;
  background: rgba(155, 89, 182, 0.08) !important;
}

/* --- 12f. Borders --- */
[data-theme="yokai_world"] .border-gray-200,
[data-theme="yokai_world"] .border-gray-300 { border-color: #1E2636 !important; }
[data-theme="yokai_world"] .border-dashed   { border-color: #2A3348 !important; }
[data-theme="yokai_world"] .border-green-300 { border-color: rgba(61, 237, 151, 0.4) !important; }
[data-theme="yokai_world"] .border-green-500 { border-color: var(--zen-success) !important; }
[data-theme="yokai_world"] .border-red-500   { border-color: #FF5070 !important; }
[data-theme="yokai_world"] .border-blue-300  { border-color: rgba(155, 89, 182, 0.5) !important; }
[data-theme="yokai_world"] .border-yellow-400 { border-color: #E6A0FF !important; }

[data-theme="yokai_world"] .border-zen-success {
  border-color: var(--zen-success) !important;
  box-shadow: 0 0 8px rgba(61, 237, 151, 0.3), inset 0 0 6px rgba(61, 237, 151, 0.1) !important;
}

/* --- 12g. Cards: ethereal purple glow --- */
[data-theme="yokai_world"] .shadow-neo {
  box-shadow: 0 0 20px rgba(155, 89, 182, 0.12), 0 0 40px rgba(155, 89, 182, 0.04) !important;
  border-radius: 8px !important;
  position: relative !important;
}

[data-theme="yokai_world"] .shadow-neo:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 0 30px rgba(155, 89, 182, 0.2), 0 0 50px rgba(61, 237, 151, 0.05) !important;
}

/* --- 12h. Hover states --- */
[data-theme="yokai_world"] .hover\:text-black:hover    { color: var(--zen-text) !important; }
[data-theme="yokai_world"] .hover\:bg-gray-50:hover    { background-color: #141A24 !important; }
[data-theme="yokai_world"] .hover\:bg-gray-100:hover   { background-color: #1E2636 !important; }
[data-theme="yokai_world"] .hover\:bg-red-200:hover    { background-color: rgba(255, 80, 112, 0.3) !important; }
[data-theme="yokai_world"] .hover\:bg-zinc-800:hover   { background-color: rgba(61, 237, 151, 0.8) !important; }

[data-theme="yokai_world"] button:hover:not(.bg-zen-text):not(.bg-zen-accent):not(.bg-zen-success) {
  text-shadow: 0 0 6px rgba(155, 89, 182, 0.5);
}

/* --- 12i. Headings: spectral glow --- */
[data-theme="yokai_world"] h1,
[data-theme="yokai_world"] h2,
[data-theme="yokai_world"] h3 {
  text-shadow: 0 0 12px rgba(155, 89, 182, 0.5) !important;
}

/* --- 12j. Nav: purple active with spectral green bar --- */
[data-theme="yokai_world"] nav button.bg-zen-text {
  background: linear-gradient(90deg, #6B3FA0 0%, #9B59B6 100%) !important;
  border-left: 4px solid #3DED97 !important;
  border-right: none !important;
  border-top: none !important;
  border-bottom: none !important;
}

[data-theme="yokai_world"] nav button.bg-white {
  background-color: transparent !important;
}

[data-theme="yokai_world"] nav button.bg-white:hover {
  background-color: rgba(155, 89, 182, 0.06) !important;
}

/* --- 12k. Sidebar --- */
[data-theme="yokai_world"] aside.border-r-2 {
  background-color: rgba(20, 26, 36, 0.9) !important;
  border-right-width: 1px !important;
  border-color: rgba(107, 63, 160, 0.2) !important;
}

/* --- 12l. Progress bar: spectral green gradient --- */
[data-theme="yokai_world"] .bg-zen-success.h-full {
  background: linear-gradient(90deg, #2BC07A 0%, #3DED97 50%, #2BC07A 100%) !important;
  border-right: none !important;
  box-shadow: 0 0 8px rgba(61, 237, 151, 0.3) !important;
}

/* --- 12m. Neon glow on success elements --- */
[data-theme="yokai_world"] .bg-zen-success {
  background-color: var(--zen-success) !important;
  box-shadow: 0 0 10px rgba(61, 237, 151, 0.4);
}

/* --- 12n. Links --- */
[data-theme="yokai_world"] a       { color: var(--zen-success); }
[data-theme="yokai_world"] a:hover { color: var(--zen-accent); }

/* --- 12o. Scrollbar --- */
[data-theme="yokai_world"] ::-webkit-scrollbar-track {
  background: #0A0D12 !important;
}
[data-theme="yokai_world"] ::-webkit-scrollbar-thumb {
  background: #6B3FA0 !important;
  border-radius: 4px !important;
}
[data-theme="yokai_world"] ::-webkit-scrollbar-thumb:hover {
  background: #3DED97 !important;
}


/* ==========================================================================
   13. SAKURA (桜) OVERRIDES
   Cherry blossom — soft pinks, petal gradients, elegant femininity
   ========================================================================== */

/* --- Body: soft pink gradient --- */
[data-theme="sakura"] body {
  background: linear-gradient(
    135deg, #FFF5F8 0%, #FFE8EF 40%, #FFF0F5 100%
  ) !important;
  background-attachment: fixed !important;
  color: var(--zen-text) !important;
}

/* --- bg-white → soft pink surface --- */
[data-theme="sakura"] .bg-white {
  background-color: #FFFFFF !important;
}

/* --- Buttons: rounded, soft --- */
[data-theme="sakura"] button {
  border-radius: 12px !important;
  border-width: 1px !important;
  border-color: var(--zen-border) !important;
}

/* Primary: pink → coral gradient */
[data-theme="sakura"] .bg-zen-text {
  background: linear-gradient(135deg, #D4507A 0%, #E8758A 50%, #D4507A 100%) !important;
  color: #FFFFFF !important;
  border-color: #C4637A !important;
  box-shadow: 0 3px 12px rgba(212, 80, 122, 0.25) !important;
  border-radius: 12px !important;
}

[data-theme="sakura"] .bg-zen-text:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(212, 80, 122, 0.35) !important;
}

[data-theme="sakura"] .bg-zen-text.text-white { color: #FFFFFF !important; }

/* Secondary: soft pink */
[data-theme="sakura"] button.bg-white {
  background: linear-gradient(135deg, #FFFFFF 0%, #FFF5F8 100%) !important;
  border-color: #E8A0B4 !important;
  border-radius: 12px !important;
}

[data-theme="sakura"] button.bg-white:hover {
  background: linear-gradient(135deg, #FFF0F5 0%, #FFE8EF 100%) !important;
  transform: translateY(-2px) !important;
}

/* --- Cards: pink top bar + soft shadow --- */
[data-theme="sakura"] .shadow-neo {
  border-color: #E8B4C4 !important;
  border-radius: 12px !important;
  position: relative !important;
  overflow: hidden !important;
}

[data-theme="sakura"] .shadow-neo::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 3px !important;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(212, 80, 122, 0.4) 20%,
    rgba(212, 80, 122, 0.7) 50%,
    rgba(212, 80, 122, 0.4) 80%,
    transparent 100%
  ) !important;
  z-index: 1 !important;
}

[data-theme="sakura"] .shadow-neo:hover {
  transform: translateY(-3px) !important;
  box-shadow: var(--shadow-hover) !important;
}

/* --- Active tabs: deep pink --- */
[data-theme="sakura"] button.bg-black {
  background: linear-gradient(135deg, #D4507A 0%, #B83D64 100%) !important;
  color: #FFFFFF !important;
  border-color: #C4637A !important;
  border-radius: 12px !important;
  box-shadow: 0 3px 12px rgba(212, 80, 122, 0.3) !important;
  transform: translateY(-2px) !important;
}

[data-theme="sakura"] button.bg-black.text-white {
  color: #FFFFFF !important;
}

[data-theme="sakura"] button.text-gray-400 {
  color: #C09AAA !important;
  border-radius: 12px !important;
}

[data-theme="sakura"] button.text-gray-400:hover {
  color: #D4507A !important;
  background: rgba(212, 80, 122, 0.06) !important;
}

/* Non-button bg-black: deep pink */
[data-theme="sakura"] .bg-black:not(button) {
  background: linear-gradient(135deg, #D4507A 0%, #B83D64 100%) !important;
}

/* --- Nav --- */
[data-theme="sakura"] nav button.bg-zen-text {
  background: linear-gradient(90deg, #D4507A 0%, #E8758A 100%) !important;
  color: #FFFFFF !important;
  border-radius: 12px !important;
  border-left: 4px solid #FFB6C8 !important;
  border-right: none !important;
  border-top: none !important;
  border-bottom: none !important;
}

[data-theme="sakura"] nav button.bg-white {
  background-color: transparent !important;
  border-radius: 12px !important;
}

[data-theme="sakura"] nav button.bg-white:hover {
  background-color: rgba(212, 80, 122, 0.06) !important;
}

/* --- Sidebar --- */
[data-theme="sakura"] aside.border-r-2 {
  background: linear-gradient(180deg, #FFFFFF 0%, #FFF5F8 100%) !important;
  border-right-color: #E8B4C4 !important;
  border-right-width: 1px !important;
}

/* --- Progress bar: pink gradient + shimmer --- */
[data-theme="sakura"] .bg-zen-success.h-full {
  background: linear-gradient(90deg, #6BAF7B 0%, #7DBF8B 50%, #6BAF7B 100%) !important;
  border-right: none !important;
  border-radius: 9999px !important;
  position: relative !important;
  overflow: hidden !important;
}

[data-theme="sakura"] .bg-zen-success.h-full::after {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: -100% !important;
  width: 100% !important;
  height: 100% !important;
  background: linear-gradient(
    90deg, transparent 0%, rgba(255, 255, 255, 0.35) 50%, transparent 100%
  ) !important;
  animation: anime-shimmer 2.5s ease-in-out infinite !important;
}

/* --- Headings: pink gradient text --- */
[data-theme="sakura"] h2 {
  background: linear-gradient(135deg, #4A2035 0%, #D4507A 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

/* --- Rounded containers --- */
[data-theme="sakura"] .rounded    { border-radius: 12px !important; }
[data-theme="sakura"] .rounded-lg { border-radius: 14px !important; }

/* --- Scrollbar: pink --- */
[data-theme="sakura"] ::-webkit-scrollbar-track { background: #FFF5F8 !important; }
[data-theme="sakura"] ::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #D4507A 0%, #E8758A 100%) !important;
  border-radius: 4px !important;
}
[data-theme="sakura"] ::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #B83D64 0%, #D4507A 100%) !important;
}


/* ==========================================================================
   14. MAIKO (舞妓) OVERRIDES
   Geisha apprentice — white face, vermillion lips, gold ornaments, refined
   ========================================================================== */

/* --- Body: warm white --- */
[data-theme="maiko"] body {
  background-color: var(--zen-bg) !important;
  color: var(--zen-text) !important;
}

/* --- bg-white → soft lavender-cream --- */
[data-theme="maiko"] .bg-white {
  background-color: var(--zen-surface) !important;
}

/* --- Buttons: delicate, softly rounded --- */
[data-theme="maiko"] button {
  border-width: 1px !important;
  border-color: #D4B8C8 !important;
  border-radius: 6px !important;
  letter-spacing: 0.02em !important;
}

/* Primary: plum gradient + silver accent at bottom */
[data-theme="maiko"] button.bg-zen-text {
  background: linear-gradient(180deg, #B8336A 0%, #8E2555 100%) !important;
  color: #FFF9FB !important;
  border-radius: 6px !important;
  border-color: #8B6B7D !important;
  position: relative !important;
  overflow: hidden !important;
}

[data-theme="maiko"] button.bg-zen-text::before {
  content: '' !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 2px !important;
  background: linear-gradient(90deg, #C0A0B0 0%, #E8D0DC 50%, #C0A0B0 100%) !important;
  z-index: 1 !important;
}

[data-theme="maiko"] .bg-zen-text.text-white { color: #FFF9FB !important; }

/* Secondary: soft surface */
[data-theme="maiko"] button.bg-white {
  background-color: var(--zen-surface) !important;
  border-color: #D4B8C8 !important;
}

[data-theme="maiko"] button.bg-white:hover {
  background-color: #EDE0E8 !important;
  transform: translateY(-1px) !important;
  box-shadow: var(--shadow-hover) !important;
}

/* --- Cards: plum left accent border --- */
[data-theme="maiko"] .shadow-neo {
  border-width: 1px !important;
  border-color: #D4B8C8 !important;
  border-left: 3px solid #B8336A !important;
  border-radius: 6px !important;
}

[data-theme="maiko"] .shadow-neo:hover {
  transform: translateY(-2px) !important;
  box-shadow: var(--shadow-hover) !important;
}

/* --- Active tabs: plum gradient with soft shadow --- */
[data-theme="maiko"] button.bg-black {
  background: linear-gradient(180deg, #B8336A 0%, #8E2555 100%) !important;
  color: #FFF9FB !important;
  box-shadow: 0 3px 12px rgba(184, 51, 106, 0.25) !important;
  transform: translateY(-1px) !important;
  border-radius: 6px !important;
}

[data-theme="maiko"] button.bg-black.text-white {
  color: #FFF9FB !important;
}

[data-theme="maiko"] button.text-gray-400 {
  color: #9B7B8E !important;
}

[data-theme="maiko"] button.text-gray-400:hover {
  color: #B8336A !important;
  background: rgba(184, 51, 106, 0.05) !important;
}

/* Non-button bg-black: deep plum */
[data-theme="maiko"] .bg-black:not(button) {
  background: linear-gradient(180deg, #2D1B2E 0%, #4A2B4A 100%) !important;
  box-shadow: 0 2px 8px rgba(184, 51, 106, 0.15) !important;
}

/* --- Nav --- */
[data-theme="maiko"] nav button.bg-zen-text {
  background: linear-gradient(180deg, #B8336A 0%, #8E2555 100%) !important;
  border-left: 4px solid #D4B8C8 !important;
  border-right: none !important;
  border-top: none !important;
  border-bottom: none !important;
  color: #FFF9FB !important;
  border-radius: 6px !important;
}

[data-theme="maiko"] nav button.bg-white {
  background-color: transparent !important;
}

[data-theme="maiko"] nav button.bg-white:hover {
  background-color: rgba(184, 51, 106, 0.05) !important;
}

/* --- Sidebar --- */
[data-theme="maiko"] aside.border-r-2 {
  border-right-width: 1px !important;
  border-color: rgba(139, 107, 125, 0.15) !important;
}

/* --- Progress bar: sage gradient --- */
[data-theme="maiko"] .bg-zen-success.h-full {
  background: linear-gradient(90deg, #5B8A72 0%, #6D9E84 50%, #5B8A72 100%) !important;
  border-right: none !important;
}

/* --- Headings: gentle tracking --- */
[data-theme="maiko"] h2 {
  letter-spacing: 0.03em !important;
}

/* --- Scrollbar: plum & pearl --- */
[data-theme="maiko"] ::-webkit-scrollbar-track { background: #FFF9FB !important; }
[data-theme="maiko"] ::-webkit-scrollbar-thumb {
  background: #B8336A !important;
}
[data-theme="maiko"] ::-webkit-scrollbar-thumb:hover {
  background: #D4B8C8 !important;
}


/* ==========================================================================
   15. YUME (夢) OVERRIDES
   Dream world — lavender clouds, glass effects, twinkling stars, ethereal
   ========================================================================== */

/* --- Body: dreamy gradient --- */
[data-theme="yume"] body {
  background: linear-gradient(
    135deg, #F8F5FF 0%, #F0E8FF 30%, #FCF0F8 60%, #EEF0FF 100%
  ) !important;
  min-height: 100vh;
  color: var(--zen-text) !important;
}

/* --- bg-white → pale lavender --- */
[data-theme="yume"] .bg-white {
  background-color: #FFFFFF !important;
}

/* --- Everything super-rounded + soft transitions --- */
[data-theme="yume"] button {
  border-radius: 18px !important;
  border-width: 2px !important;
  border-color: var(--zen-border) !important;
  transition: all 0.3s ease !important;
}

[data-theme="yume"] .rounded    { border-radius: 18px !important; }
[data-theme="yume"] .rounded-lg { border-radius: 22px !important; }

/* Primary: glass purple gradient */
[data-theme="yume"] .bg-zen-text {
  background: linear-gradient(135deg, #8B5CF6 0%, #A78BFA 50%, #7C3AED 100%) !important;
  color: #FFFFFF !important;
  border-color: #7C5CBF !important;
  box-shadow: 0 4px 20px rgba(139, 92, 246, 0.3) !important;
  border-radius: 18px !important;
}

[data-theme="yume"] .bg-zen-text:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 8px 30px rgba(139, 92, 246, 0.4) !important;
}

[data-theme="yume"] .bg-zen-text.text-white { color: #FFFFFF !important; }

/* Secondary: frosted glass */
[data-theme="yume"] button.bg-white {
  background: rgba(255, 255, 255, 0.88) !important;
  border-color: rgba(139, 92, 246, 0.25) !important;
  border-radius: 18px !important;
}

[data-theme="yume"] button.bg-white:hover {
  background: rgba(255, 255, 255, 0.9) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 16px rgba(139, 92, 246, 0.15) !important;
}

/* --- Cards: glass + twinkle star --- */
[data-theme="yume"] .shadow-neo {
  border-color: rgba(139, 92, 246, 0.2) !important;
  border-radius: 20px !important;
  position: relative !important;
  overflow: visible !important;
  background: rgba(255, 255, 255, 0.92) !important;
}

[data-theme="yume"] .shadow-neo:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 8px 30px rgba(139, 92, 246, 0.2) !important;
  border-color: rgba(139, 92, 246, 0.35) !important;
}

/* Twinkle star on card */
[data-theme="yume"] .shadow-neo::after {
  content: '\2727' !important;
  position: absolute !important;
  top: -6px !important;
  right: -6px !important;
  font-size: 14px !important;
  color: #C9B8FF !important;
  animation: yume-twinkle 4s ease-in-out infinite !important;
  will-change: opacity !important;
  pointer-events: none !important;
  z-index: 10 !important;
}

/* --- Active tabs: purple gradient --- */
[data-theme="yume"] button.bg-black {
  background: linear-gradient(135deg, #8B5CF6 0%, #A78BFA 100%) !important;
  color: #FFFFFF !important;
  border-color: #7C5CBF !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 16px rgba(139, 92, 246, 0.3) !important;
  transform: translateY(-2px) !important;
}

[data-theme="yume"] button.bg-black.text-white {
  color: #FFFFFF !important;
}

[data-theme="yume"] button.text-gray-400 {
  color: #A090C0 !important;
  border-radius: 16px !important;
}

[data-theme="yume"] button.text-gray-400:hover {
  color: #8B5CF6 !important;
  background: rgba(139, 92, 246, 0.06) !important;
}

/* Non-button bg-black: purple gradient */
[data-theme="yume"] .bg-black:not(button) {
  background: linear-gradient(135deg, #2A1B3D 0%, #5B3D8A 100%) !important;
}

/* --- Nav --- */
[data-theme="yume"] nav button.bg-zen-text {
  background: linear-gradient(135deg, #8B5CF6 0%, #A78BFA 100%) !important;
  color: #FFFFFF !important;
  border-radius: 18px !important;
  box-shadow: 0 3px 12px rgba(139, 92, 246, 0.2) !important;
}

[data-theme="yume"] nav button.bg-white {
  background-color: transparent !important;
  border-radius: 18px !important;
}

[data-theme="yume"] nav button.bg-white:hover {
  background: rgba(139, 92, 246, 0.05) !important;
}

/* --- Sidebar: frosted lavender glass --- */
[data-theme="yume"] aside.border-r-2 {
  background: rgba(255, 255, 255, 0.9) !important;
  border-right-color: rgba(139, 92, 246, 0.15) !important;
  border-right-width: 1px !important;
}

/* --- Progress bar: mint gradient rounded --- */
[data-theme="yume"] .h-4.border-2.border-black.bg-white {
  border-color: #7C5CBF !important;
  border-radius: 9999px !important;
  background-color: #F0E8FF !important;
  overflow: hidden !important;
}

[data-theme="yume"] .bg-zen-success.h-full {
  background: linear-gradient(90deg, #6DD3CE 0%, #5DC0BA 50%, #7DE3DE 100%) !important;
  border-right: none !important;
  border-radius: 9999px !important;
}

/* --- Headings: purple → pink gradient text --- */
[data-theme="yume"] h2 {
  background: linear-gradient(135deg, #2A1B3D 0%, #8B5CF6 50%, #F0B6D8 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

/* --- Scrollbar: lavender --- */
[data-theme="yume"] ::-webkit-scrollbar-track { background: #F8F5FF !important; border-radius: 4px !important; }
[data-theme="yume"] ::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #8B5CF6 0%, #A78BFA 100%) !important;
  border-radius: 4px !important;
}
[data-theme="yume"] ::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #7C3AED 0%, #8B5CF6 100%) !important;
}


/* ==========================================================================
   16. TSUKIMI (月見) DARK MODE OVERRIDES
   Moonlit night — deep indigo, silver moonlight, romantic lavender glow
   ========================================================================== */

/* --- Body: deep indigo with radial moon glow --- */
[data-theme="tsukimi"] body {
  background: radial-gradient(
    ellipse 60% 50% at 80% 15%,
    rgba(201, 184, 255, 0.08) 0%,
    transparent 50%
  ),
  linear-gradient(180deg, #0D0B1A 0%, #1A1530 50%, #0D0B1A 100%) !important;
  background-attachment: fixed !important;
  color: var(--zen-text) !important;
}

/* --- 16a. bg-white → dark surface --- */
[data-theme="tsukimi"] .bg-white {
  background-color: var(--zen-surface) !important;
}

/* --- 16b. Text: black/gray → moonlit tones --- */
[data-theme="tsukimi"] .text-black     { color: var(--zen-text) !important; }
[data-theme="tsukimi"] .text-gray-400  { color: #9B90B8 !important; }
[data-theme="tsukimi"] .text-gray-500  { color: #ADA0C8 !important; }
[data-theme="tsukimi"] .text-gray-600  { color: #B8A8D0 !important; }
[data-theme="tsukimi"] .text-gray-700  { color: #C8B8D8 !important; }
[data-theme="tsukimi"] .text-gray-800  { color: #D8C8E0 !important; }
[data-theme="tsukimi"] .text-white     { color: #FFF !important; }
[data-theme="tsukimi"] .text-green-600 { color: var(--zen-success) !important; }
[data-theme="tsukimi"] .text-green-800 { color: #7DCEA0 !important; }
[data-theme="tsukimi"] .text-yellow-600 { color: #F5D090 !important; }
[data-theme="tsukimi"] .text-yellow-800 { color: #F5D090 !important; }
[data-theme="tsukimi"] .text-red-600   { color: #FF8090 !important; }
[data-theme="tsukimi"] .font-mono      { color: var(--zen-text); }

/* --- 16c. Backgrounds: gray/color → dark --- */
[data-theme="tsukimi"] .bg-gray-50  { background-color: #100D20 !important; }
[data-theme="tsukimi"] .bg-gray-100 { background-color: #1A1530 !important; }
[data-theme="tsukimi"] .bg-gray-200 { background-color: #241E3C !important; }

[data-theme="tsukimi"] .bg-green-50  { background-color: rgba(125, 206, 160, 0.08) !important; }
[data-theme="tsukimi"] .bg-green-100 { background-color: rgba(125, 206, 160, 0.15) !important; }
[data-theme="tsukimi"] .bg-yellow-50  { background-color: rgba(245, 208, 144, 0.08) !important; }
[data-theme="tsukimi"] .bg-yellow-100 { background-color: rgba(245, 208, 144, 0.15) !important; }
[data-theme="tsukimi"] .bg-yellow-400 { background-color: #F5D090 !important; }
[data-theme="tsukimi"] .bg-blue-50    { background-color: rgba(201, 184, 255, 0.08) !important; }
[data-theme="tsukimi"] .bg-red-50  { background-color: rgba(255, 128, 144, 0.08) !important; }
[data-theme="tsukimi"] .bg-red-100 { background-color: rgba(255, 128, 144, 0.15) !important; }
[data-theme="tsukimi"] .bg-red-200 { background-color: rgba(255, 128, 144, 0.25) !important; }

[data-theme="tsukimi"] .bg-cyan-100    { background-color: rgba(125, 206, 160, 0.15) !important; }
[data-theme="tsukimi"] .bg-pink-50     { background-color: rgba(240, 182, 216, 0.08) !important; }
[data-theme="tsukimi"] .bg-pink-100    { background-color: rgba(240, 182, 216, 0.15) !important; }
[data-theme="tsukimi"] .bg-purple-50   { background-color: rgba(201, 184, 255, 0.08) !important; }
[data-theme="tsukimi"] .bg-purple-100  { background-color: rgba(201, 184, 255, 0.15) !important; }
[data-theme="tsukimi"] .bg-blue-100    { background-color: rgba(201, 184, 255, 0.12) !important; }
[data-theme="tsukimi"] .bg-orange-50   { background-color: rgba(245, 208, 144, 0.08) !important; }
[data-theme="tsukimi"] .bg-orange-100  { background-color: rgba(245, 208, 144, 0.15) !important; }
[data-theme="tsukimi"] .bg-amber-50    { background-color: rgba(245, 208, 144, 0.08) !important; }
[data-theme="tsukimi"] .bg-amber-100   { background-color: rgba(245, 208, 144, 0.15) !important; }
[data-theme="tsukimi"] .bg-indigo-50   { background-color: rgba(201, 184, 255, 0.08) !important; }
[data-theme="tsukimi"] .bg-indigo-100  { background-color: rgba(201, 184, 255, 0.15) !important; }

/* --- 16b-ext. Missing text color overrides --- */
[data-theme="tsukimi"] .text-green-700  { color: #7DCEA0 !important; }
[data-theme="tsukimi"] .text-blue-700   { color: #C9B8FF !important; }
[data-theme="tsukimi"] .text-blue-800   { color: #C9B8FF !important; }
[data-theme="tsukimi"] .text-purple-700 { color: #D0C0FF !important; }
[data-theme="tsukimi"] .text-purple-800 { color: #D0C0FF !important; }
[data-theme="tsukimi"] .text-pink-600   { color: #F0B6D8 !important; }
[data-theme="tsukimi"] .text-pink-700   { color: #F0B6D8 !important; }
[data-theme="tsukimi"] .text-cyan-700   { color: #7DCEA0 !important; }
[data-theme="tsukimi"] .text-orange-600 { color: #F5D090 !important; }
[data-theme="tsukimi"] .text-orange-700 { color: #F5D090 !important; }
[data-theme="tsukimi"] .text-indigo-700 { color: #C9B8FF !important; }
[data-theme="tsukimi"] .text-amber-700  { color: #F5D090 !important; }
[data-theme="tsukimi"] .text-amber-900  { color: #F5D090 !important; }

/* --- 16c-ext. Border overrides for badges --- */
[data-theme="tsukimi"] .border-purple-200,
[data-theme="tsukimi"] .border-purple-500 { border-color: rgba(201, 184, 255, 0.35) !important; }
[data-theme="tsukimi"] .border-pink-200   { border-color: rgba(240, 182, 216, 0.35) !important; }
[data-theme="tsukimi"] .border-cyan-200   { border-color: rgba(125, 206, 160, 0.35) !important; }
[data-theme="tsukimi"] .border-orange-200,
[data-theme="tsukimi"] .border-orange-300 { border-color: rgba(245, 208, 144, 0.35) !important; }
[data-theme="tsukimi"] .border-amber-300,
[data-theme="tsukimi"] .border-amber-400,
[data-theme="tsukimi"] .border-amber-600 { border-color: rgba(245, 208, 144, 0.35) !important; }
[data-theme="tsukimi"] .border-indigo-200 { border-color: rgba(201, 184, 255, 0.35) !important; }
[data-theme="tsukimi"] .border-blue-400   { border-color: rgba(201, 184, 255, 0.35) !important; }

/* --- 16c-ext. Gradient overrides for RoleBadge --- */
[data-theme="tsukimi"] .from-yellow-100 { --tw-gradient-from: rgba(245, 208, 144, 0.15) !important; }
[data-theme="tsukimi"] .to-orange-100   { --tw-gradient-to: rgba(245, 208, 144, 0.12) !important; }
[data-theme="tsukimi"] .from-blue-100   { --tw-gradient-from: rgba(201, 184, 255, 0.15) !important; }
[data-theme="tsukimi"] .to-cyan-100     { --tw-gradient-to: rgba(125, 206, 160, 0.12) !important; }
[data-theme="tsukimi"] .from-purple-100 { --tw-gradient-from: rgba(201, 184, 255, 0.15) !important; }
[data-theme="tsukimi"] .to-pink-100     { --tw-gradient-to: rgba(240, 182, 216, 0.12) !important; }
[data-theme="tsukimi"] .from-amber-200  { --tw-gradient-from: rgba(245, 208, 144, 0.20) !important; }
[data-theme="tsukimi"] .to-yellow-300   { --tw-gradient-to: rgba(245, 208, 144, 0.25) !important; }

/* --- 16d. Buttons & primary elements --- */
[data-theme="tsukimi"] button {
  border-radius: 14px !important;
}

[data-theme="tsukimi"] .bg-zen-text {
  background: linear-gradient(135deg, #C9B8FF 0%, #A898E0 100%) !important;
  color: #0D0B1A !important;
  box-shadow: 0 0 18px rgba(201, 184, 255, 0.35), inset 0 0 6px rgba(201, 184, 255, 0.15) !important;
  border-radius: 14px !important;
}

[data-theme="tsukimi"] .bg-zen-text:hover {
  box-shadow: 0 0 28px rgba(201, 184, 255, 0.5), 0 0 40px rgba(125, 206, 160, 0.1) !important;
  transform: translateY(-2px) !important;
}

[data-theme="tsukimi"] .bg-zen-text.text-white,
[data-theme="tsukimi"] .bg-zen-text.text-black {
  color: #0D0B1A !important;
}

[data-theme="tsukimi"] .bg-zen-text .text-white {
  color: #0D0B1A !important;
}

/* Secondary: frosted glass */
[data-theme="tsukimi"] button.bg-white {
  background: rgba(26, 21, 48, 0.6) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border-color: rgba(201, 184, 255, 0.2) !important;
  border-radius: 14px !important;
  color: var(--zen-text) !important;
}

[data-theme="tsukimi"] button.bg-white:hover {
  background: rgba(26, 21, 48, 0.8) !important;
  border-color: rgba(201, 184, 255, 0.35) !important;
}

/* --- 16e. Active tabs: lavender gradient with moon glow --- */
[data-theme="tsukimi"] button.bg-black {
  background: linear-gradient(135deg, #C9B8FF 0%, #A898E0 100%) !important;
  color: #0D0B1A !important;
  box-shadow: 0 0 20px rgba(201, 184, 255, 0.35) !important;
  border-radius: 14px !important;
}

[data-theme="tsukimi"] button.bg-black.text-white {
  color: #0D0B1A !important;
}

/* Non-button bg-black: lavender gradient */
[data-theme="tsukimi"] .bg-black:not(button) {
  background: linear-gradient(135deg, #4A3D6B 0%, #6B5A9E 100%) !important;
}

[data-theme="tsukimi"] button.text-gray-400 {
  color: #9B90B8 !important;
  border-radius: 14px !important;
}

[data-theme="tsukimi"] button.text-gray-400:hover {
  color: #C9B8FF !important;
  background: rgba(201, 184, 255, 0.06) !important;
}

/* --- 16f. Borders --- */
[data-theme="tsukimi"] .border-gray-200,
[data-theme="tsukimi"] .border-gray-300 { border-color: #241E3C !important; }
[data-theme="tsukimi"] .border-dashed   { border-color: #302850 !important; }
[data-theme="tsukimi"] .border-green-300 { border-color: rgba(125, 206, 160, 0.35) !important; }
[data-theme="tsukimi"] .border-green-500 { border-color: var(--zen-success) !important; }
[data-theme="tsukimi"] .border-red-500   { border-color: #FF8090 !important; }
[data-theme="tsukimi"] .border-blue-300  { border-color: rgba(201, 184, 255, 0.4) !important; }
[data-theme="tsukimi"] .border-yellow-400 { border-color: #F5D090 !important; }

[data-theme="tsukimi"] .border-zen-success {
  border-color: var(--zen-success) !important;
  box-shadow: 0 0 8px rgba(125, 206, 160, 0.25) !important;
}

/* --- 16g. Cards: soft moonlit glow --- */
[data-theme="tsukimi"] .shadow-neo {
  box-shadow: 0 0 20px rgba(201, 184, 255, 0.08), 0 0 40px rgba(201, 184, 255, 0.03) !important;
  border-radius: 14px !important;
  position: relative !important;
}

[data-theme="tsukimi"] .shadow-neo:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 0 30px rgba(201, 184, 255, 0.15), 0 0 50px rgba(125, 206, 160, 0.05) !important;
}

/* --- 16h. Hover states --- */
[data-theme="tsukimi"] .hover\:text-black:hover    { color: var(--zen-text) !important; }
[data-theme="tsukimi"] .hover\:bg-gray-50:hover    { background-color: #1A1530 !important; }
[data-theme="tsukimi"] .hover\:bg-gray-100:hover   { background-color: #241E3C !important; }
[data-theme="tsukimi"] .hover\:bg-red-200:hover    { background-color: rgba(255, 128, 144, 0.25) !important; }
[data-theme="tsukimi"] .hover\:bg-zinc-800:hover   { background-color: rgba(201, 184, 255, 0.7) !important; }

[data-theme="tsukimi"] button:hover:not(.bg-zen-text):not(.bg-zen-accent):not(.bg-zen-success) {
  text-shadow: 0 0 6px rgba(201, 184, 255, 0.4);
}

/* --- 16i. Headings: moonlit glow --- */
[data-theme="tsukimi"] h1,
[data-theme="tsukimi"] h2,
[data-theme="tsukimi"] h3 {
  text-shadow: 0 0 12px rgba(201, 184, 255, 0.4) !important;
}

/* --- 16j. Nav --- */
[data-theme="tsukimi"] nav button.bg-zen-text {
  background: linear-gradient(90deg, #C9B8FF 0%, #A898E0 100%) !important;
  color: #0D0B1A !important;
  border-left: 4px solid #7DCEA0 !important;
  border-right: none !important;
  border-top: none !important;
  border-bottom: none !important;
  border-radius: 14px !important;
}

[data-theme="tsukimi"] nav button.bg-white {
  background-color: transparent !important;
}

[data-theme="tsukimi"] nav button.bg-white:hover {
  background-color: rgba(201, 184, 255, 0.06) !important;
}

/* --- 16k. Sidebar --- */
[data-theme="tsukimi"] aside.border-r-2 {
  background-color: rgba(26, 21, 48, 0.85) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border-right-width: 1px !important;
  border-color: rgba(201, 184, 255, 0.12) !important;
}

/* --- 16l. Progress bar: mint-silver gradient --- */
[data-theme="tsukimi"] .bg-zen-success.h-full {
  background: linear-gradient(90deg, #5DB888 0%, #7DCEA0 50%, #5DB888 100%) !important;
  border-right: none !important;
  box-shadow: 0 0 8px rgba(125, 206, 160, 0.25) !important;
}

/* --- 16m. Neon glow on success elements --- */
[data-theme="tsukimi"] .bg-zen-success {
  background-color: var(--zen-success) !important;
  box-shadow: 0 0 8px rgba(125, 206, 160, 0.3);
}

/* --- 16n. Links --- */
[data-theme="tsukimi"] a       { color: var(--zen-success); }
[data-theme="tsukimi"] a:hover { color: var(--zen-accent); }

/* --- 16o. Scrollbar --- */
[data-theme="tsukimi"] ::-webkit-scrollbar-track {
  background: #0D0B1A !important;
}
[data-theme="tsukimi"] ::-webkit-scrollbar-thumb {
  background: #4A3D6B !important;
  border-radius: 4px !important;
}
[data-theme="tsukimi"] ::-webkit-scrollbar-thumb:hover {
  background: #C9B8FF !important;
}

/* --- 16p. Rounded elements --- */
[data-theme="tsukimi"] .rounded    { border-radius: 14px !important; }
[data-theme="tsukimi"] .rounded-lg { border-radius: 16px !important; }


/* ==========================================================================
   8. KEYFRAMES
   ========================================================================== */

@keyframes neon-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.8; }
}

@keyframes anime-sparkle {
  0%, 100% { opacity: 1; transform: scale(1) rotate(0deg); }
  50% { opacity: 0.5; transform: scale(0.7) rotate(180deg); }
}

@keyframes anime-shimmer {
  0% { left: -100%; }
  100% { left: 100%; }
}

@keyframes anime-pulse-border {
  0%, 100% { box-shadow: 4px 4px 0 0 #FFE66D; }
  50% { box-shadow: 6px 6px 0 0 #4ECDC4, 0 0 20px rgba(255, 107, 157, 0.3); }
}

@keyframes matsuri-lantern-glow {
  0%, 100% { box-shadow: 0 0 15px rgba(255, 107, 53, 0.2), 0 4px 12px rgba(0, 0, 0, 0.3); }
  50% { box-shadow: 0 0 25px rgba(255, 107, 53, 0.4), 0 4px 16px rgba(255, 215, 0, 0.15); }
}

@keyframes yokai-spectral-pulse {
  0%, 100% { box-shadow: 0 0 15px rgba(61, 237, 151, 0.2); }
  50% { box-shadow: 0 0 30px rgba(61, 237, 151, 0.4), 0 0 50px rgba(155, 89, 182, 0.15); }
}

@keyframes yume-twinkle {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.3; }
}

@keyframes tsukimi-moon-glow {
  0%, 100% { box-shadow: 0 0 20px rgba(201, 184, 255, 0.10); }
  50% { box-shadow: 0 0 30px rgba(201, 184, 255, 0.20), 0 0 50px rgba(125, 206, 160, 0.08); }
}


/* ==========================================================================
   10. MOBILE BOTTOM BAR — Per-theme overrides
   ========================================================================== */

/* --- DEFAULT (Neo-Brutalist): thick borders, red accent shadow, UPPERCASE --- */
[data-theme="default"] .mobile-bottom-bar {
  background: rgba(0, 0, 0, 0.12) !important;
  backdrop-filter: blur(12px) !important;
  border-top: 3px solid #000 !important;
}
[data-theme="default"] .mobile-tab {
  border: 2px solid #000 !important;
  border-radius: 6px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.03em !important;
}
[data-theme="default"] .mobile-tab-active {
  border-color: var(--zen-accent) !important;
  box-shadow: 3px 3px 0px 0px var(--zen-accent) !important;
  background: #fff !important;
  transform: translateY(-2px) !important;
}

/* --- WABI-SABI (侘寂): dashed borders, earthy, warm imperfection --- */
[data-theme="wabi_sabi"] .mobile-bottom-bar {
  background: rgba(245, 243, 238, 0.85) !important;
  backdrop-filter: blur(16px) !important;
  border-top: 1px dashed var(--zen-border) !important;
}
[data-theme="wabi_sabi"] .mobile-tab {
  border: 1px dashed transparent !important;
  border-radius: 3px !important;
  background: transparent !important;
  opacity: 0.8 !important;
}
[data-theme="wabi_sabi"] .mobile-tab-active {
  border-color: var(--zen-border) !important;
  opacity: 1 !important;
  background: var(--zen-surface) !important;
  box-shadow: none !important;
}

/* --- SUMI-E (墨絵): ethereal fog, ink underline, frosted glass --- */
[data-theme="sumi_e"] .mobile-bottom-bar {
  background: rgba(248, 248, 248, 0.7) !important;
  backdrop-filter: blur(20px) !important;
  border-top: 1px solid rgba(0, 0, 0, 0.08) !important;
}
[data-theme="sumi_e"] .mobile-tab {
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  opacity: 0.5 !important;
}
[data-theme="sumi_e"] .mobile-tab-active {
  opacity: 1 !important;
  border-bottom: 2px solid var(--zen-text) !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* --- ANIME (アニメ): pastel gradient, sparkle star ✦, bouncy --- */
[data-theme="anime"] .mobile-bottom-bar {
  background: linear-gradient(135deg, rgba(255, 245, 247, 0.92), rgba(168, 230, 207, 0.92)) !important;
  backdrop-filter: blur(16px) !important;
  border-top: 3px solid #FF6B9D !important;
  border-radius: 20px 20px 0 0 !important;
}
[data-theme="anime"] .mobile-tab {
  border: 2px solid transparent !important;
  border-radius: 14px !important;
  background: transparent !important;
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
}
[data-theme="anime"] .mobile-tab-active {
  background: linear-gradient(135deg, #FF6B9D, #A78BFA) !important;
  color: #fff !important;
  border-color: #FFE66D !important;
  box-shadow: 3px 3px 0 0 #4ECDC4 !important;
  transform: translateY(-3px) scale(1.05) !important;
  position: relative !important;
  overflow: visible !important;
}
[data-theme="anime"] .mobile-tab-active::after {
  content: '\2726' !important;
  position: absolute !important;
  top: -6px !important;
  right: -4px !important;
  font-size: 12px !important;
  color: #FFE66D !important;
  animation: anime-sparkle 2s ease-in-out infinite !important;
  pointer-events: none !important;
}
[data-theme="anime"] .mobile-tab-active span,
[data-theme="anime"] .mobile-tab-active svg {
  color: #fff !important;
}

/* --- KABUKICHO (歌舞伎町): dark glass, neon glow, cyberpunk --- */
[data-theme="kabukicho"] .mobile-bottom-bar {
  background: rgba(10, 14, 26, 0.82) !important;
  backdrop-filter: blur(16px) !important;
  border-top: 2px solid var(--zen-accent) !important;
  box-shadow: 0 -4px 20px rgba(255, 0, 128, 0.15) !important;
}
[data-theme="kabukicho"] .mobile-tab {
  border: 1px solid rgba(255, 0, 128, 0.15) !important;
  border-radius: 4px !important;
  background: rgba(26, 31, 53, 0.6) !important;
  color: #E0E6FF !important;
}
[data-theme="kabukicho"] .mobile-tab-active {
  border-color: #00FFD1 !important;
  box-shadow: 0 0 12px rgba(0, 255, 209, 0.4), inset 0 0 8px rgba(0, 255, 209, 0.1) !important;
  color: #00FFD1 !important;
  background: rgba(0, 255, 209, 0.08) !important;
  text-shadow: 0 0 8px rgba(0, 255, 209, 0.5) !important;
}
[data-theme="kabukicho"] .mobile-tab-active svg {
  filter: drop-shadow(0 0 4px rgba(0, 255, 209, 0.6)) !important;
}

/* --- MATSURI (祭り): warm dark glass, lantern glow, gold/orange --- */
[data-theme="matsuri"] .mobile-bottom-bar {
  background: rgba(13, 10, 26, 0.85) !important;
  backdrop-filter: blur(16px) !important;
  border-top: 2px solid rgba(255, 107, 53, 0.4) !important;
  box-shadow: 0 -4px 15px rgba(255, 107, 53, 0.1) !important;
}
[data-theme="matsuri"] .mobile-tab {
  border: 1px solid rgba(255, 215, 0, 0.1) !important;
  border-radius: 6px !important;
  background: rgba(26, 21, 48, 0.5) !important;
  color: #F5E6D0 !important;
}
[data-theme="matsuri"] .mobile-tab-active {
  background: linear-gradient(135deg, rgba(255, 215, 0, 0.15), rgba(255, 107, 53, 0.15)) !important;
  border-color: #FFD700 !important;
  box-shadow: 0 0 12px rgba(255, 215, 0, 0.3) !important;
  color: #FFD700 !important;
}
[data-theme="matsuri"] .mobile-tab-active svg {
  filter: drop-shadow(0 0 4px rgba(255, 215, 0, 0.6)) !important;
}

/* --- SHOGUN CASTLE (将軍の城): parchment, vermillion, gold shadow --- */
[data-theme="shogun_castle"] .mobile-bottom-bar {
  background: rgba(245, 240, 232, 0.92) !important;
  backdrop-filter: blur(12px) !important;
  border-top: 3px solid #1A0F0A !important;
}
[data-theme="shogun_castle"] .mobile-tab {
  border: 2px solid #1A0F0A !important;
  border-radius: 0 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  background: transparent !important;
}
[data-theme="shogun_castle"] .mobile-tab-active {
  background: linear-gradient(180deg, #8B0000, #6B0000) !important;
  color: #F5F0E8 !important;
  border-color: #1A0F0A !important;
  box-shadow: 3px 3px 0 0 rgba(184, 134, 11, 0.6) !important;
}
[data-theme="shogun_castle"] .mobile-tab-active span,
[data-theme="shogun_castle"] .mobile-tab-active svg {
  color: #FFD700 !important;
}

/* --- YOKAI WORLD (妖怪): purple void, spectral green glow --- */
[data-theme="yokai_world"] .mobile-bottom-bar {
  background: rgba(10, 13, 18, 0.82) !important;
  backdrop-filter: blur(16px) !important;
  border-top: 1px solid rgba(155, 89, 182, 0.3) !important;
  box-shadow: 0 -4px 20px rgba(155, 89, 182, 0.1) !important;
}
[data-theme="yokai_world"] .mobile-tab {
  border: 1px solid rgba(155, 89, 182, 0.15) !important;
  border-radius: 8px !important;
  background: rgba(20, 26, 36, 0.5) !important;
  color: #D4CCE0 !important;
}
[data-theme="yokai_world"] .mobile-tab-active {
  border-color: #3DED97 !important;
  box-shadow: 0 0 12px rgba(61, 237, 151, 0.3), inset 0 0 8px rgba(61, 237, 151, 0.05) !important;
  color: #3DED97 !important;
  background: rgba(61, 237, 151, 0.08) !important;
}
[data-theme="yokai_world"] .mobile-tab-active svg {
  filter: drop-shadow(0 0 4px rgba(61, 237, 151, 0.5)) !important;
}

/* --- SAKURA (桜): soft pink glass, petal gradient, rounded --- */
[data-theme="sakura"] .mobile-bottom-bar {
  background: linear-gradient(135deg, rgba(255, 245, 248, 0.92), rgba(255, 232, 239, 0.92)) !important;
  backdrop-filter: blur(16px) !important;
  border-top: 1px solid #E8B4C4 !important;
  border-radius: 16px 16px 0 0 !important;
}
[data-theme="sakura"] .mobile-tab {
  border: 1px solid transparent !important;
  border-radius: 12px !important;
  background: transparent !important;
}
[data-theme="sakura"] .mobile-tab-active {
  background: linear-gradient(135deg, #D4507A, #E8758A) !important;
  color: #fff !important;
  border-color: #FFB6C8 !important;
  box-shadow: 0 3px 12px rgba(212, 80, 122, 0.25) !important;
  transform: translateY(-2px) !important;
  border-radius: 12px !important;
}
[data-theme="sakura"] .mobile-tab-active span,
[data-theme="sakura"] .mobile-tab-active svg {
  color: #fff !important;
}

/* --- MAIKO (舞妓): warm parchment, vermillion active, gold accent --- */
[data-theme="maiko"] .mobile-bottom-bar {
  background: #FFF9FB !important;
  border-top: 1px solid #D4B8C8 !important;
}
[data-theme="maiko"] .mobile-tab {
  border: 1px solid #D4B8C8 !important;
  border-radius: 6px !important;
  background: transparent !important;
  letter-spacing: 0.02em !important;
}
[data-theme="maiko"] .mobile-tab-active {
  background: linear-gradient(180deg, #B8336A, #8E2555) !important;
  color: #FFF9FB !important;
  border-color: #8B6B7D !important;
  box-shadow: 0 3px 12px rgba(184, 51, 106, 0.2) !important;
}
[data-theme="maiko"] .mobile-tab-active span,
[data-theme="maiko"] .mobile-tab-active svg {
  color: #E8D0DC !important;
}

/* --- YUME (夢): glass gradient, twinkle, bouncy rounds --- */
[data-theme="yume"] .mobile-bottom-bar {
  background: linear-gradient(135deg, rgba(248, 245, 255, 0.95), rgba(252, 240, 248, 0.95)) !important;
  border-top: 2px solid rgba(139, 92, 246, 0.2) !important;
  border-radius: 22px 22px 0 0 !important;
}
[data-theme="yume"] .mobile-tab {
  border: 2px solid transparent !important;
  border-radius: 16px !important;
  background: transparent !important;
}
[data-theme="yume"] .mobile-tab-active {
  background: linear-gradient(135deg, #8B5CF6, #A78BFA) !important;
  color: #fff !important;
  border-color: #F0B6D8 !important;
  box-shadow: 0 4px 16px rgba(139, 92, 246, 0.25) !important;
  transform: translateY(-3px) scale(1.03) !important;
  border-radius: 16px !important;
  position: relative !important;
  overflow: visible !important;
}
[data-theme="yume"] .mobile-tab-active::after {
  content: '\2727' !important;
  position: absolute !important;
  top: -5px !important;
  right: -3px !important;
  font-size: 11px !important;
  color: #C9B8FF !important;
  animation: yume-twinkle 4s ease-in-out infinite !important;
  will-change: opacity !important;
  pointer-events: none !important;
}
[data-theme="yume"] .mobile-tab-active span,
[data-theme="yume"] .mobile-tab-active svg {
  color: #fff !important;
}

/* --- TSUKIMI (月見): moonlit dark glass, lavender glow, soft rounded --- */
[data-theme="tsukimi"] .mobile-bottom-bar {
  background: rgba(13, 11, 26, 0.85) !important;
  backdrop-filter: blur(16px) !important;
  border-top: 1px solid rgba(201, 184, 255, 0.2) !important;
  box-shadow: 0 -4px 20px rgba(201, 184, 255, 0.06) !important;
  border-radius: 14px 14px 0 0 !important;
}
[data-theme="tsukimi"] .mobile-tab {
  border: 1px solid rgba(201, 184, 255, 0.12) !important;
  border-radius: 12px !important;
  background: rgba(26, 21, 48, 0.4) !important;
  color: #E8E0F0 !important;
}
[data-theme="tsukimi"] .mobile-tab-active {
  background: linear-gradient(135deg, rgba(201, 184, 255, 0.15), rgba(125, 206, 160, 0.08)) !important;
  border-color: #C9B8FF !important;
  box-shadow: 0 0 14px rgba(201, 184, 255, 0.25) !important;
  color: #C9B8FF !important;
  border-radius: 12px !important;
}
[data-theme="tsukimi"] .mobile-tab-active svg {
  filter: drop-shadow(0 0 4px rgba(201, 184, 255, 0.5)) !important;
}


/* ==========================================================================
   9. TRANSITIONS
   ========================================================================== */

* {
  transition-property: background-color, border-color, color, box-shadow;
  transition-duration: 200ms;
  transition-timing-function: ease-in-out;
}

[data-theme-switching] * {
  transition: none !important;
}