/* FireRed full UI theme */
body[data-edition-theme="firered"] {
  --emerald-ink: #180604;
  --emerald-night: #150403;
  --emerald-deep: #40100b;
  --emerald-panel: rgba(74, 18, 12, 0.94);
  --emerald-panel-2: rgba(108, 38, 14, 0.90);
  --emerald-field: #250705;
  --emerald-field-2: #6f1e0f;
  --emerald-glass: rgba(255, 122, 60, 0.10);
  --emerald-line: rgba(255, 124, 83, 0.24);
  --emerald-line-hard: rgba(255, 165, 106, 0.58);
  --emerald-text: #fff2e0;
  --emerald-soft: #ffc692;
  --emerald-muted: #d4834b;
  --emerald-lime: #ff6d43;
  --emerald-mint: #ffb347;
  --emerald-ocean: #ffd17a;
  --emerald-gold: #ffd65c;
  --emerald-coral: #ff8f66;
  --emerald-shadow: rgba(24, 5, 3, 0.76);

  --bg: var(--emerald-night);
  --panel: var(--emerald-panel);
  --field: var(--emerald-field);
  --field-border: var(--emerald-line-hard);
  --text: var(--emerald-text);
  --muted: var(--emerald-muted);
  --muted2: #aa6638;
  --line-soft: var(--emerald-line);
}

body[data-edition-theme="firered"] html,
body[data-edition-theme="firered"] {
  scrollbar-color: rgba(255, 138, 76, 0.68) rgba(35, 8, 4, 0.94);
}

body[data-edition-theme="firered"] {
  background:
    radial-gradient(circle at 14% 12%, rgba(255, 111, 76, 0.22), transparent 28rem),
    radial-gradient(circle at 88% 8%, rgba(255, 176, 71, 0.18), transparent 32rem),
    radial-gradient(circle at 56% 92%, rgba(255, 214, 92, 0.10), transparent 25rem),
    linear-gradient(155deg, #090403 0%, #1c0805 34%, #4f170d 72%, #120503 100%) !important;
  color: #fff2e0 !important;
}

body[data-edition-theme="firered"]::before {
  background:
    radial-gradient(circle at 32% 24%, rgba(255, 176, 71, 0.14), transparent 18rem),
    radial-gradient(circle at 74% 44%, rgba(255, 111, 76, 0.10), transparent 22rem) !important;
}

body[data-edition-theme="firered"] .page::before {
  background:
    radial-gradient(ellipse at 18% 100%, rgba(255, 111, 76, 0.16), transparent 42%),
    radial-gradient(ellipse at 88% 100%, rgba(255, 176, 71, 0.12), transparent 42%),
    linear-gradient(0deg, rgba(18, 5, 3, 0.95), transparent) !important;
}

body[data-edition-theme="firered"] .top-shell {
  background:
    linear-gradient(180deg, rgba(30, 8, 5, 0.98), rgba(80, 24, 12, 0.94)),
    radial-gradient(circle at 6% 12%, rgba(255, 111, 76, 0.22), transparent 20rem),
    linear-gradient(90deg, rgba(255, 214, 150, 0.10), transparent 36%, rgba(255, 176, 71, 0.10)) !important;
  border-bottom-color: rgba(255, 124, 83, 0.30) !important;
}

body[data-edition-theme="firered"] .top-shell::before {
  border-color: rgba(255, 124, 83, 0.20) !important;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.06), transparent 30%, rgba(255, 176, 71, 0.08)) !important;
}

body[data-edition-theme="firered"] .emerald-logo {
  border-color: rgba(255, 165, 106, 0.58) !important;
  background:
    radial-gradient(circle at 25% 20%, rgba(255, 214, 150, 0.24), transparent 42%),
    linear-gradient(145deg, rgba(131, 35, 18, 0.94), rgba(43, 10, 6, 0.88)) !important;
  box-shadow:
    0 14px 28px rgba(0, 0, 0, 0.40),
    0 0 22px rgba(255, 111, 76, 0.18),
    0 1px 0 rgba(255, 255, 255, 0.15) inset !important;
}

body[data-edition-theme="firered"] .emerald-logo:hover,
body[data-edition-theme="firered"] .emerald-logo:focus-within {
  border-color: rgba(255, 190, 132, 0.94) !important;
  background:
    radial-gradient(circle at 25% 20%, rgba(255, 214, 150, 0.28), transparent 42%),
    linear-gradient(145deg, rgba(164, 45, 22, 0.98), rgba(58, 13, 8, 0.94)) !important;
  box-shadow:
    0 12px 26px rgba(0, 0, 0, 0.36),
    0 0 24px rgba(255, 111, 76, 0.28),
    0 0 18px rgba(255, 176, 71, 0.14),
    0 1px 0 rgba(255, 255, 255, 0.16) inset !important;
}

body[data-edition-theme="firered"] .emerald-logo .site-logo {
  filter:
    drop-shadow(0 4px 0 rgba(0, 0, 0, 0.28))
    drop-shadow(0 0 8px rgba(255, 111, 76, 0.20))
    saturate(1.08)
    contrast(1.04) !important;
}

body[data-edition-theme="firered"] .player-card,
body[data-edition-theme="firered"] .challenge-player-header,
body[data-edition-theme="firered"] .game-navigation,
body[data-edition-theme="firered"] .boss-card,
body[data-edition-theme="firered"] .boss-inline-stat,
body[data-edition-theme="firered"] .boss-hm,
body[data-edition-theme="firered"] .empty {
  border-color: rgba(255, 124, 83, 0.23) !important;
}

body[data-edition-theme="firered"] .player-card {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.10), transparent 34%),
    radial-gradient(circle at 12% 15%, rgba(255, 111, 76, 0.20), transparent 34%),
    linear-gradient(180deg, rgba(109, 30, 15, 0.90), rgba(34, 10, 6, 0.92)) !important;
}

body[data-edition-theme="firered"] .player-card:hover {
  border-color: rgba(255, 165, 106, 0.72) !important;
  box-shadow:
    0 17px 32px rgba(0, 0, 0, 0.36),
    0 0 24px rgba(255, 176, 71, 0.18),
    0 1px 0 rgba(255, 255, 255, 0.16) inset !important;
}

body[data-edition-theme="firered"] .player-card.is-active {
  border-color: rgba(255, 165, 106, 0.92) !important;
  box-shadow:
    0 0 0 2px rgba(255, 124, 83, 0.16),
    0 18px 34px rgba(0, 0, 0, 0.38),
    0 0 26px rgba(255, 111, 76, 0.18) !important;
}

body[data-edition-theme="firered"] .player-card.is-online {
  border-color: rgba(255, 165, 106, 0.82) !important;
}

body[data-edition-theme="firered"] .player-live-dot,
body[data-edition-theme="firered"] .room-status-dot {
  background: #ff6d43 !important;
  box-shadow: 0 0 11px rgba(255, 111, 76, 0.62) !important;
}

body[data-edition-theme="firered"] .mode-tabs button,
body[data-edition-theme="firered"] .main-tabs button,
body[data-edition-theme="firered"] .sub-tabs button,
body[data-edition-theme="firered"] .room-mini-button,
body[data-edition-theme="firered"] .rom-download-button,
body[data-edition-theme="firered"] .randomizer-settings-upload-button,
body[data-edition-theme="firered"] .lua-download-button,
body[data-edition-theme="firered"] .challenge-count-button,
body[data-edition-theme="firered"] .reset-button,
body[data-edition-theme="firered"] #searchInput,
body[data-edition-theme="firered"] .randomizer-settings-select,
body[data-edition-theme="firered"] .lua-player-select,
body[data-edition-theme="firered"] .route-input,
body[data-edition-theme="firered"] .status-select {
  border-color: rgba(255, 124, 83, 0.26) !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.025)),
    rgba(29, 8, 5, 0.88) !important;
  color: #fff2e0 !important;
}

body[data-edition-theme="firered"] .mode-tabs button.active,
body[data-edition-theme="firered"] .main-tabs button.active,
body[data-edition-theme="firered"] .sub-tabs button.active,
body[data-edition-theme="firered"] .rom-download-button,
body[data-edition-theme="firered"] .challenge-count-button.is-active {
  border-color: rgba(255, 208, 120, 0.88) !important;
  background:
    linear-gradient(180deg, rgba(255, 214, 120, 0.96), rgba(255, 111, 76, 0.88)) !important;
  color: #2a0703 !important;
  box-shadow:
    0 0 24px rgba(255, 111, 76, 0.26),
    0 1px 0 rgba(255, 255, 255, 0.38) inset !important;
}

body[data-edition-theme="firered"] .game-navigation {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.070), rgba(255, 255, 255, 0.018)),
    radial-gradient(circle at 95% 12%, rgba(255, 176, 71, 0.12), transparent 18rem),
    rgba(25, 7, 5, 0.72) !important;
}

body[data-edition-theme="firered"] .challenge-player-header {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.025)),
    rgba(73, 20, 11, 0.82) !important;
}

body[data-edition-theme="firered"] .challenge-player-header:hover,
body[data-edition-theme="firered"] .challenge-player-header.is-active {
  border-color: rgba(255, 165, 106, 0.74) !important;
  background:
    linear-gradient(180deg, rgba(255, 111, 76, 0.20), rgba(255, 176, 71, 0.08)),
    rgba(90, 24, 13, 0.92) !important;
}

body[data-edition-theme="firered"] .challenge-row.route-row::before {
  background: linear-gradient(90deg, rgba(255, 111, 76, 0.045), rgba(255, 176, 71, 0.035), transparent 70%) !important;
}

body[data-edition-theme="firered"] .challenge-row.route-row:hover::before {
  background: linear-gradient(90deg, rgba(255, 111, 76, 0.08), rgba(255, 176, 71, 0.045), transparent 74%) !important;
}

body[data-edition-theme="firered"] .location-cell,
body[data-edition-theme="firered"] .boss-title,
body[data-edition-theme="firered"] .challenge-player-header strong {
  color: #fff2e0 !important;
}

body[data-edition-theme="firered"] .challenge-player-header span,
body[data-edition-theme="firered"] .boss-inline-value,
body[data-edition-theme="firered"] .continue span {
  color: #ffd65c !important;
  text-shadow: 0 0 13px rgba(255, 111, 76, 0.22) !important;
}

body[data-edition-theme="firered"] .boss-location,
body[data-edition-theme="firered"] #searchInput::placeholder {
  color: rgba(255, 198, 146, 0.66) !important;
}

body[data-edition-theme="firered"] .route-input:focus,
body[data-edition-theme="firered"] .status-select:focus,
body[data-edition-theme="firered"] #searchInput:focus,
body[data-edition-theme="firered"] .lua-player-select:focus,
body[data-edition-theme="firered"] .randomizer-settings-select:focus {
  border-color: rgba(255, 208, 120, 0.84) !important;
  box-shadow: 0 0 0 3px rgba(255, 111, 76, 0.14), 0 8px 16px rgba(0, 0, 0, 0.22) !important;
}

body[data-edition-theme="firered"] .status-alive {
  border-color: rgba(255, 165, 106, 0.72) !important;
  box-shadow: 0 0 0 1px rgba(255, 111, 76, 0.14), 0 8px 16px rgba(0, 0, 0, 0.20) !important;
}

body[data-edition-theme="firered"] .status-boxed {
  border-color: rgba(255, 214, 120, 0.72) !important;
  box-shadow: 0 0 0 1px rgba(255, 214, 120, 0.12), 0 8px 16px rgba(0, 0, 0, 0.20) !important;
}

body[data-edition-theme="firered"] .boss-card {
  background:
    radial-gradient(circle at 10% 15%, rgba(255, 111, 76, 0.14), transparent 14rem),
    radial-gradient(circle at 98% 0%, rgba(255, 176, 71, 0.13), transparent 18rem),
    linear-gradient(135deg, rgba(255, 255, 255, 0.070), rgba(255, 255, 255, 0.020)),
    rgba(27, 8, 5, 0.78) !important;
}

body[data-edition-theme="firered"] .boss-card::before {
  background: none !important;
}

body[data-edition-theme="firered"] .boss-inline-stat,
body[data-edition-theme="firered"] .boss-hm {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.03)),
    rgba(64, 18, 11, 0.78) !important;
  color: #ffd65c !important;
}

body[data-edition-theme="firered"] .boss-hm strong {
  color: #7fdfff !important;
}

body[data-edition-theme="firered"] .trainer-sprite {
  filter:
    drop-shadow(0 12px 14px rgba(0, 0, 0, 0.36))
    drop-shadow(0 0 10px rgba(255, 111, 76, 0.12));
}

body[data-edition-theme="firered"] .hoenn-map-modal {
  background: rgba(0, 0, 0, 0.56) !important;
}

body[data-edition-theme="firered"] .hoenn-map-panel {
  border-color: rgba(255, 165, 106, 0.32) !important;
  background:
    linear-gradient(180deg, rgba(59, 13, 8, 0.98), rgba(22, 5, 3, 0.98)),
    rgba(20, 5, 3, 0.98) !important;
  box-shadow: 0 38px 84px rgba(0, 0, 0, 0.56), 0 0 30px rgba(255, 111, 76, 0.14) !important;
}

body[data-edition-theme="firered"] .hoenn-map-title h2,
body[data-edition-theme="firered"] .hoenn-map-eyebrow {
  color: #fff2e0 !important;
}

html[data-edition-theme="firered"],
html[data-edition-theme="firered"] *,
body[data-edition-theme="firered"],
body[data-edition-theme="firered"] * {
  scrollbar-color: rgba(255, 138, 76, 0.64) rgba(35, 8, 4, 0.92);
}

html[data-edition-theme="firered"]::-webkit-scrollbar,
html[data-edition-theme="firered"] *::-webkit-scrollbar,
body[data-edition-theme="firered"]::-webkit-scrollbar,
body[data-edition-theme="firered"] *::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

html[data-edition-theme="firered"]::-webkit-scrollbar-track,
html[data-edition-theme="firered"] *::-webkit-scrollbar-track,
body[data-edition-theme="firered"]::-webkit-scrollbar-track,
body[data-edition-theme="firered"] *::-webkit-scrollbar-track {
  background: rgba(35, 8, 4, 0.92);
}

html[data-edition-theme="firered"]::-webkit-scrollbar-thumb,
html[data-edition-theme="firered"] *::-webkit-scrollbar-thumb,
body[data-edition-theme="firered"]::-webkit-scrollbar-thumb,
body[data-edition-theme="firered"] *::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(255, 214, 120, 0.88), rgba(255, 111, 76, 0.90));
  border: 2px solid rgba(35, 8, 4, 0.92);
  border-radius: 999px;
}

html[data-edition-theme="firered"]::-webkit-scrollbar-thumb:hover,
html[data-edition-theme="firered"] *::-webkit-scrollbar-thumb:hover,
body[data-edition-theme="firered"]::-webkit-scrollbar-thumb:hover,
body[data-edition-theme="firered"] *::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, rgba(255, 222, 146, 0.92), rgba(255, 133, 92, 0.94));
}

body[data-edition-theme="firered"] .empty,
body[data-edition-theme="firered"] .tracker-list > .empty {
  border-color: rgba(255, 124, 83, 0.22) !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.02)),
    rgba(25, 7, 5, 0.68) !important;
  color: rgba(255, 198, 146, 0.76) !important;
}

body[data-edition-theme="firered"] .room-chip,
body[data-edition-theme="firered"] .lua-download-control,
body[data-edition-theme="firered"] .challenge-count-control {
  border-color: rgba(255, 124, 83, 0.24) !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.03)),
    rgba(39, 10, 6, 0.82) !important;
}

body[data-edition-theme="firered"] .room-chip span,
body[data-edition-theme="firered"] .lua-download-control span,
body[data-edition-theme="firered"] .challenge-count-control > span {
  color: rgba(255, 214, 120, 0.84) !important;
}

body[data-edition-theme="firered"] .room-chip strong {
  color: #fff2e0 !important;
}

body[data-edition-theme="firered"] .room-chip code {
  color: #ffd65c !important;
}

body[data-edition-theme="firered"] .room-host-badge {
  background: linear-gradient(180deg, rgba(255, 214, 120, 0.94), rgba(255, 111, 76, 0.92)) !important;
  color: #2a0703 !important;
}

body[data-edition-theme="firered"] .room-control-button,
body[data-edition-theme="firered"] .room-mini-button {
  border-color: rgba(255, 124, 83, 0.24) !important;
  color: #fff2e0 !important;
}

body[data-edition-theme="firered"] .room-control-button:hover,
body[data-edition-theme="firered"] .room-mini-button:hover {
  border-color: rgba(255, 165, 106, 0.68) !important;
  box-shadow: 0 0 0 1px rgba(255, 111, 76, 0.10), 0 10px 20px rgba(0, 0, 0, 0.22) !important;
}

body[data-edition-theme="firered"] .lua-player-select,
body[data-edition-theme="firered"] .randomizer-settings-select {
  color: #fff2e0 !important;
  background-color: rgba(30, 8, 5, 0.88) !important;
}

body[data-edition-theme="firered"] .game-navigation,
body[data-edition-theme="firered"] .main-tabs,
body[data-edition-theme="firered"] .sub-tabs {
  border-color: rgba(255, 124, 83, 0.18) !important;
}

body[data-edition-theme="firered"] .boss-card[data-category="evil"],
body[data-edition-theme="firered"] .boss-card.is-evil,
body[data-edition-theme="firered"] .boss-card:has(.boss-title) {
  position: relative;
}

body[data-edition-theme="firered"] .hoenn-map-panel {
  max-width: min(1120px, calc(100vw - 2rem));
}

body[data-edition-theme="firered"] .hoenn-map-stage,
body[data-edition-theme="firered"] .hoenn-map-image {
  max-width: min(100%, 1050px);
}

@media (max-width: 1180px) {
  body[data-edition-theme="firered"] .hoenn-map-stage,
  body[data-edition-theme="firered"] .hoenn-map-image {
    max-width: 100%;
  }
}


/* Crystal V1 UI theme */
.edition-option.is-available-edition[data-room-edition="crystal"] {
  border-color: rgba(154, 220, 255, 0.78);
  background: radial-gradient(circle at 50% 0%, rgba(180, 136, 255, 0.28), transparent 54%), linear-gradient(180deg, rgba(30, 46, 94, 0.84), rgba(9, 18, 43, 0.84));
  box-shadow: 0 0 20px rgba(111, 216, 255, 0.18), 0 1px 0 rgba(255, 255, 255, 0.12) inset;
}
.edition-option.is-available-edition[data-room-edition="crystal"]:hover,
.edition-option.is-available-edition[data-room-edition="crystal"].is-selected {
  border-color: rgba(222, 250, 255, 0.98);
  background: radial-gradient(circle at 50% 0%, rgba(111, 216, 255, 0.34), transparent 48%), linear-gradient(180deg, rgba(76, 74, 168, 0.96), rgba(14, 28, 68, 0.92));
  box-shadow: 0 0 28px rgba(111, 216, 255, 0.30), 0 0 16px rgba(180, 136, 255, 0.20), 0 1px 0 rgba(255, 255, 255, 0.16) inset;
}
.edition-option.is-available-edition[data-room-edition="crystal"] em.is-live,
.edition-option[data-room-edition="crystal"] em.is-live { border-color: rgba(178, 235, 255, 0.62); background: rgba(111, 216, 255, 0.18); color: #e7f8ff; }
body[data-edition-theme="crystal"] {
  --emerald-ink:#06111a; --emerald-night:#06101b; --emerald-deep:#112447; --emerald-panel:rgba(16,38,72,.94); --emerald-panel-2:rgba(32,61,106,.9); --emerald-field:#061524; --emerald-field-2:#1d3d72; --emerald-glass:rgba(111,216,255,.1); --emerald-line:rgba(154,220,255,.24); --emerald-line-hard:rgba(178,235,255,.58); --emerald-text:#effbff; --emerald-soft:#bdeeff; --emerald-muted:#82b9d6; --emerald-lime:#6fd8ff; --emerald-mint:#b488ff; --emerald-ocean:#8ff0ff; --emerald-gold:#e5f6ff; --emerald-coral:#b488ff; --emerald-shadow:rgba(4,12,22,.76);
  --bg:var(--emerald-night); --panel:var(--emerald-panel); --field:var(--emerald-field); --field-border:var(--emerald-line-hard); --text:var(--emerald-text); --muted:var(--emerald-muted); --muted2:#6b98b8; --line-soft:var(--emerald-line);
  background: radial-gradient(circle at 14% 12%, rgba(111,216,255,.24), transparent 28rem), radial-gradient(circle at 88% 8%, rgba(180,136,255,.22), transparent 32rem), linear-gradient(155deg,#03080f 0%,#071527 34%,#142c5a 72%,#040b14 100%) !important; color:#effbff!important; scrollbar-color:rgba(111,216,255,.68) rgba(4,12,22,.94);
}
body[data-edition-theme="crystal"]::before { background: radial-gradient(circle at 32% 24%, rgba(180,136,255,.16), transparent 18rem) !important; }
body[data-edition-theme="crystal"] .top-shell { background: linear-gradient(180deg, rgba(7,17,31,.98), rgba(18,45,84,.94)), radial-gradient(circle at 6% 12%, rgba(111,216,255,.24), transparent 20rem), linear-gradient(90deg, rgba(222,250,255,.1), transparent 36%, rgba(180,136,255,.12)) !important; border-bottom-color: rgba(154,220,255,.34) !important; }
body[data-edition-theme="crystal"] .player-card { background: linear-gradient(135deg,rgba(255,255,255,.1),transparent 34%), radial-gradient(circle at 12% 15%,rgba(111,216,255,.2),transparent 34%), linear-gradient(180deg,rgba(31,70,121,.9),rgba(7,18,36,.92)) !important; }
body[data-edition-theme="crystal"] .emerald-logo, body[data-edition-theme="crystal"] .player-card, body[data-edition-theme="crystal"] .challenge-player-header, body[data-edition-theme="crystal"] .game-navigation, body[data-edition-theme="crystal"] .boss-card, body[data-edition-theme="crystal"] .empty, body[data-edition-theme="crystal"] .room-chip, body[data-edition-theme="crystal"] .lua-download-control, body[data-edition-theme="crystal"] .challenge-count-control { border-color: rgba(154,220,255,.24) !important; }
body[data-edition-theme="crystal"] .mode-tabs button, body[data-edition-theme="crystal"] .main-tabs button, body[data-edition-theme="crystal"] .sub-tabs button, body[data-edition-theme="crystal"] .room-mini-button, body[data-edition-theme="crystal"] .rom-download-button, body[data-edition-theme="crystal"] .randomizer-settings-upload-button, body[data-edition-theme="crystal"] .lua-download-button, body[data-edition-theme="crystal"] .challenge-count-button, body[data-edition-theme="crystal"] .reset-button, body[data-edition-theme="crystal"] #searchInput, body[data-edition-theme="crystal"] .randomizer-settings-select, body[data-edition-theme="crystal"] .lua-player-select, body[data-edition-theme="crystal"] .route-input, body[data-edition-theme="crystal"] .status-select { border-color: rgba(154,220,255,.26)!important; background: linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.025)), rgba(7,18,36,.88)!important; color:#effbff!important; }
body[data-edition-theme="crystal"] .mode-tabs button.active, body[data-edition-theme="crystal"] .main-tabs button.active, body[data-edition-theme="crystal"] .sub-tabs button.active, body[data-edition-theme="crystal"] .rom-download-button, body[data-edition-theme="crystal"] .challenge-count-button.is-active { border-color: rgba(222,250,255,.88)!important; background: linear-gradient(180deg,rgba(222,250,255,.96),rgba(111,216,255,.88))!important; color:#06111a!important; box-shadow:0 0 24px rgba(111,216,255,.28),0 1px 0 rgba(255,255,255,.4) inset!important; }
body[data-edition-theme="crystal"] .game-navigation, body[data-edition-theme="crystal"] .boss-card { background: radial-gradient(circle at 10% 15%,rgba(111,216,255,.14),transparent 14rem), radial-gradient(circle at 98% 0%,rgba(180,136,255,.13),transparent 18rem), linear-gradient(135deg,rgba(255,255,255,.07),rgba(255,255,255,.02)), rgba(7,18,36,.76)!important; }
body[data-edition-theme="crystal"] .challenge-player-header { background: linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.025)), rgba(19,45,84,.82)!important; }
body[data-edition-theme="crystal"] .location-cell, body[data-edition-theme="crystal"] .boss-title, body[data-edition-theme="crystal"] .challenge-player-header strong { color:#effbff!important; }
body[data-edition-theme="crystal"] .challenge-player-header span, body[data-edition-theme="crystal"] .boss-inline-value, body[data-edition-theme="crystal"] .continue span { color:#8ff0ff!important; text-shadow:0 0 13px rgba(111,216,255,.24)!important; }
body[data-edition-theme="crystal"] .boss-location, body[data-edition-theme="crystal"] #searchInput::placeholder { color:rgba(189,238,255,.66)!important; }
body[data-edition-theme="crystal"] .hoenn-map-panel { border-color: rgba(154,220,255,.34)!important; background: linear-gradient(180deg,rgba(8,21,41,.98),rgba(3,9,18,.98)), rgba(3,9,18,.98)!important; max-width:min(1240px,calc(100vw - 2rem)); box-shadow:0 38px 84px rgba(0,0,0,.58),0 0 30px rgba(111,216,255,.14)!important; }
body[data-edition-theme="crystal"] .hoenn-map-stage, body[data-edition-theme="crystal"] .hoenn-map-image { max-width:min(100%,1180px); }
html[data-edition-theme="crystal"]::-webkit-scrollbar, html[data-edition-theme="crystal"] *::-webkit-scrollbar, body[data-edition-theme="crystal"]::-webkit-scrollbar, body[data-edition-theme="crystal"] *::-webkit-scrollbar { width:12px; height:12px; }
html[data-edition-theme="crystal"]::-webkit-scrollbar-track, html[data-edition-theme="crystal"] *::-webkit-scrollbar-track, body[data-edition-theme="crystal"]::-webkit-scrollbar-track, body[data-edition-theme="crystal"] *::-webkit-scrollbar-track { background:rgba(4,12,22,.94); }
html[data-edition-theme="crystal"]::-webkit-scrollbar-thumb, html[data-edition-theme="crystal"] *::-webkit-scrollbar-thumb, body[data-edition-theme="crystal"]::-webkit-scrollbar-thumb, body[data-edition-theme="crystal"] *::-webkit-scrollbar-thumb { background:linear-gradient(180deg,rgba(229,246,255,.88),rgba(111,216,255,.92)); border:2px solid rgba(4,12,22,.94); border-radius:999px; }


/* Crystal V1.1 purple correction */
body[data-edition-theme="crystal"] {
  --emerald-ink: #12061f;
  --emerald-night: #0c0417;
  --emerald-deep: #261047;
  --emerald-panel: rgba(42, 18, 82, 0.94);
  --emerald-panel-2: rgba(74, 34, 126, 0.90);
  --emerald-field: #120821;
  --emerald-field-2: #3a1d68;
  --emerald-glass: rgba(190, 135, 255, 0.11);
  --emerald-line: rgba(191, 147, 255, 0.30);
  --emerald-line-hard: rgba(226, 205, 255, 0.62);
  --emerald-text: #fbf5ff;
  --emerald-soft: #dec6ff;
  --emerald-muted: #b18adf;
  --emerald-lime: #c989ff;
  --emerald-mint: #76e5ff;
  --emerald-ocean: #9eeaff;
  --emerald-gold: #f4e7ff;
  --emerald-coral: #ff8fe6;
  --emerald-shadow: rgba(8, 3, 18, 0.80);
  --bg: var(--emerald-night);
  --panel: var(--emerald-panel);
  --field: var(--emerald-field);
  --field-border: var(--emerald-line-hard);
  --text: var(--emerald-text);
  --muted: var(--emerald-muted);
  --muted2: #886ab0;
  --line-soft: var(--emerald-line);
  background:
    radial-gradient(circle at 14% 12%, rgba(201, 137, 255, 0.28), transparent 28rem),
    radial-gradient(circle at 88% 8%, rgba(118, 229, 255, 0.17), transparent 32rem),
    radial-gradient(circle at 56% 92%, rgba(255, 143, 230, 0.12), transparent 25rem),
    linear-gradient(155deg, #04010a 0%, #120621 35%, #351463 72%, #080214 100%) !important;
  color: #fbf5ff !important;
  scrollbar-color: rgba(201, 137, 255, 0.72) rgba(12, 4, 23, 0.94) !important;
}
body[data-edition-theme="crystal"]::before {
  background:
    radial-gradient(circle at 32% 24%, rgba(118, 229, 255, 0.14), transparent 18rem),
    radial-gradient(circle at 74% 44%, rgba(201, 137, 255, 0.18), transparent 22rem) !important;
}
body[data-edition-theme="crystal"] .top-shell {
  background:
    linear-gradient(180deg, rgba(18, 6, 31, 0.98), rgba(47, 18, 90, 0.94)),
    radial-gradient(circle at 6% 12%, rgba(201, 137, 255, 0.24), transparent 20rem),
    linear-gradient(90deg, rgba(244, 231, 255, 0.10), transparent 36%, rgba(118, 229, 255, 0.10)) !important;
  border-bottom-color: rgba(191, 147, 255, 0.38) !important;
}
body[data-edition-theme="crystal"] .top-shell::before {
  border-color: rgba(191, 147, 255, 0.26) !important;
  background: linear-gradient(135deg, rgba(255,255,255,.06), transparent 30%, rgba(201,137,255,.11)) !important;
}
body[data-edition-theme="crystal"] .emerald-logo,
body[data-edition-theme="crystal"] .player-card,
body[data-edition-theme="crystal"] .challenge-player-header,
body[data-edition-theme="crystal"] .game-navigation,
body[data-edition-theme="crystal"] .boss-card,
body[data-edition-theme="crystal"] .empty,
body[data-edition-theme="crystal"] .room-chip,
body[data-edition-theme="crystal"] .lua-download-control,
body[data-edition-theme="crystal"] .challenge-count-control {
  border-color: rgba(191, 147, 255, 0.30) !important;
}
body[data-edition-theme="crystal"] .player-card {
  background:
    linear-gradient(135deg, rgba(255,255,255,.10), transparent 34%),
    radial-gradient(circle at 12% 15%, rgba(201, 137, 255, .24), transparent 34%),
    linear-gradient(180deg, rgba(48, 23, 90, .92), rgba(16, 8, 32, .94)) !important;
}
body[data-edition-theme="crystal"] .game-navigation,
body[data-edition-theme="crystal"] .boss-card {
  background:
    radial-gradient(circle at 10% 15%, rgba(201,137,255,.18), transparent 14rem),
    radial-gradient(circle at 98% 0%, rgba(118,229,255,.11), transparent 18rem),
    linear-gradient(135deg, rgba(255,255,255,.070), rgba(255,255,255,.020)),
    rgba(18, 8, 33, .80) !important;
}
body[data-edition-theme="crystal"] .challenge-player-header {
  background:
    linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.025)),
    rgba(42, 18, 82, .86) !important;
}
body[data-edition-theme="crystal"] .mode-tabs button,
body[data-edition-theme="crystal"] .main-tabs button,
body[data-edition-theme="crystal"] .sub-tabs button,
body[data-edition-theme="crystal"] .room-mini-button,
body[data-edition-theme="crystal"] .rom-download-button,
body[data-edition-theme="crystal"] .randomizer-settings-upload-button,
body[data-edition-theme="crystal"] .lua-download-button,
body[data-edition-theme="crystal"] .challenge-count-button,
body[data-edition-theme="crystal"] .reset-button,
body[data-edition-theme="crystal"] #searchInput,
body[data-edition-theme="crystal"] .randomizer-settings-select,
body[data-edition-theme="crystal"] .lua-player-select,
body[data-edition-theme="crystal"] .route-input,
body[data-edition-theme="crystal"] .status-select {
  border-color: rgba(191,147,255,.30) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.025)), rgba(16, 8, 32, .90) !important;
  color: #fbf5ff !important;
}
body[data-edition-theme="crystal"] .mode-tabs button.active,
body[data-edition-theme="crystal"] .main-tabs button.active,
body[data-edition-theme="crystal"] .sub-tabs button.active,
body[data-edition-theme="crystal"] .rom-download-button,
body[data-edition-theme="crystal"] .challenge-count-button.is-active {
  border-color: rgba(244,231,255,.92) !important;
  background: linear-gradient(180deg, rgba(244,231,255,.96), rgba(201,137,255,.90)) !important;
  color: #12061f !important;
  box-shadow: 0 0 24px rgba(201,137,255,.32), 0 1px 0 rgba(255,255,255,.40) inset !important;
}
body[data-edition-theme="crystal"] .boss-inline-stat,
body[data-edition-theme="crystal"] .boss-hm,
body[data-edition-theme="crystal"] .room-chip,
body[data-edition-theme="crystal"] .lua-download-control,
body[data-edition-theme="crystal"] .challenge-count-control {
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03)), rgba(25, 12, 48, .82) !important;
  color: #dec6ff !important;
}
body[data-edition-theme="crystal"] .challenge-player-header span,
body[data-edition-theme="crystal"] .boss-inline-value,
body[data-edition-theme="crystal"] .continue span {
  color: #d9b6ff !important;
  text-shadow: 0 0 13px rgba(201,137,255,.30) !important;
}
body[data-edition-theme="crystal"] .hoenn-map-panel {
  border-color: rgba(191, 147, 255, .40) !important;
  background: linear-gradient(180deg, rgba(22, 9, 43, .98), rgba(7, 2, 16, .98)), rgba(7, 2, 16, .98) !important;
  box-shadow: 0 38px 84px rgba(0,0,0,.60), 0 0 30px rgba(201,137,255,.18) !important;
}
html[data-edition-theme="crystal"]::-webkit-scrollbar-thumb,
html[data-edition-theme="crystal"] *::-webkit-scrollbar-thumb,
body[data-edition-theme="crystal"]::-webkit-scrollbar-thumb,
body[data-edition-theme="crystal"] *::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(244,231,255,.90), rgba(201,137,255,.94)) !important;
  border: 2px solid rgba(12,4,23,.94) !important;
  border-radius: 999px !important;
}


/* =========================================================
   Crystal V1.2 Theme/Scrollbar Safe Fix
   - Smaragd bleibt immer grün
   - Kristall wird klar lila/violett
   - Scrollbar folgt der aktuell aktiven Edition
   ========================================================= */

/* Smaragd/Default immer grün halten */
html[data-edition-theme="emerald"],
body[data-edition-theme="emerald"],
html:not([data-edition-theme]),
body:not([data-edition-theme]) {
  scrollbar-color: rgba(126, 255, 121, 0.72) rgba(7, 22, 17, 0.94) !important;
}

html[data-edition-theme="emerald"]::-webkit-scrollbar,
html[data-edition-theme="emerald"] *::-webkit-scrollbar,
body[data-edition-theme="emerald"]::-webkit-scrollbar,
body[data-edition-theme="emerald"] *::-webkit-scrollbar,
html:not([data-edition-theme])::-webkit-scrollbar,
body:not([data-edition-theme])::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

html[data-edition-theme="emerald"]::-webkit-scrollbar-track,
html[data-edition-theme="emerald"] *::-webkit-scrollbar-track,
body[data-edition-theme="emerald"]::-webkit-scrollbar-track,
body[data-edition-theme="emerald"] *::-webkit-scrollbar-track,
html:not([data-edition-theme])::-webkit-scrollbar-track,
body:not([data-edition-theme])::-webkit-scrollbar-track {
  background: rgba(7, 22, 17, 0.94) !important;
}

html[data-edition-theme="emerald"]::-webkit-scrollbar-thumb,
html[data-edition-theme="emerald"] *::-webkit-scrollbar-thumb,
body[data-edition-theme="emerald"]::-webkit-scrollbar-thumb,
body[data-edition-theme="emerald"] *::-webkit-scrollbar-thumb,
html:not([data-edition-theme])::-webkit-scrollbar-thumb,
body:not([data-edition-theme])::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(184, 255, 126, 0.94), rgba(46, 234, 155, 0.94)) !important;
  border: 2px solid rgba(7, 22, 17, 0.94) !important;
  border-radius: 999px !important;
}

/* Kristall Startscreen-Kachel deutlich lila */
.edition-option.is-available-edition[data-room-edition="crystal"] {
  border-color: rgba(207, 155, 255, 0.84) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(230, 206, 255, 0.24), transparent 50%),
    linear-gradient(180deg, rgba(62, 23, 118, 0.92), rgba(20, 8, 45, 0.92)) !important;
  box-shadow:
    0 0 22px rgba(186, 109, 255, 0.24),
    0 0 16px rgba(125, 55, 214, 0.14),
    0 1px 0 rgba(255, 255, 255, 0.14) inset !important;
}

.edition-option.is-available-edition[data-room-edition="crystal"]:hover,
.edition-option.is-available-edition[data-room-edition="crystal"].is-selected {
  border-color: rgba(240, 218, 255, 0.98) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(236, 211, 255, 0.38), transparent 48%),
    linear-gradient(180deg, rgba(97, 40, 168, 0.98), rgba(34, 13, 76, 0.96)) !important;
  box-shadow:
    0 0 30px rgba(205, 139, 255, 0.34),
    0 0 20px rgba(132, 80, 255, 0.20),
    0 1px 0 rgba(255, 255, 255, 0.18) inset !important;
}

.edition-option.is-available-edition[data-room-edition="crystal"] em.is-live,
.edition-option[data-room-edition="crystal"] em.is-live {
  border-color: rgba(235, 210, 255, 0.72) !important;
  background: rgba(198, 130, 255, 0.22) !important;
  color: #f8edff !important;
}

/* Kristall-Seite: kein Blau mehr als Hauptfarbe, sondern lila/violett */
body[data-edition-theme="crystal"] {
  --emerald-ink: #14051f !important;
  --emerald-night: #0b0314 !important;
  --emerald-deep: #281046 !important;
  --emerald-panel: rgba(46, 17, 82, 0.95) !important;
  --emerald-panel-2: rgba(78, 30, 126, 0.91) !important;
  --emerald-field: #130721 !important;
  --emerald-field-2: #43206e !important;
  --emerald-glass: rgba(202, 142, 255, 0.12) !important;
  --emerald-line: rgba(205, 153, 255, 0.32) !important;
  --emerald-line-hard: rgba(236, 216, 255, 0.66) !important;
  --emerald-text: #fff7ff !important;
  --emerald-soft: #e5caff !important;
  --emerald-muted: #ba8ee6 !important;
  --emerald-lime: #d18cff !important;
  --emerald-mint: #a070ff !important;
  --emerald-ocean: #c985ff !important;
  --emerald-gold: #f5e8ff !important;
  --emerald-coral: #ff98e6 !important;
  --emerald-shadow: rgba(9, 2, 18, 0.82) !important;

  --bg: var(--emerald-night) !important;
  --panel: var(--emerald-panel) !important;
  --field: var(--emerald-field) !important;
  --field-border: var(--emerald-line-hard) !important;
  --text: var(--emerald-text) !important;
  --muted: var(--emerald-muted) !important;
  --muted2: #9367c6 !important;
  --line-soft: var(--emerald-line) !important;

  background:
    radial-gradient(circle at 13% 10%, rgba(205, 137, 255, 0.30), transparent 28rem),
    radial-gradient(circle at 86% 8%, rgba(132, 88, 255, 0.24), transparent 31rem),
    radial-gradient(circle at 58% 92%, rgba(255, 152, 230, 0.12), transparent 25rem),
    linear-gradient(155deg, #05020a 0%, #130523 35%, #32105b 72%, #080311 100%) !important;
  color: #fff7ff !important;
  scrollbar-color: rgba(205, 139, 255, 0.76) rgba(12, 4, 22, 0.96) !important;
}

body[data-edition-theme="crystal"]::before {
  background:
    radial-gradient(circle at 30% 26%, rgba(160, 112, 255, 0.18), transparent 18rem),
    radial-gradient(circle at 72% 45%, rgba(255, 152, 230, 0.12), transparent 22rem) !important;
}

body[data-edition-theme="crystal"] .page::before {
  background:
    radial-gradient(ellipse at 18% 100%, rgba(205, 139, 255, 0.18), transparent 42%),
    radial-gradient(ellipse at 88% 100%, rgba(255, 152, 230, 0.14), transparent 42%),
    linear-gradient(0deg, rgba(8, 2, 17, 0.96), transparent) !important;
}

body[data-edition-theme="crystal"] .top-shell {
  background:
    linear-gradient(180deg, rgba(17, 5, 31, 0.98), rgba(51, 18, 91, 0.95)),
    radial-gradient(circle at 6% 12%, rgba(205, 139, 255, 0.26), transparent 20rem),
    linear-gradient(90deg, rgba(255, 236, 255, 0.11), transparent 36%, rgba(132, 88, 255, 0.13)) !important;
  border-bottom-color: rgba(205, 153, 255, 0.38) !important;
}

body[data-edition-theme="crystal"] .top-shell::before {
  border-color: rgba(205, 153, 255, 0.25) !important;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.065), transparent 30%, rgba(132, 88, 255, 0.09)) !important;
}

body[data-edition-theme="crystal"] .emerald-logo,
body[data-edition-theme="crystal"] .player-card,
body[data-edition-theme="crystal"] .challenge-player-header,
body[data-edition-theme="crystal"] .game-navigation,
body[data-edition-theme="crystal"] .boss-card,
body[data-edition-theme="crystal"] .boss-inline-stat,
body[data-edition-theme="crystal"] .boss-hm,
body[data-edition-theme="crystal"] .empty,
body[data-edition-theme="crystal"] .room-chip,
body[data-edition-theme="crystal"] .lua-download-control,
body[data-edition-theme="crystal"] .challenge-count-control {
  border-color: rgba(205, 153, 255, 0.30) !important;
}

body[data-edition-theme="crystal"] .emerald-logo {
  background:
    radial-gradient(circle at 25% 20%, rgba(255, 236, 255, 0.25), transparent 42%),
    linear-gradient(145deg, rgba(76, 30, 126, 0.95), rgba(22, 8, 48, 0.90)) !important;
  box-shadow:
    0 14px 28px rgba(0, 0, 0, 0.42),
    0 0 24px rgba(205, 139, 255, 0.20),
    0 1px 0 rgba(255, 255, 255, 0.16) inset !important;
}

body[data-edition-theme="crystal"] .player-card {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.10), transparent 34%),
    radial-gradient(circle at 12% 15%, rgba(205, 139, 255, 0.22), transparent 34%),
    linear-gradient(180deg, rgba(60, 24, 108, 0.92), rgba(16, 6, 36, 0.94)) !important;
}

body[data-edition-theme="crystal"] .game-navigation,
body[data-edition-theme="crystal"] .boss-card {
  background:
    radial-gradient(circle at 10% 15%, rgba(205, 139, 255, 0.16), transparent 14rem),
    radial-gradient(circle at 98% 0%, rgba(132, 88, 255, 0.15), transparent 18rem),
    linear-gradient(135deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.020)),
    rgba(17, 6, 35, 0.79) !important;
}

body[data-edition-theme="crystal"] .challenge-player-header {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.025)),
    rgba(47, 18, 86, 0.84) !important;
}

body[data-edition-theme="crystal"] .mode-tabs button,
body[data-edition-theme="crystal"] .main-tabs button,
body[data-edition-theme="crystal"] .sub-tabs button,
body[data-edition-theme="crystal"] .room-mini-button,
body[data-edition-theme="crystal"] .rom-download-button,
body[data-edition-theme="crystal"] .randomizer-settings-upload-button,
body[data-edition-theme="crystal"] .lua-download-button,
body[data-edition-theme="crystal"] .challenge-count-button,
body[data-edition-theme="crystal"] .reset-button,
body[data-edition-theme="crystal"] #searchInput,
body[data-edition-theme="crystal"] .randomizer-settings-select,
body[data-edition-theme="crystal"] .lua-player-select,
body[data-edition-theme="crystal"] .route-input,
body[data-edition-theme="crystal"] .status-select {
  border-color: rgba(205, 153, 255, 0.30) !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.025)),
    rgba(18, 7, 36, 0.90) !important;
  color: #fff7ff !important;
}

body[data-edition-theme="crystal"] .mode-tabs button.active,
body[data-edition-theme="crystal"] .main-tabs button.active,
body[data-edition-theme="crystal"] .sub-tabs button.active,
body[data-edition-theme="crystal"] .rom-download-button,
body[data-edition-theme="crystal"] .challenge-count-button.is-active {
  border-color: rgba(245, 232, 255, 0.90) !important;
  background:
    linear-gradient(180deg, rgba(246, 229, 255, 0.98), rgba(205, 139, 255, 0.90)) !important;
  color: #160723 !important;
  box-shadow:
    0 0 24px rgba(205, 139, 255, 0.30),
    0 1px 0 rgba(255, 255, 255, 0.42) inset !important;
}

body[data-edition-theme="crystal"] .location-cell,
body[data-edition-theme="crystal"] .boss-title,
body[data-edition-theme="crystal"] .challenge-player-header strong {
  color: #fff7ff !important;
}

body[data-edition-theme="crystal"] .challenge-player-header span,
body[data-edition-theme="crystal"] .boss-inline-value,
body[data-edition-theme="crystal"] .continue span {
  color: #f0d2ff !important;
  text-shadow: 0 0 14px rgba(205, 139, 255, 0.28) !important;
}

body[data-edition-theme="crystal"] .boss-location,
body[data-edition-theme="crystal"] #searchInput::placeholder {
  color: rgba(229, 202, 255, 0.68) !important;
}

/* Scrollbar folgt der aktuellen Edition */
html[data-edition-theme="crystal"],
body[data-edition-theme="crystal"],
html[data-edition-theme="crystal"] *,
body[data-edition-theme="crystal"] * {
  scrollbar-color: rgba(205, 139, 255, 0.76) rgba(12, 4, 22, 0.96) !important;
}

html[data-edition-theme="crystal"]::-webkit-scrollbar,
html[data-edition-theme="crystal"] *::-webkit-scrollbar,
body[data-edition-theme="crystal"]::-webkit-scrollbar,
body[data-edition-theme="crystal"] *::-webkit-scrollbar {
  width: 12px !important;
  height: 12px !important;
}

html[data-edition-theme="crystal"]::-webkit-scrollbar-track,
html[data-edition-theme="crystal"] *::-webkit-scrollbar-track,
body[data-edition-theme="crystal"]::-webkit-scrollbar-track,
body[data-edition-theme="crystal"] *::-webkit-scrollbar-track {
  background: rgba(12, 4, 22, 0.96) !important;
}

html[data-edition-theme="crystal"]::-webkit-scrollbar-thumb,
html[data-edition-theme="crystal"] *::-webkit-scrollbar-thumb,
body[data-edition-theme="crystal"]::-webkit-scrollbar-thumb,
body[data-edition-theme="crystal"] *::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(246, 229, 255, 0.92), rgba(205, 139, 255, 0.94)) !important;
  border: 2px solid rgba(12, 4, 22, 0.96) !important;
  border-radius: 999px !important;
}

/* Gelb und Feuerrot Scrollbar ebenfalls editionstreu halten */
html[data-edition-theme="yellow"],
body[data-edition-theme="yellow"],
html[data-edition-theme="yellow"] *,
body[data-edition-theme="yellow"] * {
  scrollbar-color: rgba(255, 232, 92, 0.70) rgba(28, 19, 1, 0.94) !important;
}

html[data-edition-theme="firered"],
body[data-edition-theme="firered"],
html[data-edition-theme="firered"] *,
body[data-edition-theme="firered"] * {
  scrollbar-color: rgba(255, 138, 76, 0.72) rgba(35, 8, 4, 0.94) !important;
}


/* Abstand für Statusmeldungen im Startscreen. */
body.room-gate-open .room-gate-message {
  min-height: 18px;
  margin-top: 10px;
}


/* Zusätzliche Smaragd-Details; Grundfarben stehen im konsolidierten Block darunter. */
.edition-option[data-room-edition="emerald"]::before,
.edition-option.is-available-edition[data-room-edition="emerald"]::before {
  background:
    radial-gradient(circle at 50% 0%, rgba(126, 255, 121, 0.20), transparent 55%) !important;
}

.edition-option[data-room-edition="emerald"] em.is-live,
.edition-option.is-available-edition[data-room-edition="emerald"] em.is-live {
  border-color: rgba(184, 255, 126, 0.66) !important;
  background: rgba(126, 255, 121, 0.18) !important;
  color: #ecffe6 !important;
}

.edition-option[data-room-edition="emerald"] .edition-logo-image,
.edition-option.is-available-edition[data-room-edition="emerald"] .edition-logo-image,
.edition-option[data-room-edition="emerald"] img,
.edition-option.is-available-edition[data-room-edition="emerald"] img {
  filter:
    drop-shadow(0 6px 9px rgba(0, 0, 0, 0.34))
    drop-shadow(0 0 10px rgba(126, 255, 121, 0.16))
    saturate(1.06)
    contrast(1.04) !important;
}


/* =========================================================
   V10.12 Consolidated Startup + Crystal Hover Fix
   Baut auf V10.11 auf und hält diese Fixes zusammen:
   - Startscreen ohne rechten Scroller
   - "SPIELBAR"-Badges bleiben entfernt
   - "Gelb, Feuerrot und Kristall spielbar" bleibt entfernt
   - Smaragd-Kachel bleibt immer grün
   - Kristall-Hover/Active ist lila statt grün
   ========================================================= */

/* Startscreen / Room-Gate darf keinen Body-Scroller erzeugen */
html:has(body.room-gate-open),
body.room-gate-open {
  width: 100% !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
  overscroll-behavior: none !important;
}

body.room-gate-open .page {
  height: 100dvh !important;
  min-height: 100dvh !important;
  overflow: hidden !important;
}

body.room-gate-open .room-gate,
.room-gate:not([hidden]) {
  position: fixed !important;
  inset: 0 !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
  display: grid !important;
  place-items: center !important;
}

body.room-gate-open .room-gate-panel {
  max-height: calc(100dvh - 48px) !important;
  overflow: hidden !important;
}

/* Startscreen-Texte dauerhaft entfernen */
.edition-option em,
.edition-option em.is-live,
.edition-option .edition-status,
.edition-option .edition-badge,
.edition-option [data-edition-status] {
  display: none !important;
}

.edition-picker-head small {
  display: none !important;
}

/* Smaragd-Kachel immer grün halten, egal welches Theme aktiv ist */
.edition-option[data-room-edition="emerald"],
.edition-option.is-available-edition[data-room-edition="emerald"],
body[data-edition-theme] .edition-option[data-room-edition="emerald"],
body[data-edition-theme] .edition-option.is-available-edition[data-room-edition="emerald"] {
  --card-accent: #7eff79 !important;
  border-color: rgba(126, 255, 121, 0.78) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(126, 255, 121, 0.28), transparent 54%),
    linear-gradient(180deg, rgba(17, 78, 45, 0.86), rgba(5, 27, 19, 0.88)) !important;
  box-shadow:
    0 0 22px rgba(126, 255, 121, 0.20),
    0 1px 0 rgba(255, 255, 255, 0.13) inset !important;
}

.edition-option[data-room-edition="emerald"]:hover,
.edition-option[data-room-edition="emerald"].is-selected,
.edition-option.is-available-edition[data-room-edition="emerald"]:hover,
.edition-option.is-available-edition[data-room-edition="emerald"].is-selected,
body[data-edition-theme] .edition-option[data-room-edition="emerald"]:hover,
body[data-edition-theme] .edition-option[data-room-edition="emerald"].is-selected,
body[data-edition-theme] .edition-option.is-available-edition[data-room-edition="emerald"]:hover,
body[data-edition-theme] .edition-option.is-available-edition[data-room-edition="emerald"].is-selected {
  border-color: rgba(190, 255, 159, 0.98) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(184, 255, 126, 0.40), transparent 48%),
    linear-gradient(180deg, rgba(28, 118, 67, 0.98), rgba(7, 39, 25, 0.94)) !important;
  box-shadow:
    0 0 30px rgba(126, 255, 121, 0.32),
    0 0 18px rgba(46, 234, 155, 0.20),
    0 1px 0 rgba(255, 255, 255, 0.18) inset !important;
}

/* Kristall: Hover/Active/Focus der Spieler-Header lila statt grün */
body[data-edition-theme="crystal"] .challenge-player-header:hover,
body[data-edition-theme="crystal"] .challenge-player-header.is-active,
body[data-edition-theme="crystal"] .challenge-player-header:focus-visible {
  border-color: rgba(236, 214, 255, 0.88) !important;
  background:
    linear-gradient(135deg, rgba(255,255,255,.09), transparent 30%, rgba(201,137,255,.15)),
    radial-gradient(circle at 18% 18%, rgba(205,137,255,.18), transparent 42%),
    linear-gradient(180deg, rgba(66, 28, 122, .96), rgba(24, 9, 49, .97)) !important;
  box-shadow:
    0 0 0 1px rgba(226, 205, 255, 0.10) inset,
    0 10px 24px rgba(91, 34, 166, 0.20),
    0 0 20px rgba(201,137,255,.18) !important;
}

body[data-edition-theme="crystal"] .challenge-player-header:hover span,
body[data-edition-theme="crystal"] .challenge-player-header.is-active span,
body[data-edition-theme="crystal"] .challenge-player-header:focus-visible span {
  color: #edd9ff !important;
  text-shadow: 0 0 12px rgba(201,137,255,.34) !important;
}

body[data-edition-theme="crystal"] .challenge-player-header:hover strong,
body[data-edition-theme="crystal"] .challenge-player-header.is-active strong,
body[data-edition-theme="crystal"] .challenge-player-header:focus-visible strong {
  color: #fff8ff !important;
}

/* Kristall: zusätzliche grüne Hover-Reste in Buttons/Controls abfangen */
body[data-edition-theme="crystal"] .player-card:hover,
body[data-edition-theme="crystal"] .player-card.is-active,
body[data-edition-theme="crystal"] .room-mini-button:hover,
body[data-edition-theme="crystal"] .randomizer-settings-upload-button:hover,
body[data-edition-theme="crystal"] .lua-download-button:hover,
body[data-edition-theme="crystal"] .challenge-count-button:hover,
body[data-edition-theme="crystal"] .route-input:hover,
body[data-edition-theme="crystal"] .status-select:hover {
  border-color: rgba(210, 160, 255, 0.78) !important;
  box-shadow:
    0 0 0 1px rgba(201, 137, 255, 0.10),
    0 0 18px rgba(201, 137, 255, 0.16) !important;
}

body[data-edition-theme="crystal"] .player-card.is-online,
body[data-edition-theme="crystal"] .player-card.is-active.is-online {
  border-color: rgba(210, 160, 255, 0.82) !important;
}

body[data-edition-theme="crystal"] .player-live-dot,
body[data-edition-theme="crystal"] .room-status-dot {
  background: #c989ff !important;
  box-shadow: 0 0 11px rgba(201, 137, 255, 0.62) !important;
}


/* =========================================================
   V10.13 Startscreen Logo Equal Size Fix
   - alle Edition-Logos bekommen denselben Logo-Rahmen
   - Logos bleiben mittig und werden nicht verzerrt
   ========================================================= */

.edition-option {
  grid-template-rows: 1fr auto !important;
  align-items: center !important;
  justify-items: center !important;
}

.edition-option .edition-logo,
.edition-logo {
  display: block !important;
  width: 138px !important;
  height: 58px !important;
  max-width: 138px !important;
  max-height: 58px !important;
  min-width: 138px !important;
  min-height: 58px !important;
  object-fit: contain !important;
  object-position: center center !important;
  margin: 0 auto !important;
}

.edition-logo-emerald,
.edition-logo-yellow,
.edition-logo-crystal,
.edition-logo-firered {
  width: 138px !important;
  height: 58px !important;
  max-width: 138px !important;
  max-height: 58px !important;
  min-width: 138px !important;
  min-height: 58px !important;
  object-fit: contain !important;
  object-position: center center !important;
  margin: 0 auto !important;
}

.edition-option span {
  width: 100%;
  text-align: center !important;
}


/* =========================================================
   V10.17 Startscreen Edition-Namen entfernen
   - entfernt die 4 Textlabels unter den Edition-Logos
   - Logos bleiben gleich groß und mittig
   - basiert auf V10.13, alte Fixes bleiben erhalten
   ========================================================= */

.edition-options .edition-option > span {
  display: none !important;
}

.edition-options .edition-option {
  grid-template-rows: 1fr !important;
  place-items: center !important;
  align-items: center !important;
  justify-items: center !important;
  padding: 10px 8px !important;
}

.edition-options .edition-option .edition-logo,
.edition-options .edition-logo {
  align-self: center !important;
  justify-self: center !important;
  margin: auto !important;
}


/* =========================================================
   V10.18 Guide-System Basis
   - neuer Guide-Button neben Map
   - Modal mit "Als Nächstes" und aufklappbaren Kapiteln
   ========================================================= */

.guide-button {
  margin-left: 8px !important;
}

.guide-modal {
  --guide-accent: #7eff79;
  --guide-accent-2: #ffe46b;
  --guide-panel: rgba(5, 24, 18, 0.97);
  --guide-card: rgba(10, 41, 29, 0.74);
  --guide-soft: rgba(126, 255, 121, 0.14);
}

body[data-edition-theme="yellow"] .guide-modal {
  --guide-accent: #ffe76a;
  --guide-accent-2: #7eff79;
  --guide-panel: rgba(34, 28, 4, 0.97);
  --guide-card: rgba(76, 58, 6, 0.72);
  --guide-soft: rgba(255, 231, 106, 0.16);
}

body[data-edition-theme="firered"] .guide-modal {
  --guide-accent: #ff6b52;
  --guide-accent-2: #ffd36d;
  --guide-panel: rgba(31, 8, 5, 0.97);
  --guide-card: rgba(75, 20, 13, 0.72);
  --guide-soft: rgba(255, 107, 82, 0.16);
}

body[data-edition-theme="crystal"] .guide-modal {
  --guide-accent: #c989ff;
  --guide-accent-2: #ffe46b;
  --guide-panel: rgba(22, 8, 45, 0.97);
  --guide-card: rgba(51, 20, 88, 0.72);
  --guide-soft: rgba(201, 137, 255, 0.18);
}

.guide-modal .hoenn-map-backdrop {
  background:
    radial-gradient(circle at 20% 15%, color-mix(in srgb, var(--guide-accent) 18%, transparent), transparent 34rem),
    rgba(0, 8, 6, 0.78) !important;
}

.guide-panel {
  width: min(1040px, calc(100vw - 44px)) !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.075), transparent 36%),
    var(--guide-panel) !important;
  border-color: color-mix(in srgb, var(--guide-accent) 46%, transparent) !important;
  box-shadow:
    0 28px 90px rgba(0, 0, 0, 0.60),
    0 0 30px color-mix(in srgb, var(--guide-accent) 16%, transparent),
    0 1px 0 rgba(255, 255, 255, 0.12) inset !important;
}

.guide-head {
  border-bottom-color: color-mix(in srgb, var(--guide-accent) 24%, transparent) !important;
}

.guide-head .hoenn-map-eyebrow,
.guide-section-eyebrow {
  color: var(--guide-accent-2) !important;
}

.guide-body {
  display: grid;
  gap: 18px;
  padding: 18px;
}

.guide-loading,
.guide-error,
.guide-complete-card,
.guide-next,
.guide-chapters {
  border: 1px solid color-mix(in srgb, var(--guide-accent) 24%, transparent);
  border-radius: 20px;
  background:
    radial-gradient(circle at 10% 0%, var(--guide-soft), transparent 22rem),
    linear-gradient(135deg, rgba(255,255,255,.07), rgba(255,255,255,.02)),
    var(--guide-card);
  color: #f4fff7;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.24);
}

.guide-loading,
.guide-error,
.guide-complete-card {
  padding: 20px;
}

.guide-next,
.guide-chapters {
  padding: 16px;
}

.guide-next-head,
.guide-chapters-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.guide-section-eyebrow {
  margin: 0 0 5px;
  font-family: var(--font-pixel, Arial, Helvetica, sans-serif);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.guide-next h3,
.guide-chapters h3,
.guide-complete-card h3,
.guide-error h3 {
  margin: 0;
  color: #f8fff9;
  font-size: clamp(20px, 2vw, 30px);
  line-height: 1.05;
}

.guide-progress-pill {
  flex: 0 0 auto;
  padding: 8px 11px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--guide-accent) 42%, transparent);
  background: color-mix(in srgb, var(--guide-accent) 14%, transparent);
  color: #f8fff9;
  font-weight: 950;
  font-size: 12px;
}

.guide-step {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: start;
  padding: 14px;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--guide-accent) 20%, transparent);
  background:
    linear-gradient(135deg, rgba(255,255,255,.06), transparent 40%),
    rgba(0, 0, 0, 0.16);
}

.guide-step + .guide-step {
  margin-top: 10px;
}

.guide-step.is-done {
  opacity: .68;
}

.guide-step-topline {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 7px;
}

.guide-step-number {
  display: inline-grid;
  place-items: center;
  min-width: 34px;
  height: 24px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--guide-accent-2), var(--guide-accent));
  color: #06120d;
  font-family: var(--font-pixel, Arial, Helvetica, sans-serif);
  font-size: 10px;
  font-weight: 950;
}

.guide-step-chapter {
  color: color-mix(in srgb, var(--guide-accent) 74%, white 26%);
  font-size: 12px;
  font-weight: 900;
}

.guide-step h4 {
  margin: 0 0 7px;
  color: #ffffff;
  font-size: 17px;
}

.guide-step-location,
.guide-step-goal,
.guide-step-note,
.guide-step-details {
  margin: 7px 0 0;
  color: rgba(244, 255, 247, 0.82);
  font-size: 13px;
  line-height: 1.45;
}

.guide-step-details {
  padding-left: 18px;
}

.guide-step-details li + li {
  margin-top: 4px;
}

.guide-done-button,
.guide-reset-button {
  min-height: 36px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--guide-accent) 44%, transparent);
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02)),
    rgba(0, 0, 0, 0.14);
  color: #f4fff7;
  font-weight: 950;
  padding: 0 13px;
  cursor: pointer;
  white-space: nowrap;
}

.guide-done-button:hover,
.guide-reset-button:hover {
  border-color: color-mix(in srgb, var(--guide-accent) 78%, white 10%);
  box-shadow: 0 0 18px color-mix(in srgb, var(--guide-accent) 18%, transparent);
}

.guide-done-button.is-done {
  background: linear-gradient(180deg, var(--guide-accent-2), var(--guide-accent));
  color: #06120d;
}

.guide-chapter {
  border: 1px solid color-mix(in srgb, var(--guide-accent) 18%, transparent);
  border-radius: 16px;
  overflow: hidden;
  background: rgba(0, 0, 0, 0.14);
}

.guide-chapter + .guide-chapter {
  margin-top: 10px;
}

.guide-chapter summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 15px;
  cursor: pointer;
  color: #ffffff;
  font-weight: 950;
  list-style: none;
}

.guide-chapter summary::-webkit-details-marker {
  display: none;
}

.guide-chapter summary::before {
  content: "▸";
  color: var(--guide-accent);
  margin-right: 3px;
}

.guide-chapter[open] summary::before {
  content: "▾";
}

.guide-chapter summary span {
  flex: 1 1 auto;
}

.guide-chapter summary small {
  color: color-mix(in srgb, var(--guide-accent) 74%, white 26%);
  font-weight: 950;
}

.guide-chapter-steps {
  padding: 0 12px 12px;
}

html.guide-modal-open,
body.guide-modal-open {
  overflow: hidden !important;
}

@media (max-width: 780px) {
  .guide-step,
  .guide-next-head,
  .guide-chapters-head {
    grid-template-columns: 1fr;
    display: grid;
  }

  .guide-done-button,
  .guide-reset-button {
    width: 100%;
  }
}


/* =========================================================
   V10.20 Safe Header + Guide Layout Fix
   - verhindert Überlappung von Map/Guide mit Room-Controls
   - speziell für 1920x1080 und ähnliche Desktop-Breiten
   ========================================================= */
@media (max-width: 1920px) and (min-width: 1251px) {
  .top-shell {
    grid-template-columns: var(--challenge-left-column) minmax(0, 1fr) max-content !important;
    grid-template-areas:
      "logo players players"
      "modes modes tools" !important;
  }

  .mode-tabs {
    min-width: 0 !important;
    width: 100% !important;
    padding-right: 10px !important;
    gap: 6px !important;
    overflow: hidden !important;
  }

  .mode-tabs button {
    padding-left: 12px !important;
    padding-right: 12px !important;
    font-size: 12px !important;
  }

  .header-tools {
    min-width: 0 !important;
    justify-content: flex-end !important;
    gap: 6px !important;
  }

  .room-control {
    flex: 0 1 auto !important;
    min-width: 0 !important;
    gap: 6px !important;
  }

  .room-chip {
    max-width: 210px !important;
  }

  .room-control-button,
  .room-mini-button {
    padding: 0 10px !important;
  }

  .header-tools .search,
  #searchInput {
    flex-basis: 130px !important;
    width: 130px !important;
    max-width: 130px !important;
  }

  .live-pill {
    min-width: 106px !important;
  }
}


/* =========================================================
   V10.21 Header Spacing Polish
   - Map/Guide und Raumsteuerung sauber getrennt
   - kein optisches Kleben/Überlappen bei 1920x1080
   - behält Guide-Modal-CSS aus V10.18
   ========================================================= */
@media (max-width: 1920px) and (min-width: 1251px) {
  .top-shell {
    --header-mode-zone: 408px;
    --header-toolbar-gap: 18px;
    grid-template-columns:
      var(--challenge-left-column)
      minmax(250px, calc(var(--header-mode-zone) - var(--challenge-left-column)))
      minmax(0, 1fr) !important;
    grid-template-areas:
      "logo players players"
      "modes modes tools" !important;
    column-gap: var(--header-toolbar-gap) !important;
  }

  .mode-tabs {
    width: 100% !important;
    max-width: var(--header-mode-zone) !important;
    justify-content: flex-start !important;
    padding-right: 0 !important;
    gap: 7px !important;
    overflow: visible !important;
  }

  .mode-tabs button {
    flex: 0 0 auto !important;
    height: 38px !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
    font-size: 12px !important;
    white-space: nowrap !important;
  }

  .guide-button {
    margin-left: 0 !important;
  }

  .header-tools {
    justify-self: stretch !important;
    width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    padding-left: 2px !important;
    justify-content: flex-end !important;
    gap: 6px !important;
    flex-wrap: nowrap !important;
    overflow: visible !important;
  }

  .room-control {
    flex: 0 1 245px !important;
    min-width: 0 !important;
    max-width: 245px !important;
    gap: 5px !important;
  }

  .room-chip {
    max-width: 155px !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
  }

  .room-chip .room-host-badge,
  .room-chip code {
    display: none !important;
  }

  .room-control-button,
  .room-mini-button {
    height: 32px !important;
    padding-left: 9px !important;
    padding-right: 9px !important;
    font-size: 10px !important;
  }

  .lua-download-control,
  .randomizer-settings-control,
  .tools-count-control {
    gap: 5px !important;
  }

  .lua-download-control span,
  .tools-count-control > span,
  .randomizer-settings-control label {
    font-size: 9px !important;
    letter-spacing: 0.04em !important;
  }

  .lua-player-select {
    max-width: 128px !important;
  }

  .randomizer-settings-select {
    max-width: 118px !important;
  }

  .randomizer-settings-upload-button {
    padding-left: 10px !important;
    padding-right: 10px !important;
    font-size: 10px !important;
  }

  .rom-download-button {
    min-width: 96px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .header-tools .search,
  #searchInput {
    flex: 0 1 120px !important;
    width: 120px !important;
    max-width: 120px !important;
  }

  .reset-button {
    padding-left: 11px !important;
    padding-right: 11px !important;
  }
}

@media (max-width: 1680px) and (min-width: 1251px) {
  .top-shell {
    --header-mode-zone: 390px;
    --header-toolbar-gap: 14px;
  }

  .mode-tabs button {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .room-control {
    flex-basis: 218px !important;
    max-width: 218px !important;
  }

  .room-chip {
    max-width: 132px !important;
  }

  .header-tools .search,
  #searchInput {
    flex-basis: 105px !important;
    width: 105px !important;
    max-width: 105px !important;
  }
}


/* =========================================================
   V10.27 Fixed four-player column rhythm
   ========================================================= */
@media (min-width: 851px) {
  .player-dashboard[data-player-count="1"],
  .player-dashboard[data-player-count="2"],
  .player-dashboard[data-player-count="3"] {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }

  .challenge-header-row.challenge-players-1,
  .challenge-row.route-row.challenge-players-1,
  .challenge-header-row.challenge-players-2,
  .challenge-row.route-row.challenge-players-2,
  .challenge-header-row.challenge-players-3,
  .challenge-row.route-row.challenge-players-3 {
    width: calc(
      var(--challenge-left-column) +
      var(--challenge-grid-gap) +
      var(--pt-player-track-width)
    ) !important;
    max-width: none !important;
    min-width: 0 !important;
    grid-template-columns:
      var(--challenge-left-column)
      repeat(4, minmax(0, 1fr)) !important;
    margin-inline: 0 !important;
  }
}

@media (min-width: 851px) and (max-width: 1499px) {
  html,
  body {
    max-width: 100%;
    overflow-x: clip;
  }

  .page {
    padding-top: 0 !important;
  }

  .top-shell {
    position: sticky !important;
    top: 0 !important;
    left: auto !important;
    right: auto !important;
    height: auto !important;
    min-height: 0 !important;
    grid-template-rows: auto auto !important;
    row-gap: 10px !important;
    transform: none !important;
    will-change: auto !important;
  }

  .mode-tabs,
  .header-tools {
    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    height: auto !important;
    min-height: 38px !important;
    max-width: none !important;
    align-self: start !important;
  }

  .mode-tabs {
    align-items: center !important;
    flex-wrap: wrap !important;
    overflow: visible !important;
  }

  .header-tools {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    overflow: visible !important;
  }

  .header-tools > * {
    max-width: 100%;
  }

  .header-tools .search,
  #searchInput {
    flex: 1 1 150px !important;
    width: auto !important;
    min-width: 140px !important;
    max-width: 240px !important;
  }

  .tracker-list {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    padding-bottom: 10px;
    overscroll-behavior-inline: contain;
  }

  .challenge-header-row.challenge-players-1,
  .challenge-header-row.challenge-players-2,
  .challenge-header-row.challenge-players-3,
  .challenge-header-row.challenge-players-4,
  .challenge-row.route-row.challenge-players-1,
  .challenge-row.route-row.challenge-players-2,
  .challenge-row.route-row.challenge-players-3,
  .challenge-row.route-row.challenge-players-4 {
    width: max(
      100%,
      calc(
        var(--challenge-left-column) +
        var(--challenge-grid-gap) +
        var(--challenge-grid-gap) +
        var(--challenge-grid-gap) +
        var(--challenge-grid-gap) +
        1080px
      )
    ) !important;
    max-width: none !important;
    min-width: calc(
      var(--challenge-left-column) +
      var(--challenge-grid-gap) +
      var(--challenge-grid-gap) +
      var(--challenge-grid-gap) +
      var(--challenge-grid-gap) +
      1080px
    ) !important;
    grid-template-columns:
      var(--challenge-left-column)
      repeat(4, minmax(270px, 1fr)) !important;
    margin-inline: 0 !important;
  }

  .challenge-row.route-row::before {
    inset-inline: 0 !important;
  }

  .top-shell {
    padding: 10px var(--page-side-padding) 12px !important;
  }

  .left-head {
    grid-area: logo !important;
  }

  .player-dashboard {
    grid-area: players !important;
  }

  .mode-tabs {
    grid-area: modes !important;
    width: 100% !important;
    justify-self: stretch !important;
    justify-content: flex-start !important;
  }

  .header-tools {
    grid-area: tools !important;
    width: 100% !important;
    justify-self: stretch !important;
  }
}

@media (min-width: 1250px) and (max-width: 1499px) {
  .top-shell {
    grid-template-columns:
      var(--challenge-left-column)
      235px
      minmax(0, 1fr) !important;
    grid-template-areas:
      "logo players players"
      "modes modes tools" !important;
    column-gap: 14px !important;
  }

  .header-tools {
    justify-content: flex-end !important;
  }
}

@media (min-width: 851px) and (max-width: 1249px) {
  .top-shell {
    grid-template-columns:
      var(--challenge-left-column)
      minmax(0, 1fr) !important;
    grid-template-rows: auto auto auto !important;
    grid-template-areas:
      "logo players"
      "modes modes"
      "tools tools" !important;
    column-gap: var(--challenge-grid-gap) !important;
  }

  .left-head {
    align-self: center !important;
  }

  .header-tools {
    justify-content: flex-start !important;
  }
}


/* =========================================================
   V10.28 Guide Collapse + Scroll Fix
   ========================================================= */
.guide-panel {
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  max-height: calc(100dvh - 28px) !important;
}

.guide-head {
  flex: 0 0 auto !important;
}

.guide-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  align-content: start;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

@supports not (height: 100dvh) {
  .guide-panel {
    max-height: calc(100vh - 28px) !important;
  }
}

/* =========================================================
   V10.30 Team Statistics + Type Advice
   ========================================================= */
.player-stats-modal[hidden] {
  display: none !important;
}

html.player-stats-open,
body.player-stats-open {
  width: 100% !important;
  height: 100dvh !important;
  overflow: hidden !important;
  overscroll-behavior: none !important;
}

.player-stats-modal {
  --stats-player: #7eff79;
  --stats-panel-bg: #071b16;
  --stats-surface: #0b251d;
  --stats-surface-strong: #0d2d23;
  --stats-border: rgba(176, 231, 209, 0.18);
  --stats-text: #f1fbf6;
  --stats-muted: #9eb8ad;
  position: fixed;
  inset: 0;
  z-index: 13500;
  display: grid;
  place-items: center;
  padding: 14px;
}

.player-stats-modal[data-player-index="1"] { --stats-player: #ffd964; }
.player-stats-modal[data-player-index="2"] { --stats-player: #44bde6; }
.player-stats-modal[data-player-index="3"] { --stats-player: #7eff79; }
.player-stats-modal[data-player-index="4"] { --stats-player: #ff93d1; }

body[data-edition-theme="yellow"] .player-stats-modal {
  --stats-panel-bg: #1d1908;
  --stats-surface: #29230a;
  --stats-surface-strong: #332b0b;
  --stats-border: rgba(255, 231, 106, 0.22);
}

body[data-edition-theme="firered"] .player-stats-modal {
  --stats-panel-bg: #210b08;
  --stats-surface: #32110d;
  --stats-surface-strong: #401711;
  --stats-border: rgba(255, 153, 119, 0.22);
}

body[data-edition-theme="crystal"] .player-stats-modal {
  --stats-panel-bg: #0b1628;
  --stats-surface: #10243a;
  --stats-surface-strong: #142e49;
  --stats-border: rgba(150, 216, 255, 0.22);
}

.player-stats-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 8, 7, 0.82);
  backdrop-filter: blur(4px);
}

.player-stats-panel {
  position: relative;
  width: min(1320px, calc(100vw - 28px));
  max-height: calc(100dvh - 28px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  color: var(--stats-text);
  background: var(--stats-panel-bg);
  border: 1px solid var(--stats-border);
  border-radius: 8px;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.58);
}

.player-stats-section-kicker,
.player-stats-pokemon-kicker {
  display: block;
  color: var(--stats-player);
  font-size: 11px;
  font-weight: 950;
  line-height: 1.2;
  text-transform: uppercase;
}

.player-stats-player-switch-slot,
.player-stats-content-slot {
  display: contents;
}

.player-stats-close {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 3;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  padding: 0;
  color: var(--stats-text);
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  touch-action: manipulation;
  user-select: none;
  border: 1px solid var(--stats-border);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.04);
}

.player-stats-close:hover,
.player-stats-close:focus-visible {
  color: #ffffff;
  border-color: var(--stats-player);
  background: color-mix(in srgb, var(--stats-player) 14%, transparent);
  outline: none;
}

.player-stats-playerbar {
  min-height: 58px;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 66px 8px 14px;
  border-bottom: 1px solid var(--stats-border);
  background: color-mix(in srgb, var(--stats-surface) 56%, var(--stats-panel-bg));
}

.player-stats-player-switch {
  min-width: 0;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(112px, 160px);
  gap: 5px;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-inline: contain;
}

.player-stats-player-option {
  --player-option-color: var(--stats-player);
  min-width: 0;
  height: 36px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) 7px;
  align-items: center;
  gap: 7px;
  padding: 0 10px;
  color: var(--stats-muted);
  text-align: left;
  cursor: pointer;
  border: 1px solid var(--stats-border);
  border-radius: 5px;
  background: rgba(0, 0, 0, 0.18);
}

.player-stats-player-option.player-color-1 { --player-option-color: #ffd964; }
.player-stats-player-option.player-color-2 { --player-option-color: #44bde6; }
.player-stats-player-option.player-color-3 { --player-option-color: #7eff79; }
.player-stats-player-option.player-color-4 { --player-option-color: #ff93d1; }

.player-stats-player-option > span:first-child {
  color: var(--player-option-color);
  font: 950 9px/1 var(--font-pixel, monospace);
}

.player-stats-player-option > strong {
  min-width: 0;
  overflow: hidden;
  color: var(--stats-text);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.player-stats-player-option:hover,
.player-stats-player-option:focus-visible,
.player-stats-player-option.is-selected {
  border-color: color-mix(in srgb, var(--player-option-color) 72%, var(--stats-border));
  background: color-mix(in srgb, var(--player-option-color) 12%, transparent);
  outline: none;
}

.player-stats-player-option.is-selected {
  box-shadow: inset 0 -2px 0 var(--player-option-color);
}

.player-stats-player-option:disabled {
  cursor: not-allowed;
  opacity: 0.42;
}

.player-stats-player-battle-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #78ef91;
  box-shadow: 0 0 8px rgba(120, 239, 145, 0.78);
}

.player-stats-body {
  flex: 1 1 auto;
  width: 100%;
  height: min(650px, calc(100dvh - 28px));
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(300px, 0.72fr) minmax(520px, 1.45fr);
  overflow: hidden;
  background: var(--stats-panel-bg);
}

.player-stats-roster {
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--stats-border);
  background: color-mix(in srgb, var(--stats-surface) 54%, var(--stats-panel-bg));
}

.player-stats-roster-head {
  flex: 0 0 auto;
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 14px;
  color: var(--stats-text);
  border-bottom: 1px solid var(--stats-border);
}

.player-stats-roster-head strong {
  font-size: 14px;
}

.player-stats-roster-head span {
  color: var(--stats-muted);
  font-size: 11px;
}

.player-stats-roster-list {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 7px;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.player-stats-roster-item {
  width: 100%;
  min-height: 82px;
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr) 64px;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  color: var(--stats-text);
  text-align: left;
  cursor: pointer;
  border: 1px solid transparent;
  border-bottom-color: var(--stats-border);
  border-radius: 5px;
  background: transparent;
}

.player-stats-roster-item:hover,
.player-stats-roster-item:focus-visible {
  border-color: color-mix(in srgb, var(--stats-player) 38%, var(--stats-border));
  background: rgba(255, 255, 255, 0.035);
  outline: none;
}

.player-stats-roster-item.is-selected {
  border-color: color-mix(in srgb, var(--stats-player) 64%, var(--stats-border));
  background: color-mix(in srgb, var(--stats-player) 11%, transparent);
  box-shadow: inset 3px 0 0 var(--stats-player);
}

.player-stats-roster-item.is-dead {
  opacity: 0.78;
}

.player-stats-roster-sprite {
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  overflow: hidden;
}

.player-stats-roster-sprite img {
  width: 58px;
  height: 58px;
  object-fit: contain;
  image-rendering: pixelated;
}

.player-stats-roster-item.is-dead .player-stats-roster-sprite img {
  filter: grayscale(1) brightness(0.72);
}

.player-stats-roster-placeholder,
.player-stats-detail-placeholder {
  color: var(--stats-muted);
  font-weight: 900;
}

.player-stats-roster-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.player-stats-roster-copy > strong,
.player-stats-roster-copy > small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.player-stats-roster-copy > strong {
  font-size: 14px;
}

.player-stats-roster-copy > small {
  color: var(--stats-muted);
  font-size: 10px;
}

.player-stats-roster-copy > small.player-stats-held-item {
  color: #ffe46b;
}

.player-stats-roster-types,
.player-stats-detail-types,
.player-stats-type-list {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
}

.player-stats-roster-state {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 5px;
  text-align: right;
}

.player-stats-roster-state > strong {
  color: #ffe46b;
  font-size: 12px;
}

.player-stats-roster-state > small {
  color: var(--stats-muted);
  font-size: 9px;
}

.player-stats-mini-hp {
  width: 56px;
  height: 4px;
  overflow: hidden;
  border-radius: 2px;
  background: rgba(255, 255, 255, 0.12);
}

.player-stats-mini-hp > span,
.player-stats-hp-track > span {
  display: block;
  height: 100%;
  background: #64e781;
  transition: width 180ms ease, background-color 180ms ease;
}

.player-stats-mini-hp.is-warning > span,
.player-stats-hp-track.is-warning > span {
  background: #f0c94d;
}

.player-stats-mini-hp.is-critical > span,
.player-stats-hp-track.is-critical > span {
  background: #ef5b52;
}

.player-stats-roster-empty {
  min-height: 150px;
  display: grid;
  place-items: center;
  color: var(--stats-muted);
  font-size: 12px;
  text-align: center;
}

.player-stats-detail {
  min-width: 0;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 20px 66px 26px 22px;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.player-stats-pokemon-head {
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  min-height: 144px;
}

.player-stats-detail-sprite {
  width: 132px;
  height: 132px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-right: 1px solid var(--stats-border);
}

.player-stats-detail-sprite img {
  width: 124px;
  height: 124px;
  object-fit: contain;
  image-rendering: pixelated;
}

.player-stats-detail-sprite.is-dead img {
  filter: grayscale(1) brightness(0.7);
}

.player-stats-pokemon-title {
  min-width: 0;
}

.player-stats-pokemon-title h3 {
  overflow-wrap: anywhere;
  margin: 5px 0 2px;
  color: var(--stats-text);
  font-size: 29px;
  line-height: 1.05;
}

.player-stats-pokemon-title p {
  margin: 0 0 9px;
  color: var(--stats-muted);
  font-size: 13px;
}

.player-stats-pokemon-vitals {
  align-self: start;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
  padding-top: 18px;
}

.player-stats-pokemon-vitals > strong {
  color: #ffe46b;
  font-size: 21px;
}

.player-stats-status {
  color: var(--stats-muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.player-stats-status.is-alive { color: #73ef8c; }
.player-stats-status.is-boxed { color: #75c9ee; }
.player-stats-status.is-dead { color: #ff8b83; }

.player-stats-hp {
  margin: 8px 0 18px;
}

.player-stats-hp > div {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 6px;
  color: var(--stats-muted);
  font-size: 11px;
}

.player-stats-hp > div strong {
  color: var(--stats-text);
}

.player-stats-hp-track {
  width: 100%;
  height: 8px;
  display: block;
  overflow: hidden;
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.11);
}

.player-stats-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
  border-top: 1px solid var(--stats-border);
  border-bottom: 1px solid var(--stats-border);
}

.player-stats-fact {
  min-width: 0;
  display: grid;
  grid-template-columns: 118px minmax(0, 1fr);
  gap: 10px;
  padding: 9px 8px;
  border-bottom: 1px solid color-mix(in srgb, var(--stats-border) 72%, transparent);
}

.player-stats-fact:nth-last-child(-n + 2) {
  border-bottom: 0;
}

.player-stats-fact dt,
.player-stats-fact dd {
  min-width: 0;
  margin: 0;
  font-size: 11px;
}

.player-stats-fact dt {
  color: var(--stats-muted);
  font-weight: 800;
}

.player-stats-fact dd {
  overflow-wrap: anywhere;
  color: var(--stats-text);
}

.player-stats-type-advice {
  margin-top: 22px;
}

.player-stats-advice-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 13px;
}

.player-stats-advice-head h3 {
  margin: 3px 0 0;
  color: var(--stats-text);
  font-size: 19px;
}

.player-stats-type-source {
  color: var(--stats-muted);
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
}

.player-stats-advice-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--stats-border);
  border-bottom: 1px solid var(--stats-border);
}

.player-stats-advice-group {
  min-width: 0;
  padding: 13px 14px 14px;
  border-right: 1px solid var(--stats-border);
}

.player-stats-advice-group:last-child {
  border-right: 0;
}

.player-stats-advice-group h4,
.player-stats-offense h4 {
  margin: 0 0 9px;
  color: var(--stats-muted);
  font-size: 11px;
  font-weight: 950;
  text-transform: uppercase;
}

.player-stats-advice-group.is-weak h4 { color: #ff9c92; }
.player-stats-advice-group.is-resistant h4 { color: #7ce997; }
.player-stats-advice-group.is-immune h4 { color: #8ed9f4; }

.player-stats-advice-empty,
.player-stats-advice-unavailable {
  color: var(--stats-muted);
  font-size: 11px;
}

.player-stats-advice-unavailable {
  padding: 20px 0;
  border-top: 1px solid var(--stats-border);
}

.player-stats-offense {
  padding-top: 16px;
}

.player-stats-offense-row {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(75px, auto) 16px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  padding: 7px 0;
  border-top: 1px solid color-mix(in srgb, var(--stats-border) 68%, transparent);
}

.player-stats-offense-row:last-child {
  border-bottom: 1px solid color-mix(in srgb, var(--stats-border) 68%, transparent);
}

.player-stats-offense-source {
  display: flex;
}

.player-stats-offense-arrow {
  color: var(--stats-muted);
  font-size: 18px;
  text-align: center;
}

.player-stats-type {
  min-height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 3px 7px;
  color: #ffffff;
  font-size: 9px;
  font-weight: 950;
  line-height: 1.2;
  text-transform: uppercase;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 3px;
  background: #58655f;
}

.player-stats-type strong {
  color: #ffffff;
  font-size: 9px;
}

.player-stats-type.is-critical {
  box-shadow: 0 0 0 2px rgba(255, 74, 65, 0.32);
}

.player-stats-type.type-normal { background: #69716f; }
.player-stats-type.type-fighting { background: #a93e36; }
.player-stats-type.type-flying { background: #577cc5; }
.player-stats-type.type-poison { background: #8d479d; }
.player-stats-type.type-ground { background: #9a7337; }
.player-stats-type.type-rock { background: #7e713d; }
.player-stats-type.type-bug { background: #718b2c; }
.player-stats-type.type-ghost { background: #5d4c88; }
.player-stats-type.type-steel { background: #607b83; }
.player-stats-type.type-fire { background: #c95037; }
.player-stats-type.type-water { background: #3578b9; }
.player-stats-type.type-grass { background: #398a4b; }
.player-stats-type.type-electric { color: #221e02; background: #e1be32; }
.player-stats-type.type-electric strong { color: #221e02; }
.player-stats-type.type-psychic { background: #b94376; }
.player-stats-type.type-ice { color: #08222a; background: #73c6d2; }
.player-stats-type.type-ice strong { color: #08222a; }
.player-stats-type.type-dragon { background: #5151aa; }
.player-stats-type.type-dark { background: #3f4149; }
.player-stats-type.is-unknown { color: var(--stats-muted); background: rgba(255, 255, 255, 0.05); }

.player-stats-detail-empty {
  min-height: 360px;
  display: grid;
  place-content: center;
  gap: 5px;
  color: var(--stats-muted);
  text-align: center;
}

.player-stats-detail-empty strong {
  color: var(--stats-text);
  font-size: 16px;
}

.player-stats-detail-empty span {
  font-size: 11px;
}

@media (max-width: 980px) {
  .player-stats-panel {
    width: calc(100vw - 20px);
    max-height: calc(100dvh - 20px);
  }

  .player-stats-body {
    grid-template-columns: minmax(270px, 0.7fr) minmax(440px, 1.3fr);
  }

  .player-stats-detail {
    padding: 16px 62px 16px 16px;
  }

  .player-stats-pokemon-head {
    grid-template-columns: 102px minmax(0, 1fr) auto;
    gap: 12px;
    min-height: 112px;
  }

  .player-stats-detail-sprite {
    width: 102px;
    height: 102px;
  }

  .player-stats-detail-sprite img {
    width: 98px;
    height: 98px;
  }

  .player-stats-pokemon-title h3 {
    font-size: 23px;
  }

  .player-stats-facts {
    grid-template-columns: 1fr;
  }

  .player-stats-fact,
  .player-stats-fact:nth-last-child(-n + 2) {
    border-bottom: 1px solid color-mix(in srgb, var(--stats-border) 72%, transparent);
  }

  .player-stats-fact:last-child {
    border-bottom: 0;
  }
}

@media (max-width: 760px) {
  .player-stats-modal {
    padding: 8px;
  }

  .player-stats-playerbar {
    justify-content: flex-start;
    padding: 8px 58px 8px 8px;
  }

  .player-stats-player-switch {
    grid-auto-columns: minmax(104px, 138px);
  }

  .player-stats-panel {
    width: calc(100vw - 16px);
    max-height: calc(100dvh - 16px);
  }

  .player-stats-body {
    display: block;
    overflow-x: hidden;
    overflow-y: auto;
  }

  .player-stats-roster {
    max-height: 290px;
    border-right: 0;
    border-bottom: 1px solid var(--stats-border);
  }

  .player-stats-roster-list {
    min-height: 180px;
  }

  .player-stats-roster-head {
    padding-right: 62px;
  }

  .player-stats-detail {
    overflow: visible;
    padding: 16px;
  }

  .player-stats-advice-grid {
    grid-template-columns: 1fr;
  }

  .player-stats-advice-group,
  .player-stats-advice-group:last-child {
    border-right: 0;
    border-bottom: 1px solid var(--stats-border);
  }

  .player-stats-advice-group:last-child {
    border-bottom: 0;
  }
}

@supports not (height: 100dvh) {
  html.player-stats-open,
  body.player-stats-open {
    height: 100vh !important;
  }

  .player-stats-panel {
    max-height: calc(100vh - 28px);
  }

  .player-stats-body {
    height: min(650px, calc(100vh - 28px));
  }
}

/* =========================================================
   V10.31 Compact Header + Floating Map
   ========================================================= */
.mode-tabs {
  width: max-content !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 38px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0 !important;
  padding: 2px !important;
  overflow: hidden !important;
  border: 1px solid color-mix(in srgb, var(--edition-accent, #7eff79) 26%, transparent) !important;
  border-radius: 7px !important;
  background: color-mix(in srgb, var(--emerald-field, #112d27) 82%, #000 18%) !important;
  box-shadow: 0 5px 14px rgba(0, 0, 0, 0.18) !important;
}

body[data-edition-theme] .mode-tabs button {
  flex: 0 0 auto !important;
  height: 32px !important;
  min-height: 32px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 12px !important;
  color: var(--emerald-soft, #bee8c5) !important;
  font-size: 11px !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
  border: 0 !important;
  border-right: 1px solid color-mix(in srgb, var(--edition-accent, #7eff79) 15%, transparent) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

body[data-edition-theme] .mode-tabs button:first-child {
  border-radius: 4px 0 0 4px !important;
}

body[data-edition-theme] .mode-tabs button:last-child {
  border-right: 0 !important;
  border-radius: 0 4px 4px 0 !important;
}

body[data-edition-theme] .mode-tabs button:hover,
body[data-edition-theme] .mode-tabs button:focus-visible {
  color: #ffffff !important;
  background: color-mix(in srgb, var(--edition-accent, #7eff79) 10%, transparent) !important;
  outline: none !important;
}

body[data-edition-theme] .mode-tabs button.active,
body[data-edition-theme] .mode-tabs button.is-open {
  color: #071611 !important;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--edition-warm, #ffd964) 80%, white 20%),
    color-mix(in srgb, var(--edition-accent, #7eff79) 82%, var(--edition-accent-2, #2eea9b) 18%)
  ) !important;
  box-shadow: 0 0 16px color-mix(in srgb, var(--edition-accent, #7eff79) 22%, transparent) !important;
}

.header-tools {
  z-index: 9100 !important;
  overflow: visible !important;
}

.top-shell {
  overflow: visible !important;
}

.room-gate {
  z-index: 11000 !important;
}

.room-control {
  position: relative;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 190px !important;
  overflow: visible !important;
}

.room-play-timer[hidden] {
  display: none !important;
}

.room-play-timer {
  flex: 0 0 auto;
  height: 34px;
  display: grid;
  grid-template-columns: auto 58px;
  align-items: center;
  gap: 7px;
  padding: 0 10px;
  user-select: none;
  border: 1px solid color-mix(in srgb, var(--edition-accent, #7eff79) 24%, transparent);
  border-radius: 6px;
  background: color-mix(in srgb, var(--emerald-field, #112d27) 82%, #000 18%);
}

.room-play-timer > span {
  color: var(--edition-warm, #ffd964);
  font-size: 8px;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.room-play-timer time {
  color: var(--emerald-muted, #82b493);
  font: 900 10px/1 var(--font-pixel, monospace);
  font-variant-numeric: tabular-nums;
  text-align: right;
  letter-spacing: 0;
}

.room-play-timer.is-running time {
  color: var(--edition-accent, #7eff79);
}

.room-menu {
  position: relative;
  width: min(190px, 22vw);
  min-width: 132px;
}

.room-menu-trigger {
  width: 100%;
  height: 34px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px;
  padding: 0 10px;
  color: var(--emerald-text, #f3fff0);
  cursor: pointer;
  border: 1px solid color-mix(in srgb, var(--edition-accent, #7eff79) 30%, transparent);
  border-radius: 6px;
  background: color-mix(in srgb, var(--emerald-field, #112d27) 86%, #000 14%);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.17);
}

.room-menu-trigger > span:first-child {
  color: var(--edition-warm, #ffd964);
  font-size: 8px;
  font-weight: 950;
  text-transform: uppercase;
}

.room-menu-trigger strong {
  min-width: 0;
  overflow: hidden;
  color: inherit;
  font-size: 10px;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.room-menu-chevron {
  color: var(--emerald-muted, #82b493);
  font-size: 15px;
  line-height: 1;
  transition: transform 150ms ease;
}

.room-menu-trigger[aria-expanded="true"] {
  border-color: color-mix(in srgb, var(--edition-accent, #7eff79) 78%, white 8%);
  background: color-mix(in srgb, var(--emerald-field-2, #1c4d3a) 78%, #000 22%);
}

.room-menu-trigger[aria-expanded="true"] .room-menu-chevron {
  transform: rotate(180deg);
}

.room-menu-trigger:hover,
.room-menu-trigger:focus-visible {
  border-color: color-mix(in srgb, var(--edition-accent, #7eff79) 72%, white 8%);
  outline: none;
}

.room-menu-popover[hidden] {
  display: none !important;
}

.room-menu-popover {
  position: absolute;
  top: calc(100% + 7px);
  left: 0;
  z-index: 9400;
  width: 250px;
  overflow: hidden;
  padding: 6px;
  border: 1px solid color-mix(in srgb, var(--edition-accent, #7eff79) 32%, transparent);
  border-radius: 7px;
  background: color-mix(in srgb, var(--emerald-night, #0b1c18) 94%, #000 6%);
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.48);
}

.room-menu-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 9px 9px;
  border-bottom: 1px solid color-mix(in srgb, var(--edition-accent, #7eff79) 16%, transparent);
}

.room-menu-meta > div {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 6px;
}

.room-menu-meta > div > span {
  overflow: hidden;
  color: var(--emerald-muted, #82b493);
  font-size: 9px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.room-menu-meta code {
  color: var(--edition-accent, #7eff79);
  font: 900 10px/1 var(--font-pixel, monospace);
}

.room-menu-meta .room-host-badge {
  flex: 0 0 auto;
  padding: 2px 5px;
  font-size: 8px;
}

.room-completed-badge {
  flex: 0 0 auto;
  padding: 2px 5px;
  border: 1px solid rgba(255, 226, 121, 0.45);
  border-radius: 999px;
  color: #ffe279;
  font-size: 8px;
  font-weight: 900;
  line-height: 1;
}

.room-menu-item {
  width: 100%;
  min-height: 36px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 9px;
  color: var(--emerald-text, #f3fff0);
  text-align: left;
  cursor: pointer;
  border: 0;
  border-radius: 4px;
  background: transparent;
}

.room-menu-item span {
  font-size: 11px;
  font-weight: 800;
}

.room-menu-item small {
  color: var(--emerald-muted, #82b493);
  font-size: 8px;
  font-weight: 800;
}

.room-menu-item:hover,
.room-menu-item:focus-visible {
  background: color-mix(in srgb, var(--edition-accent, #7eff79) 11%, transparent);
  outline: none;
}

.room-menu-item.is-success {
  color: #9dffa0;
}

.room-menu-item.is-success:hover,
.room-menu-item.is-success:focus-visible {
  background: rgba(102, 239, 131, 0.12);
}

.room-menu-item.is-danger {
  color: #ff918a;
}

.room-menu-item.is-danger:hover,
.room-menu-item.is-danger:focus-visible {
  background: rgba(255, 84, 76, 0.12);
}

.room-menu-separator {
  height: 1px;
  margin: 5px 7px;
  background: rgba(255, 112, 101, 0.22);
}

.room-control > .room-control-button {
  height: 34px !important;
  padding: 0 11px !important;
  border-radius: 6px !important;
  font-size: 10px !important;
}

.floating-map-button {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 8500;
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  padding: 0;
  color: var(--emerald-text, #f3fff0);
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  border: 1px solid color-mix(in srgb, var(--edition-accent, #7eff79) 58%, white 8%);
  border-radius: 50%;
  background: color-mix(in srgb, var(--emerald-field-2, #1c4d3a) 88%, #000 12%);
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.42),
    0 0 18px color-mix(in srgb, var(--edition-accent, #7eff79) 18%, transparent);
}

.floating-map-button:hover,
.floating-map-button:focus-visible,
.floating-map-button.is-open {
  color: #071611;
  border-color: color-mix(in srgb, var(--edition-accent, #7eff79) 88%, white 12%);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--edition-warm, #ffd964) 78%, white 22%),
    color-mix(in srgb, var(--edition-accent, #7eff79) 84%, var(--edition-accent-2, #2eea9b) 16%)
  );
  outline: none;
}

.hoenn-map-modal:not(.guide-modal) {
  position: fixed !important;
  inset: auto 18px 82px auto !important;
  z-index: 8400 !important;
  width: min(528px, calc(100vw - 36px)) !important;
  height: auto !important;
  display: block !important;
  padding: 0 !important;
  pointer-events: none;
}

.hoenn-map-modal:not(.guide-modal)[hidden] {
  display: none !important;
}

.hoenn-map-modal:not(.guide-modal) .hoenn-map-panel {
  width: 100% !important;
  max-height: min(620px, calc(100dvh - 108px)) !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  pointer-events: auto;
  border-color: color-mix(in srgb, var(--edition-accent, #7eff79) 44%, transparent) !important;
  border-radius: 8px !important;
  background: color-mix(in srgb, var(--emerald-night, #0b1c18) 96%, #000 4%) !important;
  box-shadow: 0 20px 58px rgba(0, 0, 0, 0.56) !important;
}

.hoenn-map-modal:not(.guide-modal) .hoenn-map-head {
  min-height: 50px;
  flex: 0 0 auto;
  padding: 8px 10px 8px 12px !important;
}

.hoenn-map-modal:not(.guide-modal) .hoenn-map-head h2 {
  font-size: 16px !important;
}

.hoenn-map-modal:not(.guide-modal) .hoenn-map-close {
  width: 32px;
  height: 32px;
  font-size: 21px;
}

.hoenn-map-modal:not(.guide-modal) .hoenn-map-body {
  min-height: 0;
  display: block !important;
  overflow: auto;
  padding: 8px !important;
}

.hoenn-map-modal:not(.guide-modal) .hoenn-map-stage {
  width: 100%;
  border-radius: 5px !important;
}

.hoenn-map-modal:not(.guide-modal) .hoenn-map-image {
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain;
}

@media (max-width: 760px) {
  .mode-tabs {
    max-width: 100% !important;
    overflow-x: auto !important;
  }

  body[data-edition-theme] .mode-tabs button {
    padding: 0 9px !important;
    font-size: 10px !important;
  }

  .room-menu {
    width: 150px;
  }

  .room-menu-popover {
    width: min(250px, calc(100vw - 24px));
  }

  .floating-map-button {
    right: 12px;
    bottom: 12px;
    width: 48px;
    height: 48px;
  }

  .hoenn-map-modal:not(.guide-modal) {
    inset: auto 12px 72px auto !important;
    width: calc(100vw - 24px) !important;
  }

  .hoenn-map-modal:not(.guide-modal) .hoenn-map-panel {
    max-height: calc(100dvh - 96px) !important;
  }
}

@supports not (height: 100dvh) {
  .hoenn-map-modal:not(.guide-modal) .hoenn-map-panel {
    max-height: min(620px, calc(100vh - 108px)) !important;
  }
}

/* =========================================================
   V10.32 Live Battle Advisor
   ========================================================= */
.player-battle-body {
  grid-template-columns: minmax(0, 1fr);
}

.player-battle-body.has-opponent-list {
  grid-template-columns: minmax(250px, 0.58fr) minmax(520px, 1.6fr);
}

.player-battle-opponents {
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--stats-border);
  background: color-mix(in srgb, var(--stats-surface) 54%, var(--stats-panel-bg));
}

.player-battle-opponent-list {
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 7px;
}

.player-battle-opponent {
  width: 100%;
  min-height: 84px;
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 8px 9px;
  color: var(--stats-text);
  text-align: left;
  cursor: pointer;
  border: 1px solid transparent;
  border-bottom-color: var(--stats-border);
  border-radius: 5px;
  background: transparent;
}

.player-battle-opponent:hover,
.player-battle-opponent:focus-visible,
.player-battle-opponent.is-selected {
  border-color: color-mix(in srgb, var(--stats-player) 48%, var(--stats-border));
  background: color-mix(in srgb, var(--stats-player) 9%, transparent);
  outline: none;
}

.player-battle-opponent-sprite,
.player-battle-recommendation-sprite {
  display: grid;
  place-items: center;
  overflow: hidden;
}

.player-battle-opponent-sprite {
  width: 58px;
  height: 58px;
}

.player-battle-opponent-sprite img {
  width: 58px;
  height: 58px;
  object-fit: contain;
  image-rendering: pixelated;
}

.player-battle-opponent-copy {
  min-width: 0;
  display: grid;
  gap: 6px;
}

.player-battle-opponent-copy > strong {
  overflow: hidden;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.player-battle-opponent-copy > span {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
}

.player-battle-opponent > small {
  color: #ffe46b;
  font-size: 9px;
  font-weight: 900;
}

.player-battle-detail {
  min-width: 0;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 18px 66px 24px 20px;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.player-battle-foe-head {
  min-height: 124px;
  display: grid;
  grid-template-columns: 116px minmax(0, 1fr) auto;
  align-items: center;
  gap: 17px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--stats-border);
}

.player-battle-foe-sprite {
  width: 116px;
  height: 116px;
  display: grid;
  place-items: center;
  border-right: 1px solid var(--stats-border);
}

.player-battle-foe-sprite img {
  width: 110px;
  height: 110px;
  object-fit: contain;
  image-rendering: pixelated;
}

.player-battle-foe-title {
  min-width: 0;
}

.player-battle-foe-title h3 {
  overflow-wrap: anywhere;
  margin: 5px 0 9px;
  color: var(--stats-text);
  font-size: 28px;
  line-height: 1.05;
}

.player-battle-foe-title > div {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.player-battle-foe-vitals {
  align-self: start;
  display: grid;
  justify-items: end;
  gap: 7px;
  padding-top: 18px;
}

.player-battle-foe-vitals strong {
  color: #ffe46b;
  font-size: 20px;
}

.player-battle-foe-vitals small {
  color: var(--stats-muted);
  font-size: 10px;
}

.player-battle-effectiveness {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 16px;
  border-top: 1px solid var(--stats-border);
  border-bottom: 1px solid var(--stats-border);
}

.player-battle-effectiveness .player-stats-advice-group {
  min-height: 88px;
}

.player-battle-team-advice {
  margin-top: 20px;
}

.player-battle-team-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 9px;
}

.player-battle-team-head h3 {
  margin: 3px 0 0;
  color: var(--stats-text);
  font-size: 18px;
}

.player-battle-team-head > span {
  color: var(--stats-muted);
  font-size: 9px;
  font-weight: 800;
  white-space: nowrap;
}

.player-battle-recommendations {
  border-top: 1px solid var(--stats-border);
}

.player-battle-recommendation {
  min-width: 0;
  min-height: 72px;
  display: grid;
  grid-template-columns: 28px 54px minmax(120px, 1fr) minmax(92px, 0.62fr) minmax(92px, 0.62fr) minmax(78px, auto);
  align-items: center;
  gap: 9px;
  padding: 7px 8px;
  border-bottom: 1px solid var(--stats-border);
}

.player-battle-recommendation.is-best {
  background: color-mix(in srgb, var(--stats-player) 7%, transparent);
}

.player-battle-rank {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  color: #071611;
  font-size: 10px;
  font-weight: 950;
  border-radius: 50%;
  background: var(--stats-player);
}

.player-battle-recommendation-sprite {
  width: 54px;
  height: 54px;
}

.player-battle-recommendation-sprite img {
  width: 54px;
  height: 54px;
  object-fit: contain;
  image-rendering: pixelated;
}

.player-battle-recommendation-name {
  min-width: 0;
  display: grid;
  gap: 5px;
}

.player-battle-recommendation-name > strong {
  overflow: hidden;
  color: var(--stats-text);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.player-battle-recommendation-name > span {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
}

.player-battle-metric,
.player-battle-recommendation-state {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.player-battle-metric small,
.player-battle-recommendation-state small {
  color: var(--stats-muted);
  font-size: 8px;
  font-weight: 800;
}

.player-battle-metric strong,
.player-battle-recommendation-state strong {
  color: var(--stats-text);
  font-size: 12px;
}

.player-battle-metric.is-strong strong,
.player-battle-recommendation-state strong {
  color: #76ec90;
}

.player-battle-metric.is-danger strong {
  color: #ff9188;
}

.player-battle-recommendation-state {
  justify-items: end;
  text-align: right;
}

.player-battle-no-recommendation,
.player-battle-waiting {
  color: var(--stats-muted);
  font-size: 11px;
}

.player-battle-no-recommendation {
  padding: 22px 8px;
  border-bottom: 1px solid var(--stats-border);
}

.player-battle-waiting {
  min-height: 380px;
  display: grid;
  place-content: center;
  gap: 7px;
  text-align: center;
}

.player-battle-waiting > strong {
  color: var(--stats-text);
  font-size: 17px;
}

@media (max-width: 1250px) {
  .player-battle-recommendation {
    grid-template-columns: 24px 48px minmax(105px, 1fr) minmax(82px, 0.55fr) minmax(82px, 0.55fr);
  }

  .player-battle-recommendation-state {
    display: none;
  }
}

@media (max-width: 980px) {
  .player-battle-body.has-opponent-list {
    grid-template-columns: minmax(220px, 0.52fr) minmax(480px, 1.48fr);
  }

  .player-battle-detail {
    padding: 16px 62px 18px 15px;
  }

  .player-battle-foe-head {
    grid-template-columns: 92px minmax(0, 1fr) auto;
    gap: 12px;
  }

  .player-battle-foe-sprite {
    width: 92px;
    height: 92px;
  }

  .player-battle-foe-sprite img {
    width: 88px;
    height: 88px;
  }

  .player-battle-foe-title h3 {
    font-size: 23px;
  }
}

@media (max-width: 760px) {
  .player-battle-body {
    display: block;
    overflow-x: hidden;
    overflow-y: auto;
  }

  .player-battle-opponents {
    max-height: 190px;
    border-right: 0;
    border-bottom: 1px solid var(--stats-border);
  }

  .player-battle-detail {
    overflow: visible;
    padding: 14px;
  }

  .player-battle-effectiveness {
    grid-template-columns: 1fr;
  }

  .player-battle-effectiveness .player-stats-advice-group {
    min-height: 0;
    border-right: 0;
    border-bottom: 1px solid var(--stats-border);
  }

  .player-battle-recommendation {
    grid-template-columns: 24px 46px minmax(100px, 1fr) 70px;
  }

  .player-battle-metric.is-incoming {
    display: none;
  }

  .player-battle-recommendation-state {
    display: grid;
  }
}

/* =========================================================
   V10.34 Floating player actions
   ========================================================= */
.player-dashboard .player-card {
  cursor: default !important;
  pointer-events: none;
}

.floating-player-stats-button {
  position: fixed;
  right: 18px;
  bottom: 146px;
  z-index: 8500;
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  padding: 0;
  color: var(--emerald-text, #f3fff0);
  cursor: pointer;
  border: 1px solid color-mix(in srgb, var(--edition-accent, #7eff79) 58%, white 8%);
  border-radius: 50%;
  background: color-mix(in srgb, var(--emerald-field-2, #1c4d3a) 88%, #000 12%);
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.42),
    0 0 18px color-mix(in srgb, var(--edition-accent, #7eff79) 18%, transparent);
}

.floating-battle-advisor-button {
  bottom: 82px;
}

.floating-player-stats-button:hover,
.floating-player-stats-button:focus-visible {
  color: #071611;
  border-color: color-mix(in srgb, var(--edition-accent, #7eff79) 88%, white 12%);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--edition-warm, #ffd964) 78%, white 22%),
    color-mix(in srgb, var(--edition-accent, #7eff79) 84%, var(--edition-accent-2, #2eea9b) 16%)
  );
  outline: none;
}

.floating-player-stats-button.is-battling {
  color: #fff8e2;
  border-color: #ffcf5a;
  background: color-mix(in srgb, #5a241b 78%, var(--emerald-night, #071712) 22%);
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.42),
    0 0 20px rgba(255, 121, 95, 0.28);
}

.floating-player-stats-button:disabled {
  opacity: 0.42;
  cursor: default;
}

.floating-action-label {
  max-width: calc(100% - 8px);
  font: 900 8px/1.1 var(--font-pixel, monospace);
  letter-spacing: 0;
  white-space: nowrap;
}

.hoenn-map-modal:not(.guide-modal) {
  bottom: 208px !important;
}

@media (max-width: 760px) {
  .floating-player-stats-button {
    right: 12px;
    bottom: 128px;
    width: 48px;
    height: 48px;
  }

  .floating-battle-advisor-button {
    bottom: 70px;
  }

  .hoenn-map-modal:not(.guide-modal) {
    bottom: 186px !important;
  }
}

.hoenn-map-modal:not(.guide-modal).is-dragged {
  inset: var(--hoenn-map-drag-top) auto auto var(--hoenn-map-drag-left) !important;
}

.hoenn-map-modal:not(.guide-modal) [data-hoenn-map-drag-handle] {
  cursor: grab;
  touch-action: none;
  user-select: none;
}


/* =========================================================
   V10.40 Public Hall of Fame
   ========================================================= */

.room-hall-of-fame {
  position: relative;
  margin-top: 20px;
  padding-top: 14px;
  border-top: 1px solid rgba(180, 255, 214, 0.22);
}

.room-hall-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 10px;
}

.room-hall-head h2 {
  margin: 0;
  color: #f5fff7;
  font-size: 20px;
  line-height: 1.1;
  letter-spacing: 0;
}

.room-hall-count {
  flex: 0 0 auto;
  color: rgba(224, 255, 234, 0.68);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0;
}

.room-hall-content {
  max-height: 190px;
  overflow: auto;
  border: 1px solid rgba(180, 255, 214, 0.20);
  border-radius: 6px;
  background: rgba(2, 14, 10, 0.58);
  scrollbar-gutter: auto;
}

.room-hall-state {
  min-height: 72px;
  display: grid;
  place-items: center;
  margin: 0;
  padding: 16px;
  color: rgba(224, 255, 234, 0.66);
  font-size: 13px;
}

.room-hall-state.is-error {
  color: #ffadad;
}

.room-hall-table {
  width: 100%;
  min-width: 740px;
  border-collapse: collapse;
  table-layout: fixed;
  color: #effff4;
  font-size: 12px;
}

.room-hall-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  padding: 9px 10px;
  border-bottom: 1px solid rgba(180, 255, 214, 0.18);
  background: #09231b;
  color: rgba(224, 255, 234, 0.62);
  font-size: 10px;
  font-weight: 850;
  text-align: left;
  text-transform: uppercase;
  letter-spacing: 0;
}

.room-hall-table th:nth-child(1) {
  width: 21%;
}

.room-hall-table th:nth-child(2) {
  width: 10%;
}

.room-hall-table th:nth-child(3),
.room-hall-table th:nth-child(4),
.room-hall-table th:nth-child(5) {
  width: 9%;
  text-align: center;
}

.room-hall-table th:nth-child(3) {
  width: 13%;
}

.room-hall-table th:nth-child(6) {
  width: 38%;
}

.room-hall-table td {
  padding: 10px;
  vertical-align: middle;
}

.room-hall-table tbody tr + tr td {
  border-top: 1px solid rgba(180, 255, 214, 0.12);
}

.room-hall-room strong,
.room-hall-room small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.room-hall-room strong {
  color: #f5fff7;
  font-size: 13px;
}

.room-hall-room small {
  margin-top: 3px;
  color: rgba(224, 255, 234, 0.56);
  font-size: 10px;
}

.room-hall-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: rgba(224, 255, 234, 0.68);
  white-space: nowrap;
}

.room-hall-status::before {
  content: "";
  width: 6px;
  height: 6px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #82968b;
}

.room-hall-status.is-active {
  color: #9dffa0;
}

.room-hall-status.is-active::before {
  background: #66ef83;
}

.room-hall-status.is-completed {
  color: #ffe279;
  font-weight: 800;
}

.room-hall-status.is-completed::before {
  background: #ffe279;
  box-shadow: 0 0 8px rgba(255, 226, 121, 0.55);
}

.room-hall-number {
  color: #ffe279;
  font-size: 15px;
  font-weight: 900;
  text-align: center;
  font-variant-numeric: tabular-nums;
}

.room-hall-time {
  color: #b8f4d2;
  white-space: nowrap;
}

.room-hall-time time {
  font: inherit;
}

.room-hall-players {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px 14px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.room-hall-players li {
  min-width: 0;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}

.room-hall-players li > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.room-hall-players b {
  color: #ffe279;
  font-size: 10px;
}

.room-hall-players small,
.room-hall-no-players {
  flex: 0 0 auto;
  color: rgba(224, 255, 234, 0.56);
  font-size: 10px;
  white-space: nowrap;
}

body.room-gate-open .room-gate-panel {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

@media (max-width: 820px) {
  .room-hall-content {
    max-height: 230px;
  }
}

.hoenn-map-modal:not(.guide-modal).is-dragging [data-hoenn-map-drag-handle] {
  cursor: grabbing;
}

.hoenn-map-modal:not(.guide-modal) [data-hoenn-map-drag-handle] .hoenn-map-close {
  cursor: pointer;
}


/* =========================================================
   V10.43 Compact startup and Hall of Fame panels
   ========================================================= */

.room-gate-layout {
  position: relative;
  z-index: 1;
  width: min(860px, calc(100vw - 34px));
  max-height: calc(100dvh - 48px);
  display: grid;
  gap: 20px;
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-gutter: auto;
}

.room-gate-layout > .room-gate-main-panel {
  width: 100%;
  max-height: none;
}

.room-hall-panel {
  position: relative;
  min-width: 0;
  padding: 26px;
  border: 1px solid color-mix(in srgb, var(--edition-accent, #7eff79) 32%, transparent);
  border-radius: 24px;
  background: color-mix(in srgb, var(--edition-card, #0d2b22) 78%, black 22%);
  box-shadow:
    0 28px 80px rgba(0, 0, 0, 0.52),
    0 0 30px color-mix(in srgb, var(--edition-accent, #7eff79) 10%, transparent);
}

.room-hall-panel .room-hall-of-fame {
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

.room-hall-panel .room-hall-content {
  max-height: 260px;
}

body.room-gate-open .room-gate-layout > .room-gate-main-panel {
  max-height: none !important;
  overflow: visible !important;
}

@media (min-width: 1400px) {
  .room-gate-layout {
    width: min(1480px, calc(100vw - 48px));
    height: auto;
    max-height: calc(100dvh - 48px);
    grid-template-columns: minmax(720px, 1fr) 404px;
    gap: 24px;
    align-items: start;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: auto;
  }

  .room-gate-layout > .room-gate-main-panel {
    width: 100%;
    height: auto;
    min-height: 0;
  }

  .room-hall-panel {
    width: 100%;
    height: 420px;
    min-height: 0;
    align-self: start;
    display: flex;
    overflow: hidden;
    padding: 24px;
  }

  .room-hall-panel .room-hall-of-fame {
    flex: 1 1 auto;
  }

  .room-hall-panel .room-hall-content {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow-x: hidden;
    overflow-y: auto;
  }

  .room-hall-panel .room-hall-state {
    height: 100%;
  }

  .room-hall-panel .room-hall-table {
    display: block;
    min-width: 0;
    padding: 8px;
    table-layout: auto;
  }

  .room-hall-panel .room-hall-table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
  }

  .room-hall-panel .room-hall-table tbody {
    display: grid;
    gap: 8px;
  }

  .room-hall-panel .room-hall-table tbody tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    grid-template-areas:
      "room status status"
      "time resets losses"
      "players players players";
    gap: 6px 12px;
    padding: 12px;
    border: 1px solid rgba(180, 255, 214, 0.16);
    border-radius: 12px;
    background:
      linear-gradient(135deg, rgba(255, 255, 255, 0.045), transparent 48%),
      rgba(6, 28, 21, 0.72);
  }

  .room-hall-panel .room-hall-table td,
  .room-hall-panel .room-hall-table tbody tr + tr td {
    padding: 0;
    border-top: 0;
  }

  .room-hall-panel .room-hall-table td:nth-child(1) {
    grid-area: room;
    min-width: 0;
    align-self: start;
  }

  .room-hall-panel .room-hall-table td:nth-child(2) {
    grid-area: status;
    justify-self: end;
  }

  .room-hall-panel .room-hall-table td:nth-child(3),
  .room-hall-panel .room-hall-table td:nth-child(4),
  .room-hall-panel .room-hall-table td:nth-child(5) {
    display: inline-flex;
    align-items: baseline;
    justify-content: flex-end;
    gap: 5px;
    font-size: 13px;
  }

  .room-hall-panel .room-hall-table td:nth-child(3) {
    grid-area: time;
    justify-self: start;
  }

  .room-hall-panel .room-hall-table td:nth-child(4) {
    grid-area: resets;
  }

  .room-hall-panel .room-hall-table td:nth-child(5) {
    grid-area: losses;
  }

  .room-hall-panel .room-hall-table td:nth-child(3)::before,
  .room-hall-panel .room-hall-table td:nth-child(4)::before,
  .room-hall-panel .room-hall-table td:nth-child(5)::before {
    color: rgba(224, 255, 234, 0.56);
    font-size: 9px;
    font-weight: 800;
    text-transform: uppercase;
  }

  .room-hall-panel .room-hall-table td:nth-child(3)::before {
    content: "Spielzeit";
  }

  .room-hall-panel .room-hall-table td:nth-child(4)::before {
    content: "Resets";
  }

  .room-hall-panel .room-hall-table td:nth-child(5)::before {
    content: "Verluste";
  }

  .room-hall-panel .room-hall-table td:nth-child(6) {
    grid-area: players;
    min-width: 0;
    margin-top: 2px;
    padding-top: 8px;
    border-top: 1px solid rgba(180, 255, 214, 0.10);
  }

  .room-hall-panel .room-hall-room strong {
    font-size: 13px;
  }

  .room-hall-panel .room-hall-room small {
    margin-top: 2px;
  }

  .room-hall-panel .room-hall-status {
    font-size: 10px;
  }

  .room-hall-panel .room-hall-players {
    gap: 4px 10px;
  }

  .room-hall-panel .room-hall-players li {
    font-size: 10px;
  }

  .room-hall-panel .room-hall-players small {
    font-size: 9px;
  }
}

@media (max-width: 820px) {
  body.room-gate-open .room-gate {
    padding: 12px;
  }

  .room-gate-layout {
    width: 100%;
    max-height: calc(100dvh - 24px);
    gap: 16px;
  }

  .room-gate-layout > .room-gate-main-panel,
  .room-hall-panel {
    padding: 16px;
  }

  .room-gate-head h1 {
    max-width: 100%;
    margin-bottom: 16px;
    font-size: clamp(24px, 8vw, 32px);
    overflow-wrap: anywhere;
  }
}

/* Map zoom and location hover labels */
.hoenn-map-modal:not(.guide-modal) .hoenn-map-head-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.hoenn-map-modal:not(.guide-modal) .hoenn-map-zoom-hint {
  color: color-mix(in srgb, var(--edition-accent, #7eff79) 76%, white 24%);
  font: 800 8px/1 var(--font-pixel, Arial, Helvetica, sans-serif);
  white-space: nowrap;
}

.hoenn-map-modal:not(.guide-modal) .hoenn-map-stage {
  width: 100% !important;
  overflow: auto !important;
  overscroll-behavior: contain;
  scrollbar-gutter: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.hoenn-map-modal:not(.guide-modal) .hoenn-map-stage::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}

.hoenn-map-modal:not(.guide-modal) .hoenn-map-stage.is-pannable {
  cursor: grab;
  touch-action: none;
}

.hoenn-map-modal:not(.guide-modal) .hoenn-map-stage.is-panning {
  cursor: grabbing;
  user-select: none;
}

.hoenn-map-modal:not(.guide-modal) .hoenn-map-canvas {
  position: relative;
  width: 100%;
  min-width: 0;
  margin-inline: auto;
  user-select: none;
}

.hoenn-map-modal:not(.guide-modal) .hoenn-map-canvas .hoenn-map-image {
  width: 100% !important;
  max-width: none !important;
  max-height: none !important;
  -webkit-user-drag: none;
}

.hoenn-map-locations {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
}

.hoenn-map-markers {
  z-index: 3;
}

.hoenn-map-location {
  position: absolute;
  width: 26px;
  height: 26px;
  padding: 0;
  transform: translate(-50%, -50%);
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #f4fff7;
  pointer-events: auto;
  cursor: help;
}

.hoenn-map-location.is-route {
  width: 32px;
  height: 24px;
  border-radius: 8px;
}

.hoenn-map-location::before {
  content: "";
  position: absolute;
  inset: 50% auto auto 50%;
  width: 8px;
  height: 8px;
  transform: translate(-50%, -50%) scale(0.7);
  border: 1px solid rgba(255, 255, 255, 0.92);
  border-radius: 50%;
  background: color-mix(in srgb, var(--edition-accent, #7eff79) 78%, #06130e 22%);
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.32);
  opacity: 0;
  transition: opacity 100ms ease, transform 100ms ease;
}

.hoenn-map-location::after {
  content: attr(data-label);
  position: absolute;
  left: 50%;
  bottom: calc(100% + 6px);
  z-index: 5;
  min-width: max-content;
  max-width: 180px;
  padding: 6px 8px;
  transform: translate(-50%, 4px);
  border: 1px solid color-mix(in srgb, var(--edition-accent, #7eff79) 48%, transparent);
  border-radius: 5px;
  background: rgba(4, 18, 13, 0.96);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.48);
  color: #f4fff7;
  font: 800 10px/1.2 var(--font-pixel, Arial, Helvetica, sans-serif);
  text-align: center;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 100ms ease, transform 100ms ease;
}

.hoenn-map-location:hover,
.hoenn-map-location:focus-visible {
  z-index: 4;
  outline: none;
}

.hoenn-map-location:hover::before,
.hoenn-map-location:focus-visible::before,
.hoenn-map-location:hover::after,
.hoenn-map-location:focus-visible::after {
  opacity: 1;
}

.hoenn-map-location:hover::before,
.hoenn-map-location:focus-visible::before {
  transform: translate(-50%, -50%) scale(1);
}

.hoenn-map-location:hover::after,
.hoenn-map-location:focus-visible::after {
  transform: translate(-50%, 0);
}

.hoenn-map-location.is-right-edge::after {
  right: -6px;
  left: auto;
  transform: translateY(4px);
}

.hoenn-map-location.is-right-edge:hover::after,
.hoenn-map-location.is-right-edge:focus-visible::after {
  transform: translateY(0);
}

.hoenn-map-location.is-top-edge::after {
  top: calc(100% + 6px);
  bottom: auto;
}

@media (max-width: 520px) {
  .hoenn-map-modal:not(.guide-modal) .hoenn-map-zoom-hint {
    display: none;
  }
}
