/* tournament-home.css — the home page during a tournament (tournament_home.php,
   mockup layout C "Match night", 2026-10-24). Loaded by index.php only while
   there is one. Gold is the tournament colour (--gold); the claw mark rakes the
   gold words and the logo is never covered. */
.th{padding:22px 0 6px;--silver:#c9d1dc;--bronze:#d9965b;--tw:#9146ff}
.th-frame{background:var(--bg2);border:1px solid rgba(242,169,0,.3);border-radius:var(--radius);padding:28px;display:grid;gap:24px}

/* Head: kicker, title, clock */
.th-head{display:flex;align-items:center;gap:24px}
.th-head-t{flex:1;min-width:0;display:grid;gap:10px}
.th-kick{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px}
.th-pill{display:inline-flex;align-items:center;gap:6px;font-size:.74rem;font-weight:800;letter-spacing:.08em;border-radius:999px;padding:4px 11px}
.th-pill i{width:7px;height:7px;border-radius:50%;background:currentColor}
.th-pill-live{color:#ff8a95;background:rgba(224,82,96,.16)}
.th-pill-live i{background:#ff5d6c;animation:th-pulse 1.6s ease-in-out infinite}
.th-pill-gold{color:var(--gold);background:rgba(242,169,0,.15)}
@keyframes th-pulse{50%{opacity:.35}}
.th-meta{font-size:.82rem;font-weight:600;color:var(--fg2)}
.th-title{margin:0;font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-weight:800;font-size:clamp(2.5rem,5vw,4rem);line-height:.95;
  letter-spacing:.01em;text-transform:uppercase;text-wrap:balance;overflow-wrap:anywhere}
.th-gold{position:relative;color:var(--gold)}
.th-claw{position:absolute;left:.15em;top:-.12em;width:.9em;height:1.3em;transform:rotate(16deg);opacity:.8;pointer-events:none;overflow:visible;
  filter:drop-shadow(0 0 6px rgba(242,169,0,.45))}
.th-claw .rip{fill:var(--gold)}
.th-claw .gouge{fill:#1a1204;opacity:.75}
.th-claw .lit{fill:#fff3cf;opacity:.85}
.th-clock{flex-shrink:0;background:var(--bg3);border:1px solid var(--border);border-radius:12px;padding:14px 22px;text-align:center}
.th-clock b{display:block;font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-weight:800;font-size:3.6rem;line-height:1;font-variant-numeric:tabular-nums}
.th-clock span{display:block;margin-top:5px;font-size:.7rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.th-clock-gold{border-color:rgba(242,169,0,.3)}
.th-clock-gold b{color:var(--gold)}

/* Podium: 2nd · 1st · 3rd, the winner standing tallest */
.th-podium{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:end}
.th-pc{background:var(--bg3);border:1px solid var(--border);border-radius:14px;padding:20px;display:flex;flex-direction:column;gap:8px;min-width:0;box-sizing:border-box}
.th-p1{min-height:290px;border-color:rgba(242,169,0,.55)}
.th-p2{min-height:250px;border-color:rgba(201,209,220,.3)}
.th-p3{min-height:230px;border-color:rgba(217,150,91,.3)}
.th-prov .th-pc{border-style:dashed}
.th-pc-top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.th-pc-place{font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-weight:800;font-size:1.25rem;letter-spacing:.04em}
.th-p1 .th-pc-place,.th-p1 .th-pc-pts b{color:var(--gold)}
.th-p2 .th-pc-place,.th-p2 .th-pc-pts b{color:var(--silver)}
.th-p3 .th-pc-place,.th-p3 .th-pc-pts b{color:var(--bronze)}
.th-pc-team{font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-weight:800;font-size:1.9rem;line-height:1;text-transform:uppercase;overflow-wrap:anywhere}
.th-pc-pts{display:flex;align-items:baseline;gap:6px}
.th-pc-pts b{font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-size:3.6rem;line-height:1;font-variant-numeric:tabular-nums}
.th-pc-pts span{font-size:.8rem;font-weight:700;color:var(--muted)}
.th-pc-meta{font-size:.82rem;color:var(--fg2)}
.th-pc-who{font-size:.75rem;color:var(--muted);overflow-wrap:anywhere}
.th-pc-none{opacity:.7}
.th-pc-none .th-pc-team{font-size:1.3rem;color:var(--muted)}
.th-tag{font-size:.66rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--fg2);border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:2px 8px}
.th-mv{font-size:.74rem;font-weight:800;white-space:nowrap}
.th-up{color:var(--green)}
.th-down{color:#ff8a95}

/* Stream + the side panels */
.th-row{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:22px;align-items:start}
.th-side{display:grid;gap:16px;min-width:0}
.th-panel{background:var(--bg3);border:1px solid var(--border);border-radius:12px;padding:14px 16px;min-width:0}
.th-panel-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding-bottom:6px}
.th-panel-h h3{margin:0;font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-weight:800;font-size:1.25rem;letter-spacing:.02em;text-transform:uppercase}
.th-panel-h span{font-size:.74rem;color:var(--muted);white-space:nowrap}
.th-cr{display:flex;align-items:center;gap:10px;padding:8px 2px;border-top:1px solid rgba(255,255,255,.05)}
.th-cr-rk{width:22px;font-size:.82rem;font-weight:900;color:var(--muted)}
.th-cr-team{flex:1;min-width:0;font-size:.9rem;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.th-cr-g{font-size:.74rem;color:var(--muted)}
.th-cr b{width:32px;text-align:right;font-variant-numeric:tabular-nums}
.th-latest{display:grid;gap:9px}
[data-th-latest]{display:grid;gap:8px}
.th-k{font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.th-k-gold{color:var(--gold)}
.th-ln{display:block;font-size:.84rem;color:var(--fg2);line-height:1.45}
.th-ln b{color:var(--fg)}
.th-ln em{font-style:normal;font-weight:700;color:var(--gold)}
.th-empty{display:block;margin:0;font-size:.82rem;color:var(--muted);line-height:1.45}

.th-watch{display:grid;gap:12px;min-width:0}
.th-stream{position:relative;display:block;aspect-ratio:16/9;background:#0e0e10;border:1px solid rgba(255,255,255,.08);border-radius:12px;overflow:hidden;color:inherit;text-decoration:none}
.th-stream img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55}
.th-stream-top{position:absolute;top:14px;left:14px;display:flex;gap:8px}
.th-live{font-size:.68rem;font-weight:800;letter-spacing:.06em;color:#fff;background:#e0263c;border-radius:4px;padding:3px 7px}
.th-viewers{font-size:.74rem;font-weight:700;color:var(--fg);background:rgba(0,0,0,.6);border-radius:4px;padding:3px 7px}
.th-play{position:absolute;inset:0;display:grid;place-items:center}
.th-play svg{width:70px;height:70px}
.th-play circle{fill:rgba(145,70,255,.9);transition:fill .15s}
.th-play path{fill:#fff}
.th-stream:hover .th-play circle,.th-stream:focus-visible .th-play circle{fill:var(--tw)}
.th-stream-bar{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;gap:10px;padding:12px 14px;background:rgba(0,0,0,.62)}
.th-av{width:32px;height:32px;flex-shrink:0;border-radius:50%;background:#2a3550;display:grid;place-items:center;font-size:.72rem;font-weight:800;color:var(--fg)}
.th-stream-who{display:grid;gap:1px;min-width:0}
.th-stream-who b{font-size:.9rem}
.th-stream-who small{font-size:.74rem;color:var(--fg2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.th-stream-cta{margin-left:auto;font-size:.78rem;font-weight:700;color:#c9a7ff;white-space:nowrap}
.th-player{position:relative;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:#0e0e10}
.th-player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.th-chips{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.th-chip{display:inline-flex;align-items:center;gap:8px;min-height:36px;box-sizing:border-box;padding:4px 12px 4px 4px;border-radius:999px;
  background:rgba(255,255,255,.04);border:1px solid var(--border);font-size:.82rem;font-weight:700;color:var(--fg);text-decoration:none}
.th-chip:hover{border-color:rgba(145,70,255,.5)}
.th-chip .th-av{width:28px;height:28px;font-size:.64rem}
.th-chip i{width:7px;height:7px;border-radius:50%;background:#ff5d6c}

.th-nums-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.th-nums-grid b{display:block;font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-weight:800;font-size:2.3rem;line-height:1;font-variant-numeric:tabular-nums}
.th-nums-grid span{font-size:.74rem;color:var(--muted)}
.th-dispute p,.th-rules p{margin:0 0 12px;font-size:.88rem;color:var(--fg2);line-height:1.5}
.th-rules p:last-child{margin-bottom:0}
.th-sq{display:flex;flex-wrap:wrap;gap:6px}
.th-sq span{font-size:.8rem;font-weight:700;background:rgba(255,255,255,.05);border:1px solid var(--border);border-radius:999px;padding:4px 10px}
.th-sq .th-more{color:var(--muted)}

/* Buttons */
.th-ctas{display:flex;flex-wrap:wrap;gap:12px}
.th-btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;box-sizing:border-box;padding:0 20px;border-radius:10px;
  font-weight:800;font-size:.95rem;text-decoration:none;white-space:nowrap}
.th-btn-gold{background:var(--gold);color:#1a1204;border:0}
.th-btn-gold:hover{filter:brightness(1.08);color:#1a1204}
.th-btn-ghost{background:transparent;border:1px solid rgba(50,167,235,.5);color:var(--brand);font-weight:700}
.th-btn-ghost:hover{border-color:var(--brand)}
.th-btn-sm{min-height:40px;padding:0 14px;font-size:.85rem}

/* Sign-up open: the banner under the search */
.th-banner-wrap{padding-top:18px}
.th-banner{display:flex;align-items:center;gap:20px;background:var(--bg2);border:1px solid rgba(242,169,0,.35);border-radius:14px;padding:16px 20px}
.th-trophy{width:52px;height:52px;flex-shrink:0;border-radius:12px;background:rgba(242,169,0,.14);display:grid;place-items:center}
.th-trophy svg{width:28px;height:28px;fill:none;stroke:var(--gold);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.th-banner-t{flex:1;min-width:0;display:grid;gap:3px}
.th-banner-t b{font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-weight:800;font-size:1.6rem;line-height:1;text-transform:uppercase}
.th-banner-t b span{color:var(--gold)}
.th-banner-t > span{font-size:.86rem;color:var(--fg2)}
.th-banner-fill{width:170px;display:grid;gap:6px;font-size:.78rem;color:var(--fg2)}
.th-banner-fill b{color:var(--fg)}
.th-bar{display:block;height:8px;border-radius:4px;background:rgba(255,255,255,.08);overflow:hidden}
.th-bar i{display:block;height:100%;border-radius:4px;background:var(--gold)}
.th-banner-clock{text-align:center;min-width:120px}
.th-banner-clock b{display:block;font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-weight:800;font-size:1.9rem;line-height:1;font-variant-numeric:tabular-nums}
.th-banner-clock span{font-size:.66rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.th-banner-ctas{display:flex;gap:10px}
.th-banner .th-btn{min-height:44px;padding:0 16px;font-size:.88rem}

/* Showcase slides: sign-up open, champions. "a.sc-w" (index.css) makes the card a
   block, so these name it too; the tournament slides' title accent is gold, not cyan. */
#sc-tournament .sc-title .ac,#sc-champions .sc-title .ac{color:var(--gold)}
a.sc-w.th-sv{display:grid;gap:10px;align-content:center;background:var(--bg3);border:1px solid rgba(242,169,0,.35);border-radius:14px;padding:24px;color:inherit;text-decoration:none;min-height:260px;box-sizing:border-box}
.th-sv-clock{font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-weight:800;font-size:3.6rem;line-height:1;font-variant-numeric:tabular-nums}
.th-sv-l{font-size:.74rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
a.sc-w.th-champ{position:relative;overflow:hidden;display:grid;gap:12px;align-content:center;min-height:300px;box-sizing:border-box;padding:28px 160px 28px 28px;border-radius:14px;
  border:1px solid rgba(242,169,0,.4);color:inherit;text-decoration:none;background-color:#120e07;
  background-image:linear-gradient(rgba(242,169,0,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(242,169,0,.06) 1px,transparent 1px);background-size:44px 44px}
.th-champ-k{font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-weight:700;font-size:.95rem;letter-spacing:.1em;text-transform:uppercase;color:#e6c27a}
.th-champ-name{font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-weight:800;font-size:clamp(2.6rem,5.5vw,4.4rem);line-height:.9;text-transform:uppercase;color:var(--gold);overflow-wrap:anywhere}
.th-champ-name > span{position:relative}
.th-champ-mark{position:absolute;right:24px;top:24px;width:112px;height:112px;border-radius:22%;filter:drop-shadow(0 6px 22px rgba(0,0,0,.55)) drop-shadow(0 0 18px rgba(242,169,0,.25))}
.th-champ-bars{display:flex;align-items:flex-end;gap:6px;margin-top:6px}
.th-cb{width:112px;max-width:32%;border-radius:6px 6px 0 0;padding:6px 8px;box-sizing:border-box;display:grid;align-content:start;color:#120e07}
.th-cb b{font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-size:1rem;line-height:1}
.th-cb small{font-size:.7rem;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.th-cb1{height:76px;background:var(--gold)}
.th-cb2{height:56px;background:#c9d1dc}
.th-cb3{height:44px;background:#d9965b}

@media (max-width:1100px){
  .th-banner{flex-wrap:wrap}
  .th-banner-t{flex:1 1 320px}
  .th-banner-ctas{flex-basis:100%}
}
@media (max-width:860px){
  .th-row{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:640px){
  .th{padding-top:16px}
  .th-frame{padding:18px;gap:16px}
  .th-head{flex-direction:column;align-items:stretch;gap:14px}
  .th-title{font-size:2.5rem}
  .th-clock{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;text-align:right}
  .th-clock b{font-size:2.6rem}
  .th-clock span{margin:0;max-width:52%}
  /* 1st across the top, 2nd and 3rd side by side under it */
  .th-podium{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .th-p1{grid-column:1 / -1;order:-1;min-height:0}
  .th-p2,.th-p3{min-height:0;padding:12px;gap:4px}
  .th-p2 .th-pc-team,.th-p3 .th-pc-team{font-size:1.2rem}
  .th-p2 .th-pc-pts b,.th-p3 .th-pc-pts b{font-size:2.3rem}
  .th-p2 .th-pc-who,.th-p3 .th-pc-who{display:none}
  .th-nums-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .th-ctas .th-btn{flex:1 1 100%}
  .th-banner{gap:12px;padding:14px}
  .th-trophy{width:44px;height:44px}
  .th-banner-t b{font-size:1.35rem}
  .th-banner-fill{flex:1;width:auto}
  .th-banner-ctas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  a.sc-w.th-champ{padding:22px 20px 20px;min-height:0}
  .th-champ-mark{width:64px;height:64px;right:16px;top:16px}
  .th-champ-k{padding-right:70px}
}
@media (prefers-reduced-motion:reduce){.th-pill-live i{animation:none}}
