/* v4.6.15.1 — iPhone Player Hub density and overflow repair.
   Loaded last so every Hub section receives the same safe mobile sizing. */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

@media (max-width: 700px) {
  body.player-hub-open {
    width: 100%;
    max-width: 100%;
    overflow: hidden !important;
    overscroll-behavior: none;
  }

  .player-hub,
  .player-hub-card,
  .player-hub-navigation,
  .player-hub-scroll,
  .player-hub-panel {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .player-hub {
    overflow: hidden;
    touch-action: manipulation;
  }

  .player-hub-card {
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    max-height: 100vh !important;
    max-height: 100dvh !important;
    grid-template-rows: auto auto minmax(0, 1fr);
  }

  .player-hub-header {
    gap: 8px;
    padding: max(9px, env(safe-area-inset-top)) 11px 8px;
  }

  .player-hub-kicker {
    margin-bottom: 2px;
    font-size: 8px !important;
    line-height: 1.2;
    letter-spacing: .12em;
  }

  .player-hub-header h2 {
    font-size: 16px !important;
    line-height: 1.15;
    letter-spacing: .12em;
  }

  .player-hub-header-actions {
    min-width: 0;
    gap: 6px;
  }

  .player-hub-diamond-wallet {
    min-width: 0 !important;
    max-width: 158px;
  }

  .player-hub-close {
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    font-size: 23px;
  }

  .player-hub-navigation {
    overflow: hidden;
  }

  .player-hub-tabs-classic {
    width: 100%;
    max-width: 100%;
    min-height: 43px;
    gap: 5px;
    padding: 6px 29px 7px 8px;
  }

  .player-hub-tabs-classic .player-hub-tab {
    min-height: 31px;
    max-width: 154px;
    padding: 6px 9px;
    font-size: 10px !important;
    line-height: 1;
    letter-spacing: .035em;
  }

  .player-hub-scroll {
    overflow-x: hidden !important;
    overflow-y: auto;
    overscroll-behavior-x: none;
    touch-action: pan-y;
    padding: 10px 10px max(18px, env(safe-area-inset-bottom));
    scroll-padding-top: 8px;
  }

  .player-hub-panel {
    overflow-x: hidden;
    contain: inline-size;
  }

  .player-hub-panel,
  .player-hub-panel > *,
  .player-hub-panel article,
  .player-hub-panel section,
  .player-hub-panel form,
  .player-hub-panel label,
  .player-hub-panel div {
    min-width: 0;
    max-width: 100%;
  }

  .player-hub-panel img,
  .player-hub-panel svg,
  .player-hub-panel canvas,
  .player-hub-panel video {
    max-width: 100%;
  }

  .player-hub-panel h3,
  .player-hub-panel .hub-section-heading h3 {
    margin: 0 0 4px;
    font-size: 16px !important;
    line-height: 1.2;
    letter-spacing: .075em;
    overflow-wrap: anywhere;
  }

  .player-hub-panel > p,
  .player-hub-panel .hub-section-heading p {
    margin: 0 0 10px;
    font-size: 12px !important;
    line-height: 1.42 !important;
    letter-spacing: .01em;
    overflow-wrap: anywhere;
  }

  .player-hub-panel h4,
  .player-hub-panel .character-section-title,
  .player-hub-panel .mastery-section-heading h4 {
    margin: 14px 0 7px;
    font-size: 13px !important;
    line-height: 1.25;
    letter-spacing: .055em;
    overflow-wrap: anywhere;
  }

  .player-hub-panel p,
  .player-hub-panel small,
  .player-hub-panel strong,
  .player-hub-panel span,
  .player-hub-panel b {
    overflow-wrap: anywhere;
  }

  .hub-section-heading {
    display: block !important;
    margin: 0 0 9px !important;
  }

  /* Keep iOS from zooming the whole Hub when a search/select/input receives focus. */
  .player-hub input,
  .player-hub select,
  .player-hub textarea {
    max-width: 100%;
    font-size: 16px !important;
  }

  .player-hub button,
  .player-hub a,
  .player-hub select,
  .player-hub input {
    touch-action: manipulation;
  }

  /* Outfit rows: compact three-column cards instead of tall blocks. */
  .player-hub .character-outfit-list {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  .player-hub .character-outfit {
    grid-template-columns: 54px minmax(0, 1fr) 46px !important;
    gap: 7px !important;
    min-height: 78px !important;
    padding: 7px !important;
  }

  .player-hub .character-outfit-preview {
    width: 54px !important;
    height: 68px !important;
    border-radius: 8px;
  }

  .player-hub .character-outfit strong {
    font-size: 12px !important;
    line-height: 1.2;
  }

  .player-hub .character-outfit small {
    margin-top: 3px;
    font-size: 10px !important;
    line-height: 1.3;
  }

  .player-hub .outfit-action-label {
    grid-column: auto !important;
    align-self: stretch !important;
    min-width: 42px !important;
    min-height: 0 !important;
    padding: 4px !important;
    border-top: 0 !important;
    border-left: 1px solid rgba(255,255,255,.09) !important;
    font-size: 8px !important;
    line-height: 1.2;
    text-align: center;
  }

  /* Keep summary information dense instead of stacking three oversized cards. */
  .player-hub .progression-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }

  .player-hub .progression-summary article {
    min-height: 86px;
    padding: 8px !important;
    border-radius: 9px;
  }

  .player-hub .progression-summary small,
  .player-hub .progression-summary span {
    font-size: 8px !important;
    line-height: 1.25;
  }

  .player-hub .progression-summary strong {
    margin: 4px 0;
    font-size: 19px !important;
    line-height: 1.05;
  }

  .player-hub .progression-panel h4 {
    margin-top: 15px;
  }

  .player-hub .progression-difficulty-grid,
  .player-hub .progression-reward-grid,
  .player-hub .progression-powerup-grid,
  .player-hub .mastery-character-grid,
  .player-hub .powerup-upgrade-grid,
  .player-hub .wearable-catalog-grid,
  .player-hub .boss-bestiary-grid,
  .player-hub .diamond-package-grid,
  .player-hub .store-featured-grid,
  .player-hub .store-effects-grid,
  .player-hub .crafting-grid,
  .player-hub .crafted-grid,
  .player-hub .upgrade-tree-grid,
  .player-hub .showroom-grid,
  .player-hub .achievement-grid,
  .player-hub .hub-stats-grid {
    gap: 8px !important;
  }

  .player-hub .progression-difficulty-card,
  .player-hub .progression-reward-card,
  .player-hub .progression-powerup-card,
  .player-hub .mastery-character-card,
  .player-hub .powerup-upgrade-card,
  .player-hub .wearable-item-card,
  .player-hub .achievement-card,
  .player-hub .hub-stat-card,
  .player-hub .diamond-package-card {
    min-height: 0 !important;
    padding: 9px !important;
    border-radius: 10px !important;
  }

  .player-hub .progression-difficulty-card p,
  .player-hub .progression-powerup-card p,
  .player-hub .mastery-character-card p,
  .player-hub .powerup-upgrade-card p,
  .player-hub .wearable-item-body p {
    min-height: 0 !important;
    margin: 5px 0 !important;
    font-size: 11px !important;
    line-height: 1.35 !important;
  }

  /* Wearable preview and cards stay readable without dominating the screen. */
  .player-hub .wearable-toolbar,
  .player-hub .wearable-look-card {
    grid-template-columns: 1fr !important;
    gap: 9px !important;
  }

  .player-hub .wearable-look-card {
    padding: 10px !important;
  }

  .player-hub .wearable-avatar-silhouette {
    width: 108px !important;
    height: 154px !important;
  }

  .player-hub .wearable-equipped-slots > div {
    grid-template-columns: 52px minmax(0,1fr) auto !important;
    gap: 6px !important;
    padding: 7px !important;
  }

  .player-hub .wearable-item-card {
    grid-template-columns: 74px minmax(0,1fr) !important;
    gap: 8px !important;
  }

  .player-hub .wearable-item-media {
    min-height: 104px !important;
  }

  .player-hub .wearable-item-body h4 {
    margin: 3px 0 !important;
  }

  .player-hub .wearable-item-actions {
    gap: 5px !important;
    margin-top: 6px !important;
  }

  .player-hub .wearable-item-actions .btn {
    min-height: 31px;
    padding: 6px 8px !important;
    font-size: 10px !important;
  }

  /* Mastery and Prestige cards. */
  .player-hub .prestige-card {
    gap: 9px !important;
    padding: 10px !important;
    border-radius: 11px !important;
  }

  .player-hub .prestige-copy h4 {
    margin: 3px 0 !important;
    font-size: 18px !important;
  }

  .player-hub .prestige-reward {
    padding: 9px !important;
  }

  .player-hub .mastery-section-heading {
    align-items: flex-start !important;
    gap: 2px !important;
    margin: 15px 0 7px !important;
  }

  .player-hub .mastery-section-heading small {
    font-size: 10px !important;
  }

  .player-hub .powerup-loadout-grid {
    gap: 7px !important;
  }

  .player-hub .powerup-loadout-slot {
    gap: 6px !important;
    padding: 9px !important;
  }

  /* Shared compact cards and action rows across remaining menus. */
  .player-hub .achievement-card {
    min-height: 0 !important;
  }

  .player-hub .daily-login-card,
  .player-hub .market-listing-card,
  .player-hub .mission-card,
  .player-hub .quest-card,
  .player-hub .boss-bestiary-card,
  .player-hub .locker-card,
  .player-hub .inventory-card,
  .player-hub .crafting-card,
  .player-hub .showroom-card,
  .player-hub .store-item-card {
    padding: 9px !important;
  }

  .player-hub .btn,
  .player-hub button:not(.player-hub-close):not(.player-hub-tab) {
    max-width: 100%;
  }
}

@media (max-width: 390px) {
  .player-hub-tabs-classic .player-hub-tab {
    max-width: 138px;
    padding-inline: 8px;
    font-size: 9px !important;
  }

  .player-hub .progression-summary article {
    min-height: 80px;
    padding: 7px !important;
  }

  .player-hub .progression-summary strong {
    font-size: 17px !important;
  }

  .player-hub .character-outfit {
    grid-template-columns: 48px minmax(0,1fr) 42px !important;
  }

  .player-hub .character-outfit-preview {
    width: 48px !important;
    height: 62px !important;
  }
}


/* v4.6.17 advanced dressing remains compact on iPhone. */
@media (max-width: 760px) {
  .player-hub .wearable-character-stage { height: 238px; width: min(210px, 68vw); border-radius: 16px; }
  .player-hub .saved-look-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
  .player-hub .saved-look-card { padding: 8px; }
  .player-hub .saved-look-card p { min-height: 0; margin: 5px 0 7px; font-size: .63rem; }
  .player-hub .saved-look-actions .btn { min-height: 31px; padding: 5px 6px; font-size: .56rem; }
  .player-hub .wearable-bundle-grid { grid-template-columns: 1fr; gap: 8px; }
  .player-hub .wearable-bundle-card { padding: 10px; }
  .player-hub .wearable-bundle-card p { margin: 5px 0; font-size: .66rem; }
  .player-hub .bundle-items span { font-size: .55rem; padding: 3px 5px; }
}