/* tourney.css — tournaments (tournament.html) on the v2 house style, per the approved _tournament-v2 preview: the match
   call, the next event with its countdown and registration, the Championship and the race for its seats, the bracket,
   who's in, the schedule, how a Blitz works, prizes and the hall of champions. Phone-first, upright and sideways. */

.tour { max-width: 1320px; margin: 0 auto; padding: 4px var(--pad) 48px; display: grid; grid-template-columns: minmax(0, 1fr);
  gap: clamp(30px, 5vh, 54px); overflow-x: clip; }
.tour [hidden] { display: none !important; }
.tour .v2-card:not(a):not(button):hover { transform: none; }
.tour .v2-btn[disabled], .tour .v2-btn-glass[disabled] { opacity: .45; pointer-events: none; }
.sec-head { display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; margin-bottom: 16px; }
.note { margin: 0; max-width: 520px; line-height: 1.45; }
.err { margin: 0; font-size: 13.5px; color: var(--bad); }
.empty { padding: 18px; border-radius: 18px; text-align: center; font-size: 14px; color: var(--muted); background: rgba(255,255,255,.04);
  border: 1px dashed rgba(255,255,255,.14); grid-column: 1 / -1; }

/* ── the call ── */
.call { position: sticky; top: 10px; z-index: 45; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px 16px;
  padding: 14px 16px 14px 20px; border-radius: 22px; background: linear-gradient(180deg, rgba(58,40,18,.97), rgba(26,19,10,.98));
  border: 1px solid color-mix(in srgb, var(--hi) 55%, transparent);
  box-shadow: 0 18px 50px rgba(0,0,0,.55), 0 0 44px color-mix(in srgb, var(--c) 30%, transparent); animation: tPop .4s var(--ease); }
.call-copy { display: grid; gap: 3px; min-width: 0; }
.call-copy b { font: 900 clamp(18px, 2vw, 24px)/1.1 var(--display); letter-spacing: .03em; color: var(--hi); }
.call-copy span { font-size: 13.5px; color: var(--ink-2); }
@keyframes tPop { from { opacity: 0; transform: translateY(-8px) scale(.98); } }

/* ── the next event ── */
.next { position: relative; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); align-items: center;
  gap: clamp(18px, 3vw, 48px); padding: clamp(22px, 4vw, 48px); border-radius: 32px; border: 1px solid var(--hair);
  background: radial-gradient(70% 90% at 80% 50%, color-mix(in srgb, var(--c) 30%, transparent), transparent 62%), linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.02)); }
.next-copy { display: grid; gap: 14px; justify-items: start; min-width: 0; }
.next h1 { margin: 0; font: 900 clamp(38px, 6vw, 84px)/.95 var(--display); letter-spacing: .02em;
  background: linear-gradient(180deg, #fff 8%, var(--hi) 55%, color-mix(in srgb, var(--c) 85%, #000)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.when { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.count { font-size: clamp(32px, 4vw, 52px); font-weight: 800; letter-spacing: -.02em; line-height: 1; }
.live-pill { display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 14px; border-radius: 999px; font-size: 14px; font-weight: 700;
  color: #ffb4a8; background: rgba(255,74,74,.12); border: 1px solid rgba(255,90,74,.4); align-self: center; }
.dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #ff4a4a; box-shadow: 0 0 10px #ff4a4a; animation: v2pulse 2.2s infinite; }
.facts { display: flex; flex-wrap: wrap; gap: 8px; }
.facts span { display: inline-flex; align-items: center; height: 30px; padding: 0 12px; border-radius: 999px; font-size: 12.5px; font-weight: 600;
  background: rgba(255,255,255,.07); border: 1px solid var(--hair); white-space: nowrap; }
.seats { width: min(420px, 100%); display: grid; gap: 6px; }
.seats .row { display: flex; justify-content: space-between; gap: 10px; font-size: 13px; color: var(--ink-2); }
.seats .full { color: var(--warn); font-weight: 700; }
.acts-wrap { display: grid; gap: 12px; width: min(480px, 100%); }
.cta { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.reg-ok { display: grid; gap: 6px; padding: 14px 16px; border-radius: 18px; font-size: 14px; line-height: 1.45;
  background: rgba(126,226,168,.1); border: 1px solid rgba(126,226,168,.3); }
.reg-ok b { color: var(--ok); }
.crown-line { margin: 0; font-size: 16px; }
.crown-line a { color: var(--hi); font-weight: 800; }
.deckpick { display: grid; gap: 6px; width: 100%; }
.deckpick label { font-size: 12.5px; font-weight: 650; color: var(--muted); }
.deckpick select { width: 100%; height: 46px; padding: 0 14px; border-radius: 14px; font: inherit; font-size: 15px; color: var(--ink);
  background: rgba(0,0,0,.38); border: 1px solid var(--hair); }
.deckpick select:focus-visible { outline: 2px solid var(--hi); outline-offset: 2px; }
.deckpick option { background: #17140f; color: var(--ink); }
.deckpick small { font-size: 12.5px; line-height: 1.4; color: var(--muted); }
.trophy { position: relative; height: clamp(240px, 34vw, 380px); display: grid; place-items: center; }
.trophy .cup { position: relative; width: clamp(150px, 16vw, 220px); aspect-ratio: 1; display: grid; place-items: center; }
.trophy .halo { position: absolute; inset: -18%; border-radius: 50%; filter: blur(22px); opacity: .7; animation: tSpin 20s linear infinite;
  background: conic-gradient(transparent 0 20%, color-mix(in srgb, var(--c) 70%, transparent) 30%, transparent 42% 70%, color-mix(in srgb, var(--hi) 55%, transparent) 80%, transparent 92%); }
.trophy .coin { position: relative; width: 70%; filter: drop-shadow(0 0 40px color-mix(in srgb, var(--c) 70%, transparent)) drop-shadow(0 24px 30px rgba(0,0,0,.6));
  animation: v2float 6s ease-in-out infinite; }
.trophy .fan { position: absolute; inset: 0; pointer-events: none; }
.trophy .fan img { position: absolute; top: 50%; left: 50%; width: 30%; aspect-ratio: 813 / 1185; object-fit: cover; border-radius: 6px;
  filter: drop-shadow(0 16px 24px rgba(0,0,0,.55)); }
.trophy .fan img:nth-child(1) { transform: translate(-150%, -40%) rotate(-16deg); }
.trophy .fan img:nth-child(2) { transform: translate(50%, -40%) rotate(16deg); }
@keyframes tSpin { to { transform: rotate(360deg); } }

/* ── the Championship ── */
.champ-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 16px; align-items: start; }
.champ-grid.solo { grid-template-columns: minmax(0, 1fr); }
.champ-card { display: grid; gap: 14px; padding: clamp(18px, 3vw, 28px); align-content: start; }
.champ-card p { margin: 0; font-size: 14px; line-height: 1.5; color: var(--ink-2); }
.cd { display: flex; flex-wrap: wrap; gap: 8px; }
.cd div { display: grid; justify-items: center; min-width: 64px; padding: 9px 8px 7px; border-radius: 14px; background: rgba(0,0,0,.32); border: 1px solid var(--hair); }
.cd b { font-size: 26px; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; }
.cd small { margin-top: 4px; font-size: 11px; color: var(--muted); }
.pool { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 12px; }
.pool b { font: 900 clamp(30px, 4vw, 46px)/1 var(--display); color: var(--hi); }
.split { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.split div { display: grid; justify-items: center; gap: 4px; padding: 10px 4px; border-radius: 14px; background: rgba(255,255,255,.05); }
.split img { width: 28px; height: 28px; }
.split .n { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; font-size: 12px; font-weight: 800; background: rgba(255,255,255,.1); }
.split b { font-size: 18px; }
.rule-line { padding: 10px 12px; border-radius: 14px; font-size: 13.5px; line-height: 1.45; background: rgba(255,255,255,.05); border: 1px solid var(--hair); }
.warnbox { padding: 10px 12px; border-radius: 14px; font-size: 13.5px; line-height: 1.45; color: #ffdcae; background: rgba(255,179,92,.1); border: 1px solid rgba(255,179,92,.35); }
.road { display: grid; gap: 4px; padding: 16px; align-content: start; }
.road h3 { margin: 2px 6px 0; }
.road > .v2-meta { margin: 0 6px 8px; }
.rrow { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 7px 8px; border-radius: 12px; font-size: 14px; }
.rrow.seat { background: rgba(255,255,255,.05); }
.rrow.you { box-shadow: inset 0 0 0 1.5px var(--hi); }
.rrow .rk { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; font-size: 12px; font-weight: 800; background: rgba(255,255,255,.08); }
.rrow.seat .rk { color: #160f03; background: var(--hi); }
.rrow a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.rrow b { font-size: 13px; font-variant-numeric: tabular-nums; }
.cut { margin: 4px 8px; padding-top: 6px; font-size: 12px; color: var(--muted); border-top: 1px dashed rgba(255,255,255,.18); }
.road .v2-btn-ghost { justify-self: start; margin-top: 6px; }

/* ── the bracket ── */
.bracketwrap { padding: clamp(14px, 2vw, 22px); border-radius: 26px; background: rgba(18,16,14,.55); border: 1px solid var(--hair); min-width: 0; }
.bstats { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 0 0 12px; font-size: 13px; color: var(--muted); }
.bstats .livec { display: inline-flex; align-items: center; gap: 7px; color: #ff9a8c; font-weight: 700; }
.rounds-seg { display: none; margin-bottom: 12px; }
.bracket { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(200px, 1fr); gap: 14px; overflow-x: auto; padding-bottom: 6px; }
.round { display: grid; gap: 10px; align-content: space-around; min-width: 0; }
.round h4 { margin: 0 0 2px; font-size: 12px; font-weight: 700; color: var(--muted); }
.m { display: grid; gap: 2px; padding: 6px; border-radius: 14px; background: rgba(255,255,255,.04); border: 1px solid transparent; }
.m.live { border-color: rgba(255,90,74,.45); }
.m.mine { border-color: color-mix(in srgb, var(--hi) 55%, transparent); background: color-mix(in srgb, var(--c) 12%, transparent); }
.p { display: grid; grid-template-columns: 24px minmax(0, 1fr) 18px; align-items: center; gap: 8px; padding: 4px 6px; border-radius: 9px; font-size: 13.5px; }
.seed { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; font-size: 11px; font-weight: 800; color: var(--muted); background: rgba(255,255,255,.08); }
.p .nm { display: flex; align-items: baseline; gap: 6px; min-width: 0; }
.p .nm > a, .p .nm > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.p em, .ent em { font-style: normal; font-size: 11px; font-weight: 700; color: var(--hi); }
.p .rec { font-size: 11px; font-weight: 600; color: var(--muted); }
.p.win .nm > a, .p.win .nm > span { font-weight: 700; color: var(--ink); }
.p.lose { color: var(--faint); }
.p.lose .seed { opacity: .6; }
.p.tbd .nm, .p.bye .nm { color: var(--faint); }
.p b svg { width: 16px; height: 16px; fill: none; stroke: var(--ok); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.m .foot { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 2px 6px 0; font-size: 11.5px; color: var(--muted); }
.m .foot > span { display: inline-flex; align-items: center; gap: 6px; }
.m .foot a { font-weight: 700; color: #ff9a8c; }
.crowned { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 14px; margin-top: 14px; padding: 14px 16px; border-radius: 18px;
  background: radial-gradient(90% 140% at 0% 50%, rgba(255,204,77,.18), transparent 70%), rgba(255,255,255,.03); border: 1px solid rgba(255,204,77,.38); }
.crowned img { width: 44px; height: 44px; }
.crowned .who { display: grid; gap: 2px; min-width: 0; }
.crowned b { font: 900 clamp(18px, 2vw, 24px)/1.1 var(--display); color: #ffe6a3; }
.crowned b a { color: inherit; }
.crowned .v2-meta a { color: var(--ink-2); font-weight: 600; }

/* ── who's in ── */
.ents { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 8px; }
.ent { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 10px; padding: 9px 12px; border-radius: 14px;
  background: rgba(255,255,255,.05); border: 1px solid var(--hair); min-width: 0; }
.ent.you { border-color: color-mix(in srgb, var(--hi) 55%, transparent); background: color-mix(in srgb, var(--c) 14%, transparent); }
.ent .seed { width: 30px; height: 30px; font-size: 12px; }
.ent .who { display: grid; min-width: 0; font-size: 14px; }
.ent .who > span:first-child, .ent .who a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 650; }
.ent small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; color: var(--muted); }

/* ── schedule ── */
.sched { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.ev { display: grid; gap: 7px; align-content: start; padding: 16px; text-align: left; min-width: 0; font: inherit; color: inherit; }
.ev .day { font-size: 12.5px; font-weight: 700; color: var(--muted); }
.ev b { font-size: 16px; }
.ev small { font-size: 12.5px; line-height: 1.4; color: var(--ink-2); }
.ev .tag { justify-self: start; padding: 3px 10px; border-radius: 999px; font-size: 11px; font-weight: 700; color: #160f03; background: var(--tc, var(--hi)); }
.ev.on { box-shadow: inset 0 0 0 1.5px var(--hi); }
.ev.done { opacity: .78; }
.majors-h { margin: 22px 0 10px; }
.majors { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.major { position: relative; overflow: hidden; display: grid; gap: 4px; padding: 14px; border-radius: 18px; background: rgba(255,255,255,.04); border: 1px solid var(--hair); min-width: 0; }
.major .bg { position: absolute; inset: 0; opacity: .18; }
.major .bg img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 25%; }
.major > :not(.bg) { position: relative; }
.major small { font-size: 11.5px; color: var(--muted); }
.major b { font: 900 15px/1.15 var(--display); letter-spacing: .05em; color: var(--mc); }

/* ── how a Blitz works ── */
.how { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 16px; align-items: start; }
.rules { margin: 0; padding: 18px; display: grid; gap: 14px; list-style: none; counter-reset: rule; }
.rules li { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 12px; align-items: start; font-size: 14px; line-height: 1.5; color: var(--ink-2); counter-increment: rule; }
.rules li::before { content: counter(rule); width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; font-size: 12px; font-weight: 800;
  color: var(--hi); background: rgba(255,255,255,.08); }
.rules b { color: var(--ink); }
.formats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.fmt { display: grid; gap: 10px; padding: 18px; align-content: start; }
.fmt .pic { display: block; height: 90px; margin: -18px -18px 4px; overflow: hidden; }
.fmt .pic img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 28%; filter: saturate(1.15); }
.fmt p { margin: 0; font-size: 14px; line-height: 1.45; color: var(--ink-2); }
.fmt.on { box-shadow: inset 0 0 0 1.5px var(--hi); }
.fmt .tag { justify-self: start; padding: 3px 10px; border-radius: 999px; font-size: 11px; font-weight: 700; color: #160f03; background: var(--hi); }

/* ── prizes ── */
.ladder { display: grid; gap: 4px; padding: 14px; max-width: 760px; }
.lrow { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 8px; border-radius: 12px; }
.lrow:nth-child(-n+3) { background: rgba(255,255,255,.05); }
.lrow .ic img { width: 30px; height: 30px; display: block; }
.lrow .n { display: block; width: 10px; height: 10px; margin: 0 auto; border-radius: 50%; background: rgba(255,255,255,.18); }
.lrow small.packs { display: block; font-size: 12px; color: var(--hi); }
.lrow small.packs.off { color: var(--faint); }
.lrow > b { font-variant-numeric: tabular-nums; white-space: nowrap; }

/* ── hall of champions ── */
.hall { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.hof { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 12px; }
.hof.on { box-shadow: inset 0 0 0 1.5px var(--hi); }
.hof .av { position: relative; width: 52px; height: 52px; }
.hof .av img:first-child { width: 52px; height: 52px; border-radius: 50%; object-fit: cover; object-position: 50% 26%; box-shadow: 0 0 0 2px #ffcc4d, 0 0 16px rgba(255,204,77,.5); }
.hof .av .crown { position: absolute; right: -6px; bottom: -6px; width: 24px; height: 24px; }
.hof .who { display: grid; gap: 1px; min-width: 0; }
.hof .who b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; }
.hof .who small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; color: var(--muted); }

@media (max-width: 1000px) {
  .champ-grid, .how { grid-template-columns: minmax(0, 1fr); }
  .majors { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .next { grid-template-columns: minmax(0, 1fr); }
  .trophy { order: -1; height: 118px; margin-bottom: -6px; }
  .trophy .cup { width: 92px; }
  .acts-wrap { width: 100%; }
  .rounds-seg { display: grid; grid-auto-columns: minmax(64px, 1fr); overflow-x: auto; }
  .bracket { grid-auto-flow: row; grid-auto-columns: auto; grid-template-columns: minmax(0, 1fr); overflow: visible; }
  .round { display: none; }
  .round.show { display: grid; }
  .round h4 { display: none; }
  .formats { grid-template-columns: minmax(0, 1fr); }
  .fmt { grid-template-columns: 96px minmax(0, 1fr); column-gap: 14px; }
  .fmt .pic { grid-row: span 3; height: auto; min-height: 96px; margin: -18px 0 -18px -18px; }
  .cd div { min-width: 56px; }
}
@media (max-width: 420px) {
  .facts span:nth-child(n+4) { display: none; } /* the clock and the free entry are in "How a Blitz works" */
  .deckpick small { display: none; } /* keeps Register above the chat bar; the server names any deck problem on submit */
  .call { flex-wrap: nowrap; padding: 10px 10px 10px 14px; }
  .call-copy span { display: none; } /* the ready-up screen shows the 30-second clock */
  .call-copy b { font-size: 16px; }
  .call .v2-btn { flex: none; min-height: 44px; padding: 0 16px; }
  .sched { grid-template-columns: minmax(0, 1fr); }
  .hof { grid-template-columns: 52px minmax(0, 1fr); }
  .hof > .v2-btn-ghost { grid-column: 2; justify-self: start; padding-left: 0; }
}
@media (orientation: landscape) and (max-height: 500px) {
  .next { grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); padding: 18px 22px; }
  .trophy { order: 0; height: 58vh; }
  .next h1 { font-size: 40px; }
  .count { font-size: 30px; }
  .next-copy { gap: 10px; }
  .v2-btn.lg { min-height: 48px; padding: 0 26px; font-size: 16px; }
  .champ-grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); }
  .champ-grid.solo { grid-template-columns: minmax(0, 1fr); }
  .how { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); }
  .majors { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .formats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fmt { grid-template-columns: minmax(0, 1fr); }
  .fmt .pic { grid-row: auto; height: 64px; min-height: 0; margin: -18px -18px 4px; }
  .call { top: 6px; padding: 10px 12px 10px 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .trophy .halo, .trophy .coin, .dot { animation: none; }
  .call { animation: none; }
}