/* ==========================================================================
   Card Hall of Fame — Design Tokens
   Shared across all 5 sport sites. Only --accent is overridden per sport.
   ========================================================================== */

:root {
  /* Surfaces & text */
  --bg:          #0e0f13;
  --bg-panel:    #14161b;
  --bg-elevated: #191b21;
  --text:        #e8e6e1;
  --text-muted:  #9a968f;
  --text-dim:    #5a574f;
  --hairline:    rgba(232, 230, 225, 0.08);
  --hairline-strong: rgba(232, 230, 225, 0.16);

  /* Accent — overridden per sport in sport.css */
  --accent:        #c96f4a;
  --accent-ink:    #0e0f13;   /* text on accent */
  --accent-soft:   rgba(201, 111, 74, 0.12);

  /* Typography */
  --font-serif: "Fraunces", Georgia, "Times New Roman", serif;
  --font-sans:  "Inter", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --font-mono:  "JetBrains Mono", "DM Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Type scale */
  --fs-xs:   0.72rem;   /* 11.5px  mono labels */
  --fs-sm:   0.82rem;   /* 13px    small ui     */
  --fs-base: 1rem;      /* 16px    body         */
  --fs-md:   1.125rem;  /* 18px    body lead    */
  --fs-lg:   1.375rem;  /* 22px                 */
  --fs-xl:   1.875rem;  /* 30px                 */
  --fs-2xl:  2.75rem;   /* 44px                 */
  --fs-3xl:  4rem;      /* 64px                 */
  --fs-hero: clamp(2.75rem, 7.5vw, 6.75rem);

  /* Spacing scale */
  --s-1:   4px;
  --s-2:   8px;
  --s-3:   16px;
  --s-4:   24px;
  --s-5:   40px;
  --s-6:   64px;
  --s-7:   96px;
  --s-8:   160px;

  /* Radius */
  --r-card:   0;
  --r-button: 4px;
  --r-modal:  8px;

  /* Layout */
  --maxw:      1280px;
  --maxw-prose: 62ch;
  --gutter:    max(24px, 4vw);

  /* Motion */
  --ease:       cubic-bezier(0.22, 0.61, 0.36, 1);
  --dur-fast:   150ms;
  --dur:        260ms;
  --dur-slow:   520ms;

  /* Elevation */
  --shadow-card:   0 1px 0 rgba(0,0,0,0.4), 0 18px 40px -20px rgba(0,0,0,0.7);
  --shadow-modal:  0 24px 80px -12px rgba(0,0,0,0.8);
}
