/* Shared portrait layout. Loaded after each page's desktop styles. */
.table-scroll { max-width:100%; overflow-x:auto; overscroll-behavior-x:contain; }
@media (max-width: 760px) {
  .app { display:block; padding-bottom:calc(80px + env(safe-area-inset-bottom)); }
  .app .sidebar { position:relative; width:100%; height:auto; flex-direction:row; justify-content:space-between; align-items:center; border-right:0; border-bottom:1px solid var(--border); }
  .sidebar .brand { padding:12px; gap:8px; border:0; }
  .sidebar .brand div { display:block; }
  .sidebar .brand .logo { display:grid; width:36px; height:36px; flex-shrink:0; }
  .sidebar .brand h1 { font-size:14px; }
  .sidebar .brand span { font-size:10px; }
  .sidebar .profile { padding:6px; gap:0; border:0; }
  .sidebar .profile > div { display:none !important; }
  .sidebar .logout-btn { display:flex; width:44px; height:44px; }
  .sidebar .nav { position:fixed; inset:auto 0 0; z-index:40; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:0; padding:6px 3px calc(6px + env(safe-area-inset-bottom)); background:var(--card); border-top:1px solid var(--border); box-shadow:0 -4px 20px rgba(15,23,42,.06); }
  .sidebar .nav button,.sidebar .nav a { position:relative; flex-direction:column; justify-content:center; gap:5px; padding:8px 1px; min-height:56px; min-width:0; border:0; font-size:17px; }
  .sidebar .nav .lbl { display:block; font-size:10px; line-height:1.3; text-align:center; overflow-wrap:anywhere; }
  .sidebar .nav .dot { position:absolute; top:5px; right:15%; margin:0; }
  .app .topbar { position:relative; padding:16px; flex-wrap:wrap; gap:12px; }
  .topbar h2 { font-size:23px; }
  .topbar > div { min-width:0; flex-wrap:wrap; }
  .topbar > div:last-child { gap:8px !important; }
  .synced { padding:8px 10px; font-size:12px; }
  .content { padding:16px 12px 28px; gap:14px; }
  .grid { gap:12px; }
  .g2,.g3 { grid-template-columns:minmax(0,1fr); }
  .g4 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .card { min-width:0; padding:16px; overflow-wrap:anywhere; }
  .card h3 { letter-spacing:.6px; }
  .kpi .val { font-size:25px; }
  .kpi .top { flex-wrap:wrap; gap:8px; }
  .kpi .sub { font-size:12px; }
  .alert,.goal-banner,.danger-zone { flex-wrap:wrap; gap:12px; padding:16px; }
  .goal-banner .v { font-size:30px; }
  .acc-row { display:grid; grid-template-columns:32px minmax(0,1fr) auto; gap:8px; }
  .acc-row .tile { width:32px; height:32px; }
  .acc-row .amt { grid-column:2; text-align:left; margin:0; font-size:14px; }
  .acc-row .edit-balance-btn { grid-column:3; grid-row:1 / span 2; }
  .acc-head { gap:8px; padding:8px; }
  .bud .r1 { flex-wrap:wrap; gap:8px; }
  .bud .nums { overflow-wrap:anywhere; }
  .filter-bar > * { min-width:0; max-width:100%; flex:1 1 140px; }
  .filter-bar input,.filter-bar select { width:100%; }
  .table-scroll table { min-width:580px; }
  .overlay { padding:12px; z-index:100; }
  .overlay .modal { width:100% !important; max-width:480px; max-height:calc(100dvh - 24px); padding:20px; overscroll-behavior:contain; }
  .modal h3 { overflow-wrap:anywhere; }
  .row2 { flex-direction:column; }
  .row2 > * { min-width:0; }
  input:not([type=checkbox]):not([type=file]),select,textarea { min-width:0; font-size:16px !important; }
  .btn,.edit-balance-btn,.new-chat-btn,.chat-tab-action,.chat-tab-main { min-height:44px; }
  .chat-wrap { grid-template-columns:minmax(0,1fr); }
  .card.chat { padding:0; height:auto; }
  .chat-workspace { grid-template-columns:minmax(0,1fr); height:auto; }
  .chat-history { border-right:0; border-bottom:1px solid var(--border); padding:12px; }
  .chat-tabs { max-height:156px; flex:auto; }
  .chat-tab { flex-shrink:0; }
  .chat-tab-action.rename { display:block; }
  .chat-tab-action { min-width:44px; }
  .chat-main { height:65dvh; min-height:340px; }
  .msgs { padding:12px; }
  .msg { max-width:100%; min-width:0; gap:6px; }
  .bubble { min-width:0; padding:12px; overflow-wrap:anywhere; }
  .composer { padding:10px; gap:6px; }
  .composer input { width:0; padding:12px 10px; }
  .composer .btn { padding:10px 12px; flex-shrink:0; }
  body > header { height:auto; min-height:72px; padding:16px; flex-wrap:wrap; gap:14px; }
  body > header nav a { display:inline-flex; align-items:center; min-height:44px; }
  .auth-card { width:calc(100% - 24px); max-width:400px; padding:24px; margin:16px auto; }
  dialog { max-height:calc(100dvh - 24px); overflow:auto; padding:20px; }
  .actions { flex-wrap:wrap; }
  body:has(.app) #pwa-install { bottom:calc(86px + env(safe-area-inset-bottom)) !important; }
}