/* Desktop navigation v65. The phone dock and its menu remain owned by the existing <=760px rules. */

.desktop-menu-only { display: none !important; }

@media (min-width: 761px) {
  .game-screen {
    --desktop-nav-card-width: clamp(78px, 5.1vw, 88px);
    --desktop-nav-card-height: clamp(74px, 4.65vw, 82px);
    --desktop-nav-icon-size: clamp(40px, 2.7vw, 46px);
    --desktop-nav-gap: clamp(8px, .62vw, 11px);
    --desktop-nav-edge: max(16px, env(safe-area-inset-right));
  }

  .game-screen .desktop-utility-rail { display: none !important; }
  .game-screen .desktop-menu-only { display: grid !important; }
  .game-screen .mobile-menu-only { display: none !important; }

  .game-screen .desktop-dock {
    right: var(--desktop-nav-edge) !important;
    bottom: max(16px, env(safe-area-inset-bottom)) !important;
    grid-template-columns: repeat(5, var(--desktop-nav-card-width)) !important;
    gap: var(--desktop-nav-gap) !important;
    width: auto !important;
  }

  .game-screen .desktop-dock button {
    grid-template-rows: var(--desktop-nav-icon-size) minmax(12px, auto) !important;
    width: var(--desktop-nav-card-width) !important;
    min-width: var(--desktop-nav-card-width) !important;
    height: var(--desktop-nav-card-height) !important;
    min-height: var(--desktop-nav-card-height) !important;
    gap: 5px !important;
    padding: 8px 6px 7px !important;
    border-radius: clamp(17px, 1.2vw, 21px) !important;
  }

  .game-screen .desktop-dock button > span {
    width: var(--desktop-nav-icon-size) !important;
    height: var(--desktop-nav-icon-size) !important;
    border-radius: 14px !important;
    background: rgba(231,246,253,.78) !important;
  }

  .game-screen .desktop-dock-icon-v65 {
    display: block;
    width: calc(var(--desktop-nav-icon-size) - 4px);
    height: calc(var(--desktop-nav-icon-size) - 4px);
    object-fit: contain;
    filter: drop-shadow(0 3px 5px rgba(25,78,109,.13));
    transition: transform .14s ease, filter .14s ease;
  }

  .game-screen .desktop-dock button:hover .desktop-dock-icon-v65,
  .game-screen .desktop-dock button.is-active .desktop-dock-icon-v65,
  .game-screen .desktop-dock button.is-menu-open .desktop-dock-icon-v65 {
    transform: translateY(-1px) scale(1.045);
    filter: drop-shadow(0 4px 7px rgba(19,96,140,.2));
  }

  .game-screen .desktop-dock button > b {
    max-width: calc(var(--desktop-nav-card-width) - 10px) !important;
    font-size: clamp(8px, .58vw, 10px) !important;
    font-weight: 850 !important;
    letter-spacing: .01em;
  }

  .game-screen .desktop-dock button.is-active,
  .game-screen .desktop-dock button.is-menu-open {
    transform: translateY(-2px);
  }

  /* Every secondary desktop action lives in one readable popover above the dock. */
  .game-screen .world-rail {
    right: var(--desktop-nav-edge) !important;
    bottom: calc(max(16px, env(safe-area-inset-bottom)) + var(--desktop-nav-card-height) + 14px) !important;
    left: auto !important;
    top: auto !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    width: clamp(390px, 31vw, 470px) !important;
    max-height: min(390px, calc(100dvh - var(--desktop-nav-card-height) - 64px)) !important;
    gap: 8px !important;
    padding: 12px !important;
    overflow: auto !important;
    transform: none !important;
    border-radius: 22px !important;
  }

  .game-screen .world-rail.is-desktop-menu-open { display: grid !important; }

  .game-screen .world-rail button {
    grid-template-columns: 38px minmax(0, 1fr) !important;
    min-height: 58px !important;
    gap: 9px !important;
    padding: 8px 10px !important;
    border: 1px solid rgba(140,191,211,.18) !important;
    border-radius: 15px !important;
    background: rgba(255,255,255,.045) !important;
  }

  .game-screen .world-rail button > span {
    display: grid !important;
    place-items: center !important;
    width: 38px !important;
    height: 38px !important;
    border-radius: 12px;
    background: rgba(255,255,255,.06);
  }

  .game-screen .world-rail button > span .ui-icon { width: 24px !important; height: 24px !important; }
  .game-screen .world-rail button .art-icon,
  .game-screen .world-rail button .pokedex-nav-device img { width: 34px !important; height: 34px !important; object-fit: contain; }
  .game-screen .world-rail button b,
  .game-screen .world-rail button:hover b,
  .game-screen .world-rail button.is-active b {
    max-width: none !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    text-align: left !important;
  }

  .game-screen .world-rail button > i {
    top: 5px !important;
    right: 5px !important;
  }

  html[data-game-theme="light"] .game-screen .desktop-dock button > span { background: #edf7fb !important; }
  html[data-game-theme="light"] .game-screen .world-rail button {
    border-color: #d9e9f0 !important;
    background: #f8fcfe !important;
  }
  html[data-game-theme="light"] .game-screen .world-rail button > span { background: #eaf5fa; }
  html[data-game-theme="light"] .game-screen .world-rail button:hover,
  html[data-game-theme="light"] .game-screen .world-rail button.is-active {
    border-color: #acd9ed !important;
    background: #e9f7fd !important;
  }
}

@media (min-width: 981px) and (max-width: 1280px) {
  .game-screen {
    --desktop-nav-card-width: 68px;
    --desktop-nav-card-height: 66px;
    --desktop-nav-icon-size: 36px;
    --desktop-nav-gap: 7px;
    --desktop-nav-edge: max(11px, env(safe-area-inset-right));
  }
  .game-screen .desktop-dock button { padding: 6px 5px 5px !important; border-radius: 16px !important; }
  .game-screen .desktop-dock button > span { border-radius: 11px !important; }
  .game-screen .desktop-dock button > b { font-size: 7.5px !important; }
  .game-screen .world-rail {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    width: 384px !important;
  }
  .game-screen .world-rail button { min-height: 53px !important; }
}

@media (min-width: 761px) and (max-width: 980px) {
  .game-screen {
    --desktop-nav-card-width: 54px;
    --desktop-nav-card-height: 54px;
    --desktop-nav-icon-size: 30px;
    --desktop-nav-gap: 5px;
    --desktop-nav-edge: max(8px, env(safe-area-inset-right));
  }
  .game-screen .desktop-dock button {
    grid-template-rows: 30px minmax(9px, auto) !important;
    gap: 2px !important;
    padding: 4px 3px 3px !important;
    border-radius: 13px !important;
  }
  .game-screen .desktop-dock button > span { border-radius: 9px !important; }
  .game-screen .desktop-dock button > b { font-size: 6.2px !important; }
  .game-screen .world-rail {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: min(330px, calc(100vw - 90px)) !important;
    gap: 6px !important;
    padding: 9px !important;
    border-radius: 18px !important;
  }
  .game-screen .world-rail button {
    grid-template-columns: 32px minmax(0, 1fr) !important;
    min-height: 48px !important;
    padding: 6px 8px !important;
  }
  .game-screen .world-rail button > span { width: 32px !important; height: 32px !important; }
  .game-screen .world-rail button > span .ui-icon { width: 20px !important; height: 20px !important; }
  .game-screen .world-rail button .art-icon { width: 29px !important; height: 29px !important; }
  .game-screen .world-rail button b,
  .game-screen .world-rail button:hover b,
  .game-screen .world-rail button.is-active b { font-size: 8px !important; }
}

@media (min-width: 761px) and (max-height: 700px) {
  .game-screen {
    --desktop-nav-card-height: 56px;
    --desktop-nav-icon-size: 32px;
  }
  .game-screen .desktop-dock button { grid-template-rows: 32px minmax(9px, auto) !important; padding-block: 4px !important; }
  .game-screen .world-rail { max-height: calc(100dvh - 92px) !important; }
}

@media (prefers-reduced-motion: reduce) {
  .game-screen .desktop-dock-icon-v65 { transition: none !important; }
}