.tournament-page {
  --tour-bg: #0b1425;
  --tour-panel: #101c31;
  --tour-text: #f2f5ff;
  --tour-muted: #b5c4da;
  --tour-line: #6580ac45;
  --tour-ease: var(--arrival-ease, cubic-bezier(0.23, 1, 0.32, 1));
  padding-block: 48px 80px;
  max-width: 1480px;
}
body[data-page="tournaments"] {
  color-scheme: dark;
}
.tournament-page .section-heading {
  display: block;
  margin-bottom: 36px;
}
body[data-page="tournaments"] #torneos h1 {
  color: var(--tour-text);
  font:
    700 clamp(30px, 4vw, 48px)/1.1 "DM Sans",
    sans-serif;
  letter-spacing: -0.04em;
  margin: 0 0 16px;
}
.tournament-page .section-heading p {
  max-width:60ch;
  font-size: 18px;
  line-height: 1.6;
  color: var(--tour-muted);
  margin: 0;
}
.tournament-list {
  display: grid;
  gap: 40px;
}
.tour-card {
  min-width: 0;
  border: 1px solid #486d9780;
  border-radius: 20px;
  overflow: hidden;
  background: var(--tour-bg);
  isolation: isolate;
}
.tour-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(310px, 0.8fr);
}
.tour-visual {
  position: relative;
  min-height: 480px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  background: #101725;
  padding-top: 84px;
  box-sizing: border-box;
}
.tour-art {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 1;
}
.tour-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, #071020f5, #08101f22 62%, #08101f08);
  pointer-events: none;
}
.tour-title {
  z-index: 1;
  position: relative;
  padding: 36px;
  width: 100%;
  min-width: 0;
}
.tour-title h2 {
  margin: 22px 0 12px;
  color: #fff;
  font:
    800 clamp(42px, 6vw, 86px)/0.98 "Barlow Condensed",
    "DM Sans",
    sans-serif;
  letter-spacing: -0.015em;
  overflow-wrap: anywhere;
  text-transform: uppercase;
}
.tour-title .tour-name {
  margin: 0;
  color: #f2f5ff;
  font-size: 22px;
  font-weight: 600;
  line-height: 1.4;
}
.tour-title .tour-mode {
  color: #c8d8ee;
  font-size: 16px;
  margin: 16px 0 0;
  line-height: 1.5;
}
.tour-state {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  border-radius: 6px;
  padding: 7px 11px;
  color: #9df3cc;
  background: #10392ee8;
  font-size: 14px;
  font-weight: 600;
}
.tour-visual > .tour-state {
  position: absolute;
  top: 24px;
  left: 24px;
  z-index: 2;
  max-width: calc(100% - 48px);
  border: 1px solid #4bd89b65;
  box-shadow: 0 0 18px #04e79416, inset 0 0 14px #16d88b0a;
  padding: 9px 14px;
  font-size: 15px;
  line-height: 1.4;
}
.tour-status-orb {
  position: relative;
  display: inline-block;
  flex: 0 0 14px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #caffdf, #35ff9c 36%, #00bf70 78%);
  box-shadow: 0 0 7px #38ffa3b8, 0 0 17px #00df8659;
}
.tour-status-orb::before,
.tour-status-orb::after {
  content: "";
  position: absolute;
  inset: -5px;
  border-radius: 50%;
  pointer-events: none;
}
.tour-status-orb::before {
  border: 1px solid #5bffaf80;
  border-left-color: transparent;
  border-right-color: transparent;
  transform: rotate(-25deg);
}
.tour-status-orb::after {
  inset: -9px;
  background: radial-gradient(ellipse, #41ffad38, transparent 70%);
  opacity: 0.45;
}
.tour-title .tour-game-mark {
  display: block;
  object-fit: contain;
  object-position: left center;
  width: 144px;
  height: 72px;
  max-width: 52%;
  margin: 0 0 15px;
}
.tour-title .tour-game-mark[data-game="dota2"] {
  width: 76px;
}
.tour-title .tour-game-mark[data-game="fortnite"] {
  background: #f4f5fa;
  border-radius: 7px;
  padding: 12px;
  box-sizing: border-box;
}
.tour-title:has(.tour-game-mark) h2 {
  margin-top: 0;
}
.tour-prize-award {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
}
.tour-prize-coins {
  width: 58px;
  height: 64px;
  object-fit: contain;
}
.tour-prize-label {
  display: block;
  color: #f4d795;
  font-size: 14px;
  line-height: 1.5;
  margin-bottom: 4px;
}
.tour-prizes .tour-prize-amount {
  margin: 0;
  color: #ffdd7d;
  font-size: clamp(22px, 2vw, 30px);
  font-weight: 700;
  line-height: 1.3;
  overflow-wrap: anywhere;
  white-space: pre-line;
  text-shadow: 0 1px 14px #eeb54419;
}
.tour-prizes[data-announced="true"] {
  background: radial-gradient(ellipse at 20% 70%, #a87a1713, transparent 72%), linear-gradient(140deg, #101a2b, #17182d);
}
.tour-prizes .tour-prize-pending {
  color: var(--tour-muted);
}
.tour-prize-award[data-description="true"] .tour-prize-amount {
  font-size: 18px;
  line-height: 1.65;
}
@media (prefers-reduced-motion: no-preference) {
  .tour-status-orb::before {
    animation: tour-orb-orbit 1600ms linear 3;
  }
  .tour-status-orb::after {
    animation: tour-orb-energy 1600ms var(--tour-ease) 3;
  }
}
@keyframes tour-orb-orbit {
  from { transform: rotate(-25deg); }
  to { transform: rotate(335deg); }
}
@keyframes tour-orb-energy {
  0%, 100% { transform: scale(.95); opacity: .45; }
  50% { transform: scale(1.35); opacity: .8; }
}
@media (max-width: 480px) {
  .tour-visual > .tour-state { top: 20px; left: 20px; max-width: calc(100% - 40px); }
  .tour-prize-award { grid-template-columns: 52px minmax(0,1fr); }
  .tour-prize-coins { width: 52px; }
}
[data-reduced-effects="true"] .tour-status-orb::before,
[data-reduced-effects="true"] .tour-status-orb::after {
  animation: none;
}
.tour-state[data-status="EN_CURSO"] {
  color: #b5eaff;
  background: #10384be8;
}
.tour-state[data-status="FINALIZADO"] {
  color: #d7ccff;
  background: #302745e8;
}
.tour-state[data-availability="full"] {
  color: #ffe0a1;
  background: #4a3414e8;
  border-color: #d9ad5866;
}
.tour-state[data-status="EN_CURSO"] { border-color: #6ecdeb66; }
.tour-state[data-status="FINALIZADO"] { border-color: #b29ae366; }
.tour-state[data-availability="closed"][data-status="INSCRIPCIONES"] {
  color: #d0d8e7;
  background: #202b3ee8;
  border-color: #8a9bb366;
}
.tour-registration {
  position: relative;
  padding: 30px;
  background:
    radial-gradient(ellipse at 100% 0, #7d46cc24, transparent 65%),
    var(--tour-bg);
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-left: 1px solid var(--tour-line);
}
.tour-facts {
  display: grid;
  grid-template-columns: 1fr;
  gap: 22px;
  margin: 0;
}
.tour-facts div {
  min-width: 0;
}
.tour-facts dt {
  font-size: 14px;
  color: #9cb7dc;
  margin-bottom: 8px;
}
.tour-facts dd {
  margin: 0;
  color: #f2f5ff;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.45;
  overflow-wrap: anywhere;
}
.tour-timezone {
  color: var(--tour-muted);
  font-size: 13px;
  margin: 18px 0 26px;
}
.tour-primary {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  width: 100%;
  min-height: 58px;
  padding: 16px 20px;
  border: 0;
  border-radius: 12px;
  background: linear-gradient(105deg, #70e6fb, #a7a1ff 55%, #e3a0f4);
  color: #081326;
  font:
    800 19px/1.3 "DM Sans",
    sans-serif;
  cursor: pointer;
  position: relative;
}
.tour-primary:disabled {
  background: #243044;
  color: #bdc8d8;
  cursor: default;
}
.tour-arrow {
  font-size: 25px;
  line-height: 1;
}
.tour-entry-line {
  margin: 18px 0 12px;
  color: #bfcee4;
  text-align: center;
  font-size: 16px;
  line-height: 1.5;
}
.tour-text-button {
  border: 0;
  padding: 8px 0;
  min-height: 44px;
  background: transparent;
  color: #87dffc;
  text-decoration: underline;
  text-underline-offset: 5px;
  font:
    600 15px/1.5 "DM Sans",
    sans-serif;
  cursor: pointer;
}
.tour-sections {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap:14px;
  padding:18px;
}
.tour-block {
  min-width: 0;
  padding: 22px 18px;
  border:1px solid var(--tour-line);
  border-radius:12px;
  background:#0a1729;
}
.tour-block:last-child { border:1px solid var(--tour-line); }
.tour-block h3 {
  color: #eef4ff;
  font:
    700 18px/1.4 "DM Sans",
    sans-serif;
  margin: 0 0 16px;
}
.tour-block p {
  font-size: 16px;
  line-height: 1.65;
  color: #bbcce2;
  margin: 8px 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.tour-block .tour-fee {
  color: #9ce9fb;
  font-size: 22px;
  font-weight: 700;
}
.tour-prizes p {
  color: #edcc8a;
}
.tour-preview {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}
.tour-card :focus-visible,
.tour-dialog :focus-visible {
  outline: 3px solid #70e6fb;
  outline-offset: 4px;
}
.tour-dialog {
  --tour-line: #6580ac45;
  --tour-muted: #b5c4da;
  color: #f2f5ff;
  background: #0b1425;
  width: min(1100px, calc(100% - 32px));
  max-width: 1100px;
  max-height: 90dvh;
  padding: 32px;
  border: 1px solid #7388b85c;
  border-radius: 20px;
}
.tour-dialog .dialog-head {
  position: sticky;
  top: -32px;
  padding-block:12px;
  z-index: 3;
  background: #0b1425;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.tour-dialog .close-button {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  min-width: 44px;
  padding: 0;
  font-size: 28px;
  line-height: 1;
}
.tour-dialog h2 {
  color: #f2f5ff;
  font-size: 30px;
  line-height: 1.2;
  margin: 20px 0;
}
.tour-dialog h3 {
  color: #f2f5ff;
  font-size: 20px;
}
.tour-dialog p {
  color: #bbcce2;
  font-size: 16px;
  line-height: 1.65;
}
.tour-overview .tour-facts {
  margin: 24px 0;
}
.tour-overview .tour-sections {
  margin-bottom: 32px;
  grid-template-columns: 1fr 1fr;
}
.tour-overview .tour-block {
  padding: 24px 20px;
}
.tour-overview .tour-rules {
  grid-column: 1/-1;
  border-right: 0;
  border-bottom: 1px solid var(--tour-line);
}
.tour-dialog #signup-form {
  max-width: none;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin: 32px 0 0;
  padding: 28px;
  border: 1px solid var(--tour-line);
  border-radius: 16px;
  background: #111d31;
}
.tour-dialog #signup-form :is(h3, .privacy-copy, button) {
  grid-column: 1/-1;
  margin:0;
}
.tour-dialog :is(#signup-form h3, .tour-rules h3, #tournament-bracket-title) {
  scroll-margin-top: 76px;
}
.tour-dialog #signup-form[hidden] {
  display: none;
}
.tour-dialog #signup-form label {
  margin:0;
  color: #d3deef;
  font-size: 16px;
  line-height: 1.5;
}
.tour-dialog #signup-form :is(input, textarea) {
  font-size: 16px;
  min-height: 48px;
  width: 100%;
  box-sizing: border-box;
}
.tour-dialog .bracket-board {
  max-width: 100%;
}
.tour-dialog .match-card p {
  font-size: 15px;
}
@media (max-width: 1050px) {
  .tour-title,
  .tour-registration {
    padding: 28px;
  }
  .tour-sections {
    grid-template-columns: 1fr 1fr;
  }
  .tour-block:nth-child(2) {
    border-right: 0;
  }
  .tour-block:nth-child(-n + 2) {
    border-bottom: 1px solid var(--tour-line);
  }
}
@media (max-width: 800px) {
  .tour-hero {
    grid-template-columns: 1fr;
  }
  .tour-visual {
    min-height: 330px;
  }
  .tour-registration {
    border-left: 0;
    border-top: 1px solid var(--tour-line);
  }
  .tour-facts dd {
    font-size: 18px;
  }
}
@media (max-width: 480px) {
  .tour-dialog .dialog-head { top:-20px; }
  .tournament-page {
    padding-block: 32px 48px;
  }
  .tour-title,
  .tour-registration {
    padding: 24px 20px;
  }
  .tour-title h2 {
    font-size: clamp(42px, 14vw, 66px);
  }
  .tour-title .tour-name {
    font-size: 20px;
  }
  .tour-sections {
    grid-template-columns: 1fr;
  }
  .tour-block {
    padding: 24px 20px;
    border-right: 0;
    border-bottom: 1px solid var(--tour-line);
  }
  .tour-visual {
    min-height: 300px;
  }
  .tour-facts {
    gap: 22px 16px;
  }
  .tour-dialog {
    padding: 20px 16px;
    width: calc(100% - 16px);
  }
  .tour-overview .tour-sections {
    grid-template-columns: 1fr;
  }
  .tour-dialog #signup-form {
    grid-template-columns: 1fr;
    padding: 20px 16px;
  }
  .tour-dialog .tour-block {
    padding-inline: 0;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .tour-card {
    animation: tour-enter 240ms var(--tour-ease) both;
    animation-delay: var(--tour-delay, 0ms);
  }
  .tour-primary,
  .tour-text-button {
    transition:
      transform 140ms var(--tour-ease),
      color 140ms ease;
  }
  .tour-primary:not(:disabled):active {
    transform: scale(0.985);
  }
  .tour-art {
    animation: tour-drift 16s ease-in-out 2 alternate;
  }
}
@media (hover: hover) and (pointer: fine) {
  .tour-primary:not(:disabled):hover {
    color: #000;
  }
  .tour-text-button:hover {
    color: #fff;
  }
}
@keyframes tour-enter {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes tour-drift {
  from {
    transform: scale(1);
  }
  to {
    transform: scale(1.035);
  }
}
@media (forced-colors: active) {
  .tour-card,
  .tour-dialog,
  .tour-primary {
    border: 1px solid CanvasText;
  }
}

.tour-card svg { width:24px; height:24px; flex:none; }
.tour-facts > div { display:grid; grid-template-columns:24px minmax(0,1fr); column-gap:12px; }
.tour-facts > div > svg { grid-row:1/3; color:#73ddff; width:24px; height:24px; }
.tour-facts dt { margin:0 0 4px; }
.tour-block h3 { display:flex; align-items:center; gap:10px; }
.tour-block h3 svg { color:#75deff; }
.tour-prizes h3 svg { color:#f0cd79; }
.tour-prizes { background:linear-gradient(140deg,#111a2b,#1d1833); }
.tour-prizes p { font-size:20px; font-weight:600; }
.tour-series strong { color:#f2f5ff; }
.tour-teams-button { gap:10px; width:100%; margin-top:14px; }
.tour-registration .tour-timezone { margin:20px 0; line-height:1.5; }
.tour-card .tour-primary { min-height:54px; }
@media(max-width:1050px) { .tour-hero { grid-template-columns:minmax(0,1.2fr) minmax(290px,.8fr); } .tour-sections { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:800px) { .tour-hero { grid-template-columns:1fr; } .tour-visual { min-height:390px; } .tour-registration { border-left:0; border-top:1px solid var(--tour-line); } .tour-registration .tour-facts { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:480px) { .tour-sections { grid-template-columns:1fr; padding:12px; gap:10px; } .tour-visual { min-height:340px; } .tour-registration .tour-facts { grid-template-columns:1fr; gap:18px; } .tour-card .tour-title { padding:24px; } .tour-block { padding:20px; } }
