/* Drift theme — inherited from the Night Shift family palette.
   Source of truth: nightshift/ V1 app tokens. Deep night-purple + neon. */

:root {
  /* Backgrounds */
  --bg:            #0a0420;   /* deepest night-purple */
  --bg-2:          #0b0614;
  --card:          #1a0f2e;
  --card-hover:    #22143b;
  --line:          #2a1c4a;

  /* Ink */
  --ink:           #f4ecff;
  --ink-dim:       #b8a9d9;
  --ink-mute:      #9b8eb5;

  /* Neon accents (Night Shift signature) */
  --accent:        #ff4fa3;   /* hot pink — primary CTA / the Drift button */
  --accent-cyan:   #1ec5fa;   /* cyan */
  --accent-purple: #b36bff;   /* purple */

  /* Signals */
  --good:          #6bffb0;
  --bad:           #ff6b8a;
  --warn:          #ffb36b;

  /* Glows */
  --glow-accent:   rgba(255,79,163,0.35);
  --glow-cyan:     rgba(30,197,250,0.30);

  /* Geometry */
  --radius:        16px;
  --radius-sm:     10px;

  /* Type */
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, system-ui, sans-serif;
  --font-serif: Georgia, "Times New Roman", serif;
}

* { box-sizing: border-box; }
html, body {
  margin: 0;
  background: radial-gradient(120% 120% at 50% 0%, #140a2e 0%, var(--bg) 55%, var(--bg-2) 100%);
  color: var(--ink);
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
}

/* The signature Drift button — one tap to surprise */
.drift-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 18px 40px;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: 0.3px;
  color: #1a0014;
  background: linear-gradient(135deg, var(--accent) 0%, var(--accent-purple) 100%);
  border: none;
  border-radius: 999px;
  cursor: pointer;
  box-shadow: 0 0 0 1px rgba(255,255,255,0.08), 0 8px 40px var(--glow-accent);
  transition: transform 0.12s ease, box-shadow 0.2s ease;
}
.drift-btn:hover { transform: translateY(-2px); box-shadow: 0 0 0 1px rgba(255,255,255,0.14), 0 12px 56px var(--glow-accent); }
.drift-btn:active { transform: scale(0.97); }

/* Destination card */
.card {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 22px;
  box-shadow: 0 10px 40px rgba(0,0,0,0.35);
}

.kind-pill {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  padding: 4px 10px;
  border-radius: 999px;
  color: var(--accent-cyan);
  background: var(--glow-cyan);
}

.thumb { background: transparent; border: 1px solid var(--line); color: var(--ink); border-radius: 999px; padding: 12px 18px; cursor: pointer; }
.thumb.up:hover   { border-color: var(--good); color: var(--good); }
.thumb.down:hover { border-color: var(--bad);  color: var(--bad); }