:root {
  color-scheme: light;
  --canvas: #f7f8fa; --surface: #fff; --raised: #f9fafb;
  --border: #e4e7ec; --text: #172b4d; --body-text: #475467; --muted: #667085;
  --accent: #5b45d6; --accent-hover: #4935b8; --accent-tint: #f0edff;
  --blue: var(--accent); --amber: #b54708; --green: #067647;
  --error: #b42318; --info: #175cd3;
  --success-tint: #ecfdf3; --warning-tint: #fffaeb;
  --error-tint: #fef3f2; --info-tint: #eff8ff;
  --shadow-card: 0 2px 8px #172b4d06;
  --radius-control: 8px; --radius-card: 12px;
  --body: Inter, "Segoe UI", system-ui, sans-serif;
  --display: var(--body); --data: var(--body);
}
.dashboard-metrics { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; margin:20px 0; }
.dashboard-metric { padding:22px; min-width:0; }
.dashboard-metric .metric { font-size:1.85rem; margin:12px 0 8px; font-variant-numeric:tabular-nums; }
.dashboard-metric small { display:block; font-size:.8125rem; }
.field-controls { display:flex; flex-wrap:wrap; align-items:end; gap:16px; }
.field-controls label { display:flex; flex:1 1 160px; flex-direction:column; gap:6px; font-size:.8125rem; color:var(--muted); }
.field-controls input,.field-controls select { min-width:0; width:100%; min-height:44px; padding:10px; border:1px solid var(--border); border-radius:7px; color:var(--text); background:var(--surface); font:inherit; }
.field-controls input:focus-visible,.field-controls select:focus-visible, .period-detail summary:focus-visible { outline:3px solid var(--blue); outline-offset:3px; }
.period-detail { margin-bottom:14px; }
.period-detail > summary { padding:20px 24px; cursor:pointer; font-weight:600; }
.period-detail .panel-body h3 { margin-top:24px; }
.period-detail td { max-width:350px; white-space:normal; overflow-wrap:anywhere; }
.field-warning { color:var(--amber); padding:12px 0; }
.field-stats { font-variant-numeric:tabular-nums; padding:12px 0; }
.capture-actions { display:flex; gap:12px; flex-wrap:wrap; margin:0 0 18px; }
.capture-panel { margin-bottom:24px; }
.capture-form { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); align-items:end; gap:16px; }
.capture-form label { display:flex; flex-direction:column; gap:6px; font-size:.875rem; color:var(--muted); }
.capture-form input,.capture-form select { min-height:44px; min-width:0; padding:10px; font:inherit; color:var(--text); border:1px solid var(--border); border-radius:7px; background:var(--surface); }
.capture-form input:focus-visible,.capture-form select:focus-visible { outline:3px solid var(--blue); outline-offset:2px; }
.capture-total { padding:10px; font-weight:600; color:var(--green); }
.capture-form .capture-actions { grid-column:1/-1; margin-top:12px; }
.overview-caption { color:var(--muted); margin-top:24px; }
.week-header,.day-header { display:flex; justify-content:space-between; align-items:center; gap:20px; list-style:none; }
.week-header::-webkit-details-marker,.day-header::-webkit-details-marker { display:none; }
.week-identity,.week-identity small,.day-header span,.day-header small { display:block; }
.week-identity strong { font-size:1.05rem; }
.week-identity small,.day-header small { margin-top:5px; font-size:.8125rem; color:var(--muted); font-weight:400; }
.week-glance { display:flex; align-items:center; gap:18px; font-variant-numeric:tabular-nums; }
.week-status { font-size:.75rem; font-weight:500; text-transform:capitalize; padding:4px 10px; border-radius:20px; background:var(--raised); color:var(--amber); }
.week-status.is-paid { color:var(--green); }
.week-chevron { color:var(--muted); }
.period-detail[open] > .week-header { border-bottom:1px solid var(--border); }
.period-detail[open] .week-chevron { transform:rotate(180deg); }
.week-paydate { font-size:.875rem; color:var(--muted); }
.week-pay-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.week-pay-grid .dashboard-metric { box-shadow:none; padding:16px; margin:0; }
.week-pay-grid .metric { font-size:1.4rem; }
.week-breakdown { margin:18px 0 24px; font-size:.875rem; }
.week-breakdown summary,.job-extra summary { cursor:pointer; color:var(--blue); min-height:36px; padding:8px 0; }
.week-tabs { display:flex; gap:8px; border-bottom:1px solid var(--border); padding-bottom:12px; margin-bottom:18px; }
.week-tabs button[aria-pressed=true] { background:var(--raised); color:var(--blue); border-color:var(--blue); }
.week-help { color:var(--muted); font-size:.875rem; }
.work-day { border:1px solid var(--border); border-radius:10px; margin-bottom:12px; }
.day-header { padding:16px 18px; cursor:pointer; }
.day-header:after { content:'+'; color:var(--muted); }
.work-day[open] > .day-header:after { content:'−'; }
.day-header > span { flex:1; }
.job-list { padding:0 18px; border-top:1px solid var(--border); }
.job-card { padding:18px 0; border-bottom:1px solid var(--border); }
.job-card:last-child { border-bottom:0; }
.job-top { display:flex; justify-content:space-between; gap:18px; }
.job-top > div { min-width:0; }
.job-top small,.job-top > div > strong { display:block; overflow-wrap:anywhere; }
.job-top small { color:var(--muted); font-size:.75rem; margin-bottom:5px; }
.job-amount { white-space:nowrap; font-variant-numeric:tabular-nums; }
.job-hours { display:inline-block; font-size:.8125rem; color:var(--muted); margin-top:8px; }
.job-extra { font-size:.875rem; margin-top:6px; }
.job-extra p { max-width:75ch; overflow-wrap:anywhere; }
.review-item { padding:18px; margin-bottom:12px; border:1px solid var(--border); border-left:3px solid var(--amber); border-radius:8px; }
.review-item p { font-size:.875rem; color:var(--muted); margin:8px 0 0; }
@media(max-width:600px) { .week-pay-grid { grid-template-columns:1fr; } .week-header { align-items:flex-start; gap:10px; } .week-glance { flex-wrap:wrap; justify-content:flex-end; gap:8px; max-width:130px; } .week-glance > strong { order:3; width:100%; text-align:right; } .job-top { gap:10px; } }
@media(max-width:480px) { .dashboard-metrics { grid-template-columns:1fr; } .period-detail > summary { padding:16px; } }
dialog.account-dialog { position:fixed; margin:auto; width:min(680px, calc(100% - 32px)); max-height:calc(100dvh - 48px); overflow:auto; padding:28px; color:var(--text); }
dialog.account-dialog:not([open]) { display:none; }
dialog.account-dialog::backdrop { background:rgb(20 33 55 / 35%); }
.account-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:20px; }
.account-heading h1 { margin:0; font-size:1.6rem; }
#team-tools { border-top:1px solid var(--border); padding-top:24px; margin-top:24px; }
.team-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.team-heading h2 { margin-bottom:6px; }
.team-heading p, .team-note { font-size:.875rem; }
.team-note { padding:12px 14px; background:var(--raised); border-radius:8px; color:var(--muted); }
.team-member { display:flex; flex-wrap:wrap; align-items:flex-start; gap:12px; padding:18px 0; border-bottom:1px solid var(--border); }
.team-identity { flex:1; min-width:180px; overflow-wrap:anywhere; }
.team-identity span, .team-identity small { display:block; color:var(--muted); }
.team-status { border:1px solid var(--border); border-radius:5px; padding:2px 8px; font-size:.75rem; text-transform:capitalize; }
.team-status.is-active { color:var(--green); border-color:var(--green); }
.team-actions { display:flex; flex-wrap:wrap; gap:8px; width:100%; margin-top:10px; }
#team-change { margin-top:20px; padding:18px; background:var(--raised); border-radius:8px; }
#team-change label { display:block; font-size:.875rem; margin-bottom:6px; }
#team-reason { width:100%; min-height:44px; font:inherit; color:var(--text); background:var(--surface); border:1px solid var(--border); border-radius:6px; padding:8px; }
#team-reason:focus-visible { outline:3px solid var(--blue); outline-offset:2px; }
@media(max-width:480px) { .team-heading { flex-direction:column; } }
#dashboard-host .sidebar-footer strong { overflow-wrap:anywhere; }
body > #view-banner { margin:0; border-radius:0; position:sticky; top:0; z-index:10; }
#view-banner { padding:18px; border:1px solid #dbb978; background:#fff6e5; border-radius:8px; margin:20px 0; }
#view-tools { padding:20px 0; border-top:1px solid var(--border); margin-top:20px; }
#view-users { margin-top:16px; }
/* Public entry discloses no department structure or demo controls. */
body[data-design=stripe] main.private-entry { max-width:none; min-height:100dvh; padding:64px 24px 32px; display:flex; flex-direction:column; align-items:center; justify-content:center; background:#f6f8fc; }
.private-entry > .brand { margin-bottom:32px; }
.entry-card { width:100%; max-width:420px; padding:36px; background:#fff; border:1px solid #e3e8f0; border-radius:16px; box-shadow:0 12px 40px #24385808; }
.entry-card h1 { font-size:1.7rem; margin:0 0 10px; letter-spacing:-.03em; }
.entry-intro { color:var(--muted); font-size:.9375rem; margin-bottom:26px; }
.entry-card .login-outline { padding:0; margin:0; border:0; background:none; }
.entry-card .login-outline label { margin-top:18px; }
.entry-card #login-submit { min-height:48px; font-weight:600; }
.entry-card #login-message:empty { display:none; }
.entry-card #login-message { font-size:.875rem; color:#a52c34; margin:16px 0 0; }
.entry-help { text-align:center; font-size:.8125rem; color:var(--muted); border-top:1px solid var(--border); padding-top:22px; margin:26px 0 0; }
.entry-footer { font-size:.75rem; color:var(--muted); margin-top:28px; }
@media(max-width:480px) { body[data-design=stripe] main.private-entry { padding:32px 20px; } .entry-card { padding:28px 24px; } }
.login-outline label { display:block; font-size:.875rem; margin:12px 0 5px; }
.login-outline input { width:100%; padding:12px; border:1px solid #c6d0df; border-radius:7px; background:white; color:#172b4d; font:inherit; }
.login-outline input:focus-visible { outline:3px solid var(--accent); outline-offset:2px; }
.login-outline #login-submit { margin-top:18px; background:var(--accent); color:white; }
.login-outline #login-submit:hover { background:var(--accent-hover); }
.auth-workspace { margin:48px auto; max-width:720px; padding:28px; background:white; border:1px solid var(--border); border-radius:12px; }
.auth-workspace h1 { margin-top:24px; }
@media(max-width:700px) { .auth-workspace { margin:20px 16px; padding:20px; } }
* { box-sizing: border-box; }
body { margin: 0; background: var(--canvas); color: var(--text); font: 1rem/1.6 var(--body); }
[hidden] { display: none !important; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; color: inherit; cursor: pointer; min-height: 44px; }
button:disabled { cursor: not-allowed; color: var(--muted); }
a { color: inherit; }
button:focus-visible, a:focus-visible { outline: 3px solid var(--blue); outline-offset: 4px; }
main:focus { outline: none; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: var(--display); line-height: 1.25; }
h1 { font-size: 2.2rem; font-weight: 650; letter-spacing: -.045em; margin-bottom: 8px; }
h2 { font-size: 1.4rem; font-weight: 600; }
h3 { font-size: 1.1rem; }
p { margin-bottom: 18px; }
.muted, .fine { color: var(--muted); }
.fine { font-size: .875rem; margin-top: 20px; }
.eyebrow, .nav-caption { font-size: .75rem; font-weight: 600; letter-spacing: .11em; color: var(--muted); margin-bottom: 10px; }
.brand { display: flex; align-items: center; gap: 11px; text-decoration: none; font: 700 1.3rem var(--display); letter-spacing: -.025em; }
.brand strong { font-weight: 400; color: var(--muted); }
.brand-mark { display: grid; place-items: center; width: 36px; height: 36px; background: var(--blue); border-radius: 11px; color: white; font-size: 1.3rem; box-shadow: 0 4px 8px #265dc71a; }
.welcome { min-height: 100dvh; display: grid; grid-template-columns: 1.1fr 1fr; background: white; }
.welcome-story { padding: 44px 10%; display: flex; flex-direction: column; background: #eef3fb; border-right: 1px solid var(--border); }
.story-copy { margin: auto 0; padding: 70px 0; }
.story-copy h1 { font-size: clamp(2.5rem, 4.1vw, 4.1rem); line-height: 1.1; font-weight: 650; margin: 22px 0; }
.story-copy > p:not(.eyebrow) { max-width: 450px; color: var(--muted); font-size: 1.05rem; }
.department-list { display: grid; gap: 0; margin-top: 36px; border-top: 1px solid #d3ddec; max-width: 450px; }
.department-list span { display: block; padding: 16px 0; border-bottom: 1px solid #d3ddec; font-size: .875rem; font-weight: 600; letter-spacing: .06em; }
.department-list span::before { content: ""; display: inline-block; height: 8px; width: 8px; margin-right: 14px; border-radius: 2px; background: var(--blue); }
.department-list span:first-child::before { background: var(--amber); }
.department-list span:last-child::before { background: var(--green); }
.welcome-panel { align-self: center; max-width: 520px; width: 100%; padding: 44px; margin: auto; }
.welcome-panel h2 { margin: 24px 0 12px; font-size: 2rem; letter-spacing: -.035em; }
.preview-tag { display: inline-block; color: #51617a; background: #f0f3f8; border: 1px solid var(--border); padding: 4px 10px; border-radius: 6px; font-size: .6875rem; font-weight: 600; letter-spacing: .04em; }
.login-outline { padding: 20px; background: #f8fafc; border: 1px solid var(--border); border-radius: 12px; margin: 28px 0; }
.login-outline h3 { margin-bottom: 8px; }
.login-outline p { font-size: .875rem; color: var(--muted); }
.login-outline button { width: 100%; background: #edf1f5; border: 0; border-radius: 7px; padding: 10px; font-size: .875rem; }
.primary, .secondary { width: 100%; border-radius: 9px; padding: 14px 16px; text-align: left; margin-bottom: 12px; font-size: .9375rem; }
.primary { color: white; background: var(--blue); border: 1px solid var(--blue); font-weight: 600; display: flex; justify-content: space-between; gap: 12px; box-shadow: 0 3px 8px #265dc71a; }
.primary:hover { background: var(--accent-hover); }
.secondary { background: white; border: 1px solid #ced7e4; }
.secondary:hover, .quiet:hover, .menu-grid button:hover { background: var(--raised); }
.workspace { min-height: 100dvh; display: grid; grid-template-columns: 228px minmax(0, 1fr); }
.sidebar { position: sticky; top: 0; height: 100dvh; padding: 28px 16px 20px; border-right: 1px solid var(--border); display: flex; flex-direction: column; background: white; overflow-y: auto; }
.sidebar .brand { margin: 0 12px 44px; }
.nav-caption { font-size: .6875rem; padding: 0 14px; margin-bottom: 12px; }
.nav-button { width: 100%; display: flex; align-items: center; gap: 12px; padding: 11px 14px; border: 0; border-radius: 8px; background: none; text-align: left; margin-bottom: 5px; font-size: .875rem; color: #58677b; }
.nav-button:hover { background: #f5f7fb; }
.nav-button.active { background: #edf3ff; color: var(--blue); font-weight: 600; }
.nav-icon { display: flex; align-items: center; flex: 0 0 20px; }
.nav-icon svg { width: 20px; height: 20px; }
.sidebar #desktop-nav > .nav-button:nth-child(5) { margin-top: 30px; }
.sidebar-footer { margin-top: auto; border-top: 1px solid var(--border); padding: 20px 10px 0; display: flex; gap: 10px; align-items: center; }
.avatar { display: grid; place-items: center; flex: 0 0 36px; height: 36px; background: #ebeff5; border-radius: 50%; font-size: .875rem; font-weight: 600; }
.sidebar-footer strong, .sidebar-footer div > span { display: block; font-size: .8125rem; }
.sidebar-footer div > span { color: var(--muted); font-size: .75rem; }
.topbar { min-height: 68px; background: white; border-bottom: 1px solid var(--border); padding: 12px 36px; display: flex; align-items: center; justify-content: space-between; gap: 16px; font-size: .8125rem; color: var(--muted); }
.topbar > span { font-weight: 500; color: #42536a; }
.topbar > div { display: flex; align-items: center; gap: 16px; }
.quiet { background: white; border: 1px solid #d5dde8; padding: 8px 12px; border-radius: 7px; font-size: .8125rem; font-weight: 500; }
.topbar .quiet { border: 0; color: var(--muted); }
main { max-width: 1480px; margin: auto; padding: 34px 36px 48px; }
.page-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.date-label { color: #465970; font-size: .8125rem; background: white; border: 1px solid var(--border); padding: 8px 13px; border-radius: 8px; }
.demo-notice { display: flex; gap: 14px; align-items: center; font-size: .8125rem; color: var(--muted); margin: 14px 0 30px; }
.notice-label { white-space: nowrap; font-size: .75rem; color: #4e6482; padding-left: 10px; border-left: 2px solid #a9bbd4; }
.module-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.module-card, .panel { background: white; border: 1px solid var(--border); border-radius: 13px; overflow: hidden; box-shadow: 0 2px 3px #213b5903, 0 8px 20px #213b5903; }
.module-card { padding: 22px 22px 0; display: flex; flex-direction: column; --accent: var(--blue); --tint: #edf3ff; }
.module-card.field { --accent: var(--amber); --tint: #fbf3e7; }
.module-card.direct { --accent: var(--green); --tint: #eaf5f0; }
.card-heading { display: flex; align-items: center; gap: 11px; margin-bottom: 24px; }
.card-heading h2 { font-size: .9375rem; margin: 0; font-weight: 600; letter-spacing: -.01em; }
.department-icon { display: grid; place-items: center; width: 34px; height: 34px; color: var(--accent); background: var(--tint); border-radius: 9px; }
.department-icon svg { width: 19px; height: 19px; }
.metric-label { color: var(--muted); font-size: .8125rem; }
.metric { font: 650 2.3rem/1.25 var(--data); font-variant-numeric: tabular-nums; margin: 7px 0 22px; letter-spacing: -.045em; }
.card-details { margin-top: auto; padding-bottom: 14px; }
.summary-row { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 8px 0; font-size: .8125rem; }
.summary-row span { color: var(--muted); }
.summary-row strong { font-weight: 600; font-variant-numeric: tabular-nums; text-align: right; }
.card-link { display: flex; justify-content: space-between; align-items: center; color: var(--accent); background: transparent; border: 0; border-top: 1px solid var(--border); padding: 14px 0; text-align: left; width: 100%; font-size: .8125rem; font-weight: 600; }
.card-link:hover { color: var(--text); }
.lower-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 22px; margin-top: 26px; }
.panel-heading { padding: 22px 24px; display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.panel-heading h2 { font-size: 1rem; margin: 0; letter-spacing: -.02em; }
.panel-body { padding: 0 24px 20px; }
.task { padding: 19px 0; border-top: 1px solid #edf0f5; display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.task strong { display: block; font-size: .875rem; font-weight: 600; }
.task small { display: block; color: var(--muted); font-size: .75rem; margin-top: 5px; }
.badge { font-size: .75rem; background: #f1f4f8; color: #52627a; padding: 4px 9px; border-radius: 5px; white-space: nowrap; font-weight: 500; }
.badge.amber { color: var(--amber); background: #fcf2df; }
.activity { display: grid; grid-template-columns: 48px 1fr; gap: 12px; border-top: 1px solid #edf0f5; padding: 20px 0; }
.activity time { font-size: .75rem; color: var(--muted); font-variant-numeric: tabular-nums; padding-top: 2px; }
.activity p { margin: 0; font-size: .875rem; font-weight: 500; }
.activity small { display: block; font-size: .75rem; font-weight: 400; color: var(--muted); margin-top: 5px; }
.ledger { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid var(--border); margin-bottom: 24px; border-radius: 12px; background: white; }
.ledger > div { padding: 24px; border-right: 1px solid var(--border); }
.ledger > div:last-child { border-right: 0; }
.ledger .metric { margin-bottom: 0; }
.panel-body > .summary-row { border-top: 1px solid #edf0f5; padding: 15px 0; font-size: .9375rem; }
.table-wrap { overflow: auto; }
table { border-collapse: collapse; width: 100%; text-align: left; font-size: .875rem; }
thead { background: #f8fafc; }
th { color: var(--muted); font-weight: 500; font-size: .75rem; }
th, td { padding: 17px 24px; border-top: 1px solid #edf0f5; }
td { font-weight: 500; }
td .subtext { color: var(--muted); display: block; font-size: .75rem; margin-top: 4px; font-weight: 400; }
tbody tr:hover { background: #fafbfd; }
.empty { padding: 36px; max-width: 650px; }
.empty p { color: var(--muted); }
.menu-grid { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.menu-grid button { padding: 20px; border: 1px solid var(--border); background: white; text-align: left; border-radius: 9px; }
.mobile-nav { display: none; }
.skip-link { position: fixed; top: -100px; left: 16px; z-index: 20; background: var(--blue); color: white; padding: 12px; }
.skip-link:focus { top: 16px; }
@media (min-width: 1600px) { main { padding: 44px 48px; } .module-card { padding: 26px 26px 0; } }
@media (max-width: 1150px) {
  .workspace { grid-template-columns: 196px minmax(0, 1fr); }
  .sidebar { padding-inline: 12px; }
  main { padding: 28px 24px; }
  .module-grid { gap: 12px; }
  .module-card { padding: 18px 16px 0; }
  .metric { font-size: 2rem; }
  .card-heading { gap: 8px; }
  .card-heading h2 { font-size: .8125rem; }
  .lower-grid { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .module-grid { grid-template-columns: 1fr; }
  .module-card { display: grid; grid-template-columns: 1fr 1fr; column-gap: 24px; padding: 22px 22px 0; }
  .card-heading, .card-link { grid-column: 1 / -1; }
  .card-heading { margin-bottom: 18px; }
  .card-heading h2 { font-size: .9375rem; }
  .card-details { margin-top: 0; }
  .welcome-panel { padding: 28px; }
  .welcome-story { padding: 32px; }
  .ledger { grid-template-columns: 1fr; }
  .ledger > div { border-right: 0; border-bottom: 1px solid var(--border); }
  .ledger > div:last-child { border-bottom: 0; }
  .demo-notice { align-items: flex-start; flex-direction: column; gap: 5px; }
}
@media (max-width: 700px) {
  .welcome { display: block; }
  .welcome-story { padding: 24px; border: 0; }
  .story-copy { padding: 32px 0 4px; }
  .story-copy h1 { font-size: 2.65rem; }
  .story-copy > p:not(.eyebrow) { font-size: 1rem; }
  .department-list { margin-top: 24px; }
  .department-list span { padding: 10px 0; font-size: .75rem; }
  .welcome-story > .muted { display: none; }
  .welcome-panel { padding: 28px 24px; max-width: none; }
  .welcome-panel h2 { margin-top: 16px; }
  .workspace { display: block; }
  .sidebar { display: none; }
  .topbar { padding: 12px 16px; min-height: 62px; gap: 8px; flex-wrap: wrap; }
  .topbar > div { gap: 6px; }
  .topbar > span { font-size: .75rem; }
  .topbar .preview-tag { font-size: .625rem; }
  .topbar .quiet { font-size: .75rem; padding: 6px; }
  main { padding: 26px 18px 110px; }
  .page-heading { align-items: flex-start; flex-wrap: wrap; gap: 8px; }
  h1 { font-size: 1.9rem; }
  .date-label { font-size: .75rem; padding: 6px 10px; }
  .demo-notice { margin: 14px 0 24px; font-size: .75rem; }
  .module-grid { gap: 16px; }
  .module-card { column-gap: 14px; padding: 20px 18px 0; }
  .card-metric { min-width: 0; }
  .metric { font-size: 1.9rem; }
  .summary-row { gap: 8px; font-size: .75rem; padding: 6px 0; }
  .card-link { font-size: .8125rem; }
  .metric-label { font-size: .75rem; }
  .panel-heading { padding: 20px; }
  .panel-body { padding: 0 20px 20px; }
  .task { flex-wrap: wrap; gap: 10px; }
  .task strong { font-size: .875rem; }
  .mobile-nav { position: fixed; bottom: 0; left: 0; right: 0; display: flex; padding: 7px 6px calc(7px + env(safe-area-inset-bottom)); background: white; border-top: 1px solid var(--border); box-shadow: 0 -4px 20px #213b5906; z-index: 5; }
  .mobile-nav .nav-button { flex: 1; min-width: 0; flex-direction: column; gap: 5px; padding: 8px 2px; margin: 0; font-size: .6875rem; text-align: center; justify-content: center; line-height: 1.3; border-radius: 7px; }
  .mobile-nav .nav-icon { flex-basis: auto; }
  .mobile-nav .nav-icon svg { width: 20px; height: 20px; }
  .menu-grid { grid-template-columns: 1fr; }
  .empty { padding: 24px; }
  th, td { padding: 14px; }
  .badge { white-space: normal; }
}
@media (max-width: 360px) { .module-card { display: flex; } .card-details { margin-bottom: 10px; } }
@media (prefers-reduced-motion: no-preference) { button { transition: background .15s ease, color .15s ease; } }

/* Comparison controls stay neutral so the three directions can be judged fairly. */
.design-comparison { background: #fff; border-bottom: 1px solid #dce2ea; padding: 20px 28px; color: #213047; font: 14px/1.5 'Segoe UI',sans-serif; }
.design-comparison > div:first-child { display: flex; justify-content: space-between; gap: 20px; margin-bottom: 14px; }
.design-comparison p { margin: 0; color: #526079; }
.design-options { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.design-options button { display: flex; align-items: center; justify-content: space-between; gap: 12px; text-align: left; padding: 12px 16px; border: 1px solid #dce2ea; border-radius: 8px; background: #fff; color: #213047; font-size: 14px; }
.design-options button span { font-size: 12px; color: #526079; }
.design-options button[aria-pressed=true] { border-color: #345bb0; background: #edf3ff; box-shadow: inset 0 0 0 1px #345bb0; }

/* Linear direction: task-first composition and dense, neutral navigation. */
body[data-design=linear] { --canvas: #fafafa; --text: #25252a; --muted: #64646f; --blue: #5457b3; --border: #e6e6eb; }
[data-design=linear] .sidebar { background: #f5f5f7; }
[data-design=linear] .nav-button.active { background: #e9e9ef; color: #34343e; }
[data-design=linear] .brand-mark { background: #373740; box-shadow: none; border-radius: 7px; }
[data-design=linear] .topbar { min-height: 54px; }
[data-design=linear] main { padding-top: 26px; }
[data-design=linear] h1 { font-size: 1.8rem; }
[data-design=linear] #page-content:has(.module-grid) { display: flex; flex-direction: column; }
[data-design=linear] .lower-grid { order: -1; margin: 0 0 22px; }
[data-design=linear] .panel, [data-design=linear] .module-card { box-shadow: none; border-radius: 7px; }
[data-design=linear] .task { padding: 13px 0; }
[data-design=linear] .activity { padding: 15px 0; }
[data-design=linear] .card-heading { margin-bottom: 12px; }
[data-design=linear] .metric { font-size: 1.8rem; }
[data-design=linear] .department-icon { background: transparent; width: 24px; height: 24px; }
[data-design=linear] .summary-row { padding: 5px 0; }

/* Notion direction: document-like sections and quiet horizontal department rows. */
body[data-design=notion] { --canvas: #fff; --text: #302f2c; --muted: #6a6863; --blue: #425a70; --border: #e9e7e3; }
[data-design=notion] .sidebar { background: #f7f7f5; border-right: 0; }
[data-design=notion] .brand-mark { background: #fff; color: #302f2c; border: 1px solid #302f2c; border-radius: 4px; box-shadow: none; font-family: Georgia,serif; }
[data-design=notion] .nav-button.active { background: #eae9e5; color: #302f2c; }
[data-design=notion] .topbar { border: 0; }
[data-design=notion] main { max-width: 1120px; padding: 48px 64px; }
[data-design=notion] h1 { font-family: Georgia,serif; font-size: 2.8rem; font-weight: 500; letter-spacing: -.035em; }
[data-design=notion] .date-label { border: 0; padding: 0; }
[data-design=notion] .module-grid { display: flex; flex-direction: column; gap: 0; border-top: 1px solid var(--border); }
[data-design=notion] .module-card { display: grid; grid-template-columns: 1fr 1fr 1.2fr; align-items: start; gap: 12px 24px; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; box-shadow: none; padding: 24px 0; }
[data-design=notion] .card-heading { margin: 0; padding-top: 4px; }
[data-design=notion] .department-icon { background: transparent; width: 22px; }
[data-design=notion] .metric { font-size: 1.9rem; margin-bottom: 0; }
[data-design=notion] .card-details { padding: 0; margin: 0; }
[data-design=notion] .card-link { grid-column: 2 / -1; border: 0; padding: 0; min-height: 32px; justify-content: flex-start; gap: 10px; color: #6a6863; text-decoration: underline; text-underline-offset: 4px; }
[data-design=notion] .lower-grid { grid-template-columns: 1fr; gap: 30px; margin-top: 36px; }
[data-design=notion] .panel { border: 0; border-radius: 0; box-shadow: none; }
[data-design=notion] .panel-heading { padding: 0 0 18px; }
[data-design=notion] .panel-heading h2 { font-family: Georgia,serif; font-size: 1.35rem; font-weight: 500; }
[data-design=notion] .panel-body { padding: 0; }
[data-design=notion] .task { padding: 17px 0; }
[data-design=notion] .quiet { border: 0; text-decoration: underline; text-underline-offset: 3px; }

/* Stripe direction: financial summary first, larger figures and an analytics band. */
body[data-design=stripe] { color-scheme:light; }
[data-design=stripe] .workspace { grid-template-columns: 244px minmax(0,1fr); }
[data-design=stripe] .brand-mark { background: var(--accent); }
[data-design=stripe] .nav-button.active { background: var(--accent-tint); color: var(--accent); box-shadow:inset 3px 0 var(--accent); font-weight:600; }
[data-design=stripe] .topbar { border-bottom: 1px solid var(--border); }
[data-design=stripe] .module-grid { gap: 0; padding: 12px 0; background: white; border: 1px solid var(--border); border-radius: 12px; box-shadow: 0 6px 24px #243c5a08; }
[data-design=stripe] .module-card { border: 0; border-right: 1px solid var(--border); border-radius: 0; box-shadow: none; padding: 18px 26px 0; }
[data-design=stripe] .module-card:last-child { border-right: 0; }
[data-design=stripe] .metric { font-size: 1.75rem; font-weight:700; letter-spacing: -.035em; color: var(--text); }
[data-design=stripe] .card-heading { margin-bottom: 24px; }
[data-design=stripe] .department-icon { border-radius: 50%; }
[data-design=stripe] .lower-grid { grid-template-columns: 1.65fr 1fr; margin-top: 32px; }
[data-design=stripe] .panel-heading { background: var(--surface); border-bottom: 1px solid var(--border); margin-bottom: 4px; }
[data-design=stripe] thead { background: var(--raised); color:var(--body-text); }
[data-design=stripe] .ledger { border-top: 3px solid var(--accent); }

@media(max-width:1100px) {
  .design-options button { flex-direction: column; align-items: flex-start; gap: 2px; }
  .design-comparison > div:first-child { display: block; }
  [data-design=notion] main { padding: 30px; }
  [data-design=notion] .module-card { grid-template-columns: 1fr 1fr; }
  [data-design=notion] .card-heading { grid-column: 1 / -1; }
  [data-design=stripe] .workspace { grid-template-columns: 196px minmax(0,1fr); }
  [data-design=stripe] .metric { font-size: 1.75rem; }
  [data-design=stripe] .lower-grid { grid-template-columns: 1fr; }
}
@media(max-width:700px) {
  .design-comparison { padding: 16px; }
  .design-comparison p { font-size: 12px; margin-top: 4px; }
  .design-options { gap: 6px; }
  .design-options button { font-size: 12px; padding: 10px 7px; }
  .design-options button span { font-size: 11px; }
  [data-design=notion] main { padding: 28px 20px 110px; }
  [data-design=notion] h1 { font-size: 2.2rem; }
  [data-design=notion] .card-link { grid-column: 1 / -1; }
  [data-design=stripe] .workspace { display: block; }
  [data-design=stripe] .module-card { border-right: 0; border-bottom: 1px solid var(--border); padding: 20px 18px 0; }
  [data-design=stripe] .module-card:last-child { border-bottom: 0; }
  [data-design=linear] .lower-grid { grid-template-columns: 1fr; }
}
.capture-photo { grid-column: 1 / -1; padding: 20px; border: 1px solid #dce3f0; border-radius: 12px; background: #f7f9fe; display: grid; gap: 16px; }
.capture-photo-preview { max-width: 100%; max-height: 360px; object-fit: contain; justify-self: start; }
.capture-photo input[type="checkbox"] { width: 20px; height: 20px; }
.capture-read-status:not(:empty) { margin:0; padding:10px 12px; border-radius:8px; background:#eef4ff; color:#244679; font-weight:600; }
.capture-read-status.is-error { background:#fff1f0; color:#a1262b; border:1px solid #f2c8c5; }
.capture-photo-note { margin:0; color:var(--muted); font-size:.8125rem; }
.capture-panel .capture-steps {font-size:.875rem;font-weight:600;color:#6046cf;margin:0 0 16px}
.capture-panel .capture-photo {border:1px solid #e2e5ed;background:#fff;border-radius:14px;padding:24px;gap:16px}
.capture-panel .capture-photo h3 {font-size:1.125rem;margin:0;color:#182746}
.capture-panel .capture-photo-preview {max-height:240px;max-width:100%;object-fit:contain;margin:auto}
.capture-panel .capture-photo .expense-disclosure {border:0;margin:0;font-size:.8125rem}
.capture-panel .capture-photo .capture-read-status.is-error {color:#a1262b}
.capture-panel .capture-photo .capture-read-status:not(.is-error) {color:#244679}
.capture-panel .capture-photo .capture-manual {justify-self:start;padding:0;border:0;background:transparent;color:#536582;text-decoration:underline;text-underline-offset:3px;box-shadow:none}
.capture-panel .capture-photo .capture-manual:hover {color:#6046cf}
.capture-panel .capture-photo input[type=checkbox] {width:18px;height:18px;accent-color:#6046cf}
.reimbursement-unfiled {margin:20px 0;width:100%;text-align:left}

/* Approved light visual system. Legacy prototype variants remain historical. */
body[data-design=stripe] { font-size:14px; line-height:1.5; }
[data-design=stripe] h1 { font-size:30px; font-weight:700; letter-spacing:-.035em; }
[data-design=stripe] h2 { font-size:20px; font-weight:600; }
[data-design=stripe] h3 { font-size:16px; font-weight:600; }
[data-design=stripe] p { color:var(--body-text); }
[data-design=stripe] .page-heading { margin-bottom:24px; }
[data-design=stripe] .panel,[data-design=stripe] .module-card { background:var(--surface); border-color:var(--border); border-radius:var(--radius-card); box-shadow:var(--shadow-card); }
[data-design=stripe] .capture-actions { gap:12px; margin-bottom:24px; }
[data-design=stripe] .quiet { border:1px solid var(--border); background:var(--surface); border-radius:var(--radius-control); color:var(--text); padding:10px 16px; font-size:14px; font-weight:600; text-decoration:none; }
[data-design=stripe] .quiet:hover { background:var(--raised); border-color:#c8ced8; }
[data-design=stripe] .quiet.btn-primary { color:white; background:var(--accent); border-color:var(--accent); box-shadow:0 2px 4px #5b45d61a; }
[data-design=stripe] .quiet.btn-primary:hover { background:var(--accent-hover); border-color:var(--accent-hover); }
[data-design=stripe] .quiet:disabled { opacity:.55; cursor:not-allowed; }
[data-design=stripe] .topbar .quiet { border-color:transparent; color:var(--body-text); padding:8px 10px; background:transparent; }
[data-design=stripe] .dashboard-metrics { gap:20px; margin:32px 0; }
[data-design=stripe] .dashboard-metric { padding:24px; }
[data-design=stripe] .metric-label { color:var(--body-text); font-size:12px; font-weight:600; }
[data-design=stripe] .dashboard-metric .metric { margin:12px 0 8px; }
[data-design=stripe] .capture-panel { padding:24px; margin-bottom:32px; }
[data-design=stripe] .capture-photo { background:var(--surface); border:1px dashed #c5bcef; }
[data-design=stripe] .capture-photo label:has(input[type=checkbox]) { display:flex; flex-direction:row-reverse; justify-content:flex-end; align-items:flex-start; gap:10px; font-weight:400; }
[data-design=stripe] .capture-photo input[type=checkbox] { flex:0 0 20px; min-height:20px; margin:1px 0; accent-color:var(--accent); }
[data-design=stripe] input[type=file] { max-width:100%; width:100%; font-size:12px; padding:8px; }
[data-design=stripe] input[type=file]::file-selector-button { border:0; border-radius:6px; padding:8px 12px; margin-right:12px; background:var(--accent-tint); color:var(--accent); font:600 12px var(--body); cursor:pointer; }
[data-design=stripe] .expense-section > .panel-body { padding:0; }
[data-design=stripe] .capture-actions > .btn-primary::before { content:'+'; font-size:18px; margin-right:8px; line-height:1; }
[data-design=stripe] .capture-form .capture-actions > .btn-primary::before { content:none; }
[data-design=stripe] .week-pay-grid .metric { font-size:22px; }
[data-design=stripe] .mobile-nav .nav-button.active { box-shadow:inset 0 2px var(--accent); }
[data-design=stripe] .capture-form label { color:var(--body-text); font-weight:500; }
[data-design=stripe] input,[data-design=stripe] select { border-radius:var(--radius-control); }
[data-design=stripe] .field-controls { padding:20px 24px; }
[data-design=stripe] .week-status { background:var(--warning-tint); color:var(--amber); border-radius:6px; font-weight:600; }
[data-design=stripe] .week-status.is-paid { background:var(--success-tint); color:var(--green); }
[data-design=stripe] .week-status.is-invoiced { background:var(--info-tint); color:var(--info); }
[data-design=stripe] .review-item { border-left-color:var(--error); }
[data-design=stripe] .expense-folders { background:transparent; border:0; box-shadow:none; padding:8px 0 0; margin:0 0 32px; overflow:visible; }
[data-design=stripe] .expense-folder-grid { gap:20px; margin-top:20px; }
[data-design=stripe] .expense-folder-card { padding:24px; gap:10px; background:var(--surface); box-shadow:var(--shadow-card); border-radius:var(--radius-card); }
[data-design=stripe] .expense-folder-card:hover { border-color:#b9acf0; box-shadow:0 4px 16px #172b4d0d; background:var(--surface); }
[data-design=stripe] .expense-folder-card > strong:first-child { font-size:16px; font-weight:600; }
[data-design=stripe] .expense-folder-card > strong:last-of-type { font-size:28px; letter-spacing:-.035em; }
[data-design=stripe] .expense-folder-card > span:last-child { color:var(--accent); font-weight:600; margin-top:8px; }
[data-design=stripe] .status-chip { display:inline-flex; align-items:center; align-self:flex-start; border-radius:6px; padding:4px 9px; font-size:12px; font-weight:600; color:var(--body-text); background:#f2f4f7; }
[data-design=stripe] .status-chip.status-open { color:var(--info); background:var(--info-tint); }
[data-design=stripe] .status-chip.status-ready,[data-design=stripe] .status-chip.status-reimbursed { color:var(--green); background:var(--success-tint); }
[data-design=stripe] .status-chip.status-submitted { color:var(--info); background:var(--info-tint); }
[data-design=stripe] .status-chip.status-warning { color:var(--amber); background:var(--warning-tint); }
[data-design=stripe] .status-chip.status-error { color:var(--error); background:var(--error-tint); }
[data-design=stripe] .expense-day-heading { color:var(--body-text); margin:24px 0 8px; padding:0; font-size:12px; font-weight:600; }
[data-design=stripe] .expense-row-summary { padding:14px 12px; border-radius:8px; }
[data-design=stripe] .expense-row-summary > strong:nth-child(3) { text-align:right; }
[data-design=stripe] .expense-row-summary > span:last-child { text-align:right; }
[data-design=stripe] .expense-row-summary:hover { background:#f8f7fe; }
[data-design=stripe] .expense-section { margin-bottom:32px; }
@media(max-width:600px) {
  [data-design=stripe] h1 { font-size:26px; }
  [data-design=stripe] .expense-folder-card,[data-design=stripe] .capture-panel { padding:20px; }
  [data-design=stripe] .capture-form { grid-template-columns:minmax(0,1fr); }
  [data-design=stripe] .expense-row-summary > strong:nth-child(3) { text-align:left; }
}

/* Expense workspace: scan the record first, disclose commands on demand. */
.expense-section > summary { font-size:1.1rem; }
.expense-totals { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-bottom:24px; padding-bottom:24px; border-bottom:1px solid var(--border); }
.expense-totals span { display:block; color:var(--muted); font-size:.8125rem; }
.expense-totals strong { display:block; font-size:1.7rem; font-family:var(--display); font-variant-numeric:tabular-nums; letter-spacing:-.035em; }
.expense-toolbar { margin-bottom:12px; grid-template-columns:minmax(200px,1fr) minmax(240px,2fr); }
.expense-results { color:var(--muted); font-size:.8125rem; margin:0 0 16px; }
.expense-card { padding:22px; border:1px solid var(--border); border-radius:12px; margin-bottom:14px; background:var(--surface); }
.expense-card-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; }
.expense-card-heading > div:first-child { min-width:0; overflow-wrap:anywhere; }
.expense-card-heading > div:first-child > strong { font-size:1rem; }
.expense-card p { margin:8px 0; font-size:.875rem; color:var(--muted); overflow-wrap:anywhere; }
.expense-card-amount { text-align:right; flex-shrink:0; }
.expense-card-amount > strong { display:block; font-size:1.35rem; font-variant-numeric:tabular-nums; }
.expense-badge { display:inline-block; margin-top:6px; padding:3px 9px; font-size:.75rem; border-radius:5px; color:var(--text); background:var(--raised); }
.expense-card-actions { align-items:center; gap:8px; margin:16px 0 12px; }
.expense-card-actions .quiet { padding:8px 12px; font-size:.8125rem; }
.expense-description { max-width:75ch; }
.expense-receipt-note { color:var(--muted); font-size:.8125rem; }
.expense-disclosure { border-top:1px solid var(--border); }
.expense-disclosure > summary { cursor:pointer; padding:12px 0; font-size:.8125rem; font-weight:600; min-height:44px; }
.expense-disclosure > summary:focus-visible { outline:3px solid var(--blue); outline-offset:2px; }
.expense-disclosure-body { padding:4px 0 18px; }
.expense-disclosure-body .capture-form { grid-template-columns:minmax(200px,1fr) minmax(180px,1fr); }
.expense-disclosure-body [role=status] { grid-column:1/-1; }
.expense-folder-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr)); gap:12px; margin-top:18px; }
.expense-folder-card { display:flex; flex-direction:column; align-items:flex-start; text-align:left; gap:6px; border:1px solid var(--border); border-radius:10px; padding:18px; background:var(--surface); overflow-wrap:anywhere; }
.expense-folder-card:hover { border-color:var(--blue); background:var(--raised); }
.expense-folder-card span { color:var(--muted); font-size:.8125rem; }
.expense-folder-card strong:last-of-type { font-size:1.25rem; font-variant-numeric:tabular-nums; margin-top:6px; }
.expense-empty { padding:24px; color:var(--muted); border:1px dashed var(--border); border-radius:10px; }
.expense-section { padding:24px; }
.expense-section > h2 { margin:18px 0; }
.expense-row { border-bottom:1px solid var(--border); }
.expense-row-summary { display:grid; grid-template-columns:minmax(120px,2fr) minmax(80px,1fr) minmax(80px,1fr) minmax(80px,1fr); gap:12px; align-items:center; min-height:56px; padding:12px 8px; cursor:pointer; font-size:.875rem; }
.expense-row-summary:hover { background:var(--raised); }
.expense-row-summary span { color:var(--muted); }
.expense-row-summary strong { overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
.expense-row-summary:focus-visible { outline:3px solid var(--blue); outline-offset:2px; }
.expense-row .expense-card { margin:8px 0 16px; }
.expense-day-heading { font-size:.875rem; color:var(--muted); padding-top:16px; }
.unfiled-expenses { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 24px; color:var(--muted); font-size:.875rem; }
.expense-suggestion { grid-column:1/-1; padding:12px; background:var(--raised); border-radius:8px; }
.expense-compact-button { display:flex; width:100%; justify-content:space-between; align-items:center; gap:20px; padding:14px 16px; background:var(--surface); color:var(--text); text-align:left; border:0; border-bottom:1px solid var(--border); border-radius:0; }
.expense-compact-button > span { display:grid; gap:5px; }
.expense-compact-button > span > span { color:var(--muted); font-size:12px; }
.expense-compact-button > strong { font-variant-numeric:tabular-nums; white-space:nowrap; }
.expense-compact-button:hover { background:var(--raised); }
.expense-compact-button:focus-visible { outline:3px solid var(--accent); outline-offset:-3px; }
.expense-detail-screen { padding:24px; max-width:960px; }
.reimbursement-home { max-width:940px; background:transparent; border:0; box-shadow:none; padding:0; }
[data-design=stripe] .reimbursement-home { background:transparent; border:0; box-shadow:none; }
.reimbursement-eyebrow { margin:0 0 12px; color:var(--muted); font-size:12px; font-weight:700; letter-spacing:.1em; }
.reimbursement-current { padding:28px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-card); box-shadow:var(--shadow-card); }
.reimbursement-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.reimbursement-heading h2 { margin:0; color:var(--text); font-size:24px; line-height:1.25; }
.reimbursement-name,.reimbursement-help { color:var(--muted); margin:10px 0 20px; }
.reimbursement-metrics { display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:16px; padding:22px 0; margin:20px 0 0; border-top:1px solid var(--border); }
.reimbursement-metrics span,.reimbursement-metrics strong { display:block; }
.reimbursement-metrics span { color:var(--muted); font-size:13px; }
.reimbursement-metrics strong { color:var(--text); font-size:20px; font-variant-numeric:tabular-nums; }
.reimbursement-metrics > div:first-child strong { font-size:28px; letter-spacing:-.035em; }
.reimbursement-actions { display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin:4px 0 12px; }
.reimbursement-actions .quiet,.reimbursement-current > .quiet { min-height:44px; }
.reimbursement-report-ready { display:flex; flex-wrap:wrap; gap:8px 18px; align-items:center; padding:14px 16px; margin:16px 0; border:1px solid #b7e4cb; border-radius:var(--radius-control); background:var(--success-tint); color:var(--green); }
.reimbursement-report-ready span { font-size:13px; }
.reimbursement-expenses { border-top:1px solid var(--border); margin-top:22px; }
.reimbursement-history { margin-top:32px; }
.reimbursement-history h2 { margin:0 0 12px; font-size:18px; }
.reimbursement-history-row { display:grid; grid-template-columns:minmax(0,1fr) auto auto; align-items:center; gap:16px; width:100%; min-height:56px; padding:12px 16px; text-align:left; background:var(--surface); border:1px solid var(--border); border-bottom:0; color:var(--text); cursor:pointer; }
.reimbursement-history-row:first-of-type { border-radius:var(--radius-control) var(--radius-control) 0 0; }
.reimbursement-history-row:last-child { border-bottom:1px solid var(--border); border-radius:0 0 var(--radius-control) var(--radius-control); }
.reimbursement-history-row:hover { background:var(--raised); }
.reimbursement-history-row strong { font-variant-numeric:tabular-nums; }
.reimbursement-advanced { margin-top:24px; color:var(--body-text); }
.reimbursement-advanced summary { cursor:pointer; min-height:44px; padding:12px 0; }
.reimbursement-advanced > button { margin:8px 0 0; }
.reimbursement-history-row:focus-visible,.reimbursement-advanced summary:focus-visible { outline:3px solid var(--accent); outline-offset:2px; }
.work-expense-home { max-width:1080px; }
.work-expense-top { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:12px; }
.work-expense-title h2 { margin:0; color:var(--text); font-size:26px; }
.work-expense-title .reimbursement-help { margin:6px 0 0; }
.work-expense-add { position:relative; flex:none; }
.work-expense-add summary { display:flex; align-items:center; justify-content:center; min-width:112px; min-height:44px; padding:10px 18px; border-radius:var(--radius-control); background:var(--accent); color:#fff; font-weight:700; cursor:pointer; list-style:none; }
.work-expense-add summary::-webkit-details-marker { display:none; }
.work-expense-add[open] { z-index:4; }
.work-expense-add > button { display:block; width:220px; min-height:44px; margin-top:4px; text-align:left; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-control); color:var(--text); }
.work-expense-add > button:hover,.work-expense-add summary:hover { filter:brightness(.97); }
.work-expense-caveat { margin:0 0 24px; padding:12px 16px; border-left:3px solid var(--accent); background:var(--surface); color:var(--body-text); font-size:13px; }
.work-expense-month { margin:0 0 18px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-card); box-shadow:var(--shadow-card); overflow:hidden; }
.work-expense-month-summary,.work-expense-week-summary,.work-expense-day-summary { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:52px; padding:14px 20px; cursor:pointer; }
.work-expense-month-summary { background:var(--raised); font-size:17px; }
.work-expense-month-summary span,.work-expense-day-categories { color:var(--body-text); font-size:13px; }
.work-expense-week { border-top:1px solid var(--border); }
.work-expense-week-summary > span:first-child,.work-expense-day-summary > span:first-child { display:grid; gap:3px; }
.work-expense-week-summary small,.work-expense-day-summary small { color:var(--muted); font-size:12px; }
.work-expense-takehome { font-size:18px; font-variant-numeric:tabular-nums; color:var(--text); }
.work-expense-week-body { padding:0 20px 20px; }
.work-expense-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:var(--radius-control); overflow:hidden; }
.work-expense-metrics > div { display:grid; gap:5px; padding:16px; background:var(--surface); }
.work-expense-metrics span { color:var(--body-text); font-size:12px; }
.work-expense-metrics strong { color:var(--text); font-size:17px; font-variant-numeric:tabular-nums; }
.work-expense-metrics > div:last-child strong { color:var(--accent); }
.work-expense-categories { margin:14px 0; color:var(--body-text); font-size:13px; }
.work-expense-day { border-top:1px solid var(--border); }
.work-expense-day-summary { padding-inline:4px; }
.work-expense-day .expense-row { margin-left:14px; width:calc(100% - 14px); }
.work-expense-empty { padding:6px 16px; color:var(--muted); font-size:13px; }
.work-expense-unassigned { padding:20px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-card); }
.work-expense-unassigned h3 { margin:0; }
.bank-import-rows { display:grid; gap:16px; grid-column:1/-1; }
.bank-import-row { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; min-width:0; padding:16px; border:1px solid var(--border); border-radius:var(--radius-control); }
.bank-import-row legend { color:var(--text); font-weight:700; padding:0 6px; }
.bank-import-row > p { grid-column:1/-1; margin:0; }
.bank-import-row label { min-width:0; }
.bank-import-row label:has(input[type=checkbox]) { display:flex; align-items:center; gap:8px; grid-column:1/-1; }
.bank-import-row input[type=checkbox] { width:18px; height:18px; }
.bank-duplicate-note:not(:empty) { padding:10px 12px; border-left:3px solid var(--amber); border-radius:0 var(--radius-control) var(--radius-control) 0; background:var(--warning-tint); color:var(--amber); font-weight:600; }
.bank-review-note:not(:empty) { padding:10px 12px; border-left:3px solid var(--amber); border-radius:0 var(--radius-control) var(--radius-control) 0; background:var(--warning-tint); color:var(--text); font-weight:600; }
.work-expense-add summary:focus-visible,.work-expense-add > button:focus-visible,.work-expense-month summary:focus-visible { outline:3px solid var(--accent); outline-offset:2px; }
.expense-detail-content { margin-top:24px; }
.expense-detail-amount { display:block; font-size:28px; font-variant-numeric:tabular-nums; margin:16px 0; }
.receipt-thumbnail { display:block; width:112px; height:128px; object-fit:contain; background:var(--raised); margin-top:8px; border-radius:8px; }
.expense-more > summary { cursor:pointer; padding:12px 16px; border:1px solid var(--border); border-radius:8px; min-height:44px; }
.expense-more > div { padding:16px; border:1px solid var(--border); border-radius:8px; max-width:640px; margin-top:8px; }
.btn-danger { color:var(--error); border-color:var(--error); }
.capture-form label:has(input[type=checkbox]) { display:flex; align-items:center; gap:10px; }
.capture-form input[type=checkbox] { width:20px; min-height:20px; }
.capture-form > .expense-disclosure { grid-column:1/-1; }
.capture-form .needs-review { border:2px solid var(--amber); }
.field-tabs { display:flex; gap:6px; overflow-x:auto; margin:0 0 20px; border-bottom:1px solid #e4e7ec; padding-bottom:8px; }
.field-tabs button { border:0; background:transparent; color:#475467; padding:12px 16px; border-radius:8px; white-space:nowrap; font-weight:600; cursor:pointer; }
.field-tabs button.active { background:#f0edff; color:#5b45d6; }
.field-tabs button:focus-visible { outline:2px solid #5b45d6; outline-offset:2px; }
.ledger-filters { display:grid; grid-template-columns:1fr 1fr 2fr; gap:12px; margin:16px 0; padding:0; background:transparent; border:0; }
.ledger-period-summary { background:white; border:1px solid #e4e7ec; border-radius:12px; padding:20px; box-shadow:0 2px 8px #172b4d06; }
.ledger-period-summary h2 { margin:8px 0; font-size:22px; }
.ledger-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; margin-top:20px; }
.ledger-kpis span,.ledger-kpis strong { display:block; }
.ledger-kpis span { font-size:12px; color:#667085; margin-bottom:8px; }
.ledger-kpis strong { font-size:26px; color:#172b4d; font-variant-numeric:tabular-nums; }
.ledger-kpis > div:last-child strong { color:#b54708; }
.ledger-hours { font-size:13px; border-top:1px solid #e4e7ec; padding-top:16px; margin-bottom:0; }
.ledger-month { margin:20px 0; }
.ledger-month-heading { display:flex; justify-content:space-between; gap:12px; cursor:pointer; padding:14px 4px; border-bottom:1px solid #e4e7ec; }
.ledger-month-heading:before { content:'›'; }.ledger-month[open] > summary:before { content:'⌄'; }
.ledger-month-heading strong { margin-right:auto; }.ledger-month-heading span { font-size:13px; color:#667085; }
.ledger-month .period-detail { margin:10px 0; box-shadow:none; }
.ledger-month .panel-body { padding:16px; }
.ledger-month .week-pay-grid { gap:8px; margin:12px 0; }
.ledger-month .dashboard-metric { padding:12px; box-shadow:none; }.ledger-month .dashboard-metric .metric { font-size:20px; }
.ledger-month .work-day { margin:8px 0; }.ledger-month .day-header { padding:12px 14px; }
.ledger-month .job-card { padding:12px; margin:0; box-shadow:none; }.ledger-month .job-list { gap:8px; padding:12px; }
.ledger-issue { border-bottom:1px solid #e4e7ec; padding:16px 0; }.ledger-issue summary { cursor:pointer; font-weight:600; }
.week-glance small { display:block; font-size:12px; color:#667085; }
.ledger-empty { padding:24px 0; color:#667085; }
/* Field Ops keeps the reference hierarchy with a quieter SAGO look. */
.tracker-segments { display:flex; gap:4px; border:1px solid #e4e7ef; background:#f7f8fb; border-radius:12px; padding:4px; }
.tracker-segments button { flex:1; border:0; border-radius:9px; margin:0; padding:10px 16px; background:transparent; color:#667085; font:inherit; font-size:14px; font-weight:600; cursor:pointer; }
.tracker-segments button[aria-pressed="true"] { background:#fff; color:#4f43b6; box-shadow:0 1px 4px #172b4d14; }
.tracker-segments button:focus-visible { outline:3px solid #172b4d; outline-offset:-4px; }
.tracker-clients { grid-column:1/-1; margin-bottom:8px; }
.ledger-filters { grid-template-columns:1fr 2fr; }
.tracker-hero { background:linear-gradient(135deg,#fff 55%,#f2efff); color:#172b4d; border:1px solid #e4e2f2; border-radius:18px; padding:28px 32px; margin:20px 0; text-align:left; box-shadow:0 3px 12px #20345a08; }
.tracker-hero .eyebrow { color:#6053bc; letter-spacing:0; font-size:14px; font-weight:650; }
.tracker-hero-amount { display:block; font-size:clamp(30px,3.5vw,46px); line-height:1.2; margin:12px 0; font-family:var(--body); font-weight:750; font-variant-numeric:tabular-nums; letter-spacing:-.035em; }
.tracker-hero p { color:#667085; margin:0; font-size:14px; }
.tracker-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:16px 0 28px; }
.tracker-stats > div { background:#fff; border:1px solid #e8eaf0; border-radius:12px; padding:16px; text-align:left; }
.tracker-stats strong { display:block; color:#172b4d; font:700 23px var(--body); font-variant-numeric:tabular-nums; margin-bottom:3px; }
.tracker-stats span { font-size:12px; color:#667085; text-transform:none; letter-spacing:0; }
.tracker-stats > div:last-child strong { color:#172b4d; }
.tracker-grouping { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:24px 0 12px; }
.ledger-month { background:white; border:1px solid #e7e9f0; border-radius:16px; overflow:hidden; box-shadow:0 2px 9px #20345a06; }
.ledger-month-heading { padding:18px 22px; align-items:center; border:0; }
.ledger-month-heading strong { font-size:20px; letter-spacing:-.02em; }
.ledger-month-heading span { color:#596b82; font-weight:600; font-variant-numeric:tabular-nums; }
.ledger-month .period-detail { margin:0; border:0; border-top:1px solid #e5eaf3; border-radius:0; }
.ledger-month .week-header { padding:17px 22px; }
.week-identity small { max-width:540px; line-height:1.8; }
.week-glance > strong { color:#3d50a4; font-variant-numeric:tabular-nums; }
.tracker-week-hero { margin:0 0 20px; padding:24px; }
.tracker-week-hero .tracker-hero-amount { font-size:34px; }
.tracker-hero-status { display:inline-block; padding:6px 12px; background:#f0edff; color:#5142b4; border-radius:99px; font-size:12px; font-weight:650; margin-top:16px; }
.tracker-financials { background:#fff; border:1px solid #dfe6f0; border-radius:16px; margin:18px 0; overflow:hidden; }
.tracker-financials > div { display:flex; justify-content:space-between; gap:16px; padding:17px 20px; border-bottom:1px solid #edf0f5; }
.tracker-financials > div:last-child { border:0; }
.tracker-financials span { color:#657590; font-size:13px; }
.tracker-financials strong { font-variant-numeric:tabular-nums; }
.ledger-month .work-day { border:1px solid #e8eaf0; background:#fff; border-radius:12px; margin:10px 0; }
.ledger-month .day-header { padding:20px; }
.day-header > strong { color:#3d50a4; font-variant-numeric:tabular-nums; }
.spending-ranges { margin:12px 0 24px; }
.takehome-hero { background:linear-gradient(135deg,#fff 60%,#f0f8f4); border:1px solid #e1ebe5; border-radius:18px; padding:28px 32px; }
.takehome-amount { display:block; color:#177c55; font:750 clamp(30px,3.5vw,46px)/1.2 var(--body); font-variant-numeric:tabular-nums; letter-spacing:-.035em; margin:12px 0 24px; }
.takehome-allocation { display:flex; height:6px; gap:3px; overflow:hidden; border-radius:20px; margin:0 0 22px; }
.allocation-net { background:#129558; }.allocation-tax { background:#b78b06; }.allocation-spent { background:#df3b65; }
.takehome-breakdown { border-top:1px solid #e0e7f1; padding-top:22px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.takehome-breakdown span { display:block; text-transform:none; color:#667085; font-size:13px; letter-spacing:0; margin-bottom:6px; }
.takehome-breakdown strong { color:#172b4d; font:700 clamp(16px,2vw,23px) var(--body); font-variant-numeric:tabular-nums; }
.takehome-breakdown > div:nth-child(2) strong { color:#a57b00; }.takehome-breakdown > div:nth-child(3) strong { color:#d6325c; }
.work-expense-month { margin:28px 0; border:0; background:transparent; }
.work-expense-month-summary { padding:18px 4px; border-bottom:1px solid #e2e7ee; font-size:20px; }
.work-expense-month-summary > span { font-size:14px; color:#4d6674; font-weight:600; }
.work-expense-week { border:1px solid #e5e9ed; background:#fff; border-radius:14px; margin:10px 0; overflow:hidden; }
.work-expense-week-summary { padding:18px 22px; }
.work-expense-week-summary > span > strong { font-size:18px; color:#172b4d; }
.work-expense-week-summary small { display:block; margin-top:5px; color:#697d98; font-size:13px; }
.work-expense-week-summary .spending-row-categories { color:#62817e; }
.work-expense-week-summary .work-expense-takehome { color:#177c55; font:700 23px var(--body); font-variant-numeric:tabular-nums; }
.work-expense-week-body { padding:0 24px 20px; }
@media(max-width:600px) {
 .tracker-hero,.takehome-hero { padding:22px 18px; border-radius:18px; }
 .tracker-stats { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
 .tracker-grouping { align-items:flex-start; flex-direction:column; }
 .tracker-segments { width:100%; }.tracker-segments button { padding:12px 9px; }
 .ledger-month-heading { padding:18px; }.ledger-month-heading strong { font-size:20px; }
 .ledger-month .week-header { padding:18px; }.week-glance { text-align:left; }
 .work-expense-week-summary { padding:18px; gap:12px; }.work-expense-week-summary .work-expense-takehome { font-size:20px; }
 .work-expense-week-body { padding:0 16px 16px; }.takehome-breakdown { gap:8px; }
}
.pay-adjustments { margin:16px 0; border-top:1px solid #e4e7ec; border-bottom:1px solid #e4e7ec; padding:12px 0; }
.pay-adjustments-heading,.pay-adjustment-row > summary,.pay-adjustment-net { display:flex; justify-content:space-between; gap:16px; align-items:center; }
.pay-adjustments-heading h3 { font-size:15px; margin:0; }.pay-adjustments-heading { margin-bottom:8px; }
.pay-adjustment-row > summary { padding:10px 0; cursor:pointer; font-size:14px; list-style:none; }
.pay-adjustment-row > summary:before { content:'›'; color:#667085; }.pay-adjustment-row[open] > summary:before { content:'⌄'; }
.pay-adjustment-row > summary > span { margin-right:auto; }.pay-adjustment-row > summary small { display:block; color:#667085; font-size:11px; }
.pay-adjustment-row strong,.pay-adjustment-net strong:last-child { font-variant-numeric:tabular-nums; white-space:nowrap; }
.adjustment-positive { color:#067647; }.adjustment-negative { color:#b42318; }
.pay-adjustment-info { padding:4px 16px 12px; color:#667085; font-size:13px; border-bottom:1px solid #e4e7ec; }
.pay-adjustment-info small { display:block; }.pay-adjustment-net { border-top:1px solid #e4e7ec; padding:12px 0 0; margin-top:8px; font-size:14px; }
.pay-adjustment-form { display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:16px; margin-top:12px; background:#f9fafb; border:1px solid #e4e7ec; border-radius:8px; }
.pay-adjustment-form h4,.pay-adjustment-form > p,.pay-adjustment-form .capture-actions,.adjustment-optional { grid-column:1/-1; margin:0; }
.pay-adjustment-form label { display:grid; gap:6px; font-size:13px; }.adjustment-optional summary { cursor:pointer; font-size:13px; }.adjustment-optional label { margin-top:12px; }
@media(max-width:600px) { .pay-adjustment-form { grid-template-columns:1fr; } }
@media(max-width:600px) { .ledger-filters { grid-template-columns:1fr 1fr; }.ledger-filters label:last-child { grid-column:1/-1; }.ledger-kpis { grid-template-columns:1fr 1fr; }.ledger-kpis strong { font-size:23px; }.ledger-month-heading { flex-wrap:wrap; }.expense-row-summary { grid-template-columns:minmax(0,1fr) auto; gap:6px 12px; } .expense-section { padding:16px; } .unfiled-expenses { flex-wrap:wrap; } }
@media(max-width:600px) {
  .work-expense-top { flex-direction:column; }
  .work-expense-add,.work-expense-add summary,.work-expense-add > button { width:100%; }
  .work-expense-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .work-expense-day-summary { flex-direction:column; align-items:flex-start; }
  .bank-import-row { grid-template-columns:1fr; }
  .reimbursement-current { padding:20px; }
  .reimbursement-heading { align-items:flex-start; flex-direction:column; }
  .reimbursement-heading h2 { font-size:21px; }
  .reimbursement-metrics { gap:8px; }
  .reimbursement-metrics > div:first-child strong { font-size:23px; }
  .reimbursement-metrics strong { font-size:17px; }
  .reimbursement-history-row { grid-template-columns:minmax(0,1fr) auto; gap:8px; }
  .reimbursement-history-row .status-chip { grid-column:1/-1; }
  .expense-toolbar,.expense-disclosure-body .capture-form { grid-template-columns:minmax(0,1fr); }
  .expense-card { padding:16px; }
  .expense-card-heading { flex-direction:column; gap:10px; }
  .expense-card-amount { text-align:left; }
  .expense-totals { grid-template-columns:1fr; gap:12px; }
  .expense-totals > div { display:flex; align-items:center; justify-content:space-between; gap:12px; }
  .expense-totals strong { font-size:1.3rem; }
}

/* Week rows: pay chip, week, short meta | amount (2026-09-28 simplification) */
.week-chips { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:6px; }
.pay-chip { display:inline-flex; align-items:center; width:fit-content; font-size:12px; font-weight:600; line-height:1; padding:5px 10px; border-radius:999px; background:#fff4e0; color:#9a5b00; white-space:nowrap; }
.pay-chip.is-paid { background:#e7f6ec; color:#1f7a3f; }
.pay-chip.is-late { background:#fde8e8; color:#b42318; }
.pay-chip.is-invoiced { background:#eff8ff; color:#175cd3; }
.pay-chip.is-progress { background:#f2f4f7; color:#475467; }
.pay-chip.is-warn { background:#fffaeb; color:#b54708; font-weight:500; }
.client-chip { font-size:11px; font-weight:700; letter-spacing:.02em; padding:5px 8px; border-radius:999px; background:#eef1f6; color:#44536b; line-height:1; }
.ledger-month .week-glance > strong { font-size:17px; }
.tracker-week-hero .pay-chip { margin-top:10px; }
.financial-note { display:block; margin-top:3px; font-size:12px; color:#8a97ab; }
.week-deposit { margin:14px 0; border:1px solid #dfe6f0; border-radius:14px; background:#fff; }
.week-deposit > summary { cursor:pointer; padding:14px 18px; font-size:14px; color:#44536b; }
.week-deposit > .pay-deposits { padding:0 18px 12px; }
@media(max-width:600px) { .ledger-month .week-header { align-items:center; } .week-glance { max-width:none; } .ledger-month .week-glance > strong { font-size:16px; } }
@media(max-width:600px) { .tracker-stats { grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; margin:12px 0 20px; } .tracker-stats > div { padding:10px 6px; text-align:center; } .tracker-stats strong { font-size:18px; } .tracker-stats span { font-size:10px; line-height:1.2; display:block; } }

/* Week days and jobs, tracker-style readability (2026-09-28) */
.ledger-month .panel-body { background:#f6f7fb; }
.ledger-month .work-day { background:#fff; border:1px solid #e3e7ef; border-radius:14px; margin:8px 0; overflow:hidden; box-shadow:0 1px 2px rgba(16,24,40,.04); }
.ledger-month .day-header { padding:14px 16px; align-items:center; gap:12px; background:#fff; }
.ledger-month .work-day[open] > .day-header { background:#f3f5ff; border-bottom:1px solid #e3e7ef; box-shadow:inset 3px 0 0 #5b6cd6; }
.day-header:after { content:'›'; font-size:18px; color:#98a2b3; transition:transform .15s; }
.work-day[open] > .day-header:after { content:'›'; transform:rotate(90deg); }
.day-label { display:flex !important; flex-direction:column; gap:6px; }
.day-label > strong { font-size:15px; color:#172b4d; }
.day-chips { display:flex; flex-wrap:wrap; gap:5px; }
.day-chip { font-size:11px; font-weight:600; line-height:1; padding:4px 8px; border-radius:999px; background:#eef1f6; color:#44536b; }
.day-chip.is-hours { background:#e8edff; color:#3d50a4; }
.day-chip.is-oncall { background:#fff0e5; color:#c2410c; }
.day-chip.is-area { background:#fff4e0; color:#9a5b00; }
.ledger-month .day-total { font-size:16px; color:#3d50a4; font-variant-numeric:tabular-nums; white-space:nowrap; }
.work-day.is-empty { display:flex; justify-content:space-between; align-items:center; padding:10px 16px; background:transparent !important; border:1px dashed #d9dee8 !important; box-shadow:none !important; }
.work-day.is-empty strong { font-size:13px; font-weight:600; color:#98a2b3; }
.work-day.is-empty span { font-size:12px; color:#b0b8c6; }
.ledger-month .job-list { display:block; padding:0; border:0; }
.ledger-month .job-card { padding:12px 16px; border-bottom:1px solid #eef1f5; }
.ledger-month .job-card:last-child { border-bottom:0; }
.ledger-month .job-card.is-oncall { box-shadow:inset 3px 0 0 #f97316; }
.ledger-month .job-top { align-items:flex-start; gap:14px; }
.job-num { display:flex !important; align-items:center; gap:6px; font:600 11px/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; color:#8a97ab !important; margin-bottom:4px !important; }
.oncall-tag { font:700 9px/1 var(--body,inherit); letter-spacing:.04em; background:#f97316; color:#fff; padding:3px 6px; border-radius:4px; }
.ledger-month .job-top > div > strong { font-size:14px; font-weight:600; color:#1d2939; line-height:1.35; }
.job-type { display:block; font-size:12px !important; color:#667085 !important; margin:2px 0 0 !important; }
.job-tags { display:flex; flex-wrap:wrap; gap:4px; margin-top:6px; }
.job-tag { font:600 10px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; background:#eef1f6; color:#44536b; padding:3px 6px; border-radius:4px; }
.job-tag.is-rate { background:#e8edff; color:#3d50a4; }
.ledger-month .job-amount { font-size:14px; color:#3d50a4; }
.ledger-month .job-extra { margin-top:6px; font-size:13px; }
.ledger-month .job-extra summary { min-height:0; padding:2px 0; font-size:12px; color:#5b6cd6; }
.ledger-month .job-extra p { margin:6px 0 0; padding:8px 10px; background:#f6f7fb; border-left:2px solid #5b6cd6; border-radius:0 6px 6px 0; color:#475467; line-height:1.5; }
@media(max-width:600px) { .ledger-month .day-header { padding:12px; } .ledger-month .job-card { padding:11px 12px; } .ledger-month .day-total { font-size:15px; } }
.day-header .day-chips { display:flex !important; }
.day-header .day-chip { display:inline-block; width:auto; }

/* Guided uploads: 1 Photo -> 2 Read -> 3 Check (2026-09-28) */
.capture-intro { margin:4px 0 18px; color:#667085; font-size:14px; }
.capture-stepper { grid-column:1/-1; display:flex; gap:8px; list-style:none; margin:0; padding:0; }
.capture-step { display:flex; align-items:center; gap:8px; flex:1; padding:10px 12px; border-radius:10px; background:#f2f4f8; color:#8a97ab; font-size:13px; font-weight:600; }
.capture-step-num { display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:50%; background:#fff; border:1px solid #d9dee8; font-size:12px; }
.capture-step.is-current { background:#eeebfd; color:#4b36b8; }
.capture-step.is-current .capture-step-num { background:#6046cf; border-color:#6046cf; color:#fff; }
.capture-step.is-done { color:#1f7a3f; background:#eef8f1; }
.capture-step.is-done .capture-step-num { background:#1f7a3f; border-color:#1f7a3f; color:#fff; }
.capture-drop { display:flex !important; flex-direction:column; align-items:center; justify-content:center; gap:6px; min-height:150px; padding:24px 16px; border:2px dashed #c9c1f1; border-radius:14px; background:#faf9ff; text-align:center; cursor:pointer; transition:border-color .15s,background .15s; }
.capture-drop:hover,.capture-drop.is-over { border-color:#6046cf; background:#f3f0ff; }
.capture-drop-title { font-size:16px; font-weight:700; color:#4b36b8; }
.capture-drop-title::before { content:'📷'; display:block; font-size:28px; margin-bottom:6px; }
.capture-drop-hint { font-size:12px; color:#8a97ab; max-width:340px; }
.capture-drop input[type=file] { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
.capture-drop:has(input:focus-visible) { outline:3px solid var(--blue); outline-offset:2px; }
.capture-panel .capture-photo .capture-read { justify-self:stretch; min-height:46px; font-size:15px; }
.capture-panel .capture-photo .capture-manual { justify-self:center; }
.capture-panel .capture-photo-preview { border-radius:10px; border:1px solid #e2e5ed; }
.capture-photo.has-photo .capture-drop,.capture-form.is-reviewing .capture-drop { min-height:0; padding:10px; }
.capture-photo.has-photo .capture-drop-title,.capture-form.is-reviewing .capture-drop-title { font-size:13px; }
.capture-photo.has-photo .capture-drop-title::before,.capture-form.is-reviewing .capture-drop-title::before { content:none; }
.capture-photo.has-photo .capture-drop-hint,.capture-form.is-reviewing .capture-drop-hint { display:none; }
.capture-photo.has-photo .capture-drop-title,.capture-form.is-reviewing .capture-drop-title { font-size:0; }
.capture-photo.has-photo .capture-drop-title::after,.capture-form.is-reviewing .capture-drop-title::after { content:'Change photo'; font-size:13px; }
.capture-form.is-reviewing .capture-read,.capture-form.is-reviewing .capture-photo-note { display:none; }
.capture-form.is-manual .capture-photo { display:none; }
@media(min-width:900px) {
  .capture-form.is-reviewing { grid-template-columns:260px repeat(2,minmax(0,1fr)); align-items:start; }
  .capture-form.is-reviewing > .capture-photo { grid-column:1; grid-row:2 / span 40; position:sticky; top:16px; padding:14px; }
  .capture-form.is-reviewing > .capture-stepper,.capture-form.is-reviewing > .capture-actions,.capture-form.is-reviewing > .expense-disclosure,.capture-form.is-reviewing > p,.capture-form.is-reviewing > .bank-import-rows,.capture-form.is-reviewing > .deposit-candidates { grid-column:2 / -1; }
  .capture-form.is-reviewing > .capture-stepper { grid-column:1 / -1; }
}
@media(max-width:600px) { .capture-step { padding:8px; font-size:12px; gap:6px; } .capture-drop { min-height:130px; } }

/* Invoice vs your log, tracker-style (2026-09-28) */
.compare { display:grid; gap:10px; }
.compare-head { display:flex; justify-content:space-between; align-items:center; gap:10px; }
.compare-head > strong { font-size:15px; color:#172b4d; }
.compare-badge { font-size:12px; font-weight:700; padding:4px 10px; border-radius:999px; white-space:nowrap; }
.compare-badge.is-warn { background:#fff4e0; color:#9a5b00; }
.compare-badge.is-ok { background:#e7f6ec; color:#1f7a3f; }
.compare-tiles { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.compare-tile { background:#fff; border:1px solid #e3e7ef; border-radius:12px; padding:12px 8px; text-align:center; }
.compare-tile strong { display:block; font-size:22px; font-variant-numeric:tabular-nums; }
.compare-tile span { font-size:11px; color:#667085; text-transform:uppercase; letter-spacing:.06em; }
.compare-tile.is-ok strong { color:#1f7a3f; } .compare-tile.is-warn strong { color:#b45309; } .compare-tile.is-bad strong { color:#b42318; } .compare-tile.is-info strong { color:#3d50a4; }
.compare-card { background:#fff; border:1px solid #e3e7ef; border-left:4px solid #f59e0b; border-radius:0 12px 12px 0; padding:12px 14px; display:grid; gap:8px; }
.compare-card.is-bad { border-left-color:#dc2626; } .compare-card.is-info { border-left-color:#5b6cd6; }
.compare-card-top { display:flex; justify-content:space-between; gap:12px; align-items:flex-start; }
.compare-card-top > div { display:grid; gap:2px; }
.compare-kind { font-size:10px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#b45309; }
.compare-card.is-bad .compare-kind { color:#b42318; } .compare-card.is-info .compare-kind { color:#3d50a4; }
.compare-card-top > div > strong { font-size:15px; color:#172b4d; }
.compare-meta { font-size:12px; color:#667085; }
.compare-amount { font-size:15px; font-variant-numeric:tabular-nums; color:#b45309; white-space:nowrap; }
.compare-card.is-bad .compare-amount { color:#b42318; } .compare-card.is-info .compare-amount { color:#3d50a4; }
.compare-chips { display:flex; flex-wrap:wrap; gap:5px; }
.compare-chip { font:700 11px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; padding:4px 8px; border-radius:6px; }
.compare-chip.is-bad { background:#fde8e8; color:#b42318; } .compare-chip.is-info { background:#e8edff; color:#3d50a4; }
.compare-codes { display:grid; gap:3px; padding-top:8px; border-top:1px solid #eef1f5; font:12px/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; color:#475467; }
.compare-code-label { display:inline-block; min-width:70px; font:700 10px var(--body,inherit); letter-spacing:.05em; text-transform:uppercase; color:#98a2b3; }
.compare-foot { display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; padding:12px 14px; background:#fff; border:1px solid #e3e7ef; border-radius:12px; font-size:13px; color:#475467; }
.compare-foot strong { font-variant-numeric:tabular-nums; } .compare-foot .is-bad { color:#b42318; } .compare-foot .is-ok { color:#1f7a3f; }
.compare-empty { text-align:center; padding:28px 16px; background:#fff; border:1px dashed #d9dee8; border-radius:12px; }
.compare-empty strong { color:#172b4d; } .compare-empty p { margin:6px 0 0; color:#667085; font-size:13px; }
.compare-other { margin-top:12px; padding:12px 14px; background:#fff; border:1px solid #e3e7ef; border-radius:12px; }
.compare-other h4 { margin:0 0 6px; font-size:13px; color:#475467; } .compare-other p { margin:4px 0; font-size:13px; color:#475467; }
.issue-week { background:#fff; border:1px solid #e3e7ef; border-radius:14px; margin:10px 0; overflow:hidden; }
.issue-week-head { display:flex; align-items:center; gap:12px; padding:14px 16px; cursor:pointer; list-style:none; }
.issue-week-head::-webkit-details-marker { display:none; }
.issue-week-head > span:first-child { flex:1; display:grid; gap:2px; } .issue-week-head small { font-size:12px; color:#667085; }
.issue-week-amount { font-variant-numeric:tabular-nums; color:#b42318; min-width:70px; text-align:right; }
.issue-week[open] > .issue-week-head { border-bottom:1px solid #e3e7ef; background:#f8f9fc; }
.issue-week-body { padding:14px 16px; background:#f6f7fb; }
@media(max-width:600px) { .compare-tile strong { font-size:18px; } .compare-tile span { font-size:10px; letter-spacing:.02em; } .issue-week-head { flex-wrap:wrap; } }
.issue-week-amount.is-up { color:#1f7a3f; }
.compare-card-top .compare-amount:not(:empty) { }

.capture-photo.has-photo .capture-drop { flex-direction:row; justify-self:start; border-style:solid; border-width:1px; }
.expected-check:empty { display:none; }
.expected-check { grid-column:1/-1; margin:0; padding:10px 12px; border-radius:10px; font-size:14px; font-weight:600; }
.expected-check.is-ok { background:#e7f6ec; color:#1f7a3f; }
.expected-check.is-warn { background:#fff4e0; color:#9a5b00; }
@media(min-width:900px) { .capture-form.is-reviewing > .expected-check { grid-column:2 / -1; } }

/* Invoice spreadsheet upload (2026-09-28) */
.invoice-upload-box { background:#fff; border:1px solid #e3e7ef; border-radius:12px; }
.invoice-upload-box > summary { cursor:pointer; padding:12px 14px; font-size:14px; font-weight:600; color:#4b36b8; }
.invoice-upload { display:grid; gap:10px; padding:0 14px 14px; }
.invoice-upload .fine { margin:0; }
.invoice-file { display:flex; flex-direction:column; gap:6px; padding:14px; border:2px dashed #c9c1f1; border-radius:12px; background:#faf9ff; cursor:pointer; }
.invoice-file-title { font-size:13px; font-weight:600; color:#4b36b8; }
.compare-source { margin:-4px 0 0; font-size:12px; color:#667085; }
.compare-matches { background:#fff; border:1px solid #e3e7ef; border-radius:12px; padding:0 14px; }
.compare-matches > summary { cursor:pointer; padding:12px 0; font-size:13px; font-weight:600; color:#1f7a3f; }
.compare-match-row { display:flex; justify-content:space-between; gap:10px; padding:6px 0; border-top:1px solid #eef1f5; font-size:13px; color:#475467; font-variant-numeric:tabular-nums; }
.compare-match-row:last-child { padding-bottom:12px; }

/* Shared + Add menu and folded Work Logs filters (2026-09-28) */
.add-menu { position:relative; flex:none; }
.add-menu > summary { display:inline-flex; align-items:center; justify-content:center; min-width:112px; min-height:44px; padding:10px 20px; border-radius:12px; background:#6046cf; color:#fff; font-weight:700; cursor:pointer; list-style:none; }
.add-menu > summary::-webkit-details-marker { display:none; }
.add-menu[open] > summary { background:#4b36b8; }
.add-menu-grid { position:absolute; right:0; top:calc(100% + 8px); z-index:20; display:grid; grid-template-columns:repeat(3,160px); gap:8px; padding:10px; background:#fff; border:1px solid #e3e7ef; border-radius:14px; box-shadow:0 12px 32px rgba(16,24,40,.14); }
.work-log-actions { display:flex; justify-content:flex-end; margin:0 0 12px; }
.work-log-actions .add-menu-grid { right:0; }
.add-tile { display:flex; flex-direction:column; align-items:flex-start; gap:4px; padding:12px; min-height:0; text-align:left; background:#faf9ff; border:1px solid #ebe7fb; border-radius:12px; color:#172b4d; cursor:pointer; }
.add-tile:hover { background:#f3f0ff; border-color:#c9c1f1; }
.add-tile-icon { font-size:22px; line-height:1; }
.add-tile strong { font-size:14px; }
.add-tile small { font-size:12px; color:#667085; line-height:1.35; }
.work-expense-add > .add-menu-grid > button { width:auto; margin:0; }
.ledger-more { grid-column:1/-1; }
.ledger-more > summary { cursor:pointer; font-size:13px; font-weight:600; color:#5b6cd6; padding:4px 0; }
.ledger-more-body { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:12px; margin-top:10px; }
@media(max-width:600px) {
  .add-menu,.add-menu > summary { width:100%; }
  .add-menu-grid { position:static; grid-template-columns:1fr; margin-top:8px; box-shadow:none; }
  .add-tile { flex-direction:row; align-items:center; gap:10px; } .add-tile small { margin-left:auto; text-align:right; max-width:50%; }
}

/* 123NET Sales: address check (2026-09-28) */
.address-tags { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:4px; }
.address-tag { font-size:12px; font-weight:700; padding:4px 10px; border-radius:999px; background:#eef1f6; color:#44536b; }
.address-tag.is-good { background:#e7f6ec; color:#1f7a3f; } .address-tag.is-near { background:#e0f5f2; color:#0f766e; } .address-tag.is-warn { background:#fff4e0; color:#9a5b00; } .address-tag.is-muted { background:#f2f4f7; color:#667085; }
.address-hint { margin:6px 0 0; font-size:13px; color:#475467; }
.address-status { margin:0; color:#667085; } .address-status.is-error { color:#b42318; }

/* 123NET Sales: tabs and leads (2026-09-30) */
.sales-tabs { display:flex; gap:6px; margin:0 0 14px; padding:4px; background:#f2f4f8; border-radius:12px; width:fit-content; }
.sales-tabs button { border:0; background:transparent; padding:8px 16px; border-radius:9px; font-weight:600; color:#475467; cursor:pointer; }
.sales-tabs button[aria-pressed=true] { background:#fff; color:#4b36b8; box-shadow:0 1px 2px rgba(16,24,40,.08); }
.sales-leads,.lead-detail { display:grid; gap:12px; max-width:860px; }
.sales-leads h2,.lead-detail h2 { margin:0; }
.lead-filters { display:flex; flex-wrap:wrap; gap:6px; }
.lead-filters button { border:1px solid #e3e7ef; background:#fff; padding:6px 12px; border-radius:999px; font-size:13px; color:#475467; cursor:pointer; }
.lead-filters button[aria-pressed=true] { background:#eeebfd; border-color:#c9c1f1; color:#4b36b8; font-weight:600; }
.sales-leads > input[type=search] { min-height:44px; padding:8px 12px; border:1px solid #d9dee8; border-radius:10px; font:inherit; }
.lead-list { display:grid; gap:8px; }
.lead-row { display:flex; justify-content:space-between; align-items:center; gap:12px; width:100%; padding:14px 16px; text-align:left; background:#fff; border:1px solid #e3e7ef; border-radius:12px; cursor:pointer; }
.lead-row:hover { border-color:#c9c1f1; background:#faf9ff; }
.lead-row-main { display:grid; gap:2px; min-width:0; } .lead-row-main strong { color:#172b4d; } .lead-row-main small { color:#667085; font-size:13px; }
.lead-row-tags { display:flex; flex-wrap:wrap; gap:6px; justify-content:flex-end; }
.lead-stage { font-size:12px; font-weight:700; padding:4px 10px; border-radius:999px; background:#eef1f6; color:#44536b; white-space:nowrap; }
.lead-stage.is-eligible { background:#e7f6ec; color:#1f7a3f; } .lead-stage.is-waiting_for_quote { background:#e8edff; color:#3d50a4; } .lead-stage.is-waiting_for_owner { background:#fff4e0; color:#9a5b00; }
.lead-stage.is-follow_up { background:#fdf2e9; color:#c2410c; } .lead-stage.is-approved { background:#1f7a3f; color:#fff; } .lead-stage.is-declined { background:#f2f4f7; color:#98a2b3; }
.lead-back { justify-self:start; padding:4px 0; border:0; background:transparent; color:#5b6cd6; font-weight:600; cursor:pointer; }
.lead-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; flex-wrap:wrap; }
.lead-address { margin:4px 0 0; color:#667085; }
.lead-stages { display:flex; flex-wrap:wrap; gap:4px; list-style:none; margin:0; padding:0; }
.lead-stage-step { flex:1; min-width:96px; padding:8px 10px; border-radius:8px; background:#f2f4f7; color:#98a2b3; font-size:12px; font-weight:600; text-align:center; }
.lead-stage-step.is-done { background:#e7f6ec; color:#1f7a3f; } .lead-stage-step.is-current { background:#6046cf; color:#fff; }
.lead-stage-actions { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.lead-other-stage summary { cursor:pointer; color:#5b6cd6; font-size:13px; font-weight:600; }
.lead-other-body { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
.lead-other-body select,.lead-other-body input { min-height:40px; padding:6px 10px; border:1px solid #d9dee8; border-radius:8px; font:inherit; }
.lead-section { background:#fff; border:1px solid #e3e7ef; border-radius:12px; padding:12px 16px; }
.lead-section > summary { cursor:pointer; font-weight:600; color:#172b4d; }
.lead-form { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px; margin-top:12px; }
.lead-form label { display:flex; flex-direction:column; gap:6px; font-size:13px; color:#475467; font-weight:500; }
.lead-form input,.lead-form textarea,.lead-note textarea { min-height:42px; padding:8px 10px; border:1px solid #d9dee8; border-radius:8px; font:inherit; color:#172b4d; }
.lead-form label:has(textarea),.lead-form > p,.lead-form > button { grid-column:1/-1; } .lead-form textarea { min-height:90px; } .lead-form > button { justify-self:start; }
.lead-history h3 { margin:0 0 8px; font-size:15px; }
.lead-note { display:grid; gap:8px; margin-bottom:12px; } .lead-note textarea { min-height:70px; } .lead-note button { justify-self:start; }
.lead-activity { display:grid; gap:2px; padding:10px 0; border-top:1px solid #eef1f5; font-size:14px; }
.lead-activity-time { font-size:12px; color:#98a2b3; } .lead-activity p { margin:2px 0 0; color:#475467; white-space:pre-wrap; }
.lead-activity.is-stage strong { color:#4b36b8; }
@media(max-width:600px) { .lead-row { flex-direction:column; align-items:flex-start; } .lead-row-tags { justify-content:flex-start; } .lead-stage-step { min-width:0; flex-basis:30%; } }

/* 123NET address map (2026-09-30) */
.address-tag.is-lead { background:#eeebfd; color:#4b36b8; }
.address-tag.is-near { background:#e6efff; color:#1d4ed8; } .address-card.is-near { border-left-color:#2563eb; }

/* Address cleanup and flags (2026-09-30) */
.address-tag.is-flag { background:#fde8e8; color:#b42318; }
/* 123NET quotes on the lead */
.lead-activity.is-quote strong,.lead-activity.is-quote-request strong { color:#1f7a3f; }
/* 123NET decisions and reminders */
.lead-activity.is-decision strong { color:#4b36b8; }
/* Files on a 123NET lead */
.lead-activity.is-file strong { color:#0f766e; }
/* Several job screenshots at once */
.job-batch-list { display:grid; gap:10px; margin:12px 0; }
.job-batch-card { display:grid; gap:10px; padding:12px 14px; border:1px solid #e3e7ef; border-radius:12px; background:#fff; }
.job-batch-card.is-reading { border-color:#c9c1f1; background:#faf9ff; }
.job-batch-card.is-failed { border-color:#f4c7c3; background:#fff8f7; }
.job-batch-card.is-saved { border-color:#b7e1c4; background:#f3fbf5; }
.job-batch-head { display:flex; gap:12px; align-items:center; min-width:0; }
.job-batch-head strong { overflow-wrap:anywhere; }
.job-batch-thumb { width:72px; height:54px; object-fit:cover; border-radius:6px; border:1px solid #e3e7ef; flex:none; }
.job-batch-state { margin:2px 0 0; font-size:13px; color:#667085; }
.job-batch-card.is-failed .job-batch-state { color:#b42318; } .job-batch-card.is-saved .job-batch-state { color:#1f7a3f; font-weight:600; }
.job-batch-fields { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:10px; }
.job-batch-fields label { display:flex; flex-direction:column; gap:4px; font-size:13px; color:#475467; }
.job-batch-fields input,.job-batch-fields select { min-height:40px; padding:6px 10px; border:1px solid #d9dee8; border-radius:8px; font:inherit; }
.job-batch-fields .capture-total { grid-column:1/-1; margin:0; }
.job-batch-keep { flex-direction:row !important; align-items:center; gap:8px !important; grid-column:1/-1; }
.job-batch-keep input { min-height:0; width:18px; height:18px; }
.job-edit { justify-self:start; margin-top:6px; min-height:32px; padding:4px 12px; font-size:13px; }
/* SAGO Direct */
.direct-summary { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; margin-bottom:12px; }
.direct-stat { display:grid; gap:2px; padding:14px 16px; background:#fff; border:1px solid #e3e7ef; border-radius:12px; }
.direct-stat strong { font-size:22px; color:#172b4d; } .direct-stat span { font-size:13px; color:#667085; }
.direct-head { display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; }
.direct-head h2 { margin:0; }
.direct-stage.is-lead,.direct-stage.is-site_visit { background:#eef1f6; color:#44536b; }
.direct-stage.is-estimate { background:#e8edff; color:#3d50a4; } .direct-stage.is-approved,.direct-stage.is-scheduled { background:#e0f5f2; color:#0f766e; }
.direct-stage.is-in_progress { background:#fff4e0; color:#9a5b00; } .direct-stage.is-completed,.direct-stage.is-invoiced { background:#fdf2e9; color:#c2410c; }
.direct-stage.is-paid { background:#1f7a3f; color:#fff; } .direct-stage.is-lost { background:#f2f4f7; color:#98a2b3; }
.direct-stages .lead-stage-step { min-width:84px; }
.direct-money h3,.direct-detail .lead-section h3 { margin:0 0 8px; font-size:15px; }
.direct-money-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:8px; }
.direct-money-cell { display:grid; gap:2px; padding:10px 12px; border-radius:10px; background:#f7f8fb; }
.direct-money-cell span { font-size:12px; color:#667085; } .direct-money-cell strong { font-size:17px; color:#172b4d; }
.direct-money-cell.is-warn { background:#fff4e0; } .direct-money-cell.is-warn strong { color:#9a5b00; }
.direct-profit { display:grid; gap:6px; margin-top:10px; padding:12px 14px; border-radius:10px; background:#f3fbf5; border:1px solid #b7e1c4; }
.direct-profit.is-loss { background:#fff8f7; border-color:#f4c7c3; }
.direct-profit-row { display:flex; justify-content:space-between; gap:10px; font-size:14px; color:#475467; }
.direct-profit-row.is-main { font-size:17px; color:#172b4d; } .direct-profit-row.is-main strong { color:#1f7a3f; } .direct-profit.is-loss .direct-profit-row.is-main strong { color:#b42318; }
.direct-line { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:6px 12px; padding:10px 0; border-top:1px solid #eef1f5; }
.direct-line > div { display:grid; gap:2px; min-width:0; } .direct-line small { color:#667085; }
.direct-line-amount { margin-left:auto; } .direct-line.is-in .direct-line-amount { color:#1f7a3f; } .direct-line.is-out .direct-line-amount { color:#b42318; }
.direct-line-remove { flex-basis:100%; font-size:13px; } .direct-line-remove summary { cursor:pointer; color:#667085; width:fit-content; }
.direct-removed { margin-top:8px; font-size:13px; } .direct-removed summary { cursor:pointer; color:#667085; }
.direct-add-line { margin-top:12px; padding-top:12px; border-top:1px dashed #d9dee8; }
.direct-new-customer { display:contents; }
.lead-form select { min-height:42px; padding:8px 10px; border:1px solid #d9dee8; border-radius:8px; font:inherit; color:#172b4d; }
.direct-new-customer[hidden] { display:none; }

/* 123NET Sales refresh (2026-09-29): approved light tokens, separate white cards instead of one enclosing panel.
   Scoped to .sales-app so SAGO Direct, which reuses some lead-* classes, keeps its current look. */
.sales-app { --good:var(--green); --good-tint:var(--success-tint); --near:var(--info); --near-tint:var(--info-tint); --warn:var(--amber); --warn-tint:var(--warning-tint); --subtle:#98a2b3; --row-hover:#faf9ff; --divider:#f2f4f7; --field-border:#d0d5dd; display:grid; gap:24px; }
.sales-app .sales-view { display:grid; gap:20px; align-content:start; }
.sales-app .sales-view[hidden] { display:none; }
.sales-app h2 { margin:0; font-size:20px; letter-spacing:-.02em; color:var(--text); }
.sales-app h3 { margin:0; font-size:16px; font-weight:600; color:var(--text); }
.sales-app .sales-card,.sales-app .lead-section { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-card); box-shadow:var(--shadow-card); padding:24px; }
.sales-app .address-status { margin:0; color:var(--muted); font-size:14px; }
.sales-app .address-status.is-error { color:var(--error); }
.sales-app .address-hint { margin:0; font-size:13px; color:var(--body-text); }
.sales-app input:not([type=checkbox]):not([type=file]),.sales-app select,.sales-app textarea { min-height:42px; padding:9px 12px; border:1px solid var(--field-border); border-radius:var(--radius-control); background-color:var(--surface); color:var(--text); font:inherit; font-size:14px; box-shadow:0 1px 2px #1018280a; }
.sales-app textarea { resize:vertical; line-height:1.5; }
.sales-app :is(input,select,textarea):focus-visible { outline:0; border-color:#a597ef; box-shadow:0 0 0 4px var(--accent-tint); }
.sales-app :is(button,a,summary):focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.sales-app a { color:var(--accent); }

/* Tabs */
.sales-app > .sales-tabs { display:flex; gap:4px; width:auto; margin:0; padding:0; background:none; border-radius:0; border-bottom:1px solid var(--border); overflow-x:auto; scrollbar-width:none; }
.sales-app > .sales-tabs button { position:relative; flex:none; padding:10px 14px 12px; border:0; border-radius:0; background:none; box-shadow:none; color:var(--muted); font:600 14px var(--body); white-space:nowrap; cursor:pointer; }
.sales-app > .sales-tabs button:hover { color:var(--text); }
.sales-app > .sales-tabs button[aria-pressed=true] { color:var(--accent); background:none; box-shadow:none; }
.sales-app > .sales-tabs button[aria-pressed=true]::after { content:''; position:absolute; left:10px; right:10px; bottom:-1px; height:2px; border-radius:2px; background:var(--accent); }

/* Tags */
.sales-app .address-tags { display:flex; flex-wrap:wrap; gap:6px; margin:0; }
.sales-app .address-tag { display:inline-flex; align-items:center; gap:6px; padding:3px 9px; border-radius:6px; background:#f2f4f7; color:var(--body-text); font-size:12px; font-weight:600; line-height:18px; white-space:nowrap; }
.sales-app .address-tag.is-good { background:var(--good-tint); color:var(--good); }
.sales-app .address-tag.is-near { background:var(--near-tint); color:var(--near); }
.sales-app .address-tag.is-warn { background:var(--warn-tint); color:var(--warn); }
.sales-app .address-tag:is(.is-off,.is-muted) { background:#f2f4f7; color:var(--muted); }
.sales-app .address-tag.is-flag { background:var(--error-tint); color:var(--error); }
.sales-app .address-tag.is-lead { background:var(--accent-tint); color:var(--accent); }
.sales-app .address-tag:is(.is-good,.is-near,.is-warn)::before { content:''; width:6px; height:6px; border-radius:50%; background:currentColor; }

/* Check address */
.sales-app .address-check { max-width:800px; }
.sales-app .address-hero { display:grid; gap:6px; padding:28px; background:linear-gradient(180deg,#fbfaff 0%,var(--surface) 70%); }
.sales-app .address-intro { margin:0 0 12px; color:var(--muted); }
.sales-app .address-form { display:flex; gap:10px; }
.sales-app .address-form input[type=search] { flex:1; min-width:0; min-height:52px; padding:12px 16px 12px 46px; border-radius:10px; font-size:16px; background:var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23667085' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") 16px center no-repeat; }
.sales-app .address-form button { min-width:112px; min-height:52px; border-radius:10px; font-size:15px; }
.sales-app .address-result { display:grid; gap:12px; }
.sales-app .address-result:empty { display:none; }
.sales-app .address-verdict { display:flex; align-items:center; gap:10px; margin:0; padding:12px 16px; border-radius:10px; font-size:15px; font-weight:600; }
.sales-app .address-verdict::before { flex:none; display:grid; place-items:center; width:24px; height:24px; border-radius:50%; color:#fff; font-size:13px; font-weight:700; }
.sales-app .address-verdict.is-found { background:var(--good-tint); color:var(--good); }
.sales-app .address-verdict.is-found::before { content:'✓'; background:var(--good); }
.sales-app .address-verdict.is-choose { background:var(--near-tint); color:var(--near); }
.sales-app .address-verdict.is-choose::before { content:'i'; background:var(--near); font-family:Georgia,serif; }
.sales-app .address-verdict.is-missing { background:var(--error-tint); color:var(--error); }
.sales-app .address-verdict.is-missing::before { content:'✕'; background:var(--error); font-size:11px; }
.sales-app .address-card { position:relative; display:grid; gap:2px; padding:18px 20px 18px 24px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-card); box-shadow:var(--shadow-card); text-align:left; overflow:hidden; }
.sales-app .address-card::before { content:''; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--field-border); }
.sales-app .address-card.is-good::before { background:var(--good); }
.sales-app .address-card.is-near::before { background:var(--near); }
.sales-app .address-card.is-warn::before { background:#f79009; }
.sales-app .address-card.is-primary { padding:22px 24px 22px 28px; }
.sales-app .address-card-top { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; margin-bottom:8px; }
.sales-app .address-line { font-size:16px; font-weight:600; color:var(--text); }
.sales-app .address-card.is-primary .address-line { font-size:22px; letter-spacing:-.02em; }
.sales-app .address-city { font-size:13px; color:var(--muted); }
.sales-app .address-card .address-hint { margin-top:10px; padding-top:10px; border-top:1px solid var(--divider); }
.sales-app .address-subhead { margin:12px 0 0; font-size:12px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
.sales-app .address-suggestion { display:block; width:100%; padding:0; border:0; border-radius:var(--radius-card); background:none; font:inherit; cursor:pointer; }
.sales-app .address-suggestion .address-card { transition:border-color .15s,box-shadow .15s; }
.sales-app .address-suggestion:hover .address-card { border-color:#c4bbf3; box-shadow:0 4px 14px #172b4d0f; }
.sales-app .address-suggestion .address-card::after { content:'Check this address →'; position:absolute; right:20px; bottom:18px; font-size:13px; font-weight:600; color:var(--accent); opacity:0; transition:opacity .15s; }
.sales-app .address-suggestion:hover .address-card::after { opacity:1; }
.sales-app .address-footer { margin:0; font-size:12px; color:var(--subtle); }
.sales-app .lead-action { flex:none; padding:7px 14px; }
.sales-app .lead-anyway { justify-self:start; }
.sales-app .flag-control { margin-top:12px; font-size:13px; }
.sales-app .flag-control > summary { width:fit-content; color:var(--muted); font-weight:600; list-style:none; cursor:pointer; }
.sales-app .flag-control > summary::-webkit-details-marker { display:none; }
.sales-app .flag-control > summary::before { content:'⚑ '; }
.sales-app .flag-control > summary:hover { color:var(--error); }
.sales-app .flag-control-body { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:10px; }
.sales-app .flag-control-body :is(select,input) { min-height:36px; padding:6px 10px; font-size:13px; }
.sales-app .flag-control-body input { flex:1; min-width:140px; }
.sales-app .flag-control-body .quiet { padding:7px 12px; font-size:13px; }

/* Leads list */
.sales-app :is(.sales-leads,.lead-detail) { max-width:1080px; }
.sales-app .sales-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.sales-app .sales-stat { display:grid; gap:4px; min-width:0; padding:20px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-card); box-shadow:var(--shadow-card); }
.sales-app .sales-stat-label { font-size:12px; font-weight:600; color:var(--body-text); }
.sales-app .sales-stat strong { font-size:28px; font-weight:700; line-height:1.2; letter-spacing:-.035em; color:var(--text); font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.sales-app .sales-stat small { font-size:13px; color:var(--muted); }
.sales-app .sales-stat.is-warn strong { color:var(--warn); }
.sales-app .sales-stat.is-good strong { color:var(--good); }
.sales-app .lead-attention { display:grid; padding:0; background:var(--surface); border:1px solid #fedf89; border-radius:var(--radius-card); box-shadow:var(--shadow-card); overflow:hidden; }
.sales-app .lead-attention[hidden] { display:none; }
.sales-app .lead-attention h3 { display:flex; align-items:center; gap:8px; padding:14px 20px; background:var(--warn-tint); border-bottom:1px solid #fef0c7; color:var(--warn); font-size:14px; }
.sales-app .lead-attention h3::before { content:'!'; display:grid; place-items:center; width:20px; height:20px; border-radius:50%; background:#f79009; color:#fff; font-size:12px; }
.sales-app .attention-row { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px; width:100%; padding:14px 20px; border:0; border-top:1px solid var(--divider); background:var(--surface); font:inherit; text-align:left; cursor:pointer; }
.sales-app .lead-attention h3 + .attention-row { border-top:0; }
.sales-app .attention-row:hover { background:#fffcf5; }
.sales-app .attention-row strong { color:var(--text); font-weight:600; }
.sales-app .attention-row span { color:var(--warn); font-size:13px; font-weight:500; }
.sales-app .attention-row span::after { content:'  →'; }
.sales-app .lead-toolbar { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px; }
.sales-app .lead-toolbar input[type=search] { flex:0 1 320px; min-width:220px; padding-left:38px; background:var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23667085' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") 12px center no-repeat; }
.sales-app .lead-filters { display:flex; flex-wrap:wrap; gap:6px; }
.sales-app .lead-filters button { padding:6px 12px; border:1px solid var(--border); border-radius:999px; background:var(--surface); color:var(--body-text); font:500 13px var(--body); cursor:pointer; }
.sales-app .lead-filters button:hover { border-color:#c8ced8; color:var(--text); }
.sales-app .lead-filters button[aria-pressed=true] { background:var(--text); border-color:var(--text); color:#fff; font-weight:600; }
.sales-app .lead-list { display:grid; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-card); box-shadow:var(--shadow-card); overflow:hidden; }
.sales-app .lead-list > .address-status { padding:32px 24px; text-align:center; }
.sales-app .lead-row { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:14px; width:100%; min-height:72px; padding:14px 20px; border:0; border-top:1px solid var(--divider); border-radius:0; background:var(--surface); font:inherit; text-align:left; cursor:pointer; }
.sales-app .lead-row:first-child { border-top:0; }
.sales-app .lead-row:hover { background:var(--row-hover); border-color:var(--divider); }
.sales-app .lead-row-main { display:grid; gap:2px; min-width:0; }
.sales-app .lead-row-main :is(strong,small) { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sales-app .lead-row-main strong { color:var(--text); font-weight:600; }
.sales-app .lead-row-main small { color:var(--muted); font-size:13px; }
.sales-app .lead-row-tags { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:6px; }
.sales-app .lead-avatar { display:grid; place-items:center; width:40px; height:40px; border-radius:10px; background:var(--accent-tint); color:var(--accent); font-size:14px; font-weight:700; letter-spacing:.02em; }
.sales-app .lead-avatar.is-large { flex:none; width:52px; height:52px; border-radius:12px; font-size:18px; }
.sales-app .lead-avatar.is-approved { background:var(--good-tint); color:var(--good); }
.sales-app .lead-avatar:is(.is-waiting_for_owner,.is-follow_up) { background:var(--warn-tint); color:var(--warn); }
.sales-app .lead-avatar.is-declined { background:#f2f4f7; color:var(--subtle); }
.sales-app .lead-stage { display:inline-flex; align-items:center; gap:6px; padding:3px 9px; border-radius:6px; background:#f2f4f7; color:var(--body-text); font-size:12px; font-weight:600; line-height:18px; white-space:nowrap; }
.sales-app .lead-stage::before { content:''; width:6px; height:6px; border-radius:50%; background:currentColor; }
.sales-app .lead-stage.is-eligible { background:var(--good-tint); color:var(--good); }
.sales-app .lead-stage.is-waiting_for_quote { background:var(--near-tint); color:var(--near); }
.sales-app .lead-stage:is(.is-waiting_for_owner,.is-follow_up) { background:var(--warn-tint); color:var(--warn); }
.sales-app .lead-stage.is-approved { background:var(--good); color:#fff; }
.sales-app .lead-stage.is-declined { background:#f2f4f7; color:var(--subtle); }

/* Lead detail */
.sales-app .lead-back { justify-self:start; padding:4px 0; border:0; background:none; box-shadow:none; color:var(--muted); font:600 14px var(--body); cursor:pointer; }
.sales-app .lead-back:hover { background:none; color:var(--accent); }
.sales-app .lead-detail > .lead-head { max-width:760px; }
.sales-app .lead-detail > .lead-form { max-width:760px; margin:0; padding:24px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-card); box-shadow:var(--shadow-card); }
.sales-app .lead-detail > .lead-form > .lead-address { grid-column:1/-1; margin:0; font-weight:600; color:var(--text); }
.sales-app .lead-hero { display:grid; gap:16px; }
.sales-app .lead-head { display:flex; align-items:center; flex-wrap:wrap; gap:16px; }
.sales-app .lead-title { flex:1; min-width:200px; }
.sales-app .lead-title h2 { font-size:24px; letter-spacing:-.03em; }
.sales-app .lead-address { margin:2px 0 0; color:var(--muted); }
.sales-app .lead-contact-line { display:flex; flex-wrap:wrap; gap:6px 20px; padding-left:68px; font-size:14px; color:var(--body-text); }
.sales-app .lead-contact-line a { font-weight:500; text-decoration:none; }
.sales-app .lead-contact-line a:hover { text-decoration:underline; }
.sales-app .lead-stages { counter-reset:step; display:flex; margin:4px 0 0; padding:20px 0 0; list-style:none; border-top:1px solid var(--divider); }
.sales-app .lead-stage-step { counter-increment:step; position:relative; flex:1 1 0; min-width:0; display:grid; justify-items:center; gap:8px; padding:0 4px; border-radius:0; background:none; color:var(--muted); font-size:12px; font-weight:500; line-height:1.3; text-align:center; }
.sales-app .lead-stage-step::before { content:counter(step); position:relative; z-index:1; display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:var(--surface); border:2px solid var(--field-border); color:var(--muted); font-size:12px; font-weight:700; }
.sales-app .lead-stage-step::after { content:''; position:absolute; top:13px; left:calc(-50% + 18px); right:calc(50% + 18px); height:2px; border-radius:2px; background:var(--border); }
.sales-app .lead-stage-step:first-child::after { display:none; }
.sales-app .lead-stage-step.is-done { background:none; color:var(--body-text); }
.sales-app .lead-stage-step.is-done::before { content:'✓'; background:var(--accent); border-color:var(--accent); color:#fff; }
.sales-app .lead-stage-step:is(.is-done,.is-current)::after { background:var(--accent); }
.sales-app .lead-stage-step.is-current { background:none; color:var(--accent); font-weight:700; }
.sales-app .lead-stage-step.is-current::before { border-color:var(--accent); color:var(--accent); box-shadow:0 0 0 4px var(--accent-tint); }
.sales-app .lead-stage-step.is-current:last-child:not(.is-exit) { color:var(--good); }
.sales-app .lead-stage-step.is-current:last-child:not(.is-exit)::before { content:'✓'; background:var(--good); border-color:var(--good); color:#fff; box-shadow:0 0 0 4px var(--good-tint); }
.sales-app .lead-stage-step.is-current:last-child:not(.is-exit)::after { background:var(--good); }
.sales-app .lead-stage-step.is-exit.is-current { color:var(--error); }
.sales-app .lead-stage-step.is-exit.is-current::before { content:'✕'; background:var(--error); border-color:var(--error); color:#fff; box-shadow:0 0 0 4px var(--error-tint); }
.sales-app .lead-stage-step.is-exit::after { background:repeating-linear-gradient(90deg,var(--field-border) 0 4px,transparent 4px 8px); }
.sales-app .lead-stage-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px; padding-top:16px; border-top:1px solid var(--divider); }
.sales-app .lead-other-stage summary { color:var(--muted); font-size:13px; font-weight:600; cursor:pointer; }
.sales-app .lead-other-stage summary:hover { color:var(--accent); }
.sales-app .lead-other-body { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.sales-app .lead-other-body input { flex:1; min-width:200px; }
.sales-app .lead-layout { display:grid; grid-template-columns:minmax(0,1fr) 320px; align-items:start; gap:20px; }
.sales-app :is(.lead-main,.lead-side) { display:grid; grid-template-columns:minmax(0,1fr); gap:20px; min-width:0; }
.sales-app .lead-side { position:sticky; top:16px; }
.sales-app .lead-section > h3 { margin-bottom:16px; }
.sales-app .lead-form { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; margin-top:16px; }
.sales-app .lead-form label { display:flex; flex-direction:column; gap:6px; font-size:13px; font-weight:500; color:var(--body-text); }
.sales-app .lead-form :is(label:has(textarea),> p,> button) { grid-column:1/-1; }
.sales-app .lead-form textarea { min-height:96px; }
.sales-app .lead-form > button { justify-self:start; }
.sales-app .lead-side .lead-form { grid-template-columns:1fr; }
.sales-app .lead-about h3 { margin-bottom:12px; }
.sales-app .lead-facts { display:grid; grid-template-columns:auto minmax(0,1fr); gap:10px 16px; margin:0; font-size:14px; }
.sales-app .lead-facts dt { color:var(--muted); }
.sales-app .lead-facts dd { margin:0; color:var(--text); text-align:right; overflow-wrap:anywhere; white-space:pre-wrap; }
.sales-app .lead-about:has(.lead-edit[open]) .lead-facts { display:none; }
.sales-app .lead-edit { margin-top:16px; padding-top:14px; border-top:1px solid var(--divider); }
.sales-app .lead-edit > summary { color:var(--accent); font-size:14px; font-weight:600; cursor:pointer; }
.sales-app .lead-decision { border-color:#c4bbf3; box-shadow:0 0 0 4px var(--accent-tint); }
.sales-app .lead-decision h3 { margin-bottom:6px; }
.sales-app .lead-decision.is-signed { border-color:#abefc6; background:var(--good-tint); box-shadow:none; }
.sales-app .lead-decision.is-signed h3 { color:var(--good); }
.sales-app .lead-decision.is-declined { border-color:var(--border); background:var(--raised); box-shadow:none; }
.sales-app .decision-line { margin:0 0 4px; color:var(--text); font-weight:500; }
.sales-app .decision-form { max-width:680px; }
.sales-app .quote-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
.sales-app .quote-actions:not(:has(button:not([hidden]))) { display:none; }
.sales-app .quote-actions button[aria-pressed=true] { border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-tint); }
.sales-app .quote-list { display:grid; gap:10px; }
.sales-app .quote-card { display:grid; gap:4px; padding:14px 16px; background:var(--surface); border:1px solid var(--border); border-radius:10px; }
.sales-app .quote-card.is-latest { padding:18px 20px; border-color:#c4bbf3; background:linear-gradient(180deg,#faf9ff,var(--surface)); }
.sales-app .quote-card:not(.is-latest) { opacity:.85; }
.sales-app .quote-card-top { display:flex; justify-content:space-between; align-items:baseline; flex-wrap:wrap; gap:8px; }
.sales-app .quote-card-top strong { font-size:13px; font-weight:600; color:var(--body-text); }
.sales-app .quote-when { font-size:12px; color:var(--muted); }
.sales-app .quote-money { margin:0; color:var(--text); font-weight:600; font-variant-numeric:tabular-nums; }
.sales-app .quote-card.is-latest .quote-money { font-size:18px; letter-spacing:-.02em; }
.sales-app .quote-notes { margin:2px 0 0; color:var(--body-text); font-size:14px; white-space:pre-wrap; }
.sales-app .quote-file { justify-self:start; margin-top:6px; font-size:13px; font-weight:600; text-decoration:none; }
.sales-app .quote-file::before { content:'↓ '; }
.sales-app .quote-request-line { margin:4px 0 0; font-size:13px; color:var(--muted); }
.sales-app :is(.quote-draft,.quote-add,.file-add,.decision-form) { margin-top:16px; padding:20px; background:var(--raised); border:1px solid var(--border); border-radius:10px; }
.sales-app .quote-draft { grid-template-columns:1fr; }
.sales-app .quote-draft .address-hint { grid-column:1/-1; margin:0; padding:10px 12px; border-radius:8px; background:var(--near-tint); color:var(--near); }
.sales-app .quote-draft-row { grid-column:1/-1; display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.sales-app .quote-mailto { display:inline-flex; align-items:center; text-decoration:none; }
.sales-app .file-list { display:grid; margin-bottom:16px; }
.sales-app .file-list > .address-status { padding:4px 0; }
.sales-app .file-item { display:grid; grid-template-columns:36px minmax(0,1fr) auto; align-items:center; gap:12px; padding:12px 0; border-top:1px solid var(--divider); }
.sales-app .file-item:first-child { padding-top:0; border-top:0; }
.sales-app .file-item::before { content:''; width:36px; height:36px; border-radius:8px; background:var(--accent-tint) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%235b45d6' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M6 3h8l4 4v14H6Z'/%3E%3Cpath d='M14 3v4h4'/%3E%3C/svg%3E") center no-repeat; }
.sales-app .file-main { display:flex; flex-wrap:wrap; align-items:center; gap:4px 10px; min-width:0; }
.sales-app .file-name { font-weight:600; text-decoration:none; overflow-wrap:anywhere; }
.sales-app .file-name:hover { text-decoration:underline; }
.sales-app .file-meta { color:var(--muted); font-size:12px; }
.sales-app .file-note { flex-basis:100%; margin:0; color:var(--body-text); font-size:13px; }
.sales-app .file-remove { padding:6px 12px; color:var(--muted); font-size:13px; }
.sales-app .file-remove:hover { background:var(--error-tint); border-color:#fecdca; color:var(--error); }
.sales-app .lead-note { display:grid; gap:10px; margin-bottom:8px; }
.sales-app .lead-note textarea { min-height:76px; }
.sales-app .lead-note button { justify-self:start; }
.sales-app .lead-activity { position:relative; display:grid; gap:2px; margin-left:6px; padding:12px 0 12px 24px; border-top:0; border-left:2px solid var(--divider); font-size:14px; }
.sales-app .lead-activity::before { content:''; position:absolute; left:-7px; top:17px; width:8px; height:8px; border-radius:50%; background:var(--surface); border:2px solid var(--field-border); }
.sales-app .lead-activity:last-child { border-left-color:transparent; }
.sales-app .lead-activity-time { font-size:12px; color:var(--muted); }
.sales-app .lead-activity strong { color:var(--text); font-weight:600; }
.sales-app .lead-activity p { margin:2px 0 0; color:var(--body-text); white-space:pre-wrap; }
.sales-app .lead-activity:is(.is-stage,.is-decision)::before { background:var(--accent); border-color:var(--accent); }
.sales-app .lead-activity:is(.is-quote,.is-quote-request)::before { background:var(--good); border-color:var(--good); }
.sales-app .lead-activity.is-note::before { border-color:#f79009; }
.sales-app .lead-activity.is-file::before { border-color:var(--near); }
.sales-app .lead-activity:is(.is-stage,.is-decision) strong { color:var(--accent); }
.sales-app .lead-activity:is(.is-quote,.is-quote-request) strong { color:var(--good); }
.sales-app .lead-activity.is-file strong { color:var(--near); }

/* Map */
.sales-app .map-toolbar { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px; padding:12px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-card); box-shadow:var(--shadow-card); }
.sales-app .map-search { display:flex; flex:1; gap:8px; min-width:240px; max-width:420px; }
.sales-app .map-search input[type=search] { flex:1; min-width:0; min-height:40px; padding-left:36px; background:var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23667085' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") 12px center no-repeat; }
.sales-app .map-search .quiet { padding:8px 14px; }
.sales-app .map-chips { display:flex; flex-wrap:wrap; gap:6px; }
.sales-app .map-chip { display:inline-flex; align-items:center; gap:6px; padding:6px 11px; border:1px solid var(--border); border-radius:999px; background:var(--surface); color:var(--muted); font:600 13px var(--body); cursor:pointer; }
.sales-app .map-chip:hover { border-color:#c8ced8; }
.sales-app .map-chip[aria-pressed=true] { background:var(--accent-tint); border-color:#c4bbf3; color:var(--text); }
.sales-app .map-chip[aria-pressed=false] .map-dot { opacity:.35; }
.sales-app .map-dot { width:10px; height:10px; border-radius:50%; box-shadow:0 0 0 2px #fff,0 0 0 3px var(--field-border); }
.sales-app .map-status { margin:-8px 0 0; font-size:13px; color:var(--muted); }
.sales-app .address-map { height:min(70vh,720px); min-height:420px; border:1px solid var(--border); border-radius:var(--radius-card); box-shadow:var(--shadow-card); overflow:hidden; }
/* Popups are attached to the map canvas, so they sit inside .sales-app as well. */
.sales-app .maplibregl-popup-content { padding:14px 16px 12px; border-radius:12px; box-shadow:0 12px 32px #172b4d24; }
.sales-app .map-popup { display:grid; gap:4px; font:14px/1.4 var(--body); color:var(--text); }
.sales-app .map-popup .address-tags { margin-bottom:4px; }
.sales-app .map-popup strong { font-size:15px; }
.sales-app .map-popup > button { justify-self:start; margin-top:8px; padding:7px 14px; font-size:13px; }
.sales-app .map-popup .flag-control { margin-top:6px; font-size:12px; }
.sales-app .map-popup .flag-control-body { display:grid; gap:6px; }

/* Cleanup */
.sales-app .address-cleanup { max-width:960px; }
.sales-app .cleanup-head { display:grid; gap:4px; }
.sales-app .cleanup-head .address-intro { max-width:70ch; margin:0; }
.sales-app .cleanup-sections { display:inline-flex; gap:4px; width:fit-content; margin:0; padding:4px; background:#f2f4f7; border-radius:10px; }
.sales-app .cleanup-sections button { padding:7px 14px; border:0; border-radius:7px; background:none; color:var(--body-text); font:600 13px var(--body); cursor:pointer; }
.sales-app .cleanup-sections button[aria-pressed=true] { background:var(--surface); color:var(--text); box-shadow:0 1px 3px #1018281a; }
.sales-app :is(.cleanup-bulk,.address-cleanup > .address-status):empty { display:none; }
.sales-app .cleanup-list { display:grid; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-card); box-shadow:var(--shadow-card); overflow:hidden; }
.sales-app .cleanup-list > .address-status { padding:32px 24px; text-align:center; }
.sales-app .cleanup-row { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 20px; border-top:1px solid var(--divider); }
.sales-app .cleanup-row:first-child { border-top:0; }
.sales-app .cleanup-row.is-done { background:var(--raised); }
.sales-app .cleanup-row.is-done .cleanup-main { opacity:.55; }
.sales-app .cleanup-main { display:grid; gap:2px; min-width:0; }
.sales-app .cleanup-main .address-tags { margin-bottom:6px; }
.sales-app .cleanup-main strong { color:var(--text); font-weight:600; }
.sales-app .cleanup-reason { margin:4px 0 0; color:var(--body-text); font-size:13px; }
.sales-app .cleanup-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; align-items:center; gap:6px; }
.sales-app .cleanup-actions button { padding:7px 12px; font-size:13px; }
.sales-app .address-cleanup > .quiet { justify-self:center; }

@media(max-width:1000px) {
  .sales-app .sales-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .sales-app .lead-layout { grid-template-columns:minmax(0,1fr); }
  .sales-app .lead-side { position:static; }
}
@media(max-width:600px) {
  .sales-app,.sales-app .sales-view { gap:16px; }
  .sales-app :is(.sales-card,.lead-section,.address-hero) { padding:18px; }
  .sales-app .sales-stats { gap:10px; }
  .sales-app .sales-stat { padding:14px 16px; }
  .sales-app .sales-stat strong { font-size:22px; }
  .sales-app .address-form { flex-direction:column; }
  .sales-app .address-form button { width:100%; }
  .sales-app .address-card-top { flex-direction:column; }
  .sales-app .address-suggestion .address-card::after { display:none; }
  .sales-app .lead-toolbar input[type=search] { flex:1 1 100%; }
  .sales-app .lead-row { grid-template-columns:auto minmax(0,1fr); padding:14px 16px; }
  .sales-app .lead-row-tags { grid-column:2; justify-content:flex-start; }
  .sales-app .lead-contact-line { padding-left:0; }
  .sales-app .lead-stages { flex-wrap:nowrap; overflow-x:auto; padding-bottom:4px; scrollbar-width:none; }
  .sales-app .lead-stage-step { flex:0 0 76px; min-width:76px; font-size:11px; }
  .sales-app .lead-title h2 { font-size:20px; }
  .sales-app .address-map { height:62vh; min-height:360px; }
  .sales-app .map-search { max-width:none; }
  .sales-app .cleanup-row { flex-direction:column; align-items:flex-start; padding:16px; }
  .sales-app .cleanup-actions { justify-content:flex-start; }
  .sales-app .file-item { grid-template-columns:36px minmax(0,1fr); }
  .sales-app .file-remove { grid-column:2; justify-self:start; }
}
/* SAGO Direct price list and "price this job" */
.direct-prices { display:grid; gap:12px; max-width:900px; }
.direct-prices h2 { margin:0; }
.direct-price-group h3 { margin:0 0 6px; font-size:15px; }
.direct-price-row { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-start; gap:6px 14px; padding:10px 0; border-top:1px solid #eef1f5; }
.direct-price-row.is-off { opacity:.6; }
.direct-price-main { display:grid; gap:3px; flex:1 1 320px; min-width:0; } .direct-price-main small { color:#667085; font-size:13px; }
.direct-price-value { white-space:nowrap; color:#172b4d; }
.direct-price-edit { flex-basis:100%; font-size:13px; } .direct-price-edit summary { cursor:pointer; color:#5b6cd6; font-weight:600; width:fit-content; }
.direct-rules summary { cursor:pointer; font-weight:600; color:#172b4d; }
.direct-quote h3 { margin:0 0 8px; font-size:15px; }
.direct-quote-add { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:8px; }
.direct-quote-add select { flex:1 1 260px; min-width:0; min-height:42px; padding:8px 10px; border:1px solid #d9dee8; border-radius:8px; font:inherit; }
.direct-quote-add input { width:72px; min-height:42px; padding:8px 10px; border:1px solid #d9dee8; border-radius:8px; font:inherit; }
.direct-quote-lines { display:grid; gap:4px; }
.direct-quote-line { display:grid; grid-template-columns:1fr 64px auto auto; align-items:center; gap:8px; padding:8px 0; border-top:1px solid #eef1f5; }
.direct-quote-line input { width:64px; min-height:36px; padding:4px 8px; border:1px solid #d9dee8; border-radius:8px; font:inherit; }
.direct-quote-name { display:grid; gap:2px; min-width:0; } .direct-quote-name small { color:#667085; font-size:12px; }
.direct-quote-remove { min-height:32px; padding:2px 10px; }
.direct-quote-extras { margin-top:8px; }
.direct-profit-row.is-keep { font-size:16px; color:#172b4d; } .direct-profit-row.is-keep strong { color:#1f7a3f; }
.direct-warning { margin:8px 0 0; padding:8px 10px; border-radius:8px; background:#fff4e0; color:#9a5b00; font-size:14px; }
@media(max-width:600px){ .direct-quote-line { grid-template-columns:1fr 56px; } .direct-quote-line > strong { grid-column:1; } }

/* SAGO Direct refresh (2026-09-30): reuses the .sales-app cards; these rules cover Direct-only parts. */
.direct-app .direct-summary { margin:0; }
.direct-app .direct-head { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; }
.direct-app .direct-head h2 { margin:0; }
.direct-app .direct-prices { max-width:960px; }
.direct-app .direct-prices > .address-intro { margin:-8px 0 0; max-width:75ch; color:var(--muted); }
/* Stage colours follow the job: early = neutral, quoting = blue, booked = accent, working/billing = amber, paid = green. */
.direct-app .lead-stage.direct-stage:is(.is-lead,.is-site_visit) { background:#f2f4f7; color:var(--body-text); }
.direct-app .lead-stage.direct-stage.is-estimate { background:var(--near-tint); color:var(--near); }
.direct-app .lead-stage.direct-stage:is(.is-approved,.is-scheduled) { background:var(--accent-tint); color:var(--accent); }
.direct-app .lead-stage.direct-stage:is(.is-in_progress,.is-completed,.is-invoiced) { background:var(--warn-tint); color:var(--warn); }
.direct-app .lead-stage.direct-stage.is-paid { background:var(--good); color:#fff; }
.direct-app .lead-stage.direct-stage.is-lost { background:#f2f4f7; color:var(--subtle); }
.direct-app .direct-avatar:is(.is-in_progress,.is-completed,.is-invoiced) { background:var(--warn-tint); color:var(--warn); }
.direct-app .direct-avatar.is-paid { background:var(--good-tint); color:var(--good); }
.direct-app .direct-avatar.is-lost { background:#f2f4f7; color:var(--subtle); }
.direct-app .lead-head > .quiet { margin-left:auto; }
.direct-app .lead-head:has(> .quiet) .lead-title { flex:1; }
.direct-app .direct-notes { padding-left:68px; white-space:pre-wrap; }
.direct-app .direct-stages .lead-stage-step { min-width:0; }
/* Customer page: job rows inside a card are flat rows, not separate cards. */
.direct-app .lead-section > .lead-row { grid-template-columns:minmax(0,1fr) auto; min-height:0; padding:12px 0; }
.direct-app .lead-section > .lead-row:hover { background:none; }
.direct-app .lead-section > .lead-row:hover strong { color:var(--accent); }
.direct-app .lead-section > h3 + .lead-row { border-top:0; }
.direct-app .lead-section > summary { color:var(--text); font-weight:600; cursor:pointer; }
/* Money */
.direct-app .direct-money-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.direct-app .direct-money-cell { display:grid; gap:2px; min-width:0; padding:14px 16px; border:1px solid var(--border); border-radius:10px; background:var(--raised); }
.direct-app .direct-money-cell span { font-size:12px; font-weight:600; color:var(--body-text); }
.direct-app .direct-money-cell strong { font-size:18px; font-weight:700; letter-spacing:-.02em; color:var(--text); font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.direct-app .direct-money-cell.is-warn { background:var(--warn-tint); border-color:#fedf89; }
.direct-app .direct-money-cell.is-warn strong { color:var(--warn); }
.direct-app .direct-money > .address-hint { margin-top:12px; color:var(--muted); }
.direct-app .direct-profit { display:grid; gap:8px; margin-top:14px; padding:16px 18px; border:1px solid #abefc6; border-radius:10px; background:var(--good-tint); }
.direct-app .direct-profit.is-loss { border-color:#fecdca; background:var(--error-tint); }
.direct-app .direct-profit-row { display:flex; justify-content:space-between; gap:12px; font-size:14px; color:var(--body-text); font-variant-numeric:tabular-nums; }
.direct-app .direct-profit-row strong { color:var(--text); font-weight:600; }
.direct-app .direct-profit-row:is(.is-main,.is-keep) { font-size:17px; color:var(--text); font-weight:600; }
.direct-app .direct-profit-row.is-keep { padding-top:8px; border-top:1px solid #abefc680; }
.direct-app .direct-profit-row:is(.is-main,.is-keep) strong { color:var(--good); font-size:20px; letter-spacing:-.02em; }
.direct-app .direct-profit.is-loss .direct-profit-row:is(.is-main,.is-keep) strong { color:var(--error); }
.direct-app .direct-warning { margin:10px 0 0; padding:10px 12px; border-radius:8px; background:var(--warn-tint); color:var(--warn); font-size:14px; }
/* Price this job */
.direct-app .direct-quote-add { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; }
.direct-app .direct-quote-add select { flex:1 1 260px; min-width:0; }
.direct-app .direct-quote-add input { width:80px; }
.direct-app .direct-quote-lines { display:grid; }
.direct-app .direct-quote-lines > .address-status { padding:16px; border:1px dashed var(--field-border); border-radius:10px; text-align:center; font-size:13px; }
.direct-app .direct-quote-line { display:grid; grid-template-columns:minmax(0,1fr) 72px 96px auto; align-items:center; gap:10px; padding:10px 0; border-top:1px solid var(--divider); }
.direct-app .direct-quote-line:first-child { border-top:0; }
.direct-app .direct-quote-line > strong { text-align:right; font-variant-numeric:tabular-nums; color:var(--text); }
.direct-app .direct-quote-line input { width:72px; min-height:36px; padding:6px 8px; }
.direct-app .direct-quote-name { display:grid; gap:2px; min-width:0; }
.direct-app .direct-quote-name strong { color:var(--text); font-weight:600; }
.direct-app .direct-quote-name small { color:var(--muted); font-size:12px; }
.direct-app .direct-quote-remove { padding:4px 10px; color:var(--muted); }
.direct-app .direct-quote-remove:hover { color:var(--error); background:var(--error-tint); border-color:#fecdca; }
.direct-app .direct-quote-extras { margin-top:12px; }
.direct-app .direct-quote .quote-draft-row { margin-top:14px; }
/* Payments and costs */
.direct-app .direct-line { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:6px 12px; padding:12px 0; border-top:1px solid var(--divider); }
.direct-app .lead-section > h3 + .direct-line { border-top:0; padding-top:0; }
.direct-app .direct-line > div { display:grid; gap:2px; min-width:0; }
.direct-app .direct-line > div > strong { color:var(--text); font-weight:600; }
.direct-app .direct-line small { color:var(--muted); font-size:13px; }
.direct-app .direct-line-amount { margin-left:auto; font-size:15px; font-variant-numeric:tabular-nums; }
.direct-app .direct-line.is-in .direct-line-amount { color:var(--good); }
.direct-app .direct-line.is-out .direct-line-amount { color:var(--error); }
.direct-app .direct-line-remove { flex-basis:100%; font-size:13px; }
.direct-app :is(.direct-line-remove,.direct-removed) summary { width:fit-content; color:var(--muted); font-weight:600; cursor:pointer; }
.direct-app .direct-line-remove summary:hover { color:var(--error); }
.direct-app .direct-removed { margin-top:10px; font-size:13px; }
.direct-app .direct-add-line { margin-top:16px; padding:20px; border:1px solid var(--border); border-radius:10px; background:var(--raised); }
/* Price list */
.direct-app .direct-rules > summary,.direct-app .direct-prices > details.lead-section > summary { color:var(--text); font-weight:600; cursor:pointer; }
.direct-app .direct-price-group > h3 { margin-bottom:4px; }
.direct-app .direct-price-row { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-start; gap:6px 16px; padding:14px 0; border-top:1px solid var(--divider); }
.direct-app .direct-price-group > h3 + .direct-price-row { border-top:0; }
.direct-app .direct-price-row.is-off { opacity:.55; }
.direct-app .direct-price-main { display:grid; gap:4px; flex:1 1 320px; min-width:0; }
.direct-app .direct-price-main > strong { color:var(--text); font-weight:600; }
.direct-app .direct-price-main small { color:var(--muted); font-size:13px; }
.direct-app .direct-price-main .address-tags { margin-top:4px; }
.direct-app .direct-price-value { white-space:nowrap; color:var(--text); font-size:16px; font-variant-numeric:tabular-nums; }
.direct-app .direct-price-edit { flex-basis:100%; font-size:13px; }
.direct-app .direct-price-edit > summary { width:fit-content; color:var(--accent); font-weight:600; cursor:pointer; }
.direct-app .direct-price-edit[open] > .lead-form { padding:16px; border:1px solid var(--border); border-radius:10px; background:var(--raised); }
@media(max-width:1000px) { .direct-app .direct-money-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) {
  .direct-app .direct-notes { padding-left:0; }
  .direct-app .lead-head > .quiet { margin-left:0; width:100%; }
  .direct-app .direct-quote-line { grid-template-columns:minmax(0,1fr) 64px; }
  .direct-app .direct-quote-line > strong { grid-column:1; text-align:left; }
}
.sales-app .lead-facts dt.is-long { grid-column:1/-1; }
.sales-app .lead-facts dd.is-long { grid-column:1/-1; margin-top:-6px; text-align:left; color:var(--body-text); }
/* Estimates and invoices */
.direct-app .direct-docs > .direct-head { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:10px; }
.direct-app .direct-docs > .direct-head h3 { margin:0; }
.direct-app .direct-docs > .direct-head .quote-draft-row { margin:0; }
.direct-app .direct-doc-list { display:grid; margin-top:12px; }
.direct-app .direct-doc-list > .address-status { padding:16px; border:1px dashed var(--field-border); border-radius:10px; text-align:center; font-size:13px; }
.direct-app .direct-doc { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-start; gap:10px 16px; padding:14px 0; border-top:1px solid var(--divider); }
.direct-app .direct-doc:first-child { border-top:0; }
.direct-app .direct-doc:is(.is-replaced,.is-void) { opacity:.65; }
.direct-app .direct-doc-main { display:grid; gap:4px; min-width:0; }
.direct-app .direct-doc-main strong { color:var(--text); font-weight:600; }
.direct-app .direct-doc-main small { color:var(--muted); font-size:13px; }
.direct-app .direct-doc-links { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.direct-app .direct-doc-links a { display:inline-flex; align-items:center; min-height:36px; padding:6px 12px; border:1px solid var(--border); border-radius:var(--radius-control); color:var(--text); text-decoration:none; font-size:14px; font-weight:600; background:var(--surface); }
.direct-app .direct-doc-links a:hover { border-color:var(--accent); color:var(--accent); }
.direct-app .direct-doc-links .direct-line-remove { flex-basis:auto; }
.direct-app .direct-doc-editor:not(:empty) { margin-top:18px; padding:20px; border:1px solid var(--border); border-radius:10px; background:var(--raised); }
.direct-app .direct-doc-editor h3 { margin:0 0 4px; }
.direct-app .direct-doc-form { grid-template-columns:minmax(0,1fr); }
.direct-app .direct-doc-text :is(input,textarea) { width:100%; min-width:0; box-sizing:border-box; }
.direct-app .direct-doc-lines { display:grid; gap:10px; }
.direct-app .direct-doc-line { display:grid; gap:8px; padding:12px; border:1px solid var(--border); border-radius:10px; background:var(--surface); }
.direct-app .direct-doc-text { display:grid; gap:6px; }
.direct-app .direct-doc-text input { font-weight:600; }
.direct-app .direct-doc-text textarea { min-height:52px; font-size:13px; resize:vertical; }
.direct-app .direct-doc-nums { display:grid; grid-template-columns:80px 110px 120px 1fr auto; align-items:center; gap:8px; }
.direct-app .direct-doc-nums :is(input,select) { min-height:38px; padding:6px 8px; border:1px solid var(--field-border,#d9dee8); border-radius:8px; font:inherit; min-width:0; }
.direct-app .direct-doc-amount { text-align:right; font-variant-numeric:tabular-nums; color:var(--text); }
.direct-app .direct-doc-totals { background:var(--surface); border-color:var(--border); }
.direct-app .direct-doc-totals .direct-profit-row:is(.is-main,.is-keep) strong { color:var(--text); }
@media(max-width:600px){ .direct-app .direct-doc-nums { grid-template-columns:64px minmax(0,1fr) minmax(0,1fr); } .direct-app .direct-doc-amount { grid-column:1/3; text-align:left; } }
/* Business details */
.direct-app .direct-logo-preview { display:flex; align-items:center; min-height:90px; padding:16px; border:1px dashed var(--field-border,#d9dee8); border-radius:10px; background:#fff; margin-bottom:12px; }
.direct-app .direct-logo-preview img { display:block; max-width:260px; max-height:100px; }
.direct-app .direct-business-form textarea { min-height:80px; }
.direct-app .direct-business-form > .address-hint { grid-column:1/-1; margin:0; }
/* SAGO Direct expenses */
.direct-app .direct-head .quote-draft-row { margin:0; }
.direct-app .direct-head select { min-height:40px; padding:6px 10px; border:1px solid var(--field-border); border-radius:var(--radius-control); font:inherit; background:var(--surface); }
.direct-app .direct-expense-total { color:var(--text); font-variant-numeric:tabular-nums; }
.direct-app .direct-expense-form { display:grid; gap:12px; }
.direct-app .direct-expense-form h3 { margin:8px 0 0; }
.direct-app .direct-expense-files { display:grid; gap:10px; justify-items:start; padding:16px; border:1px dashed var(--field-border); border-radius:10px; background:var(--raised); }
.direct-app .direct-expense-files h3 { margin:0; }
.direct-app .direct-expense-files a { color:var(--accent); font-weight:600; }
.direct-app .direct-expense-files .address-hint { margin:0; }
.direct-app .direct-expense-items { display:grid; gap:8px; }
.direct-app .direct-expense-item { display:grid; gap:8px; padding:12px; border:1px solid var(--border); border-radius:10px; background:var(--surface); }
.direct-app .direct-expense-item input[name=item_desc] { width:100%; min-width:0; box-sizing:border-box; font-weight:600; }
.direct-app .direct-expense-item-nums { display:grid; grid-template-columns:110px minmax(0,1fr) 150px auto; gap:8px; align-items:center; }
.direct-app .direct-expense-item :is(input,select) { min-height:38px; padding:6px 8px; border:1px solid var(--field-border); border-radius:8px; font:inherit; min-width:0; background:var(--surface); }
.direct-app .direct-expense-balance { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; padding:12px 14px; border-radius:10px; background:var(--raised); font-size:14px; color:var(--body-text); }
.direct-app .direct-expense-balance.is-ok { background:var(--good-tint); color:var(--good); font-weight:600; }
.direct-app .direct-expense-balance.is-off { background:var(--warn-tint); color:var(--warn); font-weight:600; }
.direct-app .direct-receipt-costs h4 { margin:14px 0 4px; font-size:13px; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; }
.direct-app .direct-receipt-line { width:100%; border:0; border-top:1px solid var(--divider); background:none; font:inherit; text-align:left; cursor:pointer; }
.direct-app .direct-receipt-line:hover { background:var(--row-hover); }
@media(max-width:600px){ .direct-app .direct-expense-item-nums { grid-template-columns:96px minmax(0,1fr) auto; } .direct-app .direct-expense-item-nums select[name=item_kind] { grid-column:1/3; } }
/* Overview: money in and out */
.overview-money { margin-top:20px; padding:22px; }
.overview-money-head { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:10px; }
.overview-money-head h2 { margin:0; font-size:1.1rem; }
.overview-money-head select { min-height:40px; padding:6px 10px; border:1px solid var(--border); border-radius:8px; font:inherit; background:var(--surface); }
.overview-money-cols { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:16px; }
.overview-money-block { display:grid; gap:8px; align-content:start; padding:16px; border:1px solid var(--border); border-radius:10px; background:var(--raised); }
.overview-money-block h3 { margin:0 0 4px; font-size:.8rem; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
.overview-money-block.is-in { background:#ecfdf3; border-color:#abefc6; }
.overview-money-block.is-out { background:#fffaeb; border-color:#fedf89; }
.overview-money-row { display:flex; justify-content:space-between; gap:12px; font-size:.9rem; color:var(--body-text); font-variant-numeric:tabular-nums; }
.overview-money-row strong { color:var(--text); font-weight:600; }
.overview-money-row.is-total { padding-top:8px; border-top:1px solid #0000001a; font-size:1rem; color:var(--text); font-weight:600; }
.overview-money-row.is-total strong { font-size:1.1rem; }
.overview-money-months { margin-top:14px; }
.overview-money-months summary { cursor:pointer; font-weight:600; color:var(--accent); }
.overview-money > .fine { margin:12px 0 0; font-size:.8125rem; }
@media(max-width:800px){ .overview-money-cols { grid-template-columns:1fr; } }
.direct-app .direct-expense-item-nums > .direct-quote-remove { grid-column:4; }
.direct-app .direct-expense-note { grid-template-columns:minmax(0,1fr); margin:0; }
@media(max-width:600px){ .direct-app .direct-expense-item-nums > .direct-quote-remove { grid-column:3; grid-row:1; } }
.direct-app .direct-expense-form { grid-template-columns:minmax(0,1fr); min-width:0; }
.direct-app .direct-expense-form select { max-width:100%; min-width:0; }
.direct-app .direct-expense-form .direct-quote-add select { flex:1 1 200px; width:100%; }

/* Price list vs agreed price */
.direct-app .direct-compare { background:var(--raised); border-color:var(--border); }
.direct-app .direct-compare .direct-profit-row.is-main strong { color:var(--text); }
.direct-app .direct-compare .direct-profit-row.is-under strong { color:var(--warn); }
.direct-app .direct-quote-fold > summary { cursor:pointer; font-weight:600; color:var(--text); }
.direct-app .direct-quote-fold > .direct-quote { margin-top:12px; padding:0; border:0; box-shadow:none; }
/* A tall side panel (e.g. Edit details open) scrolls on its own instead of being cut off. */
.sales-app .lead-side { max-height:calc(100vh - 32px); overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; }
@media(max-width:1000px){ .sales-app .lead-side { max-height:none; overflow:visible; } }

/* Bank import: decided list, no checkboxes */
.bank-section { display:grid; gap:8px; padding:14px; border:1px solid var(--border); border-radius:var(--radius-card,12px); background:var(--surface); }
.bank-section h3 { margin:0 0 4px; font-size:.95rem; }
.bank-section.is-add { border-color:#abefc6; background:#f6fef9; }
.bank-section.is-skip { background:var(--raised); }
.bank-import-row.bank-line { display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-areas:'main amount' 'actions actions'; gap:6px 12px; padding:10px 12px; border:1px solid var(--border); border-radius:10px; background:var(--surface); }
.bank-line-main { grid-area:main; display:grid; gap:2px; min-width:0; }
.bank-line-main small { color:var(--muted); }
.bank-line.is-skip .bank-line-main strong { color:var(--muted); }
.bank-line-amount { grid-area:amount; font-variant-numeric:tabular-nums; }
.bank-line.is-skip .bank-line-amount { color:var(--muted); font-weight:500; }
.bank-line-actions { grid-area:actions; display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.bank-line-actions select { min-height:36px; padding:4px 8px; border:1px solid var(--border); border-radius:8px; font:inherit; background:var(--surface); }
.bank-line-actions .quiet { min-height:36px; padding:4px 12px; }
.bank-line-edit { flex-basis:100%; }
.bank-line-edit summary { cursor:pointer; color:var(--accent); font-weight:600; width:fit-content; }
.bank-line-fields { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:10px; margin-top:10px; }
.bank-line-fields label { display:flex; flex-direction:column; gap:4px; font-size:.8125rem; color:var(--muted); min-width:0; }
.bank-line-fields :is(input,select) { min-height:40px; padding:6px 8px; border:1px solid var(--border); border-radius:8px; font:inherit; min-width:0; }
.bank-line-fields button { align-self:end; }
.bank-reader-notes { grid-column:1/-1; font-size:.8125rem; color:var(--muted); }
.bank-reader-notes summary { cursor:pointer; }
.bank-line-edit { flex-basis:auto; }
.bank-line-edit[open] { flex-basis:100%; }

/* Work Expenses weeks (2026-09-30): chips and colour carry the key numbers; empty days recede. */
.work-expense-home { --cat-gas:#f79009; --cat-lunch:#12b76a; --cat-car:#2e90fa; --cat-tools:#7a5af8; --cat-materials:#ee46bc; --cat-other:#98a2b3; }
.work-expense-home .work-expense-week-summary { align-items:center; gap:20px; }
.work-expense-home .work-expense-week-summary > span:first-child { gap:4px; min-width:0; }
.work-expense-home .work-expense-week-summary > span:first-child > strong { font-size:18px; letter-spacing:-.02em; }
.work-expense-home .work-expense-week-summary > span:first-child > small { margin-top:0; font-size:13px; color:var(--muted); }
.work-expense-home .work-expense-chips { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.work-expense-home .work-chip { display:inline-flex; align-items:center; gap:6px; padding:3px 10px; border-radius:999px; background:#f2f4f7; color:var(--body-text); font-size:12px; font-weight:600; line-height:18px; white-space:nowrap; font-variant-numeric:tabular-nums; }
.work-expense-home .work-chip.is-earned { background:var(--success-tint); color:var(--green); }
.work-expense-home .work-chip.is-spent { background:var(--error-tint); color:var(--error); }
.work-expense-home .work-cat { background:var(--surface); border:1px solid var(--border); color:var(--text); font-weight:500; }
.work-expense-home .work-cat::before { content:''; flex:none; width:8px; height:8px; border-radius:50%; background:var(--cat-other); }
.work-expense-home .work-cat.cat-gas::before { background:var(--cat-gas); } .work-expense-home .work-cat.cat-lunch::before { background:var(--cat-lunch); }
.work-expense-home .work-cat.cat-car::before { background:var(--cat-car); } .work-expense-home .work-cat.cat-tools::before { background:var(--cat-tools); }
.work-expense-home .work-cat.cat-materials::before { background:var(--cat-materials); }
.work-expense-home .work-cat small { color:var(--muted); font-size:11px; font-weight:600; }
.work-expense-home .work-expense-week-total { display:grid; justify-items:end; gap:0; flex:none; text-align:right; }
.work-expense-home .work-expense-week-total small { margin:0; color:var(--muted); font-size:11px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; }
.work-expense-home .work-expense-week-total .work-expense-takehome { color:var(--green); font:700 26px/1.2 var(--body); letter-spacing:-.03em; }
.work-expense-home .work-expense-week-total .work-expense-takehome.is-negative { color:var(--error); }
.work-expense-home .work-expense-week[open] > .work-expense-week-summary { border-bottom:1px solid var(--border); margin-bottom:20px; background:linear-gradient(180deg,#fbfaff,var(--surface)); }
/* Week figures */
.work-expense-home .work-expense-metrics { gap:12px; background:none; border:0; border-radius:0; overflow:visible; }
.work-expense-home .work-expense-metrics > div { gap:6px; padding:16px 18px; border:1px solid var(--border); border-radius:10px; background:var(--surface); }
.work-expense-home .work-expense-metrics span { font-size:12px; font-weight:600; color:var(--body-text); }
.work-expense-home .work-expense-metrics strong { font-size:20px; letter-spacing:-.02em; }
.work-expense-home .work-expense-metrics > .is-reserve strong { color:var(--amber); }
.work-expense-home .work-expense-metrics > .is-spent strong { color:var(--error); }
.work-expense-home .work-expense-metrics > .is-keep { background:var(--success-tint); border-color:#abefc6; }
.work-expense-home .work-expense-metrics > .is-keep span { color:var(--green); }
.work-expense-home .work-expense-metrics > div.is-keep strong { color:var(--green); font-size:24px; }
.work-expense-home .work-expense-split { height:8px; margin:14px 0 0; }
.work-expense-home .work-expense-categories { display:flex; flex-wrap:wrap; gap:8px; margin:16px 0 8px; }
.work-expense-home .work-expense-categories .work-cat { padding:5px 12px; font-size:13px; }
/* Days */
.work-expense-home .work-expense-day { border-top:1px solid #f2f4f7; }
.work-expense-home .work-expense-categories + .work-expense-day { margin-top:12px; border-top:1px solid var(--border); }
.work-expense-home .work-expense-day-summary { min-height:0; padding:14px 6px; }
.work-expense-home .work-expense-day-summary:hover { background:var(--raised); }
.work-expense-home .work-expense-day-summary > span:first-child { gap:2px; }
.work-expense-home .work-expense-day-summary > span:first-child > strong { font-size:15px; color:var(--text); }
.work-expense-home .work-expense-day-categories { display:flex; align-items:center; gap:10px; font-variant-numeric:tabular-nums; }
.work-expense-home .work-day-earned { padding:2px 8px; border-radius:6px; background:var(--success-tint); color:var(--green); font-size:12px; font-weight:600; }
.work-expense-home .work-day-spent { color:var(--error); font-size:15px; }
.work-expense-home .work-day-none { color:var(--muted); font-size:13px; }
.work-expense-home .work-expense-day-summary.is-quiet { padding-block:8px; }
.work-expense-home .work-expense-day-summary.is-quiet > span:first-child > strong { font-size:13px; font-weight:500; color:var(--muted); }
.work-expense-home .work-expense-day-summary.is-quiet small,.work-expense-home .work-expense-day-summary.is-quiet .work-day-none { display:none; }
.work-expense-home .work-expense-day-summary.is-quiet::after { content:'Nothing recorded'; color:var(--subtle,#98a2b3); font-size:12px; }
.work-expense-home .work-expense-day[open] > .work-expense-day-summary:not(.is-quiet) { padding-bottom:8px; }
.work-expense-home .work-expense-day .work-expense-charge { margin:0 0 8px 6px; width:calc(100% - 6px); padding:10px 14px; border:1px solid var(--border); border-left:3px solid var(--border); border-radius:8px; }
.work-expense-home .work-expense-day .work-expense-charge:last-child { margin-bottom:14px; }
.work-expense-home .work-expense-charge:hover { border-color:#c4bbf3; background:#faf9ff; }
.work-expense-home .work-expense-charge > strong { font-size:15px; color:var(--text); }
.work-expense-home .work-charge-main { display:flex !important; flex-wrap:wrap; align-items:center; gap:6px 10px !important; min-width:0; }
.work-expense-home .work-charge-main .work-charge-vendor { color:var(--text) !important; font-size:14px !important; font-weight:600; overflow-wrap:anywhere; }
.work-expense-home .work-charge-main .work-cat { font-size:11px; padding:1px 8px; }
.work-expense-home .work-charge-main .work-cat > span { color:inherit !important; font-size:inherit !important; }
.work-expense-home .work-expense-day .work-expense-empty { margin:0 0 10px 6px; padding:0; }
@media(max-width:600px) {
  .work-expense-home .work-expense-week-summary { align-items:flex-start; }
  .work-expense-home .work-expense-week-total .work-expense-takehome { font-size:20px; }
  .work-expense-home .work-expense-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .work-expense-home .work-expense-day-summary { flex-direction:row; align-items:center; }
}
.work-expense-home .work-expense-split .allocation-net { background:var(--green); } .work-expense-home .work-expense-split .allocation-tax { background:#fdb022; } .work-expense-home .work-expense-split .allocation-spent { background:#f04438; }
.work-expense-home :is(.work-day-earned,.work-day-spent,.work-chip) { white-space:nowrap; }
@media(max-width:600px) { .work-expense-home .work-expense-day-categories { flex-direction:column; align-items:flex-end; gap:4px; } }

/* Work Expenses days as separate blocks (2026-09-30). */
.work-expense-home .work-expense-day { margin:0 0 10px; border:1px solid var(--border); border-radius:12px; background:var(--surface); overflow:hidden; }
.work-expense-home .work-expense-categories + .work-expense-day { margin-top:16px; border-top:1px solid var(--border); }
.work-expense-home .work-expense-day-summary { justify-content:flex-start; gap:14px; padding:12px 14px; background:var(--raised); }
.work-expense-home .work-expense-day:not([open]) > .work-expense-day-summary,.work-expense-home .work-expense-day-summary.is-quiet { background:var(--surface); }
.work-expense-home .work-expense-day[open] > .work-expense-day-summary:not(.is-quiet) { padding-bottom:12px; border-bottom:1px solid var(--border); }
.work-expense-home .work-expense-day-summary > .work-day-tile + span { display:grid; gap:2px; flex:1; min-width:0; }
.work-expense-home .work-expense-day-summary > .work-day-tile + span > strong { font-size:15px; color:var(--text); }
.work-expense-home .work-expense-day-categories { margin-left:auto; }
.work-expense-home .work-day-tile { flex:none; display:grid; justify-items:center; align-content:center; width:46px; height:46px; border-radius:10px; background:var(--accent-tint); color:var(--accent); line-height:1.1; }
.work-expense-home .work-day-tile small { font-size:10px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.work-expense-home .work-day-tile b { font-size:18px; font-weight:700; }
.work-expense-home .work-day-tile.is-weekend { background:#f2f4f7; color:var(--body-text); }
.work-expense-home .work-expense-day-summary.is-quiet { padding-block:8px; }
.work-expense-home .work-expense-day-summary.is-quiet .work-day-tile { width:36px; height:36px; background:#f2f4f7; color:var(--muted); }
.work-expense-home .work-expense-day-summary.is-quiet .work-day-tile small { font-size:9px; }
.work-expense-home .work-expense-day-summary.is-quiet .work-day-tile b { font-size:14px; }
.work-expense-home .work-expense-day:has(> .is-quiet) { margin-bottom:6px; border-style:dashed; }
.work-expense-home .work-expense-day .work-expense-charge { margin:10px 14px 0; width:calc(100% - 28px); }
.work-expense-home .work-expense-day .work-expense-charge:last-child { margin-bottom:14px; }
.work-expense-home .work-expense-day .work-expense-empty { margin:10px 14px 12px; }
@media(max-width:600px) {
  .work-expense-home .work-expense-day-summary { gap:10px; padding:10px 12px; }
  .work-expense-home .work-day-tile { width:40px; height:40px; }
  .work-expense-home .work-expense-day .work-expense-charge { margin:8px 10px 0; width:calc(100% - 20px); }
}
.work-expense-home .work-expense-day-summary.is-quiet .work-day-tile small { display:block; }
/* AI Assistant */
.assistant-app { display:grid; gap:18px; max-width:860px; }
.assistant-intro { padding:20px 22px; }
.assistant-intro h2 { margin:0 0 6px; font-size:1.15rem; }
.assistant-lead { margin:0; color:var(--body-text); }
.assistant-meter { margin:10px 0 0; font-size:.8125rem; color:var(--muted); }
.assistant-meter.is-off { color:var(--amber); font-weight:600; }
.assistant-chat { display:grid; gap:14px; padding:18px; }
.assistant-log { display:grid; gap:12px; }
.assistant-log:empty { display:none; }
.assistant-msg { max-width:88%; padding:12px 14px; border-radius:14px; line-height:1.5; }
.assistant-msg p { margin:0 0 6px; } .assistant-msg p:last-child { margin-bottom:0; }
.assistant-msg ul { margin:4px 0 6px; padding-left:20px; } .assistant-msg li { margin:2px 0; }
.assistant-msg.is-user { justify-self:end; background:var(--accent); color:#fff; border-bottom-right-radius:4px; }
.assistant-msg.is-assistant { justify-self:start; background:var(--raised); border:1px solid var(--border); border-bottom-left-radius:4px; }
.assistant-msg.is-waiting { color:var(--muted); font-style:italic; }
.assistant-sources { display:block; margin-top:8px; font-size:.75rem; color:var(--muted); }
.assistant-chips { display:flex; flex-wrap:wrap; gap:8px; }
.assistant-chip { padding:8px 12px; border:1px solid var(--border); border-radius:999px; background:var(--surface); font:inherit; font-size:.8125rem; color:var(--text); cursor:pointer; }
.assistant-chip:hover { border-color:var(--accent); color:var(--accent); }
.assistant-form { display:grid; gap:8px; }
.assistant-form-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; align-items:end; }
.assistant-form textarea { min-height:48px; padding:10px 12px; border:1px solid var(--border); border-radius:10px; font:inherit; resize:vertical; }
.assistant-form .btn-primary { min-height:48px; padding:0 22px; }
.assistant-form > .quiet { justify-self:start; }
.assistant-status { margin:0; font-size:.875rem; } .assistant-status.is-error { color:#b42318; }
.assistant-recent { padding:14px 18px; } .assistant-recent > summary { cursor:pointer; font-weight:600; }
.assistant-past { margin-top:10px; padding-top:10px; border-top:1px solid var(--border); }
.assistant-past > summary { cursor:pointer; color:var(--text); }
.assistant-past .assistant-answer { margin-top:8px; color:var(--body-text); font-size:.9rem; }
@media(max-width:600px){ .assistant-msg { max-width:100%; } .assistant-form-row { grid-template-columns:1fr; } }
.assistant-msg.is-user p { color:#fff; }
.assistant-proposal { justify-self:start; width:min(100%,560px); display:grid; gap:10px; padding:14px 16px; border:1px solid #c7d7fe; border-radius:14px; background:#f5f8ff; }
.assistant-proposal-head { display:flex; justify-content:space-between; align-items:center; gap:10px; }
.assistant-proposal-badge { font-size:.75rem; font-weight:700; padding:3px 10px; border-radius:999px; background:#fff; border:1px solid var(--border); color:var(--muted); }
.assistant-proposal.is-done { border-color:#abefc6; background:#f6fef9; } .assistant-proposal.is-done .assistant-proposal-badge { color:#067647; border-color:#abefc6; }
.assistant-proposal.is-failed { border-color:#fecdca; background:#fffbfa; } .assistant-proposal.is-failed .assistant-proposal-badge { color:#b42318; }
.assistant-proposal:is(.is-cancelled,.is-expired) { opacity:.7; background:var(--raised); border-color:var(--border); }
.assistant-proposal dl { display:grid; grid-template-columns:auto minmax(0,1fr); gap:4px 14px; margin:0; font-size:.875rem; }
.assistant-proposal dt { color:var(--muted); } .assistant-proposal dd { margin:0; color:var(--text); text-align:right; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.assistant-proposal-actions { display:flex; gap:8px; }
.assistant-proposal-note { margin:0; font-size:.8125rem; color:var(--body-text); } .assistant-proposal-note:empty { display:none; }
/* SAGO Direct job photos */
.direct-photo-groups { display:grid; gap:14px; }
.direct-photo-group h4 { margin:0 0 8px; font-size:.8125rem; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; }
.direct-photo-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:10px; }
.direct-photo { margin:0; min-width:0; display:flex; flex-direction:column; gap:4px; }
.direct-photo a { display:block; aspect-ratio:4/3; border-radius:8px; overflow:hidden; border:1px solid var(--border); background:var(--surface); }
.direct-photo img { width:100%; height:100%; object-fit:cover; display:block; }
.direct-photo figcaption { font-size:.8125rem; color:var(--body-text); overflow-wrap:anywhere; }
.direct-photo-more summary { font-size:.75rem; color:var(--muted); cursor:pointer; }
.direct-photo-more .lead-other-body { display:grid; gap:6px; grid-template-columns:minmax(0,1fr); }
.direct-photo-more select,.direct-photo-more input { min-width:0; width:100%; }
.direct-photo-add { margin-top:12px; grid-template-columns:minmax(0,1fr); }
.direct-photo-add input[type=file] { min-width:0; max-width:100%; }
@media (max-width:520px){ .direct-photo-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
/* Reports → Year summary */
.year-report { display:grid; gap:12px; margin-bottom:16px; }
.year-report-head { display:flex; flex-wrap:wrap; gap:10px; align-items:center; justify-content:space-between; }
.year-report-head h2 { margin:0; }
.year-report-controls { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.year-report-controls select { min-height:40px; padding:8px; border:1px solid var(--border); border-radius:7px; font:inherit; background:var(--surface); color:var(--text); }
.year-report-lead { margin:0; color:var(--muted); font-size:.875rem; }
.year-report-body { display:grid; gap:14px; }
.year-report-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.year-report-card { display:flex; flex-direction:column; gap:4px; padding:12px 14px; border:1px solid var(--border); border-radius:10px; background:var(--raised); min-width:0; }
.year-report-card span { color:var(--muted); font-size:.8125rem; }
.year-report-card strong { font-size:1.375rem; color:var(--text); }
.year-report-card small { color:var(--body-text); overflow-wrap:anywhere; }
.year-report-card.is-main { border-color:var(--green); }
.year-report-card.is-loss { border-color:var(--amber); }
.year-report-cats { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.year-report-part h3 { margin:0 0 6px; font-size:1rem; }
.year-report-part table,.year-report-months table { width:100%; border-collapse:collapse; }
.year-report-part td,.year-report-months td,.year-report-months th { padding:7px 4px; border-bottom:1px solid var(--border); text-align:left; }
.year-report-part td:last-child,.year-report-months td:not(:first-child),.year-report-months th:not(:first-child) { text-align:right; white-space:nowrap; }
.year-report-part tr.is-income td:last-child { color:var(--green); font-weight:600; }
.year-report-months summary { cursor:pointer; font-weight:600; }
.reports-pdfs { margin-top:4px; }
@media (max-width:720px){ .year-report-cards,.year-report-cats { grid-template-columns:minmax(0,1fr); } }
/* Inbox badge and Gmail */
.nav-button { position:relative; }
.nav-count { margin-left:auto; min-width:20px; height:20px; padding:0 6px; border-radius:999px; background:var(--accent); color:#fff; font-size:.75rem; font-weight:700; display:inline-flex; align-items:center; justify-content:center; box-sizing:border-box; }
/* Assistant attachments */
.assistant-attach { flex:0 0 auto; min-width:44px; min-height:44px; font-size:1.1rem; padding:0 10px; }
.assistant-files { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:8px; }
.assistant-file { display:inline-flex; align-items:center; gap:6px; max-width:100%; padding:5px 6px 5px 10px; border:1px solid var(--border); border-radius:999px; background:var(--accent-tint); color:var(--text); font-size:.8125rem; }
.assistant-file > span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; }
.assistant-file-x { border:0; background:transparent; color:var(--muted); font-size:1rem; line-height:1; cursor:pointer; padding:2px 6px; border-radius:999px; }
.assistant-file-x:hover { background:var(--surface); color:var(--text); }
.assistant-form-row { grid-template-columns:auto minmax(0,1fr) auto; }
.assistant-form .assistant-attach { min-height:48px; border-radius:10px; }
@media(max-width:600px){ .assistant-form-row { grid-template-columns:auto minmax(0,1fr); } .assistant-form-row .btn-primary { grid-column:1 / -1; } }
.assistant-file-x { min-height:0; min-width:0; }
/* Inbox: list on the left, the open item on the right; on a phone the list, then the item full width */
.inbox-app { display:grid; gap:12px; }
.inbox-bar { display:flex; flex-wrap:wrap; gap:10px 16px; align-items:center; justify-content:space-between; }
.inbox-tabs { display:inline-flex; gap:2px; padding:3px; border:1px solid var(--border); border-radius:10px; background:var(--surface); }
.inbox-tab { padding:7px 14px; border:0; border-radius:7px; background:transparent; color:var(--body-text); font:inherit; font-size:.875rem; cursor:pointer; min-height:36px; }
.inbox-tab.is-active { background:var(--accent-tint); color:var(--accent); font-weight:600; }
.inbox-gmail { display:flex; flex-wrap:nowrap; gap:8px; min-width:0; align-items:center; position:relative; }
.inbox-gmail-line { display:inline-flex; align-items:center; gap:8px; min-width:0; color:var(--body-text); font-size:.875rem; white-space:nowrap; }
.inbox-gmail-line.is-warn { color:var(--amber); font-weight:600; }
.inbox-dot { flex:none; width:8px; height:8px; border-radius:50%; background:var(--amber); }
.inbox-gmail-text { min-width:0; overflow:hidden; text-overflow:ellipsis; }
.inbox-gmail > button,.inbox-menu summary { white-space:nowrap; }
.inbox-dot.is-on { background:var(--green); }
.inbox-menu summary { list-style:none; cursor:pointer; padding:8px 12px; border:1px solid #d5dde8; border-radius:7px; font-size:.8125rem; font-weight:500; background:var(--surface); }
.inbox-menu summary::-webkit-details-marker { display:none; }
.inbox-menu-body { position:absolute; right:0; top:calc(100% + 6px); z-index:20; width:min(340px,calc(100vw - 32px)); display:grid; gap:8px; padding:14px; border:1px solid var(--border); border-radius:12px; background:var(--surface); box-shadow:0 12px 32px #172b4d1f; box-sizing:border-box; }
.inbox-menu-body p { margin:0; }
.inbox-menu-body strong { overflow-wrap:anywhere; }
.inbox-menu-body input { min-height:40px; padding:8px 10px; border:1px solid var(--border); border-radius:8px; font:inherit; min-width:0; }
.inbox-menu-body button { justify-self:start; }
.inbox-status { margin:0; position:sticky; top:8px; z-index:15; padding:10px 14px; border-radius:10px; background:var(--surface); border:1px solid var(--border); box-shadow:0 6px 18px #172b4d14; }
.inbox-pay-when { grid-column:1/-1; margin:0; font-size:.875rem; color:var(--body-text); }
.inbox-pay-when:empty { display:none; }
.inbox-apply-all { min-height:36px; }
.inbox-attachment-name { display:inline-flex; flex-wrap:wrap; align-items:center; gap:6px; }
.inbox-attachment.is-invoice { border-color:#abefc6; background:var(--success-tint); }
.inbox-extras .inbox-attachment-list { margin-top:8px; }
.inbox-status:empty { display:none; }
.address-status.is-ok { color:var(--green); }
.inbox-split { display:grid; grid-template-columns:minmax(280px,360px) minmax(0,1fr); gap:16px; align-items:start; }
.inbox-side { position:sticky; top:12px; max-height:calc(100vh - 24px); overflow:auto; border:1px solid var(--border); border-radius:var(--radius-card); background:var(--surface); }
.inbox-list { display:grid; }
.inbox-list-tools { display:flex; flex-wrap:wrap; gap:8px; align-items:center; justify-content:space-between; padding:10px 12px; border-bottom:1px solid var(--border); background:var(--raised); }
.inbox-row { display:grid; grid-template-columns:34px minmax(0,1fr); gap:10px; width:100%; padding:12px; border:0; border-bottom:1px solid var(--border); border-left:3px solid transparent; border-radius:0; background:transparent; text-align:left; font:inherit; color:var(--text); cursor:pointer; }
.inbox-row:hover { background:var(--raised); }
.inbox-row.is-selected { background:var(--accent-tint); border-left-color:var(--accent); }
.inbox-row.is-pay:not(.is-selected) { border-left-color:var(--green); }
.inbox-icon { width:34px; height:34px; border-radius:8px; display:flex; align-items:center; justify-content:center; background:var(--raised); border:1px solid var(--border); color:var(--muted); font-size:.7rem; font-weight:700; box-sizing:border-box; }
.inbox-icon.is-email { color:var(--accent); background:var(--accent-tint); border-color:transparent; font-size:1rem; }
.inbox-row-main { display:grid; gap:3px; min-width:0; }
.inbox-row-top { display:flex; gap:8px; align-items:baseline; min-width:0; }
.inbox-row-title { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.9rem; }
.inbox-row-when { flex:none; color:var(--muted); font-size:.75rem; }
.inbox-row-sub { color:var(--muted); font-size:.8125rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.inbox-row-sub:empty { display:none; }
.inbox-row-tags { display:flex; flex-wrap:wrap; gap:4px; }
.inbox-row-tags:empty { display:none; }
.inbox-tag { display:inline-flex; align-items:center; padding:2px 8px; border-radius:999px; background:var(--raised); border:1px solid var(--border); color:var(--body-text); font-size:.75rem; white-space:nowrap; max-width:100%; overflow:hidden; text-overflow:ellipsis; box-sizing:border-box; }
.inbox-tag.is-pay { background:var(--success-tint); border-color:#abefc6; color:var(--green); font-weight:600; }
.inbox-tag.is-done { color:var(--green); }
.inbox-empty { margin:0; padding:28px 16px; text-align:center; color:var(--muted); }
.inbox-detail { min-width:0; }
.inbox-detail-empty { padding:48px 16px; text-align:center; color:var(--muted); border:1px dashed var(--border); border-radius:var(--radius-card); }
.inbox-detail-empty:empty { display:none; }
.inbox-pane { display:grid; gap:16px; padding:20px; border:1px solid var(--border); border-radius:var(--radius-card); background:var(--surface); min-width:0; }
.inbox-pane-head { display:grid; gap:6px; }
.inbox-pane-head h2 { margin:0; font-size:1.25rem; overflow-wrap:anywhere; }
.inbox-meta { margin:0; color:var(--muted); font-size:.875rem; overflow-wrap:anywhere; }
.inbox-back { display:none; justify-self:start; }
.inbox-actions { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-top:6px; }
.inbox-actions a.quiet { text-decoration:none; color:var(--text); display:inline-flex; align-items:center; }
.inbox-note { margin:0; white-space:pre-wrap; overflow-wrap:anywhere; color:var(--body-text); }
.inbox-email-text { max-height:320px; overflow:auto; padding:14px; border-radius:10px; background:var(--raised); border:1px solid var(--border); font-size:.9rem; }
.inbox-suggestion { margin:0; padding:10px 12px; border-radius:8px; background:var(--accent-tint); overflow-wrap:anywhere; }
.inbox-filed { margin:0; padding:10px 12px; border-radius:8px; background:var(--success-tint); color:var(--green); font-weight:600; }
.inbox-filed.is-muted { background:var(--raised); color:var(--muted); font-weight:400; }
.inbox-preview { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; max-height:300px; min-height:120px; overflow:hidden; border:1px solid var(--border); border-radius:10px; background:var(--raised); text-decoration:none; color:var(--muted); }
.inbox-preview img { max-width:100%; max-height:300px; object-fit:contain; display:block; }
.inbox-pdf { font-weight:700; font-size:1.25rem; letter-spacing:.05em; color:var(--muted); }
.inbox-where h3,.inbox-attachments h3 { margin:0 0 8px; font-size:.9375rem; }
.inbox-choices { display:flex; flex-wrap:wrap; gap:8px; }
.inbox-choice { padding:9px 14px; border:1px solid var(--border); border-radius:999px; background:var(--surface); color:var(--text); font:inherit; font-size:.875rem; cursor:pointer; min-height:40px; }
.inbox-choice:hover { border-color:var(--accent); }
.inbox-choice.is-active { background:var(--accent); border-color:var(--accent); color:#fff; font-weight:600; }
.inbox-more .inbox-choices { margin-top:10px; }
.inbox-target > .address-hint { margin:10px 0 8px; }
.inbox-target > .btn-primary { min-height:44px; padding:0 20px; }
.inbox-file-form { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
.inbox-file-form select,.inbox-file-form input:not([type=checkbox]) { min-width:0; width:100%; box-sizing:border-box; }
.inbox-file-form > button { justify-self:start; min-height:44px; padding:0 20px; }
.inbox-more { grid-column:1/-1; }
.inbox-more summary { cursor:pointer; color:var(--muted); font-size:.875rem; }
.inbox-more-body { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:12px; margin-top:8px; }
.inbox-more-body label { display:flex; flex-direction:column; gap:6px; font-size:13px; color:#475467; font-weight:500; }
.inbox-more-body input { min-height:42px; padding:8px 10px; border:1px solid #d9dee8; border-radius:8px; font:inherit; min-width:0; }
.inbox-attachments { display:grid; gap:8px; }
.inbox-attachment-list { display:grid; gap:8px; }
.inbox-attachment { display:flex; flex-wrap:wrap; gap:8px 10px; align-items:center; padding:8px 10px; border:1px solid var(--border); border-radius:8px; background:var(--raised); }
.inbox-attachment > span { flex:1 1 200px; min-width:0; overflow-wrap:anywhere; font-size:.875rem; }
.inbox-attachment a.quiet { text-decoration:none; color:var(--text); }
.inbox-callout { display:grid; gap:8px; padding:16px; border:1px solid #abefc6; border-radius:12px; background:var(--success-tint); }
.inbox-callout > p { margin:0; }
.inbox-callout > button { justify-self:start; min-height:44px; padding:0 20px; }
.inbox-reading { margin:0; padding:12px; border-radius:8px; background:var(--accent-tint); color:var(--accent); font-weight:500; }
.inbox-pay { margin-top:0; padding:16px; border:1px solid var(--border); border-radius:12px; background:var(--surface); }
.inbox-pay-summary { grid-column:1/-1; display:grid; gap:2px; }
.inbox-pay-kicker { color:var(--muted); font-size:.8125rem; }
.inbox-pay-total { font-size:1.75rem; color:var(--text); }
.inbox-pay-summary small { color:var(--body-text); }
.inbox-pay-check { grid-column:1/-1; margin:0; font-size:.875rem; }
.inbox-pay-check:empty { display:none; }
.inbox-pay-check.is-ok { color:var(--green); font-weight:600; }
.inbox-pay-check.is-warn { color:var(--amber); }
.lead-form label.inbox-check { grid-column:1/-1; flex-direction:row; align-items:center; gap:10px; padding:10px 12px; border-radius:8px; background:var(--raised); color:var(--text); font-size:.9rem; cursor:pointer; }
.inbox-check input { width:18px; height:18px; min-height:0; margin:0; accent-color:var(--accent); }
.inbox-warn { margin:0; color:var(--amber); font-size:.875rem; }
@media (max-width:899px){
  .inbox-split { grid-template-columns:minmax(0,1fr); }
  .inbox-side { position:static; max-height:none; }
  .inbox-split.is-open .inbox-side { display:none; }
  .inbox-split:not(.is-open) .inbox-detail { display:none; }
  .inbox-back { display:inline-flex; }
  .inbox-pane { padding:16px; }
}
@media (max-width:620px){ .inbox-file-form,.inbox-more-body { grid-template-columns:minmax(0,1fr); } }
/* Field Ops: an open week stands apart — framed, its header stays on screen while you scroll its days, and it ends with Close */
.ledger-month { overflow:clip; }
.ledger-month .period-detail[open] { margin:14px 12px; border:1px solid #cfc8f7; border-radius:16px; box-shadow:0 10px 28px #3d2fa01a; overflow:clip; }
.ledger-month .period-detail[open] + .period-detail { border-top:0; }
.ledger-month .period-detail[open] > .week-header { position:sticky; top:0; z-index:6; background:#f4f2ff; border-bottom:1px solid #e1dcfb; }
.ledger-month .period-detail[open] > .panel-body { background:#f6f7fb; padding-top:18px; }
.week-close { display:block; width:100%; margin:18px 0 2px; padding:12px; border:1px dashed #cfc8f7; border-radius:12px; background:#fff; color:var(--accent); font:inherit; font-size:14px; font-weight:600; cursor:pointer; }
.week-close:hover { background:#f4f2ff; }
.week-invoice { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; margin:14px 0; padding:14px 18px; background:#fff; border:1px solid #dfe6f0; border-radius:14px; }
.week-invoice-text { display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 14px; }
.week-invoice-label { color:#657590; font-size:13px; font-weight:600; }
.week-invoice-text strong { font-size:18px; font-variant-numeric:tabular-nums; }
.week-invoice-text small { font-size:13px; }
.week-invoice-text small.is-ok { color:var(--green); font-weight:600; }
.week-invoice-text small.is-warn { color:var(--amber); }
.week-invoice a.quiet { text-decoration:none; color:var(--text); }
/* 123NET address search as you type */
.address-live { display:grid; gap:10px; margin-top:14px; }
.address-live:empty { display:none; }
.address-live-count { margin:0; color:var(--body-text); font-size:.875rem; }
.address-streets { display:flex; flex-wrap:wrap; gap:6px; }
.address-street { display:inline-flex; align-items:baseline; gap:4px; padding:7px 12px; border:1px solid var(--border); border-radius:999px; background:var(--surface); color:var(--text); font:inherit; font-size:.8125rem; cursor:pointer; min-height:36px; }
.address-street span { color:var(--muted); }
.address-street:hover { border-color:var(--accent); }
.address-street.is-active { background:var(--accent); border-color:var(--accent); color:#fff; }
.address-street.is-active span { color:#e7e3ff; }
.address-rows { display:grid; border:1px solid var(--border); border-radius:12px; max-height:460px; overflow-y:auto; background:var(--surface); }
.address-row { display:flex; align-items:center; gap:10px; padding:6px 10px 6px 0; border-bottom:1px solid #eef0f4; border-left:3px solid transparent; }
.address-row:last-child { border-bottom:0; }
.address-row.is-good { border-left-color:#12b76a; }
.address-row.is-near { border-left-color:#2e90fa; }
.address-row.is-warn { border-left-color:#f79009; }
.address-row-main { flex:1; min-width:0; display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 12px; padding:6px 12px; border:0; background:transparent; text-align:left; font:inherit; color:var(--text); cursor:pointer; }
.address-row-main:hover strong { color:var(--accent); }
.address-row-main > span { color:var(--muted); font-size:.8125rem; }
.address-row-main > .address-row-tag { padding:1px 8px; border-radius:999px; background:#f2f4f7; color:#475467; font-size:.75rem; font-weight:600; }
.address-row-tag.is-good { background:#ecfdf3; color:#067647; }
.address-row-tag.is-near { background:#eff8ff; color:#175cd3; }
.address-row-tag.is-warn { background:#fffaeb; color:#b54708; }
.address-row-tag.is-flag { background:#fef3f2; color:#b42318; }
.address-row .lead-action { flex:none; min-height:34px; }
.address-row .address-row-lead { min-height:32px; padding:4px 12px; color:var(--accent); border-color:#d9d3fb; background:#fff; font-weight:600; }
.address-row .address-row-lead:hover { background:var(--accent-tint); }
/* Map Find: the summary line and the matching streets above the map */
.map-found { margin:0 0 12px; }
.map-found-note { flex-basis:100%; margin:0 0 2px; font-size:.875rem; color:var(--body-text); }
.map-found-clear { color:var(--muted); }
/* Inbox: a reply about a quote request */
.inbox-tag.is-quote { background:#eff8ff; border-color:#b2ddff; color:#175cd3; font-weight:600; }
.inbox-callout.is-quote { border-color:#b2ddff; background:#eff8ff; }
/* Lead: quote request waiting in Gmail Drafts */
.quote-gmail-draft { border-color:#b2ddff; background:#f5faff; }
.quote-gmail-draft a.quiet { text-decoration:none; color:var(--text); display:inline-flex; align-items:center; }
/* SAGO Direct: smart price-list search */
.direct-price-search { display:grid; gap:6px; margin:4px 0 14px; }
.direct-price-search input { min-height:46px; padding:10px 14px; border:1px solid var(--border); border-radius:10px; font:inherit; font-size:1rem; background:var(--surface); color:var(--text); width:100%; box-sizing:border-box; }
.direct-price-search input:focus-visible { outline:3px solid var(--accent-tint); border-color:var(--accent); }
.direct-price-found { margin:0; color:var(--body-text); font-size:.875rem; }
.direct-price-found:empty { display:none; }
.direct-price-main mark { background:#fff1a8; color:inherit; border-radius:3px; padding:0 2px; }
.direct-app .direct-quote-add input[type=search],.direct-quote-add input[type=search] { flex:1 1 100%; width:auto; }
/* Team page */
.team-app { display:grid; gap:14px; max-width:980px; }
.team-status-line:empty { display:none; }
.team-add form { margin-top:12px; }
.team-access { grid-column:1/-1; display:grid; gap:8px; margin:4px 0; padding:12px 14px; border:1px solid var(--border); border-radius:10px; background:var(--raised); }
.team-access legend { padding:0 6px; font-weight:600; color:var(--text); }
.lead-form label.team-check,.team-check { display:flex; flex-direction:row; align-items:flex-start; gap:10px; font-size:.9rem; color:var(--text); cursor:pointer; }
.team-check input { width:18px; height:18px; min-height:0; margin:2px 0 0; accent-color:var(--accent); flex:none; }
.team-people { display:grid; gap:10px; }
.team-person { display:grid; gap:14px; padding:16px 18px; border:1px solid var(--border); border-radius:var(--radius-card); background:var(--surface); }
.team-person.is-off { opacity:.7; }
.team-person-top { display:flex; justify-content:space-between; gap:12px; align-items:flex-start; }
.team-person-top > div { display:grid; gap:4px; min-width:0; }
.team-person-sub { color:var(--muted); font-size:.8125rem; overflow-wrap:anywhere; }
.team-chips { display:flex; flex-wrap:wrap; gap:6px; margin:2px 0; }
.team-chip { padding:2px 9px; border-radius:999px; background:var(--raised); border:1px solid var(--border); font-size:.75rem; color:var(--body-text); }
.team-chip.is-owner { background:var(--accent-tint); border-color:transparent; color:var(--accent); font-weight:600; }
.team-chip.is-on { background:var(--success-tint); border-color:#abefc6; color:var(--green); font-weight:600; }
.team-chip.is-off { color:var(--muted); }
.team-chip.is-warn { background:var(--warning-tint); border-color:#fedf89; color:var(--amber); }
.team-actions { display:flex; flex-wrap:wrap; gap:8px; }
.team-password { display:grid; gap:6px; margin-top:12px; padding:14px; border:1px solid #abefc6; border-radius:10px; background:var(--success-tint); }
.team-password code { font-size:1.35rem; letter-spacing:.05em; color:var(--text); user-select:all; }
.team-password p { margin:0; }
.team-password button { justify-self:start; }
.team-log-bar { display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin-bottom:10px; }
.team-log-bar select { min-height:40px; padding:8px 10px; border:1px solid var(--border); border-radius:8px; font:inherit; background:var(--surface); }
.team-log-wrap { overflow-x:auto; border:1px solid var(--border); border-radius:var(--radius-card); background:var(--surface); }
.team-log { width:100%; border-collapse:collapse; font-size:.875rem; }
.team-log th,.team-log td { text-align:left; padding:9px 12px; border-bottom:1px solid #eef0f4; white-space:nowrap; }
.team-log th { color:var(--muted); font-weight:600; font-size:.8125rem; background:var(--raised); }
.team-log tr.is-failed td { color:var(--error); }
.choose-password { max-width:420px; margin:48px auto; padding:28px; border:1px solid var(--border); border-radius:16px; background:var(--surface); }
.choose-password h1 { margin:0 0 6px; }
/* Map / Satellite switch */
.sales-app .map-look-button { width:auto !important; padding:0 10px; font-family:inherit; font-weight:600; font-size:12px; line-height:29px; color:#1d2939; }
/* Viewing an employee's screen */
.view-bar { position:sticky; top:0; z-index:30; display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; padding:10px 20px; background:#fef0c7; border-bottom:1px solid #f5c64d; color:#4e3b05; }
.view-bar strong { display:block; font-size:14px; }
.view-bar span { font-size:13px; }
/* Phones (owner, 2026-10-03: "I can still move the page left and right", "buttons at bottom of the menu are hidden behind
   the browser's search bar"). The page never slides sideways; text boxes use 16px text so iPhones do not zoom in when one is
   tapped; the bottom menu and the page end stay above Safari's floating bar and the home line (viewport-fit=cover). */
html, body { max-width:100%; overflow-x:clip; }
@media (max-width:700px), (pointer:coarse) {
  input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=range]), select, textarea { font-size:16px !important; }
}
@media (max-width:700px) {
  .mobile-nav { padding-bottom:calc(7px + env(safe-area-inset-bottom)); padding-left:calc(6px + env(safe-area-inset-left)); padding-right:calc(6px + env(safe-area-inset-right)); }
  main { padding-bottom:calc(110px + env(safe-area-inset-bottom)); }
}