/*
 * Unified public-site theme based on the Phoenix moderation reference.
 * Deliberately scoped away from the administration and maintenance routes.
 */

:root {
  --phx-bg: #060d16;
  --phx-bg-soft: #08111d;
  --phx-panel: #0c1624;
  --phx-panel-2: #0f1b2b;
  --phx-panel-hover: #122033;
  --phx-border: #213247;
  --phx-border-soft: #18283a;
  --phx-text: #eef3fb;
  --phx-muted: #8491a5;
  --phx-muted-2: #5f6f84;
  --phx-orange: #ff731b;
  --phx-amber: #ffb31a;
  --phx-red: #ff4c52;
  --phx-cyan: #2cc8e8;
  --phx-green: #46d68c;
  --phx-purple: #ad82ef;
  --phx-chrome: #07111e;
  --phx-radius: 15px;
  --phx-radius-sm: 9px;
  --phx-shadow: 0 18px 45px rgba(0, 0, 0, 0.18);
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) {
  background:
    radial-gradient(circle at 82% 0%, rgba(25, 83, 112, 0.09), transparent 30rem),
    linear-gradient(180deg, #07101b 0%, var(--phx-bg) 34%, #050b13 100%) !important;
  color: var(--phx-text) !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) > main {
  background: transparent !important;
  padding: 20px 22px 34px !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) > main > .view {
  width: 100% !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .site-header {
  background: var(--phx-chrome) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--phx-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .header-shell {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  height: 100% !important;
  min-height: 0 !important;
  overflow: visible !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .site-taskbar {
  background: var(--phx-chrome) !important;
  border-right-color: var(--phx-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .brand {
  background: var(--phx-chrome) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .nav-dot {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  color: #7d8da2 !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .nav-dropdown a.active .nav-dot,
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .nav-dropdown a[aria-current="page"] .nav-dot {
  background: rgba(255, 115, 27, 0.12) !important;
  border-color: rgba(255, 115, 27, 0.46) !important;
  color: var(--phx-orange) !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .public-update-shortcut {
  align-items: center;
  background: rgba(10, 22, 35, 0.86);
  border: 1px solid var(--phx-border);
  border-radius: 999px;
  color: #dce5f1;
  display: inline-flex;
  font-size: 11px;
  font-weight: 700;
  gap: 8px;
  height: 40px;
  min-height: 40px;
  padding: 0 17px;
  text-decoration: none;
  transition: 160ms ease;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .public-update-shortcut:hover,
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .public-update-shortcut.active {
  background: rgba(255, 115, 27, 0.09);
  border-color: rgba(255, 115, 27, 0.55);
  color: #fff;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .public-update-shortcut svg {
  fill: none;
  height: 16px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.7;
  width: 16px;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) :is(
  .header-token-wallet,
  .header-notifications-toggle,
  .header-messenger-toggle,
  .header-user-toggle
) {
  align-items: center !important;
  background: #0a1724 !important;
  border: 1px solid #223449 !important;
  border-radius: 11px !important;
  box-shadow: none !important;
  height: 40px !important;
  min-height: 40px !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) :is(
  .header-notifications-toggle,
  .header-messenger-toggle
) {
  min-width: 40px !important;
  padding: 0 !important;
  width: 40px !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) :is(
  .header-notifications-toggle,
  .header-messenger-toggle
) svg {
  height: 18px !important;
  width: 18px !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .header-user-toggle {
  gap: 9px !important;
  padding: 0 11px !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .header-user-avatar {
  height: 31px !important;
  min-width: 31px !important;
  width: 31px !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .nav-toggle {
  background: #0a1724 !important;
  border: 1px solid #223449 !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  height: 40px !important;
  min-height: 40px !important;
}

/* Shared typography */
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .eyebrow {
  color: var(--phx-cyan) !important;
  font-size: 9px !important;
  font-weight: 800 !important;
  letter-spacing: 0.13em !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) h1,
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) h2,
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) h3 {
  color: var(--phx-text) !important;
  letter-spacing: -0.025em !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .page-heading {
  align-items: center !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  gap: 24px !important;
  margin: 0 0 18px !important;
  min-height: 134px !important;
  overflow: visible !important;
  padding: 16px 14px 18px !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .page-heading::before,
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .page-heading::after {
  display: none !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .page-heading > div {
  max-width: 720px !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .page-heading h1 {
  font-size: clamp(27px, 2.5vw, 34px) !important;
  line-height: 1.08 !important;
  margin: 7px 0 8px !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .page-heading p:not(.eyebrow) {
  color: var(--phx-muted) !important;
  font-size: 12px !important;
  line-height: 1.55 !important;
  margin: 0 !important;
  max-width: 660px !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .page-symbol {
  background: var(--phx-panel) !important;
  border: 1px solid var(--phx-border) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  color: var(--phx-orange) !important;
  display: grid !important;
  font-size: 13px !important;
  height: 52px !important;
  min-width: 52px !important;
  place-items: center !important;
  width: 52px !important;
}

/* Shared surfaces */
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) :is(
  .filters,
  .registry,
  .level-toolbar,
  .user-toolbar,
  .deban-panel,
  .deban-appeals-panel,
  .recruitment-list-panel,
  .shop-wallet,
  .shop-catalog-section,
  .replays-retention-notice,
  .replays-catalog,
  .live-moderators-panel,
  .top-levels-panel,
  .recent-panel,
  .top-donors-panel,
  .auth-card,
  .account-intro,
  .member-profile-page
) {
  background: linear-gradient(145deg, rgba(14, 26, 41, 0.98), rgba(9, 18, 30, 0.98)) !important;
  border: 1px solid var(--phx-border) !important;
  border-radius: var(--phx-radius) !important;
  box-shadow: var(--phx-shadow) !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) :is(
  .filters,
  .level-toolbar,
  .user-toolbar,
  .shop-wallet,
  .replays-retention-notice
) {
  padding: 16px 18px !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) :is(
  .registry,
  .deban-panel,
  .deban-appeals-panel,
  .recruitment-list-panel,
  .shop-catalog-section,
  .replays-catalog,
  .live-moderators-panel,
  .top-levels-panel,
  .recent-panel,
  .top-donors-panel,
  .auth-card,
  .account-intro
) {
  padding: 18px !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .section-head,
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .registry-head,
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .cosmetic-section-head,
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .replays-catalog-head,
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .live-moderators-head {
  align-items: center !important;
  border-bottom: 1px solid var(--phx-border-soft) !important;
  display: flex !important;
  gap: 14px !important;
  justify-content: space-between !important;
  margin: -2px 0 14px !important;
  min-height: 48px !important;
  padding: 0 0 12px !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) :is(.section-head, .registry-head, .cosmetic-section-head, .replays-catalog-head) h2,
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .live-moderators-head h2 {
  font-size: 16px !important;
  margin: 3px 0 0 !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) :is(.section-head, .registry-head, .cosmetic-section-head, .replays-catalog-head) small {
  color: var(--phx-muted) !important;
}

/* Forms and buttons */
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) label > span,
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .filters label > span {
  color: #8795a9 !important;
  font-size: 8px !important;
  font-weight: 800 !important;
  letter-spacing: 0.09em !important;
  text-transform: uppercase !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) :is(input, select, textarea) {
  background: #07101c !important;
  border: 1px solid #1c2d42 !important;
  border-radius: 8px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.015) !important;
  color: var(--phx-text) !important;
  font-size: 11px !important;
  outline: none !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) :is(input, select) {
  min-height: 38px !important;
  padding: 0 12px !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) textarea {
  min-height: 110px !important;
  padding: 11px 12px !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) :is(input, select, textarea):focus {
  border-color: rgba(44, 200, 232, 0.6) !important;
  box-shadow: 0 0 0 3px rgba(44, 200, 232, 0.08) !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) :is(
  .auth-primary,
  .primary-link
) {
  align-items: center !important;
  background: linear-gradient(135deg, #ff8b27, #f54b1e 58%, #e73b24) !important;
  border: 0 !important;
  border-radius: 9px !important;
  box-shadow: 0 8px 20px rgba(238, 78, 28, 0.22) !important;
  color: #fff !important;
  display: inline-flex !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  justify-content: center !important;
  min-height: 38px !important;
  padding: 0 16px !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) :is(
  .auth-secondary,
  .secondary-link,
  .refresh-small,
  .icon-button,
  .pagination button,
  .direct-icon-button
) {
  align-items: center !important;
  background: #0b1624 !important;
  border: 1px solid #25364a !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  color: #dbe4ef !important;
  display: inline-flex !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  justify-content: center !important;
  min-height: 36px !important;
  padding: 0 13px !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) :is(.auth-secondary, .secondary-link, .refresh-small, .pagination button):hover {
  background: var(--phx-panel-hover) !important;
  border-color: #3b5069 !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .pagination {
  align-items: center !important;
  display: flex !important;
  gap: 8px !important;
  justify-content: center !important;
  margin: 14px 0 0 !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .pagination span {
  color: var(--phx-muted) !important;
  font-size: 10px !important;
}

/* Home dashboard */
body[data-route="home"] .hero {
  align-items: center !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  display: grid !important;
  gap: 18px !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  margin: 0 !important;
  min-height: 128px !important;
  overflow: visible !important;
  padding: 12px 14px 18px !important;
}

body[data-route="home"] .hero::before,
body[data-route="home"] .hero::after { display: none !important; }

body[data-route="home"] .hero h1 {
  font-size: clamp(28px, 2.4vw, 36px) !important;
  line-height: 1.06 !important;
  margin: 7px 0 9px !important;
}

body[data-route="home"] .hero > div > p:not(.eyebrow) {
  color: var(--phx-muted) !important;
  font-size: 11px !important;
  line-height: 1.5 !important;
  max-width: 560px !important;
}

body[data-route="home"] .hero-logo {
  filter: drop-shadow(0 10px 22px rgba(255, 91, 24, 0.18)) !important;
  height: 76px !important;
  object-fit: contain !important;
  opacity: 0.78 !important;
  width: 76px !important;
}

body[data-route="home"] .hero-actions {
  display: flex !important;
  gap: 8px !important;
  margin-top: 13px !important;
}

body[data-route="home"] .stats {
  display: grid !important;
  gap: 12px !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  margin: 0 0 16px !important;
}

body[data-route="home"] .stats article {
  background: linear-gradient(145deg, #0d1b2a, #0a1522) !important;
  border: 1px solid var(--phx-border) !important;
  border-radius: 11px !important;
  box-shadow: none !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  min-height: 108px !important;
  overflow: hidden !important;
  padding: 14px !important;
  position: relative !important;
}

body[data-route="home"] .stats article::before {
  background: currentColor !important;
  content: "" !important;
  height: 2px !important;
  left: 14px !important;
  opacity: 0.55 !important;
  position: absolute !important;
  top: 0 !important;
  width: 28px !important;
}

body[data-route="home"] .stats article span {
  color: var(--phx-cyan) !important;
  font-size: 8px !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

body[data-route="home"] .stats article:nth-child(2) span,
body[data-route="home"] .stats article:nth-child(2) strong,
body[data-route="home"] .stats article:nth-child(2) { color: var(--phx-red) !important; }
body[data-route="home"] .stats article:nth-child(3) span,
body[data-route="home"] .stats article:nth-child(3) strong,
body[data-route="home"] .stats article:nth-child(3) { color: var(--phx-amber) !important; }
body[data-route="home"] .stats article:nth-child(4) span,
body[data-route="home"] .stats article:nth-child(4) strong,
body[data-route="home"] .stats article:nth-child(4) { color: var(--phx-green) !important; }

body[data-route="home"] .stats article:first-child { color: var(--phx-cyan) !important; }

body[data-route="home"] .stats article strong {
  color: var(--phx-text) !important;
  font-size: clamp(22px, 2.4vw, 31px) !important;
  line-height: 1 !important;
  margin: 10px 0 7px !important;
}

body[data-route="home"] .stats article small {
  color: var(--phx-muted) !important;
  font-size: 9px !important;
  padding-right: 64px !important;
}

body[data-route="home"] .stat-sparkline {
  bottom: 13px !important;
  fill: none !important;
  height: 23px !important;
  opacity: 0.88 !important;
  pointer-events: none !important;
  position: absolute !important;
  right: 11px !important;
  stroke: currentColor !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  stroke-width: 1.5 !important;
  width: 62px !important;
}

body[data-route="home"] .community-insights {
  margin: 2px 0 16px !important;
  min-width: 0 !important;
}

body[data-route="home"] .community-insights-head {
  align-items: end !important;
  display: flex !important;
  gap: 16px !important;
  justify-content: space-between !important;
  margin-bottom: 9px !important;
}

body[data-route="home"] .community-insights-head h2 {
  color: var(--phx-text) !important;
  font-size: 15px !important;
  margin: 3px 0 0 !important;
}

body[data-route="home"] .community-insights-head > small {
  color: var(--phx-muted) !important;
  font-size: 8px !important;
  white-space: nowrap !important;
}

body[data-route="home"] .community-stats {
  display: grid !important;
  gap: 9px !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
}

body[data-route="home"] .community-stat {
  align-items: center !important;
  background: linear-gradient(145deg, #0d1b2a, #091522) !important;
  border: 1px solid var(--phx-border-soft) !important;
  border-radius: 10px !important;
  color: var(--phx-cyan) !important;
  display: grid !important;
  gap: 10px !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  min-height: 82px !important;
  overflow: hidden !important;
  padding: 11px !important;
  position: relative !important;
}

body[data-route="home"] .community-stat::after {
  background: currentColor !important;
  bottom: 0 !important;
  content: "" !important;
  height: 2px !important;
  left: 0 !important;
  opacity: 0.6 !important;
  position: absolute !important;
  width: 42px !important;
}

body[data-route="home"] .community-stat-icon {
  background: color-mix(in srgb, currentColor 10%, transparent) !important;
  border: 1px solid color-mix(in srgb, currentColor 28%, transparent) !important;
  border-radius: 9px !important;
  display: grid !important;
  height: 36px !important;
  place-items: center !important;
  width: 36px !important;
}

body[data-route="home"] .community-stat-icon svg {
  fill: none !important;
  height: 18px !important;
  stroke: currentColor !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  stroke-width: 1.6 !important;
  width: 18px !important;
}

body[data-route="home"] .community-stat > span:last-child { min-width: 0 !important; }
body[data-route="home"] .community-stat :is(small, strong, em) { display: block !important; }
body[data-route="home"] .community-stat small {
  color: currentColor !important;
  font-size: 7px !important;
  font-weight: 800 !important;
  letter-spacing: 0.06em !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
body[data-route="home"] .community-stat strong {
  color: var(--phx-text) !important;
  font-size: 21px !important;
  line-height: 1 !important;
  margin: 5px 0 !important;
}
body[data-route="home"] .community-stat em {
  color: var(--phx-muted) !important;
  font-size: 8px !important;
  font-style: normal !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body[data-route="home"] .community-stat-buyers { color: var(--phx-amber) !important; }
body[data-route="home"] .community-stat-live { color: #ff4a76 !important; }
body[data-route="home"] .community-stat-level { color: #a78bfa !important; }
body[data-route="home"] .community-stat-members { color: var(--phx-green) !important; }
body[data-route="home"] .community-stat-linked { color: #38bdf8 !important; }

body[data-route="home"] :is(.community-insights, .live-moderators-panel, .home-grid) {
  margin-top: 14px !important;
}

body[data-route="home"] .home-moderators {
  align-items: stretch !important;
  display: grid !important;
  gap: 9px !important;
  grid-template-columns: repeat(auto-fit, minmax(185px, 1fr)) !important;
}

body[data-route="home"] .home-moderator-card {
  background: rgba(8, 18, 30, 0.82) !important;
  border: 1px solid var(--phx-border-soft) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  min-height: 72px !important;
  padding: 11px !important;
}

body[data-route="home"] .home-grid {
  align-items: stretch !important;
  display: grid !important;
  gap: 14px !important;
  grid-template-columns: minmax(0, 1.25fr) minmax(250px, 0.78fr) minmax(0, 1.25fr) !important;
}

body[data-route="home"] .home-grid > article { min-width: 0 !important; }

body[data-route="home"] :is(.home-top-levels, .recent-list) {
  display: grid !important;
  gap: 0 !important;
}

body[data-route="home"] :is(.top-level-card, .recent-item) {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--phx-border-soft) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  min-height: 58px !important;
  padding: 8px 5px !important;
}

body[data-route="home"] :is(.top-level-card, .recent-item):last-child { border-bottom: 0 !important; }
body[data-route="home"] :is(.top-level-card, .recent-item):hover { background: rgba(255, 255, 255, 0.02) !important; }

/* Shop */
body[data-route="shop"] .shop-page {
  display: grid !important;
  gap: 14px !important;
  max-width: 1180px !important;
  width: 100% !important;
}

body[data-route="shop"] .shop-wallet {
  align-items: center !important;
  display: grid !important;
  gap: 14px !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  margin: 0 !important;
}

body[data-route="shop"] .shop-token-mark {
  background: #142339 !important;
  border: 1px solid #31465f !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  color: var(--phx-amber) !important;
  height: 48px !important;
  width: 48px !important;
}

body[data-route="shop"] .shop-catalog-section { margin: 0 !important; }
body[data-route="shop"] .shop-grid {
  align-items: stretch !important;
  display: grid !important;
  gap: 11px !important;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)) !important;
}

body[data-route="shop"] .shop-item {
  background: #091421 !important;
  border: 1px solid var(--phx-border-soft) !important;
  border-radius: 11px !important;
  box-shadow: none !important;
  display: grid !important;
  grid-template-rows: 116px minmax(112px, 1fr) auto !important;
  min-height: 292px !important;
  overflow: hidden !important;
  padding: 0 !important;
}

body[data-route="shop"] .shop-item-preview {
  background: radial-gradient(circle at 50% 25%, rgba(255, 133, 41, 0.12), transparent 58%), #0c1827 !important;
  border-bottom: 1px solid var(--phx-border-soft) !important;
  min-height: 116px !important;
}

body[data-route="shop"] .shop-item-copy { padding: 14px 14px 8px !important; }
body[data-route="shop"] .shop-item > button { margin: 8px 14px 14px !important; width: calc(100% - 28px) !important; }

/* Replays */
body[data-route="replays"] .replays-retention-notice {
  align-items: center !important;
  display: grid !important;
  gap: 14px !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  margin: 0 0 14px !important;
}

body[data-route="replays"] .replays-retention-icon {
  background: #132238 !important;
  border-color: #31465e !important;
  box-shadow: none !important;
}

body[data-route="replays"] .replays-catalog { padding: 18px !important; }
body[data-route="replays"] .replays-list {
  align-items: stretch !important;
  display: grid !important;
  gap: 12px !important;
  grid-template-columns: repeat(var(--replay-columns, 3), minmax(0, 1fr)) !important;
}

body[data-route="replays"] .replay-card {
  background: #091421 !important;
  border: 1px solid var(--phx-border-soft) !important;
  border-radius: 11px !important;
  box-shadow: none !important;
  min-width: 0 !important;
  overflow: hidden !important;
}

body[data-route="replays"] .replay-profile {
  border-bottom: 1px solid var(--phx-border-soft) !important;
  min-height: 74px !important;
  padding: 11px 12px !important;
}

body[data-route="replays"] .replay-body { background: #07101a !important; }
body[data-route="replays"] .replay-details,
body[data-route="replays"] .replay-footer { padding-left: 13px !important; padding-right: 13px !important; }

/* Moderation registry */
body[data-route="bans"] .filters,
body[data-route="mutes"] .filters {
  display: grid !important;
  gap: 12px !important;
  grid-template-columns: minmax(260px, 1.7fr) repeat(3, minmax(150px, 0.72fr)) !important;
  margin: 0 0 14px !important;
}

body[data-route="bans"] .filters label,
body[data-route="mutes"] .filters label {
  display: grid !important;
  gap: 7px !important;
}

body[data-route="bans"] .registry,
body[data-route="mutes"] .registry {
  overflow: hidden !important;
  padding: 0 !important;
}

body[data-route="bans"] .registry-head,
body[data-route="mutes"] .registry-head {
  margin: 0 !important;
  padding: 15px 18px 13px !important;
}

body[data-route="bans"] .actions-list,
body[data-route="mutes"] .actions-list {
  display: grid !important;
  gap: 0 !important;
}

body[data-route="bans"] .action-row,
body[data-route="mutes"] .action-row {
  align-items: center !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--phx-border-soft) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  display: grid !important;
  gap: 12px !important;
  grid-template-columns: minmax(165px, 1.15fr) 118px minmax(150px, 1fr) minmax(100px, 0.65fr) minmax(150px, 0.95fr) 82px !important;
  min-height: 67px !important;
  padding: 9px 18px !important;
}

body[data-route="bans"] .action-row:hover,
body[data-route="mutes"] .action-row:hover { background: rgba(255, 255, 255, 0.018) !important; }

body[data-route="bans"] .action-row .identity,
body[data-route="mutes"] .action-row .identity {
  background: transparent !important;
  border: 0 !important;
  min-width: 0 !important;
  padding: 0 !important;
}

body[data-route="bans"] .action-row .avatar,
body[data-route="mutes"] .action-row .avatar { height: 34px !important; width: 34px !important; }

body[data-route="bans"] .registry > .pagination,
body[data-route="mutes"] .registry > .pagination { padding: 0 16px 14px !important; }

/* Deban and recruitment */
body[data-route="deban"] .deban-grid {
  align-items: stretch !important;
  display: grid !important;
  gap: 14px !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

body[data-route="deban"] .deban-panel { min-width: 0 !important; }
body[data-route="deban"] .deban-search-form {
  align-items: end !important;
  display: grid !important;
  gap: 10px !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
}

body[data-route="deban"] .deban-banned-card,
body[data-route="deban"] .deban-appeal-card {
  background: #091421 !important;
  border: 1px solid var(--phx-border-soft) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

body[data-route="deban"] .deban-appeals-panel { margin-top: 14px !important; }

body[data-route="recruitment"] .recruitment-layout { display: block !important; }
body[data-route="recruitment"] .recruitment-forum-section {
  background: #091421 !important;
  border: 1px solid var(--phx-border-soft) !important;
  border-radius: 11px !important;
  box-shadow: none !important;
  margin-top: 10px !important;
  overflow: hidden !important;
}

body[data-route="recruitment"] .recruitment-card {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--phx-border-soft) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body[data-route="recruitment"] .recruitment-modal-card {
  background: #0b1624 !important;
  border: 1px solid var(--phx-border) !important;
  border-radius: var(--phx-radius) !important;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.52) !important;
}

/* Levels and users become dense registry rows */
body[data-route="levels"] .level-toolbar {
  align-items: end !important;
  display: grid !important;
  gap: 16px !important;
  grid-template-columns: minmax(260px, 1fr) auto !important;
  margin: 0 0 14px !important;
}

body[data-route="levels"] .levels-list,
body[data-route="users"] .users-list {
  background: linear-gradient(145deg, #0c1725, #08111c) !important;
  border: 1px solid var(--phx-border) !important;
  border-radius: var(--phx-radius) !important;
  box-shadow: var(--phx-shadow) !important;
  display: grid !important;
  gap: 0 !important;
  overflow: hidden !important;
}

body[data-route="levels"] .level-card {
  align-items: center !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--phx-border-soft) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  display: grid !important;
  gap: 12px !important;
  grid-template-columns: 44px 44px minmax(170px, 1.2fr) 112px minmax(150px, 0.85fr) minmax(210px, 1fr) !important;
  min-height: 68px !important;
  padding: 8px 16px !important;
}

body[data-route="levels"] .level-card:hover,
body[data-route="users"] .user-card:hover { background: rgba(255, 255, 255, 0.018) !important; }
body[data-route="levels"] .level-card:last-child,
body[data-route="users"] .user-card:last-child { border-bottom: 0 !important; }

body[data-route="levels"] .level-avatar-shell,
body[data-route="levels"] .level-avatar { height: 38px !important; width: 38px !important; }
body[data-route="levels"] .level-rank { color: var(--phx-muted) !important; font-size: 11px !important; }
body[data-route="levels"] .level-value strong { color: var(--phx-amber) !important; font-size: 20px !important; }
body[data-route="levels"] .level-activity { font-size: 9px !important; }

body[data-route="users"] .user-toolbar {
  align-items: end !important;
  display: grid !important;
  gap: 11px !important;
  grid-template-columns: minmax(230px, 1.4fr) repeat(4, minmax(130px, 0.72fr)) auto !important;
  margin: 0 0 14px !important;
}

body[data-route="users"] .user-card {
  align-items: center !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--phx-border-soft) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  display: grid !important;
  gap: 12px !important;
  grid-template-columns: minmax(190px, 0.95fr) minmax(130px, 0.65fr) minmax(360px, 1.65fr) minmax(190px, 0.9fr) !important;
  min-height: 74px !important;
  padding: 9px 16px !important;
}

body[data-route="users"] .user-identity {
  background: transparent !important;
  border: 0 !important;
  min-width: 0 !important;
  padding: 0 !important;
}

body[data-route="users"] .user-stats {
  display: grid !important;
  gap: 5px !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

body[data-route="users"] .user-stats span {
  background: rgba(6, 15, 25, 0.72) !important;
  border: 1px solid var(--phx-border-soft) !important;
  border-radius: 7px !important;
  min-width: 0 !important;
  padding: 6px 7px !important;
}

body[data-route="users"] .user-stats small { color: var(--phx-muted-2) !important; font-size: 7px !important; }
body[data-route="users"] .user-stats strong { color: #dce6f2 !important; font-size: 10px !important; }
body[data-route="users"] .user-meta { font-size: 8px !important; }

/* Account and profile */
body[data-route="account"] .account-layout {
  align-items: start !important;
  display: grid !important;
  gap: 14px !important;
  grid-template-columns: minmax(280px, 0.72fr) minmax(0, 1.7fr) !important;
}

body[data-route="account"] .account-layout.member-active {
  gap: 0 !important;
  grid-template-columns: minmax(0, 1fr) !important;
  width: 100% !important;
}

body[data-route="account"] .account-layout.member-active .account-intro {
  display: none !important;
}

body[data-route="account"] .account-layout.member-active .auth-card {
  align-content: start !important;
  grid-column: 1 / -1 !important;
  min-height: 660px !important;
  padding: clamp(20px, 2.6vw, 36px) !important;
  width: 100% !important;
}

body[data-route="account"] .account-layout.member-active .auth-member,
body[data-route="account"] .account-layout.member-active .member-dashboard,
body[data-route="account"] .account-layout.member-active .member-panels {
  max-width: none !important;
  min-width: 0 !important;
  width: 100% !important;
}

body[data-route="account"] .account-intro {
  min-height: 410px !important;
  overflow: hidden !important;
}

body[data-route="account"] .account-intro::before {
  background: radial-gradient(circle, rgba(255, 115, 27, 0.12), transparent 68%) !important;
}

body[data-route="account"] .account-intro h1 {
  color: var(--phx-text) !important;
  font-size: clamp(30px, 3vw, 42px) !important;
  line-height: 1.04 !important;
  margin: 8px 0 14px !important;
}

body[data-route="account"] .account-intro h1 span {
  color: var(--phx-text) !important;
  -webkit-text-fill-color: currentColor !important;
}

body[data-route="account"] .account-intro > div > p:not(.eyebrow) {
  color: var(--phx-muted) !important;
  font-size: 11px !important;
  line-height: 1.55 !important;
}

body[data-route="account"] .account-orbit { opacity: 0.16 !important; }

body[data-route="account"] .account-benefits {
  display: grid !important;
  gap: 8px !important;
}

body[data-route="account"] .account-benefits li {
  background: rgba(7, 16, 27, 0.72) !important;
  border: 1px solid var(--phx-border-soft) !important;
  border-radius: 9px !important;
  min-height: 58px !important;
  padding: 10px 11px !important;
}

body[data-route="account"] .account-benefits li i {
  background: #142236 !important;
  border: 1px solid #2e425b !important;
  color: var(--phx-orange) !important;
}

body[data-route="account"] .auth-card { min-width: 0 !important; }
body[data-route="account"] :is(.auth-member-grid, .auth-form-grid) { gap: 11px !important; }

body[data-route="account"] .member-dashboard {
  align-items: start !important;
  display: grid !important;
  gap: 12px !important;
  grid-template-columns: 210px minmax(0, 1fr) !important;
}

body[data-route="account"] .member-sidebar {
  background: #081321 !important;
  border: 1px solid var(--phx-border-soft) !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  padding: 5px !important;
}

body[data-route="account"] .member-sidebar button {
  background: transparent !important;
  border: 0 !important;
  border-radius: 7px !important;
  color: var(--phx-muted) !important;
  grid-template-columns: 36px minmax(0, 1fr) !important;
  min-height: 52px !important;
  padding: 8px !important;
}

body[data-route="account"] .member-sidebar .member-tab-icon {
  align-self: center !important;
  background: linear-gradient(145deg, rgba(33, 54, 80, .72), rgba(10, 24, 42, .94));
  border: 1px solid rgba(93, 126, 166, .3);
  border-radius: 9px;
  color: #7690ad !important;
  display: grid;
  grid-row: 1 / span 2;
  height: 30px;
  overflow: visible;
  place-items: center;
  position: relative;
  transition: border-color 180ms ease, color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
  width: 30px;
}

body[data-route="account"] .member-sidebar .member-tab-icon::after {
  border: 1px solid currentColor;
  border-radius: inherit;
  content: "";
  inset: -1px;
  opacity: 0;
  pointer-events: none;
  position: absolute;
}

body[data-route="account"] .member-sidebar .member-tab-icon svg {
  fill: none;
  height: 17px;
  overflow: visible;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.55;
  transform-box: fill-box;
  transform-origin: center;
  width: 17px;
}

body[data-route="account"] .member-sidebar button:hover .member-tab-icon {
  border-color: rgba(101, 225, 247, .42);
  color: #77e5f9 !important;
  transform: translateY(-1px);
}

body[data-route="account"] .member-sidebar button.active .member-tab-icon {
  background: linear-gradient(145deg, rgba(255, 142, 40, .2), rgba(255, 93, 30, .08));
  border-color: rgba(255, 145, 47, .62);
  box-shadow: 0 0 18px rgba(255, 113, 29, .18), inset 0 0 12px rgba(255, 151, 56, .08);
  color: #ffad55 !important;
}

body[data-route="account"] .member-sidebar button.active .member-tab-icon::after {
  animation: member-tab-active-ring 2.2s ease-out infinite;
}

body[data-route="account"] .member-sidebar .icon-profile svg { animation: member-icon-breathe 3s ease-in-out infinite; }
body[data-route="account"] .member-sidebar .icon-inventory svg { animation: member-icon-float 2.7s ease-in-out infinite; }
body[data-route="account"] .member-sidebar .icon-tiktok .member-tab-icon-link { animation: member-icon-link 2.4s linear infinite; stroke-dasharray: 3 2; }
body[data-route="account"] .member-sidebar .icon-tiktok .node-b { animation: member-icon-node 2.4s ease-in-out infinite; }
body[data-route="account"] .member-sidebar .icon-tiktok .node-c { animation: member-icon-node 2.4s .35s ease-in-out infinite; }
body[data-route="account"] .member-sidebar .icon-tokens svg { animation: member-icon-coin 3.2s ease-in-out infinite; }
body[data-route="account"] .member-sidebar .icon-alerts svg { animation: member-icon-bell 3.8s ease-in-out infinite; transform-origin: 50% 12%; }

@keyframes member-tab-active-ring {
  0% { opacity: .5; transform: scale(1); }
  65%, 100% { opacity: 0; transform: scale(1.24); }
}

@keyframes member-icon-breathe {
  0%, 100% { opacity: .78; transform: scale(.96); }
  50% { opacity: 1; transform: scale(1.06); }
}

@keyframes member-icon-float {
  0%, 100% { transform: translateY(1px) rotate(0); }
  50% { transform: translateY(-2px) rotate(2deg); }
}

@keyframes member-icon-link {
  to { stroke-dashoffset: -10; }
}

@keyframes member-icon-node {
  0%, 100% { opacity: .58; }
  50% { opacity: 1; }
}

@keyframes member-icon-coin {
  0%, 72%, 100% { transform: rotate(0) scale(1); }
  80% { transform: rotate(-8deg) scale(1.06); }
  90% { transform: rotate(8deg) scale(1.06); }
}

@keyframes member-icon-bell {
  0%, 76%, 100% { transform: rotate(0); }
  81% { transform: rotate(-9deg); }
  87% { transform: rotate(8deg); }
  93% { transform: rotate(-4deg); }
}

body[data-route="account"] .member-sidebar button.active {
  background: linear-gradient(90deg, rgba(255, 115, 27, 0.12), rgba(255, 115, 27, 0.02)) !important;
  color: var(--phx-orange) !important;
}

body[data-route="account"] .member-panel {
  background: #091421 !important;
  border: 1px solid var(--phx-border-soft) !important;
  border-radius: 10px !important;
  min-width: 0 !important;
  padding: 16px !important;
}

body[data-route="profile"] .member-profile-page { overflow: hidden !important; }

/* Footer */
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .site-footer {
  background: #050c15 !important;
  border-top: 1px solid var(--phx-border-soft) !important;
  color: var(--phx-muted) !important;
  margin-left: 0 !important;
}

/* Desktop dashboard composition */
@media (min-width: 1120.01px) {
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav {
    inset: auto !important;
    opacity: 1 !important;
    position: static !important;
    transform: none !important;
    visibility: visible !important;
    width: 100% !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .public-sidebar-bottom {
    align-content: start !important;
    align-self: end !important;
    grid-auto-rows: auto !important;
    height: auto !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .public-sidebar-account-zone {
    align-content: start !important;
    align-self: start !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .nav-group,
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .nav-dropdown {
    display: contents !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .nav-group-trigger {
    display: none !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .nav-dropdown > a {
    align-items: center !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    border-right: 3px solid transparent !important;
    box-shadow: none !important;
    color: #8997ab !important;
    display: grid !important;
    flex: 0 0 auto !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    gap: 11px !important;
    grid-template-columns: 22px minmax(0, 1fr) auto !important;
    height: 42px !important;
    justify-content: stretch !important;
    min-height: 42px !important;
    padding: 0 17px !important;
    text-align: left !important;
    width: 100% !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .nav-dropdown > a:hover {
    background: rgba(255, 255, 255, 0.025) !important;
    color: #d6e0ed !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .nav-dropdown > a.active,
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .nav-dropdown > a[aria-current="page"] {
    background: linear-gradient(90deg, rgba(255, 119, 27, 0.12), rgba(255, 119, 27, 0.02)) !important;
    border-right-color: var(--phx-orange) !important;
    color: var(--phx-amber) !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .nav-dropdown > a strong {
    font-size: 12px !important;
    font-weight: 500 !important;
  }
}

@media (max-width: 1120px) {
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) {
    min-width: 0 !important;
    padding-left: 0 !important;
    padding-top: var(--phoenix-topbar-height) !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .site-header {
    left: 0 !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .header-shell {
    padding: 0 12px !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .brand {
    background: transparent !important;
    border: 0 !important;
    height: 58px !important;
    left: auto !important;
    padding: 7px 4px !important;
    position: static !important;
    top: auto !important;
    width: auto !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .brand-mark,
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .brand-mark img {
    height: 36px !important;
    width: 36px !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .brand strong { font-size: 13px !important; }
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .brand small { font-size: 6px !important; }
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .public-route-heading { display: none !important; }
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .nav-toggle { display: inline-flex !important; margin-left: auto !important; }
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .header-actions { margin-left: 0 !important; }
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .public-update-shortcut { display: none !important; }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .site-taskbar {
    bottom: 0 !important;
    box-shadow: 18px 0 45px rgba(0, 0, 0, 0.45) !important;
    grid-template-rows: auto auto minmax(0, 1fr) auto !important;
    height: auto !important;
    left: 0 !important;
    padding-top: 18px !important;
    position: fixed !important;
    right: auto !important;
    top: var(--phoenix-topbar-height) !important;
    transform: translateX(-105%) !important;
    transition: transform 180ms ease !important;
    visibility: visible !important;
    width: min(300px, calc(100vw - 42px)) !important;
    z-index: 160 !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav {
    inset: auto !important;
    opacity: 1 !important;
    position: static !important;
    transform: none !important;
    visibility: visible !important;
    width: 100% !important;
  }

  body.nav-open[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .site-taskbar {
    transform: translateX(0) !important;
  }

  body.nav-open[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .nav-scrim {
    display: block !important;
    z-index: 150 !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .public-sidebar-bottom {
    align-content: start !important;
    grid-auto-rows: auto !important;
    height: auto !important;
  }
}

@media (min-width: 1160px) {
  body[data-route="home"] [data-view="home"]:not([hidden]) {
    align-items: start !important;
    display: grid !important;
    gap: 0 16px !important;
    grid-template-columns: minmax(300px, 0.95fr) minmax(0, 2.1fr) !important;
  }

  body[data-route="home"] .hero { grid-column: 1 !important; }
  body[data-route="home"] .stats { align-self: center !important; grid-column: 2 !important; }
  body[data-route="home"] :is(.community-insights, .live-moderators-panel, .home-grid) { grid-column: 1 / -1 !important; }
}

@media (max-width: 1400px) {
  body[data-route="home"] .community-stats { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}

/* Tablet */
@media (max-width: 1180px) {
  body[data-route="home"] .stats { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  body[data-route="home"] .home-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  body[data-route="home"] .home-grid > :last-child { grid-column: 1 / -1 !important; }
  body[data-route="replays"] .replays-list { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  body[data-route="users"] .user-toolbar { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  body[data-route="users"] .user-search { grid-column: span 2 !important; }
  body[data-route="users"] .user-card { grid-template-columns: minmax(190px, 1fr) minmax(130px, 0.7fr) minmax(320px, 1.5fr) !important; }
  body[data-route="users"] .user-meta { grid-column: 1 / -1 !important; padding-left: 0 !important; }
  body[data-route="levels"] .level-card { grid-template-columns: 40px 42px minmax(170px, 1fr) 100px minmax(150px, 0.85fr) !important; }
  body[data-route="levels"] .level-activity { grid-column: 3 / -1 !important; }
}

/* Mobile navigation and content */
@media (max-width: 900px) {
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) > main {
    padding: 12px 10px 26px !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .public-update-shortcut { display: none !important; }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .page-heading {
    gap: 12px !important;
    margin-bottom: 8px !important;
    min-height: 118px !important;
    padding: 14px 10px !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .page-heading h1 {
    font-size: clamp(24px, 6vw, 30px) !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .page-symbol {
    height: 44px !important;
    min-width: 44px !important;
    width: 44px !important;
  }

  body[data-route="home"] .hero {
    margin-bottom: 6px !important;
    min-height: 130px !important;
    padding: 14px 10px !important;
  }

  body[data-route="home"] .hero-logo { height: 60px !important; width: 68px !important; }
  body[data-route="home"] .stats { gap: 8px !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  body[data-route="home"] .stats article { min-height: 94px !important; padding: 12px !important; }
  body[data-route="home"] .community-stats { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  body[data-route="home"] .community-stat { min-height: 78px !important; padding: 9px !important; }
  body[data-route="home"] .community-insights-head > small { display: none !important; }
  body[data-route="home"] .home-grid { grid-template-columns: 1fr !important; }
  body[data-route="home"] .home-grid > :last-child { grid-column: auto !important; }


  body[data-route="shop"] .shop-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  body[data-route="shop"] .shop-item { min-height: 276px !important; }

  body[data-route="replays"] .replays-list { grid-template-columns: 1fr !important; }

  body[data-route="bans"] .filters,
  body[data-route="mutes"] .filters { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  body[data-route="bans"] .search-field,
  body[data-route="mutes"] .search-field { grid-column: 1 / -1 !important; }
  body[data-route="bans"] .action-row,
  body[data-route="mutes"] .action-row {
    gap: 8px !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    padding: 11px 13px !important;
  }
  body[data-route="bans"] .action-row > *,
  body[data-route="mutes"] .action-row > * { grid-column: auto !important; }
  body[data-route="bans"] .action-row .reason,
  body[data-route="mutes"] .action-row .reason { grid-column: 1 / -1 !important; }

  body[data-route="deban"] .deban-grid { grid-template-columns: 1fr !important; }
  body[data-route="levels"] .level-toolbar { grid-template-columns: 1fr !important; }
  body[data-route="levels"] .level-card {
    grid-template-columns: 36px 42px minmax(0, 1fr) auto !important;
    padding: 10px 12px !important;
  }
  body[data-route="levels"] .level-xp,
  body[data-route="levels"] .level-activity { grid-column: 3 / -1 !important; }

  body[data-route="users"] .user-toolbar { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  body[data-route="users"] .user-search { grid-column: 1 / -1 !important; }
  body[data-route="users"] .user-card {
    grid-template-columns: minmax(0, 1fr) auto !important;
    padding: 11px 12px !important;
  }
  body[data-route="users"] .user-stats,
  body[data-route="users"] .user-meta { grid-column: 1 / -1 !important; }

  body[data-route="account"] .account-layout { grid-template-columns: 1fr !important; }
  body[data-route="account"] .account-intro { min-height: 250px !important; }
  body[data-route="account"] .member-dashboard { grid-template-columns: 1fr !important; }
  body[data-route="account"] .member-sidebar {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 600px) {
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) :is(
    .registry,
    .filters,
    .level-toolbar,
    .user-toolbar,
    .deban-panel,
    .deban-appeals-panel,
    .recruitment-list-panel,
    .shop-wallet,
    .shop-catalog-section,
    .replays-retention-notice,
    .replays-catalog,
      .live-moderators-panel,
    .top-levels-panel,
    .recent-panel,
    .top-donors-panel,
    .auth-card,
    .account-intro
  ) { border-radius: 12px !important; }

  body[data-route="home"] .hero { grid-template-columns: 1fr !important; }
  body[data-route="home"] .hero-logo { display: none !important; }
  body[data-route="home"] .hero-actions { flex-wrap: wrap !important; }
  body[data-route="home"] .stats article strong { font-size: 22px !important; }

  body[data-route="shop"] .shop-wallet {
    grid-template-columns: auto minmax(0, 1fr) !important;
  }
  body[data-route="shop"] .shop-wallet > button { grid-column: 1 / -1 !important; width: 100% !important; }
  body[data-route="shop"] .shop-grid { grid-template-columns: 1fr !important; }
  body[data-route="shop"] .shop-item { min-height: 260px !important; }

  body[data-route="replays"] .replays-retention-notice {
    grid-template-columns: auto minmax(0, 1fr) !important;
  }
  body[data-route="replays"] .replays-retention-notice em { grid-column: 1 / -1 !important; justify-self: start !important; }

  body[data-route="bans"] .filters,
  body[data-route="mutes"] .filters { grid-template-columns: 1fr !important; }
  body[data-route="bans"] .filters > *,
  body[data-route="mutes"] .filters > * { grid-column: auto !important; }

  body[data-route="deban"] .deban-search-form { grid-template-columns: 1fr !important; }
  body[data-route="deban"] .deban-search-form button { width: 100% !important; }

  body[data-route="levels"] .level-card {
    grid-template-columns: 32px 40px minmax(0, 1fr) !important;
  }
  body[data-route="levels"] .level-status { grid-column: 3 !important; }
  body[data-route="levels"] .level-xp,
  body[data-route="levels"] .level-activity { grid-column: 1 / -1 !important; }

  body[data-route="users"] .user-toolbar { grid-template-columns: 1fr !important; }
  body[data-route="users"] .user-toolbar > * { grid-column: auto !important; }
  body[data-route="users"] .user-stats { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }

  body[data-route="account"] .account-intro { display: none !important; }
}

/* Responsive hardening across every public route. */
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) :is(
  .view,
  .page-heading,
  .filters,
  .registry,
  .shop-page,
  .shop-wallet,
  .shop-catalog-section,
  .replays-catalog,
  .replays-list,
  .deban-grid,
  .recruitment-layout,
  .level-toolbar,
  .levels-list,
  .user-toolbar,
  .users-list,
  .account-layout,
  .auth-card,
  .member-dashboard,
  .member-panels,
  .member-panel
) {
  box-sizing: border-box !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) :is(
  .page-heading,
  .section-head,
  .registry-head,
  .cosmetic-section-head,
  .replays-catalog-head,
  .live-moderators-head,
  .member-panel-title
) > * {
  min-width: 0 !important;
}

@media (min-width: 900.01px) and (max-width: 1120px) {
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) > main {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }


  body[data-route="home"] .home-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body[data-route="bans"] .action-row,
  body[data-route="mutes"] .action-row {
    align-items: center !important;
    grid-template-columns: minmax(0, 1fr) minmax(120px, 0.55fr) minmax(0, 1fr) !important;
  }

  body[data-route="bans"] .action-row > *,
  body[data-route="mutes"] .action-row > * {
    min-width: 0 !important;
  }
}

@media (max-width: 720px) {
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) :is(
    .section-head,
    .registry-head,
    .cosmetic-section-head,
    .replays-catalog-head,
      .live-moderators-head,
    .member-panel-title
  ) {
    align-items: flex-start !important;
    flex-wrap: wrap !important;
  }


  body[data-route="shop"] .shop-wallet small {
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
  }

  body[data-route="replays"] .replay-profile-identity p {
    -webkit-line-clamp: 2 !important;
  }


}

@media (max-width: 600px) {
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) > main {
    padding-left: 9px !important;
    padding-right: 9px !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .page-heading {
    grid-template-columns: minmax(0, 1fr) auto !important;
    width: 100% !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .page-heading h1 {
    overflow-wrap: anywhere !important;
  }





  body[data-route="bans"] .action-row,
  body[data-route="mutes"] .action-row {
    align-items: start !important;
    gap: 10px !important;
    grid-template-columns: minmax(0, 1fr) !important;
    padding: 13px !important;
  }

  body[data-route="bans"] .action-row > *,
  body[data-route="mutes"] .action-row > * {
    grid-column: 1 !important;
    min-width: 0 !important;
    width: 100% !important;
  }

  body[data-route="bans"] .action-row :is(.duration, time),
  body[data-route="mutes"] .action-row :is(.duration, time) {
    overflow-wrap: anywhere !important;
  }

  body[data-route="levels"] .level-toolbar > div,
  body[data-route="users"] .user-total {
    justify-items: start !important;
    text-align: left !important;
  }

  body[data-route="account"] .member-sidebar {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body[data-route="account"] .member-sidebar button {
    min-width: 0 !important;
    width: 100% !important;
  }

  body[data-route="account"] .account-layout.member-active .auth-card {
    min-height: 0 !important;
    padding: 14px 10px 20px !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .pagination {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
    width: 100% !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .pagination button {
    min-width: 0 !important;
    width: 100% !important;
  }
}

@media (max-width: 380px) {
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .header-shell {
    gap: 6px !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .page-heading {
    gap: 8px !important;
    padding-left: 7px !important;
    padding-right: 7px !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .page-heading h1 {
    font-size: 22px !important;
  }

  body[data-route="home"] .stats {
    gap: 6px !important;
  }

  body[data-route="home"] .stats article {
    min-height: 90px !important;
    padding: 10px !important;
  }

  body[data-route="home"] .stat-sparkline {
    opacity: 0.55 !important;
    width: 48px !important;
  }

  body[data-route="home"] .community-stat {
    gap: 7px !important;
    padding: 8px !important;
  }

  body[data-route="home"] .community-stat-icon {
    height: 32px !important;
    width: 32px !important;
  }

  body[data-route="home"] .community-stat small {
    font-size: 6.5px !important;
    letter-spacing: 0.025em !important;
  }
}

@media (max-width: 1120px) and (max-height: 600px) {
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .site-taskbar {
    grid-template-rows: auto auto minmax(0, 1fr) auto !important;
  }

  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .public-help-card {
    display: none !important;
  }
}

/* =========================================================
   PASSE LIVE · parcours premium de saison
   ========================================================= */
body[data-route="live-pass"] > main > .live-pass-view {
  max-width: 1500px !important;
}

.live-pass-shell {
  --pass-violet: #8664ff;
  --pass-cyan: #59e2ff;
  --pass-gold: #ffbd46;
  display: grid;
  gap: 18px;
  min-width: 0;
}

.live-pass-hero {
  background:
    linear-gradient(120deg, rgba(8, 15, 32, .96) 0%, rgba(15, 22, 48, .96) 42%, rgba(8, 28, 43, .96) 100%),
    #081120;
  border: 1px solid rgba(102, 133, 180, .25);
  border-radius: 20px;
  box-shadow: 0 28px 80px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .035);
  display: grid;
  gap: 24px 28px;
  grid-template-columns: minmax(0, 1fr) 250px;
  min-height: 390px;
  overflow: hidden;
  padding: clamp(28px, 4vw, 56px);
  position: relative;
}

.live-pass-hero::before {
  background-image:
    linear-gradient(rgba(121, 102, 255, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(121, 102, 255, .045) 1px, transparent 1px);
  background-size: 44px 44px;
  content: "";
  inset: 0;
  mask-image: linear-gradient(90deg, transparent, #000 28%, #000);
  opacity: .65;
  pointer-events: none;
  position: absolute;
}

.live-pass-hero::after {
  background: linear-gradient(90deg, var(--pass-violet), var(--pass-cyan), var(--pass-gold));
  bottom: 0;
  content: "";
  height: 3px;
  left: 0;
  position: absolute;
  right: 0;
}

.live-pass-hero-glow,
.live-pass-hero-glow i { position: absolute; pointer-events: none; }
.live-pass-hero-glow { inset: 0; }
.live-pass-hero-glow i { border-radius: 50%; filter: blur(4px); }
.live-pass-hero-glow i:nth-child(1) { background: rgba(118, 75, 255, .18); height: 360px; right: 9%; top: -180px; width: 360px; }
.live-pass-hero-glow i:nth-child(2) { background: rgba(39, 215, 255, .12); bottom: -220px; height: 400px; right: -90px; width: 400px; }
.live-pass-hero-glow i:nth-child(3) { background: rgba(255, 154, 38, .08); bottom: -160px; height: 300px; left: 18%; width: 300px; }

.live-pass-hero-copy {
  align-self: center;
  display: grid;
  justify-items: start;
  max-width: 720px;
  min-width: 0;
  position: relative;
  z-index: 2;
}

.live-pass-season {
  background: linear-gradient(90deg, rgba(130, 90, 255, .2), rgba(53, 212, 255, .12));
  border: 1px solid rgba(130, 102, 255, .42);
  border-radius: 999px;
  color: #cbbcff;
  font-size: .66rem;
  font-weight: 950;
  letter-spacing: .17em;
  margin-bottom: 18px;
  padding: 8px 13px;
}

.live-pass-hero-copy .eyebrow { color: var(--pass-cyan); margin: 0 0 5px; }
.live-pass-hero-copy h1 {
  background: linear-gradient(90deg, #fff, #cbbdff 45%, #70e9ff 82%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-size: clamp(2.7rem, 6vw, 5.8rem);
  font-weight: 950;
  letter-spacing: -.075em;
  line-height: .92;
  margin: 0;
  text-transform: uppercase;
}

.live-pass-hero-copy > strong {
  color: #ffce76;
  font-size: clamp(.78rem, 1.4vw, 1.02rem);
  letter-spacing: .08em;
  margin-top: 12px;
  text-transform: uppercase;
}

.live-pass-hero-copy > p:not(.eyebrow):not(.auth-message) {
  color: #8fa1b9;
  font-size: clamp(.84rem, 1.2vw, 1rem);
  line-height: 1.65;
  margin: 14px 0 0;
  max-width: 610px;
}

.live-pass-hero-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 13px;
  margin-top: 26px;
}

.live-pass-purchase {
  align-items: center;
  background: linear-gradient(115deg, #6f43ed, #7c59ff 44%, #1abdda);
  border: 1px solid rgba(177, 157, 255, .72);
  border-radius: 10px;
  box-shadow: 0 14px 34px rgba(85, 52, 220, .32), inset 0 1px 0 rgba(255, 255, 255, .2);
  color: #fff;
  cursor: pointer;
  display: inline-grid;
  gap: 2px;
  min-height: 58px;
  min-width: 218px;
  padding: 10px 24px;
  text-align: left;
  transition: transform 180ms ease, filter 180ms ease, box-shadow 180ms ease;
}
.live-pass-purchase:hover:not(:disabled) { box-shadow: 0 18px 38px rgba(85, 52, 220, .46), 0 0 22px rgba(69, 221, 255, .17); filter: brightness(1.08); transform: translateY(-2px); }
.live-pass-purchase:disabled { cursor: not-allowed; filter: saturate(.35); opacity: .58; }
.live-pass-purchase span { font-size: .75rem; font-weight: 950; letter-spacing: .08em; }
.live-pass-purchase strong { color: #e9faff; font-size: .66rem; letter-spacing: .06em; }
.live-pass-purchase strong b { color: #ffe08f; font-size: .86rem; }

.live-pass-access-state {
  align-items: center;
  border: 1px solid rgba(103, 129, 166, .26);
  border-radius: 999px;
  color: #8a9ab0;
  display: inline-flex;
  font-size: .67rem;
  gap: 8px;
  min-height: 38px;
  padding: 0 14px;
}
.live-pass-access-state i { background: #66778e; border-radius: 50%; height: 7px; width: 7px; }
.live-pass-access-state[data-state="owned"] { border-color: rgba(55, 219, 157, .32); color: #75e9bd; }
.live-pass-access-state[data-state="owned"] i { background: #43dc9e; box-shadow: 0 0 10px rgba(67, 220, 158, .8); }
.live-pass-access-state[data-state="closed"] { border-color: rgba(255, 98, 124, .3); color: #ff8297; }
.live-pass-access-state[data-state="closed"] i { background: #ff5d77; }
.live-pass-hero-copy > .auth-message { margin-top: 13px; max-width: 620px; width: 100%; }

.live-pass-emblem {
  align-self: center;
  aspect-ratio: 1;
  display: grid;
  justify-items: center;
  place-content: center;
  position: relative;
  z-index: 2;
}
.live-pass-emblem::before,
.live-pass-emblem::after { border-radius: 28%; content: ""; inset: 4%; position: absolute; transform: rotate(45deg); }
.live-pass-emblem::before { background: linear-gradient(145deg, rgba(128, 77, 255, .22), rgba(31, 210, 255, .11)); border: 1px solid rgba(126, 107, 255, .48); box-shadow: 0 0 52px rgba(110, 74, 255, .24), inset 0 0 36px rgba(53, 211, 255, .06); }
.live-pass-emblem::after { border: 1px solid rgba(97, 221, 255, .18); inset: 16%; }
.live-pass-emblem > span { color: #bfaeff; display: grid; height: 82px; place-items: center; position: relative; width: 82px; z-index: 1; }
.live-pass-emblem svg { fill: rgba(122, 87, 255, .16); height: 74px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.3; width: 74px; }
.live-pass-emblem strong { color: #f5f2ff; font-size: 1.4rem; letter-spacing: .12em; position: relative; z-index: 1; }
.live-pass-emblem small { color: #5de4ff; font-size: .58rem; font-weight: 900; letter-spacing: .22em; margin-top: 3px; position: relative; z-index: 1; }

.live-pass-account-stats {
  display: grid;
  gap: 10px;
  grid-column: 1 / -1;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  position: relative;
  z-index: 2;
}
.live-pass-account-stats article {
  background: linear-gradient(135deg, rgba(17, 30, 52, .78), rgba(8, 20, 37, .86));
  border: 1px solid rgba(94, 124, 164, .24);
  border-radius: 11px;
  display: grid;
  min-height: 96px;
  padding: 15px 17px;
}
.live-pass-account-stats small { color: #6fdff4; font-size: .58rem; font-weight: 900; letter-spacing: .12em; }
.live-pass-account-stats strong { align-self: center; color: #f4f7fc; font-size: clamp(1.35rem, 2.3vw, 2rem); }
.live-pass-account-stats strong b { font: inherit; }
.live-pass-account-stats span { color: #71839c; font-size: .66rem; }

.live-pass-progress-panel,
.live-pass-rewards-panel {
  background: linear-gradient(145deg, rgba(12, 25, 43, .97), rgba(7, 17, 31, .99));
  border: 1px solid rgba(82, 111, 150, .24);
  border-radius: 16px;
  min-width: 0;
}
.live-pass-progress-panel { padding: clamp(18px, 2.6vw, 28px); }
.live-pass-progress-panel > header,
.live-pass-rewards-panel > header { align-items: end; display: flex; gap: 20px; justify-content: space-between; }
.live-pass-progress-panel h2,
.live-pass-rewards-panel h2 { color: #ecf2f9; font-size: clamp(1.05rem, 2vw, 1.45rem); margin: 3px 0 0; }
.live-pass-progress-panel .eyebrow,
.live-pass-rewards-panel .eyebrow { color: #5ee3ff; margin: 0; }
.live-pass-progress-meta { color: #7789a0; display: flex; font-size: .68rem; font-weight: 800; justify-content: space-between; margin-top: 24px; text-transform: uppercase; }
.live-pass-progress-meta b { color: #d8e2ef; }
.live-pass-progress-track { background: #17243a; border: 1px solid #21334c; border-radius: 999px; height: 12px; margin-top: 9px; position: relative; }
.live-pass-progress-track > span { background: linear-gradient(90deg, #7045e9, #7f62ff 50%, #44d8f5); border-radius: inherit; box-shadow: 0 0 14px rgba(99, 93, 255, .36); height: 100%; left: 0; max-width: 100%; position: absolute; top: 0; transition: width 420ms ease; }
.live-pass-progress-track > i { background: #dffaff; border: 3px solid #6c5bea; border-radius: 50%; box-shadow: 0 0 0 4px rgba(99, 91, 234, .15), 0 0 18px rgba(68, 216, 245, .52); height: 20px; margin-left: -10px; margin-top: -5px; position: absolute; top: 0; transition: left 420ms ease; width: 20px; }

.live-pass-rewards-panel { overflow: hidden; padding: 0; }
.live-pass-rewards-panel > header { border-bottom: 1px solid rgba(83, 111, 148, .22); padding: clamp(20px, 2.8vw, 30px); }
.live-pass-rewards-panel > header p:not(.eyebrow) { color: #75879e; font-size: .76rem; line-height: 1.5; margin: 7px 0 0; max-width: 720px; }
.live-pass-rewards-panel > header > span { background: rgba(89, 226, 255, .07); border: 1px solid rgba(89, 226, 255, .2); border-radius: 999px; color: #7f91a8; flex: 0 0 auto; font-size: .66rem; padding: 8px 12px; }
.live-pass-rewards-panel > header > span b { color: #6ce5fb; }

.live-pass-rewards {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  min-height: 180px;
  padding: clamp(16px, 2.4vw, 26px);
}

.live-pass-reward-card {
  background: linear-gradient(155deg, rgba(19, 34, 59, .98), rgba(8, 20, 36, .99));
  border: 1px solid rgba(90, 122, 164, .28);
  border-radius: 13px;
  display: grid;
  grid-template-rows: auto 132px minmax(0, 1fr) auto;
  min-height: 390px;
  min-width: 0;
  overflow: hidden;
  position: relative;
  transition: border-color 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}
.live-pass-reward-card:hover { border-color: rgba(113, 100, 255, .52); box-shadow: 0 16px 36px rgba(0, 0, 0, .24), 0 0 24px rgba(104, 79, 255, .07); transform: translateY(-3px); }
.live-pass-reward-card::before { background: linear-gradient(90deg, #7551f0, #50dff8); content: ""; height: 2px; left: 0; opacity: .9; position: absolute; right: 0; top: 0; }
.live-pass-reward-card.level-locked { filter: saturate(.58); }
.live-pass-reward-card.claimed { border-color: rgba(62, 218, 154, .38); }
.live-pass-reward-card.claimed::before { background: linear-gradient(90deg, #31c98d, #7ff1be); }

.live-pass-reward-level {
  align-items: center;
  background: rgba(8, 17, 31, .78);
  border-bottom: 1px solid rgba(87, 117, 155, .19);
  color: #dce6f2;
  display: flex;
  gap: 5px;
  min-height: 42px;
  padding: 8px 12px;
}
.live-pass-reward-level small { color: #72869f; font-size: .55rem; font-weight: 900; letter-spacing: .1em; }
.live-pass-reward-level strong { color: #cabdff; font-size: 1.12rem; }

.live-pass-reward-visual {
  align-items: center;
  background: radial-gradient(circle at 50% 55%, rgba(116, 81, 247, .2), transparent 67%);
  display: flex;
  justify-content: center;
  min-width: 0;
  overflow: hidden;
  padding: 12px;
  position: relative;
}
.live-pass-reward-visual.type-tokens { background: radial-gradient(circle at 50% 55%, rgba(255, 181, 49, .18), transparent 67%); color: #ffc75d; }
.live-pass-reward-visual.type-xp_boost { background: radial-gradient(circle at 50% 55%, rgba(55, 215, 255, .2), transparent 67%); color: #61e4ff; }
.live-pass-reward-icon { display: grid; height: 70px; place-items: center; width: 70px; }
.live-pass-reward-icon svg { fill: rgba(255, 255, 255, .035); height: 68px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.35; width: 68px; }
.live-pass-reward-visual > b { background: #0b1729; border: 1px solid currentColor; border-radius: 999px; bottom: 16px; color: inherit; font-size: .66rem; padding: 4px 8px; position: absolute; right: 16px; }
.live-pass-frame-preview { display: grid; height: 96px; place-items: center; position: relative; width: 96px; }
.live-pass-frame-preview > span { background: linear-gradient(145deg, #2c4260, #112139); border-radius: 50%; color: #f4f8fd; display: grid; font-size: .72rem; font-weight: 900; height: 62px; place-items: center; width: 62px; }
.live-pass-frame-preview img { height: 96px; inset: 0; object-fit: contain; position: absolute; width: 96px; z-index: 2; }
.live-pass-reward-visual .cosmetic-mini-notification { max-width: 210px; transform: scale(.86); width: 100%; }

.live-pass-reward-copy { display: grid; align-content: start; gap: 5px; min-width: 0; padding: 15px 15px 10px; }
.live-pass-reward-copy > small { color: #67dff4; font-size: .55rem; font-weight: 950; letter-spacing: .12em; }
.live-pass-reward-copy > strong { color: #eef3fa; font-size: .88rem; line-height: 1.25; overflow-wrap: anywhere; }
.live-pass-reward-copy > b { color: #ffd077; font-size: .7rem; font-weight: 850; }
.live-pass-reward-copy > p { color: #71849d; font-size: .67rem; line-height: 1.48; margin: 3px 0 0; overflow-wrap: anywhere; }

.live-pass-reward-card > footer { border-top: 1px solid rgba(83, 111, 148, .18); display: grid; gap: 8px; padding: 12px 14px 14px; }
.live-pass-reward-cost { color: #687a91; font-size: .56rem; min-height: 13px; }
.live-pass-reward-action { background: linear-gradient(110deg, rgba(100, 66, 227, .94), rgba(54, 184, 220, .9)); border: 1px solid rgba(147, 130, 255, .5); border-radius: 8px; color: #f8fbff; cursor: pointer; font-size: .63rem; font-weight: 950; letter-spacing: .055em; min-height: 39px; padding: 8px 10px; }
.live-pass-reward-action:hover:not(:disabled) { filter: brightness(1.12); }
.live-pass-reward-action:disabled { background: rgba(18, 32, 51, .9); border-color: rgba(83, 108, 142, .24); color: #61738b; cursor: not-allowed; }
.live-pass-reward-card.claimed .live-pass-reward-action:disabled { background: rgba(43, 164, 113, .12); border-color: rgba(68, 217, 153, .32); color: #69dda9; }

@media (max-width: 1220px) {
  .live-pass-rewards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 960px) {
  .live-pass-hero { grid-template-columns: minmax(0, 1fr) 190px; }
  .live-pass-rewards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  .live-pass-hero { gap: 20px; grid-template-columns: 1fr; min-height: 0; padding: 24px 18px; }
  .live-pass-emblem { display: none; }
  .live-pass-account-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .live-pass-account-stats article { min-height: 82px; padding: 12px; }
  .live-pass-account-stats small { font-size: .48rem; }
  .live-pass-account-stats strong { font-size: 1.15rem; }
  .live-pass-account-stats span { font-size: .55rem; overflow-wrap: anywhere; }
  .live-pass-progress-panel > header,
  .live-pass-rewards-panel > header { align-items: flex-start; flex-wrap: wrap; }
}

@media (max-width: 560px) {
  .live-pass-shell { gap: 12px; }
  .live-pass-hero { border-radius: 14px; padding: 22px 15px; }
  .live-pass-hero-copy h1 { font-size: clamp(2.45rem, 16vw, 4.2rem); }
  .live-pass-hero-actions { align-items: stretch; display: grid; width: 100%; }
  .live-pass-purchase { width: 100%; }
  .live-pass-access-state { justify-content: center; width: 100%; }
  .live-pass-account-stats { grid-template-columns: 1fr; }
  .live-pass-account-stats article { grid-template-columns: minmax(0, 1fr) auto; min-height: 70px; }
  .live-pass-account-stats article > span { grid-column: 1; }
  .live-pass-account-stats article > strong { grid-column: 2; grid-row: 1 / span 2; }
  .live-pass-rewards { grid-template-columns: 1fr; padding: 11px; }
  .live-pass-reward-card { grid-template-columns: 74px minmax(0, 1fr); grid-template-rows: 42px auto auto; min-height: 0; }
  .live-pass-reward-level { grid-column: 1 / -1; }
  .live-pass-reward-visual { grid-column: 1; grid-row: 2; min-height: 112px; padding: 8px; }
  .live-pass-reward-copy { grid-column: 2; grid-row: 2; padding: 13px 12px 8px; }
  .live-pass-reward-card > footer { grid-column: 1 / -1; grid-row: 3; }
  .live-pass-frame-preview { height: 70px; width: 70px; }
  .live-pass-frame-preview > span { height: 45px; width: 45px; }
  .live-pass-frame-preview img { height: 70px; width: 70px; }
  .live-pass-reward-icon,
  .live-pass-reward-icon svg { height: 50px; width: 50px; }
  .live-pass-reward-visual > b { bottom: 8px; right: 8px; }
  .live-pass-reward-visual .cosmetic-mini-notification { transform: rotate(-90deg) scale(.5); width: 150px; }
}

@media (max-width: 380px) {
  .live-pass-hero { padding-inline: 12px; }
  .live-pass-progress-panel,
  .live-pass-rewards-panel > header { padding-inline: 13px; }
  .live-pass-reward-card { grid-template-columns: 66px minmax(0, 1fr); }
  .live-pass-reward-copy { padding-right: 8px; }
}

@media (prefers-reduced-motion: reduce) {
  .live-pass-progress-track > span,
  .live-pass-progress-track > i,
  .live-pass-reward-card,
  .live-pass-purchase { transition: none; }
}

/* Member inventory */
.header-user-links > .header-user-inventory-link {
  background: linear-gradient(105deg, rgba(105, 72, 232, .12), rgba(46, 205, 237, .055));
  border-color: rgba(105, 118, 255, .18);
}

.header-user-inventory-link svg {
  background: linear-gradient(145deg, rgba(113, 76, 244, .18), rgba(39, 207, 238, .12));
  border-color: rgba(117, 103, 255, .36);
  color: #8fe9ff;
  box-shadow: inset 0 0 14px rgba(105, 72, 232, .08);
}

.header-user-links > .header-user-inventory-link:hover {
  background: linear-gradient(105deg, rgba(105, 72, 232, .2), rgba(46, 205, 237, .09));
  border-color: rgba(112, 111, 255, .4);
  box-shadow: 0 0 22px rgba(91, 82, 234, .1);
}

body[data-route="account"] .member-inventory-panel {
  background:
    radial-gradient(circle at 91% 1%, rgba(99, 73, 226, .095), transparent 26%),
    radial-gradient(circle at 7% 3%, rgba(43, 210, 238, .055), transparent 23%),
    #091421 !important;
  display: grid;
  gap: 15px;
  padding: clamp(14px, 2vw, 22px) !important;
}

.inventory-panel-title > div > p:last-child {
  color: #74879f;
  font-size: .7rem;
  line-height: 1.5;
  margin: 5px 0 0;
}

.inventory-hero {
  align-items: start;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
}

.inventory-wallet-card,
.inventory-loadout-card {
  background: linear-gradient(145deg, rgba(18, 33, 56, .96), rgba(8, 19, 34, .98));
  border: 1px solid rgba(86, 115, 153, .28);
  border-radius: 13px;
  min-width: 0;
  min-height: 148px;
  overflow: hidden;
  position: relative;
}

.inventory-wallet-card {
  align-items: center;
  display: grid;
  gap: 13px;
  grid-template-columns: auto minmax(0, 1fr);
  padding: 20px;
}

.inventory-wallet-card::after {
  background: radial-gradient(circle, rgba(255, 188, 68, .2), transparent 68%);
  content: "";
  height: 150px;
  pointer-events: none;
  position: absolute;
  right: -54px;
  top: -62px;
  width: 150px;
}

.inventory-wallet-orb {
  background: linear-gradient(145deg, #ffb333, #f26a2d);
  border: 1px solid #ffd779;
  border-radius: 50%;
  box-shadow: 0 0 0 6px rgba(255, 175, 53, .08), 0 12px 30px rgba(241, 101, 40, .24);
  color: #33160a;
  display: grid;
  height: 50px;
  place-items: center;
  width: 50px;
}

.inventory-wallet-orb svg {
  fill: rgba(255, 255, 255, .12);
  height: 27px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.6;
  width: 27px;
}

.inventory-wallet-card > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.inventory-wallet-card small,
.inventory-loadout-copy small {
  color: #65ddf4;
  font-size: .55rem;
  font-weight: 950;
  letter-spacing: .11em;
}

.inventory-wallet-card > div > strong {
  color: #f4f7fc;
  font-size: clamp(1.28rem, 2.3vw, 1.8rem);
  line-height: 1.1;
}

.inventory-wallet-card > div > strong b { color: #ffc45d; font: inherit; }
.inventory-wallet-card > div > span,
.inventory-loadout-copy > span { color: #73869e; font-size: .65rem; overflow-wrap: anywhere; }

.inventory-wallet-card dl {
  display: grid;
  gap: 8px;
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
}

.inventory-wallet-card dl > div {
  align-items: center;
  background: rgba(5, 14, 26, .62);
  border: 1px solid rgba(83, 111, 148, .2);
  border-radius: 8px;
  display: flex;
  justify-content: space-between;
  padding: 9px 11px;
}

.inventory-wallet-card dt { color: #71849c; font-size: .58rem; text-transform: uppercase; }
.inventory-wallet-card dd { color: #e6edf6; font-size: .75rem; font-weight: 900; margin: 0; }

.inventory-loadout-card {
  align-items: center;
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1fr);
  padding: 18px 20px;
}

.inventory-loadout-copy { display: grid; gap: 5px; }
.inventory-loadout-copy > strong { color: #f0f4fa; font-size: 1rem; }
.inventory-loadout-previews { align-items: center; display: grid; gap: 10px; grid-template-columns: auto minmax(120px, 1fr) auto; min-width: 0; }

.inventory-avatar-preview {
  display: grid;
  flex: 0 0 auto;
  height: 94px;
  place-items: center;
  position: relative;
  width: 94px;
}

.inventory-avatar-preview > img:first-child,
.inventory-avatar-preview > b {
  background: linear-gradient(145deg, #253b57, #0e1d31);
  border-radius: 50%;
  height: 61px;
  object-fit: cover;
  width: 61px;
}

.inventory-avatar-preview > b { color: #f2f6fb; display: grid; font-size: .72rem; place-items: center; }
.inventory-avatar-preview .cosmetic-frame-image { height: 94px; inset: 0; object-fit: contain; position: absolute; width: 94px; z-index: 2; }
.inventory-notification-preview { min-width: 0; overflow: hidden; }
.inventory-notification-preview .cosmetic-mini-notification { width: 100%; }
.inventory-bubble-preview { display: grid; min-height: 94px; min-width: 94px; overflow: visible; place-items: center; }
.inventory-bubble-preview .inventory-empty { padding: 8px; }
.inventory-bubble-schema-section { background: radial-gradient(circle at 82% 0, rgba(108, 76, 255, .15), transparent 38%), linear-gradient(145deg, rgba(12, 25, 43, .98), rgba(7, 17, 30, .99)); border-color: rgba(117, 93, 244, .34); }

.inventory-summary-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.inventory-summary-grid article {
  background: linear-gradient(145deg, rgba(15, 30, 50, .9), rgba(8, 18, 31, .95));
  border: 1px solid rgba(84, 112, 150, .22);
  border-radius: 10px;
  display: grid;
  gap: 3px;
  min-height: 90px;
  padding: 14px;
}

.inventory-summary-grid small { color: #6ddff4; font-size: .52rem; font-weight: 950; letter-spacing: .1em; }
.inventory-summary-grid strong { align-self: end; color: #f1f5fb; font-size: 1.45rem; line-height: 1; }
.inventory-summary-grid span { color: #708198; font-size: .57rem; }

.inventory-section {
  background: linear-gradient(145deg, rgba(12, 25, 43, .98), rgba(7, 17, 30, .99));
  border: 1px solid rgba(82, 110, 148, .24);
  border-radius: 13px;
  min-width: 0;
  overflow: hidden;
  padding: clamp(15px, 2vw, 20px);
}

.inventory-section-head {
  align-items: center;
  display: flex;
  gap: 18px;
  justify-content: space-between;
  margin-bottom: 14px;
}

.inventory-section-head > div { min-width: 0; }
.inventory-section-head .eyebrow { color: #5ce0fa; font-size: .53rem; margin: 0; }
.inventory-section-head h4 { color: #ecf2f9; font-size: .98rem; margin: 3px 0 0; }
.inventory-section-head p:not(.eyebrow) { color: #72849b; font-size: .65rem; line-height: 1.45; margin: 5px 0 0; }
.inventory-section-head > span {
  background: rgba(86, 222, 249, .07);
  border: 1px solid rgba(86, 222, 249, .2);
  border-radius: 999px;
  color: #7b8ca3;
  flex: 0 0 auto;
  font-size: .58rem;
  padding: 7px 10px;
}
.inventory-section-head > span.active {
  background: rgba(29, 220, 129, .12);
  border-color: rgba(52, 240, 153, .5);
  box-shadow: 0 0 18px rgba(29, 220, 129, .12), inset 0 0 12px rgba(29, 220, 129, .06);
  color: #70f2b4;
  font-variant-numeric: tabular-nums;
  font-weight: 800;
}

.inventory-booster-grid,
.inventory-cosmetic-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.inventory-booster-card,
.inventory-cosmetic-card {
  background: rgba(7, 17, 31, .72);
  border: 1px solid rgba(84, 114, 154, .24);
  border-radius: 11px;
  display: grid;
  gap: 11px;
  min-width: 0;
  padding: 12px;
  transition: border-color 170ms ease, box-shadow 170ms ease, transform 170ms ease;
}

.inventory-booster-card:hover,
.inventory-cosmetic-card:hover { border-color: rgba(104, 108, 245, .48); box-shadow: 0 11px 25px rgba(0, 0, 0, .18); transform: translateY(-2px); }
.inventory-cosmetic-card.active { border-color: rgba(57, 216, 155, .4); }
.inventory-cosmetic-card.preview-selected { box-shadow: inset 0 0 0 1px rgba(107, 95, 242, .48), 0 0 20px rgba(87, 72, 215, .08); }
.inventory-booster-card.consumed { filter: saturate(.4); opacity: .62; }
.inventory-booster-card.stacked { border-color: rgba(91, 221, 251, .34); }

.inventory-booster-visual {
  align-items: end;
  background: radial-gradient(circle at 50% 45%, rgba(83, 221, 255, .22), transparent 68%);
  border-bottom: 1px solid rgba(84, 113, 152, .18);
  color: #65e4ff;
  display: flex;
  height: 82px;
  justify-content: center;
  padding-bottom: 17px;
  position: relative;
}
.inventory-booster-visual strong { font-size: 1.85rem; font-style: italic; line-height: 1; text-shadow: 0 0 18px rgba(65, 219, 250, .38); }
.inventory-booster-icon { border-radius: 14px; height: 68px; object-fit: cover; width: 68px; }
.inventory-booster-visual b { color: #c2f7ff; font-size: .86rem; margin-bottom: 2px; }
.inventory-booster-visual em { background: #111f34; border: 1px solid #465a76; border-radius: 999px; color: #e6edf7; font-size: .6rem; font-style: normal; padding: 3px 7px; position: absolute; right: 0; top: 0; }

.inventory-booster-copy,
.inventory-cosmetic-copy { display: grid; gap: 4px; min-width: 0; }
.inventory-booster-copy small,
.inventory-cosmetic-copy small { color: #65dff6; font-size: .5rem; font-weight: 900; letter-spacing: .1em; }
.inventory-booster-copy strong,
.inventory-cosmetic-copy strong { color: #ebf1f8; font-size: .76rem; overflow-wrap: anywhere; }
.inventory-booster-copy p,
.inventory-cosmetic-copy p { color: #70839b; font-size: .6rem; line-height: 1.45; margin: 0; overflow-wrap: anywhere; }
.inventory-booster-card > button,
.inventory-cosmetic-card > button:last-child { min-height: 37px; width: 100%; }
.inventory-cosmetic-card > button.equipped { border-color: rgba(53, 211, 153, .32); color: #6cdfac; }

.inventory-cosmetic-preview {
  align-items: center;
  background: radial-gradient(circle at 50% 50%, rgba(106, 80, 235, .12), transparent 70%);
  border: 0;
  border-bottom: 1px solid rgba(84, 113, 152, .18);
  color: inherit;
  cursor: pointer;
  display: flex;
  height: 112px;
  justify-content: center;
  min-width: 0;
  overflow: hidden;
  padding: 8px;
}
.inventory-cosmetic-preview .cosmetic-mini-frame { height: 88px; width: 88px; }
.inventory-cosmetic-preview .cosmetic-mini-frame > span { height: 57px; width: 57px; }
.inventory-cosmetic-preview .cosmetic-mini-frame-image { height: 88px; width: 88px; }
.inventory-notification-grid .inventory-cosmetic-preview { height: 126px; }
.inventory-notification-grid .cosmetic-mini-notification { max-width: 240px; width: 100%; }
.inventory-bubble-grid .inventory-cosmetic-preview { height: 224px; overflow: hidden; }
.inventory-bubble-grid .bubble-schema-preview { flex: 0 0 auto; }

.inventory-reward-history,
.inventory-token-history { display: grid; gap: 7px; }
.inventory-reward-history { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.inventory-reward-row,
.inventory-token-row {
  align-items: center;
  background: rgba(6, 15, 27, .6);
  border: 1px solid rgba(80, 108, 145, .19);
  border-radius: 9px;
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 10px 11px;
}
.inventory-reward-row { grid-template-columns: 35px minmax(0, 1fr) auto; }
.inventory-token-row { grid-template-columns: 27px minmax(0, 1fr) auto; }

.inventory-reward-icon,
.inventory-token-row > span:first-child {
  background: rgba(102, 78, 228, .11);
  border: 1px solid rgba(115, 94, 240, .28);
  border-radius: 8px;
  color: #9a89f9;
  display: grid;
  font-size: .62rem;
  font-weight: 900;
  height: 32px;
  place-items: center;
  width: 32px;
}
.inventory-reward-row.type-tokens .inventory-reward-icon,
.inventory-token-row.earn > span:first-child { background: rgba(255, 182, 64, .08); border-color: rgba(255, 182, 64, .25); color: #ffc15a; }
.inventory-token-row.spend > span:first-child { background: rgba(255, 91, 119, .08); border-color: rgba(255, 91, 119, .24); color: #ff6f88; }
.inventory-reward-row > div,
.inventory-token-row > div { display: grid; gap: 2px; min-width: 0; }
.inventory-reward-row small,
.inventory-token-row small { color: #687b94; font-size: .52rem; }
.inventory-reward-row strong,
.inventory-token-row strong { color: #e5edf7; font-size: .68rem; overflow-wrap: anywhere; }
.inventory-reward-row > div > span { color: #8294ab; font-size: .58rem; }
.inventory-reward-row > b { color: #67dfb0; font-size: .5rem; letter-spacing: .08em; }
.inventory-token-row > span:last-child { display: grid; gap: 1px; justify-items: end; }
.inventory-token-row > span:last-child b { color: #6ddfae; font-size: .72rem; }
.inventory-token-row.spend > span:last-child b { color: #ff778e; }

.inventory-empty {
  color: #6f8198;
  font-size: .67rem;
  grid-column: 1 / -1;
  margin: 0;
  padding: 20px 12px;
  text-align: center;
}

@media (max-width: 1180px) {
  .inventory-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .inventory-booster-grid,
  .inventory-cosmetic-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 960px) {
  .inventory-hero { grid-template-columns: 1fr; }
  .inventory-wallet-card,
  .inventory-loadout-card { min-height: 138px; }
}

@media (max-width: 720px) {
  .inventory-panel-title { align-items: flex-start !important; }
  .inventory-panel-title > button { min-height: 36px; }
  .inventory-loadout-card { grid-template-columns: 1fr; }
  .inventory-section-head { align-items: flex-start; flex-direction: column; gap: 9px; }
  .inventory-section-head > span { align-self: flex-start; }
  .inventory-booster-grid,
  .inventory-cosmetic-grid,
  .inventory-reward-history { grid-template-columns: 1fr; }
  .inventory-notification-grid .inventory-cosmetic-preview { height: 140px; }
  .inventory-bubble-grid .inventory-cosmetic-preview { height: 202px; }
}

@media (max-width: 520px) {
  body[data-route="account"] .member-inventory-panel { padding: 11px !important; }
  .inventory-wallet-card { grid-template-columns: auto minmax(0, 1fr); padding: 15px; }
  .inventory-wallet-orb { height: 42px; width: 42px; }
  .inventory-wallet-card dl { grid-template-columns: 1fr; }
  .inventory-loadout-card { padding: 15px; }
  .inventory-loadout-previews { grid-template-columns: 1fr; justify-items: center; }
  .inventory-notification-preview { width: 100%; }
  .inventory-summary-grid { grid-template-columns: 1fr; }
  .inventory-summary-grid article { grid-template-columns: minmax(0, 1fr) auto; min-height: 68px; }
  .inventory-summary-grid article > span { grid-column: 1; }
  .inventory-summary-grid article > strong { grid-column: 2; grid-row: 1 / span 2; }
  .inventory-section { padding: 13px 11px; }
  .inventory-reward-row { align-items: start; grid-template-columns: 32px minmax(0, 1fr); }
  .inventory-reward-row > b { grid-column: 2; }
  .inventory-token-row { grid-template-columns: 27px minmax(0, 1fr); }
  .inventory-token-row > span:last-child { grid-column: 2; justify-items: start; }
}

@media (prefers-reduced-motion: reduce) {
  .inventory-booster-card,
  .inventory-cosmetic-card,
  .header-user-links > .header-user-inventory-link { transition: none; }

  body[data-route="account"] .member-sidebar .member-tab-icon,
  body[data-route="account"] .member-sidebar .member-tab-icon::after,
  body[data-route="account"] .member-sidebar .member-tab-icon svg,
  body[data-route="account"] .member-sidebar .member-tab-icon * { animation: none !important; }
}

/* Linked TikTok slots: legendary primary, epic and rare secondaries. */
.tiktok-link-bonus { display: grid; grid-template-columns: 34px minmax(0,1fr); align-items: center; gap: 10px; padding: 11px 13px; border: 1px solid rgba(129,158,214,.16); border-radius: 10px; color: #91a0ba; background: rgba(7,14,27,.7); }
.tiktok-link-bonus > span { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid rgba(129,158,214,.2); border-radius: 50%; color: #71809a; background: rgba(255,255,255,.025); font-size: 16px; }
.tiktok-link-bonus > div { min-width: 0; display: grid; gap: 2px; }
.tiktok-link-bonus strong { color: #dce6f7; font-size: 11px; }
.tiktok-link-bonus small { font-size: 8px; line-height: 1.45; }
.tiktok-link-reward { display: grid; grid-template-columns: 52px minmax(0,1fr); align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid rgba(255,183,42,.35); border-radius: 10px; color: #ffd98a; background: linear-gradient(120deg, rgba(130,79,12,.24), rgba(7,14,27,.78)); box-shadow: 0 0 24px rgba(255,172,35,.08); }
.tiktok-link-reward > span { min-height: 38px; display: grid; place-items: center; border: 1px solid rgba(255,193,76,.45); border-radius: 9px; color: #fff0c5; background: rgba(255,172,35,.12); font-size: 13px; font-weight: 950; }
.tiktok-link-reward > div { min-width: 0; display: grid; gap: 3px; }
.tiktok-link-reward strong { color: #fff3d4; font-size: 11px; }
.tiktok-link-reward small { color: #cba968; font-size: 8px; line-height: 1.45; }
.tiktok-link-bonus.is-active { border-color: rgba(84,240,183,.35); color: #aaf8d7; background: linear-gradient(120deg, rgba(23,92,72,.25), rgba(7,14,27,.75)); box-shadow: 0 0 22px rgba(49,225,158,.09); }
.tiktok-link-bonus.is-active > span { border-color: rgba(84,240,183,.48); color: #58f0b4; box-shadow: 0 0 16px rgba(49,225,158,.22); animation: tiktokBonusPulse 2.2s ease-in-out infinite; }
.tiktok-linked[class*="tiktok-slot-"] { position: relative; isolation: isolate; overflow: hidden; border-width: 1px; transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
.tiktok-linked[class*="tiktok-slot-"]::before { content: ""; position: absolute; z-index: -1; inset: 0; pointer-events: none; opacity: .55; }
.tiktok-linked[class*="tiktok-slot-"]:hover { transform: translateY(-1px); }
.tiktok-slot-legendary { border-color: rgba(255,185,55,.42) !important; box-shadow: inset 3px 0 #ffb327, 0 0 22px rgba(255,157,35,.08); }
.tiktok-slot-legendary::before { background: radial-gradient(circle at 4% 50%, rgba(255,170,39,.16), transparent 34%); }
.tiktok-slot-legendary > div small { color: #ffc45d; }
.tiktok-slot-epic { border-color: rgba(170,95,255,.4) !important; box-shadow: inset 3px 0 #9c58ff, 0 0 22px rgba(137,76,255,.08); }
.tiktok-slot-epic::before { background: radial-gradient(circle at 4% 50%, rgba(144,77,255,.16), transparent 34%); }
.tiktok-slot-epic > div small { color: #c28cff; }
.tiktok-slot-rare { border-color: rgba(53,188,255,.38) !important; box-shadow: inset 3px 0 #27b8f4, 0 0 22px rgba(39,184,244,.08); }
.tiktok-slot-rare::before { background: radial-gradient(circle at 4% 50%, rgba(39,184,244,.15), transparent 34%); }
.tiktok-slot-rare > div small { color: #63d3ff; }
.tiktok-linked.is-empty { min-height: 102px; grid-template-columns: 48px minmax(150px,.72fr) minmax(260px,1.28fr); border-style: dashed !important; opacity: 1; }
.tiktok-slot-empty-copy { align-content: center; }
.tiktok-slot-linker { min-width: 0; }
.tiktok-slot-link-form { display: grid; gap: 6px; }
.tiktok-slot-link-form > label { color: #93a2ba; font-size: 7px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.tiktok-slot-link-form > div { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 7px; }
.tiktok-slot-link-form input { width: 100%; min-width: 0; height: 40px; padding: 0 11px; border: 1px solid rgba(129,158,214,.24); border-radius: 8px; outline: 0; color: #fff; background: rgba(4,10,20,.82); font-size: 10px; }
.tiktok-slot-link-form input:focus { border-color: #25f4ee; box-shadow: 0 0 0 3px rgba(37,244,238,.08); }
.tiktok-slot-generate, .tiktok-slot-check { min-height: 40px; padding: 0 13px; border: 1px solid rgba(37,244,238,.3); border-radius: 8px; color: #061018; background: linear-gradient(100deg,#25f4ee,#62dfff); box-shadow: 2px 0 #fe2c55; font-size: 9px; font-weight: 950; white-space: nowrap; }
.tiktok-slot-generate:disabled, .tiktok-slot-check:disabled { cursor: wait; opacity: .55; }
.tiktok-slot-proof { display: grid; gap: 7px; padding: 10px; border: 1px solid rgba(37,244,238,.28); border-radius: 9px; background: rgba(3,14,25,.78); }
.tiktok-slot-proof > strong { color: #dffcff; font-size: 10px; }
.tiktok-slot-proof > div:first-of-type { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 6px; }
.tiktok-slot-proof code { display: grid; place-items: center; min-height: 34px; padding: 0 9px; overflow: hidden; border: 1px dashed rgba(37,244,238,.42); border-radius: 7px; color: #fff; background: #06101d; font-size: 12px; font-weight: 950; letter-spacing: .05em; user-select: all; }
.tiktok-slot-proof > div:first-of-type button { padding: 0 9px; border: 1px solid rgba(129,158,214,.25); border-radius: 7px; color: #dce7f8; background: #101a2b; font-size: 8px; font-weight: 900; }
.tiktok-slot-proof p { margin: 0; color: #8f9db5; font-size: 8px; line-height: 1.4; }
.tiktok-slot-proof > div:last-child { display: flex; flex-wrap: wrap; gap: 6px; }
.tiktok-slot-proof > div:last-child > * { min-height: 34px; margin: 0; padding: 0 9px; display: inline-flex; align-items: center; justify-content: center; font-size: 8px; text-decoration: none; }
.tiktok-linked-actions .tiktok-linked-token-badge { border-color: rgba(255,186,52,.34); color: #ffd77d; background: rgba(255,172,35,.09); }
.tiktok-slot-empty-icon { width: 48px; height: 48px; display: grid; place-items: center; border: 1px dashed currentColor; border-radius: 50%; color: #8090aa; background: rgba(7,14,27,.72); font-size: 13px; font-weight: 900; }
.tiktok-slot-legendary .tiktok-slot-empty-icon { color: #dba64a; }
.tiktok-slot-epic .tiktok-slot-empty-icon { color: #a875ec; }
.tiktok-slot-rare .tiktok-slot-empty-icon { color: #48acd4; }
.tiktok-linked > div .tiktok-linked-shared.is-transferred { color: #a7b3c8; font-weight: 700; }
@keyframes tiktokBonusPulse { 0%,100% { transform: scale(1); opacity: .82; } 50% { transform: scale(1.08); opacity: 1; } }

@media (max-width: 680px) {
  .tiktok-linked[class*="tiktok-slot-"] { grid-template-columns: 48px minmax(0,1fr); gap: 10px; }
  .tiktok-linked[class*="tiktok-slot-"] .tiktok-linked-actions { grid-column: 1 / -1; justify-content: stretch; }
  .tiktok-linked.is-empty .tiktok-slot-linker { grid-column: 1 / -1; }
  .tiktok-slot-link-form > div { grid-template-columns: 1fr; }
  .tiktok-linked[class*="tiktok-slot-"] .tiktok-linked-actions > * { flex: 1 1 130px; }
}

@media (prefers-reduced-motion: reduce) {
  .tiktok-link-bonus.is-active > span { animation: none; }
  .tiktok-linked[class*="tiktok-slot-"] { transition: none; }
}

/* Professional messaging center. */
#messenger-quick-root,
#messenger-bubbles,
#messenger-friends-dock { display: none !important; }

.nav-message-count {
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  display: inline-grid;
  place-items: center;
  margin-left: auto;
  border: 1px solid rgba(255, 84, 110, .55);
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(135deg, #ff355f, #ef1e45);
  box-shadow: 0 0 14px rgba(255, 48, 89, .3);
  font-size: 9px;
  line-height: 1;
}

.header-message-center {
  width: min(430px, calc(100vw - 24px)) !important;
  max-height: min(680px, calc(100vh - 86px));
  overflow: hidden;
  border-color: rgba(83, 125, 181, .3) !important;
  background: linear-gradient(160deg, rgba(13, 25, 43, .99), rgba(7, 15, 28, .995)) !important;
  box-shadow: 0 28px 80px rgba(0, 0, 0, .56), 0 0 0 1px rgba(88, 205, 255, .04) inset !important;
}
.header-message-center > header { padding: 17px 18px 13px !important; }
.header-message-center > header strong { color: #f3f7ff; font-size: 15px; }
.header-message-center > header small { color: #7588a7; }
.header-message-center > footer { border-top: 1px solid rgba(103, 136, 181, .16); padding: 11px 14px; }
.header-message-center > footer a { min-height: 38px; display: flex; align-items: center; justify-content: center; gap: 8px; border-radius: 9px; color: #51d8ff; background: rgba(29, 177, 226, .08); font-size: 11px; font-weight: 800; text-decoration: none; }
.header-message-center > footer a:hover { background: rgba(29, 177, 226, .14); }
.header-messenger-search { margin: 0 13px 10px; height: 40px; display: flex; align-items: center; gap: 9px; padding: 0 12px; border: 1px solid rgba(102, 137, 185, .18); border-radius: 9px; background: rgba(4, 12, 24, .72); }
.header-messenger-search svg { width: 16px; fill: none; stroke: #70819d; stroke-width: 1.8; }
.header-messenger-search input { min-width: 0; flex: 1; border: 0; outline: 0; color: #dfe9f8; background: transparent; font: inherit; font-size: 11px; }
.header-message-center-list { max-height: 430px; padding: 0 8px 8px !important; overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgba(94, 129, 175, .3) transparent; }
.header-message-row { width: 100%; min-height: 78px; display: grid; grid-template-columns: 62px minmax(0, 1fr) auto; align-items: center; gap: 8px; padding: 9px 10px; border: 0; border-bottom: 1px solid rgba(101, 132, 174, .1); border-radius: 8px; color: inherit; background: transparent; text-align: left; cursor: pointer; }
.header-message-row:hover { background: rgba(46, 109, 151, .1); }
.header-message-row.unread { background: linear-gradient(90deg, rgba(26, 154, 209, .11), transparent); }
.header-message-row .header-messenger-avatar-shell { width: 46px; height: 46px; }
.header-message-row-copy { min-width: 0; display: grid; gap: 3px; }
.header-message-row-copy > span { min-width: 0; display: flex; align-items: center; gap: 6px; }
.header-message-row-copy strong { min-width: 0; overflow: hidden; color: #eff5ff; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.header-message-row-copy i { flex: 0 0 auto; padding: 2px 5px; border: 1px solid rgba(255, 171, 53, .27); border-radius: 5px; color: #ffb74c; background: rgba(255, 152, 32, .08); font-size: 7px; font-style: normal; font-weight: 900; text-transform: uppercase; }
.header-message-row-copy time { margin-left: auto; color: #62728d; font-size: 8px; white-space: nowrap; }
.header-message-row-copy > small { overflow: hidden; color: #8c9bb4; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.header-message-row-copy > em { display: flex; align-items: center; gap: 4px; color: #687791; font-size: 8px; font-style: normal; }
.header-message-row-copy > em::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: #5e6c82; }
.header-message-row-copy > em.online { color: #62e7b1; }
.header-message-row-copy > em.online::before { background: #3de59f; box-shadow: 0 0 8px rgba(61, 229, 159, .6); }
.header-message-row > b { min-width: 19px; height: 19px; display: grid; place-items: center; border-radius: 999px; color: #061523; background: #39d6ff; font-size: 8px; }
.header-message-request { margin: 6px 4px; border: 1px solid rgba(138, 102, 255, .2) !important; border-radius: 10px; background: rgba(111, 72, 232, .07); }

body[data-route="messages"] main { overflow: hidden; }
.messenger-page { min-width: 0; padding: 24px 22px 26px !important; }
.messenger-page-shell { width: min(1530px, 100%); min-width: 0; margin: 0 auto; display: grid; gap: 18px; }
.messenger-page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding: 0 3px; }
.messenger-page-head .eyebrow { margin: 0 0 6px; color: #24d4ff; font-size: 9px; letter-spacing: .15em; }
.messenger-page-head h1 { margin: 0; color: #f3f7ff; font-size: clamp(25px, 2.5vw, 38px); line-height: 1.02; letter-spacing: -.04em; }
.messenger-page-head p:last-child { margin: 7px 0 0; color: #7f8da5; font-size: 11px; }
.messenger-page-head-actions { display: flex; align-items: center; gap: 9px; }
.messenger-secure-pill { height: 38px; display: inline-flex; align-items: center; gap: 7px; padding: 0 12px; border: 1px solid rgba(54, 226, 164, .18); border-radius: 9px; color: #70dcb6; background: rgba(34, 174, 126, .06); font-size: 9px; font-weight: 800; }
.messenger-secure-pill i { width: 6px; height: 6px; border-radius: 50%; background: #36e3a5; box-shadow: 0 0 9px rgba(54, 227, 165, .65); }
.messenger-page .messenger-icon-button { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid rgba(104, 137, 181, .22); border-radius: 9px; color: #9ba9be; background: #0b1729; }
.messenger-page .messenger-icon-button svg { width: 17px; fill: none; stroke: currentColor; stroke-width: 1.5; }

.messenger-page-settings { display: grid !important; grid-template-columns: minmax(180px, 1fr) auto auto auto; align-items: center; gap: 15px; padding: 13px 15px !important; border: 1px solid rgba(92, 129, 177, .2) !important; border-radius: 12px; background: rgba(11, 24, 42, .94) !important; }
.messenger-page-settings[hidden] { display: none !important; }
.messenger-page-settings label { color: #a9b6ca; font-size: 10px; }
.messenger-page-settings button { min-height: 35px; padding: 0 13px; border: 1px solid rgba(40, 202, 255, .3); border-radius: 8px; color: #70deff; background: rgba(32, 175, 224, .1); font-size: 9px; font-weight: 800; }

.messenger-page-grid { min-width: 0; height: clamp(620px, calc(100vh - 185px), 880px); display: grid !important; grid-template-columns: 320px minmax(420px, 1fr) 292px !important; gap: 0 !important; overflow: hidden; border: 1px solid rgba(84, 120, 168, .22); border-radius: 16px; background: #091525; box-shadow: 0 25px 70px rgba(0, 0, 0, .27); }
.messenger-page-grid > * { min-width: 0; min-height: 0; }
.messenger-page .messenger-panel { display: flex; flex-direction: column; padding: 0; border: 0; border-radius: 0; background: linear-gradient(180deg, rgba(13, 27, 46, .98), rgba(8, 19, 33, .98)); }
.messenger-page .messenger-users-panel { border-right: 1px solid rgba(86, 121, 165, .17); }
.messenger-page .messenger-profile-panel { border-left: 1px solid rgba(86, 121, 165, .17); }
.messenger-page .messenger-panel-title { min-height: 77px; display: flex; align-items: center; justify-content: space-between; padding: 15px 17px 12px; border-bottom: 1px solid rgba(84, 119, 164, .13); }
.messenger-page .messenger-panel-title > div { display: grid; gap: 2px; }
.messenger-page .messenger-panel-title span { color: #32caef; font-size: 7px; font-weight: 900; letter-spacing: .14em; }
.messenger-page .messenger-panel-title h2 { margin: 0; color: #e8effa; font-size: 15px; }
.messenger-page .messenger-panel-title > b { min-width: 23px; height: 23px; display: grid; place-items: center; border: 1px solid rgba(65, 201, 244, .2); border-radius: 7px; color: #55d8ff; background: rgba(47, 178, 220, .08); font-size: 8px; }
.messenger-page-search { height: 40px; margin: 12px 13px 8px; display: flex; align-items: center; gap: 8px; padding: 0 11px; border: 1px solid rgba(87, 123, 168, .18); border-radius: 9px; background: rgba(4, 12, 23, .72); }
.messenger-page-search svg { width: 15px; flex: 0 0 auto; fill: none; stroke: #697b98; stroke-width: 1.8; }
.messenger-page-search input { min-width: 0; width: 100%; border: 0; outline: 0; color: #dce8f8; background: transparent; font: inherit; font-size: 10px; }
.messenger-page-filters { display: flex; gap: 5px; padding: 0 13px 10px; }
.messenger-page-filters button { height: 27px; flex: 1; padding: 0 7px; border: 1px solid rgba(86, 119, 160, .14); border-radius: 7px; color: #71819d; background: rgba(255, 255, 255, .015); font-size: 8px; font-weight: 800; }
.messenger-page-filters button.active { border-color: rgba(50, 203, 246, .28); color: #5edcff; background: rgba(35, 178, 224, .1); }
.messenger-page .messenger-requests { flex: 0 0 auto; max-height: 170px; overflow-y: auto; }
.messenger-page .messenger-list { flex: 1 1 auto; min-height: 80px; overflow-y: auto; padding: 3px 7px 8px; scrollbar-width: thin; scrollbar-color: rgba(75, 112, 156, .27) transparent; }
.messenger-page .messenger-list-item { width: 100%; min-height: 86px; display: grid; grid-template-columns: 68px minmax(0, 1fr); align-items: center; gap: 5px; padding: 8px 9px; border: 1px solid transparent; border-radius: 10px; color: inherit; background: transparent; text-align: left; }
.messenger-page .messenger-list-item:hover { background: rgba(36, 95, 134, .08); }
.messenger-page .messenger-list-item.active { border-color: rgba(52, 205, 246, .22); background: linear-gradient(90deg, rgba(34, 178, 223, .13), rgba(30, 77, 112, .05)); box-shadow: inset 2px 0 #31c8ef; }
.messenger-page .messenger-list-item .messenger-avatar-shell { width: 44px; height: 44px; grid-row: 1 / span 2; }
.messenger-page .messenger-member-line { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 6px; }
.messenger-page .messenger-member-line strong { overflow: hidden; color: #e7effa; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.messenger-page .messenger-member-line small { grid-column: 1 / -1; overflow: hidden; color: #70819b; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.messenger-page .messenger-member-line em { color: #687893; font-size: 7px; font-style: normal; }
.messenger-page .messenger-member-line em.online { color: #4ee0a6; }
.messenger-page .messenger-thread-meta { grid-column: 2; min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 3px 7px; }
.messenger-page .messenger-thread-meta small { overflow: hidden; color: #8d9bb2; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.messenger-page .messenger-thread-meta em { color: #5f6e87; font-size: 7px; font-style: normal; white-space: nowrap; }
.messenger-page .messenger-thread-meta b { min-width: 18px; height: 18px; display: grid; place-items: center; justify-self: end; border-radius: 99px; color: #061320; background: #35d2fa; font-size: 7px; }
.messenger-friends-directory { flex: 0 0 auto; border-top: 1px solid rgba(88, 120, 160, .14); }
.messenger-friends-directory summary { min-height: 39px; display: flex; align-items: center; justify-content: space-between; padding: 0 15px; color: #8292ab; cursor: pointer; font-size: 9px; font-weight: 800; list-style: none; }
.messenger-friends-directory summary span { color: #42c9ef; }
.messenger-friends-directory .messenger-members { max-height: 220px; overflow-y: auto; padding: 0 8px 8px; }
.messenger-page .messenger-member-card { min-height: 70px; display: grid; grid-template-columns: 58px minmax(0, 1fr) auto; align-items: center; gap: 5px; padding: 7px; border-radius: 8px; }
.messenger-page .messenger-request { min-height: 82px; grid-template-columns: 62px minmax(0, 1fr) auto; gap: 6px; }
.messenger-page .messenger-member-card:hover { background: rgba(38, 89, 126, .08); }
.messenger-page .messenger-member-card .messenger-avatar-shell { width: 37px; height: 37px; }
.messenger-page .messenger-member-card > button { min-height: 27px; padding: 0 8px; border: 1px solid rgba(60, 198, 239, .2); border-radius: 7px; color: #57d4f8; background: rgba(40, 170, 210, .08); font-size: 7px; font-weight: 800; }

.messenger-page .messenger-thread-panel { min-width: 0; min-height: 0; display: flex; padding: 0; background: radial-gradient(circle at 50% 0, rgba(25, 63, 99, .18), transparent 42%), #07111f; }
.messenger-page .messenger-thread-empty { flex: 1; min-height: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 30px; color: #72819a; text-align: center; }
.messenger-page .messenger-thread-empty strong { margin-top: 16px; color: #dce7f6; font-size: 18px; }
.messenger-page .messenger-thread-empty p { max-width: 340px; margin: 7px 0 0; font-size: 10px; line-height: 1.6; }
.messenger-empty-icon { width: 66px; height: 66px; display: grid; place-items: center; border: 1px solid rgba(47, 202, 243, .2); border-radius: 21px; color: #45d3fa; background: rgba(33, 171, 218, .07); box-shadow: 0 0 34px rgba(30, 180, 230, .08); }
.messenger-empty-icon svg { width: 30px; fill: none; stroke: currentColor; stroke-width: 1.4; }
.messenger-page .messenger-thread { min-width: 0; min-height: 0; flex: 1; display: flex; flex-direction: column; }
.messenger-page .messenger-thread[hidden] { display: none; }
.messenger-thread-topbar { flex: 0 0 auto; min-height: 77px; display: flex; align-items: center; border-bottom: 1px solid rgba(86, 121, 165, .14); background: rgba(9, 21, 37, .9); }
.messenger-page .messenger-thread-head { min-width: 0; min-height: 76px; flex: 1; display: flex; align-items: center; gap: 24px; padding: 10px 17px; border: 0; background: transparent; }
.messenger-page .messenger-thread-head .messenger-avatar-shell { width: 50px; height: 50px; }
.messenger-page .messenger-thread-head .messenger-member-line { flex: 1; }
.messenger-mobile-back { display: none; width: 36px; height: 36px; margin-left: 8px; border: 1px solid rgba(89, 125, 170, .2); border-radius: 9px; color: #9aabc2; background: rgba(255, 255, 255, .025); }
.messenger-mobile-back svg { width: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.messenger-page .messenger-messages { min-height: 0; flex: 1; overflow-y: auto; padding: 22px clamp(15px, 3vw, 36px); scrollbar-width: thin; scrollbar-color: rgba(78, 115, 158, .25) transparent; }
.messenger-page .messenger-message { display: flex; align-items: flex-end; gap: 15px; margin: 0 0 13px; }
.messenger-page .messenger-message.mine { justify-content: flex-end; }
.messenger-page .messenger-message-avatar { width: 31px; height: 31px; flex: 0 0 auto; }
.messenger-page .messenger-message-bubble { max-width: min(72%, 560px); display: grid; gap: 7px; padding: 10px 12px 7px; border: 1px solid rgba(93, 127, 170, .16); border-radius: 14px 14px 14px 4px; color: #cbd7e7; background: #101e32; box-shadow: 0 5px 16px rgba(0, 0, 0, .1); }
.messenger-page .messenger-message.mine .messenger-message-bubble { border-color: rgba(46, 194, 237, .2); border-radius: 14px 14px 4px 14px; color: #eff9ff; background: linear-gradient(135deg, #167ea5, #0d607f); }
.messenger-page .messenger-message-bubble > p { margin: 0; font-size: 11px; line-height: 1.5; white-space: pre-wrap; overflow-wrap: anywhere; }
.messenger-page .messenger-message-meta { display: flex; align-items: center; justify-content: flex-end; gap: 6px; color: rgba(184, 204, 226, .58); font-size: 7px; }
.messenger-page .messenger-message-meta i { font-style: normal; }
.messenger-page .messenger-typing { min-height: 26px; display: flex; align-items: center; gap: 3px; padding: 0 29px; color: #6f819d; font-size: 8px; }
.messenger-page .messenger-typing[hidden] { display: none; }
.messenger-page .messenger-typing b { margin-right: 3px; color: #7fcce4; font-weight: 700; }
.messenger-page .messenger-typing > span { width: 4px; height: 4px; border-radius: 50%; background: #48cbea; animation: messengerTypingDot 1.2s infinite ease-in-out; }
.messenger-page .messenger-typing > span:nth-of-type(2) { animation-delay: .15s; }
.messenger-page .messenger-typing > span:nth-of-type(3) { animation-delay: .3s; }
@keyframes messengerTypingDot { 0%, 60%, 100% { transform: translateY(0); opacity: .4; } 30% { transform: translateY(-3px); opacity: 1; } }
.messenger-media-preview { flex: 0 0 auto; min-height: 60px; display: grid; grid-template-columns: 48px minmax(0, 1fr) 28px; align-items: center; gap: 10px; margin: 0 16px 7px; padding: 7px; border: 1px solid rgba(65, 202, 242, .2); border-radius: 10px; background: rgba(17, 48, 69, .75); }
.messenger-media-preview[hidden] { display: none; }
.messenger-media-preview > img,
.messenger-media-preview > video { width: 48px; height: 48px; border-radius: 7px; object-fit: cover; background: #030914; }
.messenger-media-preview > span { min-width: 0; display: grid; gap: 3px; }
.messenger-media-preview strong { overflow: hidden; color: #dce8f6; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.messenger-media-preview small { color: #65c99f; font-size: 7px; }
.messenger-media-preview > button { width: 27px; height: 27px; border: 1px solid rgba(255, 101, 120, .22); border-radius: 7px; color: #ff7d91; background: rgba(210, 47, 72, .08); }
.messenger-page .messenger-form { flex: 0 0 auto; display: flex; align-items: flex-end; gap: 7px; margin: 0 15px; padding: 7px; border: 1px solid rgba(82, 119, 164, .22); border-radius: 12px; background: #0b192b; }
.messenger-page .messenger-form textarea { min-width: 0; min-height: 36px; max-height: 120px; flex: 1; resize: none; padding: 9px 4px; border: 0; outline: 0; color: #e5edf8; background: transparent; font: inherit; font-size: 11px; line-height: 1.45; }
.messenger-page .messenger-form > button { width: 36px; height: 36px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 9px; }
.messenger-page .messenger-form > button svg { width: 17px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.messenger-page .messenger-composer-tool { border: 0; color: #8393ac; background: transparent; }
.messenger-page #messenger-send { border: 1px solid rgba(66, 210, 248, .32); color: #061522; background: linear-gradient(135deg, #55dcff, #23afd7); box-shadow: 0 6px 18px rgba(34, 175, 215, .16); }
.messenger-retention-note { flex: 0 0 auto; min-height: 29px; display: flex; align-items: center; justify-content: center; gap: 5px; margin: 0; color: #56677f; font-size: 7px; }
.messenger-retention-note svg { width: 11px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.messenger-temporary-media { overflow: hidden; border-radius: 9px; background: rgba(1, 7, 14, .45); }
.messenger-temporary-media img,
.messenger-temporary-media video { display: block; width: min(320px, 100%); max-height: 300px; object-fit: contain; }
.messenger-temporary-media > small { display: block; padding: 5px 7px; color: #74d4b1; font-size: 7px; }
.messenger-media-expired { color: #8390a4 !important; font-style: italic; }

.messenger-page .messenger-profile { min-height: 0; flex: 1; overflow-y: auto; padding: 17px 15px; }
.messenger-page .messenger-profile .messenger-avatar-shell { width: 82px; height: 82px; }
.messenger-safety-card { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 9px; margin: 0 13px 14px; padding: 11px; border: 1px solid rgba(53, 213, 162, .16); border-radius: 10px; background: rgba(28, 137, 101, .05); }
.messenger-safety-card svg { width: 25px; fill: none; stroke: #53d9aa; stroke-width: 1.4; }
.messenger-safety-card div { display: grid; gap: 3px; }
.messenger-safety-card strong { color: #bcebdc; font-size: 9px; }
.messenger-safety-card small { color: #668477; font-size: 7px; line-height: 1.45; }

@media (max-width: 1220px) {
  .messenger-page-grid { grid-template-columns: 292px minmax(390px, 1fr) !important; }
  .messenger-page .messenger-profile-panel { display: none; }
}

@media (max-width: 860px) {
  body[data-route="messages"] main { overflow: visible; }
  .messenger-page { padding: 14px 12px 22px !important; }
  .messenger-page-head { align-items: center; }
  .messenger-secure-pill { display: none; }
  .messenger-page-settings { grid-template-columns: 1fr; }
  .messenger-page-grid { height: clamp(600px, calc(100dvh - 150px), 820px); grid-template-columns: 275px minmax(330px, 1fr) !important; }
}

@media (max-width: 680px) {
  .header-message-center { position: fixed !important; top: 68px !important; right: 8px !important; left: 8px !important; width: auto !important; max-height: calc(100dvh - 78px); }
  .messenger-page-head p:last-child { max-width: 260px; }
  .messenger-page-grid { height: calc(100dvh - 164px); min-height: 540px; grid-template-columns: 1fr !important; }
  .messenger-page .messenger-users-panel { display: flex; border-right: 0; }
  .messenger-page .messenger-thread-panel { display: none; }
  .messenger-page.thread-open .messenger-users-panel { display: none; }
  .messenger-page.thread-open .messenger-thread-panel { display: flex; }
  .messenger-mobile-back { display: grid; place-items: center; }
  .messenger-page .messenger-thread-head { padding-left: 8px; }
  .messenger-page .messenger-message-bubble { max-width: 82%; }
}

@media (max-width: 430px) {
  .messenger-page { padding: 10px 8px 16px !important; }
  .messenger-page-head { gap: 9px; }
  .messenger-page-head h1 { font-size: 24px; }
  .messenger-page-head p:last-child { display: none; }
  .messenger-page-grid { height: calc(100dvh - 132px); min-height: 510px; border-radius: 12px; }
  .messenger-page .messenger-messages { padding: 16px 10px; }
  .messenger-page .messenger-form { margin: 0 8px; }
  .messenger-media-preview { margin-right: 8px; margin-left: 8px; }
  .messenger-retention-note { font-size: 6px; }
}

@media (prefers-reduced-motion: reduce) {
  .messenger-page .messenger-typing > span { animation: none; }
}

/* Rediffusions LIVE — cinematic catalog, 2026-07-23 */
body[data-route="replays"] {
  --replay-accent: #ff8a20;
  --replay-cyan: #17d7f4;
  --replay-panel: #071322;
  --replay-panel-strong: #091827;
}

body[data-route="replays"] [data-view="replays"]:not([hidden]) {
  display: block !important;
  width: 100%;
}

body[data-route="replays"] .replays-hero {
  position: relative;
  display: grid;
  min-height: 168px;
  align-items: center;
  margin: 0 0 14px;
  padding: 28px 38px;
  overflow: hidden;
  border: 1px solid #172a41;
  border-radius: 0;
  background:
    radial-gradient(circle at 84% 50%, rgba(14, 210, 255, 0.16), transparent 19%),
    radial-gradient(circle at 91% 48%, rgba(255, 92, 26, 0.13), transparent 21%),
    linear-gradient(105deg, #030b17 0%, #061326 58%, #07111e 100%);
  box-shadow: inset 0 -1px rgba(255, 255, 255, 0.025);
}

body[data-route="replays"] .replays-hero::before {
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle, rgba(255, 116, 35, 0.65) 0 1px, transparent 1.6px),
    radial-gradient(circle, rgba(32, 219, 255, 0.46) 0 1px, transparent 1.5px);
  background-position: 72% 38%, 64% 70%;
  background-size: 73px 67px, 93px 89px;
  content: "";
  opacity: 0.4;
  mask-image: linear-gradient(90deg, transparent 42%, #000);
}

body[data-route="replays"] .replays-hero-copy {
  position: relative;
  z-index: 2;
  width: min(610px, 62%);
}

body[data-route="replays"] .replays-hero .eyebrow {
  margin: 0 0 8px;
  color: var(--replay-cyan);
  font-size: 11px;
  letter-spacing: 0.12em;
}

body[data-route="replays"] .replays-hero h1 {
  margin: 0;
  color: #f7f9ff;
  font-size: clamp(34px, 4.2vw, 48px);
  font-weight: 950;
  letter-spacing: -0.045em;
  line-height: 0.98;
}

body[data-route="replays"] .replays-hero p:not(.eyebrow) {
  max-width: 520px;
  margin: 11px 0 0;
  color: #a5b1c5;
  font-size: 14px;
  line-height: 1.52;
}

body[data-route="replays"] .replays-hero-art {
  position: absolute;
  z-index: 1;
  top: 50%;
  right: 3.5%;
  width: min(420px, 36vw);
  height: 150px;
  transform: translateY(-50%);
}

body[data-route="replays"] .replays-hero-wave,
body[data-route="replays"] .replays-hero-wave::before,
body[data-route="replays"] .replays-hero-wave::after {
  position: absolute;
  top: 50%;
  right: 72px;
  left: -120px;
  height: 1px;
  border-radius: 50%;
  background: linear-gradient(90deg, transparent, rgba(16, 209, 255, 0.85) 55%, rgba(255, 109, 29, 0.8));
  box-shadow: 0 0 15px rgba(22, 209, 255, 0.4);
  content: "";
  transform: rotate(-7deg);
}

body[data-route="replays"] .replays-hero-wave::before { right: 0; left: 0; transform: translateY(-18px) rotate(5deg); opacity: 0.55; }
body[data-route="replays"] .replays-hero-wave::after { right: 0; left: 0; transform: translateY(18px) rotate(-4deg); opacity: 0.4; }

body[data-route="replays"] .replays-hero-orbit {
  position: absolute;
  top: 50%;
  right: 13px;
  display: grid;
  width: 112px;
  height: 112px;
  place-items: center;
  border: 2px solid rgba(25, 218, 255, 0.82);
  border-radius: 50%;
  background:
    radial-gradient(circle, rgba(255, 111, 28, 0.2) 0 31%, transparent 32%),
    rgba(4, 17, 31, 0.72);
  box-shadow:
    0 0 0 13px rgba(10, 194, 255, 0.06),
    0 0 0 25px rgba(255, 106, 29, 0.035),
    0 0 38px rgba(19, 210, 255, 0.42),
    inset 0 0 24px rgba(21, 213, 255, 0.16);
  transform: translateY(-50%);
  animation: replay-orbit-breathe 3.2s ease-in-out infinite;
}

body[data-route="replays"] .replays-hero-orbit::before,
body[data-route="replays"] .replays-hero-orbit::after {
  position: absolute;
  inset: -15px;
  border: 1px dashed rgba(255, 108, 29, 0.4);
  border-radius: 50%;
  content: "";
  animation: replay-orbit-spin 18s linear infinite;
}

body[data-route="replays"] .replays-hero-orbit::after {
  inset: 12px;
  border-color: rgba(24, 219, 255, 0.42);
  animation-direction: reverse;
  animation-duration: 11s;
}

body[data-route="replays"] .replays-hero-orbit b {
  color: #ff8a29;
  font-size: 38px;
  font-weight: 900;
  filter: drop-shadow(0 0 10px rgba(255, 91, 22, 0.9));
  transform: translateX(3px);
}

body[data-route="replays"] .replays-overview {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0 0 14px;
  overflow: hidden;
  border: 1px solid #1b3048;
  border-radius: 14px;
  background: linear-gradient(115deg, rgba(8, 21, 36, 0.98), rgba(5, 14, 26, 0.98));
  box-shadow: 0 16px 38px rgba(0, 0, 0, 0.15), inset 0 1px rgba(255, 255, 255, 0.025);
}

body[data-route="replays"] .replays-overview article {
  display: grid;
  min-width: 0;
  min-height: 98px;
  align-items: center;
  gap: 14px;
  grid-template-columns: 52px minmax(0, 1fr);
  padding: 18px 24px;
  border-right: 1px solid #1a2b40;
}

body[data-route="replays"] .replays-overview article:last-child { border-right: 0; }
body[data-route="replays"] .replays-overview article > div { display: grid; min-width: 0; gap: 2px; }
body[data-route="replays"] .replays-overview small { color: #8492a9; font-size: 9px; font-weight: 850; letter-spacing: 0.11em; }
body[data-route="replays"] .replays-overview strong { overflow: hidden; color: #f5f8ff; font-size: 18px; text-overflow: ellipsis; white-space: nowrap; }
body[data-route="replays"] .replays-overview p { margin: 0; overflow: hidden; color: #7f8da4; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }

body[data-route="replays"] .replays-overview-icon {
  display: grid;
  width: 52px;
  height: 52px;
  place-items: center;
  border: 1px solid #314962;
  border-radius: 16px;
  color: #dce7f4;
  background: #102036;
  font-size: 27px;
  font-style: normal;
}

body[data-route="replays"] .replays-overview-icon.is-retention { border-color: #7b5cff; color: #b9a7ff; box-shadow: 0 0 18px rgba(116, 78, 255, 0.28); }
body[data-route="replays"] .replays-overview-icon.is-catalog { border-color: #12bddd; color: #42e2ff; box-shadow: 0 0 18px rgba(17, 193, 228, 0.2); }
body[data-route="replays"] .replays-overview-icon.is-buyers { border-color: #ff4467; color: #ff607c; }

body[data-route="replays"] .replays-recent-purchases {
  display: flex;
  min-height: 28px;
  align-items: center;
  padding-left: 3px;
}

body[data-route="replays"] .replays-recent-purchases img,
body[data-route="replays"] .replays-recent-purchases b {
  display: grid;
  width: 27px;
  height: 27px;
  place-items: center;
  margin-left: -5px;
  border: 2px solid #0a1726;
  border-radius: 50%;
  object-fit: cover;
}

body[data-route="replays"] .replays-recent-purchases b {
  width: auto;
  min-width: 31px;
  padding: 0 5px;
  color: #b5c2d6;
  background: #16263a;
  font-size: 9px;
}

body[data-route="replays"] .replays-promotion {
  min-height: 36px;
  margin: 0 0 14px !important;
  padding: 7px 13px !important;
  border-color: rgba(255, 135, 31, 0.34) !important;
  border-radius: 9px !important;
  background: linear-gradient(90deg, rgba(255, 129, 24, 0.12), rgba(12, 27, 44, 0.96)) !important;
  box-shadow: none !important;
}

body[data-route="replays"] .replays-catalog {
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

body[data-route="replays"] .replays-catalog-head {
  padding: 2px 2px 11px !important;
  border: 0 !important;
}

body[data-route="replays"] .replays-catalog-head h2 { font-size: 17px !important; }

body[data-route="replays"] .replays-filters {
  display: grid;
  grid-template-columns: minmax(230px, 1.7fr) repeat(6, minmax(105px, 0.75fr)) auto;
  align-items: end;
  gap: 10px;
  margin: 0 0 12px;
  padding: 11px 12px;
  border: 1px solid #14273c;
  border-radius: 12px;
  background: rgba(6, 17, 30, 0.92);
}

body[data-route="replays"] .replays-filters label {
  display: grid;
  min-width: 0;
  gap: 3px;
}

body[data-route="replays"] .replays-filters label > span:not(.sr-only) {
  padding-left: 3px;
  color: #77859b;
  font-size: 8px;
  font-weight: 850;
  letter-spacing: 0.04em;
}

body[data-route="replays"] .replays-filters input,
body[data-route="replays"] .replays-filters select,
body[data-route="replays"] .replays-filter-reset {
  width: 100%;
  height: 38px;
  min-width: 0;
  border: 1px solid #21374f;
  border-radius: 8px;
  outline: 0;
  color: #d9e1ef;
  background: #071321;
  font-size: 10px;
}

body[data-route="replays"] .replays-filters input:focus,
body[data-route="replays"] .replays-filters select:focus { border-color: #1baecc; box-shadow: 0 0 0 2px rgba(20, 206, 239, 0.09); }

body[data-route="replays"] .replays-search { position: relative; align-self: end; }
body[data-route="replays"] .replays-search input { padding: 0 12px 0 35px; }
body[data-route="replays"] .replays-search i {
  position: absolute;
  z-index: 2;
  bottom: 12px;
  left: 13px;
  width: 11px;
  height: 11px;
  border: 1.5px solid #8492a8;
  border-radius: 50%;
}
body[data-route="replays"] .replays-search i::after {
  position: absolute;
  right: -4px;
  bottom: -3px;
  width: 5px;
  height: 1.5px;
  background: #8492a8;
  content: "";
  transform: rotate(45deg);
}

body[data-route="replays"] .replays-filter-reset {
  display: flex;
  width: auto;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 13px;
  color: #f6a238;
  cursor: pointer;
  font-weight: 800;
}
body[data-route="replays"] .replays-filter-reset:hover { border-color: #c9761e; background: rgba(255, 136, 31, 0.08); }

body[data-route="replays"] .replays-list {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  align-items: start !important;
  gap: 10px !important;
  padding: 0 !important;
}

body[data-route="replays"] .replay-card {
  position: relative;
  display: grid;
  min-width: 0 !important;
  overflow: hidden !important;
  border: 1px solid #20354c !important;
  border-radius: 10px !important;
  background: linear-gradient(155deg, #081525, #06101d) !important;
  box-shadow: 0 11px 28px rgba(0, 0, 0, 0.2) !important;
  transform: translateY(0);
  animation: replay-card-enter 450ms both cubic-bezier(0.2, 0.72, 0.2, 1);
  animation-delay: calc(var(--replay-order, 0) * 34ms);
  transition: border-color 200ms ease, box-shadow 200ms ease, transform 200ms ease !important;
}

body[data-route="replays"] .replay-card::before {
  z-index: 12;
  right: 12%;
  left: 12%;
  background: linear-gradient(90deg, transparent, rgba(21, 213, 247, 0.5), rgba(255, 125, 25, 0.75), transparent);
  opacity: 0;
  transition: opacity 200ms ease;
}

body[data-route="replays"] .replay-card:hover {
  border-color: rgba(255, 132, 34, 0.62) !important;
  box-shadow: 0 15px 34px rgba(0, 0, 0, 0.28), 0 0 20px rgba(255, 116, 24, 0.09) !important;
  transform: translateY(-4px) !important;
}

body[data-route="replays"] .replay-card:hover::before { opacity: 1; }

body[data-route="replays"] .replay-body {
  display: block !important;
  padding: 0 !important;
  background: #06101b !important;
}

body[data-route="replays"] .replay-media {
  position: relative;
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #030812 !important;
  box-shadow: none !important;
}

body[data-route="replays"] .replay-media::before {
  position: absolute;
  z-index: 3;
  inset: 0;
  background: linear-gradient(180deg, rgba(3, 8, 18, 0.12) 30%, rgba(3, 8, 18, 0.9) 100%);
  content: "";
  pointer-events: none;
}

body[data-route="replays"] .replay-media video,
body[data-route="replays"] .replay-media-backdrop,
body[data-route="replays"] .replay-hover-preview {
  transition: filter 260ms ease, opacity 220ms ease, transform 480ms cubic-bezier(0.2, 0.7, 0.2, 1) !important;
}
body[data-route="replays"] .replay-media:not(.is-playing) video { object-fit: cover !important; }
body[data-route="replays"] .replay-media.is-playing video { object-fit: contain !important; }

body[data-route="replays"] .replay-card:hover .replay-media:not(.is-playing) video,
body[data-route="replays"] .replay-card:hover .replay-media:not(.is-playing) .replay-media-backdrop,
body[data-route="replays"] .replay-card:hover .replay-media:not(.is-playing) .replay-hover-preview { transform: scale(1.045); }

body[data-route="replays"] .replay-profile {
  position: absolute !important;
  z-index: 6;
  right: 9px;
  bottom: 8px;
  left: 9px;
  display: grid !important;
  min-height: 0 !important;
  align-items: center;
  gap: 8px !important;
  grid-template-columns: 36px minmax(0, 1fr) !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

body[data-route="replays"] .replay-profile-avatar-shell {
  width: 36px !important;
  height: 36px !important;
  filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.45));
}

body[data-route="replays"] .replay-profile-avatar {
  border: 1.5px solid #ff6729 !important;
  border-radius: 50% !important;
}

body[data-route="replays"] .replay-profile-identity {
  display: grid;
  min-width: 0;
  gap: 0 !important;
}

body[data-route="replays"] .replay-profile-identity > div { min-width: 0; }
body[data-route="replays"] .replay-profile-identity strong {
  overflow: hidden;
  color: #fff !important;
  font-size: 11px !important;
  text-overflow: ellipsis;
  text-shadow: 0 1px 4px #000;
  white-space: nowrap;
}
body[data-route="replays"] .replay-profile-identity a { display: none !important; }
body[data-route="replays"] .replay-profile-identity p {
  overflow: hidden;
  margin: 1px 0 0 !important;
  color: #aeb9ca !important;
  font-size: 9px !important;
  line-height: 1.25 !important;
  text-overflow: ellipsis;
  text-shadow: 0 1px 4px #000;
  white-space: nowrap;
}

body[data-route="replays"] .replay-duration {
  z-index: 10 !important;
  top: 7px !important;
  right: 7px !important;
  padding: 4px 6px !important;
  border-radius: 999px !important;
  font-size: 9px !important;
  line-height: 1 !important;
}

body[data-route="replays"] .replay-purchase-window {
  position: absolute;
  z-index: 10;
  top: 7px;
  left: 7px;
  display: block !important;
  max-width: calc(100% - 82px);
  min-height: 0 !important;
  padding: 4px 7px !important;
  overflow: hidden;
  border: 1px solid rgba(21, 211, 244, 0.42) !important;
  border-radius: 999px !important;
  color: #e9fcff;
  background: rgba(4, 13, 25, 0.82) !important;
  box-shadow: 0 0 12px rgba(12, 208, 241, 0.13) !important;
  backdrop-filter: blur(8px);
}

body[data-route="replays"] .replay-purchase-window small { display: none !important; }
body[data-route="replays"] .replay-purchase-window strong {
  display: block;
  overflow: hidden;
  color: #d9faff !important;
  font-size: 8px !important;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0 !important;
  line-height: 1 !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body[data-route="replays"] .replay-purchase-window.is-closed {
  border-color: rgba(255, 163, 61, 0.45) !important;
  opacity: 0.88;
}
body[data-route="replays"] .replay-purchase-window.is-closed strong { color: #ffc276 !important; }

body[data-route="replays"] .replay-discount-badge {
  z-index: 9 !important;
  top: 31px !important;
  left: 7px !important;
  padding: 3px 6px !important;
  border-radius: 5px !important;
  font-size: 8px !important;
}

body[data-route="replays"] .replay-play {
  z-index: 5 !important;
  top: 50% !important;
  right: auto !important;
  bottom: auto !important;
  left: 50% !important;
  width: 43px !important;
  height: 43px !important;
  transform: translate(-50%, -50%) !important;
  background: transparent !important;
}

body[data-route="replays"] .replay-play > i {
  display: grid !important;
  width: 43px !important;
  height: 43px !important;
  place-items: center !important;
  border: 1px solid rgba(255, 127, 35, 0.88) !important;
  border-radius: 50% !important;
  color: #fff !important;
  background: rgba(5, 12, 23, 0.72) !important;
  box-shadow: 0 0 16px rgba(255, 104, 25, 0.35), inset 0 0 9px rgba(255, 255, 255, 0.05) !important;
  transition: background 180ms ease, box-shadow 180ms ease, transform 180ms ease !important;
}

body[data-route="replays"] .replay-play:hover > i {
  background: #f4771d !important;
  box-shadow: 0 0 22px rgba(255, 109, 23, 0.56) !important;
  transform: scale(1.08) !important;
}

body[data-route="replays"] .replay-media.is-playing::before,
body[data-route="replays"] .replay-media.is-playing .replay-profile,
body[data-route="replays"] .replay-media.is-playing .replay-purchase-window,
body[data-route="replays"] .replay-media.is-playing .replay-discount-badge { display: none !important; }

body[data-route="replays"] .replay-preview-badge {
  right: 7px !important;
  bottom: 7px !important;
  left: auto !important;
  font-size: 7px !important;
}

body[data-route="replays"] .replay-details {
  display: none !important;
  padding: 0 10px 8px !important;
}
body[data-route="replays"] .replay-card.is-expanded .replay-details { display: grid !important; animation: replay-details-open 220ms ease both; }
body[data-route="replays"] .replay-card.is-expanded .replay-source-meta,
body[data-route="replays"] .replay-card.is-expanded .replay-pricing {
  padding: 7px 9px !important;
  border-color: #1b3045 !important;
  background: #081421 !important;
}

body[data-route="replays"] .replay-footer {
  display: grid !important;
  gap: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: #071321 !important;
}

body[data-route="replays"] .replay-commerce {
  display: flex;
  min-height: 35px;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 10px;
  border-top: 1px solid #172a3e;
  border-bottom: 1px solid #172a3e;
}

body[data-route="replays"] .replay-commerce-audience { display: flex; min-width: 0; align-items: center; gap: 9px; }
body[data-route="replays"] .replay-audience-stat {
  display: inline-flex !important;
  min-height: 0 !important;
  align-items: center !important;
  gap: 3px !important;
  padding: 0 !important;
  border: 0 !important;
  color: #8998af !important;
  background: transparent !important;
  font-size: 9px !important;
}
body[data-route="replays"] .replay-audience-stat i,
body[data-route="replays"] .replay-audience-stat i svg { width: 11px !important; height: 11px !important; }
body[data-route="replays"] .replay-audience-stat strong { color: #aeb9c8 !important; font-size: 9px !important; }
body[data-route="replays"] .replay-audience-stat small { font-size: 8px !important; }

body[data-route="replays"] .replay-commerce-price {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 5px;
  color: #ff951e;
}
body[data-route="replays"] .replay-commerce-price i {
  display: grid;
  width: 15px;
  height: 15px;
  place-items: center;
  border-radius: 50%;
  background: #ff8a14;
  color: #321300;
  font-size: 8px;
  font-style: normal;
  font-weight: 950;
}
body[data-route="replays"] .replay-commerce-price strong { font-size: 12px; }

body[data-route="replays"] .replay-card-actions {
  display: grid;
  grid-template-columns: minmax(0, 0.82fr) minmax(0, 1fr) minmax(0, 1.22fr);
  gap: 6px;
  padding: 7px;
}

body[data-route="replays"] .replay-card-action,
body[data-route="replays"] .replay-access-button {
  display: flex !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 31px !important;
  height: 31px !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  margin: 0 !important;
  padding: 0 7px !important;
  overflow: hidden;
  border: 1px solid #293e55 !important;
  border-radius: 5px !important;
  color: #dce4f1 !important;
  background: #081525 !important;
  box-shadow: none !important;
  cursor: pointer;
  font-size: 9px !important;
  font-weight: 800 !important;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: border-color 160ms ease, background 160ms ease, color 160ms ease, transform 160ms ease !important;
}

body[data-route="replays"] .replay-card-action:hover { border-color: #53708e !important; background: #0c1c2e !important; transform: translateY(-1px); }
body[data-route="replays"] .replay-card-action.is-preview i { color: #ff9b26; font-style: normal; }
body[data-route="replays"] .replay-card-action:disabled { cursor: not-allowed; opacity: 0.42; }
body[data-route="replays"] .replay-card-action.is-detail[aria-expanded="true"] { color: #45e6ff !important; border-color: rgba(31, 206, 236, 0.45) !important; }
body[data-route="replays"] .replay-card-action.is-detail i { font-size: 13px; font-style: normal; transition: transform 160ms ease; }
body[data-route="replays"] .replay-card-action.is-detail[aria-expanded="true"] i { transform: rotate(180deg); }

body[data-route="replays"] .replay-access-button {
  border-color: #ff841b !important;
  color: #fff !important;
  background: linear-gradient(110deg, #ff9720, #f05a16) !important;
  box-shadow: 0 5px 13px rgba(255, 101, 20, 0.2) !important;
}
body[data-route="replays"] .replay-access-button:hover { filter: brightness(1.08); transform: translateY(-1px) !important; }
body[data-route="replays"] .replay-access-button .replay-token-mark { display: none !important; }
body[data-route="replays"] .replay-access-button strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body[data-route="replays"] .replay-card.is-unlocked .replay-access-button { border-color: #17b9c8 !important; background: linear-gradient(110deg, #0da8a6, #09768f) !important; }
body[data-route="replays"] .replay-card.purchase-closed:not(.is-unlocked) .replay-access-button { border-color: #26394d !important; color: #79889c !important; background: #111c29 !important; }

body[data-route="replays"] .replay-date,
body[data-route="replays"] .replay-availability { display: none !important; }
body[data-route="replays"] .replay-card.is-expanded .replay-date {
  display: grid !important;
  padding: 8px 12px !important;
  border-top: 1px solid #172a3e;
}
body[data-route="replays"] .replay-card.is-expanded .replay-availability {
  display: grid !important;
  min-height: 0 !important;
  margin: 0 9px 9px !important;
  padding: 8px !important;
}

body[data-route="replays"] .replays-pagination {
  display: flex;
  min-height: 54px;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 11px 0 0;
}

body[data-route="replays"] .replays-pagination nav { display: flex; align-items: center; gap: 5px; }
body[data-route="replays"] .replays-pagination nav button {
  min-width: 34px;
  height: 34px;
  padding: 0 10px;
  border: 1px solid #1f344b;
  border-radius: 6px;
  color: #a7b3c6;
  background: #071321;
  cursor: pointer;
  font-size: 10px;
}
body[data-route="replays"] .replays-pagination nav button:hover:not(:disabled) { border-color: #b9611b; color: #fff; }
body[data-route="replays"] .replays-pagination nav button.is-current { border-color: #e46d15; color: #fff; background: rgba(239, 104, 15, 0.14); box-shadow: inset 0 0 13px rgba(255, 105, 19, 0.08); }
body[data-route="replays"] .replays-pagination nav button:disabled { cursor: not-allowed; opacity: 0.38; }
body[data-route="replays"] .replays-pagination nav span { color: #637188; font-size: 12px; }
body[data-route="replays"] .replays-pagination > label { display: flex; align-items: center; gap: 8px; color: #7f8da2; font-size: 9px; }
body[data-route="replays"] .replays-pagination select {
  height: 34px;
  border: 1px solid #1f344b;
  border-radius: 6px;
  color: #c7d0de;
  background: #071321;
  font-size: 9px;
}

body[data-route="replays"] .replays-empty { grid-column: 1 / -1; min-height: 190px; }

@keyframes replay-orbit-breathe {
  0%, 100% { filter: brightness(0.9); transform: translateY(-50%) scale(0.97); }
  50% { filter: brightness(1.15); transform: translateY(-50%) scale(1.03); }
}
@keyframes replay-orbit-spin { to { transform: rotate(360deg); } }
@keyframes replay-card-enter {
  from { opacity: 0; transform: translateY(14px) scale(0.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes replay-details-open {
  from { opacity: 0; transform: translateY(-5px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 1500px) {
  body[data-route="replays"] .replays-filters { grid-template-columns: minmax(220px, 1.6fr) repeat(3, minmax(120px, 1fr)); }
  body[data-route="replays"] .replays-filter-reset { width: 100%; }
  body[data-route="replays"] .replays-list { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  body[data-route="replays"] .replays-overview article { padding: 16px; }
}

@media (max-width: 1180px) {
  body[data-route="replays"] .replays-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body[data-route="replays"] .replays-overview article:nth-child(2) { border-right: 0; }
  body[data-route="replays"] .replays-overview article:nth-child(-n + 2) { border-bottom: 1px solid #1a2b40; }
  body[data-route="replays"] .replays-list { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

@media (max-width: 760px) {
  body[data-route="replays"] .replays-hero { min-height: 150px; padding: 22px 18px; }
  body[data-route="replays"] .replays-hero-copy { width: 72%; }
  body[data-route="replays"] .replays-hero h1 { font-size: clamp(29px, 9vw, 38px); }
  body[data-route="replays"] .replays-hero p:not(.eyebrow) { font-size: 11px; }
  body[data-route="replays"] .replays-hero-art { right: -55px; opacity: 0.72; }
  body[data-route="replays"] .replays-hero-orbit { width: 90px; height: 90px; }
  body[data-route="replays"] .replays-overview article { min-height: 82px; grid-template-columns: 42px minmax(0, 1fr); padding: 12px; }
  body[data-route="replays"] .replays-overview-icon { width: 42px; height: 42px; border-radius: 12px; font-size: 22px; }
  body[data-route="replays"] .replays-overview strong { font-size: 15px; }
  body[data-route="replays"] .replays-overview p { font-size: 9px; }
  body[data-route="replays"] .replays-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body[data-route="replays"] .replays-search { grid-column: 1 / -1; }
  body[data-route="replays"] .replays-list { grid-template-columns: 1fr !important; }
  body[data-route="replays"] .replays-pagination { align-items: stretch; flex-direction: column; }
  body[data-route="replays"] .replays-pagination nav { max-width: 100%; overflow-x: auto; padding-bottom: 4px; }
  body[data-route="replays"] .replays-pagination > label { justify-content: flex-end; }
}

@media (max-width: 470px) {
  body[data-route="replays"] .replays-hero-copy { width: 86%; }
  body[data-route="replays"] .replays-hero-art { right: -88px; opacity: 0.45; }
  body[data-route="replays"] .replays-overview { grid-template-columns: 1fr; }
  body[data-route="replays"] .replays-overview article,
  body[data-route="replays"] .replays-overview article:nth-child(2) { border-right: 0; border-bottom: 1px solid #1a2b40; }
  body[data-route="replays"] .replays-overview article:last-child { border-bottom: 0; }
  body[data-route="replays"] .replays-filters { grid-template-columns: 1fr; }
  body[data-route="replays"] .replays-search { grid-column: auto; }
  body[data-route="replays"] .replay-card-actions { grid-template-columns: 0.8fr 1fr 1.25fr; }
}

@media (prefers-reduced-motion: reduce) {
  body[data-route="replays"] .replays-hero-orbit,
  body[data-route="replays"] .replays-hero-orbit::before,
  body[data-route="replays"] .replays-hero-orbit::after,
  body[data-route="replays"] .replay-card { animation: none !important; }
  body[data-route="replays"] .replay-card,
  body[data-route="replays"] .replay-media video,
  body[data-route="replays"] .replay-hover-preview { transition-duration: 0.01ms !important; }
}

.public-update-shortcut { display: none; }

/* Jeton premium PHNX590 : icône unique sur les soldes, prix et récompenses. */
.premium-token-icon {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  border: 0;
  object-fit: contain;
  pointer-events: none;
  user-select: none;
  filter: drop-shadow(0 3px 8px rgba(255, 139, 20, .3));
}

.premium-token-icon-inline {
  width: 1.25em;
  height: 1.25em;
  min-width: 1.25em;
  flex: 0 0 1.25em;
}

.premium-token-amount {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: .34em;
}

.header-token-wallet-mark,
.public-sidebar-token-mark,
.shop-token-mark,
.inventory-wallet-orb {
  overflow: visible;
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
  box-shadow: none !important;
}

.header-token-wallet-mark .premium-token-icon {
  width: 34px;
  height: 34px;
}

.public-sidebar-token-mark .premium-token-icon {
  width: 36px;
  height: 36px;
}

.shop-token-mark .premium-token-icon {
  width: 58px;
  height: 58px;
}

.shop-page-heading .shop-symbol {
  overflow: visible;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.shop-page-heading .shop-symbol .premium-token-icon {
  width: 66px;
  height: 66px;
}

.member-tab-icon.icon-tokens {
  overflow: visible;
  border: 0 !important;
  background: transparent !important;
}

.member-tab-icon.icon-tokens .premium-token-icon {
  width: 29px;
  height: 29px;
}

.inventory-wallet-orb .premium-token-icon {
  width: 58px;
  height: 58px;
}

.inventory-reward-icon .premium-token-icon {
  width: 35px;
  height: 35px;
}

.premium-token-ledger-icon {
  position: relative;
  overflow: visible;
  border: 0 !important;
  background: transparent !important;
}

.premium-token-ledger-icon .premium-token-icon {
  width: 32px;
  height: 32px;
}

.premium-token-ledger-icon > b {
  position: absolute;
  right: -3px;
  bottom: -2px;
  width: 14px;
  height: 14px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 220, 134, .65);
  border-radius: 50%;
  color: #271200;
  background: #ffc24f;
  box-shadow: 0 2px 7px rgba(0, 0, 0, .35);
  font-size: 10px;
  line-height: 1;
}

.inventory-token-row.spend .premium-token-ledger-icon > b {
  border-color: rgba(255, 149, 167, .7);
  color: #fff;
  background: #e44f69;
}

.live-pass-reward-icon .premium-token-icon {
  width: 76px;
  height: 76px;
}

.live-pass-reward-cost.premium-token-amount {
  justify-content: flex-start;
}

.live-pass-reward-action.premium-token-amount,
.live-pass-purchase .premium-token-amount {
  flex-wrap: nowrap;
}

.shop-rules span.premium-token-amount {
  width: auto;
  min-width: 48px;
  padding: 3px 5px;
  color: #ffd875;
  background: rgba(255, 174, 45, .08);
}

.shop-rules span.premium-token-amount .premium-token-icon {
  width: 23px;
  height: 23px;
  flex-basis: 23px;
}

.shop-history .premium-token-amount,
.notification-token-gain.premium-token-amount,
.header-token-gain.premium-token-amount {
  justify-content: flex-start;
}

.header-notification-item.token-combo .header-notification-icon,
.notification-toast.token-combo > span:first-child {
  overflow: visible;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.premium-token-icon-notification {
  width: 40px;
  height: 40px;
}

.header-token-gain .premium-token-icon-inline,
.notification-token-gain .premium-token-icon-inline {
  width: 15px;
  height: 15px;
  min-width: 15px;
  flex-basis: 15px;
}

body[data-route="replays"] .replay-commerce-price i:has(.premium-token-icon) {
  width: 20px;
  height: 20px;
  overflow: visible;
  background: transparent;
}

body[data-route="replays"] .replay-commerce-price i .premium-token-icon {
  width: 22px;
  height: 22px;
}

.replay-token-mark:has(.premium-token-icon) {
  overflow: visible;
  border: 0;
}

.replay-purchase-box .premium-token-amount {
  justify-content: flex-start;
}

body.admin-panel-route .admin-premium-token-icon {
  width: 20px !important;
  height: 20px !important;
  align-self: center;
  justify-self: center;
}

body.admin-panel-route .admin-token-stats strong.premium-token-amount,
body.admin-panel-route .admin-wallet-card strong.premium-token-amount,
body.admin-panel-route .admin-wallet-transaction > strong.premium-token-amount,
body.admin-panel-route .admin-replay-item-pricing strong.premium-token-amount {
  justify-content: flex-start;
}

body.admin-panel-route .admin-token-stats strong .premium-token-icon-inline {
  width: 30px;
  height: 30px;
  min-width: 30px;
  flex-basis: 30px;
}

body.admin-panel-route .admin-wallet-card strong .premium-token-icon-inline,
body.admin-panel-route .admin-wallet-transaction > strong .premium-token-icon-inline,
body.admin-panel-route .admin-replay-item-pricing strong .premium-token-icon-inline {
  width: 20px;
  height: 20px;
  min-width: 20px;
  flex-basis: 20px;
}

@keyframes premium-token-float {
  0%, 100% { transform: translateY(0) scale(1); filter: drop-shadow(0 3px 8px rgba(255, 139, 20, .3)); }
  50% { transform: translateY(-1px) scale(1.035); filter: drop-shadow(0 5px 13px rgba(255, 168, 36, .46)); }
}

.header-token-wallet-mark .premium-token-icon,
.public-sidebar-token-mark .premium-token-icon,
.shop-token-mark .premium-token-icon,
.inventory-wallet-orb .premium-token-icon,
.shop-page-heading .shop-symbol .premium-token-icon {
  animation: premium-token-float 3.6s ease-in-out infinite;
}

@media (max-width: 720px) {
  .header-token-wallet-mark .premium-token-icon { width: 30px; height: 30px; }
  .public-sidebar-token-mark .premium-token-icon { width: 32px; height: 32px; }
  .shop-token-mark .premium-token-icon,
  .inventory-wallet-orb .premium-token-icon { width: 48px; height: 48px; }
  .shop-page-heading .shop-symbol .premium-token-icon { width: 56px; height: 56px; }
  .live-pass-reward-icon .premium-token-icon { width: 54px; height: 54px; }
  .premium-token-icon-inline { width: 1.1em; height: 1.1em; min-width: 1.1em; flex-basis: 1.1em; }
}

@media (prefers-reduced-motion: reduce) {
  .premium-token-icon { animation: none !important; }
}


/* Live Pass season duration, rarity and TikTok previews - 2026-07-24 */
.live-pass-season-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-bottom: 18px;
}
.live-pass-season-row .live-pass-season { margin-bottom: 0; }
.live-pass-countdown {
  align-items: center;
  background: rgba(7, 20, 35, .76);
  border: 1px solid rgba(91, 219, 245, .24);
  border-radius: 999px;
  color: #b8c8db;
  display: inline-flex;
  font-size: .64rem;
  font-weight: 850;
  gap: 7px;
  letter-spacing: .035em;
  min-height: 31px;
  padding: 7px 11px;
}
.live-pass-countdown i {
  background: #4be0f7;
  border-radius: 50%;
  box-shadow: 0 0 0 4px rgba(75, 224, 247, .1), 0 0 12px rgba(75, 224, 247, .55);
  height: 6px;
  width: 6px;
}
.live-pass-countdown[data-state="ending"] { border-color: rgba(255, 176, 53, .42); color: #ffd080; }
.live-pass-countdown[data-state="ending"] i { background: #ffad33; box-shadow: 0 0 0 4px rgba(255, 173, 51, .12), 0 0 13px rgba(255, 173, 51, .65); }
.live-pass-countdown[data-state="closed"] { border-color: rgba(255, 96, 126, .3); color: #ff8097; }
.live-pass-countdown[data-state="closed"] i { background: #ff5d79; box-shadow: 0 0 0 4px rgba(255, 93, 121, .12); }
.live-pass-countdown[data-state="pending"] { border-color: rgba(155, 121, 255, .34); color: #c6b5ff; }
.live-pass-countdown[data-state="pending"] i { background: #9d7bff; box-shadow: 0 0 0 4px rgba(157, 123, 255, .12), 0 0 13px rgba(157, 123, 255, .55); }

.live-pass-reward-card,
.admin-live-pass-reward-card {
  --rarity: #98a7ba;
  --rarity-rgb: 152, 167, 186;
}
.live-pass-reward-card.rarity-rare,
.admin-live-pass-reward-card.rarity-rare { --rarity: #3bc4ff; --rarity-rgb: 59, 196, 255; }
.live-pass-reward-card.rarity-epic,
.admin-live-pass-reward-card.rarity-epic { --rarity: #a56cff; --rarity-rgb: 165, 108, 255; }
.live-pass-reward-card.rarity-legendary,
.admin-live-pass-reward-card.rarity-legendary { --rarity: #ffb02e; --rarity-rgb: 255, 176, 46; }
.live-pass-reward-card.rarity-mythic,
.admin-live-pass-reward-card.rarity-mythic { --rarity: #ff5fe0; --rarity-rgb: 255, 95, 224; }

.live-pass-reward-card[class*="rarity-"] {
  border-color: rgba(var(--rarity-rgb), .38);
  box-shadow: inset 0 0 30px rgba(var(--rarity-rgb), .025);
}
.live-pass-reward-card[class*="rarity-"]::before {
  background: linear-gradient(90deg, transparent 0, var(--rarity) 18%, var(--rarity) 82%, transparent 100%);
  box-shadow: 0 0 15px rgba(var(--rarity-rgb), .38);
}
.live-pass-reward-card[class*="rarity-"]:hover {
  border-color: rgba(var(--rarity-rgb), .68);
  box-shadow: 0 16px 36px rgba(0, 0, 0, .27), 0 0 28px rgba(var(--rarity-rgb), .12);
}
.live-pass-reward-card > :not(.live-pass-rarity-effects) { position: relative; z-index: 2; }
.live-pass-reward-card.claimed {
  border-color: rgba(118, 133, 151, .24);
  filter: grayscale(.82) saturate(.25);
  opacity: .64;
}
.live-pass-reward-card.claimed:hover {
  border-color: rgba(118, 133, 151, .3);
  box-shadow: none;
  transform: none;
}
.live-pass-reward-card.claimed::after {
  background: rgba(7, 16, 29, .24);
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 4;
}
.live-pass-reward-card.claimed .live-pass-reward-action { position: relative; z-index: 5; }
.live-pass-reward-rarity {
  background: rgba(var(--rarity-rgb), .1);
  border: 1px solid rgba(var(--rarity-rgb), .32);
  border-radius: 999px;
  color: var(--rarity);
  font-size: .49rem;
  font-weight: 950;
  letter-spacing: .075em;
  margin-left: auto;
  padding: 4px 7px;
  white-space: nowrap;
}

.live-pass-rarity-effects {
  height: 104px;
  inset: 0 0 auto;
  opacity: 0;
  overflow: hidden;
  pointer-events: none;
  position: absolute;
  z-index: 3;
}
.rarity-epic > .live-pass-rarity-effects { opacity: .34; }
.rarity-legendary > .live-pass-rarity-effects { opacity: .74; }
.rarity-mythic > .live-pass-rarity-effects { opacity: 1; }
.live-pass-rarity-effects::before {
  background: radial-gradient(ellipse at 50% -20%, rgba(var(--rarity-rgb), .45), transparent 68%);
  content: "";
  inset: 0;
  opacity: .58;
  position: absolute;
}
.rarity-mythic > .live-pass-rarity-effects::after {
  animation: live-pass-mythic-scan 3.2s ease-in-out infinite;
  background: linear-gradient(105deg, transparent 34%, rgba(83, 231, 255, .25) 45%, rgba(255, 112, 231, .38) 50%, transparent 62%);
  content: "";
  inset: 0 -70%;
  position: absolute;
}
.live-pass-rarity-effects i {
  animation: live-pass-particle-rise 2.75s ease-in infinite;
  animation-delay: var(--particle-delay);
  background: var(--rarity);
  border-radius: 50%;
  box-shadow: 0 0 7px var(--rarity), 0 0 14px rgba(var(--rarity-rgb), .5);
  bottom: -10px;
  height: var(--particle-size);
  left: var(--particle-x);
  opacity: 0;
  position: absolute;
  width: var(--particle-size);
}
.rarity-mythic > .live-pass-rarity-effects i:nth-child(3n) { background: #66edff; box-shadow: 0 0 8px #66edff, 0 0 16px rgba(102, 237, 255, .65); }
.rarity-legendary > .live-pass-rarity-effects i { animation-duration: 3.35s; }
.rarity-mythic > .live-pass-rarity-effects i { animation-duration: 2.25s; }
@keyframes live-pass-particle-rise {
  0% { opacity: 0; transform: translate3d(0, 12px, 0) scale(.6); }
  18% { opacity: .9; }
  68% { opacity: .62; }
  100% { opacity: 0; transform: translate3d(8px, -104px, 0) scale(1.35); }
}
@keyframes live-pass-mythic-scan {
  0%, 18% { transform: translateX(-38%); opacity: 0; }
  45% { opacity: .75; }
  78%, 100% { transform: translateX(38%); opacity: 0; }
}

.live-pass-frame-preview > span.has-image {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  color: transparent;
}
.live-pass-preview-account {
  align-items: center;
  backdrop-filter: blur(8px);
  background: rgba(4, 13, 25, .84);
  border: 1px solid rgba(var(--rarity-rgb), .26);
  border-radius: 999px;
  bottom: 5px;
  color: #dce6f3;
  display: flex;
  gap: 5px;
  left: 8px;
  max-width: calc(100% - 16px);
  min-height: 22px;
  padding: 3px 7px 3px 3px;
  position: absolute;
  z-index: 5;
}
.live-pass-preview-account-avatar {
  background: #162b43;
  border: 1px solid rgba(var(--rarity-rgb), .48);
  border-radius: 50%;
  display: grid;
  flex: 0 0 17px;
  font-size: .42rem;
  height: 17px;
  overflow: hidden;
  place-items: center;
  width: 17px;
}
.live-pass-preview-account-avatar img { height: 100%; object-fit: cover; width: 100%; }
.live-pass-preview-account b { font-size: .51rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.live-pass-preview-account.is-linked::after { background: #4fe0ac; border-radius: 50%; box-shadow: 0 0 7px rgba(79, 224, 172, .72); content: ""; flex: 0 0 5px; height: 5px; margin-left: auto; width: 5px; }

@media (max-width: 560px) {
  .live-pass-season-row { align-items: stretch; display: grid; }
  .live-pass-season-row .live-pass-season,
  .live-pass-countdown { justify-content: center; width: 100%; }
  .live-pass-reward-rarity { font-size: .44rem; padding-inline: 6px; }
  .live-pass-preview-account { left: 4px; max-width: calc(100% - 8px); right: 4px; }
}
@media (prefers-reduced-motion: reduce) {
  .live-pass-rarity-effects i,
  .rarity-mythic > .live-pass-rarity-effects::after { animation: none !important; }
  .live-pass-rarity-effects { display: none; }
}


/* Live Pass preview-only rarity hotfix - 2026-07-24 */
.live-pass-preview-account { display: none !important; }
.live-pass-reward-visual.type-frame > :not(.live-pass-frame-preview) { display: none !important; }
.live-pass-reward-visual.type-frame {
  align-items: center;
  display: flex;
  justify-content: center;
  overflow: hidden;
}
.live-pass-frame-preview {
  flex: 0 0 auto;
  overflow: visible;
}
.live-pass-frame-preview > span {
  background-color: #101c2d;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  border: 1px solid rgba(var(--rarity-rgb), .42);
  overflow: hidden;
  position: relative;
  z-index: 1;
}
.live-pass-frame-preview > img {
  pointer-events: none;
  z-index: 2;
}
.live-pass-reward-card.rarity-common { --rarity: #a9b5c5; --rarity-rgb: 169,181,197; }
.live-pass-reward-card.rarity-rare { --rarity: #29c2ff; --rarity-rgb: 41,194,255; }
.live-pass-reward-card.rarity-epic { --rarity: #a46bff; --rarity-rgb: 164,107,255; }
.live-pass-reward-card.rarity-legendary { --rarity: #ffb52f; --rarity-rgb: 255,181,47; }
.live-pass-reward-card.rarity-mythic { --rarity: #ff59de; --rarity-rgb: 255,89,222; }
.live-pass-reward-card[class*="rarity-"] {
  border: 2px solid rgba(var(--rarity-rgb), .66);
  box-shadow: inset 0 0 38px rgba(var(--rarity-rgb), .045), 0 12px 32px rgba(0,0,0,.2);
}
.live-pass-reward-card.rarity-rare { background: linear-gradient(155deg, rgba(18,43,65,.98), rgba(8,20,36,.99) 58%); }
.live-pass-reward-card.rarity-epic { background: linear-gradient(155deg, rgba(42,28,75,.98), rgba(10,19,37,.99) 60%); }
.live-pass-reward-card.rarity-legendary {
  background: linear-gradient(155deg, rgba(69,45,12,.98), rgba(18,24,37,.99) 55%);
  box-shadow: inset 0 0 44px rgba(255,181,47,.08), 0 0 28px rgba(255,181,47,.16), 0 14px 36px rgba(0,0,0,.28);
}
.live-pass-reward-card.rarity-mythic {
  background: linear-gradient(155deg, rgba(70,22,75,.98), rgba(14,22,43,.99) 56%);
  box-shadow: inset 0 0 48px rgba(255,89,222,.1), 0 0 32px rgba(255,89,222,.18), 0 14px 38px rgba(0,0,0,.3);
}
.live-pass-reward-card[class*="rarity-"]::before {
  height: 3px;
  opacity: 1;
}
.live-pass-rarity-effects {
  display: block !important;
  height: 128px;
  mix-blend-mode: screen;
  z-index: 6;
}
.rarity-epic > .live-pass-rarity-effects { opacity: .58; }
.rarity-legendary > .live-pass-rarity-effects { opacity: 1; }
.rarity-mythic > .live-pass-rarity-effects { opacity: 1; }
.rarity-legendary > .live-pass-rarity-effects::before,
.rarity-mythic > .live-pass-rarity-effects::before { opacity: .9; }
.live-pass-rarity-effects i {
  box-shadow: 0 0 8px var(--rarity), 0 0 18px rgba(var(--rarity-rgb), .9);
  z-index: 2;
}
@media (prefers-reduced-motion: reduce) {
  .live-pass-rarity-effects { display: block !important; }
  .live-pass-rarity-effects i {
    animation: none !important;
    bottom: var(--particle-y);
    opacity: .78;
    transform: scale(1.05);
  }
  .rarity-mythic > .live-pass-rarity-effects::after {
    animation: none !important;
    opacity: .55;
    transform: none;
  }
}


/* Live Pass presentation refresh - premium arena, full-card rarity motion */
@property --pass-rarity-angle {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}

body[data-route="live-pass"] {
  background:
    radial-gradient(circle at 76% 8%, rgba(64, 72, 255, .14), transparent 31rem),
    radial-gradient(circle at 40% 80%, rgba(193, 36, 255, .08), transparent 28rem),
    #030711;
}
body[data-route="live-pass"] > main > .live-pass-view { padding-bottom: 42px; }
.live-pass-shell { gap: 20px; }
.live-pass-hero {
  isolation: isolate;
  min-height: 446px;
  background:
    linear-gradient(90deg, rgba(3, 8, 22, .99) 0%, rgba(6, 12, 33, .96) 28%, rgba(7, 11, 31, .55) 58%, rgba(4, 7, 21, .84) 100%),
    radial-gradient(circle at 78% 50%, rgba(35, 133, 255, .26), transparent 22%),
    radial-gradient(circle at 66% 42%, rgba(168, 64, 255, .27), transparent 25%),
    linear-gradient(145deg, #050a1c, #090d26 52%, #081522);
  border-color: rgba(89, 143, 216, .42);
  box-shadow: 0 32px 100px rgba(0, 0, 0, .42), inset 0 1px 0 rgba(255, 255, 255, .06), inset 0 -80px 110px rgba(17, 43, 111, .16);
}
.live-pass-hero::before {
  background:
    linear-gradient(rgba(103, 122, 255, .06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(103, 122, 255, .06) 1px, transparent 1px),
    radial-gradient(ellipse at 74% 53%, transparent 0 17%, rgba(90, 54, 255, .16) 17.2% 17.45%, transparent 17.7% 25%, rgba(38, 205, 255, .1) 25.2% 25.38%, transparent 25.8% 34%, rgba(90, 54, 255, .08) 34.2% 34.35%, transparent 35%);
  background-size: 46px 46px, 46px 46px, auto;
  inset: 0;
  mask-image: linear-gradient(90deg, transparent 0, #000 16%, #000 100%);
  opacity: .92;
  z-index: 0;
  animation: live-pass-scene-drift 18s ease-in-out infinite alternate;
}
.live-pass-hero::after {
  background:
    radial-gradient(ellipse at 74% 53%, rgba(31, 211, 255, .32) 0 1.5%, transparent 2%, transparent 11%, rgba(83, 65, 255, .16) 11.2% 11.5%, transparent 12%),
    radial-gradient(ellipse at 74% 53%, transparent 0 22%, rgba(176, 81, 255, .22) 22.2% 22.45%, transparent 22.8% 31%, rgba(42, 208, 255, .13) 31.2% 31.45%, transparent 32%),
    linear-gradient(112deg, transparent 35%, rgba(91, 205, 255, .13) 48%, rgba(163, 71, 255, .18) 54%, transparent 67%);
  content: "";
  inset: 0;
  opacity: .82;
  pointer-events: none;
  position: absolute;
  z-index: 1;
  animation: live-pass-arena-scan 9s ease-in-out infinite;
}
.live-pass-hero-glow i { animation: live-pass-glow-float 7s ease-in-out infinite alternate; }
.live-pass-hero-glow i:nth-child(2) { animation-delay: -2.4s; }
.live-pass-hero-glow i:nth-child(3) { animation-delay: -4.1s; }
.live-pass-hero-copy,
.live-pass-emblem,
.live-pass-account-stats { z-index: 3; }
.live-pass-emblem { filter: drop-shadow(0 0 32px rgba(97, 78, 255, .32)); }
.live-pass-emblem::before { animation: live-pass-emblem-spin 18s linear infinite; }
.live-pass-emblem::after { animation: live-pass-emblem-pulse 3.4s ease-in-out infinite; }
.live-pass-account-stats article {
  --widget-rgb: 87, 204, 255;
  background: linear-gradient(135deg, rgba(var(--widget-rgb), .13), rgba(7, 19, 38, .88) 65%);
  border-color: rgba(var(--widget-rgb), .42);
  box-shadow: inset 0 0 28px rgba(var(--widget-rgb), .08), 0 12px 32px rgba(0, 0, 0, .22);
  overflow: hidden;
  position: relative;
}
.live-pass-account-stats article:nth-child(2) { --widget-rgb: 255, 180, 56; }
.live-pass-account-stats article:nth-child(3) { --widget-rgb: 181, 108, 255; }
.live-pass-account-stats article::after {
  background: linear-gradient(115deg, transparent 20%, rgba(255, 255, 255, .16) 49%, transparent 68%);
  content: "";
  inset: 0 -100%;
  pointer-events: none;
  position: absolute;
  animation: live-pass-widget-shine 6.5s ease-in-out infinite;
}
.live-pass-progress-panel { overflow: hidden; position: relative; }
.live-pass-progress-panel::before {
  background: linear-gradient(90deg, transparent, rgba(105, 228, 255, .15), transparent);
  content: "";
  inset: 0 -45%;
  pointer-events: none;
  position: absolute;
  transform: translateX(-40%);
  animation: live-pass-progress-scan 7s ease-in-out infinite;
}
.live-pass-progress-panel > * { position: relative; z-index: 1; }
.live-pass-progress-track > span { animation: live-pass-progress-glow 2.8s ease-in-out infinite; }
.live-pass-progress-track > i { animation: live-pass-marker-pulse 1.9s ease-in-out infinite; }

.live-pass-reward-card[class*="rarity-"] {
  animation: live-pass-rarity-border 8s linear infinite;
  background:
    linear-gradient(155deg, rgba(19, 34, 59, .98), rgba(8, 20, 36, .99)) padding-box,
    conic-gradient(from var(--pass-rarity-angle), transparent 0 15%, rgba(var(--rarity-rgb), .18) 24%, var(--rarity) 39%, rgba(var(--rarity-rgb), .34) 50%, transparent 64% 78%, var(--rarity) 90%, transparent) border-box;
  border: 1px solid transparent;
  box-shadow: inset 0 0 42px rgba(var(--rarity-rgb), .08), 0 14px 34px rgba(0, 0, 0, .25);
  isolation: isolate;
}
.live-pass-reward-card.rarity-rare { background: linear-gradient(155deg, rgba(18, 43, 65, .98), rgba(8, 20, 36, .99)) padding-box, conic-gradient(from var(--pass-rarity-angle), transparent 0 15%, rgba(var(--rarity-rgb), .18) 24%, var(--rarity) 39%, rgba(var(--rarity-rgb), .34) 50%, transparent 64% 78%, var(--rarity) 90%, transparent) border-box; }
.live-pass-reward-card.rarity-epic { background: linear-gradient(155deg, rgba(42, 28, 75, .98), rgba(10, 19, 37, .99)) padding-box, conic-gradient(from var(--pass-rarity-angle), transparent 0 15%, rgba(var(--rarity-rgb), .18) 24%, var(--rarity) 39%, rgba(var(--rarity-rgb), .34) 50%, transparent 64% 78%, var(--rarity) 90%, transparent) border-box; }
.live-pass-reward-card.rarity-legendary { background: linear-gradient(155deg, rgba(68, 45, 13, .98), rgba(16, 22, 35, .99)) padding-box, conic-gradient(from var(--pass-rarity-angle), transparent 0 15%, rgba(var(--rarity-rgb), .18) 24%, var(--rarity) 39%, rgba(var(--rarity-rgb), .34) 50%, transparent 64% 78%, var(--rarity) 90%, transparent) border-box; }
.live-pass-reward-card.rarity-mythic { background: linear-gradient(155deg, rgba(70, 22, 75, .98), rgba(8, 22, 42, .99)) padding-box, conic-gradient(from var(--pass-rarity-angle), transparent 0 15%, rgba(var(--rarity-rgb), .18) 24%, var(--rarity) 39%, rgba(var(--rarity-rgb), .34) 50%, transparent 64% 78%, var(--rarity) 90%, transparent) border-box; }
.live-pass-rarity-effects { height: auto; inset: 0; mix-blend-mode: screen; opacity: .24; z-index: 1; }
.rarity-rare > .live-pass-rarity-effects { opacity: .38; }
.rarity-epic > .live-pass-rarity-effects { opacity: .62; }
.rarity-legendary > .live-pass-rarity-effects { opacity: .86; }
.rarity-mythic > .live-pass-rarity-effects { opacity: 1; }
.live-pass-rarity-effects i { animation-name: live-pass-card-particle-rise; bottom: auto; top: var(--particle-y, 55%); }

@keyframes live-pass-scene-drift { from { background-position: 0 0, 0 0, 0 0; transform: scale(1); } to { background-position: 32px 18px, -24px 12px, 6px -4px; transform: scale(1.03); } }
@keyframes live-pass-arena-scan { 0%, 100% { opacity: .52; transform: translateX(-1%); } 50% { opacity: .94; transform: translateX(2%); } }
@keyframes live-pass-glow-float { from { transform: translate3d(0, 0, 0) scale(.96); } to { transform: translate3d(-18px, 13px, 0) scale(1.05); } }
@keyframes live-pass-emblem-spin { to { transform: rotate(405deg); } }
@keyframes live-pass-emblem-pulse { 0%, 100% { opacity: .4; transform: rotate(45deg) scale(.94); } 50% { opacity: .9; transform: rotate(45deg) scale(1.04); } }
@keyframes live-pass-widget-shine { 0%, 62% { transform: translateX(-22%); opacity: 0; } 75% { opacity: .8; } 100% { transform: translateX(35%); opacity: 0; } }
@keyframes live-pass-progress-scan { 0%, 100% { transform: translateX(-42%); opacity: 0; } 45% { opacity: 1; } 70% { transform: translateX(42%); opacity: 0; } }
@keyframes live-pass-progress-glow { 0%, 100% { filter: brightness(1); } 50% { filter: brightness(1.35); } }
@keyframes live-pass-marker-pulse { 0%, 100% { box-shadow: 0 0 0 4px rgba(99, 91, 234, .15), 0 0 18px rgba(68, 216, 245, .52); } 50% { box-shadow: 0 0 0 8px rgba(99, 91, 234, .08), 0 0 30px rgba(68, 216, 245, .86); } }
@keyframes live-pass-rarity-border { to { --pass-rarity-angle: 360deg; } }
@keyframes live-pass-card-particle-rise { 0% { opacity: 0; transform: translate3d(0, 10px, 0) scale(.55); } 18% { opacity: .9; } 72% { opacity: .54; } 100% { opacity: 0; transform: translate3d(var(--particle-drift, 8px), -62px, 0) scale(1.45); } }
@media (prefers-reduced-motion: reduce) {
  .live-pass-hero::before, .live-pass-hero::after, .live-pass-hero-glow i, .live-pass-emblem::before, .live-pass-emblem::after, .live-pass-account-stats article::after, .live-pass-progress-panel::before, .live-pass-progress-track > span, .live-pass-progress-track > i, .live-pass-reward-card[class*="rarity-"], .live-pass-rarity-effects i { animation: none !important; }
}
/* PHNX590 persistent vertical member menu */
body[data-route="account"] .member-dashboard{
  align-items:start!important;
  display:grid!important;
  gap:18px!important;
  grid-template-columns:230px minmax(0,1fr)!important;
}
body[data-route="account"] .member-sidebar{
  align-self:start!important;
  box-sizing:border-box!important;
  display:grid!important;
  gap:4px!important;
  grid-template-columns:minmax(0,1fr)!important;
  overflow:hidden!important;
  position:sticky!important;
  top:82px!important;
  width:100%!important;
}
body[data-route="account"] .member-sidebar>button{min-width:0!important;width:100%!important}
body[data-route="account"] .member-panels{min-width:0!important}
@media(max-width:1180px){
  body[data-route="account"] .member-dashboard{gap:14px!important;grid-template-columns:190px minmax(0,1fr)!important}
}
@media(max-width:760px){
  body[data-route="account"] .member-dashboard{grid-template-columns:minmax(0,1fr)!important}
  body[data-route="account"] .member-sidebar{
    grid-template-columns:minmax(0,1fr)!important;
    max-width:none!important;
    overflow:visible!important;
    position:static!important;
  }
  body[data-route="account"] .member-sidebar>button{min-height:46px!important;padding:7px 9px!important}
}
/* PHNX590 horizontal navigation correction - reference layout. */
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]){min-width:0!important;padding-left:0!important;padding-top:118px!important}
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .site-header{height:64px!important;left:0!important;min-height:64px!important;right:0!important;width:100%!important}
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .header-shell{gap:18px!important;padding:0 28px!important}
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .brand{background:transparent!important;border:0!important;height:64px!important;left:auto!important;padding:8px 0!important;position:static!important;top:auto!important;width:auto!important}
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .public-route-heading,
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .nav-toggle,
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .public-sidebar-account-zone,
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .public-sidebar-separator,
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .public-sidebar-bottom{display:none!important}
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .site-taskbar{background:linear-gradient(180deg,#081321,#06101c)!important;border:0!important;border-bottom:1px solid var(--phx-border)!important;bottom:auto!important;box-shadow:0 10px 28px rgba(0,0,0,.18)!important;display:block!important;height:54px!important;left:0!important;padding:0 28px!important;position:fixed!important;right:0!important;top:64px!important;transform:none!important;visibility:visible!important;width:100%!important;z-index:115!important}
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav{align-items:stretch!important;display:flex!important;flex-direction:row!important;gap:0!important;height:100%!important;justify-content:center!important;margin:0 auto!important;max-width:1640px!important;overflow-x:auto!important;overflow-y:hidden!important;overscroll-behavior-inline:contain;padding:0!important;scroll-behavior:smooth;scrollbar-width:none!important;width:100%!important}
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav::-webkit-scrollbar{display:none!important}
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav .nav-group,
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav .nav-dropdown{display:contents!important}
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav .nav-group-trigger,
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav .nav-dropdown>p{display:none!important}
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav>.nav-direct,
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav .nav-dropdown>a{align-items:center!important;background:transparent!important;border:0!important;border-bottom:3px solid transparent!important;border-radius:0!important;border-right:1px solid rgba(92,126,166,.16)!important;box-shadow:none!important;color:#91a0b4!important;display:flex!important;flex:1 1 0!important;font-size:11px!important;font-weight:650!important;gap:9px!important;height:54px!important;justify-content:center!important;margin:0!important;min-height:54px!important;min-width:max-content!important;padding:0 clamp(10px,1.05vw,18px)!important;text-align:left!important;white-space:nowrap!important;width:auto!important}
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav>.nav-direct:first-child{border-left:1px solid rgba(92,126,166,.16)!important}
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav>.nav-direct:hover,
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav .nav-dropdown>a:hover{background:rgba(55,152,222,.06)!important;color:#eef7ff!important}
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav>.nav-direct.active,
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav>.nav-direct[aria-current="page"],
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav .nav-dropdown>a.active,
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav .nav-dropdown>a[aria-current="page"]{background:linear-gradient(180deg,rgba(38,172,240,.1),rgba(255,119,27,.08))!important;border-bottom-color:var(--phx-orange)!important;border-right-color:rgba(92,126,166,.16)!important;color:#f5fbff!important}
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav .nav-item-icon{flex:0 0 auto!important;height:20px!important;min-width:20px!important;width:20px!important}
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav .nav-dropdown>a small,
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav>.nav-direct small{display:none!important}
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav .nav-dropdown>a strong,
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav>.nav-direct strong{color:inherit!important;font-size:11px!important;font-weight:650!important}
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav>.nav-live-pass-link{background:linear-gradient(180deg,rgba(110,61,255,.14),rgba(15,48,78,.08))!important;border-left:1px solid rgba(138,91,255,.22)!important;border-top:0!important;padding-inline:clamp(10px,1.05vw,18px)!important}
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .nav-scrim{display:none!important}
body[data-route="account"] .member-dashboard,
body[data-route="account"] .member-dashboard.skill-tree-is-active{align-items:start!important;display:grid!important;gap:14px!important;grid-template-columns:minmax(0,1fr)!important}
body[data-route="account"] .member-sidebar,
body[data-route="account"] .member-dashboard.skill-tree-is-active .member-sidebar{align-self:start!important;box-sizing:border-box!important;display:grid!important;gap:0!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;max-width:none!important;overflow:hidden!important;position:static!important;top:auto!important;width:100%!important}
body[data-route="account"] .member-sidebar>button{border-bottom:3px solid transparent!important;border-radius:0!important;min-height:58px!important;min-width:0!important;padding:8px 10px!important;width:100%!important}
body[data-route="account"] .member-sidebar>button+button{border-left:1px solid rgba(86,126,168,.18)!important}
body[data-route="account"] .member-sidebar>button.active{border-bottom-color:var(--phx-orange)!important;border-left-color:rgba(86,126,168,.18)!important}
body[data-route="account"] .member-panels{min-width:0!important;width:100%!important}
@media(max-width:1120px){
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .site-taskbar{padding-inline:12px!important}
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav{justify-content:flex-start!important}
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav>.nav-direct,
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav .nav-dropdown>a{flex:0 0 auto!important;min-width:122px!important}
}
@media(max-width:760px){
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]){padding-top:106px!important}
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .site-header{height:56px!important;min-height:56px!important}
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .header-shell{padding:0 10px!important}
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .brand{height:56px!important;padding:7px 0!important}
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .site-taskbar{height:50px!important;top:56px!important}
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav>.nav-direct,
  body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .main-nav .nav-dropdown>a{height:50px!important;min-height:50px!important;min-width:116px!important;padding-inline:10px!important}
  body[data-route="account"] .member-sidebar,
  body[data-route="account"] .member-dashboard.skill-tree-is-active .member-sidebar{grid-auto-columns:minmax(150px,44vw)!important;grid-auto-flow:column!important;grid-template-columns:none!important;overflow-x:auto!important;overflow-y:hidden!important;scroll-snap-type:x proximity;scrollbar-width:none!important}
  body[data-route="account"] .member-sidebar::-webkit-scrollbar{display:none!important}
  body[data-route="account"] .member-sidebar>button{min-height:54px!important;scroll-snap-align:start}
}
body[data-route]:not([data-route="admin"]):not([data-route="maintenance"]) .site-taskbar{box-sizing:border-box!important}