/* Concept D — Glacier
   Cool, airy and modern: a soft aurora backdrop, frosted-glass panels, a floating
   capsule header and geometric type. Tables stay on solid white so data reads cleanly. */
:root[data-mode="light"] {
  --bg: #eaf1f8; --surface: #ffffff; --surface-2: #eef3f9; --line: rgba(15, 40, 80, .1); --ink: #0b1b2e; --ink-2: #5a6b82;
  --header-bg: rgba(255, 255, 255, .72); --ribbon-bg: transparent; --ribbon-ink: #0b1b2e;
  --glass: rgba(255, 255, 255, .62); --glass-edge: rgba(255, 255, 255, .85);
  --shadow: 0 1px 1px rgba(15, 40, 80, .04), 0 18px 40px -22px rgba(15, 40, 80, .35);
  --row-alt: #f6f9fc;
}
:root[data-mode="dark"] {
  --bg: #050b16; --surface: #0c1626; --surface-2: #13213a; --line: rgba(160, 200, 255, .12); --ink: #e8f1ff; --ink-2: #8aa0bf;
  --header-bg: rgba(12, 22, 38, .7); --ribbon-bg: transparent; --ribbon-ink: #e8f1ff;
  --glass: rgba(16, 30, 52, .55); --glass-edge: rgba(160, 200, 255, .14);
  --row-alt: #101d33;
}

/* aurora backdrop */
body { background: var(--bg); }
body::before { content: ""; position: fixed; inset: -20%; z-index: -1; pointer-events: none;
  background:
    radial-gradient(40% 35% at 15% 10%, color-mix(in srgb, var(--accent) 28%, transparent), transparent 70%),
    radial-gradient(35% 30% at 85% 5%, rgba(124, 58, 237, .18), transparent 70%),
    radial-gradient(45% 40% at 70% 70%, rgba(20, 184, 166, .14), transparent 70%),
    radial-gradient(40% 40% at 10% 85%, rgba(56, 189, 248, .16), transparent 70%);
  animation: aurora 30s ease-in-out infinite alternate; }
@keyframes aurora { to { transform: translate3d(3%, -2%, 0) rotate(3deg) scale(1.05); } }
:root[data-mode="dark"] body::before { opacity: .9; }

h1, h2, h3 { letter-spacing: -.025em; font-weight: 700; }
.sec-head h2 { font-size: 24px; }
.eyebrow { letter-spacing: .16em; }

/* frosted glass panels */
.game-card, .news-card, .ll, .up-list, .team-compare, .per-block, .pv-team, .stars li, .facts, .form-list, .tl-card, .sp-tile,
.quick-grid a, .teams-grid a, .series, .team-sched, .sch-day ul, .ranks div, .person, .cms-acc details, .cms-dl a, .quotes figure,
.ccard, .ds, .tstat-grid, .tcard, .div-chips a, .sp-card, .car-more, .lcard .ll, .team-rank {
  background: var(--glass); backdrop-filter: blur(18px) saturate(1.4); -webkit-backdrop-filter: blur(18px) saturate(1.4);
  box-shadow: inset 0 0 0 1px var(--glass-edge), var(--shadow);
}
.tbl-wrap, .mod .tbl.mini { box-shadow: inset 0 0 0 1px var(--glass-edge), var(--shadow); }
.tstat-grid div, .cms-stats div { background: transparent; }
.tstat-grid { background: var(--glass); gap: 0; }
.game-card:hover, .news-card:hover, .tcard:hover, .tl-card:hover { box-shadow: inset 0 0 0 1px var(--glass-edge), 0 24px 48px -20px rgba(15, 40, 80, .45); }
.gc-head { border-bottom-color: var(--line); }
.gc-foot { border-top-color: var(--line); } .gc-foot a + a { border-left-color: var(--line); }

/* floating capsule header + glass ribbon */
.site-header.floating .hdr { box-shadow: inset 0 0 0 1px var(--glass-edge), 0 14px 36px -18px rgba(10, 30, 60, .45); }
.nav a[data-nav] { font-weight: 600; font-size: 14px; }
:root { --util-bg: linear-gradient(90deg, #0b1b2e, color-mix(in srgb, var(--accent) 55%, #0b1b2e)); --util-ink: #e8f1ff; }
.nav a[data-nav]::after { left: 50%; right: auto; width: 5px; height: 5px; border-radius: 50%; transform: translateX(-50%) scale(0); bottom: 2px; }
.nav a[data-nav]:hover::after, .nav a[data-nav].on::after { transform: translateX(-50%) scale(1); }
.cta { background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 60%, #7c3aed)); }
.rb-cards { border-bottom: 0; }
.rb-cards .rb-game { background: var(--glass); backdrop-filter: blur(14px); box-shadow: inset 0 0 0 1px var(--glass-edge); border-radius: 16px; }
.rb-cards .rb-game.live { box-shadow: inset 0 0 0 1.5px var(--live), 0 8px 20px -12px var(--live); }
.rb-cards .rb-day { writing-mode: vertical-rl; transform: rotate(180deg); padding: 8px 2px; font-size: 10px; } .rb-cards .rb-day small { display: none; }
.rb-all { border-left: 0; }

/* hero: big rounded panel with an aurora edge */
.hero { border-radius: 32px; box-shadow: 0 30px 60px -30px rgba(10, 30, 60, .6); }
.hero::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18); }
.hero-copy .eyebrow { background: rgba(255, 255, 255, .14); }
.btn { border-radius: 99px; }
.hero .btn:not(.ghost) { background: #fff; color: #0b1b2e; }

.tabs { border-bottom: 0; gap: 4px; background: var(--glass); backdrop-filter: blur(14px); padding: 5px; border-radius: 99px; display: inline-flex; max-width: 100%; box-shadow: inset 0 0 0 1px var(--glass-edge); }
.tab { border-radius: 99px; padding: 8px 16px; z-index: 1; }
.tab-ink { top: 5px; bottom: 5px; height: auto; border-radius: 99px; background: var(--accent); box-shadow: 0 6px 16px -8px var(--accent); z-index: 0; }
.tab.on { color: var(--accent-ink); }
.mod-leaders .tabs, .mod-standings .tabs { display: flex; margin-bottom: 12px; } .mod-leaders .tab, .mod-standings .tab { flex: 1; padding: 7px 6px; font-size: 13px; }
.tabs-row { border-bottom: 0; align-items: center; } .tabs-row .tabs { flex: 0 1 auto; } .tabs-row .row-switch { margin: 0 0 0 auto; }
@media (max-width: 720px) { .tabs-row { align-items: stretch; } .tabs-row .row-switch { margin: 0; } .tabs-row .tabs { align-self: flex-start; } }
.game-sticky, .game-sticky .tabs-row, .game-sticky > .tabs { background: transparent; }
.game-sticky.stuck { box-shadow: none; }
.game-sticky.stuck > .tabs { margin-top: 6px; }

.seg, .sel, .combo-btn, .dp-btn, .ds-arrow { border-radius: 99px; background: var(--glass); backdrop-filter: blur(14px); box-shadow: inset 0 0 0 1px var(--glass-edge); }
.seg a { border-radius: 99px; } .seg a.on { background: var(--accent); color: var(--accent-ink); }
.ds.on { background: linear-gradient(160deg, var(--accent), color-mix(in srgb, var(--accent) 55%, #7c3aed)); box-shadow: 0 12px 24px -12px var(--accent); }

.ll-top { margin: 8px; border-radius: calc(var(--r) - 4px); }
.page-head h1 { font-size: clamp(34px, 5vw, 44px); background: linear-gradient(120deg, var(--ink) 30%, color-mix(in srgb, var(--accent) 70%, var(--ink))); -webkit-background-clip: text; background-clip: text; color: transparent; padding-bottom: 4px; }
.team-hero, .player-hero, .game-hero, .cms-hero, .mod-title-sponsor .ts-inner { border-radius: 28px; }
.game-hero { border-radius: 28px 28px 0 0; } .gh-line { border-radius: 0 0 28px 28px; background: var(--glass); backdrop-filter: blur(14px); box-shadow: inset 0 0 0 1px var(--glass-edge); }
.team-hero::after { border-color: rgba(255, 255, 255, .12); }
.mod-watch .w-inner, .cms-countdown { border-radius: 28px; }
.quick-grid a .ico { padding: 10px; width: 46px; height: 46px; border-radius: 14px; background: color-mix(in srgb, var(--accent) 14%, transparent); }
.foot-sponsors { background: transparent; border-top: 0; }
.site-footer { margin: 24px var(--gut) var(--gut); border-radius: 28px; background: linear-gradient(160deg, #0b1b2e, #102a4a); }
.mega-inner { background: var(--surface); }
