/**
 * Shared host + guest palettes via body.theme-*.
 * Kevin / All: cream paper + mint/lilac glass (no deep blue, no gradients).
 * Mike & Cohost: navy glass + blue/brass (gradients OK).
 */
:root {
  --kev-ink: #1b1a2a;
  --kev-paper: #faf8f5;
  --kev-mint: #55ffe1;
  --kev-lilac: #c9b6ff;
  --kev-pink: #ffb8e0;
  --kev-lemon: #ffe8a3;
  --kev-muted: #6b6578;
  --kev-deep: #0e8f7e;
  --kev-glass: rgba(255, 255, 255, 0.55);
  --kev-glass-strong: rgba(255, 252, 255, 0.72);
  --kev-glass-border: rgba(201, 182, 255, 0.45);

  --mike-ink: #0f1419;
  --mike-paper: #e8eef4;
  --mike-navy: #07111f;
  --mike-steel: #12253d;
  --mike-blue: #3d8bff;
  --mike-blue-deep: #1e5fc4;
  --mike-brass: #d4a017;
  --mike-green: #1fa97a;
  --mike-text: #e8eef6;
  --mike-muted: #8fa3b8;

  --font-serif-kev: 'Playfair Display', Georgia, serif;
  --font-sans-kev: 'Inter', system-ui, sans-serif;
  --font-mike: 'Poppins', -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Segoe UI',
    sans-serif;
}

/* Kevin & Peter — flat cream + frosted glass (mint / lilac only) */
body.theme-kev {
  --graphite: #1a1a1a;
  --taupe: #6b6578;
  --cream: #faf8f5;
  --white: #ffffff;
  --teal: var(--kev-mint);
  --accent: var(--kev-deep);
  --accent-2: var(--kev-lilac);
  --accent-3: var(--kev-pink);
  --warm: var(--kev-lemon);
  --font-serif: var(--font-serif-kev);
  --font-sans: var(--font-sans-kev);
  color: #1a1a1a;
  background: #faf8f5;
  font-family: var(--font-sans);
}

body.theme-kev h1,
body.theme-kev h2,
body.theme-kev .header h1,
body.theme-kev .hero h1,
body.theme-kev .sidebar-header h1 {
  font-family: var(--font-serif);
}

body.theme-kev .kicker,
body.theme-kev .map-link {
  color: var(--kev-deep);
}

body.theme-kev .submit-btn,
body.theme-kev .unlock-btn {
  background: #1a1a1a;
  color: #fff;
}

body.theme-kev .submit-btn:hover,
body.theme-kev .unlock-btn:hover {
  background: #2a2840;
}

body.theme-kev .header,
body.theme-kev .section,
body.theme-kev .panel,
body.theme-kev .metric {
  background: var(--kev-glass-strong);
  border: 1px solid var(--kev-glass-border);
  backdrop-filter: blur(16px) saturate(1.2);
  -webkit-backdrop-filter: blur(16px) saturate(1.2);
  box-shadow: 0 8px 28px rgba(27, 26, 42, 0.06);
}

body.theme-kev .tile-kev,
body.theme-kev .tile {
  box-shadow: inset 3px 0 0 var(--kev-mint);
}

/* Map List + close — frosted glass on Kevin & All */
body.theme-kev #toggle-sidebar,
body.theme-kev .close-sidebar {
  background: rgba(255, 252, 255, 0.48);
  color: var(--kev-ink);
  border-color: rgba(201, 182, 255, 0.55);
  backdrop-filter: blur(18px) saturate(1.35);
  -webkit-backdrop-filter: blur(18px) saturate(1.35);
  box-shadow: 0 8px 28px rgba(27, 26, 42, 0.12);
}

/* Mike & Cohost — dark glass + blue/brass gradients */
body.theme-mike {
  --graphite: var(--mike-text);
  --taupe: var(--mike-muted);
  --cream: var(--mike-navy);
  --white: var(--mike-steel);
  --teal: var(--mike-blue);
  --accent: var(--mike-blue);
  --accent-2: var(--mike-brass);
  --accent-3: var(--mike-green);
  --warm: var(--mike-brass);
  --mike-accent: var(--mike-blue);
  --mike-accent-strong: var(--mike-blue-deep);
  --mike-border: rgba(61, 139, 255, 0.28);
  --mike-panel: rgba(18, 37, 61, 0.45);
  --mike-glass: rgba(255, 255, 255, 0.08);
  --mike-chip: #152a45;
  --font-serif: var(--font-mike);
  --font-sans: var(--font-mike);
  color: var(--mike-text);
  background:
    radial-gradient(1100px 560px at 0% -8%, rgba(61, 139, 255, 0.42), transparent 55%),
    radial-gradient(800px 480px at 110% 5%, rgba(212, 160, 23, 0.18), transparent 50%),
    radial-gradient(600px 400px at 50% 110%, rgba(31, 169, 122, 0.12), transparent 55%),
    linear-gradient(165deg, #050b14 0%, #0a1628 48%, #10243c 100%);
  font-family: var(--font-sans);
}

body.theme-mike h1,
body.theme-mike h2,
body.theme-mike .header h1,
body.theme-mike .hero h1,
body.theme-mike .sidebar-header h1 {
  font-family: var(--font-sans);
  font-weight: 600;
}

body.theme-mike .kicker,
body.theme-mike .map-link {
  color: var(--mike-blue);
}

body.theme-mike .header {
  color: var(--mike-text);
  background: rgba(15, 28, 48, 0.5);
  border-bottom: 1px solid var(--mike-border);
  backdrop-filter: blur(16px) saturate(1.15);
  -webkit-backdrop-filter: blur(16px) saturate(1.15);
}

body.theme-mike .deck,
body.theme-mike .hint,
body.theme-mike .label,
body.theme-mike .section-deck {
  color: var(--mike-muted);
}

body.theme-mike .section,
body.theme-mike .panel,
body.theme-mike .metric {
  background: var(--mike-panel);
  border-color: var(--mike-border);
  color: var(--mike-text);
  backdrop-filter: blur(16px) saturate(1.2);
  -webkit-backdrop-filter: blur(16px) saturate(1.2);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.22);
}

/* Map List + close — dark frosted glass on Mike */
body.theme-mike #toggle-sidebar,
body.theme-mike .close-sidebar {
  background: rgba(10, 22, 40, 0.45);
  border-color: rgba(61, 139, 255, 0.45);
  color: var(--mike-text);
  backdrop-filter: blur(18px) saturate(1.35);
  -webkit-backdrop-filter: blur(18px) saturate(1.35);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35);
}

body.theme-mike input,
body.theme-mike textarea,
body.theme-mike select {
  background: rgba(7, 17, 31, 0.55);
  border-color: rgba(61, 139, 255, 0.35);
  color: var(--mike-text);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

body.theme-mike .submit-btn,
body.theme-mike .unlock-btn {
  background: var(--mike-blue);
  color: #061018;
  font-weight: 700;
}

body.theme-mike .submit-btn:hover,
body.theme-mike .unlock-btn:hover {
  background: #5aa0ff;
}

body.theme-mike .tile-mike,
body.theme-mike .tile {
  box-shadow: inset 3px 0 0 #1e5fc4;
}

/* Mike Hang (/plans/) — glass panels over dark ambient */
body.theme-mike .header,
body.theme-mike .plan-card,
body.theme-mike .card,
body.theme-mike .main-section {
  background: rgba(18, 37, 61, 0.45);
  border-color: rgba(61, 139, 255, 0.28);
  backdrop-filter: blur(16px) saturate(1.2);
  -webkit-backdrop-filter: blur(16px) saturate(1.2);
}

/* Localhost host unlock banner */
.gwn-local-host-banner {
  position: sticky;
  top: 0;
  z-index: 40;
  padding: 0.45rem 0.85rem;
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-align: center;
  background: #ffe8a3;
  color: #1a1a1a;
  border-bottom: 1px solid rgba(26, 26, 26, 0.12);
}

body.theme-mike .gwn-local-host-banner {
  background: rgba(212, 160, 23, 0.85);
  color: #061018;
  border-bottom-color: rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}