/* Shared look for the Enter Data and Analytics pages */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
:root { --bg: #0a0d15; --blue: 110,168,255; --gold: 232,184,106; --sub: rgba(255,255,255,0.55); --pad: clamp(18px, 4vw, 56px); }
html { -webkit-text-size-adjust: 100%; }
body {
  min-height: 100vh; background: var(--bg); color: #fff;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  -webkit-font-smoothing: antialiased;
  background-image:
    radial-gradient(70% 50% at 50% 0%, rgba(130,160,255,0.16), transparent 72%),
    radial-gradient(50% 40% at 80% 70%, rgba(90,205,235,0.08), transparent 72%);
  background-attachment: fixed;
}
.wrap { max-width: 1180px; margin: 0 auto; padding: var(--pad); display: flex; flex-direction: column; gap: 26px; }
.bar { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.back, .pill {
  font-size: 11px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; text-decoration: none;
  color: rgba(255,255,255,0.88); padding: 9px 16px; border-radius: 999px; cursor: pointer;
  background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.16);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.18); font-family: inherit;
  transition: background .2s ease, box-shadow .2s ease, color .2s ease;
}
.back:hover, .pill:hover { background: rgba(255,255,255,0.12); box-shadow: inset 0 1px 0 rgba(255,255,255,0.25), 0 0 18px rgba(var(--blue),0.35); }
.pill.on { background: rgba(var(--blue),0.2); border-color: rgba(var(--blue),0.55); color: #fff; box-shadow: 0 0 18px rgba(var(--blue),0.35); }
.title {
  font-family: 'Bodoni Moda', Georgia, serif; font-weight: 500; text-transform: uppercase; letter-spacing: 0.03em;
  font-size: clamp(26px, 4.4vw, 52px); text-align: center; line-height: 1.05;
  -webkit-text-stroke: 1px rgba(255,255,255,0.85); color: transparent;
  background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(255,255,255,0.3) 55%, rgba(255,255,255,0.95));
  -webkit-background-clip: text; background-clip: text;
  filter: drop-shadow(0 0 26px rgba(150,185,255,0.4));
}
.lede { text-align: center; color: var(--sub); font-size: 14px; margin-top: -10px; }
.card {
  background: rgba(255,255,255,0.035); border: 1px solid rgba(255,255,255,0.1); border-radius: 20px; padding: clamp(16px, 2vw, 26px);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: inset 0 1px 0 rgba(255,255,255,0.14);
}
h3 { font-family: 'Bodoni Moda', Georgia, serif; font-weight: 500; font-size: clamp(18px, 2vw, 24px); }
.eyebrow { font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(var(--blue),1); }
.muted { color: var(--sub); font-size: 13px; }
/* gate */
.gate { min-height: 100vh; display: grid; place-items: center; padding: var(--pad); }
.gate form { width: min(380px, 100%); display: flex; flex-direction: column; gap: 14px; align-items: center; text-align: center; }
.gate input, .field input, .field select {
  width: 100%; font: inherit; color: #fff; padding: 11px 14px; border-radius: 12px; outline: none;
  background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.18); color-scheme: dark;
}
.gate input { text-align: center; letter-spacing: 0.3em; }
.gate input:focus, .field input:focus { border-color: rgba(var(--blue),0.7); box-shadow: 0 0 0 3px rgba(var(--blue),0.2); }
.err { color: #ff8f8f; font-size: 13px; min-height: 18px; }
[hidden] { display: none !important; }
@media (max-width: 560px) { .wrap { gap: 20px; } }