/* =========================================
   DETALHE DA PARTIDA — Premium + theme-aware
========================================= */

.sbb-matchdetail .mono{
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: .95em;
}

/* HERO layout */
.md-hero-inner{
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 16px;
  align-items: stretch;
}

/* HERO title (premium) */
.matches-hero-title .md-title{
  margin: 6px 0 6px;
  line-height: 1.1;
  letter-spacing: -0.02em;
}

.matches-hero-title .md-title-row{
  display:flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 10px;
}

.matches-hero-title .md-title-link{
  color: inherit;
  text-decoration: none;
}

.matches-hero-title .md-title-link:hover{
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}

.matches-hero-title .md-title-label{
  font-size: 22px;
  font-weight: 900;
}

.matches-hero-title .md-title-main{
  font-size: 30px;
  font-weight: 950;
}

.matches-hero-title .md-title-series{
  margin-top: 8px;
  gap: 10px;
}

.matches-hero-title .md-title-series-label{
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  opacity: .72;
}

.matches-hero-title .md-title-series-list{
  display:inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.matches-hero-title .md-id-badge{
  display:inline-flex;
  align-items:center;
  padding: 5px 10px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: transparent;
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  color: inherit;
  text-decoration: none;
  transition: transform .14s ease, border-color .14s ease, box-shadow .14s ease;
}

.matches-hero-title .md-id-badge:hover{
  transform: translateY(-1px);
  border-color: currentColor;
}

.matches-hero-title .md-id-badge.is-active{
  border-color: currentColor;
  box-shadow: 0 0 0 1px currentColor;
}

.md-sub{
  margin: 10px 0 0;
  font-size: 13px;
}

.md-sub .sep{ margin: 0 8px; opacity: .6; }

.md-actions{
  display:flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
}

.md-actions .chipx{
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
}

/* clickable cursor */
.sbb-matchdetail button,
.sbb-matchdetail a,
.sbb-matchdetail .chipx,
.sbb-matchdetail .tab,
.sbb-matchdetail .tab-link,
.sbb-matchdetail .tag,
.sbb-matchdetail [data-open],
.sbb-matchdetail [role="button"]{
  cursor: pointer;
}

/* header actions */
.md-head-left{
  display:flex;
  align-items:center;
  gap: 12px;
  flex-wrap: wrap;
}

.md-head-actions{
  display:flex;
  align-items:center;
  gap: 10px;
  flex-wrap: wrap;
}

/* admin link card */
.admin-link-inline{
  margin-top: 12px;
  display:flex;
  align-items:center;
  gap: 10px;
  flex-wrap: wrap;
}

.admin-link-inline .chipx{
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
}

.admin-link-inline-id{
  font-weight: 900;
  font-size: 12px;
  opacity: .9;
}

.admin-link-actions-inline{
  display:flex;
  align-items:center;
  gap: 10px;
}

.admin-link-form-inline{ margin: 0; }

.admin-link-card{
  margin-top: 12px;
  padding: 14px;
  border-radius: 18px;
  background:
    radial-gradient(700px 220px at 18% 0%, rgba(250,204,21,0.22), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,0.90), rgba(255,255,255,0.78));
  border: 1px solid rgba(15,23,42,0.10);
  display:flex;
  flex-direction: column;
  gap: 12px;
  box-shadow:
    0 18px 48px rgba(15,23,42,0.10),
    0 2px 0 rgba(250,204,21,0.10) inset;
  backdrop-filter: blur(10px);
  position: relative;
  overflow: hidden;
}

.admin-link-card--modal{
  margin-top: 0;
}

.admin-modal-head{
  display:flex;
  justify-content: flex-end;
  width: 100%;
  margin-left: auto;
  padding: 18px 12px;
  border-bottom: 1px solid rgba(15,23,42,0.06);
  background: transparent;
  position: relative;
}

.admin-modal-head [data-admin-close]{
  position: absolute;
  right: 12px;
  top: 10px;
}

.admin-link-head{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.admin-link-brand{
  display:flex;
  align-items:center;
  gap: 10px;
  flex-wrap: wrap;
}

.admin-link-title{
  font-weight: 900;
  font-size: 13px;
  letter-spacing: .02em;
  color: rgba(15,23,42,0.92);
}

.admin-link-status{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 7px 10px;
  border-radius: 999px;
  font-weight: 900;
  font-size: 12px;
  letter-spacing: .02em;
  border: 1px solid rgba(15,23,42,0.10);
  background: rgba(255,255,255,0.55);
}

.admin-link-status .dot{
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: rgba(148,163,184,0.95);
  box-shadow: 0 0 0 4px rgba(148,163,184,0.16);
}

.admin-link-status.is-linked{
  border-color: rgba(34,197,94,0.22);
  background: rgba(34,197,94,0.08);
  color: rgba(15,23,42,0.92);
}
.admin-link-status.is-linked .dot{
  background: rgba(34,197,94,0.95);
  box-shadow: 0 0 0 4px rgba(34,197,94,0.16);
}

.admin-link-status.is-unlinked{
  border-color: rgba(148,163,184,0.22);
  background: rgba(148,163,184,0.08);
  color: rgba(15,23,42,0.85);
}

.md-sub-status .admin-link-status{
  padding: 0;
  border: 0;
  background: transparent;
  font-weight: 800;
  font-size: 13px;
}

.md-sub-status .admin-link-status .dot{
  box-shadow: 0 0 0 3px rgba(148,163,184,0.16);
}

.md-sub-status .admin-link-status.is-linked .dot{
  box-shadow: 0 0 0 3px rgba(34,197,94,0.16);
}

.admin-link-current{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 16px;
  border: 1px solid rgba(15,23,42,0.08);
  background: rgba(255,255,255,0.58);
}

.admin-link-current-left{
  display:flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
  min-width: 0;
}

.admin-link-current .lbl{
  font-size: 12px;
  font-weight: 900;
  opacity: .72;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.admin-link-current .val{
  font-size: 13px;
  font-weight: 900;
}

.admin-link-open{
  white-space: nowrap;
}

.admin-link-alert{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:12px;
  font-weight:800;
  font-size:13px;
  border:1px solid transparent;
  background:rgba(2,6,23,0.04);
  color:#0f172a;
}
.admin-link-alert i{ font-size:14px; }
.admin-link-alert.is-ok{
  border-color: rgba(16,185,129,0.25);
  background: rgba(16,185,129,0.12);
  color: #065f46;
}
.admin-link-alert.is-error{
  border-color: rgba(239,68,68,0.25);
  background: rgba(239,68,68,0.12);
  color: #7f1d1d;
}
body:not(.theme-light) .admin-link-alert{
  color: rgba(226,232,240,.92);
  background: rgba(2,6,23,0.45);
  border-color: rgba(255,255,255,0.08);
}
body:not(.theme-light) .admin-link-alert.is-ok{
  color: #bbf7d0;
  background: rgba(16,185,129,0.16);
  border-color: rgba(16,185,129,0.35);
}
body:not(.theme-light) .admin-link-alert.is-error{
  color: #fecaca;
  background: rgba(239,68,68,0.18);
  border-color: rgba(239,68,68,0.35);
}

.admin-link-empty{
  display:flex;
  gap: 10px;
  align-items:flex-start;
  padding: 10px 12px;
  border-radius: 16px;
  border: 1px dashed rgba(15,23,42,0.16);
  background: rgba(255,255,255,0.46);
}

.admin-link-empty i{
  margin-top: 2px;
  opacity: .75;
}

.admin-link-empty .t{
  font-weight: 900;
  font-size: 13px;
  color: rgba(15,23,42,0.92);
}

.admin-link-empty .s{
  margin-top: 2px;
  font-size: 12px;
  opacity: .78;
}

.admin-link-body{
  display:flex;
  flex-direction: column;
  gap: 12px;
}

.admin-link-form{
  display:flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.admin-link-input{
  display:flex;
  align-items:center;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,0.70);
  border: 1px solid rgba(15,23,42,0.10);
  min-width: 240px;
  flex: 1 1 260px;
}

.admin-link-input i{
  opacity: .7;
}

.admin-link-input input{
  border: 0;
  outline: 0;
  background: transparent;
  color: inherit;
  width: 100%;
  font-weight: 700;
  font-size: 13px;
}

.admin-link-input:focus-within{
  border-color: rgba(250,204,21,0.38);
  box-shadow: 0 0 0 4px rgba(250,204,21,0.18);
}

.admin-link-actions{
  display:flex;
  gap: 8px;
  flex-wrap: wrap;
}

.admin-btn{ font-weight: 900; }

.admin-btn-primary{
  border-color: rgba(250,204,21,0.30) !important;
  background: rgba(250,204,21,0.16) !important;
}

.admin-btn-danger{
  border-color: rgba(239,68,68,0.28) !important;
  background: rgba(239,68,68,0.10) !important;
}

.admin-btn-danger[disabled]{
  opacity: .55;
  cursor: not-allowed;
  filter: grayscale(0.4);
}

/* score card */
.md-score{
  display:flex;
  align-items: stretch;
  justify-content: flex-end;
}

.score-card{
  width: 100%;
  border-radius: 18px;
  padding: 14px;
}

.score-top{
  display:flex;
  justify-content: space-between;
  align-items:center;
  gap: 10px;
}

.team-badge{
  display:inline-flex;
  gap: 8px;
  align-items:center;
  padding: 7px 10px;
  border-radius: 999px;
  font-weight: 800;
  font-size: 12px;
  letter-spacing: .02em;
}

.team-badge.red i, .team-dot.red{ color: #ef4444; }
.team-badge.blue i, .team-dot.blue{ color: #3b82f6; }

.score-mid{
  margin-top: 10px;
  display:flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 74px;
}

.score-num{
  font-weight: 900;
  font-size: 44px;
  line-height: 1;
  letter-spacing: -0.03em;
}

.score-x{
  font-weight: 900;
  font-size: 22px;
  opacity: .55;
  margin-top: 6px;
}

.score-na{
  display:flex;
  gap: 10px;
  align-items:center;
  font-weight: 800;
  font-size: 13px;
  opacity: .85;
}

.score-foot{
  margin-top: 10px;
  display:flex;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  font-size: 12px;
}

.score-foot .mini{
  display:inline-flex;
  gap: 8px;
  align-items:center;
  opacity: .9;
}

/* panel header tabs */
.md-head{
  align-items: center;
}

.md-tabs{
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.tab{
  border: 0;
  cursor: pointer;
  border-radius: 999px;
  padding: 9px 11px;
  font-weight: 800;
  font-size: 13px;
  display:inline-flex;
  gap: 8px;
  align-items:center;
}

.tab-link{
  border: 0;
  cursor: pointer;
  border-radius: 999px;
  padding: 9px 11px;
  font-weight: 800;
  font-size: 13px;
  display:inline-flex;
  gap: 8px;
  align-items:center;
  text-decoration: none;
}
.tab-link:hover{
  transform: translateY(-1px);
}

.tabpane{ display:none; }
.tabpane.is-active{ display:block; }

.md-body{
  padding: 16px;
}

/* teams grid */
.md-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.team-card{
  border-radius: 18px;
  padding: 14px;
}

.team-head{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}

.team-title{
  display:flex;
  align-items:center;
  gap: 10px;
}

.team-dot{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  box-shadow: 0 0 0 4px rgba(250,204,21,0.08);
}

.team-dot.red{ background: rgba(239,68,68,.85); box-shadow: 0 0 0 4px rgba(239,68,68,.10); }
.team-dot.blue{ background: rgba(59,130,246,.85); box-shadow: 0 0 0 4px rgba(59,130,246,.10); }

.count{
  font-size: 12px;
  font-weight: 900;
  padding: 4px 8px;
  border-radius: 999px;
}

.team-tag{
  font-size: 12px;
  font-weight: 900;
  padding: 6px 10px;
  border-radius: 999px;
  opacity: .9;
}

.players{
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
}

.player-pill{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  border-radius: 999px;
  padding: 8px 10px;
  text-decoration:none;
  font-weight: 800;
  font-size: 13px;
  max-width: 100%;
}

.player-pill span{
  overflow:hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 260px;
}

.md-emptyline{
  padding: 10px 12px;
  border-radius: 14px;
  font-size: 13px;
  display:flex;
  gap: 10px;
  align-items:center;
  opacity: .9;
}

/* kpis */
.md-kpis{
  margin-top: 12px;
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 10px;
}

.kpi{
  border-radius: 16px;
  padding: 10px 12px;
}

.kpi-label{
  display:block;
  font-size: 12px;
  font-weight: 900;
  opacity: .75;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.kpi-value{
  display:block;
  margin-top: 4px;
  font-weight: 900;
}

/* gifs */
.gif-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 12px;
}

.gif-card{
  border-radius: 18px;
  overflow:hidden;
}

.gif-head{
  padding: 12px 12px 10px;
  display:flex;
  gap: 10px;
  align-items:flex-start;
  justify-content: space-between;
}

.gif-title{
  display:flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.gif-index{
  font-weight: 900;
  font-size: 13px;
}

.gif-meta{
  display:inline-flex;
  gap: 8px;
  align-items:center;
  font-size: 12px;
  opacity: .8;
  min-width: 0;
}

.gif-meta .mono{
  overflow:hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 360px;
}

.gif-open{
  text-decoration:none;
  font-weight: 900;
  font-size: 12px;
  white-space: nowrap;
  border-radius: 999px;
  padding: 8px 10px;
}

.gif-media{
  padding: 0 12px 12px;
}

.gif-media img,
.gif-media video{
  width: 100%;
  display:block;
  border-radius: 14px;
  max-height: 360px;
  object-fit: cover;
}

.gif-raw{
  margin: 0;
  padding: 12px;
  border-radius: 14px;
  overflow:auto;
  max-height: 360px;
  white-space: pre-wrap;
}

/* raw */
.raw-card{
  border-radius: 18px;
  overflow:hidden;
}

.raw-head{
  padding: 12px 12px 10px;
  display:flex;
  gap: 10px;
  align-items:center;
  justify-content: space-between;
}

.raw-title{
  display:flex;
  gap: 10px;
  align-items:center;
}

.raw-title .muted{
  font-size: 12px;
  opacity: .75;
}

.raw-pre{
  margin: 0;
  padding: 14px;
  max-height: 520px;
  overflow:auto;
  white-space: pre;
}

/* “done” feedback */
.chipx.is-done,
#copyIdBtn.is-done,
#copyJsonBtn.is-done{
  transform: translateY(-1px);
}

/* =========================================================
   THEME: DARK (não theme-light)
========================================================= */
body:not(.theme-light) .score-card{
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(2,6,23,.34);
  backdrop-filter: blur(10px);
  box-shadow: 0 20px 55px rgba(2,6,23,.35);
}

body:not(.theme-light) .team-badge{
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(2,6,23,.24);
  color: rgba(226,232,240,.92);
}

body:not(.theme-light) .score-num{ color: rgba(255,255,255,.94); }
body:not(.theme-light) .score-num.red{ color: rgba(255,255,255,.94); }
body:not(.theme-light) .score-num.blue{ color: rgba(255,255,255,.94); }

body:not(.theme-light) .md-sub{ color: rgba(226,232,240,.78); }

body:not(.theme-light) .admin-link-card{
  border: 1px solid rgba(255,255,255,0.10);
  background:
    radial-gradient(700px 220px at 18% 0%, rgba(250,204,21,0.16), transparent 62%),
    rgba(2,6,23,.62);
  box-shadow: 0 20px 55px rgba(2,6,23,.40);
}

body:not(.theme-light) .admin-link-title{ color: rgba(226,232,240,.92); }

body:not(.theme-light) .admin-link-status{
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(2,6,23,.22);
  color: rgba(226,232,240,.88);
}

body:not(.theme-light) .admin-link-current{
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(2,6,23,.40);
  color: rgba(226,232,240,.92);
}

body:not(.theme-light) .admin-link-empty{
  border: 1px dashed rgba(255,255,255,0.14);
  background: rgba(2,6,23,.38);
  color: rgba(226,232,240,.86);
}

body:not(.theme-light) .admin-modal-head{
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

body:not(.theme-light) .admin-link-input{
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(2,6,23,.55);
  color: rgba(226,232,240,.92);
}

body:not(.theme-light) .admin-link-input input{
  color: rgba(226,232,240,.92);
}

body:not(.theme-light) .tab{
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(2,6,23,.30);
  color: rgba(226,232,240,.90);
}
body:not(.theme-light) .tab.is-active{
  border-color: rgba(250,204,21,0.22);
  background: rgba(250,204,21,0.10);
}
body:not(.theme-light) .tab-link{
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(2,6,23,.30);
  color: rgba(226,232,240,.90);
}
body:not(.theme-light) .tab-link.is-active{
  border-color: rgba(250,204,21,0.22);
  background: rgba(250,204,21,0.10);
}

body:not(.theme-light) .team-card{
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.02);
}
body:not(.theme-light) .team-card.red{
  background:
    radial-gradient(520px 160px at 20% 0%, rgba(239,68,68,0.12), transparent 70%),
    rgba(255,255,255,0.02);
}
body:not(.theme-light) .team-card.blue{
  background:
    radial-gradient(520px 160px at 20% 0%, rgba(59,130,246,0.12), transparent 70%),
    rgba(255,255,255,0.02);
}

body:not(.theme-light) .count{
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(2,6,23,.28);
  color: rgba(226,232,240,.88);
}

body:not(.theme-light) .team-tag{
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(2,6,23,.22);
  color: rgba(226,232,240,.80);
}

body:not(.theme-light) .player-pill{
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(2,6,23,.26);
  color: rgba(226,232,240,.92);
}
body:not(.theme-light) .player-pill:hover{
  border-color: rgba(250,204,21,0.22);
  background: rgba(2,6,23,.40);
  transform: translateY(-1px);
}

body:not(.theme-light) .md-emptyline{
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(2,6,23,.22);
  color: rgba(226,232,240,.82);
}

body:not(.theme-light) .kpi{
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(2,6,23,.28);
  color: rgba(226,232,240,.92);
}

body:not(.theme-light) .gif-card{
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.02);
}
body:not(.theme-light) .gif-open{
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(2,6,23,.28);
  color: rgba(226,232,240,.90);
}
body:not(.theme-light) .gif-open:hover{
  border-color: rgba(250,204,21,0.22);
  background: rgba(2,6,23,.42);
}

body:not(.theme-light) .gif-raw,
body:not(.theme-light) .raw-card{
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(2,6,23,.22);
  color: rgba(226,232,240,.90);
}

body:not(.theme-light) .raw-pre{
  background: rgba(2,6,23,.20);
  color: rgba(226,232,240,.90);
}

body:not(.theme-light) .gif-index{ color: rgba(255,255,255,.92); }

/* =========================================================
   THEME: LIGHT
========================================================= */
body.theme-light .score-card{
  border: 1px solid rgba(15,23,42,0.12);
  background: rgba(255,255,255,0.92);
  box-shadow: 0 18px 45px rgba(15,23,42,.10);
}

body.theme-light .team-badge{
  border: 1px solid rgba(15,23,42,0.12);
  background: rgba(255,255,255,0.92);
  color: rgba(15,23,42,.86);
}

body.theme-light .score-num{ color: #0f172a; }
body.theme-light .md-sub{ color: rgba(71,85,105,.92); }

body.theme-light .tab{
  border: 1px solid rgba(15,23,42,0.12);
  background: rgba(255,255,255,0.92);
  color: rgba(15,23,42,.88);
}
body.theme-light .tab.is-active{
  border-color: rgba(250,204,21,0.40);
  background: rgba(250,204,21,0.18);
}
body.theme-light .tab-link{
  border: 1px solid rgba(15,23,42,0.12);
  background: rgba(255,255,255,0.92);
  color: rgba(15,23,42,.88);
}
body.theme-light .tab-link.is-active{
  border-color: rgba(250,204,21,0.40);
  background: rgba(250,204,21,0.18);
}

body.theme-light .team-card{
  border: 1px solid rgba(15,23,42,0.12);
  background: rgba(255,255,255,0.92);
}
body.theme-light .team-card.red{
  background:
    radial-gradient(520px 160px at 20% 0%, rgba(239,68,68,0.10), transparent 70%),
    rgba(255,255,255,0.92);
}
body.theme-light .team-card.blue{
  background:
    radial-gradient(520px 160px at 20% 0%, rgba(59,130,246,0.10), transparent 70%),
    rgba(255,255,255,0.92);
}

body.theme-light .count{
  border: 1px solid rgba(15,23,42,0.12);
  background: rgba(15,23,42,0.03);
  color: rgba(15,23,42,.82);
}

body.theme-light .team-tag{
  border: 1px solid rgba(15,23,42,0.12);
  background: rgba(15,23,42,0.03);
  color: rgba(15,23,42,.78);
}

body.theme-light .player-pill{
  border: 1px solid rgba(15,23,42,0.12);
  background: rgba(255,255,255,0.92);
  color: rgba(15,23,42,.86);
}
body.theme-light .player-pill:hover{
  border-color: rgba(250,204,21,0.40);
  background: rgba(255,255,255,1);
  transform: translateY(-1px);
}

body.theme-light .md-emptyline{
  border: 1px solid rgba(15,23,42,0.12);
  background: rgba(255,255,255,0.92);
  color: rgba(71,85,105,.92);
}

body.theme-light .kpi{
  border: 1px solid rgba(15,23,42,0.12);
  background: rgba(255,255,255,0.92);
  color: rgba(15,23,42,.86);
}

body.theme-light .gif-card{
  border: 1px solid rgba(15,23,42,0.12);
  background: rgba(255,255,255,0.92);
}
body.theme-light .gif-open{
  border: 1px solid rgba(15,23,42,0.12);
  background: rgba(255,255,255,0.92);
  color: rgba(15,23,42,.86);
}
body.theme-light .gif-open:hover{
  border-color: rgba(250,204,21,0.40);
  background: rgba(255,255,255,1);
}

body.theme-light .gif-raw,
body.theme-light .raw-card{
  border: 1px solid rgba(15,23,42,0.12);
  background: rgba(255,255,255,0.92);
  color: rgba(15,23,42,.86);
}

body.theme-light .raw-pre{
  background: rgba(15,23,42,0.03);
  color: rgba(15,23,42,.86);
}

/* =========================================================
   RESPONSIVE
========================================================= */
@media (max-width: 980px){
  .md-hero-inner{ grid-template-columns: 1fr; }
  .gif-grid{ grid-template-columns: 1fr; }
  .md-grid{ grid-template-columns: 1fr; }
}

@media (max-width: 520px){
  .player-pill span{ max-width: 220px; }

  .matches-hero-title .md-title-label{ font-size: 18px; }
  .matches-hero-title .md-title-main{ font-size: 22px; }
  .matches-hero-title .md-id-badge{ padding: 4px 8px; font-size: 11px; }
}

/* =========================================
   SCOUTS — PREMIUM (theme-aware)
========================================= */

.sc-wrap{ display:flex; flex-direction:column; gap:12px; }

.sc-head{
  display:flex;
  justify-content: space-between;
  align-items:flex-start;
  gap: 12px;
  flex-wrap: wrap;
}

.sc-completes{
  margin-left: 18px;
  margin-top: 8px;
}

.sc-complete-row{ margin-bottom: 6px; }
.sc-complete-item{ margin-left: 8px; }

.sc-title{
  margin: 0;
  font-size: 18px;
  letter-spacing: -0.01em;
  display:flex;
  gap: 10px;
  align-items:center;
}

.sc-sub{
  margin: 6px 0 0;
  opacity: .82;
  font-size: 13px;
  max-width: 72ch;
}

.sc-controls{
  display:flex;
  flex-direction: column;
  gap: 10px;
  align-items:flex-end;
}

.sc-sort{ display:flex; gap:8px; flex-wrap: wrap; justify-content:flex-end; }

.sc-btn{
  border: 0;
  cursor: pointer;
  border-radius: 999px;
  padding: 9px 11px;
  font-weight: 900;
  font-size: 12px;
  display:inline-flex;
  gap: 8px;
  align-items:center;
  transition: transform .14s ease, filter .14s ease, background .14s ease, border-color .14s ease;
}

.sc-mini-note{
  font-size: 12px;
  opacity: .78;
  display:flex;
  gap: 8px;
  align-items:center;
}

/* Spotlight cards */
.sc-spotlight{
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 10px;
}

.spot-card{
  border-radius: 18px;
  padding: 12px;
  display:flex;
  flex-direction: column;
  gap: 8px;
}

.spot-k{
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  opacity: .72;
}

.spot-v{
  display:flex;
  gap: 10px;
  align-items:center;
  font-weight: 900;
  min-width: 0;
}

.spot-dot{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  flex: 0 0 auto;
}

.spot-dot.red{ background: rgba(239,68,68,.9); box-shadow: 0 0 0 4px rgba(239,68,68,.12); }
.spot-dot.blue{ background: rgba(59,130,246,.9); box-shadow: 0 0 0 4px rgba(59,130,246,.12); }

.spot-link{
  text-decoration:none;
  overflow:hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: inherit;
}

.spot-s{
  display:inline-flex;
  gap: 8px;
  align-items:center;
  font-size: 12px;
  font-weight: 900;
  opacity: .9;
}

/* Table */
.sc-tablewrap{
  border-radius: 18px;
  overflow:hidden;
}

/* Fix column gap: remove external gap and add internal divider */
.tabpane[data-pane="scouts"] .sc-columns{ gap: 0; }
.tabpane[data-pane="scouts"] .sc-col{ padding: 0 12px; box-sizing: border-box; }
.tabpane[data-pane="scouts"] .sc-col + .sc-col{ border-left: 1px solid rgba(0,0,0,0.06); }

/* When columns layout is used, hide the global tablehead and show per-column headers */
.sc-tablewrap > .sc-tablehead{ display:none; }
.sc-tablehead--col{
  display:grid;
  grid-template-columns: 2.2fr .8fr .9fr .45fr .45fr 1fr .8fr .9fr .25fr;
  gap:0;
  padding:8px 10px;
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  opacity:.7;
  border-bottom:1px solid rgba(0,0,0,0.04);
  margin-bottom:0;
}

.sc-tablehead{
  display:grid;
  grid-template-columns: 3fr .6fr .6fr .6fr .6fr .3fr;
  gap: 0;
  padding: 10px 12px;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  opacity: .75;
}

.sc-rows{ display:flex; flex-direction: column; }

.sc-row{ border-top: 1px solid rgba(255,255,255,0.08); }

.sc-rowbtn{
  width:100%;
  text-align:left;
  border: 0;
  background: transparent;
  cursor:pointer;

  display:grid;
  grid-template-columns: 3fr .6fr .6fr .6fr .6fr .3fr;
  align-items:center;
  padding: 12px;
  gap: 12px;
}

.cell{ min-width: 0; overflow:hidden; }
.cell.chev{ display:flex; justify-content:center; opacity:.75; }
.cell.awards{ display:flex; justify-content:center; align-items:center; overflow:visible; }
.cell.awards .chip-mvp, .cell.awards .chip-worst{ margin-left:0; }
.sc-row.is-open .cell.chev{ transform: rotate(180deg); }

.rank{
  font-weight: 900;
  font-size: 12px;
  opacity: .7;
  width: 40px;
  flex: 0 0 auto;
}

.pbox{ display:flex; gap: 10px; align-items:center; min-width:0; }
.pbox .mini-ava{ flex-shrink:0; box-sizing:border-box; }
.cell.player{ min-width:220px; }
.pname{ overflow:hidden; }
.mini-nick{ display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:260px; }
.pteamdot{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  flex: 0 0 auto;
}
.pteamdot.red{ background: rgba(239,68,68,.9); }
.pteamdot.blue{ background: rgba(59,130,246,.9); }

.pname{ display:flex; flex-direction: column; gap: 4px; min-width:0; overflow:hidden; }
.mini-nick{ overflow:hidden; text-overflow:ellipsis; }
.plink{
  font-weight: 900;
  text-decoration:none;
  overflow:hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display:inline-block;
  max-width: 520px;
}

.psub{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
  font-size: 12px;
  opacity: .78;
}
.psub .mini{ display:inline-flex; gap: 8px; align-items:center; }

.team-pill{
  font-weight: 900;
  font-size: 12px;
  border-radius: 999px;
  padding: 7px 10px;
  display:inline-flex;
  gap: 8px;
  align-items:center;
  justify-content:center;
  width: fit-content;
}

.team-pill.red{ border:1px solid rgba(239,68,68,.22); }
.team-pill.blue{ border:1px solid rgba(59,130,246,.22); }

.rating-pill{
  font-weight: 900;
  font-size: 12px;
  border-radius: 999px;
  padding: 7px 10px;
  display:inline-flex;
  gap: 8px;
  align-items:center;
  width: fit-content;
}

.small{
  display:block;
  font-size: 12px;
  opacity: .75;
  margin-top: 2px;
}

/* Pass bar */
.barline{
  height: 8px;
  border-radius: 999px;
  overflow:hidden;
  position: relative;
}
.bar{ height:100%; border-radius: 999px; }

/* Expand */
.sc-expand{
  padding: 0 12px 12px;
}

.sc-expandgrid{
  margin-top: 10px;
  display:grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

.sc-group{
  border-radius: 18px;
  padding: 12px;
}

.sc-ghead{
  display:flex;
  justify-content: space-between;
  gap: 10px;
  align-items: baseline;
  margin-bottom: 10px;
}
.sc-ghint{ font-size: 12px; opacity: .75; }

.sc-metrics{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
}

.sc-metric{
  border-radius: 16px;
  padding: 10px;
}

.m-top{
  display:flex;
  align-items:center;
  gap: 10px;
  min-width:0;
}
.m-ico{
  width: 34px;
  height: 34px;
  border-radius: 14px;
  display:grid;
  place-items:center;
  flex: 0 0 auto;
}
.m-label{
  font-size: 12px;
  font-weight: 900;
  opacity: .9;
  overflow:hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width:0;
}
.m-val{
  margin-left:auto;
  font-weight: 900;
  font-size: 12px;
  opacity: .95;
}

.m-barline{
  margin-top: 10px;
  height: 8px;
  border-radius: 999px;
  overflow:hidden;
}
.m-bar{ height:100%; border-radius: 999px; }

/* Footer note */
.sc-footnote{
  margin-top: 2px;
  display:flex;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  font-size: 12px;
  opacity: .75;
}
.sc-footnote .mini{ display:inline-flex; gap:8px; align-items:center; }

/* Responsive */
@media (max-width: 980px){
  .sc-spotlight{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .sc-tablehead, .sc-rowbtn{
    grid-template-columns: 3fr .6fr .6fr .6fr .6fr .3fr;
  }
  .sc-metrics{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 720px){
  .sc-tablehead{ display:none; }
  .sc-rowbtn{
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .cell.chev{ display:none; }
  .cell.team, .cell.rating, .cell.goals, .cell.assists, .cell.pass, .cell.def, .cell.bumps, .cell.err{
    display:flex;
    justify-content: space-between;
    align-items:center;
    padding-top: 8px;
    border-top: 1px solid rgba(255,255,255,0.08);
  }
  .cell.team::before{ content:"Time"; font-weight:900; opacity:.7; }
  .cell.rating::before{ content:"Rating"; font-weight:900; opacity:.7; }
  .cell.goals::before{ content:"Gols"; font-weight:900; opacity:.7; }
  .cell.assists::before{ content:"Assist"; font-weight:900; opacity:.7; }
  .cell.pass::before{ content:"Passe"; font-weight:900; opacity:.7; }
  .cell.def::before{ content:"Defesa"; font-weight:900; opacity:.7; }
  .cell.bumps::before{ content:"Bumpou"; font-weight:900; opacity:.7; }
  .cell.err::before{ content:"Erros"; font-weight:900; opacity:.7; }

  .sc-metrics{ grid-template-columns: 1fr; }
}

/* Player modal header: keep player name readable on mobile */
#playerModal .pm-headleft{
  display:flex;
  align-items:center;
  gap:10px;
  min-width: 0;
}

#playerModal #pmTitle{
  margin: 0;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#playerModal .pm-headcenter{
  min-width: 0;
}

@media (max-width: 640px){
  #playerModal .sbb-modal__head{
    flex-wrap: wrap;
    align-items: flex-start;
  }
  #playerModal .pm-headleft{
    flex: 1 1 100%;
  }
  #playerModal .pm-headcenter{
    flex: 1 1 100%;
  }
}

/* Modal */
.sbb-modal{ position:fixed; inset:0; display:flex; align-items:center; justify-content:center; z-index:1100; }
.sbb-modal[hidden]{ display:none; }
.sbb-modal__backdrop{ position:absolute; inset:0; background:rgba(2,6,23,0.5); backdrop-filter: blur(4px); }
.sbb-modal__sheet{ position:relative; width:min(920px, 96%); max-height:85vh; background:var(--card-bg, #fff); border-radius:12px; box-shadow:0 20px 60px rgba(2,6,23,0.2); z-index:2; display:flex; flex-direction:column; overflow:hidden; }
.sbb-modal__head{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 18px; border-bottom:1px solid rgba(0,0,0,0.06); flex:0 0 auto; }
.sbb-modal__body{ padding:16px 18px; overflow:auto; max-height: calc(85vh - 84px); }
.admin-modal-head{ position:relative; }
.admin-modal-head .ghost{
  width:36px;
  height:36px;
  padding:0;
  border-radius:10px;
  display:grid;
  place-items:center;
  background:#0f172a !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,0.18) !important;
  box-shadow:0 6px 16px rgba(2,6,23,0.25);
  background-clip: padding-box;
}
.admin-modal-head .ghost:hover{ filter: brightness(1.05); }
body.theme-light .admin-modal-head .ghost{
  background:#111827 !important;
  border-color: rgba(0,0,0,0.15) !important;
}
.pm-player{ display:flex; gap:16px; align-items:center; margin-bottom:14px; }
.pm-player .mini-ava{ width:64px; height:64px; flex:0 0 64px; border-radius:8px; overflow:hidden; box-shadow:0 6px 18px rgba(2,6,23,0.08); }
.pm-player .mini-ava img{ width:100%; height:100%; object-fit:cover; display:block; }
.pm-player .pm-hinfo{ display:flex; flex-direction:column; gap:6px; }
.pm-player .pm-hinfo h4{ margin:0; font-size:18px; font-weight:900; }
.pm-kv{ display:flex; gap:12px; align-items:center; font-weight:700; color:var(--muted,#6b7280); }
.pm-kpis{ display:flex; gap:8px; margin-top:6px; }
.pm-kpi{ background:var(--chip-bg,#f3f4f6); padding:6px 10px; border-radius:999px; font-weight:800; font-size:13px; box-shadow:0 6px 18px rgba(2,6,23,0.03); }
.pm-grid{ display:grid; gap:12px; margin-top:14px; align-items:start; }
.pm-metric{ border-radius:10px; padding:12px; background:linear-gradient(180deg,#fff,#fbfbfd); border:1px solid rgba(15,23,42,0.04); display:flex; flex-direction:column; gap:8px; min-height:64px; }
.pm-metric .m-sub{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pm-metric.good{ border-left:4px solid #10b981; }
.pm-metric.bad{ border-left:4px solid #f97316; }
.pm-metric .m-top{ display:flex; align-items:center; gap:10px; }
.pm-metric .m-top > div:nth-child(2) { flex:1; min-width:0; }
.pm-metric .m-label{ font-weight:800; font-size:13px; color:var(--muted,#374151); white-space:normal; word-break:break-word; overflow:visible; }
.pm-metric .m-value { margin-left:12px; flex:0 0 auto; align-self:center; white-space:nowrap; }
.pm-metric .m-value{ font-weight:900; font-size:18px; margin-left:auto; color:var(--p-ink,#0f172a); }
.pm-metric .m-sub{ font-size:12px; color:var(--muted,#6b7280); }
.pm-metric .m-ico{ width:36px; height:36px; border-radius:8px; display:grid; place-items:center; background:rgba(0,0,0,0.04); }

.pm-metric .m-points{
  font-size:11px;
  font-weight:900;
  letter-spacing:0.2px;
}
.pm-metric .m-points.pos{ color: var(--ok); }
.pm-metric .m-points.neg{ color: var(--hot); }
.pm-metric .m-points.zero{ color: var(--muted,#6b7280); opacity:0.85; }

.pm-foottotal .m-points{ font-size:0.9rem; }

.pm-player-total{
  margin-top:2px;
  font-size:12px;
  font-weight:800;
  color: var(--muted,#6b7280);
}
.pm-player-total .m-points{
  font-size:12px;
  font-weight:900;
  letter-spacing:0.2px;
}
.pm-player-total .m-points.pos{ color: var(--ok); }
.pm-player-total .m-points.neg{ color: var(--hot); }
.pm-player-total .m-points.zero{ color: var(--muted,#6b7280); opacity:0.85; }

.pm-player-time{
  margin-top:2px;
  font-size:12px;
  font-weight:800;
  color: var(--muted,#6b7280);
}

.pm-foot{ border-top: 1px solid var(--line); }
.pm-foot-inner{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap: 12px;
  padding: 10px 18px 14px 18px;
}
.pm-foottotal,
.pm-footdate{
  font-size: 0.88rem;
  color: var(--muted);
}

.comment-counter{
  display:block;
  margin-top: 3px;
  font-size: 0.5rem;
  color: var(--muted);
}

@media (max-width:720px){ .pm-grid{ gap:12px; } }

/* =======================
   THEME: DARK
======================= */
body:not(.theme-light) .sc-btn{
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(2,6,23,.28);
  color: rgba(226,232,240,.92);
}
body:not(.theme-light) .sc-btn:hover{ transform: translateY(-1px); border-color: rgba(250,204,21,0.22); }
body:not(.theme-light) .sc-btn.is-active{
  border-color: rgba(250,204,21,0.22);
  background: rgba(250,204,21,0.10);
}

body:not(.theme-light) .spot-card,
body:not(.theme-light) .sc-tablewrap,
body:not(.theme-light) .sc-group,
body:not(.theme-light) .sc-metric{
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(2,6,23,.22);
}

body:not(.theme-light) .sc-tablehead{
  border-bottom: 1px solid rgba(255,255,255,0.08);
  background: rgba(2,6,23,.28);
}

body:not(.theme-light) .sc-rowbtn:hover{
  background: rgba(255,255,255,0.03);
}

body:not(.theme-light) .team-pill.red{ background: rgba(239,68,68,.08); color: rgba(226,232,240,.92); }
body:not(.theme-light) .team-pill.blue{ background: rgba(59,130,246,.08); color: rgba(226,232,240,.92); }

body:not(.theme-light) .rating-pill{
  border: 1px solid rgba(250,204,21,0.22);
  background: rgba(250,204,21,0.10);
  color: rgba(226,232,240,.92);
}

body:not(.theme-light) .barline,
body:not(.theme-light) .m-barline{
  background: rgba(255,255,255,0.08);
}
body:not(.theme-light) .bar,
body:not(.theme-light) .m-bar{
  background: rgba(250,204,21,0.80);
}

body:not(.theme-light) .m-ico{
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.03);
  color: rgba(226,232,240,.92);
}

body:not(.theme-light) .sc-metric.bad .m-bar{ background: rgba(251,113,133,0.85); }
body:not(.theme-light) .sc-metric.bad .m-ico{ border-color: rgba(251,113,133,0.25); background: rgba(251,113,133,0.08); }

/* =======================
   THEME: LIGHT
======================= */
body.theme-light .sc-btn{
  border: 1px solid rgba(15,23,42,0.12);
  background: rgba(255,255,255,0.92);
  color: rgba(15,23,42,.88);
}
body.theme-light .sc-btn:hover{ transform: translateY(-1px); border-color: rgba(250,204,21,0.40); }
body.theme-light .sc-btn.is-active{
  border-color: rgba(250,204,21,0.40);
  background: rgba(250,204,21,0.18);
}

body.theme-light .spot-card,
body.theme-light .sc-tablewrap,
body.theme-light .sc-group,
body.theme-light .sc-metric{
  border: 1px solid rgba(15,23,42,0.12);
  background: rgba(255,255,255,0.92);
}

body.theme-light .sc-tablehead{
  border-bottom: 1px solid rgba(15,23,42,0.10);
  background: rgba(15,23,42,0.03);
}

body.theme-light .sc-rowbtn:hover{
  background: rgba(15,23,42,0.02);
}

body.theme-light .team-pill.red{ background: rgba(239,68,68,.08); color: rgba(15,23,42,.88); }
body.theme-light .team-pill.blue{ background: rgba(59,130,246,.08); color: rgba(15,23,42,.88); }

body.theme-light .rating-pill{
  border: 1px solid rgba(250,204,21,0.40);
  background: rgba(250,204,21,0.18);
  color: rgba(15,23,42,.88);
}

body.theme-light .barline,
body.theme-light .m-barline{
  background: rgba(15,23,42,0.10);
}
body.theme-light .bar,
body.theme-light .m-bar{
  background: rgba(250,204,21,0.90);
}

body.theme-light .m-ico{
  border: 1px solid rgba(15,23,42,0.12);
  background: rgba(15,23,42,0.03);
  color: rgba(15,23,42,.88);
}

body.theme-light .sc-metric.bad .m-bar{ background: rgba(251,113,133,0.90); }
body.theme-light .sc-metric.bad .m-ico{ border-color: rgba(251,113,133,0.35); background: rgba(251,113,133,0.10); }
/* =========================================
   MODAL SCOUT — FOOTBALL PRO
========================================= */

.sbb-modal__sheet{
  border-radius: 20px;
  overflow: hidden;
  animation: modalIn .28s ease;
}

@keyframes modalIn{
  from{ opacity:0; transform: translateY(10px) scale(.98); }
  to{ opacity:1; transform:none; }
}

/* ===== HEADER ===== */
.pm-header{
  display:grid;
  grid-template-columns: auto 1fr auto;
  gap:16px;
  align-items:center;
  padding:20px 22px;
}

.pm-header .mini-ava{
  width:72px;
  height:72px;
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 12px 30px rgba(0,0,0,.25);
}

.pm-hinfo h4{
  margin:0;
  font-size:22px;
  font-weight:900;
  letter-spacing:-.02em;
}

.pm-hinfo .pm-sub{
  margin-top:6px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  font-size:13px;
  opacity:.8;
}

.pm-rating{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  border-radius:16px;
  padding:12px 14px;
  min-width:90px;
}

.pm-rating .val{
  font-size:28px;
  font-weight:900;
  line-height:1;
}

.pm-rating .lbl{
  font-size:12px;
  font-weight:900;
  letter-spacing:.12em;
  opacity:.7;
}

/* ===== SCORE CARDS ===== */
.pm-scorecards{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap:12px;
  padding:16px 22px;
}

.pm-score{
  border-radius:16px;
  padding:14px;
  display:flex;
  flex-direction:column;
  gap:6px;
}

.pm-score .lbl{
  font-size:12px;
  font-weight:900;
  letter-spacing:.1em;
  opacity:.7;
  text-transform:uppercase;
}

.pm-score .val{
  font-size:24px;
  font-weight:900;
}

/* ===== BARS ===== */
.pm-bars{
  padding:18px 22px;
  display:flex;
  flex-direction:column;
  gap:14px;
}

.pm-bar{
  display:grid;
  grid-template-columns: 120px 1fr 44px;
  gap:12px;
  align-items:center;
}

.pm-bar .name{
  font-size:13px;
  font-weight:900;
  opacity:.85;
}

.pm-bar .track{
  height:10px;
  border-radius:999px;
  overflow:hidden;
}

.pm-bar .fill{
  height:100%;
  border-radius:999px;
  transition:width .4s ease;
}

.pm-bar .num{
  text-align:right;
  font-weight:900;
  font-size:13px;
}

/* ===== GRID MÉTRICAS ===== */
.pm-grid{
  padding:18px 22px 22px;
  display:grid;
  gap:12px;
}

.pm-metric{
  border-radius:16px;
  padding:14px;
}

.pm-metric .top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:6px;
}

.pm-metric .name{
  font-size:13px;
  font-weight:900;
  opacity:.85;
}

.pm-metric .value{
  font-size:16px;
  font-weight:900;
}

/* ===== DARK ===== */
body:not(.theme-light) .sbb-modal__sheet{
  background: linear-gradient(180deg, #0b1220, #050712);
  border:1px solid rgba(255,255,255,.12);
}

body:not(.theme-light) .pm-header{
  border-bottom:1px solid rgba(255,255,255,.08);
}

body:not(.theme-light) .pm-rating{
  background: rgba(250,204,21,.12);
  border:1px solid rgba(250,204,21,.35);
  color:#fde68a;
}

body:not(.theme-light) .pm-score,
body:not(.theme-light) .pm-metric{
  background: rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.10);
}

body:not(.theme-light) .pm-bar .track{
  background: rgba(255,255,255,.10);
}

body:not(.theme-light) .pm-bar .fill{
  background: linear-gradient(90deg,#facc15,#fde68a);
}

/* Improve modal text contrast in dark theme */
body:not(.theme-light) .pm-metric .m-label{ color: rgba(226,232,240,.92); }
body:not(.theme-light) .pm-metric .m-value{ color: rgba(255,255,255,.94); }
body:not(.theme-light) .pm-metric .m-sub{ color: rgba(226,232,240,.78); }
body:not(.theme-light) .pm-kv{ color: rgba(226,232,240,.82); }
body:not(.theme-light) .pm-player .pm-hinfo h4{ color: rgba(255,255,255,.95); }
body:not(.theme-light) .pm-player .pm-hinfo .pm-sub{ color: rgba(226,232,240,.82); }
body:not(.theme-light) .pm-metric .m-ico{ color: rgba(226,232,240,.92); background: rgba(255,255,255,0.03); }

/* negativo */
body:not(.theme-light) .neg .fill{
  background: linear-gradient(90deg,#fb7185,#fecdd3);
}

/* ===== LIGHT ===== */
body.theme-light .sbb-modal__sheet{
  background: #ffffff;
  border:1px solid rgba(15,23,42,.14);
}

body.theme-light .pm-header{
  border-bottom:1px solid rgba(15,23,42,.08);
}

body.theme-light .pm-rating{
  background: rgba(250,204,21,.22);
  border:1px solid rgba(250,204,21,.45);
  color:#92400e;
}

body.theme-light .pm-score,
body.theme-light .pm-metric{
  background: rgba(15,23,42,.02);
  border:1px solid rgba(15,23,42,.12);
}

body.theme-light .pm-bar .track{
  background: rgba(15,23,42,.12);
}

body.theme-light .pm-bar .fill{
  background: linear-gradient(90deg,#facc15,#fde68a);
}

body.theme-light .neg .fill{
  background: linear-gradient(90deg,#fb7185,#fecdd3);
}

/* ===== RESPONSIVE ===== */
@media (max-width:720px){
  .pm-scorecards{ grid-template-columns: repeat(2,1fr); }
  .pm-grid{ gap:12px; }
}