/* Shared visual rules. Keep state colours separate from titles and identity. */
:root{--ui-font:Lato,system-ui,-apple-system,sans-serif;--ui-title:28px;--ui-section:21px;--ui-card-title:18px;--ui-body:14px;--ui-small:12px;--ui-number:22px;--ui-radius:12px;--ui-gap:16px;--ui-heading:#333333;--ui-divider:#b9bcb9;--ui-counter-bg:#edf5f6;--ui-counter-border:#8eb8c2}
:is(.authenticated,.login-page){font-family:var(--ui-font);font-size:var(--ui-body);line-height:1.5}
:is(.authenticated,.login-page) :is(button,input,select,textarea){font-family:var(--ui-font)}
.authenticated main :is(h1,h2,h3,h4){color:var(--ui-heading);font-family:var(--ui-font);font-weight:700;line-height:1.3;overflow-wrap:anywhere}
.authenticated main h1{font-size:var(--ui-title);letter-spacing:-.5px;margin:0 0 14px}
.authenticated main h2{font-size:var(--ui-section)}
.authenticated main :is(h3,h4){font-size:var(--ui-card-title)}
.authenticated main :is(h1,h2,h3,h4)>a{font:inherit;color:inherit;text-decoration:none}
.authenticated main :is(h1,h2,h3,h4)>a:hover,.authenticated main :is(h1,h2,h3,h4)>a:focus-visible{text-decoration:underline;text-underline-offset:4px}
.authenticated main :is(.client-list>li>h2,.quotation-grid h2,.operational-card-grid h3,.commercial-task-grid h3,.dashboard-work-item h3,.dashboard-task h3,.planner-item h4,.measurement-work-card header h3,.billing-card-grid h4){font-size:var(--ui-card-title);font-weight:700;line-height:1.35;color:var(--ui-heading)}
.authenticated main .planner-section-heading h2{font-size:var(--ui-section)}
.authenticated main :is(.measurement-reference,.state-date,.today-label,.quote-card-dates dt){font-size:var(--ui-small)}
:is(.authenticated,.login-page) main :is(.panel,.dashboard-task,.measurement-work-card,.planner-queue){border-radius:var(--ui-radius)}
/* All operational counters use the same label/number arrangement. */
.authenticated main :is(.dashboard-totals,.planner-tags,.status-tags){display:flex;flex-direction:row;flex-wrap:wrap;align-items:stretch;justify-content:flex-start;gap:12px;margin:18px 0;min-width:0}
.authenticated main :is(.dashboard-totals>.panel,.planner-tag){display:inline-flex;flex-direction:row;align-items:center;justify-content:space-between;gap:14px;flex:0 1 auto;min-width:0;max-width:100%;min-height:54px;margin:0;padding:11px 16px;border:1px solid var(--ui-counter-border);border-radius:var(--ui-radius);background:var(--ui-counter-bg);color:var(--primary);text-decoration:none;font-size:var(--ui-body);box-shadow:none;overflow-wrap:normal;word-break:normal}
.authenticated main :is(.dashboard-totals>.panel,.planner-tag)>span{order:0;min-width:0;margin:0;font-size:var(--ui-body);font-weight:700;line-height:1.35;color:var(--primary);max-width:31ch}
.authenticated main :is(.dashboard-totals>.panel,.planner-tag)>strong{order:1;flex-shrink:0;display:inline-grid;place-items:center;min-width:30px;min-height:30px;height:auto;margin:0;padding:0 6px;border-radius:8px;background:#deedf0;color:var(--primary);font-size:var(--ui-number);font-weight:700;line-height:1.25;white-space:nowrap;font-variant-numeric:tabular-nums}
.authenticated main :is(.dashboard-totals>a.panel,.planner-tag[href]):hover,.authenticated main .planner-tag.is-active{border-color:var(--primary);background:#e3f0f2;color:var(--primary-hover)}
.authenticated main .dashboard-totals>.workshop-status{border-left:5px solid var(--stage-color)}
.authenticated main .workshop-summary .dashboard-totals{margin:0;align-content:start}
.authenticated main .primary-metrics>.panel{flex:0 1 auto}
.authenticated main .planner-reset{align-self:center;font-size:var(--ui-body)}
.authenticated main .group-count{display:inline-flex;padding:7px 10px;min-height:36px;align-items:center;border:1px solid var(--ui-counter-border);border-radius:9px;background:var(--ui-counter-bg);color:var(--primary);font-size:var(--ui-body);font-weight:700;text-decoration:none;white-space:normal}
/* Phase navigation has the same surfaces and number scale, with shorter labels. */
.authenticated main .pipeline{gap:10px;flex-wrap:wrap;overflow:visible}
.authenticated main .pipeline a{flex:1 1 120px;min-width:110px;border:1px solid var(--ui-counter-border);border-radius:var(--ui-radius);padding:10px 12px;background:var(--ui-counter-bg)}
.authenticated main .pipeline span{font-size:var(--ui-small);color:var(--primary);font-weight:700}
.authenticated main .pipeline strong{font-size:var(--ui-number);color:var(--primary);font-weight:700}
/* Strengthen the separation between dashboard jobs without using heavy black rules. */
.authenticated main .dashboard-group :is(.dashboard-work-item,.dashboard-task){border-top:2px solid var(--ui-divider);padding-top:16px;margin-top:14px}
.authenticated main .dashboard-group>header{border-bottom:1px solid var(--border);padding-bottom:12px;align-items:flex-start}
.authenticated main .dashboard-more{border-top:2px solid var(--ui-divider)}
.authenticated main :is(.quotation-grid,.operational-card-grid,.commercial-task-grid,.billing-card-grid,.planner-queues){gap:var(--ui-gap)}
.authenticated main :is(.work-badge,.planner-call-status){font-family:var(--ui-font);font-size:var(--ui-small);font-weight:700;line-height:1.35;padding:5px 9px;border-radius:8px}
:is(.authenticated,.login-page) main :is(button,.button-link){font-family:var(--ui-font);font-size:var(--ui-body);font-weight:700;border-radius:8px;min-height:44px;padding:10px 14px;line-height:1.35}
.authenticated main .button-link.secondary{background:#fff;color:var(--primary);border:1px solid #aebec0}
.authenticated main .button-link.secondary:hover{background:#edf5f6;color:var(--primary-hover)}
:is(.authenticated,.login-page) main :is(input,select,textarea){font-size:var(--ui-body);border-radius:8px}
:is(.authenticated,.login-page) main label{font-size:var(--ui-body);font-weight:700}
@media(max-width:700px){.authenticated main h1{font-size:26px}.authenticated main :is(.dashboard-totals,.planner-tags,.status-tags){gap:10px}.authenticated main :is(.dashboard-totals>.panel,.planner-tag){flex:1 1 220px}.authenticated main .pipeline a{flex:1 1 110px}.authenticated main .dashboard-group>header{flex-wrap:wrap}.authenticated main .primary-metrics>.panel{width:100%}.authenticated main .planner-week-links .button-link{font-size:12px;padding:9px}}
@media print{.authenticated main .dashboard-totals,.authenticated main .planner-tags{display:none}.authenticated main h1{font-size:24pt}.authenticated main h2{font-size:16pt}}

.authenticated main .dashboard-group :is(.dashboard-work-item,.dashboard-task){border-radius:0}

/* Selection is conveyed by aria-current; counter size and tone stay identical. */
.authenticated main .status-tag.is-active{background:var(--ui-counter-bg);border-color:var(--ui-counter-border);color:var(--primary)}
.authenticated main .status-tag.is-active:hover{background:#e3f0f2;border-color:var(--primary)}

.brand-home{display:block;border-radius:8px}.brand-home:focus-visible{outline:3px solid var(--surface);outline-offset:4px}
