:root {
  color-scheme:dark;
  --md-bg:#030806;
  --md-panel:#07110c;
  --md-panel-2:#091511;
  --md-line:rgba(245,200,66,.2);
  --md-line-soft:rgba(255,255,255,.1);
  --md-gold:#f5c842;
  --md-lime:#d6ff1f;
  --md-blue:#7fbfff;
  --md-text:#f7faf7;
  --md-muted:#aeb9b1;
}

body:is(.mf-match-detail-page,.mf-team-detail-page) {
  background:
    radial-gradient(circle at 12% 0,rgba(245,200,66,.08),transparent 25rem),
    linear-gradient(180deg,#050a07,var(--md-bg));
}

.mf-match-page-shell {
  width:min(1180px,calc(100% - 2rem));
  min-height:70vh;
  margin:0 auto;
  padding:clamp(1rem,2.4vw,2rem) 0 4rem;
}

.mf-match-page-loading,
.mf-match-page-empty {
  display:grid;
  gap:.65rem;
  min-height:18rem;
  place-content:center;
  justify-items:center;
  padding:2rem;
  border:1px dashed var(--md-line);
  border-radius:1rem;
  color:var(--md-muted);
  text-align:center;
}

.mf-match-page-empty h1 {
  margin:0;
  color:var(--md-text);
  font:2rem/1 "Archivo Black",sans-serif;
}

.mf-match-breadcrumb {
  display:flex;
  align-items:center;
  gap:.6rem;
  margin-bottom:.85rem;
  color:var(--md-muted);
  font:700 .72rem/1.2 "JetBrains Mono",monospace;
  text-transform:uppercase;
}

.mf-match-breadcrumb a {
  color:var(--md-gold);
  text-decoration:none;
}

.mf-match-detail-hero,
.mf-team-detail-hero {
  overflow:hidden;
  border:1px solid var(--md-line);
  border-radius:1.2rem;
  background:
    radial-gradient(circle at 50% 0,rgba(214,255,31,.08),transparent 20rem),
    linear-gradient(145deg,rgba(8,24,16,.98),rgba(8,17,29,.98));
  box-shadow:0 24px 70px rgba(0,0,0,.3);
}

.mf-match-detail-meta {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  min-height:52px;
  padding:.7rem 1rem;
  border-bottom:1px solid var(--md-line);
  color:var(--md-gold);
  font:700 .7rem/1.2 "JetBrains Mono",monospace;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.mf-match-detail-heading {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

.mf-match-detail-scoreboard {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(10rem,.55fr) minmax(0,1fr);
  gap:clamp(1rem,3vw,2.4rem);
  align-items:center;
  padding:clamp(1.2rem,4vw,3rem);
}

.mf-match-detail-team {
  display:grid;
  justify-items:center;
  gap:.8rem;
  min-width:0;
  color:var(--md-text);
  text-align:center;
  text-decoration:none;
}

.mf-match-detail-team img,
.mf-team-detail-mark img {
  width:clamp(4.5rem,8vw,7rem);
  height:clamp(4.5rem,8vw,7rem);
  object-fit:contain;
  filter:drop-shadow(0 10px 24px rgba(0,0,0,.35));
}

.mf-match-detail-team strong {
  max-width:18ch;
  font:clamp(1.05rem,2vw,1.55rem)/1.08 "Archivo Black",sans-serif;
}

.mf-match-detail-team--text {
  min-height:8rem;
  align-content:center;
}

.mf-match-detail-center {
  display:grid;
  justify-items:center;
  gap:.5rem;
  text-align:center;
}

.mf-match-detail-center span {
  color:var(--md-muted);
  font:700 .65rem/1.2 "JetBrains Mono",monospace;
  text-transform:uppercase;
}

.mf-match-detail-center strong {
  color:var(--md-text);
  font:clamp(1.7rem,4vw,3rem)/1 "Archivo Black",sans-serif;
}

.mf-match-detail-center em {
  color:var(--md-gold);
  font:700 .7rem/1.2 "JetBrains Mono",monospace;
  font-style:normal;
  text-transform:uppercase;
}

.mf-match-detail-facts {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  border-top:1px solid var(--md-line-soft);
}

.mf-match-detail-facts div {
  display:grid;
  gap:.3rem;
  min-height:5.4rem;
  align-content:center;
  padding:.85rem 1rem;
  border-right:1px solid var(--md-line-soft);
}

.mf-match-detail-facts div:last-child {
  border-right:0;
}

.mf-match-detail-facts span,
.mf-match-section-label {
  color:var(--md-gold);
  font:700 .65rem/1.2 "JetBrains Mono",monospace;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.mf-match-detail-facts strong {
  color:var(--md-text);
  font-size:.9rem;
}

.mf-match-detail-actions {
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
  padding:1rem;
  border-top:1px solid var(--md-line-soft);
}

.mf-match-detail-actions :is(button,a),
.mf-team-detail-actions button,
.mf-match-page-empty a {
  display:inline-flex;
  min-height:45px;
  align-items:center;
  justify-content:center;
  padding:.6rem .85rem;
  border:1px solid var(--md-line);
  border-radius:.65rem;
  background:#07100b;
  color:var(--md-gold);
  font:700 .7rem/1.2 "JetBrains Mono",monospace;
  text-decoration:none;
}

.mf-match-detail-actions .is-primary,
.mf-match-detail-actions button[aria-pressed="true"],
.mf-team-detail-actions button[aria-pressed="true"] {
  border-color:var(--md-lime);
  background:var(--md-lime);
  color:#061008;
}

.mf-match-content-grid {
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(18rem,.55fr);
  gap:1rem;
  align-items:start;
  margin-top:1rem;
}

.mf-match-panel,
.mf-match-related {
  border:1px solid var(--md-line);
  border-radius:1rem;
  background:rgba(7,17,12,.86);
}

.mf-match-tabs {
  display:flex;
  gap:.35rem;
  overflow-x:auto;
  padding:.7rem;
  border-bottom:1px solid var(--md-line-soft);
}

.mf-match-tabs button {
  flex:0 0 auto;
  min-height:44px;
  padding:.55rem .8rem;
  border:1px solid var(--md-line-soft);
  border-radius:.6rem;
  background:#09130e;
  color:var(--md-muted);
  font-weight:700;
}

.mf-match-tabs button[aria-selected="true"] {
  border-color:var(--md-lime);
  color:var(--md-lime);
}

.mf-match-tab-panel {
  min-height:14rem;
  padding:1rem;
}

.mf-match-tab-panel h2,
.mf-match-related h2,
.mf-team-detail-copy h1,
.mf-team-fixtures h2 {
  margin:.25rem 0 .65rem;
  color:var(--md-text);
  font:clamp(1.3rem,2.6vw,2rem)/1.05 "Archivo Black",sans-serif;
}

.mf-match-tab-panel p,
.mf-team-detail-copy p {
  max-width:68ch;
  color:var(--md-muted);
  line-height:1.6;
}

.mf-match-related {
  padding:1rem;
}

.mf-related-list,
.mf-team-fixture-list {
  display:grid;
  gap:.55rem;
}

.mf-related-match,
.mf-team-fixture {
  display:grid;
  gap:.35rem;
  min-height:44px;
  padding:.75rem;
  border:1px solid var(--md-line-soft);
  border-radius:.7rem;
  background:rgba(255,255,255,.025);
  color:var(--md-text);
  text-decoration:none;
}

.mf-related-match:hover,
.mf-team-fixture:hover {
  border-color:var(--md-gold);
  background:rgba(245,200,66,.05);
}

.mf-related-match span,
.mf-team-fixture span {
  color:var(--md-gold);
  font:700 .63rem/1.2 "JetBrains Mono",monospace;
  text-transform:uppercase;
}

.mf-related-match small,
.mf-team-fixture small {
  color:var(--md-muted);
}

.mf-team-detail-hero {
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:1.2rem;
  align-items:center;
  padding:clamp(1rem,3vw,2rem);
}

.mf-team-detail-mark {
  display:grid;
  place-items:center;
  min-width:7rem;
}

.mf-team-detail-copy p {
  margin:0;
}

.mf-team-detail-actions {
  display:flex;
  gap:.55rem;
}

.mf-team-fixtures {
  margin-top:1rem;
  padding:1rem;
  border:1px solid var(--md-line);
  border-radius:1rem;
  background:rgba(7,17,12,.86);
}

.mf-team-fixture {
  grid-template-columns:7rem minmax(0,1fr) auto;
  align-items:center;
}

.mf-team-fixture strong {
  font-family:"Archivo Black",sans-serif;
}

.mf-match-feedback {
  color:var(--md-blue);
  font-size:.78rem;
}

body:is(.mf-match-detail-page,.mf-team-detail-page) :is(button,a):focus-visible {
  outline:3px solid var(--md-blue)!important;
  outline-offset:3px!important;
}

body:is(.mf-match-detail-page,.mf-team-detail-page) main :is(button,a) {
  min-height:44px!important;
}

@media (max-width:800px) {
  .mf-match-detail-scoreboard {
    grid-template-columns:1fr auto 1fr;
    gap:.65rem;
    padding:1rem .65rem;
  }

  .mf-match-detail-team img {
    width:4rem;
    height:4rem;
  }

  .mf-match-detail-team strong {
    font-size:.9rem;
  }

  .mf-match-content-grid,
  .mf-team-detail-hero {
    grid-template-columns:1fr;
  }

  .mf-team-detail-hero {
    justify-items:start;
  }

  .mf-team-detail-mark {
    min-width:0;
  }
}

@media (max-width:560px) {
  .mf-match-page-shell {
    width:min(100% - 1rem,42rem);
  }

  .mf-match-detail-meta {
    align-items:flex-start;
    flex-direction:column;
  }

  .mf-match-detail-scoreboard {
    grid-template-columns:1fr 1fr;
  }

  .mf-match-detail-center {
    grid-column:1 / -1;
    grid-row:1;
  }

  .mf-match-detail-facts {
    grid-template-columns:1fr;
  }

  .mf-match-detail-facts div {
    min-height:4rem;
    border-right:0;
    border-bottom:1px solid var(--md-line-soft);
  }

  .mf-match-detail-actions {
    display:grid;
    grid-template-columns:1fr 1fr;
  }

  .mf-match-detail-actions :is(button,a) {
    padding:.55rem .4rem;
  }

  .mf-team-fixture {
    grid-template-columns:1fr;
  }
}

@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after {
    scroll-behavior:auto!important;
    transition:none!important;
  }
}
