/* TMS Labour - Shared design tokens (all 4 pages load this) */
:root {
  --tms-teal: #32ca92;
  --tms-navy: #30528e;
  --tms-purple: #813f9a;
  --tms-ink: #142033;
  --tms-paper: #f6f8fc;
  --tms-primary: var(--tms-navy);
  --tms-primary-hover: #263d6e;
  --tms-accent: var(--tms-teal);
  --tms-accent-alt: var(--tms-purple);
  --tms-border: rgba(48, 82, 142, 0.15);
  --tms-bg: #fff;
  --tms-text: #1f2937;
  --tms-muted: #5a6a7e;
  --tms-radius: 10px;
  --tms-radius-sm: 8px;
  --tms-touch: 44px;
  --tms-safe-top: env(safe-area-inset-top, 0);
  --tms-safe-bottom: env(safe-area-inset-bottom, 0);
  --tms-gradient-primary: linear-gradient(135deg, var(--tms-navy) 0%, var(--tms-purple) 100%);
  --tms-gradient-accent: linear-gradient(135deg, var(--tms-teal) 0%, #2ab87d 100%);
  --tms-gradient-soft: linear-gradient(160deg, rgba(48, 82, 142, 0.06) 0%, rgba(129, 63, 154, 0.04) 50%, rgba(50, 202, 146, 0.05) 100%);
  --tms-gradient-card: linear-gradient(180deg, #ffffff 0%, #fafbff 100%);
  --tms-shadow-soft: 0 8px 30px rgba(20, 32, 51, 0.08);
  --tms-shadow-strong: 0 18px 50px rgba(20, 32, 51, 0.12);
  --tms-space-1: 8px;
  --tms-space-2: 12px;
  --tms-space-3: 16px;
  --tms-space-4: 24px;
  --tms-space-5: 32px;
  --tms-font-header: 14px;
  --tms-font-body: 14px;
}
@media (min-width: 768px) {
  :root {
    --tms-font-header: 16px;
    --tms-font-body: 14px;
  }
}
@media (min-width: 1024px) {
  :root {
    --tms-font-header: 20px;
    --tms-font-body: 14px;
  }
}

* { box-sizing: border-box; }

body.tms-labour-theme,
body.login {
  color: var(--tms-text);
  background: var(--tms-gradient-soft);
}

.tms-surface-card {
  background: var(--tms-gradient-card);
  border: 1px solid var(--tms-border);
  border-radius: 14px;
  box-shadow: var(--tms-shadow-soft);
}

.tms-eyebrow {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--tms-primary);
}

.tms-heading-display {
  color: var(--tms-ink);
  letter-spacing: -0.03em;
  font-weight: 700;
}