/* plooqi application components; layout extensions to brand book v1.0. */
*{box-sizing:border-box}
html{font-size:16px}
body{font:400 var(--text-body)/1.5 var(--font-brand);color:var(--ink);background:var(--soft)}
a{color:var(--ink);text-underline-offset:.2em}
button,input,select,textarea{font:inherit}
main{max-width:var(--page-width);margin:var(--space-8) auto;padding:0 var(--space-8) var(--space-12);min-width:0}
h1,h2,h3{letter-spacing:-.02em;overflow-wrap:anywhere}
h1,.dashboard-hero h1{font-size:var(--h1);line-height:1.2;font-weight:800;margin:0 0 var(--space-2)}
h2{font-size:var(--h2);line-height:1.286;font-weight:700;margin:var(--space-8) 0 var(--space-4)}
h3{font-size:var(--h3);line-height:1.4;font-weight:700}
.lead{font-size:var(--text-body);color:var(--muted);max-width:75ch}
.label,.helptext,.object-meta{font-size:var(--text-compact);color:var(--muted)}
.eyebrow{color:var(--muted);font-size:var(--text-meta);font-weight:700}
.metric,.metric-small,.num,.recent-amount,.economics-number strong,.bar-track span{font-variant-numeric:tabular-nums}
.num{text-align:right;white-space:nowrap}
.metric{font-size:2rem;line-height:1.25;font-weight:800}
.cards,.split,.dashboard-kpis,.dashboard-main-grid,.dashboard-secondary-grid,.dashboard-bottom-grid{gap:var(--space-6)}
.card,.panel,.object-card,.dashboard-panel,.kpi-card,.chart-panel,.bar-chart,.filter-panel,.data-form,.search-form,.setup-summary,.setup-item,.report-details,.schedule-details{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-card);padding:var(--space-6)}
.panel{margin:var(--space-6) 0}
.card>h2:first-child,.panel>h2:first-child,.chart-panel>h2:first-child{margin-top:0}
.kpi-card,.dashboard-panel{box-shadow:var(--shadow-card)}
.dashboard-panel .section-heading h2{font-size:var(--h3);line-height:1.4}
.dashboard-hero{margin-bottom:var(--space-6)}
.dashboard-brand-mark{width:48px;height:48px;flex:none}
.kpi-card{align-items:flex-start;gap:var(--space-3)}
.kpi-card>div:last-child{min-width:0}
.kpi-card .metric{font-size:1.75rem;white-space:normal;overflow-wrap:anywhere}
.kpi-card.primary{background:var(--surface);color:var(--ink);border-color:var(--line);border-top:4px solid var(--turquoise)}
.kpi-card.primary .label,.kpi-card.primary .kpi-note{color:var(--muted)}
.kpi-icon,.kpi-card.primary .kpi-icon{background:var(--soft);color:var(--ink);border-radius:var(--radius-control)}
.kpi-icon img{width:24px;height:24px}
.kpi-note{font-size:var(--text-meta);line-height:1.4}
.quick-period,.button,button,button[type=submit],input[type=submit],input[type=button]{display:inline-flex;justify-content:center;align-items:center;gap:var(--space-2);min-height:44px;max-width:100%;padding:10px 20px;border:1px solid var(--ink);border-radius:var(--radius-control);background:var(--turquoise);color:var(--ink);font:700 1rem/1.25 var(--font-brand);text-decoration:none;cursor:pointer;white-space:normal;text-align:center;overflow-wrap:anywhere}
.button:hover,button:hover,button[type=submit]:hover{background:var(--plooqi-hover);color:var(--ink)}
.button:active,button:active{background:var(--plooqi-pressed)}
.button.secondary,button.secondary,.quick-period{background:var(--surface);color:var(--ink)}
.button.secondary:hover,button.secondary:hover,.quick-period:hover{background:var(--soft)}
.button.danger,button.danger{background:var(--plooqi-error);color:var(--surface);border-color:var(--plooqi-error)}
.button.danger:hover,button.danger:hover{background:var(--plooqi-error);text-decoration:underline}
.button.compact{font-size:var(--text-compact);padding:8px 12px;min-height:44px}
button:disabled,input:disabled,select:disabled,textarea:disabled{background:var(--line);color:var(--muted);cursor:not-allowed}
.quick-period{font-size:var(--text-compact);font-weight:600;padding:10px 12px}
.quick-period.active{background:var(--turquoise);border-color:var(--ink);color:var(--ink);box-shadow:inset 0 -2px var(--ink)}
.actions,.object-actions,.hero-actions,.toolbar,.filter-actions{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap}
.toolbar{margin:var(--space-4) 0}
.toolbar form{display:flex;align-items:end;gap:var(--space-3);flex-wrap:wrap}
.toolbar>label,.toolbar form>label{margin:0}
input:not([type=hidden]):not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]),select,textarea{display:block;width:100%;max-width:560px;min-width:0;min-height:44px;margin:var(--space-2) 0;padding:10px 12px;border:1px solid var(--plooqi-border);border-radius:var(--radius-control);background:var(--surface);color:var(--ink);font:inherit}
input[type=checkbox],input[type=radio]{width:20px;height:20px;accent-color:var(--ink);vertical-align:middle;margin:8px}
input[type=file]::file-selector-button{font:600 .875rem var(--font-brand);padding:8px 12px;border:1px solid var(--ink);border-radius:8px;background:var(--soft);color:var(--ink);margin-right:12px}
label{display:block;margin-bottom:var(--space-2);font-weight:600}
input[aria-invalid=true],select[aria-invalid=true],textarea[aria-invalid=true]{border:2px solid var(--plooqi-error)}
.errorlist{color:var(--plooqi-error);padding-left:var(--space-6)}
.helptext{display:block;font-size:var(--text-compact);line-height:1.45;overflow-wrap:anywhere}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
main:focus{outline:none}
.skip-link{position:absolute;top:8px;left:16px;transform:translateY(-160%);z-index:1000;padding:12px 20px;background:var(--surface);color:var(--ink);border-radius:var(--radius-control)}
.skip-link:focus{transform:none}
.table-wrap,.scroll{overflow:auto;max-width:100%;border:1px solid var(--line);border-radius:var(--radius-control);background:var(--surface)}
table{font-size:var(--text-compact);line-height:1.45;font-variant-numeric:tabular-nums}
th,td{padding:12px 16px;border-color:var(--line)}
th{background:var(--soft);color:var(--ink);font-size:var(--text-compact);font-weight:700}
tbody tr:hover{background:var(--soft)}
td a:not(.button){text-decoration:underline}
.badge,.status-chip,.demo-badge{font-size:var(--text-meta);line-height:1.4;padding:4px 8px;border-radius:999px;background:var(--soft);color:var(--muted)}
.badge.blocked,.badge.unresolved,.badge.conflict,.badge.canceled{background:var(--bad);color:var(--plooqi-error)}
.badge.ready,.badge.confirmed,.badge.valid,.badge.completed,.badge.verified,.badge.billable,.badge.invoiced{background:var(--good);color:var(--plooqi-success)}
.badge.planned{background:var(--turquoise);color:var(--ink)}
.alert,.message,.notice,.break-even-status{padding:var(--space-4);border-radius:var(--radius-control);margin:var(--space-4) 0;overflow-wrap:anywhere}
.info,.notice{background:var(--info-bg);border:1px solid var(--plooqi-border);color:var(--info-text)}
.alert-warning,.warning,.break-even-status.open{background:var(--warn);border:1px solid var(--plooqi-warning);color:var(--plooqi-warning)}
.error{background:var(--bad);border:1px solid var(--plooqi-error);color:var(--plooqi-error)}
.success,.break-even-status.reached{background:var(--good);border:1px solid var(--plooqi-success);color:var(--plooqi-success)}
.demo-notice{background:var(--soft);border-color:var(--plooqi-border)}
.status-good,.all-clear,.economics-number strong{color:var(--plooqi-success)}
.economics-number .negative-value{color:var(--plooqi-error)}
.attention-icon.warning,.attention-badge{background:var(--warn);color:var(--plooqi-warning)}
.attention-icon.blocked{background:var(--bad);color:var(--plooqi-error)}
.attention-list>a{gap:var(--space-3)}
.bar{background:var(--chart-revenue)}
.bar.cost,.legend.cost:before{background:var(--chart-cost)}
.bar.margin,.legend.margin:before{background:var(--chart-margin)}
.bar-track{height:30px;background:var(--soft);border-radius:4px}
.bar-track span{top:4px;color:var(--ink);background:var(--surface);padding:0 4px;border-radius:3px;text-shadow:none}
.revenue-line,.dashboard-chart-line{stroke:var(--chart-revenue)}
.cost-line{stroke:var(--chart-cost);stroke-dasharray:8 5}
.revenue-point,.dashboard-chart-point{fill:var(--chart-revenue)}
.cost-point{fill:var(--chart-cost)}
.legend.cost:before{border-bottom:2px dashed var(--chart-cost);height:0;background:none}
.chart-grid{stroke:var(--line)}
.dashboard-chart-area{fill:var(--soft)}
.mix-segment.base,.mix-dot.base,.customer-bar-track span{background:var(--chart-revenue)}
.mix-segment.laundry,.mix-dot.laundry{background:var(--chart-secondary)}
.mix-segment.other,.mix-dot.other{background:var(--plooqi-warning)}
.mix-segment.laundry{background:repeating-linear-gradient(135deg,var(--chart-secondary) 0 4px,var(--surface) 4px 6px)}
.cost-meter span{background:var(--chart-cost)}
.status-track .planned{background:var(--chart-revenue)}
.schedule-order{font-size:var(--text-compact);border-color:var(--ink);border-radius:var(--radius-control)}
.schedule-order.unstaffed,.schedule-legend .legend-open i{border-color:var(--plooqi-error)}
.schedule-day.today{border-color:var(--ink);box-shadow:inset 0 4px var(--turquoise)}
.schedule-day,.schedule-details{border-radius:var(--radius-card)}
.schedule-board-wrap{max-width:100%}
.rest-status.warning{border:0;background:var(--warn)}
.import-dropzone{border-color:var(--plooqi-border);border-radius:var(--radius-card);background:var(--soft)}
.import-dropzone.is-dragging,.import-dropzone:focus-within{background:var(--soft);border-color:var(--ink);outline:3px solid var(--ink);outline-offset:3px}
.import-file-status[data-error=true]{color:var(--plooqi-error)}
.imports-page .card{margin:var(--space-6) 0}
.imports-page input,.imports-page select,.imports-page textarea{max-width:100%}
.row-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}
pre,.mono{white-space:pre-wrap;overflow-wrap:anywhere}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:var(--space-6)}
.panel p,.panel li{overflow-wrap:anywhere}
.panel img{max-width:100%}
.review-context dl{grid-template-columns:minmax(120px,180px) minmax(0,1fr)}
.login-card{max-width:496px;padding:var(--space-8);margin:var(--space-12) auto;box-shadow:var(--shadow-card)}
.login-brand{padding:18px;margin:0 0 var(--space-3)}
.login-brand img{width:240px;max-width:100%;height:auto}
.login-claim{text-align:center;font-weight:700;margin:0 0 var(--space-8);color:var(--muted)}
.login-card h1{font-size:var(--h2)}
.login-card button[type=submit]{width:100%;margin-top:var(--space-3)}
.product-footer{max-width:var(--page-width);margin:0 auto;padding:var(--space-6) var(--space-8);border-top:1px solid var(--line);font-size:var(--text-meta);color:var(--muted)}
.workspace-top,.workspace-nav{max-width:var(--page-width);padding-left:var(--space-8);padding-right:var(--space-8)}
.workspace-top{padding-top:var(--space-3);padding-bottom:var(--space-3);gap:var(--space-6)}
.workspace-brand{padding:10px;letter-spacing:0}
.workspace-brand img{background:none;border-radius:0;padding:0;height:auto}
.workspace-brand .workspace-wordmark{display:block;width:132px;height:auto}
.workspace-brand .workspace-appmark{display:none;width:32px;height:32px}
.workspace-company{padding-left:var(--space-6);border-color:var(--plooqi-border)}
.workspace-caption{color:var(--line);font-size:var(--text-meta);letter-spacing:0;text-transform:none}
.workspace-avatar,.workspace-environment{border-color:var(--plooqi-border);color:var(--line)}
.workspace-environment{border-radius:999px}
.workspace-popover>summary{min-height:44px;font-size:var(--text-compact)}
.workspace-nav{gap:var(--space-6)}
.workspace-nav-link,.workspace-nav-group>summary{font-size:var(--text-compact);padding:0 var(--space-3)}
.workspace-nav-link.is-active,.workspace-nav-group.is-active>summary,.workspace-nav-group[open]>summary{background:var(--turquoise);border-bottom-color:var(--ink);color:var(--ink)}
.workspace-nav-link:hover,.workspace-nav-group>summary:hover{background:var(--soft);color:var(--ink)}
.workspace-panel{border:1px solid var(--plooqi-border);border-radius:var(--radius-card);box-shadow:var(--shadow-menu);padding:var(--space-3)}
.workspace-panel a{min-height:44px;display:flex;align-items:center;font-size:var(--text-compact);border-radius:var(--radius-control)}
.workspace-panel a:hover,.workspace-panel a:focus-visible,.workspace-panel a[aria-current]{background:var(--soft);color:var(--ink)}
.workspace-panel a[aria-current]{box-shadow:inset 3px 0 var(--ink);font-weight:700}
.workspace-menu-group h2{font:700 var(--text-meta)/1.4 var(--font-brand);color:var(--muted);letter-spacing:.04em}
.workspace-header a:focus-visible,.workspace-header summary:focus-visible,.workspace-header button:focus-visible{outline:3px solid var(--surface);outline-offset:3px}
.workspace-navigation a:focus-visible,.workspace-navigation summary:focus-visible,.workspace-panel a:focus-visible,.workspace-panel button:focus-visible{outline-color:var(--ink)}
.workspace-header button.workspace-logout{min-height:44px;color:var(--plooqi-error)}
.workspace-mega{gap:var(--space-4);padding:var(--space-4)}
@media(prefers-reduced-motion:no-preference){button,.button,.quick-period{transition:background-color 120ms ease-out}}
@media(max-width:1023px){main{padding-left:var(--space-6);padding-right:var(--space-6)}.workspace-top,.workspace-nav{padding-left:var(--space-6);padding-right:var(--space-6)}.workspace-nav{gap:var(--space-2)}}
@media(max-width:767px){
 main{padding:0 var(--space-4) var(--space-8);margin-top:var(--space-6)}
 h1,.dashboard-hero h1{font-size:2rem;line-height:1.25}
 .card,.panel,.dashboard-panel,.kpi-card,.filter-panel,.data-form{padding:var(--space-4)}
 .cards,.split,.dashboard-kpis,.dashboard-main-grid,.dashboard-secondary-grid,.dashboard-bottom-grid{gap:var(--space-4)}
 .section-heading,.report-period,.row-head{align-items:flex-start;flex-wrap:wrap}
 .workspace-top{gap:var(--space-3);padding:var(--space-3) var(--space-4)}
 .workspace-brand{padding:8px}.workspace-brand .workspace-wordmark{display:none}.workspace-brand .workspace-appmark{display:block}
 .workspace-company{padding-left:var(--space-3)}.workspace-caption{font-size:10px}
 .product-footer{padding:var(--space-6) var(--space-4)}
 .login-card{margin:var(--space-6) auto;padding:var(--space-6)}
 .review-context dl{grid-template-columns:1fr;gap:4px}.review-context dd{margin-bottom:12px}
 .economics-number{flex-wrap:wrap}.economics-split{grid-template-columns:1fr}
 .filter-actions{flex-wrap:wrap}
}
@media(max-width:620px){
 .workspace-nav{padding:var(--space-2) var(--space-4)}
 .workspace-nav-group .workspace-panel{border-color:var(--plooqi-border);border-radius:0}
 .workspace-nav-link,.workspace-nav-group>summary{min-height:44px;border-radius:var(--radius-control)}
 .workspace-mobile-toggle{min-height:44px;color:var(--ink)}
 .workspace-mobile-toggle:focus-visible{outline:3px solid var(--ink);outline-offset:-5px}
 .workspace-company .workspace-panel{top:90px}
 .schedule-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:400px){
 .workspace-top{flex-wrap:wrap}.workspace-company{flex:1}
 .workspace-tools{width:100%;justify-content:flex-end;margin:0}
 .workspace-tools summary{font-size:var(--text-compact)}
 .workspace-company .workspace-panel{top:144px}
 .dashboard-title{gap:var(--space-3)}.dashboard-brand-mark{display:none}
 .cards,.split,.filter-panel,.dashboard-kpis,.schedule-kpis{grid-template-columns:1fr}
 .recent-orders>a{grid-template-columns:36px minmax(0,1fr)}.recent-amount{grid-column:2}
 .login-brand{padding:18px 0}.login-brand img{width:200px}
}


.error-page{max-width:760px;margin:48px auto}
.muted{color:var(--muted)}
.links{display:flex;gap:16px;flex-wrap:wrap}
input:user-invalid,select:user-invalid,textarea:user-invalid{border:2px solid var(--plooqi-error)}
.workspace-top .workspace-panel input:focus-visible,.workspace-top .workspace-panel select:focus-visible{outline-color:var(--ink)}

/* Friendly product colors: saturated accents, neutral reading surfaces. */
.dashboard-kpis .kpi-card {
 --kpi-background: var(--turquoise);
 --kpi-foreground: var(--ink);
 background:var(--kpi-background);color:var(--kpi-foreground);
 border:1px solid var(--kpi-background);box-shadow:none;
}
.dashboard-kpis .kpi-card:nth-child(2){--kpi-background:var(--accent-blue);--kpi-foreground:var(--surface)}
.dashboard-kpis .kpi-card:nth-child(3){--kpi-background:var(--accent-violet);--kpi-foreground:var(--surface)}
.dashboard-kpis .kpi-card:nth-child(4){--kpi-background:var(--accent-pink)}
.dashboard-kpis .kpi-card .label,.dashboard-kpis .kpi-card .kpi-note{color:var(--kpi-foreground)}
.dashboard-kpis .kpi-icon{background:var(--surface);color:var(--ink)}
.dashboard-panel{border-top:4px solid var(--turquoise)}
.dashboard-chart-panel{border-top-color:var(--accent-blue)}
.dashboard-main-grid>.dashboard-panel:nth-child(2){border-top-color:var(--accent-yellow)}
.dashboard-secondary-grid>.dashboard-panel:first-child{border-top-color:var(--accent-violet)}
.dashboard-secondary-grid>.economics-panel{border-top-color:var(--accent-orange)}
.dashboard-bottom-grid>.dashboard-panel:first-child{border-top-color:var(--accent-pink)}
.dashboard-bottom-grid>.recent-panel{border-top-color:var(--accent-blue)}
.dashboard-chart-area{fill:none}
.mix-segment.base,.mix-dot.base{background:var(--turquoise)}
.mix-segment.laundry,.mix-dot.laundry{background:var(--accent-violet)}
.mix-segment.laundry{background:repeating-linear-gradient(135deg,var(--accent-violet) 0 6px,var(--surface) 6px 8px)}
.mix-segment.other,.mix-dot.other{background:var(--accent-pink)}
.customer-bar-track span{background:var(--accent-blue)}
.customer-bar-row:nth-child(3n+2) .customer-bar-track span{background:var(--accent-violet)}
.customer-bar-row:nth-child(3n) .customer-bar-track span{background:var(--accent-pink)}
.status-track span{background:var(--accent-blue)}
.status-track .planned{background:var(--accent-violet)}
.status-track .in_progress{background:var(--accent-orange)}
.status-track .completed,.status-track .billable{background:var(--accent-green)}
.status-track .invoiced{background:var(--turquoise)}
.status-track .canceled{background:var(--accent-red)}
.legend:not(.cost):not(.margin):before{background:var(--chart-revenue)}

/* Color is reinforced by existing labels, icons and chart patterns. */
.alert-warning,.warning,.break-even-status.open,
.attention-icon.warning,.attention-badge,.rest-status.warning{
 background:var(--warn);color:var(--ink);border-color:var(--ink);
}
.success,.break-even-status.reached,.all-clear,.attention-icon.ready,.attention-badge.clear,
.badge.ready,.badge.confirmed,.badge.valid,.badge.completed,.badge.verified,.badge.billable,.badge.invoiced,
.setup-item.complete .setup-state{
 background:var(--good);color:var(--ink);border-color:var(--ink);
}
.error,.attention-icon.blocked,.badge.blocked,.badge.unresolved,.badge.conflict,.badge.canceled{
 background:var(--bad);color:var(--surface);border-color:var(--bad);
}
.error a,.error strong{color:inherit}
.status-good,.economics-number strong{color:var(--accent-green)}
.economics-number .negative-value,.errorlist,.import-file-status[data-error=true]{color:var(--accent-red)}
.setup-item.open{border-left-color:var(--accent-yellow)}
.setup-item.complete{border-left-color:var(--accent-lime)}
.progress-value{background:var(--accent-green)}
input[aria-invalid=true],select[aria-invalid=true],textarea[aria-invalid=true],
input:user-invalid,select:user-invalid,textarea:user-invalid{border-color:var(--accent-red)}
.schedule-legend .legend-conflict i,.schedule-order.conflicted{border-color:var(--ink)}
.schedule-order.conflicted .order-time,.schedule-order.conflicted .order-meta,
.schedule-order.conflicted .order-team,.schedule-order.conflicted .order-forecast,.conflict-note{color:var(--ink)}
.matrix-cell.conflict{box-shadow:inset 3px 0 var(--ink)}
.schedule-legend .legend-open i{background:var(--accent-red);border-color:var(--accent-red)}
.schedule-order.unstaffed{background:var(--surface);border-color:var(--accent-red)}
.schedule-order.unstaffed .order-time{color:var(--accent-red)}
.schedule-order.unstaffed.conflicted{background:var(--warn);border-color:var(--ink)}
.schedule-order.unstaffed.conflicted .order-time{color:var(--ink)}


/* Shared color language for all work areas, including the integrated V2 views. */
main h1::after{content:"";display:block;width:72px;height:5px;margin:12px 0 16px;border-radius:999px;background:var(--accent-pink)}
main :is(.card,.panel,.object-card,.chart-panel,.bar-chart,.setup-summary,.report-details,.schedule-details){border-top:4px solid var(--turquoise)}
:is(.cards,.grid,.split) > :is(.card,.panel):nth-child(4n+2){border-top-color:var(--accent-blue)}
:is(.cards,.grid,.split) > :is(.card,.panel):nth-child(4n+3){border-top-color:var(--accent-violet)}
:is(.cards,.grid,.split) > :is(.card,.panel):nth-child(4n){border-top-color:var(--accent-pink)}
main .object-card:nth-of-type(3n+2){border-top-color:var(--accent-blue)}
main .object-card:nth-of-type(3n){border-top-color:var(--accent-violet)}
main :is(.filter-panel,.data-form,.search-form){border-top:4px solid var(--accent-blue)}
main .chart-panel{border-top-color:var(--accent-violet)}
main table th{border-bottom:3px solid var(--turquoise)}
main :is(.info,.notice){background:var(--surface);border-left:4px solid var(--accent-blue);color:var(--ink)}

/* Fill only summary tiles; forms, record cards and tables keep reading surfaces. */
:is(.cards > .card,.grid > .panel):has(> :is(.metric,.metric-small)){
 --summary-background:var(--turquoise);--summary-foreground:var(--ink);
 min-width:0;background:var(--summary-background);color:var(--summary-foreground);
 border-color:var(--summary-background);box-shadow:none;overflow-wrap:anywhere;
}
:is(.cards > .card,.grid > .panel):has(> :is(.metric,.metric-small)):nth-child(4n+2){--summary-background:var(--accent-blue);--summary-foreground:var(--surface)}
:is(.cards > .card,.grid > .panel):has(> :is(.metric,.metric-small)):nth-child(4n+3){--summary-background:var(--accent-violet);--summary-foreground:var(--surface)}
:is(.cards > .card,.grid > .panel):has(> :is(.metric,.metric-small)):nth-child(4n){--summary-background:var(--accent-pink)}
:is(.cards > .card,.grid > .panel):has(> :is(.metric,.metric-small)) :is(.label,.metric,.metric-small,.muted,small){color:var(--summary-foreground)}
:is(.cards > .card,.grid > .panel):has(> :is(.metric,.metric-small)) a:not(.button){color:var(--summary-foreground);text-decoration:underline}
:is(.cards > .card,.grid > .panel) > :is(.metric,.metric-small){white-space:normal;overflow-wrap:anywhere}
/* Planning warnings keep their semantic color and explicit label. */
.cards.schedule-kpis > .card.attention:has(> .metric){--summary-background:var(--accent-yellow);--summary-foreground:var(--ink);border-color:var(--ink)}

/* Compact planning board: a bounded two-axis scroll surface with fixed day headings. */
.planning-filters{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px}
.planning-options .panel{padding:16px}.planning-options input[type=checkbox]{display:inline-block}
.planning-legend{display:flex;flex-wrap:wrap;gap:12px;margin:16px 0;font-size:.875rem}
.planning-scroll{overflow:auto;max-height:72vh;min-height:280px;border:1px solid var(--line);border-radius:16px;background:white;overscroll-behavior:contain}
.planning-columns{display:flex;align-items:stretch;min-width:100%;width:max-content}
.planning-day{width:240px;flex:0 0 240px;border-right:1px solid var(--line);padding:0 10px 16px}
.planning-day>h2{position:sticky;top:0;z-index:1;background:var(--ink);color:white;margin:0 -10px 12px;padding:12px;font-size:1rem;line-height:1.5}
.planning-day>h2 strong,.planning-day>h2 small{display:block}.planning-day>h2 small{font-size:.75rem;font-weight:400}
.planning-day.is-today>h2{background:var(--turquoise);color:var(--ink)}
.planning-group{font-size:.875rem;margin:16px 0 8px}
.planning-order{border-left:4px solid var(--order-color);border-bottom:1px solid var(--line);padding:10px 8px;margin:0 0 8px;overflow-wrap:anywhere}
.planning-order small{display:block;font-size:.8rem;margin-top:5px}.planning-order.is-change{border-left-color:var(--accent-red)}
.planning-order.is-change>a,.planning-change{color:var(--accent-red);font-weight:700}.planning-change{display:inline-block;font-size:.8rem}
.planning-warning{background:var(--accent-yellow);color:var(--ink);padding:5px;border-radius:4px}
.planning-detail{margin:0 0 0 auto;height:100%;max-height:100%;width:min(520px,100%);max-width:100%;padding:24px;border:0;border-left:5px solid var(--turquoise);color:var(--ink)}
.planning-detail::backdrop{background:rgb(16 42 67 / .45)}.planning-detail dt{font-weight:700}.planning-detail dd{margin:0 0 16px;overflow-wrap:anywhere}
@media(max-width:620px){.planning-filters{grid-template-columns:1fr 1fr}.planning-day{width:260px;flex-basis:260px}.planning-scroll{max-height:75vh}}
