/* Staff redesign (Nov 2026): reports screen. Spec: docs/STAFF_REDESIGN_PROTOTYPE_2026-11-04 */
.reports{color:var(--ink);font-family:var(--font)}
.reports .rpt-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:18px}
.reports .rpt-head h1{margin:0;font-family:var(--font-title);font-weight:400;font-size:34px;letter-spacing:-.6px;line-height:1.15}
.reports .rpt-controls{margin-left:auto;display:flex;align-items:center;gap:8px}
.reports .rpt-pick{display:block;margin:0}
.reports .rpt-select{height:42px;min-height:42px;border:1px solid var(--line);border-radius:10px;background:#fff;font:15px var(--font);color:var(--ink);padding:0 10px}
.reports .rpt-refresh{width:44px;min-height:44px;border-radius:50%}
.reports #analysis-error{margin:0 0 18px}
.reports #analysis-error:empty{display:none}

.reports .rpt-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:#fff;border:1px solid var(--line);border-radius:16px;margin-bottom:18px}
.reports .rpt-stat{padding:14px 20px;min-width:0}
.reports .rpt-stat+.rpt-stat{border-left:1px solid var(--divider)}
.reports .rpt-stat span{display:block;font-size:13px;color:var(--ink);line-height:1.4}
.reports .rpt-stat strong{display:block;margin-top:3px;font-family:var(--font-title);font-weight:400;font-size:26px;line-height:1.2;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}

.reports .rpt-tabs{display:flex;gap:26px;border-bottom:1px solid var(--line);margin-bottom:18px}
.reports .rpt-tab{border:0;border-bottom:3px solid transparent;border-radius:0;background:none;box-shadow:none;padding:0 0 11px;min-height:44px;font:15px var(--font);color:var(--ink);white-space:nowrap}
.reports .rpt-tab:hover{background:none;color:var(--green)}
.reports .rpt-tab[aria-selected="true"]{color:var(--green);font-weight:700;border-bottom-color:var(--green)}

.reports .rpt-content{display:flex;flex-direction:column;gap:18px}
.reports .rpt-columns{display:grid;gap:20px;align-items:start}
.reports .rpt-columns-overview{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}
.reports .rpt-columns-payments{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);align-items:stretch}
/* Payments: the split box is as tall as Payment Methods, and its title starts where that one does. */
.reports .rpt-columns-payments .rpt-padded{padding:16px}
.reports .rpt-columns-payments .rpt-padded h2{margin-bottom:10px}
.reports .rpt-panel{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;min-width:0}
.reports .rpt-padded{padding:18px 20px}
.reports .rpt-panel h2{margin:0 0 6px;font-family:var(--font-title);font-weight:400;font-size:22px;letter-spacing:0;line-height:1.3}
.reports .rpt-panel h2.rpt-table-title{margin:0;padding:16px 16px 10px}
.reports .rpt-panel-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.reports .rpt-panel-head h2{margin:0}
.reports .rpt-readout{font-size:14px;color:var(--ink);min-height:20px;text-align:right}
/* Overview: the hover line sits on its own row under the title, so a long one never squeezes it. */
.reports .rpt-columns-overview .rpt-panel-head{flex-wrap:wrap;row-gap:2px}
.reports .rpt-columns-overview .rpt-panel-head .rpt-readout{flex-basis:100%;text-align:left}

.reports .rpt-chart{position:relative;height:240px;margin-top:22px;display:flex;align-items:flex-end;border-bottom:1px solid #b9c4bc}
.reports .rpt-gridline{position:absolute;left:0;right:0;border-top:1px dashed var(--divider);pointer-events:none}
.reports .rpt-gridline-top{top:0}
.reports .rpt-gridline-mid{top:50%}
.reports .rpt-axis{position:absolute;left:0;top:-18px;font-size:13px;line-height:1.4;color:var(--ink);pointer-events:none}
.reports .rpt-bar-hit{position:relative;flex:1;min-width:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;min-height:0;border:0;border-radius:0;background:none;box-shadow:none;padding:0 3px;cursor:default}
.reports .rpt-bar-hit:hover{background:none}
/* A month's bar: Fare + Fees (dark green) at the base, Tips (tan) on top, a 2px white gap
   between; only the top end is rounded. Reports charts use the site's greens and browns, the
   same as the Expenses chart (owner, Nov 13, 2026). */
.reports .rpt-bar{display:flex;flex-direction:column;gap:2px;width:100%;max-width:44px;border-radius:4px 4px 0 0;overflow:hidden}
.reports .rpt-seg{display:block;flex-basis:0;min-height:1px}
.reports .rpt-seg-fare{background:#214c43}
.reports .rpt-seg-tips{background:#d3b08c}
.reports .rpt-bar.rpt-bar-muted{opacity:.3}
.reports .rpt-bar-hit:hover .rpt-bar,.reports .rpt-bar-hit:focus-visible .rpt-bar{filter:brightness(.88)}
.reports .rpt-legend{display:flex;gap:18px;margin:12px 0 0;font-size:14px;color:var(--ink)}
.reports .rpt-legend span{display:inline-flex;align-items:center}
.reports .rpt-chart-labels{display:flex;margin-top:6px}
.reports .rpt-chart-labels span{flex:1;min-width:0;text-align:center;font-size:13px;color:var(--ink)}

.reports .rpt-list{display:grid;grid-template-columns:auto minmax(0,1fr);margin:0;font-size:15px}
.reports .rpt-list dt{padding:11px 0;border-top:1px solid var(--divider);color:var(--ink);font-size:15px}
.reports .rpt-list dd{margin:0;padding:11px 0;border-top:1px solid var(--divider);text-align:right;font-weight:400;font-variant-numeric:tabular-nums}

.reports .rpt-table-wrap{overflow-x:auto}
.reports .rpt-table-wrap:focus-visible{outline-offset:-3px}
.reports .rpt-table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.4}
.reports .rpt-table th,.reports .rpt-table td{padding:11px 16px;border-top:1px solid var(--divider);text-align:right;font-variant-numeric:tabular-nums;vertical-align:baseline}
.reports .rpt-table .l{text-align:left}
.reports .rpt-table thead th{font-size:13px;letter-spacing:.6px;text-transform:uppercase;color:var(--ink);font-weight:600;padding:10px 16px;background:var(--paper);border-top:0;white-space:nowrap}
.reports .rpt-table tfoot td{font-weight:700;border-top:1px solid var(--ink)}
.reports .rpt-table .rpt-empty{color:var(--ink)}
.reports .rpt-nowrap{white-space:nowrap}
.reports .rpt-link{border:0;border-radius:0;background:none;box-shadow:none;padding:0;min-height:0;color:var(--green);font:600 15px var(--font);text-decoration:underline;text-underline-offset:3px;text-align:left}
.reports .rpt-link:hover{background:none;color:var(--green-pressed)}
.reports .rpt-note{display:block;font-size:13px;color:var(--ink)}
.reports .rpt-balance{font-weight:700}
.reports .rpt-due{color:var(--warm)}
.reports .rpt-paid{color:var(--green)}

.reports .rpt-filter{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--ink)}

@media(max-width:900px){
.reports .rpt-columns-overview,.reports .rpt-columns-payments{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:600px){
.reports .rpt-head h1{font-size:28px}
.reports .rpt-controls{margin-left:0;width:100%}
.reports .rpt-pick{flex:1;min-width:0}
.reports .rpt-pick .rpt-select{width:100%}
.reports .rpt-stats{grid-template-columns:1fr 1fr;gap:1px;background:var(--divider);overflow:hidden}
.reports .rpt-stat{background:#fff;padding:12px 14px}
.reports .rpt-stat+.rpt-stat{border-left:0}
.reports .rpt-stat strong{font-size:22px}
.reports .rpt-tabs{gap:20px}
.reports .rpt-table{min-width:600px}
.reports .rpt-padded{padding:16px}
}

/* Reports > Expenses (Nov 2026). Mockup: claude.ai/artifact/TwzXExi8LuUF6wHLcUUEh4 */
.reports .exp-root{display:flex;flex-direction:column;gap:18px}
.reports .exp-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:20px;align-items:start}
.reports .exp-col{display:flex;flex-direction:column;gap:18px;min-width:0}
.reports .exp-tight th,.reports .exp-tight td{padding-left:12px;padding-right:12px}
.reports .exp-status{margin:0;padding:12px 16px;font-size:15px;color:var(--ink)}
.reports .rpt-list .exp-total{font-weight:700;border-top:1px solid var(--ink)}
.reports .exp-btn{min-height:42px;padding:0 16px;border-radius:8px;border:1px solid var(--green);background:#fff;color:var(--green);font:700 15px var(--font);display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap;box-shadow:none;cursor:pointer}
.reports .exp-btn:hover{background:#eef3ee}
.reports .exp-btn.primary{background:var(--green);color:#fff}
.reports .exp-btn.primary:hover{background:var(--green-pressed)}
.reports .exp-btn:disabled{opacity:.55;cursor:default}
.reports .exp-legend{display:flex;gap:18px;flex-wrap:wrap;margin-top:10px;font-size:14px}
.reports .exp-legend span{display:inline-flex;align-items:center;gap:7px}
.reports .exp-legend i{width:12px;height:12px;border-radius:3px;display:inline-block}
.reports .exp-chart{margin-top:26px}
.reports .exp-bar{gap:2px}
.reports .exp-bar span{display:block;flex:none;width:100%;max-width:44px}
.reports .exp-bar .exp-seg-top{border-radius:4px 4px 0 0}
.reports .exp-bar:hover span,.reports .exp-bar:focus-visible span{filter:brightness(.88)}
.reports .exp-scrim{position:fixed;inset:0;z-index:40;background:rgba(26,31,29,.45);display:flex;justify-content:center;align-items:flex-start;padding:80px 16px;overflow:auto}
.reports .exp-dialog{width:540px;max-width:100%;background:#fff;border-radius:16px;box-shadow:0 18px 50px rgba(26,31,29,.28);overflow:hidden}
.reports .exp-dialog-wide{width:860px}
.reports .exp-dialog-head{display:flex;align-items:center;justify-content:space-between;padding:14px 12px 6px 22px}
.reports .exp-dialog-head h2{margin:0;font-family:var(--font-title);font-weight:400;font-size:24px}
.reports .exp-x{width:44px;height:44px;min-height:44px;border:0;border-radius:50%;background:none;box-shadow:none;color:var(--ink);display:grid;place-items:center;padding:0}
.reports .exp-form{display:flex;flex-direction:column;gap:18px;padding:8px 22px 0}
.reports .exp-form fieldset{border:0;margin:0;padding:0;min-width:0}
.reports .exp-form legend,.reports .exp-form h3{padding:0;margin:0 0 8px;font-size:15px;font-weight:700}
.reports .exp-grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.reports .exp-span{grid-column:1/-1}
.reports .exp-field{display:block;border:1px solid var(--line);border-radius:10px;padding:7px 12px 8px;background:#fff;min-width:0;margin:0}
.reports .exp-field>span{display:block;font-size:12px;font-weight:700;line-height:1.3;color:var(--ink)}
.reports .exp-field input,.reports .exp-field select{display:block;width:100%;box-sizing:border-box;border:0;padding:0;margin:2px 0 0;background:transparent;font:16px var(--font);color:var(--ink);min-height:24px;box-shadow:none;border-radius:0}
.reports .exp-field input:focus,.reports .exp-field select:focus{outline:none}
.reports .exp-field:focus-within{border-color:var(--green);box-shadow:0 0 0 1px var(--green)}
.reports .exp-money{display:flex;align-items:baseline;gap:2px;font-size:16px}
.reports .exp-money b{font-weight:400}
.reports .exp-seg{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:10px;padding:3px;gap:3px;background:var(--paper)}
.reports .exp-seg button{min-height:38px;border:0;border-radius:7px;background:none;box-shadow:none;font:15px var(--font);color:var(--ink)}
.reports .exp-seg button[aria-pressed="true"]{background:#fff;color:var(--green);font-weight:700;box-shadow:0 1px 2px rgba(26,31,29,.18)}
.reports .exp-form .rpt-list{margin-top:10px}
.reports .exp-tax-controls{display:grid;grid-template-columns:140px 220px minmax(0,1fr);gap:10px;align-items:center}
.reports .exp-tax-controls .exp-seg{max-width:280px;justify-self:end;width:100%}
.reports .exp-boxed{border:1px solid var(--line);border-radius:12px;overflow:hidden}
.reports .exp-error{margin:0}
.reports .exp-error:empty{display:none}
.reports .exp-dialog-foot{display:flex;justify-content:flex-end;align-items:center;gap:10px;margin:2px -22px 0;padding:14px 22px;border-top:1px solid var(--divider);background:var(--paper)}
.reports .exp-spacer{flex:1}
.reports .exp-delete{border-color:var(--warm);color:var(--warm)}
.reports .exp-delete:hover{background:#f7ece6}
.reports .rpt-head .exp-btn{min-height:42px}
.reports .exp-table thead th{vertical-align:middle}
.reports .exp-sort{border:0;border-radius:0;background:none;box-shadow:none;padding:0;min-height:0;font:inherit;letter-spacing:inherit;text-transform:inherit;color:var(--ink);white-space:nowrap}
.reports .exp-sort:hover{background:none;color:var(--green)}
.reports .rpt-table thead th.exp-addc{padding:5px 12px;width:1%}
.reports .exp-add{width:36px;height:36px;min-height:36px;padding:0;border:0;border-radius:8px;background:var(--green);color:#fff;display:inline-grid;place-items:center;vertical-align:middle}
.reports .exp-add:hover{background:var(--green-pressed)}
.reports .exp-grp{cursor:pointer}
.reports .exp-grp td{background:#eef3ee;font-weight:700}
.reports .exp-tog{border:0;border-radius:0;background:none;box-shadow:none;padding:0;min-height:0;font:700 15px var(--font);color:var(--ink);display:inline-flex;align-items:center;gap:8px}
.reports .exp-tog:hover{background:none}
.reports .exp-tog[aria-expanded="false"] svg{transform:rotate(-90deg)}
.reports .exp-cats{display:flex;flex-direction:column}
.reports .exp-cat{display:flex;align-items:baseline;gap:12px;width:100%;min-height:0;padding:11px 0;border:0;border-top:1px solid var(--divider);border-radius:0;background:none;box-shadow:none;font:15px var(--font);color:var(--ink);text-align:left;font-variant-numeric:tabular-nums}
.reports .exp-cat:hover{background:none;color:var(--green)}
.reports .exp-cat[aria-pressed="true"]{color:var(--green);font-weight:700}
.reports .exp-cat-name{flex:1;min-width:0}
.reports .exp-delta{font-size:13px;font-weight:700}
.reports .exp-delta.up{color:var(--warm)}
.reports .exp-delta.down{color:var(--green)}
.reports .exp-line{display:grid;grid-template-columns:172px minmax(0,1.2fr) 124px 110px minmax(0,1fr) 36px;gap:8px;align-items:center;margin-bottom:8px}
.reports .exp-line-head{font-size:12px;font-weight:700;margin-bottom:4px}
.reports .exp-line-head span{padding-left:11px}
.reports .exp-line-rep{grid-template-columns:172px 132px minmax(0,1.2fr) 124px 110px minmax(0,1fr)}
/* The Date column's heading switches between a day and a whole month, so the lines never move. */
.reports .exp-date-mode{display:flex;gap:10px}
.reports .exp-date-mode button{border:0;border-radius:0;background:none;box-shadow:none;padding:0;min-height:0;font:12px var(--font);color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.reports .exp-date-mode button:hover{background:none;color:var(--green)}
.reports .exp-date-mode button[aria-pressed="true"]{font-weight:700;text-decoration:none}
.reports .exp-line input,.reports .exp-line select{height:42px;min-height:42px;width:100%;min-width:0;box-sizing:border-box;border:1px solid var(--line);border-radius:10px;padding:0 10px;background:#fff;font:16px var(--font);color:var(--ink);box-shadow:none}
.reports .exp-line input:focus,.reports .exp-line select:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 1px var(--green)}
.reports .exp-line.exp-dup input,.reports .exp-line.exp-dup select{border-color:var(--warm);box-shadow:0 0 0 1px var(--warm)}
.reports .exp-x-sm{width:36px;height:36px;min-height:36px}
.reports .exp-dup-note{margin:0;color:var(--warm);font-weight:700;font-size:15px}
.reports .exp-dup-note:empty{display:none}
.reports .exp-lines-total{font-size:15px}
.reports .exp-toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);z-index:45;background:var(--ink);color:#fff;border-radius:10px;padding:8px 10px 8px 18px;display:flex;align-items:center;gap:14px;font-size:15px;box-shadow:0 10px 30px rgba(26,31,29,.3)}
.reports .exp-toast button{min-height:36px;padding:0 10px;border:0;border-radius:7px;background:none;box-shadow:none;color:#fff;font:700 15px var(--font);text-decoration:underline;text-underline-offset:3px}
.reports .exp-toast button:hover{background:rgba(255,255,255,.14)}
@media(max-width:900px){.reports .exp-layout{grid-template-columns:minmax(0,1fr)}}
/* Bookings pie: normal and Anthony jobs with a 2px white gap between slices, legend below; the first two Expenses colors. */
/* The pie's box matches the monthly chart's plot (22px down, 240px tall) with the pie centered in it,
   and its legend sits 38px below, level with the chart's legend under the month names. */
.reports .rpt-pie{display:flex;justify-content:center;align-items:center;height:240px;margin-top:22px}
.reports .rpt-pie-legend{margin-top:38px}
.reports .rpt-pie svg{display:block;width:180px;height:180px;overflow:visible}
.reports .rpt-pie [data-pie-slice]{stroke:#fff;stroke-width:1.1;stroke-linejoin:round;outline:none}
.reports .rpt-pie [data-pie-slice]:hover,.reports .rpt-pie [data-pie-slice]:focus-visible{opacity:.82}
.reports .rpt-pie-normal{fill:#214c43;background:#214c43}
.reports .rpt-pie-anthony{fill:#d3b08c;background:#d3b08c}
.reports .rpt-swatch{display:inline-block;width:12px;height:12px;margin-right:7px;border-radius:3px}
.reports .rpt-pie-empty{margin:12px 0 0;font-size:15px;color:var(--ink)}