.etc-single-page {
  --etc-page-bg: #080b14;
  --etc-panel: #111827;
  --etc-panel-soft: #151f31;
  --etc-line: rgba(255,255,255,.1);
  --etc-text: #f4fbff;
  --etc-muted: #9db0c4;
  --etc-accent: #00ffff;
  min-height: 70vh;
  color: var(--etc-text);
  background:
    radial-gradient(circle at 15% 5%, rgba(0,255,255,.12), transparent 28rem),
    linear-gradient(180deg, #090d18, var(--etc-page-bg));
}

.etc-single-page *,
.etc-single-page *::before,
.etc-single-page *::after { box-sizing: border-box; }

.etc-single-container {
  width: min(1180px, calc(100% - 2rem));
  margin-inline: auto;
}

.etc-single-container-wide { width: min(1500px, calc(100% - 2rem)); }

.etc-single-hero {
  padding: clamp(4rem, 8vw, 8rem) 0 clamp(3rem, 6vw, 6rem);
  border-bottom: 1px solid var(--etc-line);
}

.etc-team-hero-grid,
.etc-tournament-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: clamp(2rem, 6vw, 6rem);
  align-items: center;
}

.etc-team-hero-grid { grid-template-columns: minmax(180px, 280px) minmax(0, 1fr); }

.etc-eyebrow {
  margin: 0 0 .75rem;
  color: var(--etc-accent);
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.etc-single-heading h1 {
  margin: 0;
  color: var(--etc-text);
  font-size: clamp(2.75rem, 7vw, 6.5rem);
  line-height: .94;
  letter-spacing: -.055em;
  text-wrap: balance;
}

.etc-single-intro {
  max-width: 760px;
  margin: 1.5rem 0 0;
  color: var(--etc-muted);
  font-size: clamp(1.05rem, 2vw, 1.35rem);
  line-height: 1.65;
}

.etc-team-logo-wrap {
  display: grid;
  place-items: center;
  aspect-ratio: 1;
  padding: 2rem;
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(0,255,255,.2);
  border-radius: 28px;
  box-shadow: 0 25px 70px rgba(0,0,0,.35), inset 0 0 35px rgba(0,255,255,.06);
}

.etc-team-logo { width: 100%; height: 100%; max-height: 230px; object-fit: contain; }

.etc-team-logo-placeholder {
  display: grid;
  place-items: center;
  width: 100%; height: 100%;
  color: var(--etc-accent);
  font-size: 7rem;
  font-weight: 900;
}

.etc-single-content-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, .75fr);
  gap: 2rem;
  padding-block: clamp(3rem, 6vw, 6rem);
}

.etc-content-card,
.etc-tournament-meta-card {
  background: linear-gradient(145deg, rgba(21,31,49,.94), rgba(12,18,31,.94));
  border: 1px solid var(--etc-line);
  border-radius: 24px;
  box-shadow: 0 20px 60px rgba(0,0,0,.25);
}

.etc-content-card { padding: clamp(1.5rem, 4vw, 3rem); }
.etc-content-card h2 { margin-top: 0; color: var(--etc-text); font-size: clamp(1.6rem, 3vw, 2.5rem); }

.etc-entry-content { color: #dbe8f3; font-size: 1.05rem; line-height: 1.8; }
.etc-entry-content > :first-child { margin-top: 0; }
.etc-entry-content > :last-child { margin-bottom: 0; }
.etc-entry-content a { color: var(--etc-accent); }

.etc-player-list { display: grid; gap: .65rem; padding: 0; margin: 1.5rem 0 0; list-style: none; }
.etc-player-list li {
  display: grid;
  grid-template-columns: 2.5rem 1fr;
  gap: .8rem;
  align-items: center;
  padding: .9rem 1rem;
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 12px;
}
.etc-player-number { color: var(--etc-accent); font-size: .75rem; font-weight: 900; letter-spacing: .1em; }
.etc-player-name { font-weight: 750; }
.etc-empty-message { color: var(--etc-muted); }

.etc-tournament-meta-card {
  min-width: min(360px, 100%);
  padding: 1.5rem;
}
.etc-game-logo { display: block; width: 100%; height: 88px; margin-bottom: 1rem; object-fit: contain; object-position: left center; }
.etc-tournament-meta-card dl { display: grid; gap: .35rem; margin: 0; }
.etc-tournament-meta-card dl > div {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  padding: .9rem 0;
  border-bottom: 1px solid var(--etc-line);
}
.etc-tournament-meta-card dl > div:last-child { border-bottom: 0; }
.etc-tournament-meta-card dt { color: var(--etc-muted); }
.etc-tournament-meta-card dd { margin: 0; color: var(--etc-text); font-weight: 800; text-align: right; }
.etc-tournament-meta-card a { color: var(--etc-accent); text-decoration: none; }

.etc-tournament-bracket-section { padding: clamp(2rem, 5vw, 4.5rem) 0; }
.etc-tournament-content-section { padding: 0 0 clamp(4rem, 8vw, 8rem); }
.etc-tournament-description { max-width: 980px; }
.etc-section-heading h2 { margin-bottom: 1.5rem; }

@media (max-width: 850px) {
  .etc-team-hero-grid,
  .etc-tournament-hero-grid,
  .etc-single-content-grid { grid-template-columns: 1fr; }
  .etc-team-logo-wrap { max-width: 240px; }
  .etc-tournament-meta-card { min-width: 0; }
}

@media (max-width: 560px) {
  .etc-single-container,
  .etc-single-container-wide { width: min(100% - 1rem, 1180px); }
  .etc-single-hero { padding-top: 3rem; }
  .etc-content-card { border-radius: 18px; }
}

/* Match page */
.etc-match-hero { padding-bottom: clamp(2rem, 5vw, 4rem); }
.etc-match-breadcrumbs { display:flex; flex-wrap:wrap; gap:.55rem; margin-bottom:1.25rem; color:var(--etc-muted); font-size:.9rem; }
.etc-match-breadcrumbs a { color:var(--etc-accent); text-decoration:none; }
.etc-match-heading-row { display:flex; gap:2rem; align-items:flex-end; justify-content:space-between; }
.etc-match-heading-row h1 { margin:0; color:var(--etc-text); font-size:clamp(2.5rem,6vw,5.5rem); line-height:.96; letter-spacing:-.045em; }
.etc-match-status { display:inline-flex; align-items:center; padding:.55rem .9rem; border-radius:999px; font-size:.75rem; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.etc-match-status.is-live { color:#fff; background:rgba(255,50,50,.16); border:1px solid rgba(255,50,50,.65); box-shadow:0 0 20px rgba(255,50,50,.24); }
.etc-match-status.is-live::before { content:''; width:8px; height:8px; margin-right:.5rem; background:#ff3232; border-radius:50%; box-shadow:0 0 10px rgba(255,50,50,.9); }
.etc-match-status.is-complete { color:#d7fff8; background:rgba(0,255,180,.1); border:1px solid rgba(0,255,180,.35); }
.etc-match-status.is-upcoming { color:var(--etc-accent); background:rgba(0,255,255,.08); border:1px solid rgba(0,255,255,.28); }
.etc-match-start-time { margin:1.25rem 0 0; color:var(--etc-muted); }
.etc-match-start-time span { margin-right:.5rem; color:var(--etc-text); font-weight:800; }
.etc-match-stream-section { padding:clamp(2rem,5vw,4.5rem) 0 1.5rem; }
.etc-stream-embed { position:relative; overflow:hidden; aspect-ratio:16/9; background:#000; border:1px solid rgba(0,255,255,.2); border-radius:22px; box-shadow:0 25px 80px rgba(0,0,0,.45); }
.etc-stream-embed iframe { width:100%; height:100%; border:0; }
.etc-stream-fallback { display:flex; justify-content:center; }
.etc-stream-watch-button { display:inline-flex; padding:.8rem 1.2rem; color:#fff; background:rgba(255,50,50,.18); border:1px solid rgba(255,50,50,.65); border-radius:12px; font-weight:900; text-decoration:none; }
.etc-match-details-section { padding:clamp(2rem,5vw,4.5rem) 0 clamp(4rem,8vw,8rem); }
.etc-match-versus-card { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:1.25rem; align-items:center; padding:clamp(1rem,3vw,2rem); background:linear-gradient(145deg,rgba(21,31,49,.94),rgba(12,18,31,.94)); border:1px solid var(--etc-line); border-radius:24px; box-shadow:0 20px 60px rgba(0,0,0,.25); }
.etc-match-team { display:grid; grid-template-columns:72px minmax(0,1fr) auto; gap:1rem; align-items:center; padding:1rem; border:1px solid rgba(255,255,255,.08); border-radius:16px; background:rgba(255,255,255,.025); }
.etc-match-team.is-winner { border-color:rgba(0,255,255,.62); box-shadow:0 0 18px rgba(0,255,255,.2); }
.etc-match-team-logo { width:72px; height:72px; object-fit:contain; }
.etc-match-team h2 { margin:0; font-size:clamp(1.1rem,2vw,1.6rem); }
.etc-match-team a { color:var(--etc-text); text-decoration:none; }
.etc-match-score { color:var(--etc-accent); font-size:clamp(2rem,5vw,4rem); line-height:1; }
.etc-match-vs { display:grid; gap:.35rem; text-align:center; }
.etc-match-vs span { color:var(--etc-accent); font-size:1rem; font-weight:900; letter-spacing:.12em; }
.etc-match-vs small { max-width:140px; color:var(--etc-muted); }
.etc-match-info-grid { display:grid; grid-template-columns:minmax(260px,.7fr) minmax(0,1.3fr); gap:1.5rem; margin-top:1.5rem; }
.etc-match-meta-list { display:grid; gap:.1rem; margin:1rem 0 0; }
.etc-match-meta-list > div { display:flex; justify-content:space-between; gap:1.5rem; padding:.75rem 0; border-bottom:1px solid var(--etc-line); }
.etc-match-meta-list > div:last-child { border-bottom:0; }
.etc-match-meta-list dt { color:var(--etc-muted); }
.etc-match-meta-list dd { margin:0; color:var(--etc-text); font-weight:800; text-align:right; }
.etc-match-meta-list a { color:var(--etc-accent); text-decoration:none; }

@media (max-width:800px) {
  .etc-match-heading-row { align-items:flex-start; flex-direction:column; gap:1rem; }
  .etc-match-versus-card { grid-template-columns:1fr; }
  .etc-match-vs { order:2; }
  .etc-match-team:last-child { order:3; }
  .etc-match-info-grid { grid-template-columns:1fr; }
}

@media (max-width:560px) {
  .etc-match-team { grid-template-columns:52px minmax(0,1fr) auto; padding:.75rem; }
  .etc-match-team-logo { width:52px; height:52px; }
}
