/* Partida A. Deliberately scoped: shell, approved menus, other routes and
   permission/data controllers remain owned by their existing modules. */
#app.match-approved {
  container: match-approved / inline-size;
  min-width: 0;
  --match-neutral: var(--inset);
}
[data-theme="dark"] #app.match-approved {
  --bg: #161616;
  --panel: #202020;
  --inset: #262626;
  --text: #f6f6f6;
  --muted: #b4b4b4;
  --line: #3e3e3e;
  --soft: #2d2d2d;
  --match-neutral: #a7a7a7;
}
#app.match-approved > .back { margin-bottom: 4px; }
#app.match-approved .matchhero {
  margin: 8px 0 22px;
  padding: 22px 24px 16px;
  border-radius: 14px;
  box-shadow: none;
}
#app.match-approved .match-league { font-size: 12px; }
#app.match-approved .matchscore {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  gap: 22px;
  margin: 26px auto;
  align-items: center;
}
#app.match-approved .matchscore > a {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  min-width: 0;
  font-size: 22px;
  line-height: 1.3;
  overflow-wrap: anywhere;
}
#app.match-approved .matchscore > a:last-child { flex-direction: row-reverse; }
#app.match-approved .matchscore > a > br { display: none; }
#app.match-approved .matchscore .crest { width: 60px; height: 64px; flex-shrink: 0; }
#app.match-approved .matchscore > b {
  font-size: 44px;
  line-height: 1.15;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  letter-spacing: -1.4px;
}
#app.match-approved .match-status { flex-wrap: wrap; gap: 10px; }
#app.match-approved .match-status > button { min-width: 44px; min-height: 44px; }
#app.match-approved > nav.tabs {
  display: flex;
  flex-wrap: wrap;
  overflow: visible;
  gap: 5px;
  margin: 0 0 22px;
  padding: 0 0 12px;
}
#app.match-approved > nav.tabs > :is(button, a) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 10px 13px;
  border: 0;
  border-radius: 8px;
  font-size: 13px;
  line-height: 1.35;
  white-space: normal;
  text-align: center;
}
#app.match-approved > nav.tabs > :is([aria-current], .selected) {
  color: var(--text);
  background: var(--inset);
  box-shadow: inset 0 -2px var(--accent);
}
#app.match-approved .match-approved-layout { display: grid; gap: 18px; min-width: 0; }
#app.match-approved .match-approved-context { min-width: 0; }
#app.match-approved .match-approved-context .match-phase-heading {
  margin: 0 0 14px;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel);
  align-items: flex-start;
}
#app.match-approved .match-phase-heading h1 { font-size: 23px; margin: 6px 0 10px; }
#app.match-approved .match-phase-heading p { font-size: 13px; }
#app.match-approved .match-phase-heading .eyebrow { color: var(--muted); }
#app.match-approved .match-phase-heading .chat-context-link { display: inline-flex; align-items: center; min-height: 44px; }
#app.match-approved .match-approved-context > .match-data-note {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 16px 20px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel);
  line-height: 1.6;
  overflow-wrap: anywhere;
}
#app.match-approved #tab-content { min-width: 0; }
#app.match-approved #tab-content > .panel:first-child { margin-top: 0; }
#app.match-approved #tab-content > .match-data-note { flex-wrap: wrap; line-height: 1.6; }
#app.match-approved .panel { border-radius: 12px; box-shadow: none; }
#app.match-approved :is(.stat, .compare-stat) { font-variant-numeric: tabular-nums; }
#app.match-approved .stat { padding: 14px 0; margin: 0; border-bottom: 1px solid var(--line); }
#app.match-approved .stat > b { font-size: 20px; }
#app.match-approved .stat > span { align-self: center; }
#app.match-approved .stat .bars { margin-top: 5px; background: var(--match-neutral); }
#app.match-approved .stat-teams { padding-bottom: 14px; font-size: 12px; }
#app.match-approved .more-stats > .visible-heading { padding: 18px 0 10px; }
#app.match-approved .match-stats-v2 { min-width: 0; }
#app.match-approved .stat-groups { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
#app.match-approved .stat-group { min-width: 0; }
#app.match-approved .compare-tracks > span:last-child > i { background: var(--match-neutral); }
#app.match-approved .lineup-controls { flex-wrap: wrap; }
#app.match-approved .lineup-switch { flex-wrap: wrap; }
#app.match-approved .lineup-switch button { min-height: 44px; }
#app.match-approved :is(.row, .h2h-row, .h2h-team) { min-width: 0; }
#app.match-approved .row { overflow-wrap: anywhere; }
#app.match-approved .row > b { min-width: 0; }
#app.match-approved .venue-photo { max-width: 100%; }
@container match-approved (min-width: 760px) {
  #app.match-approved-statistics .match-approved-layout {
    grid-template-columns: minmax(0, 1fr) minmax(240px, .55fr);
    align-items: start;
  }
  #app.match-approved-statistics #tab-content { grid-column: 1; grid-row: 1; }
  #app.match-approved-statistics .match-approved-context { grid-column: 2; grid-row: 1; }
  #app.match-approved-statistics .match-phase-heading { flex-direction: column; gap: 16px; }
}
@container match-approved (max-width: 759px) {
  #app.match-approved .matchhero { padding: 18px 14px; }
  #app.match-approved .matchscore { gap: 12px; margin: 24px 0; }
  #app.match-approved .matchscore > a,
  #app.match-approved .matchscore > a:last-child { flex-direction: column; gap: 9px; font-size: 16px; }
  #app.match-approved .matchscore .crest { width: 48px; height: 52px; }
  #app.match-approved .matchscore > b { font-size: 34px; }
  #app.match-approved .match-approved-context .match-phase-heading { gap: 14px; flex-wrap: wrap; }
}
@container match-approved (max-width: 460px) {
  #app.match-approved .matchhero { padding: 16px 10px; }
  #app.match-approved .matchscore { gap: 9px; }
  #app.match-approved .matchscore > a,
  #app.match-approved .matchscore > a:last-child { font-size: 14px; }
  #app.match-approved .matchscore > b { font-size: 29px; letter-spacing: -1px; }
  #app.match-approved .matchscore .crest { width: 42px; height: 46px; }
  #app.match-approved > nav.tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }
  #app.match-approved > nav.tabs > :is(button, a) { padding: 9px 4px; font-size: 12px; }
  #app.match-approved .match-phase-heading h1 { font-size: 21px; }
  #app.match-approved .match-approved-context .match-phase-heading { padding: 16px; }
  #app.match-approved .match-approved-context > .match-data-note { padding: 14px 16px; }
  #app.match-approved .stat { grid-template-columns: 32px minmax(0, 1fr) 32px; font-size: 13px; }
  #app.match-approved .stat > b { font-size: 18px; }
}
@media (prefers-contrast: more) {
  #app.match-approved { --line: #808080; }
  [data-theme="dark"] #app.match-approved { --muted: #dedede; }
}
/* Approved A keeps the selected section first on mobile and its context beside it on wide screens. */
#app.match-approved-statistics #tab-content > .match-stats-v2 {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--panel);
  padding: 22px;
}
#app.match-approved-statistics .match-stats-v2 .section-head h2 { margin: 0; }
#app.match-approved-statistics .match-stats-v2 .stat-teams { padding: 12px 0; border-bottom: 1px solid var(--line); }
#app.match-approved-statistics .match-stats-v2 .compare-stat { padding: 14px 0; }
#app.match-approved-statistics .match-stats-v2 .compare-stat-label > b { font-size: 18px; color: var(--text); }
#app.match-approved-statistics .match-stats-v2 .compare-tracks i { background: var(--accent); }
#app.match-approved-statistics .match-stats-v2 .compare-tracks > span:last-child > i { background: var(--match-neutral); }
@container match-approved (max-width: 759px) {
  #app.match-approved-statistics #tab-content > .match-stats-v2 { padding: 18px 16px; }
}
