:root {
  --liga-navy-2: #12142B; --liga-navy-1: #08090F; --liga-navy-0: #04050A;
  --liga-panel: #171326; --liga-line: rgba(255, 222, 122, .13); --liga-line-soft: rgba(154, 163, 198, .16);
  --liga-ink: #F2F4FF; --liga-muted: #B9C0DC; --liga-muted-2: #9AA3C6;
  --liga-gold: #FFDE7A; --liga-gold-deep: #D9A028; --liga-gold-ink: #3A2A05;
  --liga-grad-word: linear-gradient(175deg, #FFF8DC 0%, #FFDE7A 34%, #D9A028 100%);
  --liga-metal-gold: linear-gradient(175deg, #FFF8DC 0%, #FFDE7A 30%, #D9A028 100%);
  --liga-metal-silver: linear-gradient(175deg, #FDFEFF 0%, #D2DCE8 34%, #93A3B5 100%);
  --liga-metal-bronze: linear-gradient(175deg, #FFE3C4 0%, #E0A268 32%, #9C5A22 100%);
  --liga-foil-gold: linear-gradient(155deg, #FFF6D6 0%, #F0CE7A 20%, #B9862E 46%, #FFE9A8 64%, #8A6222 100%);
  --liga-totw: linear-gradient(168deg, #2B2340 0%, #171326 42%, #0C0A16 100%);
  --liga-metal-gold-ink: #3A2A05; --liga-metal-silver-ink: #1E2733; --liga-metal-bronze-ink: #3B1F08;
  --liga-up: #57D9A3; --liga-down: #F0787E; --liga-derby: #C88BFF;
}

[data-wtype^="liga-"] {
  container-type: inline-size;
  width: 100%; height: 100%; min-height: 0; min-width: 0; overflow: hidden;
  display: flex; flex-direction: column;
  font-family: var(--bh-display, Inter, system-ui, sans-serif);
  color: var(--liga-ink);
  background:
    radial-gradient(120% 90% at 50% 0%, rgba(255, 222, 122, .06), transparent 46%),
    linear-gradient(180deg, var(--liga-navy-2) 0%, #0E1024 62%, #0A0B18 100%);
}
.liga-num, [data-wtype^="liga-"] { font-variant-numeric: tabular-nums; }

.liga-head { display: flex; align-items: baseline; gap: clamp(6px, 2cqi, 10px); padding: clamp(9px, 3cqi, 15px) clamp(11px, 3.5cqi, 16px) clamp(5px, 1.5cqi, 9px); }
.liga-title { font-weight: 800; font-size: clamp(.8rem, 4.4cqi, 1.05rem); letter-spacing: -.01em; }
.liga-meta { font-size: clamp(.55rem, 2.6cqi, .72rem); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--liga-gold); opacity: .85; }
.liga-chip { margin: 0 clamp(11px, 3.5cqi, 16px); align-self: flex-start; font-size: clamp(.5rem, 2.4cqi, .66rem); font-weight: 800; letter-spacing: .06em; padding: clamp(2px, 1cqi, 4px) clamp(6px, 2cqi, 10px); border-radius: 999px; background: rgba(255, 222, 122, .12); color: var(--liga-gold); border: 1px solid var(--liga-line); }
.liga-empty { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; text-align: center; padding: clamp(12px, 5cqi, 26px); color: var(--liga-muted-2); }
.liga-empty-t { font-weight: 700; font-size: clamp(.72rem, 3.4cqi, .92rem); color: var(--liga-muted); }
.liga-empty-s { font-size: clamp(.6rem, 2.8cqi, .78rem); max-width: 30ch; }

.liga-medal { display: inline-grid; place-items: center; flex: none; width: clamp(15px, 5cqi, 22px); aspect-ratio: 1; border-radius: 24%; font-size: clamp(.5rem, 2.4cqi, .66rem); font-weight: 900; color: var(--liga-metal-gold-ink); background: var(--liga-metal-gold); }
.liga-medal.s { background: var(--liga-metal-silver); color: var(--liga-metal-silver-ink); }
.liga-medal.b { background: var(--liga-metal-bronze); color: var(--liga-metal-bronze-ink); }
.liga-medal.n { background: rgba(154, 163, 198, .14); color: var(--liga-muted-2); }
.liga-mv { font-size: clamp(.5rem, 2.4cqi, .66rem); font-weight: 900; padding: 1px clamp(3px, 1.4cqi, 6px); border-radius: 5px; color: #fff; }
.liga-mv.up { background: var(--liga-up); } .liga-mv.dn { background: var(--liga-down); }

.liga-tbl-wrap { overflow-x: auto; padding: clamp(4px, 1.5cqi, 8px) clamp(9px, 3cqi, 14px) clamp(9px, 3cqi, 14px); }
.liga-tbl { width: 100%; border-collapse: collapse; font-size: clamp(.62rem, 3cqi, .84rem); }
.liga-tbl th { text-align: right; font-size: clamp(.46rem, 2.1cqi, .6rem); font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--liga-muted-2); padding: 0 clamp(2px, 1cqi, 5px) clamp(5px, 1.5cqi, 8px); border-bottom: 1px solid var(--liga-line-soft); }
.liga-tbl th.l, .liga-tbl td.l, .liga-tbl td.mgr { text-align: left; }
.liga-tbl td { padding: clamp(4px, 1.6cqi, 8px) clamp(2px, 1cqi, 5px); border-top: 1px solid rgba(154, 163, 198, .08); }
.liga-tbl .rk { width: 1%; } .liga-tbl .mgr { font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 0; }
.liga-tbl .goals { color: var(--liga-muted); } .liga-tbl .p { font-weight: 900; color: var(--liga-gold); text-align: right; }
.liga-tbl tr.me td { background: linear-gradient(90deg, rgba(47, 107, 255, .18), rgba(47, 107, 255, .02)); }
.liga-tbl tr.me td:first-child { box-shadow: inset 3px 0 0 #57A6FF; }
.liga-tbl tr.me .mgr { color: #fff; }

.liga-fixtures { display: flex; flex-direction: column; gap: clamp(5px, 1.8cqi, 9px); padding: clamp(4px, 1.5cqi, 8px) clamp(9px, 3cqi, 14px) clamp(9px, 3cqi, 14px); }
.liga-fixture { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: clamp(6px, 2cqi, 10px); padding: clamp(6px, 2cqi, 11px) clamp(7px, 2.4cqi, 12px); border-radius: 12px; background: linear-gradient(180deg, rgba(255, 255, 255, .025), rgba(0, 0, 0, .12)); border: 1px solid var(--liga-line-soft); }
.liga-fixture.derby { grid-template-rows: auto auto; border-color: rgba(200, 139, 255, .38); background: linear-gradient(180deg, rgba(200, 139, 255, .09), rgba(0, 0, 0, .14)); }
.liga-fx-team { font-weight: 700; font-size: clamp(.62rem, 3cqi, .84rem); min-width: 0; }
.liga-fx-team.away { text-align: right; }
.liga-fx-live { display: block; font-size: clamp(.44rem, 2.1cqi, .58rem); font-weight: 700; color: var(--liga-up); text-transform: uppercase; letter-spacing: .04em; margin-top: 1px; }
.liga-fx-mid { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.liga-fx-score { font-weight: 900; font-size: clamp(.85rem, 4.4cqi, 1.2rem); padding: clamp(2px, 1cqi, 4px) clamp(6px, 2cqi, 11px); border-radius: 9px; background: rgba(0, 0, 0, .35); border: 1px solid var(--liga-line); color: #fff; }
.liga-fx-score.live { border-color: var(--liga-gold); box-shadow: 0 0 0 3px rgba(255, 222, 122, .1); }
.liga-fx-res { font-size: clamp(.44rem, 2.1cqi, .58rem); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.liga-fx-res.w { color: var(--liga-up); } .liga-fx-res.l { color: var(--liga-down); } .liga-fx-res.d { color: var(--liga-muted-2); }
.liga-derby { grid-column: 1 / -1; text-align: center; font-size: clamp(.46rem, 2.2cqi, .6rem); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--liga-derby); }

.liga-card { position: relative; container-type: inline-size; aspect-ratio: 33/47; border-radius: 6%; overflow: hidden; isolation: isolate; display: grid; grid-template-rows: 47% auto auto 1fr; color: var(--liga-metal-gold-ink); background: radial-gradient(130% 55% at 50% 8%, rgba(255, 255, 255, .42), transparent 58%), linear-gradient(108deg, transparent 36%, rgba(255, 255, 255, .3) 49%, transparent 63%), var(--liga-metal-gold); box-shadow: 0 6px 18px -8px rgba(0, 0, 0, .6); }
.liga-card.is-silver { color: var(--liga-metal-silver-ink); background: radial-gradient(130% 55% at 50% 8%, rgba(255, 255, 255, .5), transparent 58%), linear-gradient(108deg, transparent 36%, rgba(255, 255, 255, .34) 49%, transparent 63%), var(--liga-metal-silver); }
.liga-card.is-bronze { color: var(--liga-metal-bronze-ink); background: radial-gradient(130% 55% at 50% 8%, rgba(255, 255, 255, .36), transparent 58%), linear-gradient(108deg, transparent 36%, rgba(255, 255, 255, .26) 49%, transparent 63%), var(--liga-metal-bronze); }
.liga-card.is-totw { color: var(--liga-gold); background: radial-gradient(120% 70% at 50% 0%, rgba(124, 92, 255, .35), transparent 55%), var(--liga-totw); }
.liga-card.is-special { color: var(--liga-gold); background: radial-gradient(120% 70% at 50% 0%, rgba(200, 139, 255, .4), transparent 55%), linear-gradient(168deg, #2E2450 0%, #1A1330 44%, #0C0918 100%); }
.liga-card__foil { position: absolute; inset: 0; z-index: 4; pointer-events: none; mix-blend-mode: screen; opacity: .45; background: linear-gradient(115deg, transparent 36%, rgba(255, 255, 255, .5) 49%, transparent 62%); }
.liga-card__hero { position: relative; overflow: hidden; }
.liga-card__photo { position: absolute; inset: 0 0 0 22%; display: grid; place-items: center; font-weight: 900; font-size: clamp(1rem, 16cqi, 3rem); opacity: .34; -webkit-mask-image: linear-gradient(to bottom, #000 70%, transparent 99%); mask-image: linear-gradient(to bottom, #000 70%, transparent 99%); }
.liga-card__ovrbox { position: absolute; top: 9%; left: 9%; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; line-height: 1; }
.liga-card__ovr { font-weight: 800; font-size: clamp(1.1rem, 20cqi, 2.6rem); letter-spacing: -.04em; }
.liga-card__pos { font-weight: 800; font-size: clamp(.4rem, 5cqi, .8rem); letter-spacing: .1em; margin-top: 1px; opacity: .9; }
.liga-card__marks { display: flex; flex-direction: column; gap: 3px; margin-top: clamp(4px, 3cqi, 8px); }
.liga-card__tag { font-size: clamp(.34rem, 3.6cqi, .55rem); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; padding: 1px clamp(2px, 1.4cqi, 5px); border: 1px solid currentColor; border-radius: 4px; opacity: .8; white-space: nowrap; }
.liga-card__crystal { position: absolute; top: -3%; right: -6%; width: 40%; height: 34%; z-index: 3; clip-path: polygon(30% 0, 100% 14%, 78% 100%, 0 74%); background: linear-gradient(155deg, rgba(255, 255, 255, .9), rgba(150, 195, 255, .55) 55%, rgba(70, 100, 210, .35)); }
.liga-card__name { text-align: center; font-weight: 800; text-transform: uppercase; font-size: clamp(.6rem, 6.5cqi, 1.2rem); letter-spacing: -.005em; margin: 0 8%; padding-bottom: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.liga-card__sub { text-align: center; font-size: clamp(.4rem, 4cqi, .68rem); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; opacity: .6; margin: 0 10%; padding-bottom: clamp(3px, 1.5cqi, 6px); border-bottom: 1.5px solid currentColor; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.liga-card__stats { display: grid; grid-template-columns: 1fr 1fr; column-gap: clamp(6px, 5cqi, 16px); row-gap: 1px; align-content: start; padding: clamp(4px, 2cqi, 7px) 12% 0; }
.liga-card__stat { display: flex; align-items: baseline; gap: clamp(3px, 2cqi, 6px); }
.liga-card__stat b { font-weight: 800; font-size: clamp(.66rem, 6cqi, 1.15rem); min-width: 2.2ch; }
.liga-card__stat span { font-size: clamp(.36rem, 3.6cqi, .58rem); letter-spacing: .08em; font-weight: 700; opacity: .72; }

.liga-bane { flex: 1; display: flex; flex-direction: column; gap: clamp(5px, 1.8cqi, 9px); padding: clamp(4px, 1.5cqi, 8px) clamp(9px, 3cqi, 14px) clamp(9px, 3cqi, 14px); min-height: 0; }
.liga-bane-score { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: clamp(6px, 2cqi, 12px); }
.liga-bs-team { font-weight: 700; font-size: clamp(.66rem, 3.2cqi, .9rem); } .liga-bs-team.away { text-align: right; }
.liga-bs-num { font-weight: 900; font-size: clamp(1rem, 5.5cqi, 1.7rem); color: #fff; }
.liga-bs-xg { text-align: center; font-size: clamp(.5rem, 2.4cqi, .66rem); color: var(--liga-muted-2); font-weight: 700; }
.liga-pitch { flex: 1; min-height: clamp(80px, 30cqi, 200px); position: relative; border-radius: 12px; display: flex; flex-direction: column; overflow: hidden; background: repeating-linear-gradient(180deg, #0C0E20 0 8%, #0A0B18 8% 16%); border: 1px solid var(--liga-line-soft); }
.liga-pitch::before { content: ""; position: absolute; inset: 8%; border: 1px solid rgba(255, 222, 122, .12); border-radius: 8px; pointer-events: none; }
.liga-pitch-half { flex: 1; display: flex; align-items: center; justify-content: space-evenly; padding: clamp(4px, 2cqi, 10px); gap: clamp(3px, 1.5cqi, 8px); flex-wrap: wrap; }
.liga-pitch-mid { height: 1px; background: rgba(255, 222, 122, .12); }
.liga-pslot { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.liga-dot { width: clamp(20px, 8cqi, 40px); aspect-ratio: 1; border-radius: 50%; display: grid; place-items: center; font-weight: 800; font-size: clamp(.5rem, 3cqi, .82rem); color: var(--liga-metal-gold-ink); background: var(--liga-metal-gold); box-shadow: 0 2px 6px rgba(0, 0, 0, .4); }
.liga-dot.s { background: var(--liga-metal-silver); color: var(--liga-metal-silver-ink); }
.liga-dot.b { background: var(--liga-metal-bronze); color: var(--liga-metal-bronze-ink); }
.liga-dot.live { background: var(--liga-metal-gold); box-shadow: 0 0 0 2px var(--liga-up), 0 0 clamp(4px, 2cqi, 10px) rgba(87, 217, 163, .6); }
.liga-rl { font-size: clamp(.36rem, 2cqi, .52rem); font-weight: 700; color: var(--liga-muted-2); }
.liga-bane-ev { display: flex; flex-wrap: wrap; gap: clamp(4px, 1.6cqi, 8px); }
.liga-ev { font-size: clamp(.5rem, 2.4cqi, .68rem); color: var(--liga-muted); } .liga-ev b { color: var(--liga-gold); }

.liga-totw { display: grid; grid-template-columns: repeat(6, 1fr); gap: clamp(4px, 1.6cqi, 9px); padding: clamp(4px, 1.5cqi, 8px) clamp(9px, 3cqi, 14px) clamp(9px, 3cqi, 14px); }
@container (max-width: 340px) { .liga-totw { grid-template-columns: repeat(3, 1fr); } }
.liga-mini { display: flex; flex-direction: column; align-items: center; gap: 3px; min-width: 0; }
.liga-mini-card { position: relative; width: 100%; aspect-ratio: 33/45; border-radius: 12%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; background: var(--liga-totw); color: var(--liga-gold); }
.liga-mini-photo { width: 40%; aspect-ratio: 1; border-radius: 50%; display: grid; place-items: center; background: rgba(255, 255, 255, .12); border: 1.5px solid currentColor; font-weight: 800; font-size: clamp(.4rem, 5cqi, .72rem); }
.liga-mini-card b { font-weight: 800; font-size: clamp(.66rem, 9cqi, 1.2rem); line-height: 1; }
.liga-mini-card i { font-style: normal; font-size: clamp(.34rem, 3.5cqi, .55rem); letter-spacing: .06em; font-weight: 700; opacity: .8; }
.liga-mini em { font-style: normal; font-size: clamp(.5rem, 2.6cqi, .72rem); color: var(--liga-muted); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }

.liga-stjerne { flex: 1; display: grid; grid-template-columns: minmax(0, 40%) 1fr; gap: clamp(8px, 3cqi, 18px); align-items: center; padding: clamp(4px, 1.5cqi, 8px) clamp(11px, 3.5cqi, 16px) clamp(11px, 3.5cqi, 16px); }
.liga-hc-name { font-weight: 900; font-size: clamp(.9rem, 4.4cqi, 1.5rem); letter-spacing: -.02em; }
.liga-hc-role { color: var(--liga-muted); font-size: clamp(.6rem, 2.8cqi, .82rem); font-weight: 600; margin-top: 2px; }
.liga-honour { display: inline-block; margin-top: clamp(5px, 2cqi, 10px); font-size: clamp(.5rem, 2.4cqi, .68rem); font-weight: 800; color: var(--liga-gold); background: rgba(255, 222, 122, .1); border: 1px solid var(--liga-line); padding: clamp(3px, 1.2cqi, 5px) clamp(6px, 2cqi, 11px); border-radius: 999px; }
.liga-hc-ovr { margin-top: clamp(6px, 2.5cqi, 14px); font-weight: 900; font-size: clamp(1.2rem, 6cqi, 2.2rem); background: var(--liga-grad-word); -webkit-background-clip: text; background-clip: text; color: transparent; display: flex; align-items: baseline; gap: 6px; }
.liga-hc-ovr span { -webkit-text-fill-color: var(--liga-muted-2); font-size: clamp(.5rem, 2.2cqi, .64rem); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }

.liga-pakke { flex: 1; display: grid; grid-template-columns: auto 1fr; gap: clamp(8px, 3cqi, 16px); align-items: center; padding: clamp(6px, 2cqi, 10px) clamp(11px, 3.5cqi, 16px) clamp(11px, 3.5cqi, 16px); }
.liga-pack { position: relative; width: clamp(52px, 22cqi, 120px); aspect-ratio: 76/104; border-radius: 10px; overflow: hidden; flex: none; box-shadow: 0 14px 30px -12px rgba(80, 50, 150, .7); }
.liga-pack-foil { position: absolute; inset: 0; background: linear-gradient(158deg, #2A2160 0%, #161046 42%, #070518 100%); }
.liga-pack-glyph { position: absolute; inset: 22% 18% auto; display: grid; place-items: center; height: 40%; border-radius: 10px; background: var(--liga-metal-gold); color: var(--liga-gold-ink); font-weight: 900; font-size: clamp(.72rem, 6cqi, 1.3rem); }
.liga-pack-lab { position: absolute; left: 0; right: 0; bottom: 8%; text-align: center; font-size: clamp(.4rem, 2.6cqi, .62rem); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--liga-gold); }
.liga-pk-guar { font-weight: 800; font-size: clamp(.72rem, 3.4cqi, 1rem); }
.liga-pk-price { display: inline-flex; align-items: center; gap: clamp(5px, 2cqi, 8px); font-weight: 900; font-size: clamp(.9rem, 4.4cqi, 1.4rem); color: var(--liga-gold); margin-top: clamp(5px, 2cqi, 10px); }
.liga-coin { display: inline-grid; place-items: center; width: clamp(13px, 4cqi, 19px); aspect-ratio: 1; border-radius: 50%; background: var(--liga-metal-gold); color: var(--liga-gold-ink); font-size: clamp(.5rem, 2.4cqi, .7rem); font-weight: 900; }
.liga-pk-odds { font-size: clamp(.55rem, 2.6cqi, .72rem); color: var(--liga-muted-2); margin-top: 4px; }
.liga-qr { margin-top: clamp(6px, 2.5cqi, 12px); width: clamp(40px, 14cqi, 64px); border-radius: 8px; background: #fff; }

.liga-movers { display: flex; flex-direction: column; gap: clamp(4px, 1.5cqi, 7px); padding: clamp(4px, 1.5cqi, 8px) clamp(9px, 3cqi, 14px) clamp(9px, 3cqi, 14px); }
.liga-mover { display: flex; align-items: center; gap: clamp(6px, 2cqi, 10px); padding: clamp(4px, 1.6cqi, 8px) clamp(6px, 2cqi, 10px); border-radius: 12px; background: linear-gradient(180deg, rgba(255, 255, 255, .022), rgba(0, 0, 0, .1)); border: 1px solid var(--liga-line-soft); }
.liga-mv-av { display: grid; place-items: center; flex: none; width: clamp(24px, 9cqi, 34px); aspect-ratio: 1; border-radius: 26%; font-weight: 900; color: var(--liga-gold-ink); background: var(--liga-metal-gold); font-size: clamp(.55rem, 2.6cqi, .8rem); }
.liga-mv-who { flex: 1; min-width: 0; font-weight: 700; font-size: clamp(.62rem, 3cqi, .84rem); line-height: 1.1; }
.liga-mv-who small { display: block; color: var(--liga-muted-2); font-weight: 600; font-size: clamp(.48rem, 2.3cqi, .66rem); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.liga-komet { font-size: clamp(.4rem, 2cqi, .54rem); font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--liga-derby); background: rgba(200, 139, 255, .14); padding: 2px clamp(3px, 1.4cqi, 6px); border-radius: 5px; }
.liga-mv-ovr { font-weight: 900; font-size: clamp(.62rem, 3cqi, .84rem); color: var(--liga-gold); min-width: 2.2ch; text-align: center; }
.liga-mv-d { font-weight: 900; font-size: clamp(.62rem, 3cqi, .84rem); min-width: 3ch; text-align: right; }
.liga-mv-d.up { color: var(--liga-up); } .liga-mv-d.dn { color: var(--liga-down); }

@media (prefers-reduced-motion: reduce) { [data-wtype^="liga-"] * { animation: none !important; } }