/* Web safe areas; the Android host consumes its native insets before this viewport. */
@media (max-width:760px){
  body{padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px)}
  .app-shell{min-height:100dvh}
  .topbar{height:auto;min-height:76px;padding:10px 14px;gap:10px;top:env(safe-area-inset-top,0px);align-items:center}
  .topbar-title{flex:1;min-width:0}
  .topbar h1{font-size:19px;line-height:1.2;letter-spacing:-.3px}
  #dataStatus{display:block;line-height:1.35;font-size:12px;margin-top:4px;overflow-wrap:anywhere}
  .top-actions{flex:0 0 auto;max-width:30%}
  .budget-chip{display:block;white-space:normal;font-size:12px;padding:6px 8px;border-radius:12px;text-align:right;line-height:1.5}
  button.mobile-menu{width:44px;min-width:44px;height:44px;padding:0;font-size:22px;border-radius:12px;background:var(--panel)}
  .view{padding:16px 14px 32px}
  .grid{gap:12px}
  .grid.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .metric-grid>.kpi:last-child:nth-child(odd){grid-column:1/-1}
  .card{padding:15px;border-radius:16px;box-shadow:0 4px 16px rgba(0,0,0,.12)}
  .kpi{padding:14px;min-height:106px;display:flex;flex-direction:column;justify-content:center}
  .kpi small{font-size:14px;line-height:1.35}
  .kpi strong{font-size:25px;line-height:1.2;margin:7px 0 3px;font-variant-numeric:tabular-nums;letter-spacing:-.5px}
  .kpi>span{font-size:12px;line-height:1.4}
  .kpi>span:empty{display:none}
  .card h2{font-size:18px}.card h3{font-size:16px}
  .sidebar{top:env(safe-area-inset-top,0px);height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));overflow-y:auto;overscroll-behavior:contain;box-shadow:12px 0 35px rgba(0,0,0,.22)}
  .sidebar .nav-btn{min-height:44px}
  .brand .official-logo{width:48px;height:48px}
  .toolbar input{min-width:0;flex:1 1 160px}.toolbar select{flex:1 1 110px}
  .btn,.tab,input,select{min-height:44px}
  .table-wrap{max-width:100%;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
  th,td{padding:11px 10px}
  .setting-row{flex-wrap:wrap;gap:8px}.setting-row input,.setting-row select{max-width:100%}
  .section-head{flex-wrap:wrap}
  .modal-backdrop{padding:12px;padding-top:max(12px,env(safe-area-inset-top,0px));padding-bottom:max(12px,env(safe-area-inset-bottom,0px))}
  .modal,.modal.wide{width:100%;max-height:calc(100dvh - 24px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));padding:16px}
  .modal-head h2{font-size:20px}
  button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
}
@media(max-width:340px){.grid.metric-grid{grid-template-columns:1fr}.topbar{gap:7px;padding:9px}.view{padding:12px 10px 24px}.kpi strong{font-size:23px}}
@media(prefers-reduced-motion:reduce){.sidebar{transition:none}}