@layer state {
  :root[data-lite='true'] .fb-bg__rays,
  :root[data-lite='true'] .rw-bg__spiral,
  :root[data-lite='true'] .rr-sunrays,
  :root[data-lite='true'] .sx__rays,
  :root[data-lite='true'] .sx__vortex,
  :root[data-lite='true'] .sx__suits,
  :root[data-lite='true'] .fspin__rays {
    display: none;
  }

  :root[data-lite='true'] .of-deal__rays,
  :root[data-lite='true'] .of-reveal__rays,
  :root[data-lite='true'] .of-part__shine {
    display: none;
  }

  :root[data-lite='true'] .of-deal__glow {
    animation: none;
  }

  :root[data-lite='true'] .rr-arc {
    width: 150vmin;
    height: 150vmin;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.16) 0 38%, rgba(255, 255, 255, 0) 62%);
    filter: none;
    mix-blend-mode: normal;
    animation: none;
  }

  :root[data-lite='true'] .wg__fx {
    contain: layout paint;
  }

  :root[data-lite='true'] .scard[data-star='5']::before,
  :root[data-lite='true'] .scard[data-star='6']::before {
    filter: none;
    opacity: 0.6;
    animation: none;
  }

  :root[data-lite='true'] .scard__slot::after {
    display: none;
  }

  :root[data-lite='true'] .jb__glow {
    display: none;
  }

  :root[data-lite='true'] .jb__deck {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    background: linear-gradient(180deg, #221638, #0e0a1c);
  }

  :root[data-lite='true'] .jbm__halo {
    filter: blur(4px);
  }

  :root[data-lite='true'] .jb__sign {
    animation: none;
    text-shadow: 0 0 16px var(--neon);
  }

  :root[data-lite='true'] .shop__glow {
    filter: none;
    animation: none;
  }

  :root[data-lite='true'] .shop__art,
  :root[data-lite='true'] .shop__rarity::after {
    animation: none;
  }

  :root[data-lite='true'] .shop__item:not([data-locked='true']) .shop__art {
    filter: drop-shadow(0 8px 10px rgba(0, 0, 0, 0.45));
  }

  :root[data-lite='true'] .shop__item[data-locked='true'] .shop__art {
    filter: grayscale(0.8) brightness(0.6);
  }

  :root[data-lite='true'] .shop__item:not([data-locked='true']) .shop__art--cos,
  :root[data-lite='true'] .cos-pv img {
    filter: none;
  }

  :root[data-lite='true'] .album__rays,
  :root[data-lite='true'] .album[data-state='done'] .album__disc::after {
    animation: none;
  }

  :root[data-lite='true'] .p-hero::before {
    animation: none;
  }
}

@layer state {
  :root[data-device='phone'] .dock__inner {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0) 40%),
      radial-gradient(60% 130% at 50% 0%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 70%),
      linear-gradient(180deg, color-mix(in srgb, var(--deep) 45%, rgba(40, 26, 76, 0.97)), color-mix(in srgb, var(--deep) 55%, rgba(12, 8, 26, 0.98)));
  }

  :root[data-device='phone'] .player {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0) 50%),
      linear-gradient(180deg, rgba(40, 26, 76, 0.95), rgba(12, 8, 26, 0.97));
  }

  :root[data-device='phone'] .pill {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0) 50%),
      linear-gradient(180deg, rgba(10, 6, 20, 0.95), rgba(24, 16, 44, 0.97));
  }

  :root[data-device='phone'] .glass {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    background:
      linear-gradient(180deg, var(--panel-shine), rgba(255, 255, 255, 0) 38%),
      linear-gradient(180deg, rgba(44, 30, 82, 0.95), rgba(14, 9, 30, 0.97));
  }

  :root[data-device='phone'] .cab__aura {
    filter: none;
    background:
      radial-gradient(60% 55% at 50% 50%, color-mix(in srgb, var(--glow) 45%, transparent), transparent 85%),
      radial-gradient(40% 40% at 20% 60%, color-mix(in srgb, var(--accent-2) 24%, transparent), transparent 85%),
      radial-gradient(40% 40% at 80% 40%, color-mix(in srgb, var(--accent) 28%, transparent), transparent 85%);
  }

  :root[data-lite='true'][data-fx='trim'] .ev__rays {
    display: block;
  }

  :root[data-device='phone'] .bubble__disc {
    transition: transform 0.25s var(--ease-spring);
  }

  :root[data-device='phone'] .bubble__art {
    transition: transform 0.4s var(--ease-spring);
  }

  :root[data-device='phone'][data-spinning='true'] .ev__icon,
  :root[data-device='phone'][data-spinning='true'] .ev__q,
  :root[data-device='phone'][data-spinning='true'] .ev__rays,
  :root[data-device='phone'][data-spinning='true'] .ev__stripes,
  :root[data-device='phone'][data-spinning='true'] .bubble.is-attention .bubble__disc,
  :root[data-device='phone'][data-spinning='true'] .bubble.is-attention .bubble__glow,
  :root[data-device='phone'][data-spinning='true'] .bubble.is-spinning-art .bubble__art,
  :root[data-device='phone'][data-spinning='true'] .bubble__energy {
    animation-play-state: paused;
  }
}

@layer state {
  :root[data-idle='true'] *,
  :root[data-idle='true'] *::before,
  :root[data-idle='true'] *::after {
    animation-play-state: paused !important;
  }
}
