/* BuddySocial v11.49 — mobile readability/polish only. Desktop remains untouched. */
@media (max-width: 900px) {
  html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
  body { overflow-x: hidden; }

  /* Comfortable typography without overriding user-selected profile colours. */
  body, button, input, select, textarea { font-size: 15px; }
  p, li, label, .retro-pad, .retro-empty, .blog-snippet, .buzz-item { line-height: 1.5; }
  small { font-size: 12.5px; line-height: 1.4; }
  h1 { font-size: clamp(22px, 6vw, 28px); line-height: 1.15; }
  h2 { font-size: clamp(18px, 5vw, 22px); line-height: 1.2; }
  h3 { font-size: 17px; line-height: 1.25; }

  /* Cards/blocks: less cramped and safer wrapping. */
  .retro-box, .panel, .card, .classic-profile, .pimp-controlled-block {
    max-width: 100%;
    min-width: 0;
    overflow-wrap: anywhere;
  }
  .retro-box-title {
    min-height: 42px;
    padding: 10px 12px !important;
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 15.5px !important;
    line-height: 1.25 !important;
    font-weight: 800;
  }
  .retro-pad { padding: 12px !important; }
  .gap { margin-bottom: 12px !important; }

  /* Forms and controls must fit the viewport. */
  input:not([type="checkbox"]):not([type="radio"]), select, textarea {
    max-width: 100%;
    min-height: 42px;
    box-sizing: border-box;
  }
  textarea { min-height: 110px; line-height: 1.45; }
  button, .orange-btn, .blue-btn, .pimp-reset-btn, a.button, .btn {
    min-height: 42px;
    line-height: 1.2;
    white-space: normal;
    overflow-wrap: anywhere;
  }
  form { max-width: 100%; }

  /* Images/video never spill outside a mobile block. */
  img, video, iframe { max-width: 100%; height: auto; }
  iframe { width: 100%; }

  /* Profile layout stacks cleanly. */
  body[data-page="profile"] .profile-columns,
  body[data-page="profile"] .hyves-profilecard-meta-centered {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  body[data-page="profile"] .classic-profile { padding-left: 8px !important; padding-right: 8px !important; }
  body[data-page="profile"] .profile-columns > *,
  body[data-page="profile"] aside,
  body[data-page="profile"] main { min-width: 0; width: 100%; }

  /* Pimp editor: readable labels/help, clean one-column controls. */
  body[data-page="pimp_profile"] .retro-pad,
  body[data-page="admin"] .retro-pad { line-height: 1.5; }
  body[data-page="pimp_profile"] .pimp-setting-head,
  body[data-page="pimp_profile"] .pimp-layout-intro,
  body[data-page="admin"] .pimp-setting-head {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 4px !important;
  }
  body[data-page="pimp_profile"] .pimp-setting-head b,
  body[data-page="admin"] .pimp-setting-head b {
    font-size: 15px !important;
    line-height: 1.35;
  }
  body[data-page="pimp_profile"] .pimp-setting-head small,
  body[data-page="pimp_profile"] .pimp-css-help,
  body[data-page="pimp_profile"] .pimp-layout-intro p,
  body[data-page="admin"] .pimp-setting-head small {
    font-size: 13px !important;
    line-height: 1.5 !important;
    opacity: .88;
  }
  body[data-page="pimp_profile"] .pimp-layout-columns {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  body[data-page="pimp_profile"] .pimp-layout-column,
  body[data-page="pimp_profile"] .pimp-layout-card,
  body[data-page="pimp_profile"] .pimp-css-editor {
    min-width: 0 !important;
    max-width: 100% !important;
  }
  body[data-page="pimp_profile"] .pimp-layout-actions,
  body[data-page="pimp_profile"] .pimp-layout-intro,
  body[data-page="pimp_profile"] .pimp-css-help {
    flex-direction: column !important;
    align-items: stretch !important;
  }
  body[data-page="pimp_profile"] .pimp-layout-actions > *,
  body[data-page="pimp_profile"] .pimp-layout-intro > a,
  body[data-page="pimp_profile"] .pimp-reset-btn {
    width: 100% !important;
    justify-content: center;
    text-align: center;
  }

  /* Admin pages: tables do not crush text. */
  body[data-page="admin"] table { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  body[data-page="admin"] th, body[data-page="admin"] td { white-space: normal; min-width: 110px; line-height: 1.4; }

  /* Navigation/search: readable touch targets. */
  .nav-primary a, .nav-utilities a, .nav-more summary,
  .mobile-menu-account-actions a, .utility-link {
    min-height: 42px;
    line-height: 1.25;
  }
  .retro-search { gap: 6px; }
  .retro-search input { min-width: 0; width: 100%; }

  /* Chat: keep input/status readable above mobile keyboards. */
  .chat-window, .chat-list { max-width: 100vw; }
  .chat-window input, .chat-window textarea { font-size: 16px !important; }
  .chat-message, .chat-bubble { overflow-wrap: anywhere; line-height: 1.42; }

  /* Footer links wrap instead of becoming tiny. */
  .retro-footer, .footer-links { gap: 8px; }
  .footer-links { display: flex; flex-wrap: wrap; }
}

@media (max-width: 560px) {
  body { font-size: 15px; }
  .retro-box-title { font-size: 15px !important; }
  .retro-pad { padding: 10px !important; }
  .friend-grid, .mini-people { gap: 8px !important; }

  /* Keep multi-button rows usable on narrow phones. */
  .profile-actionlist, .pimp-layout-actions, .mobile-menu-account-actions {
    gap: 7px !important;
  }
  .profile-actionlist > *, .pimp-layout-actions > * { max-width: 100%; }
}
