/* Finance module — mobile-first polish */
@media (max-width:720px){
  /* Give the page room above the fixed bottom navigation. */
  body:has(.finance-stats) .container,
  body:has(.finance-outlook) .container{padding-bottom:112px}

  /* Finance header */
  .finance-page-head,
  .page-head:has(+ .finance-stats){display:block;margin-bottom:14px}
  .finance-page-head .title,
  .page-head .title{font-size:28px;line-height:1.05}
  .finance-page-head .actions,
  .page-head .actions{width:100%;margin-top:12px}
  #finance-season-select{width:100%;min-height:46px;padding:10px 12px;border-radius:12px;background:#fff;border:1px solid #d5e0d8;font-weight:800}

  /* KPI cards: compact 2 × 2 dashboard rather than four tall cards. */
  .finance-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-bottom:14px}
  .finance-stats .stat{min-width:0;padding:13px 11px;border-radius:14px;gap:9px}
  .finance-stats .stat-icon{width:34px;height:34px;border-radius:10px;flex:none;font-size:15px}
  .finance-stats .stat small{font-size:8px;letter-spacing:.06em;line-height:1.15}
  .finance-stats .stat strong{font-size:20px;line-height:1.1;white-space:nowrap}

  /* Finance content stacks naturally on a phone. */
  .finance-grid,
  .analytics-grid{grid-template-columns:1fr!important;gap:11px}
  .analytics-card{padding:15px!important;border-radius:15px}
  .analytics-card h3{font-size:16px}
  .analytics-card p{font-size:11px}

  /* Outlook / forecast becomes a clean 2 × 2 financial snapshot. */
  .finance-outlook{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:10px!important}
  .finance-outlook > div{min-width:0;padding:11px 10px;background:#f7faf8;border:1px solid #e3ebe5;border-radius:11px}
  .finance-outlook b{display:block;font-size:17px;line-height:1.15;margin-top:3px;white-space:nowrap}
  .finance-outlook small{font-size:9px;line-height:1.2}

  /* Tables: keep them readable without forcing the entire page sideways. */
  .finance-table-wrap,
  .finance-table-card,
  .analytics-card .table-wrap,
  .analytics-card .table-card{overflow:visible!important}
  .finance-table-wrap table,
  .finance-table-card table,
  .analytics-card .table-wrap table,
  .analytics-card .table-card table{min-width:0!important;width:100%}
  .finance-table-wrap thead,
  .finance-table-card thead,
  .analytics-card .table-wrap thead,
  .analytics-card .table-card thead{display:none}
  .finance-table-wrap tbody,
  .finance-table-card tbody,
  .analytics-card .table-wrap tbody,
  .analytics-card .table-card tbody{display:block}
  .finance-table-wrap tr,
  .finance-table-card tr,
  .analytics-card .table-wrap tr,
  .analytics-card .table-card tr{display:grid;grid-template-columns:1fr auto;gap:2px 12px;padding:12px 13px;border:1px solid #e4ebe6;border-radius:12px;margin-bottom:8px;background:#fff;box-shadow:0 3px 10px #18362908}
  .finance-table-wrap tr:last-child,
  .finance-table-card tr:last-child,
  .analytics-card .table-wrap tr:last-child,
  .analytics-card .table-card tr:last-child{margin-bottom:0}
  .finance-table-wrap td,
  .finance-table-card td,
  .analytics-card .table-wrap td,
  .analytics-card .table-card td{display:block;padding:0;border:0;text-align:left}
  .finance-table-wrap td:nth-child(1),
  .finance-table-card td:nth-child(1),
  .analytics-card .table-wrap td:nth-child(1),
  .analytics-card .table-card td:nth-child(1){font-weight:850;font-size:13px}
  .finance-table-wrap td:nth-child(2),
  .finance-table-card td:nth-child(2),
  .analytics-card .table-wrap td:nth-child(2),
  .analytics-card .table-card td:nth-child(2){color:#6f7d76;font-size:11px}
  .finance-table-wrap td:nth-child(3),
  .finance-table-card td:nth-child(3),
  .analytics-card .table-wrap td:nth-child(3),
  .analytics-card .table-card td:nth-child(3){grid-column:2;grid-row:1/3;text-align:right;font-weight:900;font-size:14px;align-self:center}
  .finance-table-wrap td:nth-child(4),
  .finance-table-card td:nth-child(4),
  .analytics-card .table-wrap td:nth-child(4),
  .analytics-card .table-card td:nth-child(4){grid-column:1/3;margin-top:5px}

  /* Section headers and action rows. */
  .section{margin-top:17px}
  .section-head{align-items:flex-start;margin-bottom:9px}
  .section-head h2{font-size:17px}
  .section-head p{font-size:11px}
  .actions .btn{flex:1;min-height:44px}

  /* Form controls in finance modals. */
  .modal{width:calc(100vw - 28px);max-height:calc(100vh - 40px);overflow:auto;border-radius:18px;padding:17px}
  .modal-actions{position:sticky;bottom:0;background:#fff;padding-top:10px}
}

@media (max-width:390px){
  .finance-stats .stat{padding:11px 9px}
  .finance-stats .stat-icon{display:none}
  .finance-stats .stat strong{font-size:18px}
  .finance-outlook{grid-template-columns:1fr 1fr}
}