/**
 * LETZBOX design tokens — red / white / blue, light only.
 * Portfolio floor: no text below 11px (0.6875rem @ 16px base).
 * Fonts load from the <link> in index.html — no @import here.
 *
 * :root = LIGHT — white-dominant red/white/blue. No dark theme.
 *
 * The old --lb-gold* slots carry BLUE (there is NO gold);
 * blue is also the "success / verify" role.
 */

:root {
  /* ══ LIGHT (default) — white body, navy ink, RED accent, BLUE super-move ══
     White-dominant so the flag reads RED + WHITE + BLUE. Surfaces are solid
     white (no glass blur needed on white); the header is a navy bar. */

  /* RED — primary (action / brand) */
  --lb-accent: #d81f2a;
  --lb-accent-dark: #b0141f;
  --lb-accent-soft: rgba(216, 31, 42, 0.10);

  /* BLUE (carried in the old "gold" slots) — accents, links, verify/success */
  --lb-gold: #1d4e89;
  --lb-gold-soft: rgba(29, 78, 137, 0.12);
  --lb-gold-dark: #143a67;   /* pressed blue — borders on blue surfaces */
  --lb-gold-deep: #1d4e89;   /* meter stroke (non-text) */
  --lb-gold-ink: #164a86;    /* blue as TEXT on white (≥4.5:1 on #ffffff) */

  /* WHITE canvas */
  --lb-canvas: #f5f7fb;
  --lb-canvas-deep: #e9edf4;

  /* SOLID white surfaces — no blur on white */
  --lb-surface: #ffffff;
  --lb-surface-raised: #ffffff;
  --lb-glass-border: rgba(10, 27, 51, 0.12); /* card edge */
  --lb-glass-blur: 0px;                       /* backdrop-filter radius (none) */

  /* NAVY ink on white */
  --lb-chalk: #0a1b33;
  --lb-chalk-muted: #46536b;
  --lb-chalk-faint: #5a6478;
  --lb-chalk-hover: #0a1b33;
  --lb-ink-on-accent: #ffffff;
  --lb-ink-on-gold: #ffffff;
  --lb-ink-on-canvas: #0a1b33;

  --lb-border: rgba(10, 27, 51, 0.12);
  --lb-border-strong: rgba(10, 27, 51, 0.22);
  --lb-shadow: 0 4px 18px rgba(10, 27, 51, 0.10);
  --lb-shadow-lg: 0 12px 32px rgba(10, 27, 51, 0.16);
  --lb-shadow-soft: 0 2px 8px rgba(10, 27, 51, 0.07);
  --lb-line: rgba(10, 27, 51, 0.10);
  --lb-muted: #46536b;
  --lb-surface-2: #eef1f6;
  --lb-t-fast: var(--lb-duration) var(--lb-ease);
  --lb-danger: #d81f2a;
  --lb-danger-ink: #b0141f;
  --lb-danger-deep: #b0141f;
  --lb-success: #1d4e89;
  --lb-pass: #6b7686;
  --lb-leather: #46536b;     /* neutral fallback avatar block */
  --lb-link: #164a86;        /* blue links */

  /* Header + tab rail — NAVY bar on the white body (very red/white/blue) */
  --lb-header-bg: #0a1b33;
  --lb-header-ink: #ffffff;
  --lb-header-dim: rgba(255, 255, 255, 0.72);
  --lb-header-gold: #ff5a52; /* wordmark accent letter — bright red on navy */
  --lb-gold-on-chalk: #9fbde6; /* light-blue text on the navy bar */

  /* Native controls (selects / date & range pickers) follow the theme. */
  --lb-color-scheme: light;

  /* Deck action-bar coins — a solid disc that must read on the canvas. */
  --lb-coin: #ffffff;
  --lb-coin-border: rgba(10, 27, 51, 0.14);

  /* Typography — premium sports-tech (Inter banned by portfolio law) */
  --lb-font-display: 'Barlow Condensed', 'Arial Narrow', sans-serif;
  --lb-font-body: 'Manrope', 'Segoe UI', system-ui, sans-serif;
  --lb-font-stats: 'Barlow Semi Condensed', 'Arial Narrow', sans-serif;
  --lb-font-card: 'Bebas Neue', 'Barlow Condensed', 'Arial Narrow', sans-serif;

  /* 100% base follows user preference; max() keeps the 11px floor. */
  --lb-text-xs: max(0.6875rem, 11px);   /* 11px floor */
  --lb-text-sm: max(0.8125rem, 11px);   /* 13px */
  --lb-text-base: 1rem;      /* 16px */
  --lb-text-md: 1.0625rem;   /* 17px */
  --lb-text-lg: 1.25rem;     /* 20px */
  --lb-text-xl: 1.5rem;      /* 24px */
  --lb-text-2xl: 2rem;       /* 32px */
  --lb-text-3xl: 2.75rem;    /* 44px */

  --lb-leading-tight: 1.15;
  --lb-leading-normal: 1.45;
  --lb-tracking-display: 0.04em;
  --lb-tracking-stats: 0.06em;
  --lb-tracking-caps: 0.12em;
  --lb-tracking-card: 0.03em;

  /* Spacing */
  --lb-space-1: 0.25rem;
  --lb-space-2: 0.5rem;
  --lb-space-3: 0.75rem;
  --lb-space-4: 1rem;
  --lb-space-5: 1.25rem;
  --lb-space-6: 1.5rem;
  --lb-space-8: 2rem;
  --lb-space-10: 2.5rem;

  /* Radii */
  --lb-radius-sm: 4px;
  --lb-radius-md: 8px;
  --lb-radius-lg: 12px;
  --lb-radius-pill: 999px;

  /* Layout */
  --lb-header-h: 3.5rem;
  --lb-tabs-h: 4.25rem;
  --lb-max-w: 28rem;
  --lb-safe-bottom: env(safe-area-inset-bottom, 0px);
  --lb-safe-top: env(safe-area-inset-top, 0px);

  /* Motion — transitions only, no idle loops */
  --lb-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --lb-duration: 180ms;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  /* 100% respects browser font-size settings; the type scale above
     clamps its small steps so nothing lands under the 11px floor. */
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  color-scheme: light;
}

body {
  margin: 0;
  min-height: 100dvh;
  font-family: var(--lb-font-body);
  font-size: var(--lb-text-base);
  line-height: var(--lb-leading-normal);
  color: var(--lb-ink-on-canvas);
  background: var(--lb-canvas);
  -webkit-font-smoothing: antialiased;
}

h1,
h2,
h3,
.lb-display {
  font-family: var(--lb-font-display);
  font-weight: 700;
  line-height: var(--lb-leading-tight);
  letter-spacing: var(--lb-tracking-display);
  text-transform: uppercase;
  margin: 0;
}

.lb-stat,
.lb-caps {
  font-family: var(--lb-font-stats);
  letter-spacing: var(--lb-tracking-stats);
  text-transform: uppercase;
}

.lb-eyebrow {
  font-family: var(--lb-font-stats);
  font-size: var(--lb-text-xs);
  letter-spacing: var(--lb-tracking-caps);
  text-transform: uppercase;
  color: var(--lb-chalk-faint);
}

.lb-muted {
  color: var(--lb-chalk-muted);
}

.lb-accent-text {
  color: var(--lb-link);
}

.lb-gold-text {
  color: var(--lb-gold-ink);
}

/* Minimum font enforcement */
small,
.lb-fineprint,
.lb-label,
.lb-meta {
  font-size: max(var(--lb-text-xs), 11px);
}

a {
  color: var(--lb-link);
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--lb-accent);
  outline-offset: 2px;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ── Reduced motion: stills everywhere, no exceptions ───────── */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
