/* ============================================================
   SKIN: After Dark — neon night magic.
   Served 6pm–6am. Deep navy, cyan/magenta/violet neon.
   Tokens verified against the approved mockup.
   ============================================================ */

body.skin-after-dark {
	--dm-bg: #04061a;
	--dm-bg-2: #070b26;
	--dm-text: #eef0ff;
	--dm-text-muted: #a6add6;
	--dm-text-faint: #79839f;
	--dm-accent: #34e0ff;
	--dm-accent-2: #ff4fd8;
	--dm-accent-3: #8a7bff;
	--dm-gold: #ffd9a0;
	--dm-card-bg: #0b1130;
	--dm-card-bg-2: #0e173e;
	--dm-card-border: 1px solid rgba(141, 163, 255, 0.16);
	--dm-header-bg: rgba(5, 8, 28, 0.78);
	--dm-header-border: 1px solid rgba(141, 163, 255, 0.16);
	--dm-nav-hover-bg: rgba(52, 224, 255, 0.08);
	--dm-font-display: 'Marcellus', Georgia, serif;
	--dm-font-body: 'Outfit', 'Segoe UI', sans-serif;
	--dm-radius: 18px;
	--dm-shadow: 0 8px 30px rgba(0, 0, 0, 0.45);
	--dm-hero-bg:
		radial-gradient(ellipse 60% 40% at 20% 0%, rgba(255, 79, 216, 0.12) 0%, transparent 70%),
		radial-gradient(ellipse 60% 40% at 80% 0%, rgba(52, 224, 255, 0.12) 0%, transparent 70%),
		linear-gradient(180deg, #070b26 0%, #04061a 100%);
	--dm-media-bg: #0b1130;
	--dm-player-bg: #0b1130;
	--dm-player-border: 1px solid rgba(141, 163, 255, 0.16);
	--dm-player-radius: 12px;
	--dm-track-bg: rgba(141, 163, 255, 0.16);
	--dm-btn-text: #04121a;
	--dm-footer-bg: rgba(3, 5, 20, 0.6);
}

/* Twinkling starfield */
body.skin-after-dark::before {
	content: "";
	position: fixed;
	inset: 0;
	pointer-events: none;
	z-index: 0;
	background-image:
		radial-gradient(1px 1px at 12% 22%, rgba(255,255,255,.7) 50%, transparent 51%),
		radial-gradient(1px 1px at 68% 8%, rgba(255,255,255,.5) 50%, transparent 51%),
		radial-gradient(1.5px 1.5px at 84% 34%, rgba(52,224,255,.8) 50%, transparent 51%),
		radial-gradient(1px 1px at 42% 62%, rgba(255,255,255,.4) 50%, transparent 51%),
		radial-gradient(1.5px 1.5px at 28% 78%, rgba(255,79,216,.6) 50%, transparent 51%),
		radial-gradient(1px 1px at 93% 68%, rgba(255,255,255,.5) 50%, transparent 51%);
}
body.skin-after-dark main,
body.skin-after-dark .dm-footer { position: relative; z-index: 1; }
/* Keep the header above page content so the mobile nav dropdown paints on top. */
body.skin-after-dark .dm-header { z-index: 100; }

/* Neon glow headings + brand */
body.skin-after-dark .dm-hero h1 { text-shadow: 0 0 28px rgba(52, 224, 255, 0.35); }
body.skin-after-dark .dm-site-title a .dm-mp3 { color: var(--dm-accent); text-shadow: 0 0 14px rgba(52, 224, 255, 0.7); }
body.skin-after-dark .dm-eyebrow { color: var(--dm-gold); }

/* Cards: navy gradient, cyan→magenta top edge on hover */
body.skin-after-dark .dm-card {
	background: linear-gradient(180deg, var(--dm-card-bg-2), var(--dm-card-bg));
}
body.skin-after-dark .dm-card::before {
	content: "";
	display: block;
	height: 3px;
	border-radius: 3px 3px 0 0;
	background: linear-gradient(90deg, var(--dm-accent), var(--dm-accent-3), var(--dm-accent-2));
	opacity: 0;
	transition: opacity .2s ease;
}
body.skin-after-dark .dm-card:hover::before { opacity: 1; }
body.skin-after-dark .dm-card:hover { transform: translateY(-4px); }

/* Player: glowing cyan ring button, gradient seek bar */
body.skin-after-dark .dm-play-btn {
	box-shadow: 0 0 16px rgba(52, 224, 255, 0.55);
}
body.skin-after-dark .dm-player.dm-playing .dm-play-btn {
	background: var(--dm-accent-2);
	box-shadow: 0 0 16px rgba(255, 79, 216, 0.55);
}
body.skin-after-dark .dm-progress {
	background: linear-gradient(90deg, var(--dm-accent), var(--dm-accent-3), var(--dm-accent-2));
	box-shadow: 0 0 8px rgba(52, 224, 255, 0.6);
}
body.skin-after-dark .dm-time { font-variant-numeric: tabular-nums; }

/* Per-park accent colors (navigation identity) */
body.skin-after-dark .dm-park-tile:nth-child(1) .dm-park-icon { color: #34e0ff; filter: drop-shadow(0 0 8px rgba(52,224,255,.6)); }
body.skin-after-dark .dm-park-tile:nth-child(2) .dm-park-icon { color: #ff4fd8; filter: drop-shadow(0 0 8px rgba(255,79,216,.6)); }
body.skin-after-dark .dm-park-tile:nth-child(3) .dm-park-icon { color: #8a7bff; filter: drop-shadow(0 0 8px rgba(138,123,255,.6)); }
body.skin-after-dark .dm-park-tile:nth-child(4) .dm-park-icon { color: #5eeaa0; filter: drop-shadow(0 0 8px rgba(94,234,160,.6)); }
body.skin-after-dark .dm-park-tile:nth-child(5) .dm-park-icon { color: #ffd9a0; filter: drop-shadow(0 0 8px rgba(255,217,160,.6)); }
body.skin-after-dark .dm-park-tile:hover { border-color: rgba(52, 224, 255, 0.4); }

/* Buttons */
body.skin-after-dark .dm-search-bar button { color: #04121a; }
body.skin-after-dark .dm-pagination .page-numbers.current { color: #04121a; }

/* Marcellus headings render light (400 only) — keep them elegant */
body.skin-after-dark h1,
body.skin-after-dark h2,
body.skin-after-dark h3,
body.skin-after-dark .dm-site-title { font-weight: 400; }
body.skin-after-dark { font-weight: 300; }
