/* Clash Arena tournament page: hero, next step, tabs, matches, bracket, match window and management.
   Presentation only. Builds on the Arena V2 design tokens (v2/tokens.css) and the V2 tournament skin (pages/cups.css):
   page backdrop from arena-theme.css, forged stone panels, plate tabs, green action buttons, ally blue vs foe red. */
[data-custom-cups] {
  --t-ink: rgba(0, 0, 0, 0.35);
  --t-panel: var(--v2-mat-panel, linear-gradient(180deg, rgba(46, 36, 27, 0.92), rgba(24, 19, 15, 0.94)));
  --t-panel-raised: var(--v2-mat-stone, linear-gradient(180deg, #2a2119, #16110d));
  --t-inset: rgba(0, 0, 0, 0.32);
  --t-edge: var(--v2-stone-edge, #4a3b2d);
  --t-edge-strong: rgba(242, 195, 95, 0.45);
  --t-gold: var(--v2-gold, #f2c35f);
  --t-gold-soft: var(--v2-gold-hi, #ffe7a8);
  --t-wood: var(--v2-gold-lo, #b07a28);
  --t-ally: var(--v2-ally, #5bb8ff);
  --t-foe: var(--v2-foe, #ff5a4a);
  --t-go: var(--v2-go, #7ccc3c);
  --t-red: var(--v2-danger, #e0483e);
  --t-red-soft: var(--v2-danger-hi, #ff7d6e);
  --t-copy: var(--v2-text, #f6ecd9);
  --t-muted: var(--v2-text-2, #cdbb9f);
  --t-display: var(--v2-display, "V2 Clash", system-ui, sans-serif);
  --t-text: var(--v2-body, Inter, system-ui, sans-serif);
  --t-radius: var(--v2-r-lg, 26px);
  --t-shadow: var(--v2-shadow-1, 0 10px 30px rgba(0, 0, 0, 0.35));
}
[data-custom-cups] .cup-t {
  width: min(1240px, 100%);
  margin: 0 auto;
  min-width: 0;
  color: var(--t-copy);
}
[data-custom-cups] .cup-t * {
  box-sizing: border-box;
}
[data-custom-cups] .cup-t-sr {
  position: absolute !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
[data-custom-cups] .cup-t .cup-back {
  display: inline-flex;
  margin: 0 0 14px;
  color: var(--t-muted);
  font: 600 13px/1.4 var(--t-text);
  text-decoration: none;
}
[data-custom-cups] .cup-t .cup-back:hover {
  color: var(--t-gold-soft);
}

/* ---------- Status pills ---------- */
[data-custom-cups] .cup-t-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: none;
  padding: 4px 10px;
  border: 1px solid #ffffff1c;
  border-radius: 999px;
  background: #ffffff0d;
  color: var(--t-muted);
  font: 800 11px/1.3 var(--t-text);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: nowrap;
}
[data-custom-cups] .cup-t-pill::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.85;
}
[data-custom-cups] .cup-t-pill.is-live {
  border-color: #d4493f88;
  background: #4a1813;
  color: var(--t-red-soft);
}
[data-custom-cups] .cup-t-pill.is-live::before {
  background: #ff5d4f;
  box-shadow: 0 0 0 0 #ff5d4f88;
  animation: cup-t-pulse 1.8s ease-out infinite;
}
[data-custom-cups] .cup-t-pill.is-open {
  border-color: #efc16d77;
  background: #3a2c14;
  color: var(--t-gold-soft);
}
[data-custom-cups] .cup-t-pill.is-done {
  border-color: #7fd38a55;
  background: #16301b;
  color: #c4f0c9;
}
[data-custom-cups] .cup-t-pill.is-warn {
  border-color: #f0a24877;
  background: #3b260f;
  color: #ffcf96;
}
[data-custom-cups] .cup-t-pill.is-muted {
  opacity: 0.7;
}
@keyframes cup-t-pulse {
  0% { box-shadow: 0 0 0 0 #ff5d4f88; }
  70% { box-shadow: 0 0 0 7px #ff5d4f00; }
  100% { box-shadow: 0 0 0 0 #ff5d4f00; }
}

/* ---------- Hero ---------- */
[data-custom-cups] .cup-t .cup-t-hero {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 26px;
  margin: 0 0 18px;
  padding: 28px 32px;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
[data-custom-cups] .cup-t .cup-t-hero::after {
  display: none;
  content: "";
  position: absolute;
  z-index: -1;
  right: -90px;
  top: -120px;
  width: 360px;
  height: 360px;
  border: 1px solid #efc16d14;
  border-radius: 50%;
  box-shadow: 0 0 0 38px #efc16d08, 0 0 0 86px #efc16d05;
}
[data-custom-cups] .cup-t-crest {
  display: grid;
  place-items: center;
  width: 112px;
  height: 112px;
  border: 2px solid #efc16d88;
  border-radius: 28px;
  background: radial-gradient(circle at 50% 30%, #4a3920, #17130e 72%);
  box-shadow: 0 0 0 6px #efc16d10, 0 14px 30px #0008;
}
[data-custom-cups] .cup-t-crest :is(img, svg) {
  width: 84px;
  height: 84px;
}
[data-custom-cups] .cup-t-title {
  min-width: 0;
}
[data-custom-cups] .cup-t .cup-t-title .cup-kicker {
  margin: 0 0 6px;
  color: var(--t-gold);
  font: 800 11px/1.4 var(--t-text);
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
[data-custom-cups] .cup-t .cup-t-hero h1 {
  margin: 0 0 12px;
  overflow-wrap: anywhere;
  font: 400 clamp(1.9rem, 3.6vw, 3.2rem) / 1.05 var(--t-display);
  color: #fff6e4;
}
[data-custom-cups] .cup-t .cup-detail-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
}
[data-custom-cups] .cup-t .cup-detail-chips span {
  padding: 5px 11px;
  border: 1px solid #ffffff1f;
  border-radius: 8px;
  background: #00000040;
  color: #f1e3c9;
  font: 700 12px/1.3 var(--t-text);
}
[data-custom-cups] .cup-t-hero-side {
  display: grid;
  justify-items: end;
  gap: 14px;
  min-width: 0;
}
[data-custom-cups] .cup-t-hero-side .cup-t-pill {
  padding: 6px 14px;
  font-size: 12px;
}
[data-custom-cups] .cup-t-facts {
  display: flex;
  gap: 8px;
  margin: 0;
}
[data-custom-cups] .cup-t-facts > div {
  min-width: 104px;
  padding: 10px 14px;
  border: 1px solid var(--t-edge);
  border-radius: 12px;
  background: #00000045;
  text-align: right;
}
[data-custom-cups] .cup-t-facts dt {
  margin: 0 0 3px;
  color: var(--t-muted);
  font: 700 10px/1.3 var(--t-text);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
[data-custom-cups] .cup-t-facts dd {
  margin: 0;
  color: #fff6e4;
  font: 400 17px/1.2 var(--t-display);
  white-space: nowrap;
}

/* ---------- Champion ---------- */
[data-custom-cups] .cup-t .cup-t-champion {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 20px;
  margin: 0 0 18px;
  padding: 18px 26px;
  border: 1px solid #efc16d99;
  border-radius: var(--t-radius);
  background: radial-gradient(circle at 12% 50%, #efc16d33, transparent 40%), linear-gradient(110deg, #3a2a12, #17130d 70%);
  box-shadow: 0 0 0 1px #efc16d22, var(--t-shadow);
  text-align: left;
}
[data-custom-cups] .cup-t .cup-t-champion p {
  margin: 0 0 4px;
  color: var(--t-gold);
  font: 800 11px/1.4 var(--t-text);
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
[data-custom-cups] .cup-t .cup-t-champion h2 {
  margin: 0;
  overflow-wrap: anywhere;
  color: var(--t-gold-soft);
  font: 400 clamp(1.5rem, 3vw, 2.2rem) / 1.1 var(--t-display);
}
[data-custom-cups] .cup-t .cup-t-champion > :is(img, svg) {
  width: 72px;
  height: 72px;
}
[data-custom-cups] .cup-t .cup-t-champion > img:last-child {
  width: 64px;
  height: 64px;
  border-radius: 14px;
  object-fit: contain;
}

/* ---------- Next step ---------- */
[data-custom-cups] .cup-t .cup-t-next {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px 24px;
  margin: 0 0 18px;
  padding: 22px 26px;
  border: 1px solid var(--t-edge-strong);
  border-left: 4px solid var(--t-gold);
  border-radius: var(--t-radius);
  background: var(--t-panel);
  box-shadow: var(--t-shadow);
}
[data-custom-cups] .cup-t .cup-t-next-copy {
  min-width: 0;
}
[data-custom-cups] .cup-t .cup-t-next h2 {
  margin: 0 0 4px;
  color: #fff6e4;
  font: 400 1.35rem/1.2 var(--t-display);
}
[data-custom-cups] .cup-t .cup-t-next p {
  margin: 0;
  max-width: 62ch;
  color: var(--t-muted);
  font: 500 14px/1.55 var(--t-text);
}
[data-custom-cups] .cup-t .cup-t-next-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
  margin: 0;
}
[data-custom-cups] .cup-t .cup-t-next-actions:empty {
  display: none;
}
[data-custom-cups] .cup-t .cup-t-next.has-match .cup-t-teaser {
  grid-column: 1 / -1;
  grid-row: 2;
}
[data-custom-cups] .cup-t .cup-t-next .cup-team-secondary {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0;
  padding: 14px 0 0;
  border-top: 1px solid var(--t-edge);
}
[data-custom-cups] .cup-t .cup-t-next .cup-team-secondary b {
  color: var(--t-copy);
  font: 700 14px/1.4 var(--t-text);
  overflow-wrap: anywhere;
}
[data-custom-cups] .cup-t .cup-team-secondary .v2-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0;
}
[data-custom-cups] .cup-t-teaser {
  display: grid;
  gap: 12px;
  min-width: 0;
  padding: 14px 18px;
  border: 1px solid var(--t-edge);
  border-radius: 18px;
  background: linear-gradient(90deg, rgba(91, 184, 255, 0.1), rgba(0, 0, 0, 0.3) 40%, rgba(0, 0, 0, 0.3) 60%, rgba(255, 90, 74, 0.1));
}
[data-custom-cups] .cup-t-teaser.is-mine {
  border-color: #efc16d77;
  box-shadow: 0 0 0 1px #efc16d22 inset;
}
[data-custom-cups] .cup-t-teaser-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
[data-custom-cups] .cup-t-teaser-head small {
  color: var(--t-gold);
  font: 800 11px/1.4 var(--t-text);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
[data-custom-cups] .cup-t-teaser-sides {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 14px;
}
[data-custom-cups] .cup-t-teaser-sides > span {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
[data-custom-cups] .cup-t-teaser-sides > span:first-child {
  flex-direction: row-reverse;
  text-align: right;
}
[data-custom-cups] .cup-t-teaser-sides :is(img, svg) {
  flex: none;
  width: 44px;
  height: 44px;
  object-fit: contain;
}
[data-custom-cups] .cup-t-teaser-sides b {
  min-width: 0;
  overflow-wrap: anywhere;
  color: #fff6e4;
  font: 400 1.05rem/1.2 var(--t-display);
}
[data-custom-cups] .cup-t-teaser-sides i {
  color: var(--t-gold);
  font: 400 1.2rem/1 var(--t-display);
  font-style: normal;
}

/* ---------- Tabs ---------- */
[data-custom-cups] .cup-t .cup-t-tabs {
  margin: 0 0 22px;
}
[data-custom-cups] .cup-t .cup-t-tabs::-webkit-scrollbar {
  display: none;
}

/* ---------- Generic sections ---------- */
[data-custom-cups] .cup-t-body {
  min-width: 0;
}
[data-custom-cups] .cup-t-section {
  min-width: 0;
}
[data-custom-cups] .cup-t .cup-t-round {
  margin: 0 0 22px;
}
[data-custom-cups] .cup-t .cup-t-round > h3 {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin: 0 0 10px;
  color: #fff6e4;
  font: 400 1.15rem/1.2 var(--t-display);
}
[data-custom-cups] .cup-t .cup-t-round > h3 small {
  color: var(--t-muted);
  font: 700 11px/1.3 var(--t-text);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
[data-custom-cups] .cup-t-match-list {
  display: grid;
  gap: 10px;
}
[data-custom-cups] .cup-t .cup-t-match {
  display: grid;
  grid-template-columns: 200px minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  width: 100%;
  min-height: 72px;
  margin: 0;
  padding: 12px 18px;
  border: 1px solid var(--t-edge);
  border-radius: 14px;
  background: var(--t-panel);
  box-shadow: 0 6px 16px #0005;
  color: var(--t-copy);
  font: 500 14px/1.4 var(--t-text);
  text-align: left;
  cursor: pointer;
  transition: border-color 0.16s, transform 0.16s;
}
[data-custom-cups] .cup-t .cup-t-match:hover {
  border-color: #8a7046;
}
[data-custom-cups] .cup-t .cup-t-match.is-current {
  border-color: #efc16d;
  box-shadow: 0 0 0 1px #efc16d44, 0 0 24px #efc16d22, 0 6px 16px #0005;
}
[data-custom-cups] .cup-t .cup-t-match.is-mine {
  border-left: 4px solid var(--t-wood);
}
[data-custom-cups] .cup-t-match-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
  min-width: 0;
}
[data-custom-cups] .cup-t-match-meta small {
  color: var(--t-muted);
  font: 700 12px/1.3 var(--t-text);
}
[data-custom-cups] .cup-t-match-meta i {
  color: var(--t-gold);
  font: 800 11px/1.3 var(--t-text);
  font-style: normal;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
[data-custom-cups] .cup-t-match-meta .cup-t-pill {
  flex-basis: auto;
}
[data-custom-cups] .cup-t-match-sides {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  min-width: 0;
}
[data-custom-cups] .cup-t-side {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
[data-custom-cups] .cup-t-side:first-child {
  flex-direction: row-reverse;
  text-align: right;
}
[data-custom-cups] .cup-t-side :is(img, svg) {
  flex: none;
  width: 40px;
  height: 40px;
  object-fit: contain;
}
[data-custom-cups] .cup-t-side b {
  min-width: 0;
  overflow-wrap: anywhere;
  color: #fff6e4;
  font: 400 15px/1.25 var(--t-display);
}
[data-custom-cups] .cup-t-side em {
  flex: none;
  color: var(--t-copy);
  font: 800 14px/1 var(--t-text);
  font-style: normal;
}
[data-custom-cups] .cup-t-side.is-winner b,
[data-custom-cups] .cup-t-side.is-winner em {
  color: var(--t-gold-soft);
}
[data-custom-cups] .cup-t-side.is-loser {
  opacity: 0.55;
}
[data-custom-cups] .cup-t-vs {
  color: var(--t-gold);
  font: 400 15px/1 var(--t-display);
}
[data-custom-cups] .cup-t .cup-t-pager {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 8px 0 0;
}

/* ---------- Bracket ---------- */
[data-custom-cups] .cup-t-bracket-hint {
  display: none;
  margin: 0 0 10px;
  color: var(--t-muted);
  font: 600 12px/1.4 var(--t-text);
}
[data-custom-cups] .cup-t-bracket-scroll {
  --gap: 46px;
  max-width: 100%;
  overflow-x: auto;
  padding: 22px 22px 18px;
  border: 1px solid var(--t-edge);
  border-radius: 20px;
  background:
    radial-gradient(circle at 100% 0%, #efc16d14, transparent 34%),
    linear-gradient(180deg, #17150f, #0f0e0b);
  box-shadow: var(--t-shadow);
  scroll-snap-type: x proximity;
  scrollbar-color: #5d4c32 transparent;
}
[data-custom-cups] .cup-t-bracket-scroll:focus-visible {
  outline: 3px solid var(--ui-focus, #ffe5a3);
  outline-offset: 3px;
}
[data-custom-cups] .cup-t-bracket {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(214px, 1fr);
  column-gap: var(--gap);
  min-width: min-content;
  margin: 0;
  padding: 0;
  list-style: none;
}
[data-custom-cups] .cup-t-col {
  display: flex;
  flex-direction: column;
  min-width: 0;
  scroll-snap-align: start;
}
[data-custom-cups] .cup-t .cup-t-col > h3 {
  margin: 0 0 14px;
  padding: 0 0 10px;
  border-bottom: 1px solid var(--t-edge);
  color: var(--t-gold);
  font: 800 11px/1.3 var(--t-text);
  letter-spacing: 0.14em;
  text-align: center;
  text-transform: uppercase;
}
[data-custom-cups] .cup-t-col-body {
  display: flex;
  flex: 1;
  flex-direction: column;
}
[data-custom-cups] .cup-t-pair {
  position: relative;
  display: flex;
  flex: 1;
  flex-direction: column;
}
[data-custom-cups] .cup-t-slot {
  position: relative;
  display: flex;
  flex: 1;
  align-items: center;
  padding: 8px 0;
}
/* Connectors: out-line from every match, vertical join per pair, in-line into the next round. */
[data-custom-cups] .cup-t-col:not(.is-champion) .cup-t-slot::after,
[data-custom-cups] .cup-t-col + .cup-t-col .cup-t-slot::before {
  content: "";
  position: absolute;
  top: 50%;
  width: calc(var(--gap) / 2);
  border-top: 2px solid #5d4c32;
}
[data-custom-cups] .cup-t-col:not(.is-champion) .cup-t-slot::after {
  right: calc(var(--gap) / -2);
}
[data-custom-cups] .cup-t-col + .cup-t-col .cup-t-slot::before {
  left: calc(var(--gap) / -2);
}
[data-custom-cups] .cup-t-col:not(.is-champion) .cup-t-pair:not(.is-single)::after {
  content: "";
  position: absolute;
  top: 25%;
  bottom: 25%;
  right: calc(var(--gap) / -2);
  border-right: 2px solid #5d4c32;
}
[data-custom-cups] .cup-t-bracket.is-uneven .cup-t-slot::before,
[data-custom-cups] .cup-t-bracket.is-uneven .cup-t-slot::after,
[data-custom-cups] .cup-t-bracket.is-uneven .cup-t-pair::after {
  display: none;
}
[data-custom-cups] .cup-t-slot:has(.cup-t-node.is-done)::after {
  border-top-color: #b58b49;
}
[data-custom-cups] .cup-t .cup-t-node {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 2px;
  width: 100%;
  margin: 0;
  padding: 6px;
  border: 1px solid var(--t-edge-strong);
  border-radius: 12px;
  background: var(--t-panel-raised);
  box-shadow: 0 8px 18px #0006, 0 1px 0 #fff1 inset;
  color: var(--t-copy);
  font: 500 13px/1.3 var(--t-text);
  text-align: left;
  cursor: pointer;
  transition: border-color 0.16s, box-shadow 0.16s;
}
[data-custom-cups] .cup-t button.cup-t-node:hover {
  border-color: #b58b49;
}
[data-custom-cups] .cup-t .cup-t-node.is-current {
  border-color: #efc16d;
  box-shadow: 0 0 0 1px #efc16d55, 0 0 26px #efc16d2e, 0 8px 18px #0006;
}
[data-custom-cups] .cup-t .cup-t-node.is-mine {
  border-left: 4px solid var(--t-wood);
}
[data-custom-cups] .cup-t .cup-t-node.is-empty {
  border-style: dashed;
  background: #14120e;
  box-shadow: none;
  cursor: default;
  opacity: 0.7;
}
[data-custom-cups] .cup-t-node-row {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 4px 8px;
  border-radius: 8px;
}
[data-custom-cups] .cup-t-node-row :is(img, svg) {
  width: 26px;
  height: 26px;
  object-fit: contain;
}
[data-custom-cups] .cup-t-node-row b {
  min-width: 0;
  overflow: hidden;
  color: #f3e6cf;
  font: 700 13px/1.25 var(--t-text);
  text-overflow: ellipsis;
  white-space: nowrap;
}
[data-custom-cups] .cup-t-node-row em {
  min-width: 28px;
  color: var(--t-copy);
  font: 800 13px/1 var(--t-text);
  font-style: normal;
  text-align: right;
}
[data-custom-cups] .cup-t-node-row.is-winner {
  background: linear-gradient(90deg, #efc16d2e, #efc16d08);
  box-shadow: inset 3px 0 0 var(--t-gold);
}
[data-custom-cups] .cup-t-node-row.is-winner :is(b, em) {
  color: var(--t-gold-soft);
}
[data-custom-cups] .cup-t-node-row.is-loser {
  opacity: 0.5;
}
[data-custom-cups] .cup-t-node-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 6px 8px 2px;
  border-top: 1px solid #ffffff10;
  color: var(--t-muted);
  font: 700 11px/1.3 var(--t-text);
  white-space: nowrap;
}
[data-custom-cups] .cup-t-node-foot .cup-t-pill {
  padding: 2px 8px;
  font-size: 10px;
}
[data-custom-cups] .cup-t-champ {
  display: grid;
  justify-items: center;
  gap: 8px;
  width: 100%;
  padding: 18px 12px;
  border: 1px dashed #5d4c32;
  border-radius: 16px;
  background: #14120e;
  color: var(--t-muted);
  text-align: center;
}
[data-custom-cups] .cup-t-champ :is(img, svg) {
  width: 56px;
  height: 56px;
  object-fit: contain;
}
[data-custom-cups] .cup-t-champ b {
  overflow-wrap: anywhere;
  font: 400 15px/1.25 var(--t-display);
}
[data-custom-cups] .cup-t-champ.is-crowned {
  border: 1px solid #efc16d;
  background: radial-gradient(circle at 50% 0%, #efc16d40, transparent 70%), #1e180e;
  box-shadow: 0 0 0 1px #efc16d33, 0 0 34px #efc16d2a;
  color: var(--t-gold-soft);
}
[data-custom-cups] .cup-t-champ.is-crowned > :is(img, svg):nth-of-type(2) {
  width: 44px;
  height: 44px;
}

/* Match for 3rd place: second grid row, directly under the final column, no connector lines. */
[data-custom-cups] .cup-t-bracket.has-third > .cup-t-col {
  grid-row: 1;
}
[data-custom-cups] .cup-t-bracket > .cup-t-third {
  grid-row: 2;
  min-width: 0;
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px dashed #5d4c32;
  scroll-snap-align: start;
}
[data-custom-cups] .cup-t-third[data-col="1"] { grid-column: 1; }
[data-custom-cups] .cup-t-third[data-col="2"] { grid-column: 2; }
[data-custom-cups] .cup-t-third[data-col="3"] { grid-column: 3; }
[data-custom-cups] .cup-t-third[data-col="4"] { grid-column: 4; }
[data-custom-cups] .cup-t-third[data-col="5"] { grid-column: 5; }
[data-custom-cups] .cup-t .cup-t-third > h3 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin: 0 0 10px;
  color: var(--t-wood);
  font: 800 11px/1.3 var(--t-text);
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
[data-custom-cups] .cup-t-third > h3 :is(img, svg) {
  width: 20px;
  height: 20px;
  object-fit: contain;
  filter: sepia(1) hue-rotate(-18deg) saturate(1.4) brightness(0.85);
}
/* Clan links in the match window: open each clan directly in Clash of Clans. */
[data-custom-cups] .cup-t-clan-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 36px;
  margin-top: 8px;
  padding: 6px 14px;
  border: 1px solid #b58b49;
  border-radius: 999px;
  background: #1e180e;
  color: var(--t-gold-soft);
  font: 700 12px/1.2 var(--t-text);
  text-decoration: none;
}
[data-custom-cups] .cup-t-clan-link:hover {
  border-color: #efc16d;
  background: #2a2112;
}
[data-custom-cups] .cup-t-clan-link:focus-visible {
  outline: 3px solid var(--ui-focus, #ffe5a3);
  outline-offset: 2px;
}
/* Tournament check-in (planned Arena events) and match check-in clock. */
[data-custom-cups] .cup-t-checkin {
  display: grid;
  gap: 6px;
  margin: 10px 0 0;
  padding: 12px 14px;
  border: 1px solid var(--t-edge);
  border-left: 4px solid var(--t-wood);
  border-radius: 12px;
  background: #ffffff08;
}
[data-custom-cups] .cup-t-checkin.is-open {
  border-left-color: var(--t-gold);
}
[data-custom-cups] .cup-t .cup-t-checkin p {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0;
  color: var(--t-copy);
  font: 600 13px/1.4 var(--t-text);
}
[data-custom-cups] .cup-t .cup-t-checkin .cup-t-checkin-rule {
  color: var(--t-muted);
  font-weight: 500;
}
[data-custom-cups] .cup-t-countdown {
  color: var(--t-gold-soft);
  font: 800 13px/1 var(--t-text);
  font-variant-numeric: tabular-nums;
}
[data-custom-cups] .cup-button.is-checkin {
  min-width: 220px;
  box-shadow: 0 0 0 2px #efc16d66, 0 0 28px #efc16d40;
}
[data-custom-cups] .cup-button.is-checkin-wait {
  white-space: normal;
}
[data-custom-cups] .cup-t-checked-in {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 18px;
  border: 1px solid #5fbf8a;
  border-radius: 12px;
  background: #1f3a2b;
  color: #b9f0cf;
  font: 800 14px/1 var(--t-text);
}
[data-custom-cups] .cup-t-match-checkin {
  display: grid;
  gap: 8px;
  margin: 0 0 12px;
  padding: 12px 14px;
  border: 1px solid var(--t-edge-strong);
  border-radius: 12px;
  background: #ffffff08;
}
[data-custom-cups] .cup-t-match-checkin p {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px;
  margin: 0;
  color: var(--t-copy);
  font: 700 13px/1.4 var(--t-text);
}
[data-custom-cups] .cup-t-match-checkin ul {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}
[data-custom-cups] .cup-t-match-checkin li {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  color: var(--t-muted);
  font: 600 13px/1.3 var(--t-text);
}
[data-custom-cups] .cup-t-match-checkin li b {
  overflow: hidden;
  color: var(--t-copy);
  text-overflow: ellipsis;
  white-space: nowrap;
}
[data-custom-cups] .cup-t-match-checkin li.is-done span {
  color: #8eebbb;
}
[data-custom-cups] .cup-t-match-checkin li :is(img, svg) {
  width: 24px;
  height: 24px;
  object-fit: contain;
}
[data-custom-cups] .cup-t-match-checkin small {
  color: var(--t-muted);
  font: 500 12px/1.4 var(--t-text);
}
[data-custom-cups] :is(.cup-t-noshow, .cup-t-attention, .cup-t-teaser-checkin, .cup-t-groups-adjusted) {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 8px 0 0;
  color: var(--t-copy);
  font: 600 13px/1.4 var(--t-text);
}
[data-custom-cups] .da-checkin {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 12px 0 0;
  color: #f3e6cf;
  font: 700 13px/1.3 var(--t-text, system-ui);
}
[data-custom-cups] .da-checkin b {
  color: #efc16d;
  font-variant-numeric: tabular-nums;
}
/* Editor team count: a number field plus the "unlimited" switch (KO and LEAGUE only). */
[data-custom-cups] .cb-settings-line.has-team-count {
  grid-template-columns: minmax(0, 440px) minmax(0, 1fr);
}
[data-custom-cups] .cb-team-count {
  display: grid;
  gap: 12px;
  min-width: 0;
}
[data-custom-cups] .cb-number {
  position: relative;
  display: block;
}
[data-custom-cups] .cup-builder .cb-number input {
  padding-right: 72px;
  font-variant-numeric: tabular-nums;
}
[data-custom-cups] .cb-number > span {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: #e9ba65;
  font: 700 12px/1 system-ui;
  pointer-events: none;
}
[data-custom-cups] .cup-builder .cb-number input:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
[data-custom-cups] .cb-team-count .cb-hint {
  margin: 0;
}
[data-custom-cups] .cup-progress.is-open i {
  opacity: 0.35;
}
@media (max-width: 720px) {
  [data-custom-cups] .cb-settings-line.has-team-count {
    grid-template-columns: 1fr;
  }
}
/* Editor switch for the match for 3rd place: same slab, room before the rule panels. */
[data-custom-cups] .cb-third-place {
  margin: 0 0 18px;
}
[data-custom-cups] .cup-t-champ-third {
  color: var(--t-muted);
  font: 700 12px/1.3 var(--t-text);
}
[data-custom-cups] .cup-t-champ-third b {
  color: #e2b98a;
  font: 700 12px/1.3 var(--t-text);
}
[data-custom-cups] .cup-t .cup-t-champion p.cup-t-champion-third {
  margin: 6px 0 0;
  color: var(--t-muted);
  letter-spacing: 0.1em;
}
[data-custom-cups] .cup-t-champion-third b {
  color: #e2b98a;
}

/* ---------- Group tables ---------- */
[data-custom-cups] .cup-t-groups {
  display: grid;
  gap: 18px;
}
[data-custom-cups] .cup-t .cup-t-group {
  min-width: 0;
  padding: 18px 20px 12px;
  border: 1px solid var(--t-edge);
  border-radius: var(--t-radius);
  background: var(--t-panel);
  box-shadow: var(--t-shadow);
}
[data-custom-cups] .cup-t .cup-t-group > h3 {
  margin: 0 0 12px;
  color: var(--t-gold-soft);
  font: 400 1.25rem/1.2 var(--t-display);
}
[data-custom-cups] .cup-t .cup-t-group .v2-table-wrap {
  overflow-x: auto;
  border: 0;
  border-radius: 12px;
  background: transparent;
}
[data-custom-cups] .cup-t .cup-t-table {
  width: 100%;
  min-width: 0;
  border-collapse: separate;
  border-spacing: 0 6px;
  font: 600 14px/1.3 var(--t-text);
}
[data-custom-cups] .cup-t .cup-t-table :is(th, td) {
  padding: 10px 12px;
  border: 0;
  background: transparent;
  color: var(--t-copy);
  text-align: left;
  white-space: nowrap;
}
[data-custom-cups] .cup-t .cup-t-table th {
  padding-block: 4px;
  color: var(--t-muted);
  font: 800 10.5px/1.2 var(--t-text);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
[data-custom-cups] .cup-t .cup-t-table tbody td {
  background: rgba(0, 0, 0, 0.28);
}
[data-custom-cups] .cup-t .cup-t-table tbody td:first-child {
  border-radius: 10px 0 0 10px;
}
[data-custom-cups] .cup-t .cup-t-table tbody td:last-child {
  border-radius: 0 10px 10px 0;
}
[data-custom-cups] .cup-t .cup-t-table .is-num {
  text-align: right;
}
[data-custom-cups] .cup-t .cup-t-table .is-rank {
  width: 52px;
  color: var(--t-muted);
  font: 400 15px/1 var(--t-display);
  text-align: center;
}
/* The legacy sticky team column and 850px minimum belong to the old table; here the team cell takes the rest. */
[data-custom-cups] .cup-t .cup-t-table :is(th, td):nth-child(2),
[data-custom-cups] .cup-t .cup-t-table .is-team {
  position: static;
  width: 100%;
  min-width: 0;
  max-width: 0;
  overflow: hidden;
  white-space: nowrap;
}
[data-custom-cups] .cup-t .cup-t-table thead th:nth-child(2) {
  background: transparent;
}
[data-custom-cups] .cup-t .cup-t-table .is-team > span {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
[data-custom-cups] .cup-t .cup-t-table .is-team :is(img, svg) {
  flex: none;
  width: 28px;
  height: 28px;
  object-fit: contain;
}
[data-custom-cups] .cup-t .cup-t-table .is-team b {
  overflow: hidden;
  text-overflow: ellipsis;
  font: 700 14px/1.3 var(--t-text);
}
[data-custom-cups] .cup-t .cup-t-table .is-team i {
  flex: none;
  padding: 2px 8px;
  border: 1px solid rgba(142, 224, 122, 0.45);
  border-radius: 999px;
  background: rgba(63, 138, 23, 0.3);
  color: #c9f3bd;
  font: 800 10px/1.4 var(--t-text);
  font-style: normal;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
[data-custom-cups] .cup-t .cup-t-table td.is-points {
  color: var(--t-gold-soft);
  font: 400 16px/1 var(--t-display);
}
[data-custom-cups] .cup-t .cup-t-table th.is-points {
  color: var(--t-gold);
}
[data-custom-cups] .cup-t .cup-t-table tr.qualifies td.is-rank {
  box-shadow: inset 4px 0 0 var(--t-go);
  color: #c9f3bd;
}
[data-custom-cups] .cup-t .cup-t-table tr.qualifies td {
  background: rgba(63, 138, 23, 0.16);
}
[data-custom-cups] .cup-t .cup-t-legend {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-right: 8px;
  color: #c9f3bd;
  font-weight: 800;
}
[data-custom-cups] .cup-t .cup-t-legend::before {
  content: "";
  width: 4px;
  height: 14px;
  border-radius: 2px;
  background: var(--t-go);
}
[data-custom-cups] .cup-t .cup-t-table tr.is-mine .is-team b {
  color: var(--t-gold-soft);
}
[data-custom-cups] .cup-t .cup-t-short {
  display: none;
}
[data-custom-cups] .cup-t .cup-t-note {
  margin: 12px 0 0;
  color: var(--t-muted);
  font: 500 13px/1.5 var(--t-text);
}
@media (min-width: 1180px) {
  [data-custom-cups] .cup-t-groups:has(> .cup-t-group + .cup-t-group) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  [data-custom-cups] .cup-t-groups .cup-t-table .is-minor {
    display: none;
  }
}
@media (max-width: 640px) {
  [data-custom-cups] .cup-t .cup-t-group {
    padding: 14px 12px 8px;
  }
  [data-custom-cups] .cup-t .cup-t-table :is(.is-minor, .is-compact-hide) {
    display: none;
  }
  [data-custom-cups] .cup-t .cup-t-table :is(th, td) {
    padding: 9px 6px;
  }
  [data-custom-cups] .cup-t .cup-t-table .is-rank {
    width: 34px;
  }
  [data-custom-cups] .cup-t .cup-t-table .cup-t-long {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
  }
  [data-custom-cups] .cup-t .cup-t-table .cup-t-short {
    display: inline;
  }
  [data-custom-cups] .cup-t .cup-t-table th {
    font-size: 9px;
    letter-spacing: 0.04em;
  }
  [data-custom-cups] .cup-t .cup-t-table .is-team > span {
    gap: 7px;
  }
  [data-custom-cups] .cup-t .cup-t-table .is-team b {
    font-size: 13px;
  }
  [data-custom-cups] .cup-t .cup-t-table .is-team i {
    display: none;
  }
}

/* ---------- Rules ---------- */
[data-custom-cups] .cup-t .cup-t-rules {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
  gap: 12px;
}
[data-custom-cups] .cup-t .cup-t-rules > article {
  margin: 0;
  padding: 16px 18px;
  border: 1px solid var(--t-edge);
  border-radius: 14px;
  background: var(--t-panel);
  color: var(--t-copy);
  font: 500 14px/1.6 var(--t-text);
}

/* ---------- Manage ---------- */
[data-custom-cups] .cup-t .cup-t-manage {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
}
[data-custom-cups] .cup-t .cup-t-panel {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
  margin: 0;
  padding: 20px 22px;
  border: 1px solid var(--t-edge);
  border-radius: var(--t-radius);
  background: var(--t-panel);
  box-shadow: var(--t-shadow);
}
[data-custom-cups] .cup-t .cup-t-panel.is-invite {
  border-color: #b58b49;
  background: radial-gradient(circle at 100% 0%, #efc16d1f, transparent 45%), var(--t-panel);
}
[data-custom-cups] .cup-t .cup-t-panel.is-danger {
  border-color: #d4493f66;
  background: radial-gradient(circle at 100% 0%, #d4493f1a, transparent 50%), var(--t-panel);
}
[data-custom-cups] .cup-t .cup-t-panel.is-staff {
  grid-column: 1 / -1;
}
[data-custom-cups] .cup-t .cup-t-panel > h3 {
  margin: 0;
  color: var(--t-gold-soft);
  font: 400 1.1rem/1.25 var(--t-display);
}
[data-custom-cups] .cup-t .cup-t-panel.is-danger > h3 {
  color: #ffb3a8;
}
[data-custom-cups] .cup-t .cup-t-panel > p {
  margin: 0;
  color: var(--t-muted);
  font: 500 13.5px/1.55 var(--t-text);
}
[data-custom-cups] .cup-t .cup-t-panel .v2-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0;
}
[data-custom-cups] .cup-t-copy {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: stretch;
  gap: 8px 10px;
}
[data-custom-cups] .cup-t-copy-label {
  grid-column: 1 / -1;
  color: var(--t-muted);
  font: 700 11px/1.3 var(--t-text);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
[data-custom-cups] .cup-t .cup-t-copy-field {
  display: block;
  min-width: 0;
  margin: 0;
  padding: 12px 14px;
  border: 1px solid #68573e;
  border-radius: 10px;
  background: #0b0a08;
  box-shadow: 0 1px 2px #000a inset;
  color: #ffe7ae;
  font: 600 14px/1.5 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  overflow-wrap: anywhere;
  word-break: break-all;
  user-select: all;
  -webkit-user-select: all;
}
[data-custom-cups] .cup-t .cup-t-copy .cup-button {
  align-self: center;
  min-width: 118px;
}
[data-custom-cups] .cup-t .cup-t-copy .cup-button.is-copied {
  filter: saturate(0.6) brightness(1.1);
}

/* ---------- Match window (dialog) ---------- */
.cup-dialog.is-match {
  width: min(820px, calc(100vw - 24px));
  padding: 26px 28px 28px;
  border: 2px solid rgba(242, 195, 95, 0.55);
  border-radius: 26px;
  background:
    radial-gradient(circle at 50% -10%, rgba(242, 195, 95, 0.16), transparent 46%),
    linear-gradient(180deg, #2b2219, #17120e);
  box-shadow: var(--v2-shadow-2, 0 22px 60px rgba(0, 0, 0, 0.5));
}
.cup-dialog.is-match #cup-dialog-title {
  margin: 0 44px 6px 0;
  color: #fff6e4;
  font: 400 clamp(1.15rem, 2.6vw, 1.5rem) / 1.2 var(--v2-display, ArenaGameClash, system-ui);
}
.cup-dialog.is-match .cup-t-mw {
  display: grid;
  gap: 4px;
}
.cup-dialog.is-match .cup-t-mw-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 0 0 10px;
}
.cup-dialog.is-match .cup-t-mw-kicker {
  color: var(--ui-gold, #efc16d);
  font: 800 11px/1.3 Inter, system-ui, sans-serif;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.cup-dialog.is-match .cup-t-mw-versus {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 18px;
  padding: 22px 18px;
  border: 1px solid #3a3227;
  border-radius: 18px;
  background:
    linear-gradient(90deg, rgba(91, 184, 255, 0.16), rgba(0, 0, 0, 0.3) 40%, rgba(0, 0, 0, 0.3) 60%, rgba(255, 90, 74, 0.16)),
    #120d0a;
}
.cup-dialog.is-match .cup-t-mw-side {
  align-self: start;
  display: grid;
  justify-items: center;
  gap: 8px;
  min-width: 0;
  text-align: center;
}
.cup-dialog.is-match .cup-t-mw-side :is(img, svg) {
  width: 88px;
  height: 88px;
  padding: 6px;
  border: 2px solid #5d4c32;
  border-radius: 22px;
  background: radial-gradient(circle at 50% 30%, #3a2f20, #15120d 75%);
  object-fit: contain;
}
.cup-dialog.is-match .cup-t-mw-side:first-child :is(img, svg) {
  border-color: rgba(91, 184, 255, 0.7);
}
.cup-dialog.is-match .cup-t-mw-side:last-child :is(img, svg) {
  border-color: rgba(255, 90, 74, 0.7);
}
.cup-dialog.is-match .cup-t-mw-side.is-winner :is(img, svg) {
  border-color: #efc16d;
  box-shadow: 0 0 22px #efc16d44;
}
.cup-dialog.is-match .cup-t-mw-side.is-loser {
  opacity: 0.6;
}
.cup-dialog.is-match .cup-t-mw-side h3 {
  margin: 0;
  max-width: 100%;
  overflow-wrap: break-word;
  hyphens: auto;
  color: #fff6e4;
  font: 400 clamp(0.95rem, 2.4vw, 1.35rem) / 1.2 var(--v2-display, ArenaGameClash, system-ui);
}
.cup-dialog.is-match .cup-t-mw-side.is-winner h3 {
  color: #ffe7ae;
}
.cup-dialog.is-match .cup-t-tag {
  padding: 3px 9px;
  border: 1px solid #b58b49;
  border-radius: 999px;
  background: #3a2c14;
  color: #ffe7ae;
  font: 800 10px/1.3 Inter, system-ui, sans-serif;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.cup-dialog.is-match .cup-t-mw-vs {
  color: #efc16d;
  font: 400 clamp(1.6rem, 4vw, 2.4rem) / 1 var(--v2-display, ArenaGameClash, system-ui);
  text-shadow: 0 0 18px #efc16d55, 0 2px 0 #000;
}
.cup-dialog.is-match .da-rules {
  flex-wrap: wrap;
  overflow: visible;
}
.cup-dialog.is-match .da-rules,
.cup-dialog.is-match .da-result {
  margin: 10px 0 0;
}
.cup-dialog.is-match .cup-t-mw > .v2-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin: 18px 0 0;
}

/* ---------- Motion ---------- */
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  [data-custom-cups]:not(.cup-skip-motion) .cup-t .cup-t-match:hover {
    transform: translateY(-1px);
  }
}
@media (prefers-reduced-motion: reduce) {
  [data-custom-cups] .cup-t-pill.is-live::before {
    animation: none;
  }
  [data-custom-cups] .cup-t :is(.cup-t-match, .cup-t-node, .cup-t-tabs > button) {
    transition: none;
  }
}
[data-custom-cups].cup-skip-motion .cup-t-pill.is-live::before {
  animation: none;
}

/* ---------- Responsive ---------- */
@media (max-width: 1080px) {
  [data-custom-cups] .cup-t .cup-t-hero {
    grid-template-columns: auto minmax(0, 1fr);
  }
  [data-custom-cups] .cup-t-hero-side {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
  }
  [data-custom-cups] .cup-t-facts > div {
    text-align: left;
  }
}
@media (max-width: 860px) {
  [data-custom-cups] .cup-t .cup-t-manage {
    grid-template-columns: minmax(0, 1fr);
  }
  [data-custom-cups] .cup-t .cup-t-match {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
  }
  [data-custom-cups] .cup-t-bracket-hint {
    display: block;
  }
  [data-custom-cups] .cup-t-bracket-scroll {
    --gap: 34px;
    padding: 16px 14px 14px;
  }
  [data-custom-cups] .cup-t-bracket {
    grid-auto-columns: minmax(228px, 1fr);
  }
}
@media (max-width: 640px) {
  [data-custom-cups] .cup-t .cup-t-hero {
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
    padding: 20px 18px;
    border-radius: 18px;
  }
  [data-custom-cups] .cup-t-crest {
    width: 68px;
    height: 68px;
    border-radius: 18px;
  }
  [data-custom-cups] .cup-t-crest :is(img, svg) {
    width: 50px;
    height: 50px;
  }
  [data-custom-cups] .cup-t-hero-side {
    grid-column: auto;
    display: grid;
    justify-items: stretch;
  }
  [data-custom-cups] .cup-t-hero-side .cup-t-pill {
    justify-self: start;
  }
  [data-custom-cups] .cup-t-facts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
  }
  [data-custom-cups] .cup-t-facts > div {
    min-width: 0;
    padding: 8px 10px;
  }
  [data-custom-cups] .cup-t-facts dd {
    font-size: 15px;
    white-space: normal;
  }
  [data-custom-cups] .cup-t .cup-t-next {
    grid-template-columns: minmax(0, 1fr);
    padding: 18px;
  }
  [data-custom-cups] .cup-t .cup-t-next.has-match .cup-t-teaser {
    grid-row: auto;
  }
  [data-custom-cups] .cup-t .cup-t-next-actions {
    justify-content: stretch;
  }
  [data-custom-cups] .cup-t .cup-t-next-actions > .cup-button,
  [data-custom-cups] .cup-t .cup-team-secondary .v2-actions > .cup-button {
    flex: 1 1 100%;
  }
  [data-custom-cups] .cup-t .cup-team-secondary .v2-actions {
    width: 100%;
  }
  [data-custom-cups] .cup-t-teaser-sides {
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
  }
  [data-custom-cups] .cup-t-teaser-sides > span:first-child {
    flex-direction: row;
    text-align: left;
  }
  [data-custom-cups] .cup-t-teaser-sides i {
    font-size: 0.95rem;
  }
  [data-custom-cups] .cup-t .cup-t-tabs {
    flex-wrap: wrap;
  }
  [data-custom-cups] .cup-t .cup-t-tabs > button {
    flex: 1 1 30%;
    padding: 0.4em 0.5em;
    font-size: 0.85rem;
  }
  [data-custom-cups] .cup-t-match-sides {
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
  }
  [data-custom-cups] .cup-t-side:first-child {
    flex-direction: row;
    text-align: left;
  }
  [data-custom-cups] .cup-t-side em {
    margin-left: auto;
  }
  [data-custom-cups] .cup-t-vs {
    display: none;
  }
  [data-custom-cups] .cup-t .cup-t-panel {
    padding: 18px;
  }
  [data-custom-cups] .cup-t-copy {
    grid-template-columns: minmax(0, 1fr);
  }
  [data-custom-cups] .cup-t .cup-t-copy .cup-button {
    width: 100%;
  }
  [data-custom-cups] .cup-t .cup-t-panel .v2-actions > .cup-button {
    flex: 1 1 100%;
  }
  [data-custom-cups] .cup-t .cup-t-champion {
    grid-template-columns: auto minmax(0, 1fr);
    padding: 16px;
  }
  [data-custom-cups] .cup-t .cup-t-champion > img:last-child {
    display: none;
  }
  .cup-dialog.is-match {
    padding: 20px 16px 20px;
    border-radius: 18px;
  }
  .cup-dialog.is-match .cup-t-mw-versus {
    gap: 8px;
    padding: 16px 10px;
  }
  .cup-dialog.is-match .cup-t-mw-side :is(img, svg) {
    width: 64px;
    height: 64px;
    border-radius: 16px;
  }
  .cup-dialog.is-match .cup-t-mw > .v2-actions > .cup-button {
    flex: 1 1 100%;
  }
}

/* ---------- Presentation: cover, description, featured ---------- */
[data-custom-cups] .cup-t-pill.is-gold {
  border-color: #efc16d99;
  background: #3a2c14;
  color: var(--t-gold-soft);
}
[data-custom-cups] .cup-t .cup-detail-chips span.is-featured {
  border-color: #efc16d99;
  background: linear-gradient(180deg, #5a4318, #2e2310);
  color: var(--t-gold-soft);
  letter-spacing: 0.04em;
}
/* The approved cover sits behind the hero; a scrim keeps title and facts readable. */
[data-custom-cups] .cup-t .cup-t-hero.has-cover {
  min-height: clamp(260px, 30vw, 360px);
  align-items: end;
  padding-top: clamp(80px, 12vw, 150px);
  border: 1px solid var(--t-edge);
  border-radius: var(--t-radius);
  box-shadow: var(--t-shadow);
}
[data-custom-cups] .cup-t .cup-t-cover {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: #0d0b09;
}
[data-custom-cups] .cup-t .cup-t-cover img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
[data-custom-cups] .cup-t .cup-t-cover::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(10, 8, 6, 0.1) 0%, rgba(10, 8, 6, 0.55) 48%, rgba(10, 8, 6, 0.94) 100%),
    linear-gradient(90deg, rgba(10, 8, 6, 0.55), transparent 60%);
}
[data-custom-cups] .cup-t .cup-t-hero.has-cover h1 {
  text-shadow: 0 2px 14px #000c;
}
[data-custom-cups] .cup-t .cup-t-about {
  margin: 0 0 18px;
  padding: 22px 26px;
  border: 1px solid var(--t-edge);
  border-radius: var(--t-radius);
  background: var(--t-panel);
  box-shadow: var(--t-shadow);
}
[data-custom-cups] .cup-t .cup-t-about h2 {
  margin: 0 0 10px;
  color: var(--t-gold-soft);
  font: 400 1.2rem/1.25 var(--t-display);
}
[data-custom-cups] .cup-t .cup-t-about-text {
  max-width: 72ch;
  color: var(--t-copy);
  font: 500 15px/1.65 var(--t-text);
  overflow-wrap: anywhere;
}
[data-custom-cups] .cup-t .cup-t-about-text p {
  margin: 0 0 10px;
}
[data-custom-cups] .cup-t .cup-t-about-text p:last-child {
  margin-bottom: 0;
}
[data-custom-cups] .cup-t .cup-t-showcase-tools {
  margin-top: 16px;
}
[data-custom-cups] .cup-t .cup-t-panel.is-showcase {
  grid-column: 1 / -1;
  border-color: #b58b49;
}
[data-custom-cups] .cup-t .cup-t-panel.is-feature {
  border-color: #efc16d77;
  background: radial-gradient(circle at 100% 0%, #efc16d24, transparent 50%), var(--t-panel);
}
[data-custom-cups] .cup-t-cover-edit {
  display: grid;
  grid-template-columns: minmax(0, 360px) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}
[data-custom-cups] .cup-t .cup-t-cover-preview {
  display: grid;
  place-items: center;
  aspect-ratio: 16 / 9;
  margin: 0;
  overflow: hidden;
  border: 1px solid #68573e;
  border-radius: 14px;
  background: repeating-linear-gradient(135deg, #15110d 0 12px, #1b1611 12px 24px);
}
[data-custom-cups] .cup-t .cup-t-cover-preview img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
[data-custom-cups] .cup-t .cup-t-cover-preview figcaption {
  color: var(--t-muted);
  font: 600 13px/1.4 var(--t-text);
}
[data-custom-cups] .cup-t-cover-copy {
  display: grid;
  gap: 8px;
  min-width: 0;
}
[data-custom-cups] .cup-t .cup-t-cover-copy h4 {
  margin: 0;
  color: var(--t-copy);
  font: 800 13px/1.3 var(--t-text);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
[data-custom-cups] .cup-t .cup-t-cover-copy p {
  margin: 0;
  color: var(--t-muted);
  font: 500 13.5px/1.5 var(--t-text);
}
[data-custom-cups] .cup-t .cup-t-cover-copy .cup-t-fine {
  font-size: 12.5px;
  opacity: 0.9;
}
[data-custom-cups] .cup-t .cup-t-cover-status .cup-t-pill {
  white-space: normal;
}
[data-custom-cups] .cup-t .cup-t-file {
  position: relative;
  cursor: pointer;
}
[data-custom-cups] .cup-t .cup-t-file.is-busy {
  cursor: progress;
  opacity: 0.75;
}
/* Native file input stays keyboard reachable inside its visible label. */
[data-custom-cups] .cup-t .cup-t-file-input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: inherit;
}
[data-custom-cups] .cup-t .cup-t-file:focus-within {
  outline: 3px solid var(--t-gold);
  outline-offset: 3px;
}
[data-custom-cups] .cup-t .cup-t-field {
  display: grid;
  gap: 6px;
  min-width: 0;
}
[data-custom-cups] .cup-t .cup-t-field > span {
  color: var(--t-copy);
  font: 800 13px/1.3 var(--t-text);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
[data-custom-cups] .cup-t .cup-t-field textarea {
  width: 100%;
  min-height: 140px;
  resize: vertical;
  padding: 12px 14px;
  border: 1px solid #68573e;
  border-radius: 12px;
  background: #0b0a08;
  box-shadow: 0 1px 2px #000a inset;
  color: var(--t-copy);
  font: 500 15px/1.55 var(--t-text);
}
[data-custom-cups] .cup-t .cup-t-field textarea:focus-visible {
  outline: 3px solid var(--t-gold);
  outline-offset: 2px;
}
[data-custom-cups] .cup-t .cup-t-field small {
  color: var(--t-muted);
  font: 500 12.5px/1.4 var(--t-text);
}

/* Featured strip at the top of the tournament overview. */
[data-custom-cups] .cup-t-featured {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
  gap: 16px;
  margin: 26px 0 30px;
}
[data-custom-cups] .cup-t-feature {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-rows: auto 1fr;
  min-width: 0;
  overflow: hidden;
  border: 1px solid #b58b49;
  border-radius: var(--t-radius);
  background: var(--t-panel);
  box-shadow: var(--t-shadow), 0 0 0 4px #efc16d10;
  color: var(--t-copy);
  text-decoration: none;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
[data-custom-cups] .cup-t-feature:hover,
[data-custom-cups] .cup-t-feature:focus-visible {
  transform: translateY(-2px);
  box-shadow: var(--t-shadow), 0 0 0 4px #efc16d33;
}
[data-custom-cups] .cup-t-feature:focus-visible {
  outline: 3px solid var(--t-gold);
  outline-offset: 3px;
}
[data-custom-cups] .cup-t-feature-art {
  display: grid;
  place-items: center;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: radial-gradient(circle at 50% 35%, #4a3920, #17130e 75%);
}
[data-custom-cups] .cup-t-feature-art img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
[data-custom-cups] .cup-t-feature-art .cup-t-feature-fallback {
  width: 42%;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 12px 24px #000a);
}
[data-custom-cups] .cup-t-feature-copy {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
  padding: 18px 20px 20px;
}
[data-custom-cups] .cup-t-feature-kicker {
  margin: 0;
  color: var(--t-gold);
  font: 800 11px/1.4 var(--t-text);
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
[data-custom-cups] .cup-t-feature h2 {
  margin: 0;
  overflow-wrap: anywhere;
  color: #fff6e4;
  font: 400 clamp(1.25rem, 2.2vw, 1.6rem) / 1.12 var(--t-display);
}
[data-custom-cups] .cup-t-feature-meta,
[data-custom-cups] .cup-t-feature-text {
  margin: 0;
  color: var(--t-muted);
  font: 500 13.5px/1.5 var(--t-text);
  overflow-wrap: anywhere;
}
[data-custom-cups] .cup-t-feature-text {
  color: var(--t-copy);
}
[data-custom-cups] .cup-t-feature-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: auto;
  padding-top: 6px;
  color: var(--t-gold-soft);
  font: 700 13px/1.4 var(--t-text);
}
[data-custom-cups] .cup-t-feature-foot .cup-button {
  pointer-events: none;
}
/* One featured tournament gets the wide banner treatment. */
@media (min-width: 861px) {
  [data-custom-cups] .cup-t-featured.is-single .cup-t-feature {
    grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
    grid-template-rows: none;
  }
  [data-custom-cups] .cup-t-featured.is-single .cup-t-feature-art {
    aspect-ratio: auto;
    min-height: 300px;
  }
  [data-custom-cups] .cup-t-featured.is-single .cup-t-feature-copy {
    justify-content: center;
    padding: 28px 30px;
  }
  [data-custom-cups] .cup-t-featured.is-single h2 {
    font-size: clamp(1.7rem, 2.8vw, 2.4rem);
  }
}
[data-custom-cups] .cup-tile.is-featured {
  border-color: #b58b49;
}
[data-custom-cups] .cup-tile-art.has-cover {
  padding: 0;
  overflow: hidden;
}
/* The cover fills the whole art area (troop art keeps its own placement). */
[data-custom-cups] .cup-tile-art.has-cover .cup-tile-cover {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}
[data-custom-cups] .cup-tile-art.has-cover::after {
  background: linear-gradient(rgba(10, 8, 6, 0.35), transparent 35%, transparent 70%, #211c17);
}
[data-custom-cups] .cup-tile-art.has-cover .cup-tag {
  position: absolute;
  z-index: 2;
  top: 12px;
  left: 12px;
}
@media (max-width: 860px) {
  [data-custom-cups] .cup-t-cover-edit {
    grid-template-columns: minmax(0, 1fr);
  }
  [data-custom-cups] .cup-t .cup-t-hero.has-cover {
    padding-top: 120px;
  }
}
@media (max-width: 640px) {
  [data-custom-cups] .cup-t .cup-t-hero.has-cover {
    padding: 110px 18px 20px;
  }
  [data-custom-cups] .cup-t .cup-t-about {
    padding: 18px;
  }
  [data-custom-cups] .cup-t-featured {
    margin: 20px 0 24px;
  }
}
@media (prefers-reduced-motion: reduce) {
  [data-custom-cups] .cup-t-feature {
    transition: none;
  }
  [data-custom-cups] .cup-t-feature:hover,
  [data-custom-cups] .cup-t-feature:focus-visible {
    transform: none;
  }
}

/* ---------- Automatic event clock ---------- */
[data-custom-cups] .cup-t .cup-t-auto {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  margin: 10px 0 0;
  color: var(--t-copy);
  font: 600 13.5px/1.5 var(--t-text);
}
[data-custom-cups] .cup-t .cup-t-auto > .cup-t-pill {
  flex: 0 0 auto;
  width: auto;
}
[data-custom-cups] .cup-t .cup-t-auto > span:not(.cup-t-pill) {
  min-width: 0;
  flex: 1 1 220px;
}
[data-custom-cups] .cup-t .cup-t-auto-removed {
  margin: 6px 0 0;
  color: var(--t-muted);
  font: 500 12.5px/1.5 var(--t-text);
  overflow-wrap: anywhere;
}

/* Cover image and description in step 3 of the tournament creator (same look as the Presentation panel,
   stacked because the creator column is narrow). */
[data-custom-cups] .cb-showcase .cup-t-cover-edit {
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  margin: 10px 0 14px;
}
[data-custom-cups] .cb-showcase .cup-t-cover-preview {
  display: grid;
  place-items: center;
  aspect-ratio: 16 / 9;
  max-width: 420px;
  margin: 0;
  overflow: hidden;
  border: 1px solid #68573e;
  border-radius: 14px;
  background: repeating-linear-gradient(135deg, #15110d 0 12px, #1b1611 12px 24px);
}
[data-custom-cups] .cb-showcase .cup-t-cover-preview img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
[data-custom-cups] .cb-showcase .cup-t-cover-preview figcaption,
[data-custom-cups] .cb-showcase .cup-t-cover-copy p {
  margin: 0;
  color: var(--t-muted, #b8aa92);
  font: 500 13px/1.5 var(--t-text, inherit);
}
[data-custom-cups] .cb-showcase .cup-t-cover-copy h4 {
  margin: 0;
  color: var(--t-copy, #f3e7cf);
  font: 800 13px/1.3 var(--t-text, inherit);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
[data-custom-cups] .cb-showcase .v2-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
[data-custom-cups] .cb-showcase .cup-t-file {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 0 18px;
  white-space: nowrap;
  cursor: pointer;
}
[data-custom-cups] .cb-showcase .cup-t-file-input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: inherit;
}
[data-custom-cups] .cb-showcase .cup-t-file:focus-within {
  outline: 3px solid var(--t-gold, #ffd37a);
  outline-offset: 3px;
}
[data-custom-cups] .cb-showcase textarea {
  width: 100%;
  min-height: 96px;
}