/* ============================================================
   KUPR Mobile-First Responsive CSS
   Shared utilities + page-specific mobile overrides
   Breakpoints: 768px (tablet), 480px (small phone)
   ============================================================ */

/* --- Global: Touch Target Minimums --- */
@media (max-width: 768px) {
  .kupr-touch-btn {
    min-height: 44px !important;
    min-width: 44px !important;
    padding: 10px 14px !important;
    font-size: 13px !important;
  }
  .kupr-touch-link {
    display: inline-block;
    min-height: 44px;
    line-height: 44px;
    padding: 0 8px;
  }
}

/* --- Global: Font Size Floor (11px minimum on mobile) --- */
@media (max-width: 768px) {
  .kupr-fs-floor {
    font-size: 11px !important;
  }
  .kupr-fs-floor-12 {
    font-size: 12px !important;
  }
}

/* --- Global: iOS Auto-Zoom Prevention --- */
@media (max-width: 768px) {
  input[type="text"],
  input[type="number"],
  input[type="email"],
  input[type="password"],
  input[type="url"],
  input[type="search"],
  input[type="tel"],
  textarea,
  select {
    font-size: 16px !important;
  }
}

/* --- Global: Form Elements Touch-Friendly --- */
@media (max-width: 768px) {
  .kupr-form-input {
    min-height: 44px !important;
    font-size: 16px !important;
    padding: 10px 12px !important;
  }
  .kupr-form-select {
    min-height: 44px !important;
    font-size: 16px !important;
    padding: 8px 12px !important;
  }
  .kupr-form-btn {
    min-height: 48px !important;
    font-size: 15px !important;
    padding: 12px 20px !important;
    width: 100% !important;
  }
}

/* --- Global: Grid Collapse --- */
@media (max-width: 480px) {
  .kupr-grid-collapse {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
}
@media (max-width: 768px) {
  .kupr-grid-2col {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* --- Global: Table Responsive Wrapper --- */
@media (max-width: 768px) {
  .kupr-table-wrap {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    margin: 0 -8px;
    padding: 0 8px;
  }
  .kupr-table-wrap table {
    min-width: 600px;
  }
}

/* --- Global: Flex Column Collapse --- */
@media (max-width: 480px) {
  .kupr-flex-col {
    flex-direction: column !important;
    align-items: stretch !important;
  }
  .kupr-flex-col > * {
    width: 100% !important;
  }
}
@media (max-width: 768px) {
  .kupr-flex-wrap {
    flex-wrap: wrap !important;
  }
}

/* --- Global: Spacing Reductions on Mobile --- */
@media (max-width: 480px) {
  .kupr-pad-sm {
    padding: 12px !important;
  }
  .kupr-pad-xs {
    padding: 8px !important;
  }
  .kupr-gap-sm {
    gap: 8px !important;
  }
}

/* --- Global: Full-Width Buttons on Mobile --- */
@media (max-width: 480px) {
  .kupr-btn-full {
    width: 100% !important;
    display: block !important;
    text-align: center !important;
  }
}

/* --- Global: Text Truncation --- */
.kupr-truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* --- Global: Card Padding Reduction --- */
@media (max-width: 480px) {
  .kupr-card-mobile {
    padding: 12px !important;
    border-radius: 8px !important;
  }
}

/* --- Global: Stat Numbers Scale Down --- */
@media (max-width: 480px) {
  .kupr-stat-num {
    font-size: 20px !important;
  }
  .kupr-stat-label {
    font-size: 11px !important;
  }
}
@media (min-width: 481px) and (max-width: 768px) {
  .kupr-stat-num {
    font-size: 24px !important;
  }
}

/* --- Global: Hide on Mobile / Show on Mobile --- */
@media (max-width: 480px) {
  .kupr-hide-xs {
    display: none !important;
  }
}
@media (max-width: 768px) {
  .kupr-hide-sm {
    display: none !important;
  }
}
@media (min-width: 769px) {
  .kupr-show-sm-only {
    display: none !important;
  }
}

/* --- Price Ticker Mobile --- */
@media (max-width: 480px) {
  #price-ticker-wrap {
    height: 28px !important;
  }
  #price-ticker-wrap .ptk-item {
    font-size: 11px !important;
    padding: 0 10px !important;
  }
  #price-ticker-wrap .ptk-dn,
  #price-ticker-wrap .ptk-up {
    font-size: 11px !important;
  }
}

/* --- Leaderboard Mobile --- */
@media (max-width: 480px) {
  .kupr-lb-avatar {
    width: 32px !important;
    height: 32px !important;
  }
  .kupr-lb-payout {
    font-size: 14px !important;
  }
  .kupr-lb-name {
    font-size: 12px !important;
  }
}

/* --- Scrollbar Thin for Mobile Tables --- */
@media (max-width: 768px) {
  .kupr-table-wrap::-webkit-scrollbar {
    height: 4px;
  }
  .kupr-table-wrap::-webkit-scrollbar-track {
    background: rgba(255,255,255,0.05);
    border-radius: 2px;
  }
  .kupr-table-wrap::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.2);
    border-radius: 2px;
  }
}

/* ============================================================
   KUPR Mobile App (Capacitor WebView) — Layout Fixes
   Premium mobile-first UX for app-like experience
   ============================================================ */

/* ─── SETTINGS SIDEBAR → Horizontal Scroll Tabs ─────────────
   Converts full-height vertical sidebar to horizontal tabs.
   Uses ID selector (#wo_main_sett_side) for max specificity to prevent
   flash of vertical menu during AJAX tab navigation.
   ──────────────────────────────────────────────────────────── */
@media (max-width: 990px) {
  /* NUCLEAR: Hide sidebar until JS transforms it — eliminates vertical flash */
  #wo_main_sett_side {
    visibility: hidden !important;
    max-height: 52px !important;
    overflow: hidden !important;
  }
  #wo_main_sett_side[data-kupr-ready] {
    visibility: visible !important;
  }
  .wo_setting_sidebar,
  .wow_sett_sidebar {
    position: sticky !important;
    top: 48px !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 999 !important;
    width: 100% !important;
    height: auto !important;
    max-height: 52px !important;
    min-height: 48px !important;
    overflow: hidden !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    text-align: left !important;
    border-bottom: 1px solid rgba(255,215,0,0.15) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important;
    padding: 0 !important;
    margin: 0 !important;
    background: #0d1117 !important;
  }
  .wo_setting_sidebar ul,
  .wow_sett_sidebar ul,
  .wow_sett_sidebar > ul.list-unstyled {
    display: flex !important;
    flex-wrap: nowrap !important;
    flex-direction: row !important;
    white-space: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    margin: 0 !important;
    padding: 0 4px !important;
    border: none !important;
    box-shadow: none !important;
    gap: 0 !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    list-style: none !important;
    max-height: 52px !important;
    align-items: stretch !important;
  }
  .wo_setting_sidebar ul::-webkit-scrollbar,
  .wow_sett_sidebar ul::-webkit-scrollbar {
    display: none !important;
    height: 0 !important;
  }
  .wo_setting_sidebar ul li,
  .wo_setting_sidebar ul .list-group-item,
  .wow_sett_sidebar ul li,
  .wow_sett_sidebar ul .list-group-item {
    display: inline-flex !important;
    flex-shrink: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    height: auto !important;
    max-height: 52px !important;
    border: none !important;
    background: transparent !important;
    float: none !important;
    width: auto !important;
  }
  .wo_setting_sidebar ul li a,
  .wo_setting_sidebar ul .list-group-item a,
  .wow_sett_sidebar ul li a,
  .wow_sett_sidebar > ul > li > a,
  .wow_sett_sidebar ul .list-group-item a {
    display: flex !important;
    align-items: center !important;
    padding: 14px 14px !important;
    font-size: 12px !important;
    white-space: nowrap !important;
    gap: 6px !important;
    opacity: 0.6;
    transition: opacity 0.2s, border-color 0.2s;
    text-decoration: none !important;
    border-bottom: 2px solid transparent !important;
    box-shadow: none !important;
    color: #c9d1d9 !important;
    line-height: 1 !important;
    min-width: auto !important;
    background: transparent !important;
    font-weight: normal !important;
  }
  .wo_setting_sidebar ul li a:hover,
  .wow_sett_sidebar ul li a:hover,
  .wow_sett_sidebar > ul > li > a:hover,
  .wo_setting_sidebar ul li.active a,
  .wo_setting_sidebar ul li.avtive a,
  .wow_sett_sidebar ul li.active a,
  .wow_sett_sidebar > ul > li.active > a,
  .wow_sett_sidebar ul li.avtive a,
  .wow_sett_sidebar > ul > li.profile.active > a,
  .wow_sett_sidebar > ul > li.social.active > a,
  .wow_sett_sidebar > ul > li.notifications.active > a {
    opacity: 1 !important;
    color: #FFD700 !important;
    border-bottom-color: #FFD700 !important;
    box-shadow: none !important;
    font-weight: 600 !important;
    background: rgba(255,215,0,0.08) !important;
  }
  .wo_setting_sidebar ul li a svg,
  .wow_sett_sidebar ul li a svg,
  .wow_sett_sidebar > ul > li > a span svg {
    width: 16px !important;
    height: 16px !important;
    flex-shrink: 0;
  }
  /* Hide HR separators in settings sidebar on mobile */
  .wow_sett_sidebar > ul hr,
  .wo_setting_sidebar ul hr {
    display: none !important;
  }

  /* Settings page layout — sidebar on top, content below */
  .setting-panel {
    display: flex !important;
    flex-direction: column !important;
  }
  .setting-panel #wo_main_sett_side,
  .setting-panel .wo_new_sett_sidee {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    float: none !important;
    padding: 0 !important;
    position: relative !important;
  }
  .setting-panel #wo_main_sett_mid,
  .setting-panel .wo_new_sett_pagee {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    float: none !important;
    margin-top: 8px !important;
    padding: 10px 8px !important;
  }
  .page-margin {
    padding: 0 !important;
    margin: 0 !important;
  }
}

/* ─── ACCOUNT DROPDOWN MENU ───────────────────────────────── */
@media (max-width: 990px) {
  .navbar-default .open > .dropdown-menu.ani-acc-menu {
    max-height: 50vh !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    position: fixed !important;
    top: 48px !important;
    right: 0 !important;
    left: auto !important;
    width: 280px !important;
    z-index: 99999 !important;
    border-radius: 0 0 0 12px !important;
    box-shadow: -4px 4px 16px rgba(0,0,0,0.4) !important;
  }
}
@media (max-width: 530px) {
  .navbar-default .open > .dropdown-menu.ani-acc-menu {
    width: 85% !important;
    max-width: 300px !important;
    left: auto !important;
    right: 0 !important;
    border-radius: 0 0 0 12px !important;
    max-height: 55vh !important;
  }
}

/* ─── NOTIFICATION / GENERAL DROPDOWNS ───────────────────── */
@media (max-width: 767px) {
  .notfi-dropdown {
    position: fixed !important;
    top: 48px !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-height: 65vh !important;
    overflow-y: auto !important;
    border-radius: 0 !important;
    z-index: 99998 !important;
  }
  .search-dropdown-container {
    width: 100% !important;
    max-width: 100vw !important;
  }
}

/* ─── CHAT PADDING OVERRIDE ──────────────────────────────── */
@media (max-width: 990px) {
  body,
  .navbar-default,
  .wo_about_wrapper_parent {
    padding-right: 0 !important;
  }
}

/* ─── TOP NAVBAR — Compact Mobile ──────────────────────────
   Make the top navbar slimmer for more content area
   ──────────────────────────────────────────────────────────── */
@media (max-width: 990px) {
  .navbar-default.navbar-fixed-top {
    min-height: 48px !important;
    height: 48px !important;
  }
  .navbar-default .navbar-nav > li > a {
    padding: 12px 8px !important;
  }
  .navbar-default .navbar-nav > li > a svg {
    width: 20px !important;
    height: 20px !important;
  }
  /* Hide some less-needed nav items on small phones */
  .content-container {
    margin-top: 48px !important;
    padding-top: 0 !important;
  }
}

/* ─── "KUPR IS LIVE?" BANNER — kept visible per user request ─── */

/* ─── SIDEBAR WIDGETS — Right Column ─────────────────────── */
@media (max-width: 990px) {
  /* Hide right sidebar widgets on mobile (trending, pro members, etc.)
     BUT NOT the settings sidebar (#wo_main_sett_side) */
  .right_sidebar,
  .wo_sidebar,
  .content-container > .container > .row > .col-md-4:last-child:not(#wo_main_sett_side):not(.wo_new_sett_sidee) {
    display: none !important;
  }
  /* Give main content full width */
  .content-container > .container > .row > .col-md-8,
  .content-container > .container > .row > .col-md-7,
  .wo_about_wrapper_parent > .container > .row > .col-md-8 {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    padding: 0 8px !important;
  }
}

/* ─── PROFILE PAGE — Compact Mobile ─────────────────────── */
@media (max-width: 767px) {
  .wo_user_profile .pic-info-cont {
    padding: 10px !important;
  }
  .wo_user_profile .pic-info-cont .user-avatar {
    margin: -50px auto 0 !important;
  }
  .wo_user_profile .btn-glossy {
    text-align: center !important;
    padding: 5px 0 !important;
  }
  .wo_user_profile .btn-glossy a,
  .wo_user_profile .btn-glossy button {
    margin: 3px !important;
    padding: 6px 12px !important;
    font-size: 12px !important;
  }
  /* Profile tabs horizontal scroll */
  .wo_user_profile .profile-tabs,
  .wo_user_profile .nav-tabs {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    white-space: nowrap !important;
  }
  .wo_user_profile .profile-tabs::-webkit-scrollbar,
  .wo_user_profile .nav-tabs::-webkit-scrollbar {
    display: none !important;
  }
  .wo_user_profile .profile-tabs > li,
  .wo_user_profile .nav-tabs > li {
    flex-shrink: 0 !important;
  }
}

/* ─── POST CARDS — Mobile Optimization ───────────────────── */
@media (max-width: 767px) {
  .post_box,
  .wo_post_sec {
    border-radius: 0 !important;
    margin-left: -8px !important;
    margin-right: -8px !important;
    border-left: none !important;
    border-right: none !important;
  }
  .post_box .post_text,
  .wo_post_sec .post_text {
    font-size: 14px !important;
    line-height: 1.5 !important;
  }
  /* Post action buttons (like, comment, share) spacing */
  .post_box .post-btn-actions a,
  .post_box .reaction_btn,
  .wo_post_sec .reaction_btn {
    padding: 8px 12px !important;
    font-size: 13px !important;
  }
}

/* ─── CREATE POST BOX — Mobile ───────────────────────────── */
@media (max-width: 767px) {
  .new_post_blox,
  .create-post-box {
    border-radius: 0 !important;
    margin: 0 -8px 8px !important;
    padding: 10px !important;
  }
  .new_post_blox textarea,
  .create-post-box textarea {
    font-size: 15px !important;
    min-height: 60px !important;
  }
}

/* ─── MODAL DIALOGS ──────────────────────────────────────── */
@media (max-width: 767px) {
  .modal-dialog {
    margin: 10px auto !important;
    max-width: 95% !important;
  }
  .modal-body {
    max-height: 70vh !important;
    overflow-y: auto !important;
  }
}

/* ─── CONTENT CONTAINER ──────────────────────────────────── */
@media (max-width: 767px) {
  .content-container {
    min-height: calc(100vh - 48px) !important;
  }
}

/* ─── FORUM / PAGES — Mobile ─────────────────────────────── */
@media (max-width: 767px) {
  .forum-thread-list td,
  .forum-thread-list th {
    padding: 8px 6px !important;
    font-size: 13px !important;
  }
  .forum-post .post-content {
    padding: 10px !important;
  }
}

/* ─── SMOOTH TRANSITIONS ─────────────────────────────────── */
@media (max-width: 990px) {
  a, button, .btn {
    -webkit-tap-highlight-color: transparent;
  }
  * {
    -webkit-touch-callout: none;
  }
  /* Allow text selection only on text content */
  p, span, h1, h2, h3, h4, h5, h6, .post_text, textarea, input {
    -webkit-touch-callout: default;
    -webkit-user-select: text;
    user-select: text;
  }
}

/* ─── CAPACITOR SAFE AREA (notch phones) ─────────────────── */
@supports (padding-top: env(safe-area-inset-top)) {
  .navbar-default.navbar-fixed-top {
    padding-top: env(safe-area-inset-top) !important;
  }
  .content-container {
    padding-bottom: env(safe-area-inset-bottom) !important;
  }
}

/* ============================================================
   KUPR Mobile Bottom Navigation Bar
   Instagram/Twitter style bottom tab bar
   Only visible on mobile (<= 990px)
   ============================================================ */
#kupr-bottom-nav {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  height: 56px;
  background: #0d1117;
  border-top: 1px solid rgba(255,215,0,0.12);
  z-index: 99999;
  align-items: center;
  justify-content: space-around;
  padding: 0 4px;
  padding-bottom: env(safe-area-inset-bottom, 0px);
  box-shadow: 0 -2px 12px rgba(0,0,0,0.5);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  background: rgba(13,17,23,0.95);
}

.kupr-bnav-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-decoration: none !important;
  color: #8b949e !important;
  font-size: 10px;
  font-weight: 500;
  padding: 4px 0;
  min-width: 52px;
  transition: color 0.2s;
  -webkit-tap-highlight-color: transparent;
  position: relative;
}
.kupr-bnav-item svg {
  margin-bottom: 2px;
}
.kupr-bnav-item:hover,
.kupr-bnav-item:active {
  color: #c9d1d9 !important;
  text-decoration: none !important;
}
.kupr-bnav-item.active {
  color: #FFD700 !important;
}
.kupr-bnav-item.active::after {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 24px;
  height: 2px;
  background: #FFD700;
  border-radius: 0 0 2px 2px;
}

/* Center button (Predict) — raised gold circle */
.kupr-bnav-center .kupr-bnav-plus {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: linear-gradient(135deg, #FFD700 0%, #FFA500 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: -18px;
  margin-bottom: 0;
  box-shadow: 0 2px 12px rgba(255,215,0,0.4);
  transition: transform 0.2s;
}
.kupr-bnav-center .kupr-bnav-plus svg {
  color: #0d1117 !important;
  stroke: #0d1117;
  margin-bottom: 0;
}
.kupr-bnav-center:active .kupr-bnav-plus {
  transform: scale(0.9);
}
.kupr-bnav-center span {
  margin-top: -2px;
}

/* Avatar in bottom nav */
.kupr-bnav-avatar {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  object-fit: cover;
  margin-bottom: 2px;
  border: 1.5px solid #8b949e;
}
.kupr-bnav-item.active .kupr-bnav-avatar {
  border-color: #FFD700;
}

/* Hide bottom nav on desktop */
@media (min-width: 991px) {
  #kupr-bottom-nav {
    display: none !important;
  }
}

/* Adjust body padding when bottom nav is visible */
@media (max-width: 990px) {
  body {
    padding-bottom: 60px !important;
  }
}

/* ============================================================
   NFT MARKETPLACE — MOBILE RESPONSIVE OVERRIDES
   (kupr-mobile.css overrides inline styles in nft/content.phtml)
   ============================================================ */
@media (max-width: 990px) {
  /* Page container — prevent horizontal overflow */
  .nft-page {
    max-width: 100vw !important;
    overflow-x: hidden !important;
    padding: 12px 10px 30px !important;
    box-sizing: border-box !important;
  }

  /* Hero — compact for mobile */
  .nft-hero {
    padding: 20px 15px 18px !important;
    margin-bottom: 16px !important;
    border-radius: 12px !important;
  }
  .nft-hero h1 {
    font-size: 20px !important;
  }
  .nft-hero .subtitle {
    font-size: 12px !important;
  }
  .nft-hero-stats {
    gap: 14px !important;
    flex-wrap: wrap !important;
    margin-top: 14px !important;
  }
  .nft-hero-stat .num {
    font-size: 18px !important;
  }
  .nft-hero-stat .lbl {
    font-size: 10px !important;
  }

  /* Action bar — stack vertically */
  .nft-actions {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
    margin-bottom: 16px !important;
  }

  /* Filter pills hidden on mobile — replaced by dropdown in content.phtml */

  /* Right actions — full width, wrap nicely */
  .nft-actions-right {
    flex-wrap: wrap !important;
    gap: 8px !important;
    width: 100% !important;
  }

  /* Search — full width instead of fixed 200px */
  .nft-search-wrap {
    flex: 1 !important;
    min-width: 0 !important;
  }
  .nft-search-wrap input {
    width: 100% !important;
    font-size: 13px !important;
  }

  /* Sort dropdown — flexible */
  .nft-sort {
    flex: 0 1 auto !important;
  }
  .nft-sort select {
    width: 100% !important;
    font-size: 12px !important;
    padding: 7px 10px !important;
  }

  /* Create / My NFTs buttons — compact */
  .nft-btn-create,
  .nft-btn-mynfts {
    padding: 8px 14px !important;
    font-size: 13px !important;
    text-align: center !important;
    flex: 1 !important;
    min-width: 0 !important;
  }

  /* Grid — 2 columns on mobile */
  .nft-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
  }

  /* NFT Cards — tighter on mobile */
  .nft-card {
    border-radius: 10px !important;
  }
  .nft-card-body {
    padding: 10px !important;
  }
  .nft-card-name {
    font-size: 13px !important;
  }
  .nft-card-price {
    font-size: 12px !important;
  }
  .nft-card-footer {
    padding: 8px 10px !important;
    font-size: 11px !important;
  }

  /* Auction countdown badge */
  .nft-auction-badge {
    font-size: 10px !important;
    padding: 3px 8px !important;
  }

  /* Empty state */
  .nft-empty {
    padding: 30px 15px !important;
  }
  .nft-empty h3 {
    font-size: 16px !important;
  }
}

/* Very small phones — single column grid */
@media (max-width: 420px) {
  .nft-grid {
    grid-template-columns: 1fr !important;
  }
  .nft-hero-stats {
    gap: 10px !important;
  }
  .nft-actions-right {
    flex-direction: column !important;
  }
  .nft-search-wrap {
    width: 100% !important;
  }
}

/* ============================================================
   GENERAL MOBILE UX IMPROVEMENTS
   ============================================================ */
@media (max-width: 990px) {
  /* Prevent any horizontal overflow globally */
  .content-container,
  #content,
  .page-margin,
  .container {
    max-width: 100vw !important;
    overflow-x: hidden !important;
  }

  /* Dropdown menus — constrain to viewport */
  .dropdown-menu {
    max-width: calc(100vw - 20px) !important;
    overflow-x: hidden !important;
  }

  /* Tables — horizontal scroll wrapper (scoped to content area) */
  .content-container table,
  .page-margin table,
  #content table {
    display: block !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    max-width: 100% !important;
  }

  /* Images — never exceed container (exclude small icons/avatars) */
  .content-container img,
  .page-margin img,
  #content img {
    max-width: 100% !important;
    height: auto !important;
  }

  /* Predictions page mobile improvements */
  .pred-hero {
    padding: 20px 12px !important;
    border-radius: 12px !important;
  }
  .pred-hero h1 {
    font-size: 20px !important;
  }

  /* Bounty page mobile */
  .bounty-hero {
    padding: 20px 12px !important;
  }

  /* Wallet page mobile */
  .wallet-section {
    padding: 15px 12px !important;
  }

  /* Launchpad page mobile */
  .launchpad-hero {
    padding: 20px 12px !important;
  }

  /* Token page mobile */
  .token-hero {
    padding: 20px 15px !important;
  }

  /* Generic cards — rounded, padded */
  .wo_posts_list .post-card,
  .posts_item {
    border-radius: 0 !important;
    margin-left: -15px !important;
    margin-right: -15px !important;
  }
}