/* CLUB39 shared design tokens + typography */
:root {
  --club-bg: #0b0e13;
  --club-surface: #11161e;
  --club-card: #171d27;
  --club-card-hover: #1d2531;
  --club-border: #2a3341;
  --club-border-strong: #3b4657;
  --club-accent: #ffb21a;
  --club-accent-dark: #e79a00;
  --club-blue: #3b9cff;
  --club-green: #35b86b;
  --club-red: #ef626c;
  --club-text: #f2f4f8;
  --club-muted: #9ca7b6;
  --club-radius: 12px;
  --club-radius-sm: 9px;
  --club-shadow: 0 18px 48px rgba(0, 0, 0, 0.2);
  --club-font: "IBM Plex Sans", "Segoe UI", system-ui, sans-serif;
  --club-font-mono: "IBM Plex Mono", ui-monospace, Consolas, monospace;
  --club-fs-xs: 11px;
  --club-fs-sm: 12px;
  --club-fs-label: 13px;
  --club-fs-body: 15px;
  --club-fs-h2: 22px;
  --club-fs-h1: 28px;
  --club-lh: 1.5;

  /* Staff aliases — keep existing class variables in sync */
  --bg: var(--club-bg);
  --panel: var(--club-card);
  --panel2: var(--club-card-hover);
  --line: var(--club-border);
  --text: var(--club-text);
  --muted: var(--club-muted);
  --accent: var(--club-accent);
  --blue: var(--club-blue);
  --green: var(--club-green);
  --red: var(--club-red);
}

html {
  font-family: var(--club-font);
  font-size: var(--club-fs-body);
  line-height: var(--club-lh);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body {
  font-family: var(--club-font);
  font-size: var(--club-fs-body);
  line-height: var(--club-lh);
  font-feature-settings: "kern" 1, "liga" 1;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--club-font);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.25;
}

h1 { font-size: var(--club-fs-h1); font-weight: 700; }
h2 { font-size: var(--club-fs-h2); font-weight: 700; }

label {
  font-size: var(--club-fs-label);
  font-weight: 500;
}

.font-mono,
.fleet-code,
.booking-id {
  font-family: var(--club-font-mono);
  font-variant-numeric: tabular-nums;
}

input, select, textarea, button, .btn {
  font-family: inherit;
}