/* Explicit viewport positioning also avoids browser-specific dialog offsets. */
dialog.campaign-dialog,
dialog.wallet-dialog,
dialog.bills-dialog,
dialog.virtual-account-dialog {
  position: fixed;
  inset: 0;
  margin: auto;
  min-width: 0;
  max-width: calc(100vw - 16px);
  max-height: calc(100dvh - 32px);
  box-sizing: border-box;
}

/* Shared mobile treatment for customer, administrator, authentication, and storefront screens. */
@media (max-width: 760px) {
  html { -webkit-text-size-adjust: 100%; }
  body { overflow-x: hidden; }
  button, input, select, textarea { font-size: 16px; }
  .btn, .admin-btn, .store-button { min-height: 44px; }
  .shell, .admin-shell { display: block; min-height: 100dvh; }
  .mobile-nav-toggle { display:flex; align-items:center; gap:8px; position:sticky; top:0; z-index:30; width:100%; min-height:52px; padding:0 18px; border:0; background:#102338; color:#fff; font:800 13px/1 Inter,system-ui,sans-serif; letter-spacing:.2px; text-align:left; cursor:pointer; }
  .mobile-nav-toggle span { display:grid; place-items:center; width:25px; font-size:22px; line-height:1; }
  .admin-mobile-toggle { background:#111a2e; }
  .sidebar, .admin-side { display:none; position:static; width:100%; height:auto; max-height:none; min-height:0; padding:12px 14px 16px; overflow:visible; }
  .mobile-nav-open .sidebar, .mobile-nav-open .admin-side { display:block; }
  .sidebar-head { display:flex; align-items:center; justify-content:space-between; padding:8px 10px; margin:0 0 8px; background:transparent !important; border:0 !important; }
  .sidebar-head .tagline { display:none; }
  .sidebar .nav, .admin-side .admin-nav { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; max-height:56dvh; overflow:auto; padding:0 2px; }
  .sidebar .nav a, .admin-side .admin-nav a { min-height:44px; margin:0; padding:9px 10px; align-items:center; gap:8px; font-size:12px; }
  .sidebar .nav b, .admin-side .admin-nav b { flex:0 0 17px; width:17px; }
  .sidebar .nav-section, .admin-side .admin-label { display:none; }
  .side-foot { display:flex !important; align-items:center; justify-content:space-between; gap:12px; margin:14px 2px 0; padding:14px 8px 0; font-size:12px; }
  .side-foot div { margin:3px 0 0 !important; }
  .side-foot .btn { min-height:38px; }
  .main, .admin-main { width:100%; max-width:none; min-width:0; padding:18px 15px; }
  .topbar, .admin-top { flex-direction:column; align-items:flex-start; gap:12px; margin-bottom:18px; }
  .topbar h1, .admin-top h1, h1 { font-size:27px; }
  .admin-user { width:100%; text-align:left; padding:12px; border:1px solid var(--admin-line,#dfe3e8); border-radius:10px; background:#fff; }
  .project-switch { width:100%; min-height:44px; }
  .grid.stats, .stats, .service-grid, .two-col, .split-3, .admin-stats, .admin-two, .admin-three, .quick-send, .commerce-welcome { grid-template-columns:1fr !important; }
  .card, .admin-card { padding:17px; border-radius:13px; }
  .card-head, .wallet-section-title { align-items:flex-start; }
  .stat strong, .admin-stat strong { font-size:25px; }
  .flash, .admin-flash { padding:12px 14px; }
  .rova-dashboard-hero { padding:20px; border-radius:16px; }
  .hero-copy h2 { font-size:32px; letter-spacing:-1px; }
  .hero-actions { display:grid; grid-template-columns:1fr; }
  .hero-actions > * { width:100%; }
  .wallet-balance { min-height:52px; }
  .hero-metrics { grid-template-columns:1fr !important; }
  .hero-metric { min-height:0; padding:15px; }
  .quick-card { min-height:0; }
  .message-banner { padding:21px; border-radius:16px; }
  .message-banner h2 { font-size:29px; }
  .message-channel-stats, .message-metrics { grid-template-columns:1fr !important; }
  table, .admin-table { min-width:620px; }
  .message-table, .dashboard-campaigns, .wallet-history-scroll, .admin-card:has(table), .card:has(table) { overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .campaign-dialog, .wallet-dialog, .bills-dialog { width:calc(100vw - 16px); max-width:none; max-height:94dvh; border-radius:18px; }
  .compose-header, .compose-body { padding:19px; }
  .compose-header h2 { font-size:24px; }
  .compose-footer { position:sticky; bottom:0; padding:14px 19px; }
  .compose-footer > div { width:100%; }
  .compose-footer .btn { flex:1; }
  .channel-row { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .channel-option { min-height:94px; }
  .wallet-header .wallet-summary { grid-template-columns:1fr; }
  .wallet-account-preview { margin-top:5px; }
  .wallet-tabs { overflow-x:auto; display:flex; }
  .wallet-tabs button { min-width:118px; }
  .wallet-footer { flex-direction:column; align-items:stretch; }
  .wallet-footer button { min-height:40px; }
  .bills-header, .bills-body, .bill-checkout { padding-left:19px; padding-right:19px; }
  .bills-body, .bill-fields { grid-template-columns:1fr; }
  .bill-checkout-actions { display:grid; grid-template-columns:1fr; }
  .commerce-tabs { margin:0 -2px 15px; padding-bottom:3px; }
  .commerce-tabs a { min-height:42px; display:inline-flex; align-items:center; }
  .checkout-grid, .product-detail { margin-top:24px; padding-left:15px; padding-right:15px; }
  .checkout-card { padding:19px; }
  .store-head { padding:14px 16px; gap:13px; }
  .store-brand { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .store-hero { padding:46px 18px; }
  .store-hero h1, .product-detail h1 { font-size:31px; }
  .product-detail { gap:25px; }
  .detail-image, .detail-placeholder { min-height:270px; }
  .landing nav { padding:17px 18px; gap:14px; }
  .landing nav > div:last-child { display:flex; gap:8px; align-items:center; white-space:nowrap; font-size:13px; }
  .landing nav a[style] { margin-right:0 !important; }
  .landing nav .btn { min-height:38px; padding:8px 11px; }
  .landing .hero { padding:56px 19px 72px; }
  .landing h1 { font-size:39px; letter-spacing:-1.3px; }
  .landing-actions { display:grid; grid-template-columns:1fr; }
  .landing-actions .btn { width:100%; }
  .code-mini { margin-top:38px; overflow:auto; font-size:12px; }
  .auth-form { align-items:flex-start; padding:32px 20px; }
  .auth-box { max-width:none; }
}
@media (max-width: 390px) {
  .sidebar .nav, .admin-side .admin-nav { grid-template-columns:1fr; }
  .main, .admin-main { padding:15px 12px; }
  .hero-copy h2 { font-size:29px; }
  .channel-row { gap:5px; }
  .channel-option { padding:10px 6px; }
  .channel-name { font-size:11px; }
  .compose-footer > span { display:none; }
}
@media (min-width: 761px) { .mobile-nav-toggle { display:none; } }