/* Mobile report layout, preserving the desktop Portal treatment. */
.timeline-navigation { display:none; }
#people-picker:not([open]) .people-options { display:none; }
html, body { max-width:100%; overflow-x:clip; }
@media (max-width:650px), (max-width:950px) and (pointer:coarse) {
  html, body { font-size:15px; -webkit-text-size-adjust:100%; }
  main { width:100%; min-width:0; padding:8px 4px 12px!important; }
  .report-head { display:flex; flex-wrap:nowrap; gap:8px; align-items:center; padding:12px 12px 0; background:var(--surface); border-radius:8px 8px 0 0; }
  .report-head h1 { font-size:21px!important; padding:0!important; border-radius:0; letter-spacing:-.5px!important; }
  .header-tools { width:auto; flex:none; padding:0; margin-left:auto; }
  #theme { width:44px; height:44px; min-height:44px; padding:8px; font-size:21px; }
  .report-paper, html.paper .report-paper { padding:0 12px 20px!important; border-radius:0 0 8px 8px!important; }
  button, select, summary, input { touch-action:manipulation; }
  button, select { min-height:44px; }
  input, select { font-size:16px; }
  #report-controls { column-gap:6px; padding-top:12px; margin-bottom:12px; }
  #report-controls .filter-controls { gap:6px; }
  #report-controls #range, #report-controls #people-selection { font-size:14px; padding-left:10px; padding-right:28px; background-position:right 9px center!important; }
  #report-controls #range { flex:0 1 auto; max-width:145px; }
  #report-controls #people-picker { flex:1 1 auto; max-width:170px; }
  .header-tools .settings-menu summary { font-size:13px; gap:3px; padding-left:4px; }
  #report-controls #people-picker { position:static; }
  #report-controls { position:relative; }
  #people-picker .people-options { top:100%; left:0; right:0; width:auto; max-width:none; margin-top:4px; padding:12px; }
  #people-checkboxes { max-height:280px; max-height:min(280px,45svh); overscroll-behavior-y:contain; }
  #people-checkboxes label { font-size:15px; min-height:52px; padding:7px 2px; }
  #people-checkboxes small { font-size:12px; }
  #people-checkboxes input { width:20px; height:20px; }
  .people-tools button, .settings-menu button { min-height:44px; font-size:14px; }
  #breadcrumbs { gap:4px 8px; font-size:14px; }
  #breadcrumbs button { min-height:44px; font-size:13px; white-space:normal; }
  #breadcrumbs .person-crumb { font-size:15px; overflow-wrap:anywhere; }
  #breadcrumbs .clear-button { margin-left:auto; }
  .financial-head, .organization-overview .financial-head { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:12px; margin:12px 0 16px; padding-bottom:0; align-items:start; }
  .financial-head > div { min-width:0; }
  .financial-head > div:first-child { grid-column:1; grid-row:1; }
  .financial-head .forecast-summary { grid-column:2; grid-row:1; margin:0; }
  .financial-head > div:not(:first-child):not(.forecast-summary) { grid-column:1 / -1; display:flex; align-items:baseline; gap:8px; }
  .financial-head > div:not(:first-child):not(.forecast-summary) strong { font-size:17px; }
  .metric-caption { font-size:12px; line-height:1.4; margin-bottom:6px; }
  .financial-head .spend-amount, .financial-head .forecast-summary > strong { font-size:clamp(22px,6.1vw,28px)!important; letter-spacing:-.6px!important; }
  .trend-layout { min-width:0; padding-top:0; }
  .chart-story { display:block; width:100%; }
  .chart-story .trend-scroll { width:100%; overflow-x:auto; overflow-y:hidden; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch; scrollbar-width:thin; scrollbar-color:var(--muted) var(--soft); padding:6px 0 10px; }
  .chart-story .trajectory { width:1040px; min-width:1040px; max-width:none; height:174px; max-height:none; }
  .trajectory text { font-size:13px; }
  .trajectory .bar-amount { font-size:14px; }
  .trajectory .month-change { font-size:14px; }
  .trajectory .month-point[aria-pressed="true"] .bar-amount { font-size:16px; }
  .chart-footer { flex-wrap:nowrap; justify-content:space-between; align-items:center; gap:8px; margin-top:2px!important; }
  .timeline-navigation { display:flex; order:2; flex:0 0 auto; align-items:center; gap:4px; width:auto; color:var(--muted); font-size:12px; }
  .timeline-navigation { justify-content:flex-end; }
  .timeline-navigation button { display:grid; place-items:center; width:44px; height:44px; padding:10px; background:transparent!important; }
  .timeline-navigation svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.6; }
  .chart-footer .chart-key { order:1; flex:0 0 auto; gap:4px; font-size:13px; min-height:44px; }
  .chart-key > span { gap:5px; }
  .chart-key .legend-square { width:14px; height:14px; }
  .chart-key .projection-legend { padding-right:27px; }
  .projection-legend button.projection-info { top:0; right:5px; width:22px; height:22px; min-height:22px; }
  .projection-legend button.projection-info::before { content:''; position:absolute; inset:-11px; }
  .projection-legend .projection-info svg { width:14px; height:14px; }
  .projection-tooltip { left:0; right:0; top:calc(100% + 8px); bottom:auto; width:auto; max-width:none; padding:16px; }
  .projection-tooltip p { font-size:14px; }
  .projection-close { min-width:44px; min-height:44px; top:0; right:0; }
  .distribution-section { padding-top:16px; }
  .section-top { gap:8px 12px; margin-bottom:12px; }
  .section-top > div { min-width:0; flex:1 1 190px; }
  .section-top h3 { font-size:19px!important; }
  .section-top .muted { font-size:13px; line-height:1.5; }
  #dimension { min-height:44px; font-size:15px; }
  .distribution-grid { display:block; }
  .donut-block { display:flex; flex-direction:column; gap:0; margin:4px 0 16px; }
  .donut { width:230px; height:230px; max-width:100%; }
  .donut-block p { max-width:none; font-size:13px; text-align:center; }
  .donut-block p span { font-size:12px; }
  .legend-head, .legend-row { grid-template-columns:minmax(0,1fr) 74px 34px 16px; gap:6px; }
  .legend-head { font-size:12px; padding:8px 0; }
  .legend-row { font-size:14px; padding:12px 0; min-height:52px; }
  .legend-row .name { overflow-wrap:anywhere; }
  .legend-row .amount { font-size:15px!important; }
  .legend-row .share { font-size:12px; }
  .legend-row .row-arrow { font-size:18px; }
  .show-more { min-height:44px; font-size:14px; }
  .person-explorer .people-list { display:flex; gap:8px; width:100%; max-width:100%; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x proximity; padding-bottom:10px; margin:0 0 16px; scrollbar-width:thin; scrollbar-color:var(--muted) var(--soft); }
  .person-explorer .legend-row { flex:0 0 156px; grid-template-columns:minmax(0,1fr); gap:4px; padding:10px 12px; scroll-snap-align:start; min-height:76px; border-radius:4px; }
  .person-explorer .legend-row .name, .person-explorer .legend-row.person-selected .name { font-size:14px; }
  .person-explorer .legend-row .amount { text-align:left; }
  .person-explorer .people-list > .show-more { flex:0 0 110px; }
  .person-detail-heading { gap:4px; margin-bottom:12px; }
  .person-detail-heading h2 { font-size:22px!important; }
  .person-detail-heading > span { font-size:13px; }
  .flow-topline { display:flex; flex-direction:column; gap:8px; padding:0 0 12px; }
  .flow-breadcrumbs { width:100%; gap:4px 8px; font-size:14px; }
  .flow-breadcrumbs button { min-height:44px; max-width:100%; font-size:14px; }
  .flow-actions { width:100%; }
  .flow-view-tools { gap:4px; }
  .flow-view-tools .flow-zoom, .flow-view-tools .flow-zoom-reset, .flow-view-tools .flow-expand { min-width:44px; width:44px; min-height:44px; height:44px; padding:10px; }
  .flow-view-tools .flow-zoom-reset { font-size:13px; width:52px; }
  .flow-view-tools svg, .flow-actions .flow-expand svg { width:19px; height:19px; }
  .flow-total span { font-size:13px; }
  .flow-total strong { font-size:22px; }
  .flow-scroll::before { content:none!important; }
  .flow-column-headings .flow-column { font-size:14px; }
  .flow-column-headings select { min-height:44px; }
  .flow-scroll { -webkit-overflow-scrolling:touch; }
  .flow-pan { padding:0 4px; gap:6px; }
  .flow-pan button { flex-basis:44px; width:44px; height:44px; min-height:44px; }
  .flow-pan-position { height:44px; touch-action:pan-y; }
  .flow-note, .flow-table > summary { font-size:13px; }
  .flow-table > summary { min-height:44px; }
  .flow-fullview main { padding:8px 4px!important; }
  .flow-fullview .report-paper { padding:8px 12px 20px!important; }
  .rank-row { grid-template-columns:minmax(0,1fr) 76px 18px; }
  .rank-label strong { font-size:14px; }
  .rank-label small { font-size:12px; }
  .rank-value strong { font-size:14px; }
  .metric-switch { display:flex; flex-wrap:wrap; }
  .metric-switch button { font-size:13px; min-height:44px; }
  .table-wrap { max-width:100%; -webkit-overflow-scrolling:touch; }
  .session-table, .session-table tbody { display:block; width:100%; }
  .session-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
  .session-table tr { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px 14px; padding:16px 0; border-bottom:1px solid var(--line); }
  .session-table td, .session-table td:first-child { display:block; min-width:0; width:auto; max-width:none; padding:0; border:0; text-align:left; font-size:14px; }
  .session-table td:first-child { grid-column:1 / -1; }
  .session-table td:first-child button { font-size:15px; min-height:44px; line-height:1.6; }
  .session-table td p { font-size:12px; }
  .session-table td:nth-child(2)::before { content:'Person'; }
  .session-table td:nth-child(3)::before { content:'Date'; }
  .session-table td:nth-child(4)::before { content:'Spend'; }
  .session-table td:nth-child(5)::before { content:'Tokens / calls'; }
  .session-table td::before { display:block; color:var(--muted); font:12px/1.5 PortalBody,sans-serif; margin-bottom:3px; }
  .session-table .person-link { min-height:44px; font-size:14px; }
  .session-table .date-cell { white-space:normal; }
  .collection-search-tools { flex-wrap:wrap; }
  .settings-intro { font-size:14px; }
  #groups input, #controls input, #groups select, #controls select { font-size:16px; min-height:44px; }
  #groups table, #controls table { font-size:14px; }
  #groups th, #controls th { font-size:12px; }
  #controls table { min-width:660px; }
  footer { flex-direction:column; gap:6px; font-size:12px; }
}
@media(max-width:360px) {
  .report-head h1 { font-size:19px!important; }
  #report-controls #range, #report-controls #people-selection { font-size:13px; padding-left:7px; padding-right:25px; }
  .header-tools .settings-menu summary { font-size:12px; }
  .legend-head, .legend-row { grid-template-columns:minmax(0,1fr) 66px 31px 14px; gap:4px; }
  .legend-row { font-size:13px; }
  .legend-row .amount { font-size:14px!important; }
}
@media (max-width:650px), (max-width:950px) and (pointer:coarse) {
  .session-table { min-width:0!important; }
  .session-table td:first-child button { overflow-wrap:anywhere; }
}
/* Closed details must not contribute invisible horizontal overflow. */
details:not([open]) > :not(summary) { display:none!important; }
html:not(.paper) .partial-month .month-change.increase { fill:#ffb38f!important; }
html:not(.paper) .partial-month .month-change.decrease { fill:#75e5bc!important; }
@media (max-width:650px), (max-width:950px) and (pointer:coarse) {
  #controls .settings-bar { gap:8px; padding:12px; }
  #controls .settings-bar label { display:flex; align-items:center; gap:10px; min-height:44px; font-size:14px; }
  #controls .settings-bar input[type="checkbox"] { width:20px; height:20px; min-height:20px; flex:none; }
  #controls .settings-bar strong { font:600 14px/1.5 -apple-system,BlinkMacSystemFont,sans-serif; }
  #controls .table-wrap > table, #collection-people { display:block; width:100%; min-width:0; }
  #controls .table-wrap > table > thead { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
  #collection-people > tr { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:12px; padding:16px 0; border-bottom:1px solid var(--line); }
  #collection-people td { padding:0; border:0; min-width:0; }
  #collection-people td:first-child { grid-column:1 / -1; font-size:16px; }
  #collection-people td:nth-child(2)::before { content:'Admin override'; }
  #collection-people td:nth-child(3)::before { content:'Member preference'; }
  #collection-people td:nth-child(4)::before { content:'Effective state'; }
  #collection-people td::before { display:block; font-size:12px; color:var(--muted); margin-bottom:6px; }
  #collection-people td:nth-child(4) { grid-column:1 / -1; }
  #collection-people td:nth-child(4) p { display:inline; margin-left:8px; font-size:12px; }
  #collection-people select { width:100%; min-width:0; }
  #collection-no-results td { grid-column:1 / -1; }
  #groups .group-create { flex-wrap:wrap; }
  #groups .group-create input { min-width:0; flex:1 1 180px; }
  #groups .table-wrap table { min-width:0; }
  #groups td, #groups th { padding:10px 4px; }
  #groups td:first-child { min-width:90px; }
  #groups select { width:100%; min-width:0; max-width:180px; }
}
@media(max-width:360px) {
  #report-controls #range { flex:0 0 102px; width:102px; }
  #report-controls #people-picker { min-width:96px; }
  .header-tools .settings-menu summary { padding-left:0; }
}
@media (max-width:650px), (max-width:950px) and (pointer:coarse) {
  .flow-scroll-frame { overflow:clip; }
}
@media (max-width:650px), (max-width:950px) and (pointer:coarse) {
  .flow-table > summary { color:var(--ink); padding-block:12px; }
  .model-key { gap:4px 12px; }
  .model-key button { min-height:44px; font-size:13px; }
  .model-key strong { font-size:13px; }
  .accounting summary { min-height:44px; font-size:14px; }
}
.mobile-settings-icon { display:none; }
@media (max-width:650px), (max-width:950px) and (pointer:coarse) {
  /* Native iOS controls stay at 16px so focusing them does not zoom the page. */
  #report-controls #range, #report-controls #people-selection { font-size:16px; }
  .header-tools .settings-menu summary { width:44px; height:44px; padding:10px; display:grid; place-items:center; border:1px solid var(--line); border-radius:4px; color:var(--ink); }
  .settings-menu .settings-label { display:none; }
  .mobile-settings-icon { display:block; width:22px; height:22px; }
}
@media(max-width:360px) {
  #report-controls #range { flex-basis:116px; width:116px; }
  #report-controls #people-picker { min-width:0; }
}

@media (max-width:650px), (max-width:950px) and (pointer:coarse) {
 .header-tools { gap:4px; }
 .report-head h1 { font-size:clamp(17px,4.8vw,21px)!important; min-width:0; }
 .header-tools .settings-menu summary { min-height:44px; color:var(--ink); border-color:var(--line); }
}