.mobile-account-profile,
.mobile-account-shortcuts { display: none; }

@media (max-width: 800px) {
  body[data-dashboard] .dashboard-shell {
    width: min(100% - 40px, 600px);
    padding: 8px 0 calc(112px + env(safe-area-inset-bottom));
  }
  body[data-dashboard] .dashboard-head { display: block; margin-bottom: 24px; }
  body[data-dashboard] .dashboard-head h1 { font-size: 28px; line-height: 1.3; }
  body[data-dashboard] .dashboard-head p { font-size: 14px; line-height: 1.6; }
  body[data-dashboard] .dashboard-nav {
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
    margin-top: 16px;
    padding-bottom: 4px;
    overflow-x: auto;
    scrollbar-width: none;
    overscroll-behavior-x: contain;
  }
  body[data-dashboard] .dashboard-nav::-webkit-scrollbar { display: none; }
  body[data-dashboard] .dashboard-nav a,
  body[data-dashboard] .dashboard-nav button {
    flex: 0 0 auto;
    min-height: 44px;
    padding: 0 16px;
    border: 0;
    border-radius: 14px;
    background: #fff;
    font-size: 14px;
    white-space: nowrap;
  }
  body[data-dashboard] .dashboard-nav a[aria-current="page"] { background: var(--mobile-soft, #eaf0ff); color: var(--primary); }
  body[data-dashboard="account"] .dashboard-head { display: none; }
  body[data-dashboard="account"] .dashboard-nav,
  body[data-dashboard="billing"] .dashboard-nav,
  body[data-dashboard="invite"] .dashboard-nav,
  body[data-dashboard="ml"] .dashboard-nav { display: none; }
  body[data-dashboard] .dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 12px; }
  body[data-dashboard] .dashboard-card {
    grid-column: 1 / -1;
    padding: 20px;
    border: 1px solid var(--mobile-line, #e4e9f2);
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 6px 24px #243c6f04;
  }
  body[data-dashboard] .dashboard-card h2 { font-size: 20px; line-height: 1.4; margin-bottom: 16px; }
  body[data-dashboard] .dashboard-card h3 { font-size: 16px; line-height: 1.5; }
  body[data-dashboard] .dashboard-card p { font-size: 14px; line-height: 1.7; }
  body[data-dashboard] .metric { font-size: 36px; line-height: 1.2; font-variant-numeric: tabular-nums; }
  body[data-dashboard] .metric small { display: block; margin: 8px 0 0; font-size: 12px; }
  body[data-dashboard] .dashboard-button { min-height: 48px; padding: 8px 16px; border-radius: 14px; font-size: 14px; line-height: 1.5; text-align: center; }
  body[data-dashboard] .dashboard-button.secondary { background: var(--mobile-soft, #eaf0ff); border-color: transparent; color: var(--primary); }
  body[data-dashboard] .dashboard-button:disabled { opacity: .55; }
  body[data-dashboard] .dashboard-field { gap: 8px; margin: 16px 0; }
  body[data-dashboard] .dashboard-field label { font-size: 14px; }
  body[data-dashboard] .dashboard-field input,
  body[data-dashboard] .dashboard-field select,
  body[data-dashboard] .dashboard-field textarea {
    min-height: 48px;
    border-radius: 14px;
    border-color: var(--mobile-line, #e4e9f2);
    background: #f7f9fc;
    font-size: 16px;
  }
  body[data-dashboard] .record-list { gap: 12px; }
  body[data-dashboard] .record { padding: 16px; border-radius: 16px; border-color: var(--mobile-line, #e4e9f2); background: #f8faff; }
  body[data-dashboard] .record { grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: start; }
  body[data-dashboard] .history-record,
  body[data-dashboard] .reward-withdrawal { grid-template-columns: minmax(0, 1fr); }
  body[data-dashboard] .record > strong { text-align: right; font-variant-numeric: tabular-nums; }
  body[data-dashboard] .record-meta { font-size: 12px; line-height: 1.7; }
  body[data-dashboard] .record-actions { flex-wrap: wrap; gap: 8px; justify-content: flex-start; }
  body[data-dashboard] .record-actions .dashboard-button { flex: 1 1 auto; }
  body[data-dashboard] .status-pill { border-radius: 10px; padding: 6px 10px; font-size: 12px; }
  body[data-dashboard] .dashboard-message { border-radius: 16px; font-size: 14px; }

  body[data-dashboard="account"] .mobile-account-profile {
    display: flex;
    align-items: center;
    gap: 12px;
    grid-column: 1 / -1;
    order: -1;
    margin-bottom: 4px;
    min-width: 0;
  }
  .mobile-account-profile .mobile-account-avatar { flex: 0 0 56px; width: 56px; height: 56px; display: grid; place-items: center; border-radius: 50%; background: var(--primary); color: #fff; font-size: 20px; font-weight: 700; }
  .mobile-account-profile > div { min-width: 0; }
  .mobile-account-profile h2 { margin: 0 0 4px; font-size: 20px; }
  .mobile-account-profile p { margin: 0; color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }
  body[data-dashboard="account"] .mobile-credit-wallet {
    order: 0;
    position: relative;
    padding: 24px;
    color: #fff;
    background: var(--primary);
    border-color: var(--primary);
    box-shadow: 0 10px 28px #234cea1a;
  }
  body[data-dashboard="account"] .mobile-credit-wallet h2 { font-size: 14px; margin: 0 0 12px; }
  body[data-dashboard="account"] .mobile-credit-wallet .metric { font-size: 36px; letter-spacing: -.04em; }
  body[data-dashboard="account"] .mobile-credit-wallet small,
  body[data-dashboard="account"] .mobile-credit-wallet p { color: #e7edff; font-size: 12px; }
  body[data-dashboard="account"] .mobile-credit-wallet p { margin: 12px 0 16px; }
  body[data-dashboard="account"] .mobile-credit-wallet .dashboard-button { min-width: 96px; background: #fff; color: var(--primary); border-color: #fff; }
  body[data-dashboard="account"] .mobile-account-shortcuts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; grid-column: 1 / -1; order: 1; }
  .mobile-account-shortcut { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; min-height: 120px; min-width: 0; padding: 16px; border: 1px solid var(--mobile-line, #e4e9f2); border-radius: 18px; background: #fff; text-decoration: none; color: var(--ink); }
  .mobile-account-shortcut > span { font-size: 12px; color: var(--muted); }
  .mobile-account-shortcut strong { display: block; font-size: 20px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
  .mobile-account-shortcut small { font-size: 12px; color: var(--primary); }
  .mobile-account-shortcut img { width: 20px; height: 20px; vertical-align: middle; margin-right: 4px; }
  body[data-dashboard="account"] .mobile-account-settings { order: 2; }
  body[data-dashboard="account"] .mobile-account-settings > h3,
  body[data-dashboard="account"] .mobile-account-settings > p:first-of-type { display: none; }
  body[data-dashboard="account"] .mobile-account-settings details { margin: 16px 0; }
  body[data-dashboard="account"] .mobile-account-settings summary { min-height: 48px; padding: 12px 0; cursor: pointer; font-size: 14px; font-weight: 700; }
  body[data-dashboard="account"] .mobile-account-settings [data-password-change-form] { padding: 0 0 16px; }
  body[data-dashboard="account"] .mobile-account-settings [data-password-change-form] > button { width: 100%; }
  body[data-dashboard="account"] .mobile-account-settings > button[data-logout] { width: 100%; margin-top: 8px; }
  body[data-dashboard="account"] .ml-card { order: 3; }
  body[data-dashboard="account"] .mobile-credit-ledger { order: 4; }

  body[data-dashboard="billing"] .package-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  body[data-dashboard="billing"] .package-option { min-width: 0; }
  body[data-dashboard="billing"] .package-option label { min-height: 104px; padding: 16px 8px; border-radius: 16px; border-color: var(--mobile-line, #e4e9f2); background: #f8faff; text-align: center; }
  body[data-dashboard="billing"] .package-option input:checked + label { background: var(--mobile-soft, #eaf0ff); border: 2px solid var(--primary); padding: 15px 7px; }
  body[data-dashboard="billing"] .package-option strong { font-size: clamp(14px, 4.2vw, 18px); line-height: 1.3; color: var(--ink); white-space: nowrap; }
  body[data-dashboard="billing"] .package-option span { display: block; margin-top: 8px; font-size: 12px; color: var(--muted); }
  body[data-dashboard="billing"] [data-payment-form] > button { width: 100%; }
  body[data-dashboard="billing"] .payment-box { padding: 16px; margin-top: 24px; border-radius: 20px; background: #f5f7ff; }
  body[data-dashboard="billing"] .payment-box > [data-payment-status] { display: block; font-size: 20px; line-height: 1.4; }
  body[data-dashboard="billing"] .payment-box [data-payment-amount] { font-variant-numeric: tabular-nums; font-size: 20px; }
  body[data-dashboard="billing"] .payment-terms { border-left: 0; border-radius: 14px; padding: 16px; background: var(--mobile-soft, #eaf0ff); font-size: 12px; }
  body[data-dashboard="billing"] .payment-qr { flex-direction: column; flex-wrap: nowrap; align-items: center; margin: 24px 0; }
  body[data-dashboard="billing"] .payment-qr img { width: min(222px, 100%); border-radius: 12px; }
  body[data-dashboard="billing"] .payment-qr figcaption { flex: 0 1 auto; max-width: 280px; text-align: center; font-size: 12px; }
  body[data-dashboard="billing"] .payment-address { padding: 12px; border: 1px solid var(--mobile-line, #e4e9f2); border-radius: 12px; background: #fff; font-size: 12px; line-height: 1.7; }
  body[data-dashboard="billing"] .payment-countdown { justify-content: space-between; padding: 12px; border-radius: 14px; background: #fff; }
  body[data-dashboard="billing"] .payment-countdown span { font-size: 12px; }
  body[data-dashboard="billing"] .payment-countdown strong { font-size: 28px; }
  body[data-dashboard="billing"] .payment-record { grid-template-columns: minmax(0, 1fr); }
  body[data-dashboard="billing"] .payment-record > .status-pill { justify-self: start; }

  body[data-dashboard="invite"] .mobile-invite-count,
  body[data-dashboard="invite"] .mobile-invite-total { grid-column: span 1; padding: 16px; }
  body[data-dashboard="invite"] .mobile-invite-count h2,
  body[data-dashboard="invite"] .mobile-invite-total h2 { font-size: 14px; }
  body[data-dashboard="invite"] .mobile-invite-count .metric,
  body[data-dashboard="invite"] .mobile-invite-total .metric { font-size: 28px; }
  body[data-dashboard="invite"] .invite-share { flex-direction: column; gap: 8px; }
  body[data-dashboard="invite"] .invite-share > input { font-size: 14px; }
  body[data-dashboard="invite"] .invite-share > button { width: 100%; }
  body[data-dashboard="invite"] .reward-wallet { border-top: 0; }
  body[data-dashboard="invite"] .reward-balances { grid-template-columns: 1fr; gap: 16px; }
  body[data-dashboard="invite"] .reward-balances > div { padding: 16px; border-radius: 16px; background: var(--mobile-soft, #eaf0ff); }
  body[data-dashboard="invite"] .reward-balances > div + div { background: #f6f7fa; }
  body[data-dashboard="invite"] .reward-balances p { margin: 0 0 8px; font-size: 12px; }
  body[data-dashboard="invite"] .reward-balances p:last-child { margin: 12px 0 0; }
  body[data-dashboard="invite"] [data-reward-form] > button[type="submit"] { width: 100%; }
  body[data-dashboard="invite"] .reward-convert-input [data-reward-max] { min-width: 64px; }
  body[data-dashboard="invite"] .reward-quote { padding: 16px; border-radius: 14px; font-size: 14px; line-height: 1.7; }
  body[data-dashboard="invite"] .invite-example { display: grid; gap: 8px; padding: 16px; border-radius: 16px; background: var(--mobile-soft, #eaf0ff); }
  body[data-dashboard="invite"] .invite-rules { padding-left: 20px; font-size: 14px; line-height: 1.8; }
  body[data-dashboard="invite"] .invite-rules li + li { margin-top: 12px; }
  body[data-dashboard="invite"] .reward-withdrawal { grid-template-columns: minmax(0, 1fr); }

  body[data-dashboard] .ml-card { border-top: 0; }
  body[data-dashboard] .ml-card h2 img { width: 28px; height: 28px; flex-basis: 28px; }
  body[data-dashboard="ml"] .ml-card { padding: 24px 20px; }
  body[data-dashboard="ml"] .ml-card > h2 { color: var(--muted); font-size: 14px; }
  body[data-dashboard="ml"] .ml-card > .ml-balance { font-size: 36px; color: var(--ink); padding: 8px 0 16px; }
  body[data-dashboard] .ml-totals { grid-template-columns: 1fr; gap: 16px; padding: 16px 0; }
  body[data-dashboard] .ml-totals > div { padding: 16px; border-radius: 16px; background: #f8faff; }
  body[data-dashboard] .ml-totals dt { font-size: 12px; }
  body[data-dashboard] .ml-totals dd { font-size: 16px; overflow-wrap: anywhere; }
  body[data-dashboard] .ml-outlook { padding: 16px; border: 0; border-radius: 16px; background: #fff9e7; }
  body[data-dashboard] .ml-rules { padding-left: 20px; font-size: 14px; line-height: 1.8; }

  body[data-dashboard="admin"] .dashboard-card { padding: 16px; }
  body[data-dashboard="admin"] .admin-section { margin-top: 32px; }
  body[data-dashboard="admin"] .admin-row,
  body[data-dashboard="admin"] .admin-user-row { grid-template-columns: minmax(0, 1fr); padding: 16px; margin: 12px 0; gap: 12px; border: 1px solid var(--mobile-line, #e4e9f2); border-radius: 18px; background: #f8faff; }
  body[data-dashboard="admin"] .admin-row > *,
  body[data-dashboard="admin"] .admin-user-row > * { grid-column: auto; min-width: 0; }
  body[data-dashboard="admin"] .admin-row .dashboard-field { margin: 0; }
  body[data-dashboard="admin"] .admin-row > label { display: flex; gap: 8px; align-items: center; min-height: 44px; }
  body[data-dashboard="admin"] .record { grid-template-columns: minmax(0, 1fr); }
  body[data-dashboard="admin"] .ledger-delta { text-align: left; }
  body[data-dashboard="admin"] .reward-admin-form { margin-top: 16px; }
  body[data-dashboard="admin"] .reward-admin-form button { width: 100%; }
  body[data-dashboard="admin"] .mobile-admin-table-scroll { width: 100%; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  body[data-dashboard="admin"] .mobile-admin-table-scroll table { min-width: 600px; }
  body[data-dashboard="admin"] details > summary { min-height: 44px; padding: 12px 0; }
}
