.expense-monitor{display:grid;gap:16px;min-width:0}
.expense-period-button{height:36px;min-width:132px;display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--line);border-radius:7px;background:var(--surface-subtle);padding:0 10px;font-size:13px;white-space:nowrap}
.expense-summary{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:16px;padding:4px 0 2px}
.expense-summary>div{display:flex;flex-direction:column;gap:5px;min-width:0}
.expense-summary span,.expense-summary small{color:var(--muted);font-size:12px}
.expense-summary strong{font-size:26px;font-weight:650;overflow-wrap:anywhere;letter-spacing:-.4px}
.expense-summary .expense-summary-type{font-size:20px}
.expense-chart-panel{padding:18px;min-width:0;overflow:visible}
.expense-section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}
.expense-section-head>span,.expense-section-head p{color:var(--muted);font-size:12px;line-height:1.5}
.expense-section-head h2{font-size:17px;letter-spacing:0}
.expense-legend{display:flex;flex-wrap:wrap;gap:8px 20px;margin-bottom:14px}
.expense-legend button{display:grid;grid-template-columns:9px auto;align-items:center;gap:4px 6px;text-align:left;padding:3px 0;font-size:12px;border-radius:4px}
.expense-legend button b{grid-column:2;font-size:12px;font-weight:500}.expense-legend button[aria-pressed=true]{color:var(--primary)}
.expense-legend i,.expense-tooltip i{display:inline-block;width:8px;height:8px;border-radius:2px;flex:none}.expense-legend .muted{opacity:.5}
.expense-plot{position:relative;min-width:0;isolation:isolate}.expense-plot svg{display:block;overflow:visible;font-size:11px;fill:var(--muted)}
.expense-grid-line{stroke:var(--line);stroke-dasharray:2 5}.expense-zero{stroke:var(--muted);opacity:.3}
.expense-hit{fill:transparent;cursor:crosshair}.expense-hit:focus{outline:none;fill:var(--theme-accent,#bda6f622);stroke:var(--primary);stroke-width:1}
.expense-caption{color:var(--muted);font-size:12px;line-height:1.6;margin-top:10px}
.expense-tooltip{position:absolute;z-index:40;width:320px;padding:14px;border:1px solid var(--theme-border,#756083);border-radius:12px;background:var(--theme-surface-raised,#2b2536);box-shadow:0 8px 28px var(--theme-shadow-color,#0005);color:var(--ink);overflow:auto;pointer-events:auto;font-size:12px}
.expense-tooltip[hidden]{display:none}.expense-tooltip>strong{display:block;margin-bottom:8px;font-size:14px}.expense-tooltip>small{display:block;color:var(--theme-warning,#f5b266);margin-bottom:8px}
.expense-tooltip>div{display:flex;justify-content:space-between;gap:12px;margin-top:9px}.expense-tooltip span{display:flex;align-items:center;gap:7px}.expense-tooltip b{white-space:nowrap;font-variant-numeric:tabular-nums}
.expense-tooltip .expense-tip-total{border-top:1px solid var(--theme-border,#ffffff20);padding-top:10px;font-weight:600}
.expense-freshness{padding:12px 16px}.expense-freshness summary{cursor:pointer;font-size:13px}.expense-freshness summary span{color:var(--muted);font-size:12px;margin-left:12px}
.expense-freshness>div{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-top:14px}.expense-freshness article{display:grid;gap:5px;font-size:12px}.expense-freshness small{color:var(--muted)}
.expense-signal-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(310px,100%),1fr));gap:12px}
.expense-signal{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;padding:16px;align-content:start}
.expense-signal-date,.expense-signal small{color:var(--muted);font-size:12px}.expense-signal h3{margin-top:6px;margin-bottom:2px;font-size:16px}
.expense-signal-amount{display:flex;flex-direction:column;text-align:right;gap:5px;justify-content:center}.expense-signal-amount strong{font-size:18px;white-space:nowrap}.expense-signal-amount span{font-size:12px;color:var(--muted)}
.expense-signal-values{grid-column:1/-1;display:flex;gap:18px;flex-wrap:wrap;padding-top:10px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}
.expense-signal-values b{display:block;margin-top:5px;font-weight:500;color:var(--ink)}.expense-signal>.button{grid-column:1/-1;min-height:36px;font-size:12px;justify-self:start}
.expense-signals>[data-action=expense-more]{margin-top:14px}.expense-empty{padding:26px;color:var(--muted);line-height:1.6;font-size:13px}
.expense-method{font-size:12px;color:var(--muted);line-height:1.7}.expense-method summary{cursor:pointer}.expense-method p{margin-top:8px;max-width:1000px}
.expense-presets{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap}
.expense-detail-summary{display:flex;flex-wrap:wrap;gap:16px 28px;font-size:13px}.expense-detail-summary span{color:var(--muted)}.expense-detail-summary b{display:block;color:var(--ink);margin-top:5px;font-size:19px}
.expense-service-list{margin:18px 0;font-size:13px}.expense-service-list summary{cursor:pointer}.expense-service-list>div{display:flex;gap:16px;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--line)}.expense-service-list strong{white-space:nowrap}
.expense-detail-scroll{overflow-x:auto;margin-top:14px}.expense-detail-table{width:100%;min-width:570px;border-collapse:collapse;table-layout:fixed;font-size:12px}
.expense-detail-table th,.expense-detail-table td{padding:12px 10px;text-align:right;vertical-align:top;border-bottom:1px solid var(--line)}.expense-detail-table th:first-child{width:43%;text-align:left;font-weight:500;white-space:normal;overflow-wrap:anywhere}
.expense-detail-table td{white-space:nowrap;font-variant-numeric:tabular-nums}.expense-detail-table thead th{color:var(--muted);font-weight:500}.expense-detail-table small{display:block;margin-top:5px;line-height:1.5;color:var(--muted);font-size:11px;font-weight:400}.expense-detail-table a{color:var(--primary)}
.expense-offset{margin:16px 0;font-size:13px}.expense-offset summary{cursor:pointer}
@media(max-width:720px){
 [data-page=finance-expenses] .monitoring-controls{grid-template-columns:repeat(2,minmax(0,1fr))}
 [data-page=finance-expenses] .expense-period-button{width:100%;height:40px;min-width:0}
 [data-page=finance-expenses] [data-expense-option=type]{grid-column:1/-1;width:100%}
 .expense-monitor{gap:14px}.expense-summary{grid-template-columns:1fr 1fr;gap:14px 12px}.expense-summary>div:first-child{grid-column:1/-1}.expense-summary strong{font-size:26px}.expense-summary .expense-summary-type{font-size:17px}
 .expense-chart-panel{padding:12px}.expense-legend{gap:10px 14px}.expense-legend button{font-size:11px;flex:1 0 40%}.expense-section-head{align-items:flex-start}.expense-section-head h2{font-size:16px}.expense-section-head>.button{font-size:12px;min-height:36px;white-space:nowrap}
 .expense-freshness summary span{display:block;margin:6px 0 0 15px}.expense-signal{padding:14px}.expense-detail-summary{gap:12px}.expense-detail-summary b{font-size:16px}
}


.expense-sales-context{grid-column:1/-1;min-width:0;border-top:1px solid var(--line);padding-top:12px;font-size:12px;line-height:1.5}
.expense-sales-context>strong{display:block;font-size:12px;font-weight:600;color:var(--ink)}
.expense-sales-context.is-faster>strong{color:var(--theme-warning,#f5b266)}
.expense-sales-context>small,.expense-sales-context p{display:block;color:var(--muted);margin-top:6px}
.expense-sales-context dl{margin:8px 0 0;display:grid;gap:7px}
.expense-sales-context dl>div{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2px 12px}
.expense-sales-context dt{color:var(--muted)}.expense-sales-context dt small{margin-left:5px;color:var(--ink)}
.expense-sales-context dd{margin:0;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.expense-detail-summary~.expense-sales-context{margin-top:16px}
/* Shared finance charts: flexible controls, bounded text, no page-wide overflow. */
.finance-trend-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:18px 0}
.finance-trend-grid>section{min-width:0;margin:0}.finance-trend-grid h3{margin:0}
.expense-chart-options,.finance-comparison-options{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.expense-chart-options{margin-left:auto}.expense-ad-toggle,.finance-comparison-options label{display:flex;gap:8px;align-items:center;font-size:14px}
.finance-comparison-options small{color:var(--muted)}.expense-trends{margin:26px 0}
.finance-trend-grid select{max-width:210px;font-size:13px;min-height:36px}
.finance-chart-readout{white-space:pre-line;color:var(--muted);font-size:12px;line-height:1.5;min-height:64px;padding:4px 10px}
.finance-trend-grid svg text,[data-monthly-margin] svg text{fill:var(--muted);font-size:11px}
.finance-month-table-scroll{overflow:auto;max-width:100%;max-height:70vh;isolation:isolate}
.finance-month-table{min-width:2200px}.finance-month-table th,.finance-month-table td{padding:12px 14px!important}
.finance-month-table thead th{position:sticky;top:0;z-index:3;background:var(--panel,#222228);min-width:130px;white-space:normal}
.finance-month-table tr>th:first-child{position:sticky;left:0;z-index:2;min-width:175px;background:var(--panel,#222228)}
.finance-month-table thead th:first-child{z-index:4}.finance-month-total{font-weight:700;background:var(--theme-accent-bg,rgba(189,166,246,.12))}
.finance-month-margin{background:var(--theme-good-bg,rgba(196,232,134,.06))}.finance-monthly h2{font-size:20px}
.finance-composition-legend{display:flex;gap:10px 18px;flex-wrap:wrap;margin:16px 0;font-size:12px;color:var(--muted)}
.finance-composition-legend span{display:flex;align-items:center;gap:6px}.finance-composition-legend i{width:9px;height:9px;border-radius:2px}
.finance-composition-row{display:grid;grid-template-columns:70px minmax(0,1fr);gap:10px;margin:12px 0;align-items:center;font-size:12px}
.finance-composition-bar{display:flex;height:38px;border-radius:5px;overflow:hidden;background:var(--panel)}
.finance-composition-bar button{padding:0;min-width:0;border:0;border-radius:0;color:var(--theme-ink,#171820);font-weight:600;font-size:11px;cursor:pointer;overflow:hidden}
.finance-composition-bar button:focus-visible{outline:2px solid white;outline-offset:-2px}
.finance-negative-parts{display:block;color:var(--muted);margin-top:5px}.finance-product-search{justify-content:flex-end;margin-top:18px}
@media(max-width:850px){.finance-trend-grid{grid-template-columns:minmax(0,1fr)}.expense-chart-options{margin-left:0}.finance-comparison-options{gap:10px}.expense-section-head{flex-wrap:wrap}.finance-composition-row{grid-template-columns:52px minmax(0,1fr)}.finance-product-search .search-field{width:100%}.finance-trend-grid select{max-width:170px}}

.finance-comparison-options i,.finance-current-series i{display:inline-block;width:12px;height:3px;margin:0 5px}.finance-current-series{font-size:14px}

/* Article matrix: page scrolling vertically, one horizontal table on phones too. */
.expense-matrix-scroll{max-height:none!important;overflow-x:auto;min-width:0;border:1px solid var(--line);border-radius:8px;margin-top:10px}
.expense-matrix{width:max-content;min-width:100%;border-collapse:separate;border-spacing:0;font-size:12px;font-variant-numeric:tabular-nums;line-height:1.25}
.expense-matrix th,.expense-matrix td{padding:0;border:0;border-bottom:1px solid var(--line);text-align:right;vertical-align:middle;white-space:nowrap;background:transparent;min-width:98px}
.expense-matrix thead th{padding:9px 8px;font-size:11px;font-weight:500;background:var(--surface,#202127);color:var(--muted)}
.expense-matrix th:first-child{position:sticky;left:0;z-index:2;text-align:left;min-width:145px;max-width:170px;padding:8px 10px;white-space:normal;background:var(--surface,#202127);border-right:1px solid var(--line);font-weight:500}
.expense-matrix thead th:first-child{z-index:3}
.expense-matrix td{background:var(--expense-heat)}
.expense-matrix .expense-matrix-total{font-weight:650;border-right:1px solid var(--line)}
.expense-matrix td.is-credit{color:var(--positive,#80d3b4)}
.expense-matrix td button{display:flex;justify-content:flex-end;align-items:center;gap:5px;width:100%;min-height:34px;padding:6px 8px;border:0;border-radius:0;background:transparent;font:inherit;color:inherit;white-space:nowrap;cursor:pointer}
.expense-matrix td button:hover{background:var(--theme-neutral-tint,#ffffff09)}.expense-matrix td button:focus-visible{outline:2px solid var(--primary);outline-offset:-2px}
.expense-cell-spike{font-size:10px;color:var(--theme-warning,#f9be77);font-weight:650;white-space:nowrap}
.expense-matrix-key{margin:8px 0;font-size:11px;line-height:1.45;color:var(--muted)}
.expense-source-scroll{overflow-x:auto;max-height:none;margin:12px 0}
.expense-source-table{border-collapse:collapse;width:100%;min-width:580px;font-size:12px;font-variant-numeric:tabular-nums}
.expense-source-table th,.expense-source-table td{padding:8px 9px;border-bottom:1px solid var(--line);text-align:right;vertical-align:top}
.expense-source-table th{font-weight:500;color:var(--muted)}
.expense-source-table th:first-child,.expense-source-table td:first-child,.expense-source-table th:nth-child(2),.expense-source-table td:nth-child(2){text-align:left}
.expense-source-table td:last-child{white-space:nowrap}.expense-source-table small{display:block;color:var(--muted);font-size:11px;line-height:1.45;margin-top:3px;overflow-wrap:anywhere}
.expense-source-pages{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12px;color:var(--muted)}
.expense-source-pages>span{margin-right:auto}
.expense-skeleton{display:grid;gap:1px;border:1px solid var(--line);border-radius:8px;overflow:hidden;margin:10px 0}
.expense-skeleton>div{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:22px;padding:12px;background:var(--surface,#202127)}
.expense-skeleton i{height:9px;border-radius:3px;background:var(--theme-neutral-tint,#ffffff0b);animation:expense-pulse 1.6s ease-in-out infinite alternate}
.expense-skeleton>div:nth-child(even) i{animation-delay:.2s}
@keyframes expense-pulse{to{opacity:.35}}
@media(prefers-reduced-motion:reduce){.expense-skeleton i{animation:none}}
@media(max-width:720px){
 .expense-matrix{font-size:12px}.expense-matrix th:first-child{min-width:120px;max-width:135px;padding:6px 8px}
 .expense-matrix td button{min-height:40px}.expense-matrix th,.expense-matrix td{min-width:94px}
 .expense-matrix-scroll table,.expense-source-scroll table{display:table!important}
 .expense-matrix-scroll thead,.expense-source-scroll thead{display:table-header-group!important}
 .expense-matrix-scroll tbody,.expense-source-scroll tbody{display:table-row-group!important}
 .expense-matrix-scroll tr,.expense-source-scroll tr{display:table-row!important}
 .expense-matrix-scroll th,.expense-matrix-scroll td,.expense-source-scroll th,.expense-source-scroll td{display:table-cell!important}
 .expense-matrix-scroll td:before,.expense-source-scroll td:before{content:none!important}
}
