/* Tango High School Cup — Saison 6 flyer system (THSC-2026/flyer-back-draft).
   Fonts are self-hosted so the wheel works on venue Wi-Fi with no internet. */
@font-face { font-family: 'Big Shoulders Display'; src: url('/fonts/BigShouldersDisplay-Black.ttf') format('truetype'); font-weight: 900; font-display: block; }
@font-face { font-family: 'Archivo Expanded'; src: url('/fonts/ArchivoExpanded-Bold.ttf') format('truetype'); font-weight: 700; font-display: block; }
@font-face { font-family: 'Archivo Expanded'; src: url('/fonts/ArchivoExpanded-ExtraBold.ttf') format('truetype'); font-weight: 800; font-display: block; }
@font-face { font-family: 'Archivo Expanded'; src: url('/fonts/ArchivoExpanded-Black.ttf') format('truetype'); font-weight: 900; font-display: block; }

:root {
  --ink: #1a0b3d;
  --paper: #f4f2fb;
  --violet: #3b0f7a;
  --violet-2: #430d7c;   /* sponsor strip — matches sponsors.png background */
  --indigo: #2b3aa8;
  --blue: #1da1f2;
  --pink: #e0409a;
  --pink-deep: #9c1f66;  /* pressed-button edge */
  --line: rgba(255, 255, 255, .85);
  --line-soft: rgba(255, 255, 255, .35);

  --brand-bg:
    radial-gradient(60% 40% at 0% 55%, rgba(224, 64, 154, .35), transparent 70%),
    radial-gradient(70% 45% at 100% 10%, rgba(29, 161, 242, .45), transparent 70%),
    linear-gradient(170deg, var(--indigo) 0%, var(--violet) 45%, var(--violet-2) 100%);

  /* UI roles */
  --bg: var(--violet);
  --surface: rgba(255, 255, 255, .08);
  --border: var(--line-soft);
  --text: var(--paper);
  --muted: rgba(244, 242, 251, .75);
  --accent: var(--pink);
  --accent-ink: #ffffff;
  --danger: #ff6b8b;
  --ok: #4be3a5;
  --radius: 0;

  /* wheel */
  --rim: var(--paper);
  --seam: var(--ink);
  --stud: var(--ink);
  --hub: var(--ink);
  --hub-text: var(--paper);

  --font-display: 'Big Shoulders Display', 'Arial Narrow', sans-serif;
  --font: 'Archivo Expanded', 'Arial Black', Arial, sans-serif;
}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--font);
  font-weight: 700;
  -webkit-font-smoothing: antialiased;
}
button { font: inherit; cursor: pointer; }
input, select { font: inherit; color: inherit; }
[hidden] { display: none !important; }

/* Flyer top bar: "#THSC · BY GAMING:LX · SAISON 6 · 2026" */
.topbar {
  display: flex; justify-content: space-between; gap: 16px;
  font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
  padding-bottom: .6em; border-bottom: 2px solid var(--line);
}
/* Flyer chip: paper block, ink text, pink highlight */
.chip { display: inline-block; background: var(--paper); color: var(--ink); font-weight: 900; text-transform: uppercase; letter-spacing: .02em; padding: .35em .7em; }
.chip b { color: var(--pink); }

  /* FWRD Wheel × Tango lockup */
  .lockup { display: flex; flex-direction: column; align-items: flex-start; gap: .55em; }
  .lockup .fwrd { display: flex; align-items: center; gap: .45em; }
  .lockup .fwrd img { height: 1.6em; display: block; }
  .lockup .fwrd span { font-family: var(--font-display); font-weight: 900; text-transform: uppercase; font-size: 2em; line-height: 1; }
  .lockup .by { display: flex; align-items: center; gap: .6em; }
  .lockup .by small { font-size: .75em; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
  .lockup .by img { height: 2.1em; display: block; }

/* Top bar carrying the FWRD Wheel × Tango lockup */
.topbar.lockup { flex-direction: row; justify-content: space-between; align-items: center; letter-spacing: 0; text-transform: none; padding-bottom: .5em; }
.lockup .by small { font-size: .85em; color: var(--paper); }
.lockup .by img { height: 3em; }   /* Tango gets the larger mark */
.topbar.lockup { justify-content: center; }
.lockup .fwrd small { font-size: .85em; letter-spacing: .1em; text-transform: uppercase; color: var(--paper); margin: 0 .15em; }
