/* =========================================================================
   ASHES · CLEAN
   The store's look. Loaded last in head.twig, so it is the final word.
   Remove its one <link> line in head.twig to roll back.

   Black and clean: neutral near-black surfaces, off-white type, condensed
   headlines, soft rounded cards and plain buttons. Orange is a small accent
   only — section numbers, the "Ashes" word, the "Most picked" flag.
   ========================================================================= */

html:root {
  --c-bg: #0a0a0a;
  --c-bg-2: #0e0e0e;
  --c-surface: #121212;
  --c-surface-2: #171717;
  --c-surface-3: #1f1f1f;
  --c-line: rgba(255, 255, 255, 0.07);
  --c-line-2: rgba(255, 255, 255, 0.13);
  --c-fg: #f5f5f4;
  --c-fg-2: #a3a3a3;
  --c-fg-3: #737373;
  --c-accent: #f97316;
  --c-accent-soft: rgba(249, 115, 22, 0.08);
  --c-accent-line: rgba(249, 115, 22, 0.35);
  --c-display: 'Big Shoulders Display', 'Oswald', Impact, sans-serif;
  --c-body: 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --c-ease: cubic-bezier(0.2, 0.9, 0.25, 1);

  /* Repoint the tokens the older stylesheets use, so anything not restyled
     by hand below still lands in the same key. */
  --bg: var(--c-bg);
  --bg-2: var(--c-bg-2);
  --surface: var(--c-surface);
  --surface-2: var(--c-surface-2);
  --line: var(--c-line);
  --line-soft: var(--c-line);
  --fg: var(--c-fg);
  --fg-2: var(--c-fg-2);
  --fg-3: var(--c-fg-3);
  --ac: var(--c-accent);
  --ac2: #c2410c;
  --font-ui: var(--c-body);
  --font-display: var(--c-display);
  --r-sm: 8px;
  --r: 12px;
  --r-lg: 16px;
  --shadow-ac: none;
  --color-primary: var(--c-fg);
  --color-primary-hover: #ffffff;
  --color-primary-text: #0a0a0a;
  --color-primary-text-hover: #0a0a0a;
  --color-background: var(--c-bg);
  --color-bg: var(--c-bg);
  --color-brighter-bg: var(--c-surface);
  --color-text: var(--c-fg);
  --color-text-secondary: var(--c-fg-2);
  --tebex-legal-footer-background-color: var(--c-bg-2);
  --tebex-legal-footer-border-color: var(--c-line);
}

/* ------------------------------------------------------------------ base */
html body {
  background: var(--c-bg) !important;
  color: var(--c-fg);
  font-family: var(--c-body);
  font-size: 15px;
  line-height: 1.65;
}
body ::selection { background: var(--c-fg); color: #0a0a0a; }
body h1, body h2, body h3, body h4 { font-family: var(--c-display); }
body .a-wrap { max-width: 1240px; }

/* ------------------------------------------------------------------ buttons
   Plain and solid. Primary is off-white on black; secondary is an outline. */
body .btn-primary,
body .btn-secondary {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 46px; height: auto; padding: 0 22px;
  border-radius: 10px !important;
  clip-path: none !important;
  font: 700 14px/1 var(--c-body) !important;
  letter-spacing: 0; text-transform: none;
  transition: background-color .2s, border-color .2s, color .2s, transform .2s var(--c-ease);
  text-decoration: none;
}
body .btn-primary {
  background: var(--c-fg) !important;
  color: #0a0a0a !important;
  border: 1px solid var(--c-fg) !important;
}
body .btn-primary:hover { background: #ffffff !important; border-color: #ffffff !important; color: #0a0a0a !important; }
body .btn-secondary {
  background: transparent !important;
  color: var(--c-fg) !important;
  border: 1px solid var(--c-line-2) !important;
  box-shadow: none !important;
}
body .btn-secondary:hover { background: rgba(255, 255, 255, 0.06) !important; border-color: rgba(255, 255, 255, 0.22) !important; color: #fff !important; }
body .btn-primary:active, body .btn-secondary:active { transform: translateY(1px); }
body .btn-primary.a-sm, body .btn-secondary.a-sm { min-height: 38px; padding: 0 16px; font-size: 13px !important; border-radius: 9px !important; }
body .btn-primary.wide, body .btn-secondary.wide { width: 100%; }

/* ------------------------------------------------------------------ badges */
body .a-badge {
  border-radius: 999px; background: rgba(255, 255, 255, 0.04); border: 1px solid var(--c-line-2);
  font: 600 11px/1 var(--c-body); letter-spacing: .06em; text-transform: uppercase; color: var(--c-fg-2);
}
body .dot { border-radius: 50%; width: 6px; height: 6px; }

/* ------------------------------------------------------------------ header */
body .site-header {
  background: transparent !important;
  border-bottom: 1px solid transparent;
  transition: background-color .3s, border-color .3s;
}
body .site-header.stuck {
  background: rgba(10, 10, 10, 0.9) !important;
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border-bottom-color: var(--c-line);
}
body .site-header .a-mark { max-height: 46px; width: auto; }
body .site-navigation .navigation-list > li > a {
  font: 600 14px/1 var(--c-body) !important;
  letter-spacing: 0; text-transform: none;
  color: var(--c-fg-2) !important;
  background: none !important; border-radius: 8px !important;
  padding: 10px 12px !important;
  transition: color .2s, background-color .2s;
}
body .site-navigation .navigation-list > li > a:hover { color: var(--c-fg) !important; background: rgba(255, 255, 255, 0.05) !important; }
body .site-navigation .navigation-list > li > a.link-active,
body .site-navigation .navigation-list > li > a.is-current,
body .site-navigation .navigation-list > li.active > a { color: var(--c-fg) !important; }
body .site-navigation .navigation-list > li > a::before,
body .site-navigation .navigation-list > li > a::after { display: none !important; }
/* desktop: the logo is Home, and Trailer/Story are reached by scrolling */
@media (min-width: 1101px) {
  body .site-navigation .navigation-list > li:has(> a[data-a-section="top"]),
  body .site-navigation .navigation-list > li:has(> a[data-a-section="trailer"]),
  body .site-navigation .navigation-list > li:has(> a[data-a-section="story"]) { display: none; }
}

/* ------------------------------------------------------------------ hero */
body .a-hero.f-hero {
  position: relative; overflow: hidden; isolation: isolate;
  min-height: min(880px, 100vh);
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 150px 0 0 !important;
  text-align: left !important;
}
body .f-hero .a-hero-plate {
  position: absolute; inset: 0; z-index: -3;
  background:
    radial-gradient(50% 45% at 75% 75%, rgba(249, 115, 22, .07) 0%, transparent 70%),
    linear-gradient(180deg, #0a0a0a 0%, #0c0c0c 100%) !important;
}
body .f-hero .a-embers { display: none !important; }
body .f-hero-word {
  position: absolute; left: 50%; bottom: 64px; transform: translateX(-50%);
  z-index: -2; pointer-events: none; user-select: none; white-space: nowrap;
  font: 900 min(30vw, 440px)/0.78 var(--c-display);
  text-transform: uppercase;
  color: transparent;
  -webkit-text-stroke: 1px rgba(255, 255, 255, .06);
}
body .f-hero-grid {
  display: grid !important; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr);
  align-items: end; gap: 40px; padding-bottom: 72px;
}
body .f-hero .a-hero-eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  height: 32px; padding: 0 14px !important; border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.04) !important; border: 1px solid var(--c-line-2) !important;
  font: 600 12px/1 var(--c-body) !important; letter-spacing: .08em; text-transform: uppercase; color: var(--c-fg-2) !important;
}
body .f-hero .a-hero-eyebrow::before, body .f-hero .a-hero-eyebrow::after { display: none !important; }
body .f-hero .a-hero-eyebrow .dot { background: #22c55e; box-shadow: none; }
body .f-hero-title {
  margin: 24px 0 0 !important;
  font: 800 clamp(60px, 8.6vw, 136px)/0.88 var(--c-display) !important;
  text-transform: uppercase; color: var(--c-fg);
}
body .f-hero-title span { color: var(--c-accent); }
body .f-hero .a-hero-blurb {
  margin: 26px 0 0 !important; max-width: 520px !important;
  font-size: 17px !important; line-height: 1.7; color: var(--c-fg-2) !important; text-align: left !important;
}
body .f-hero .a-hero-cta { justify-content: flex-start !important; gap: 12px; margin-top: 34px !important; flex-wrap: wrap; }
body .f-hero-art { display: flex; justify-content: center; align-items: flex-end; }
body .f-hero .a-hero-logo {
  width: 100% !important; max-width: 420px !important; height: auto !important; margin: 0 !important;
  filter: drop-shadow(0 24px 40px rgba(0, 0, 0, .7));
}

/* status strip */
body .f-ticker {
  position: relative; overflow: hidden;
  border-top: 1px solid var(--c-line); border-bottom: 1px solid var(--c-line);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
body .f-ticker-track { display: flex; width: max-content; animation: c-ticker 45s linear infinite; }
body .f-ticker:hover .f-ticker-track { animation-play-state: paused; }
body .f-ticker-item {
  display: inline-flex; align-items: center; gap: 10px; padding: 20px 26px;
  font: 500 13px/1 var(--c-body); color: var(--c-fg-3); white-space: nowrap;
}
body .f-ticker-item b { font: 800 22px/1 var(--c-display); letter-spacing: .02em; color: var(--c-fg); }
body .f-ticker-item::after { content: ""; width: 4px; height: 4px; margin-left: 16px; border-radius: 50%; background: var(--c-line-2); }
@keyframes c-ticker { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { body .f-ticker-track { animation: none; } }

/* ------------------------------------------------------------------ sections
   Numbered 01, 02 … in CSS, so the numbers stay right whichever sections
   the panel turns on or off. */
body .site { counter-reset: c-ch; }
body .a-section { counter-increment: c-ch; padding: 120px 0 !important; position: relative; }
body .a-section + .a-section { border-top: 1px solid var(--c-line); }
body .a-section-head { max-width: none !important; margin-bottom: 52px !important; text-align: left !important; }
body .a-kicker {
  display: flex !important; align-items: center; gap: 12px;
  font: 600 12px/1 var(--c-body) !important; letter-spacing: .14em !important; text-transform: uppercase;
  color: var(--c-fg-2) !important; background: none !important; border: 0 !important; padding: 0 !important;
}
body .a-kicker svg { display: none !important; }
body .a-kicker::before {
  content: counter(c-ch, decimal-leading-zero);
  position: static !important; width: auto !important; height: auto !important; margin: 0 !important;
  background: none !important; flex: none !important; transform: none !important; opacity: 1 !important;
  color: var(--c-accent);
}
body .a-kicker::after {
  content: ""; flex: 1; height: 1px; max-width: 360px;
  position: static !important; width: auto !important; margin: 0 !important; transform: none !important; opacity: 1 !important;
  background: var(--c-line-2) !important;
}
body .a-title {
  margin-top: 20px !important;
  font: 800 clamp(42px, 5.6vw, 80px)/0.92 var(--c-display) !important;
  letter-spacing: 0 !important; text-transform: uppercase; color: var(--c-fg) !important;
  max-width: 16ch;
}
body .a-lede {
  margin-top: 18px !important; max-width: 560px !important;
  font-size: 16px !important; line-height: 1.7 !important; color: var(--c-fg-2) !important;
}
body .a-note {
  margin-top: 32px !important; max-width: 760px;
  font: 400 13.5px/1.7 var(--c-body) !important; color: var(--c-fg-3) !important; text-align: left !important;
  padding: 0 !important; border: 0 !important;
}

/* ------------------------------------------------------------------ cards */
body .a-panel,
body .store-product,
body .a-step,
body .a-beat,
body .a-tile {
  position: relative;
  background: var(--c-surface) !important;
  border: 1px solid var(--c-line) !important;
  border-radius: 16px !important;
  box-shadow: none !important;
  clip-path: none !important;
  transition: border-color .25s, transform .25s var(--c-ease);
}
body .store-product:hover, body .a-step:hover, body .a-tile:hover, body .a-beat:hover {
  border-color: var(--c-line-2) !important; transform: translateY(-2px);
}

/* ------------------------------------------------------------------ trailer */
body .a-video-screen {
  border-radius: 18px !important; border: 1px solid var(--c-line) !important; clip-path: none !important; overflow: hidden;
}
body .a-video-play {
  width: 80px !important; height: 80px !important; border-radius: 50% !important; clip-path: none !important;
  background: var(--c-fg) !important; color: #0a0a0a !important; border: 0 !important;
}
body .a-video-cap b { font: 800 28px/1 var(--c-display) !important; text-transform: uppercase; }
body .a-video-cap span { font: 500 14px/1.4 var(--c-body) !important; letter-spacing: 0; text-transform: none; }

/* ------------------------------------------------------------------ tiers */
body .a-tier-grid, body #tiers .a-grid { gap: 14px !important; }
body .store-product.a-tier { padding: 26px 22px 22px !important; overflow: hidden; }
body .store-product.a-tier::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px;
  background: var(--tier, var(--c-line-2)); opacity: .8; box-shadow: none;
}
body .store-product.a-tier.is-picked {
  border-color: var(--c-accent-line) !important;
  background: linear-gradient(180deg, var(--c-accent-soft), var(--c-surface) 40%) !important;
}
body .a-flag {
  position: absolute !important; top: 14px !important; right: 14px !important; left: auto !important;
  transform: none !important; border-radius: 999px !important;
  padding: 6px 10px !important; background: var(--c-accent) !important; color: #0a0a0a !important;
  font: 700 10.5px/1 var(--c-body) !important; letter-spacing: .06em; text-transform: uppercase;
  box-shadow: none !important;
}
body .a-tier-rank {
  font: 600 11px/1 var(--c-body) !important; letter-spacing: .12em; text-transform: uppercase; color: var(--c-fg-3) !important;
}
body .store-product .product-title,
body .store-product .product-title a {
  font: 800 26px/1 var(--c-display) !important; text-transform: uppercase; color: var(--c-fg) !important;
}
body .a-perks li { font-size: 13.5px; color: var(--c-fg-2); }
body .a-perks li::before { border-radius: 50% !important; background: var(--tier, var(--c-fg-3)) !important; transform: none !important; }
body .store-product .price { display: flex !important; align-items: baseline; flex-wrap: wrap; gap: 4px 8px; }
body .store-product .price strong { font: 800 42px/0.95 var(--c-display) !important; color: var(--c-fg) !important; }
body .store-product .price .a-per { font: 500 13px/1 var(--c-body) !important; letter-spacing: 0; text-transform: none; color: var(--c-fg-3) !important; white-space: nowrap; }
/* only the picked rung gets the solid button; the rest are outlines */
body .store-product.a-tier:not(.is-picked) .btn-primary {
  background: transparent !important; color: var(--c-fg) !important; border: 1px solid var(--c-line-2) !important;
}
body .store-product.a-tier:not(.is-picked) .btn-primary:hover { background: rgba(255, 255, 255, 0.06) !important; }
body .a-tier-free .a-tier-plate { border-radius: 12px !important; background: var(--c-surface-2) !important; }
body .a-tier-free .price strong { color: var(--c-fg-2) !important; }

/* ------------------------------------------------------------------ coins */
body .store-product.a-coin { text-align: center !important; padding: 24px 20px 20px !important; }
body .store-product.a-coin .price { justify-content: center; }
body .store-product.a-coin .image-link img { filter: drop-shadow(0 10px 18px rgba(0, 0, 0, .55)); }
body .a-coin-head b { font: 800 52px/0.9 var(--c-display) !important; color: var(--c-fg) !important; }
body .a-coin-head span { font: 600 11px/1 var(--c-body) !important; letter-spacing: .12em; text-transform: uppercase; color: var(--c-fg-3) !important; }
body .a-coin-bonus {
  border-radius: 999px !important; background: rgba(255, 255, 255, 0.05) !important; border: 1px solid var(--c-line) !important;
  padding: 4px 10px !important;
  font: 600 11.5px/1.3 var(--c-body) !important; font-style: normal !important; color: var(--c-fg) !important;
}
body .a-coin-bonus.is-base { color: var(--c-fg-3) !important; }
body .a-coin-rate { font: 400 12px/1.4 var(--c-body) !important; color: var(--c-fg-3) !important; }
body .store-product.a-coin .price strong { font-size: 32px !important; }
body .store-product.a-coin:not(.is-best) .btn-primary {
  background: transparent !important; color: var(--c-fg) !important; border: 1px solid var(--c-line-2) !important;
}
body .store-product.a-coin:not(.is-best) .btn-primary:hover { background: rgba(255, 255, 255, 0.06) !important; }
body .store-product.a-coin.is-best { border-color: var(--c-line-2) !important; background: var(--c-surface-2) !important; }

/* ------------------------------------------------------------------ radio */
body .a-radio-grid { gap: 14px !important; }
body .a-station { border-radius: 10px !important; box-shadow: none !important; }
body .a-station.is-active { background: var(--c-surface-3) !important; }
body .a-station-icon { border-radius: 8px !important; }
body .a-station-txt b { font: 700 14px/1.3 var(--c-body) !important; text-transform: none; }
body .a-station-txt span, body .a-station-count { font-family: var(--c-body) !important; font-size: 12px !important; }
body .a-art-wrap, body .a-player-art { border-radius: 12px !important; }
body .a-track-art { border-radius: 6px !important; }
body .a-now-label { font: 600 11px/1 var(--c-body) !important; letter-spacing: .14em; color: var(--c-fg-3) !important; }
body .a-now-title { font: 800 34px/1 var(--c-display) !important; text-transform: uppercase; }
body .a-bar { border-radius: 4px !important; height: 4px !important; }
body .a-bar-fill { border-radius: 4px !important; background: var(--c-fg) !important; }
body .a-bar-knob { border-radius: 50% !important; background: #fff !important; }
body .a-ctrl { border-radius: 50% !important; }
body .a-ctrl-main { background: var(--c-fg) !important; color: #0a0a0a !important; border: 0 !important; border-radius: 50% !important; clip-path: none !important; }
body .a-track { border-radius: 10px !important; box-shadow: none !important; }
body .a-track.is-current { background: var(--c-surface-3) !important; }
body .a-track.is-current .a-track-txt b { color: var(--c-fg) !important; font-weight: 700; }

/* ------------------------------------------------------------------ live */
body .a-stream-who b { font: 800 20px/1 var(--c-display) !important; text-transform: uppercase; }
body .a-roster-item { border-radius: 10px !important; }
body .a-roster-av { border-radius: 50% !important; }
body .a-roster-plat { font-size: 12px !important; text-transform: capitalize; }

/* ------------------------------------------------------------------ apply */
body .a-steps { gap: 14px !important; }
body .a-step { padding: 30px 26px !important; }
body .a-step-n {
  display: block !important; width: auto !important; height: auto !important;
  background: none !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
  font: 800 64px/0.85 var(--c-display) !important; color: var(--c-surface-3) !important;
  -webkit-text-stroke: 0; margin-bottom: 16px;
}
body .a-step h3 { font: 800 26px/1 var(--c-display) !important; text-transform: uppercase; }
body .a-step p { color: var(--c-fg-2) !important; font-size: 14.5px; margin-top: 10px; }

/* ------------------------------------------------------------------ story
   The four beats become a 2×2 grid; the duplicate summary strip goes. */
body .a-beats {
  display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px !important;
  counter-reset: c-beat;
}
body .a-beats::before, body .a-beats::after { display: none !important; }
body .a-beat { display: block !important; padding: 32px 30px !important; margin: 0 !important; counter-increment: c-beat; text-align: left !important; }
body .a-beat-body { max-width: none !important; width: auto !important; text-align: left !important; padding: 0 !important; grid-column: auto !important; }
body .a-beat-body::before {
  content: counter(c-beat, decimal-leading-zero);
  display: block; margin-bottom: 16px;
  font: 600 12px/1 var(--c-body); letter-spacing: .14em; color: var(--c-fg-3);
}
body .a-beat-body h3 { font: 800 32px/0.95 var(--c-display) !important; text-transform: uppercase; }
body .a-beat-body p { margin-top: 12px !important; color: var(--c-fg-2) !important; font-size: 14.5px !important; line-height: 1.75 !important; }
body .a-beat-rail, body .a-timeline { display: none !important; }

/* ------------------------------------------------------------------ store tiles / trust */
body .a-tile-name { font: 800 26px/1 var(--c-display) !important; text-transform: uppercase; }
body .a-trust { gap: 10px 28px !important; }
body .a-trust span { font: 500 13px/1 var(--c-body) !important; letter-spacing: 0; text-transform: none; color: var(--c-fg-3) !important; }
body .a-trust span::before { border-radius: 50% !important; background: var(--c-fg-3) !important; }

/* ------------------------------------------------------------------ about / text */
body .a-doc, body .text-content { color: var(--c-fg-2); }
body .a-doc h1, body .a-doc h2, body .a-doc h3 { font-family: var(--c-display); text-transform: uppercase; color: var(--c-fg); }

/* ------------------------------------------------------------------ footer */
body .site-footer { background: var(--c-bg-2) !important; border-top: 1px solid var(--c-line) !important; }
body .a-footer-blurb { color: var(--c-fg-3) !important; font-size: 13.5px; }
body .a-footer-links a { font: 600 13px/1 var(--c-body) !important; letter-spacing: 0; text-transform: none; color: var(--c-fg-2) !important; }
body .a-footer-links a:hover { color: var(--c-fg) !important; }
body .site-footer .copyright { font: 400 12px/1.6 var(--c-body) !important; color: var(--c-fg-3) !important; }

/* ------------------------------------------------------------------ layout fixes */
/* the homepage stacks its sections; the grid rows meant for the sidebar
   layout were leaving a dead band under the footer */
body.page-index .site { display: block !important; }
body .page-category .a-section:first-of-type,
body .page-package .a-section:first-of-type { padding-top: 150px !important; }
body input[type="text"], body input[type="email"], body input[type="number"], body select, body textarea { border-radius: 10px !important; }

/* ------------------------------------------------------------------ responsive */
@media (max-width: 1100px) {
  body .f-hero-grid { grid-template-columns: 1fr; gap: 12px; }
  body .f-hero-art { order: -1; justify-content: flex-start; }
  body .f-hero .a-hero-logo { max-width: 220px !important; }
  body .a-beats { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  body .a-hero.f-hero { min-height: 0; padding-top: 110px !important; }
  body .f-hero-grid { padding-bottom: 48px; }
  body .f-hero-title { font-size: clamp(54px, 16vw, 80px) !important; }
  body .f-hero .a-hero-blurb { font-size: 15.5px !important; }
  body .f-hero .a-hero-cta .btn-primary, body .f-hero .a-hero-cta .btn-secondary { flex: 1 1 100%; }
  body .f-hero-word { bottom: 52px; }
  body .f-ticker-item { padding: 14px 18px; }
  body .f-ticker-item b { font-size: 18px; }
  body .a-section { padding: 80px 0 !important; }
  body .a-section-head { margin-bottom: 34px !important; }
  body .a-title { font-size: clamp(40px, 12vw, 56px) !important; }
  body .a-kicker::after { display: none; }
  body .a-beat { padding: 26px 22px !important; }
  body .a-beat-body h3 { font-size: 28px !important; }
}

/* ------------------------------------------------------------------ remove the old orange haze */
html body::before { background-image: none !important; }
body .store-product.a-tier.is-picked .btn-primary {
  background: var(--c-fg) !important; color: #0a0a0a !important; border: 1px solid var(--c-fg) !important; box-shadow: none !important;
}
body .store-product.a-tier.is-picked .btn-primary:hover { background: #fff !important; }
body .store-product.a-coin.is-best .btn-primary {
  background: var(--c-fg) !important; color: #0a0a0a !important; border: 1px solid var(--c-fg) !important; box-shadow: none !important;
}
body .a-station-icon { background: var(--c-surface-2) !important; color: var(--c-fg-3) !important; box-shadow: none !important; }
body .a-station.is-active .a-station-icon { background: var(--c-surface-2) !important; color: var(--c-fg) !important; }
body .a-tracklist { scrollbar-color: var(--c-surface-3) transparent !important; }
body .a-tracklist::-webkit-scrollbar-thumb { background: var(--c-surface-3) !important; }
body input[type="range"] { accent-color: var(--c-fg) !important; }