/* ============================================================
   DESIGN: EDITORIAL — refined, light, airy, magazine-grade.
   Serif display, hairline rules, restrained color, generous
   whitespace. Great for tennis / golf / F1 / athletics.
   ============================================================ */

[data-design="editorial"]{
  --font-display:"Fraunces",Georgia,serif;
  --font-body:"Inter",system-ui,sans-serif;

  --bg:       hsl(var(--brand-h) 14% 98%);
  --bg-2:     hsl(var(--brand-h) 16% 95%);
  --surface:  #ffffff;
  --surface-2:hsl(var(--brand-h) 16% 97.5%);
  --surface-3:hsl(var(--brand-h) 14% 92%);

  --text:     hsl(var(--brand-h) 24% 13%);
  --text-dim: hsl(var(--brand-h) 10% 40%);
  --text-mute:hsl(var(--brand-h) 8% 56%);

  --border:        hsl(var(--brand-h) 16% 89%);
  --border-strong: hsl(var(--brand-h) 16% 78%);

  --brand:        hsl(var(--brand-h) var(--brand-s) 42%);
  --brand-2:      hsl(var(--accent-h) var(--accent-s) 46%);
  --brand-soft:   hsl(var(--brand-h) var(--brand-s) 46% / .10);
  --brand-contrast: var(--brand-ink);
  --accent:       hsl(var(--accent-h) var(--accent-s) 46%);
  --accent-soft:  hsl(var(--accent-h) var(--accent-s) 46% / .12);

  --radius:12px; --radius-sm:9px; --radius-lg:16px;

  --shadow-sm:0 1px 2px hsl(var(--brand-h) 20% 30% / .06);
  --shadow:0 18px 40px -30px hsl(var(--brand-h) 24% 24% / .28);
  --shadow-lg:0 30px 70px -44px hsl(var(--brand-h) 24% 22% / .32);
  --glow:0 0 0 1px var(--border);

  --grad-brand:linear-gradient(120deg, var(--brand), var(--accent));
  --theme-color:#ffffff;
}

[data-design="editorial"] body{ background:var(--bg); }
[data-design="editorial"] .app-root::before{
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(50vmax 30vmax at 100% 0, var(--brand-soft), transparent 55%),
    radial-gradient(46vmax 28vmax at 0 100%, var(--accent-soft), transparent 55%);
}

[data-design="editorial"] .display-title{ font-weight:600; letter-spacing:-.015em; }
[data-design="editorial"] h1,[data-design="editorial"] h2,[data-design="editorial"] h3{ font-weight:600; }
[data-design="editorial"] .eyebrow{ font-family:var(--font-body); }

[data-design="editorial"] .card,[data-design="editorial"] .panel,[data-design="editorial"] .match{
  background:var(--surface); border:1px solid var(--border);
}
[data-design="editorial"] .card:hover{ border-color:var(--border-strong); }

/* hairline accent on section heads */
[data-design="editorial"] .card__head{ position:relative; }
[data-design="editorial"] .nav__item.is-active{ color:var(--brand-text); box-shadow:inset 2px 0 0 var(--brand); background:var(--brand-soft); }
[data-design="editorial"] .btn--primary{ background:var(--brand); font-weight:600; }
[data-design="editorial"] .stat__value{ font-family:var(--font-display); color:var(--text); font-weight:600; }
[data-design="editorial"] .rank{ font-family:var(--font-display); font-weight:600; }
[data-design="editorial"] .sidebar__brand{ border-bottom:1px solid var(--border); }
[data-design="editorial"] .badge{ font-weight:600; letter-spacing:.02em; }
[data-design="editorial"] .podium__step{ border:1px solid var(--border); border-top:3px solid var(--brand); }