/* TEMA B · NOCHE — cielo de noche con estrellas, títulos en serif grande, opciones de vidrio,
   botón lavanda que brilla y cartas oscuras con filete champagne. Logo en negativo. */

html[data-tema="noche"]{
  color-scheme: dark;
  --t-page: #0E0616; --t-franja: rgba(255,255,255,.035);
  --t-fondo:
    linear-gradient(180deg, rgba(16,7,24,0) 0, rgba(16,7,24,0) 260px, #100718 500px) 0 0 / 100% 100% no-repeat,
    radial-gradient(circle at 22px 34px, rgba(255,255,255,.8) 0 1px, transparent 1.7px) 0 0 / 190px 210px,
    radial-gradient(circle at 128px 142px, rgba(255,255,255,.5) 0 .9px, transparent 1.5px) 0 0 / 190px 210px,
    radial-gradient(circle at 74px 182px, rgba(232,211,162,.75) 0 1.2px, transparent 1.9px) 0 0 / 190px 210px,
    radial-gradient(circle at 168px 64px, rgba(216,169,225,.6) 0 1px, transparent 1.7px) 0 0 / 250px 230px,
    radial-gradient(circle at 44px 118px, rgba(255,255,255,.35) 0 .8px, transparent 1.3px) 0 0 / 130px 150px,
    radial-gradient(130% 55% at 50% 0%, #2C1544 0%, #170B24 52%, #0E0616 100%);
  --t-bg: #170B23;
  --t-ink: #F8F0FA; --t-text: #E2D5E8; --t-muted: #B7A3C1; --t-faint: #8C7A98; --t-line: rgba(216,169,225,.2);
  --t-accent: #E4BDEC; --t-alert: #F4A6C9;
  --t-primary: #D8A9E1; --t-primary-hover: #E7C4EE; --t-on-primary: #241030;
  --t-surface: rgba(40,21,58,.88); --t-surface-hover: rgba(52,28,74,.92);
  --t-opt-borde: 1px solid rgba(216,169,225,.2); --t-radius: 16px; --t-opt-shadow: none;
  --t-icon-bg: rgba(216,169,225,.1); --t-icon-borde: inset 0 0 0 1px rgba(216,169,225,.2);
  --t-selected-bg: rgba(74,40,98,.95); --t-selected-ink: #FFFFFF;
  --t-selected-shadow: 0 0 0 1px #D8A9E1, 0 0 26px rgba(216,169,225,.28);
  --t-pill-bg: rgba(216,169,225,.12); --t-pill-ink: #E4BDEC;
  --t-track: rgba(255,255,255,.09); --t-progress: linear-gradient(90deg, #9B5FB0, #E8D3A2); --t-barra: 3px;
  --t-btn-radius: 14px; --t-btn-shadow: 0 10px 34px -8px rgba(216,169,225,.5); --t-btn-weight: 700;
  --t-font-ui: 'Manrope', sans-serif;
  --t-font-head: 'Cormorant Garamond', serif; --t-head-weight: 600; --t-head-leading: 1.08; --t-head-tracking: -.005em;
  --t-h1: 2rem; --t-h1-grande: 2.35rem;
  --t-font-read: 'Lora', serif;
  --t-mark-bg: linear-gradient(transparent 60%, rgba(232,211,162,.38) 60%); --t-mark-ink: #FFFFFF;
  --t-glow: rgba(216,169,225,.4); --t-overlay: rgba(8,3,12,.74);
  --t-burbuja-shadow: 0 0 60px rgba(216,169,225,.18);
  --t-card-dorso: #33184A;
  --t-card-dorso-arte: url(emblema-lavanda.png) center / 80% no-repeat;
  --t-card-dorso-linea: rgba(232,211,162,.55);
  --t-card-canto: 3px solid #1A0C27; --t-card-outline: 1px solid rgba(232,211,162,.6);
  --t-card-frente: #241334; --t-card-marco: 1px solid rgba(232,211,162,.65);
  --t-card-titulo: #E8D3A2; --t-card-suave: #B7A3C1; --t-card-linea: rgba(232,211,162,.3);
  --t-card-shadow: 0 0 44px rgba(216,169,225,.3);
  --t-card-sombra-abanico: -2px 3px 10px rgba(0,0,0,.55);
}

html[data-tema="noche"] #logo-bar img{ content: url(logo-negativo.png); }

/* pantalla 1: halo y órbita detrás del abanico */
html[data-tema="noche"] .tarot-scene::before{
  content: ''; position: absolute; left: 50%; top: -22px; width: 290px; height: 290px; transform: translateX(-50%);
  border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(232,211,162,.25);
  background: radial-gradient(circle, rgba(216,169,225,.32) 0, rgba(216,169,225,.1) 40%, transparent 66%);
  pointer-events: none; z-index: 0;
}
html[data-tema="noche"] .tarot-scene::after{
  content: '✦'; position: absolute; left: 50%; top: -30px; transform: translateX(-50%);
  color: #E8D3A2; font-size: 14px; pointer-events: none; z-index: 0;
}

html[data-tema="noche"] #content-area h1.text-3xl{ font-weight: 500; }
html[data-tema="noche"] .reading-text{ font-size: 1.08rem; line-height: 1.85; }
html[data-tema="noche"] #content-area h1[style]{ color: #E8D3A2; font-style: italic; font-weight: 500; font-size: 2.1rem; }
html[data-tema="noche"] #cta-final{ font-size: 1.1rem; }
html[data-tema="noche"] #carousel-track{ background: #FFFFFF; }
html[data-tema="noche"] #carousel-left,
html[data-tema="noche"] #carousel-right{ background: rgba(23,11,35,.8); color: var(--t-ink); }