:root{--ink:#111111;--muted:#85827f;--paper:#f7f6f4;--line:#e8e5e2;--green:#111;--lime:#ff0000;--white:#fff;--amber:#90642b}
body{font-family:'DM Sans',Arial,sans-serif;background:var(--paper)}
aside{background:#fff;color:#111;width:250px;padding:28px 24px;border-right:1px solid #f0eeeb}
.brand{height:140px;margin:0 0 18px;background:url('brand-logo.png') no-repeat left top;background-size:213px auto;font-size:0;letter-spacing:0}.brand span{display:none}
.workspace{color:#999;font-size:10px;letter-spacing:1.5px;margin:14px 18px 20px}
nav{gap:9px}nav button{color:#92908d;border-radius:40px;padding:17px 18px;gap:14px}nav button span{color:#64615e;font-size:14px}nav button.active{background:#111;color:#aaa}nav button.active span{color:white;font-weight:500}nav button:hover:not(.active){background:#f4f2ef}
.sidefoot{color:#777;line-height:1.8;margin-left:14px}.sidefoot p{color:#96918e}.live{background:#ff0000}
main{margin-left:250px;padding:43px 42px 25px}.eyebrow{color:#8c8883;font-weight:500;letter-spacing:1px}h1{font-family:'DM Sans',Arial,sans-serif;font-size:46px;font-weight:800;letter-spacing:-2px;line-height:1.12;margin:17px 0 14px}header p{font-size:15px;color:#85817d}header{margin-bottom:25px}
.outline{background:#fff;border:1px solid #e5e2de;border-radius:28px;padding:12px 18px;color:#171717;font-size:12px}.outline:hover{background:#efedeb}
.filters{border:0;border-radius:22px;padding:19px 22px;gap:18px}.filters label{color:#85817d;font-size:11px}.filters select,.filters input{background:#f7f6f4;border-radius:9px;padding:12px;color:#171717}.coverage{color:#8a8581;font-size:11px;margin:18px 2px 25px}
.cards{gap:18px;margin-bottom:26px}.card,.card:first-child{background:#fff;border:0;border-radius:25px;color:#111;padding:26px}.card:first-child{box-shadow:inset 0 -3px 0 #ff0000}.card .label,.card:first-child .label{color:#8a8581;font-size:10px;letter-spacing:.6px}.card strong{font-family:'DM Sans',Arial,sans-serif;font-size:32px;letter-spacing:-1.2px;font-weight:700;margin:14px 0}.card small,.card:first-child small{color:#8a8581;font-size:10px}
.panel{border:0;border-radius:25px;padding:27px}.panelhead{margin-bottom:25px}h2{font-family:'DM Sans',Arial,sans-serif;font-size:21px;font-weight:700;letter-spacing:-.7px}h3{font-weight:700}.tag{background:#f0eeeb;color:#827c76;padding:6px 10px}.sub{color:#8b8580}.rankrow{padding:11px 0;background:white}.rankrow:hover{background:#faf8f6}.rankno{color:#a19b94}.rankrow .bar,.rankrow:nth-child(-n+3) .bar{background:#111}.rankrow:first-child .bar{background:#ff0000}.track{background:#efedeb;height:7px}.rankrow .amount{font-weight:600}.month i,.month:nth-child(even) i{background:#d5d0cb}.month:nth-child(6) i{background:#ff0000}.chart{border-color:#e9e5e1}.yearcard{border-color:#e9e5e1}.yearcard strong{font-weight:600}
th{color:#8d8782;font-size:11px;background:#faf9f7}td{border-color:#f0ece8}tbody tr:hover{background:#faf9f7}.status{background:#e8f0e5;color:#537449;border-radius:9px;padding:6px 9px}.status.pending{background:#f7eddf;color:#9a6b35}.notice{background:#fff;border:0;border-left:3px solid #ff0000;border-radius:0 18px 18px 0;color:#6b625b;padding:18px 20px}.notice strong{color:#111}.link{color:#111}.note{border-color:#e9e5e1}dialog{border-radius:25px;padding:32px}dialog::backdrop{background:#1118}.dialoghead h2{font-weight:700}.dialoghead button{background:#f1eeea;color:#111}footer{color:#9a948d}:focus-visible{outline-color:#ff0000}
@media(max-width:1100px){aside{width:215px;padding:25px 17px}.brand{background-size:180px auto;height:120px}main{margin-left:215px;padding:32px 25px}h1{font-size:39px}.cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){aside{width:auto;padding:18px 16px;position:static;border-bottom:1px solid #eee}.brand{background-size:150px auto;height:95px;margin-bottom:0}.workspace,.sidefoot{display:none}nav{gap:4px;margin-top:8px}nav button{padding:11px 13px}nav button span{font-size:11px}main{margin-left:0;padding:25px 16px}h1{font-size:32px}.card,.card:first-child{padding:21px 17px;border-radius:20px}.card strong{font-size:26px}.panel{padding:20px 17px;border-radius:20px}.filters{padding:17px}header{margin-bottom:12px}.rankrow{font-size:10px}}

.brand{background-size:100% auto}.rankrow:nth-child(2) .bar{background:#ff0000}

.filters{flex-wrap:wrap}.filters .search{min-width:200px}.filters select{max-width:240px}

.role-label{display:block;font-size:12px;font-weight:400;color:#777;margin-top:4px}.category-layout{display:grid;grid-template-columns:minmax(200px,300px) 1fr;gap:32px;align-items:center}.category-layout svg{width:100%;max-height:300px}.category-layout g{cursor:pointer;stroke:white;stroke-width:2}.category-layout g:hover,.category-layout g:focus{opacity:.7;outline:none;stroke:#111;stroke-width:3}.category-legend button{display:grid;grid-template-columns:12px 1fr 60px 100px;gap:12px;width:100%;padding:9px 4px;text-align:left;background:none;border:0;border-bottom:1px solid #eee;cursor:pointer}.category-legend i{height:12px;width:12px;border-radius:50%;margin-top:4px}.category-legend button:hover{background:#f4f2f0}.category-contractors button{display:flex;justify-content:space-between;width:100%;padding:14px;background:none;border:0;border-bottom:1px solid #eee;text-align:left;cursor:pointer}@media(max-width:700px){.category-layout{grid-template-columns:1fr}.category-legend button{grid-template-columns:12px 1fr 50px 85px;font-size:12px}}

.month[role="button"]{cursor:pointer}.month[role="button"]:hover i{background:#ff0000}.month[role="button"]:focus-visible{outline:2px solid #111;outline-offset:4px}

[hidden]{display:none!important}

.account-bar{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px 0;border-bottom:1px solid #ddd;margin-bottom:28px}.account-bar strong,.account-bar span{display:block}.account-bar span{font-size:12px;color:#777;margin-top:5px}.account-actions{display:flex;gap:10px;flex-shrink:0}.logout-button{background:#111;color:white;border:0;border-radius:30px;padding:12px 24px;cursor:pointer;font:inherit}.logout-button:hover{background:#e00}@media(max-width:700px){.account-bar{align-items:flex-start;flex-direction:column}.account-bar strong{font-size:14px}}

.account-actions{flex-wrap:wrap}.access-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 0;border-bottom:1px solid #eee}#invite-form{display:flex;gap:16px;align-items:end;flex-wrap:wrap}#invite-email{display:block;padding:12px;margin-top:8px;border:1px solid #ccc;border-radius:8px}

aside{display:flex;flex-direction:column;height:100dvh;overflow-y:auto}nav{display:flex;flex-direction:column}#contractor-nav{display:flex;flex-direction:column;margin:0 0 16px 12px;border-left:1px solid #eee;padding-left:8px}#contractor-nav button{padding:12px 16px}#contractor-nav button span{font-size:13px}.sidebar-settings{margin-top:auto;padding-top:32px}.sidebar-settings button{width:100%;text-align:left;border:0}.settings-actions{display:flex;gap:12px;flex-wrap:wrap}#settings-dialog{max-width:560px;width:90%}#sync-status{line-height:1.6;color:#777}.coverage:empty,#subtitle:empty{display:none}@media(max-width:700px){aside{height:auto}.sidebar-settings{padding-top:16px}#contractor-nav{display:flex;flex-wrap:wrap}nav{display:flex;flex-direction:column}}
/* Calm navigation hierarchy and spaced account dialogs. */
aside .brand{flex-shrink:0;margin-bottom:24px}nav{gap:6px;overflow:visible}nav>button{min-height:46px;padding:12px 16px;border-radius:12px}nav>button span{font-size:14px;font-weight:600}#contractor-section.active{background:transparent;color:#111}#contractor-section.active span{color:#111;font-weight:700}#contractor-section::after{content:'⌄';margin-left:auto;color:#8a8581}#contractor-section[aria-expanded=false]::after{content:'›'}#contractor-nav{gap:3px;margin:0 0 16px 16px;padding:0 0 0 12px;border-left:1px solid #e8e5e2}#contractor-nav button{min-height:39px;padding:10px 12px;border-radius:8px;background:transparent}#contractor-nav button span{font-size:13px;font-weight:400;color:#777}#contractor-nav button.active{background:#f0eeeb;box-shadow:inset 2px 0 #111}#contractor-nav button.active span{color:#111;font-weight:600}#contractor-nav button:hover:not(.active){background:#f8f7f5}nav>button.active:not(#contractor-section){background:#111}.sidebar-settings{padding-top:24px}.sidebar-settings button{border-top:1px solid #eee;border-radius:0;padding:18px 12px;color:#777}
#settings-dialog,#access-dialog{width:min(520px,calc(100vw - 32px));padding:28px;border-radius:20px;max-height:calc(100dvh - 40px);overflow:auto}#settings-dialog .dialoghead,#access-dialog .dialoghead{align-items:center;margin-bottom:24px;gap:20px}.dialoghead h2{font-size:26px;margin:0}.dialoghead button{width:32px;height:32px;min-width:32px;display:grid;place-items:center;font-size:22px;line-height:1;border-radius:8px;background:transparent;color:#777}.dialoghead button:hover{background:#f3f1ee;color:#111}#account-email{font-size:14px;color:#777;overflow-wrap:anywhere;margin:0 0 22px}.settings-actions{display:grid;grid-template-columns:1fr;gap:10px;margin-bottom:28px}.settings-actions button{text-align:left;border-radius:10px;padding:13px 16px;font-size:14px;min-height:44px}.settings-actions .logout-button{background:#fff;border:1px solid #e5e2de;color:#555}.settings-actions .logout-button:hover{background:#f5f3f0}#settings-dialog h3{border-top:1px solid #e8e5e2;padding-top:24px;margin:0 0 10px;font-size:14px}#sync-status{font-size:13px;line-height:1.7;margin:0;color:#888}#account-message:empty{display:none}:focus-visible{outline:2px solid #777;outline-offset:3px}#invite-form{display:grid;grid-template-columns:1fr;gap:14px;margin:24px 0}#invite-email{width:100%;box-sizing:border-box}#access-list .access-row{flex-wrap:wrap;font-size:13px;overflow-wrap:anywhere}#access-dialog>p{line-height:1.6;color:#777;font-size:13px}@media(max-width:700px){nav button{white-space:normal}#contractor-nav{flex-wrap:nowrap}#settings-dialog,#access-dialog{padding:22px}}

.supplier-filter{display:grid;gap:7px}.supplier-filter>span{font-size:11px;color:#85817d}.supplier-filter button{min-width:170px;text-align:left;border-radius:9px;background:#f7f6f4;border:0}#supplier-dialog{width:min(520px,calc(100vw - 32px));padding:28px;border-radius:20px}#supplier-search{width:100%;padding:13px 15px;border:1px solid #e5e2de;border-radius:10px;font:inherit}.supplier-tools{display:flex;align-items:center;gap:20px;padding:18px 0;font-size:13px}.supplier-tools span{margin-left:auto;color:#888}#supplier-list{max-height:45vh;overflow:auto;border-top:1px solid #eee;border-bottom:1px solid #eee}.supplier-row{display:flex;gap:14px;align-items:center;padding:14px 8px;cursor:pointer;border-bottom:1px solid #f3f1ee}.supplier-row:hover{background:#faf9f7}.supplier-row input{width:17px;height:17px;accent-color:#111;flex-shrink:0}.supplier-row small{display:block;color:#888;margin-top:4px;font-size:12px}.supplier-footer{display:flex;justify-content:flex-end;gap:12px;padding-top:20px}

.year-toolbar{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin:0 0 24px}.year-toolbar>div{margin-right:auto}.year-toolbar a{color:#555;font-size:14px}.year-toolbar button{padding:12px 24px;border-radius:24px}.year-toolbar .solid{background:#111;color:white;border:1px solid #111}.year-basis{margin:12px 0 24px;color:#666}.year-insights{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}.year-insights h3{font-size:20px;line-height:1.4}.year-insights p{color:#666;line-height:1.65}@media(max-width:850px){.year-insights{grid-template-columns:1fr}}

.client-revenue-total{display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin:16px 0 28px}.client-revenue-total strong{font-size:32px}.client-revenue-total span{color:#777}.client-project{border:1px solid #e7e5e2;border-radius:16px;margin:14px 0;overflow:hidden}.client-project summary{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px;cursor:pointer;list-style:none}.client-project summary:before{content:'+';font-size:24px}.client-project[open] summary:before{content:'−'}.client-project summary>span{flex:1}.client-project summary small{display:block;color:#777;margin-top:6px}.client-project summary>strong{white-space:nowrap}.project-revenue-body{padding:0 22px 22px}.project-revenue-body a{display:inline-block;margin-top:18px;color:#555}.client-project summary:hover{background:#f8f7f5}.client-project summary:focus-visible{outline:2px solid #777;outline-offset:-3px}

.margin-badge{display:inline-block;padding:7px 11px;border-radius:9px;font-weight:700;font-size:14px}.margin-badge.low{color:#a52b27;background:#fceceb}.margin-badge.mid{color:#865b12;background:#fff3d9}.margin-badge.good{color:#256342;background:#e6f3e9}.profit-months{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}.profit-month{padding:18px;border:1px solid #e9e6e2;border-radius:16px}.profit-month small{display:block;color:#888;font-size:12px;margin:5px 0 15px}.profit-month>strong{display:block;margin-top:16px;font-size:22px}.mix-bar{height:30px;display:flex;border-radius:9px;overflow:hidden;margin:28px 0}.mix-detail{border-bottom:1px solid #eee;padding:16px 0}.mix-detail summary{display:flex;align-items:center;gap:10px;cursor:pointer}.mix-detail summary i{height:10px;width:10px;border-radius:50%;flex-shrink:0}.mix-detail summary span{margin-left:auto;color:#666}.mix-project{display:flex;justify-content:space-between;gap:16px;font-size:13px;padding:14px 0 0 20px}.mix-project b{white-space:nowrap}.cost-share{display:flex;gap:15px;align-items:center;margin:22px 0}.cost-share strong{margin-left:auto}.cost-share span{width:100px;text-align:right;color:#777}.cost-averages{border-top:1px solid #eee;padding-top:15px;margin-top:25px}.cost-averages p{display:flex;justify-content:space-between;gap:16px}.revenue-columns{display:grid;grid-template-columns:repeat(12,minmax(60px,1fr));align-items:end;gap:16px;overflow-x:auto;padding:20px 0}.revenue-column{text-align:center}.revenue-column>span{font-size:12px;color:#777}.revenue-column>div{background:#191919;border-radius:7px 7px 0 0;margin-top:12px}.revenue-column>div.forecast{background:repeating-linear-gradient(135deg,#e3dfda,#e3dfda 5px,#f4f2ee 5px,#f4f2ee 10px);border:1px solid #c9c4be}.revenue-column b,.revenue-column small{display:block;margin-top:9px}.revenue-column small{font-size:11px;color:#888}.panel>summary{cursor:pointer}.panel>summary h2{display:inline-block}@media(max-width:1000px){.profit-months{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:560px){.profit-months{grid-template-columns:repeat(2,minmax(0,1fr))}.mix-detail summary{flex-wrap:wrap}}

.client-rank-bars button{display:flex;width:100%;position:relative;text-align:left;justify-content:space-between;gap:20px;padding:18px 0 22px;margin:10px 0;background:none;border:0;font:inherit;cursor:pointer}.client-rank-bars button i{position:absolute;bottom:0;left:0;height:6px;background:#ff0000;border-radius:3px}.client-rank-bars button:hover{color:#c00}nav>[data-view="yearly"],nav>[data-view="sales"]{margin:6px 0 12px}

/* Chart labels communicate meaning independently of color. */
.mix-bar:has(.labeled-segment){height:auto;min-height:76px}.labeled-segment{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;color:#fff;padding:14px 6px;text-align:center;min-width:0;font-size:14px;line-height:1.3}.labeled-segment.light{color:#171717}.labeled-segment>b{font-size:15px}.labeled-segment>span{font-weight:600}.chart-description{font-size:14px;color:#666;line-height:1.6;margin:10px 0 18px}.chart-key{display:flex;flex-wrap:wrap;gap:16px 26px;margin:16px 0;font-size:14px;color:#555}.chart-key>span{display:flex;align-items:center;gap:9px}.chart-key i{display:inline-block;width:18px;height:18px;border:1px solid #bbb;border-radius:3px;flex-shrink:0}.key-solid{background:#171717}.key-striped{background:repeating-linear-gradient(135deg,#ccc,#ccc 4px,#faf9f7 4px,#faf9f7 8px)}.mix-detail summary:after{content:'+';font-size:20px;margin-left:12px}.mix-detail[open] summary:after{content:'−'}.expand-cue{font-style:normal;font-size:12px;color:#666}.margin-badge small,.profit-month .margin-badge small{display:block;font-size:10px;font-weight:500;color:inherit;margin:5px 0 0;letter-spacing:0}.card:first-child{box-shadow:none!important}.rankrow .bar,.rankrow:first-child .bar,.rankrow:nth-child(2) .bar{background:#111}.month i,.month:nth-child(even) i,.month:nth-child(6) i{background:#777}.month[role="button"]:hover i{background:#111}@media(max-width:600px){.labeled-segment,.labeled-segment>b{font-size:12px}.expand-cue{display:none}.chart-key{font-size:12px}.profit-month .margin-badge{font-size:13px}}

.client-year-picker{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin:32px 0 12px}.client-year-picker>div{display:flex;gap:8px;flex-wrap:wrap}.client-year-picker button{border-radius:24px;padding:10px 18px}.client-year-picker .solid{background:#111;color:#fff;border:1px solid #111}.client-year{margin:28px 0}.client-year>h3{font-size:20px}

.labeled-segment{border:0;font-family:inherit;cursor:pointer}.labeled-segment:hover{filter:brightness(.88)}.labeled-segment:focus-visible{outline:3px solid #777;outline-offset:-3px}.revenue-column{background:none;border:0;padding:0;font-family:inherit;color:inherit;cursor:pointer}.revenue-column:hover>div{outline:2px solid #777;outline-offset:3px}.profit-month{background:white;text-align:left;font-family:inherit;cursor:pointer;color:inherit}.profit-month:hover{border-color:#777;transform:translateY(-2px)}.coverage-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}.coverage-heading h2{font-size:27px}.coverage-heading p{color:#777;font-size:15px}.coverage-pill{padding:10px 16px;background:#f1eeea;border-radius:24px;font-weight:600}.coverage-layout{display:grid;grid-template-columns:minmax(230px,.8fr) 1.2fr;gap:55px;align-items:center;padding:18px 12px}.coverage-ring{position:relative;display:block;width:100%;max-width:350px;margin:auto;background:none;border:0;padding:0;cursor:pointer;font-family:inherit;color:#111}.coverage-ring svg{width:100%;display:block}.coverage-ring>span{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}.coverage-ring b{font-size:56px;letter-spacing:-3px}.coverage-ring strong{font-size:17px}.coverage-ring small{font-size:12px;color:#777;margin-top:8px}.coverage-ring:hover{transform:scale(1.02)}.coverage-sold{font-size:44px;font-weight:750;letter-spacing:-1.5px}.coverage-sold small{display:block;font-size:15px;font-weight:400;letter-spacing:0;color:#777;margin-top:8px}.coverage-gap{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:26px 0;padding:20px 0;border-top:1px solid #eee;border-bottom:1px solid #eee}.coverage-gap span{font-size:12px;letter-spacing:1px;color:#777}.coverage-gap strong{font-size:28px}.coverage-scenario{width:100%;padding:24px;background:#111;color:white;border:0;border-radius:20px;text-align:left;font-family:inherit;cursor:pointer}.coverage-scenario>span{font-size:11px;letter-spacing:1.3px;color:#ccc}.coverage-scenario strong{display:block;font-size:30px;margin:12px 0}.coverage-scenario p{font-size:14px;color:#eee;line-height:1.5}.coverage-scenario small{color:#ccc}.coverage-scenario:hover{background:#292929}@media(max-width:750px){.coverage-layout{grid-template-columns:1fr;gap:25px;padding:15px 0}.coverage-ring{max-width:260px}.coverage-ring b{font-size:44px}.coverage-sold{font-size:34px}.coverage-heading h2{font-size:23px}}@media(prefers-reduced-motion:reduce){.coverage-ring:hover,.profit-month:hover{transform:none}}

#settings-members{border-top:1px solid #e6e3df;margin-top:26px;padding-top:24px}.members-heading{display:flex;justify-content:space-between;align-items:center;gap:16px}.members-heading span{color:#777;font-size:13px}.members-heading h3{margin:0}.settings-member{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:15px 0;border-bottom:1px solid #eee}.settings-member>span{overflow-wrap:anywhere;font-size:14px}.settings-member>strong{padding:5px 9px;background:#f0eeeb;border-radius:8px;font-size:11px;font-weight:600}#settings-members[hidden]{display:none}

.client-pie-layout{display:grid;grid-template-columns:minmax(240px,400px) 1fr;gap:40px;align-items:start}.client-pie-layout svg{width:100%;max-height:390px}.client-pie-layout g{cursor:pointer;stroke:white;stroke-width:1.5}.client-pie-layout g:hover,.client-pie-layout g:focus{opacity:.75;stroke:#111;stroke-width:3;outline:none}.client-pie-legend{max-height:540px;overflow:auto}.client-pie-legend button{display:grid;grid-template-columns:12px minmax(100px,1fr) 60px 110px;gap:12px;align-items:center;border:0;border-bottom:1px solid #eee;background:none;width:100%;text-align:left;padding:13px 4px;font:inherit;cursor:pointer}.client-pie-legend button:hover{background:#f5f3f0}.client-pie-legend i{display:block;width:12px;height:12px;border-radius:50%}.client-pie-legend button>span:last-child{text-align:right;color:#666}.pie-total{text-align:center}.pie-total b{display:block;font-size:28px}.pie-total span{display:block;color:#777;font-size:13px;margin-top:8px}@media(max-width:900px){.client-pie-layout{grid-template-columns:1fr;gap:20px}.client-pie-layout svg{max-height:310px}.client-pie-legend button{grid-template-columns:12px minmax(80px,1fr) 55px 90px;font-size:12px}}

.margin-key.low,.margin-bar.low{--margin-color:#fceceb}.margin-key.mid,.margin-bar.mid{--margin-color:#fff3d9}.margin-key.good,.margin-bar.good{--margin-color:#e6f3e9}.chart-key .margin-key,.revenue-column>div.margin-bar{background:var(--margin-color)}.revenue-column>div.margin-bar.forecast{background:repeating-linear-gradient(135deg,transparent,transparent 5px,#ffffff80 5px,#ffffff80 10px),var(--margin-color);border:1px solid var(--margin-color)}.revenue-column .bar-margin{font-weight:700;color:#333;font-size:11px;white-space:nowrap}

.metric-cutoff{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:20px 0;color:#666;font-size:14px}.metric-cutoff select{padding:10px 14px;border:1px solid #ddd;border-radius:10px;background:#fff;color:#111;font:inherit}

.finance-hero-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin:24px 0}.finance-hero{border:0;border-radius:26px;padding:26px;text-align:left;font-family:inherit;color:#171717;display:flex;flex-direction:column;gap:16px;min-height:270px;cursor:pointer}.revenue-hero{background:#fff0e9}.profit-hero{background:#e6f3e9;color:#256342}.sold-hero{background:#f0ecff}.quarter-hero{background:#fceceb;color:#a52b27}.hero-label{text-transform:uppercase;letter-spacing:1px;font-size:11px;font-weight:700}.finance-hero>strong{font-size:clamp(26px,2.9vw,46px);letter-spacing:-1.5px;white-space:nowrap}.profit-hero>strong{font-size:64px;line-height:1}.profit-hero em{font-size:32px;font-style:normal}.hero-note{font-size:12px;line-height:1.5;margin-top:auto;opacity:.8}.hero-positive{font-size:13px;font-weight:700}.hero-profit-total{font-size:15px;font-weight:600}.hero-spark{display:flex;align-items:end;gap:5px;height:52px}.hero-spark i{flex:1;background:#ed897a;border-radius:4px 4px 0 0}.hero-spark i.forecast{background:repeating-linear-gradient(135deg,#ed897a,#ed897a 3px,#ffe3d8 3px,#ffe3d8 6px)}.hero-progress{height:12px;background:#dcd6ef;border-radius:20px;overflow:hidden;margin:18px 0}.hero-progress i{display:block;height:100%;background:#a58de0;border-radius:20px}.finance-hero:hover{filter:brightness(.98)}.finance-hero:focus-visible{outline:2px solid #555;outline-offset:3px}@media(max-width:1200px){.finance-hero-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.finance-hero-grid{grid-template-columns:1fr}.finance-hero{min-height:230px}.finance-hero>strong{font-size:42px}}
/* Remembered appearance is applied before the first paint. */
:root{color-scheme:light}.theme-switch{display:flex;gap:4px;background:#f0eeeb;padding:4px;border-radius:12px;margin-bottom:12px}.sidebar-settings .theme-switch button{flex:1;width:auto;text-align:center;padding:10px 6px;border:0;border-radius:9px;font-size:12px;background:transparent;color:#666}.sidebar-settings .theme-switch button[aria-pressed=true]{background:#fff;color:#111;box-shadow:0 1px 4px #0001}
html[data-theme=dark]{color-scheme:dark;--ink:#f1f0ee;--muted:#b1ada8;--paper:#141516;--line:#3c3d40;--white:#222427;--green:#ddd}
html[data-theme=dark] body{color:var(--ink)}
html[data-theme=dark] aside{background:#1c1e20;color:var(--ink);border-color:var(--line)}
html[data-theme=dark] .brand,html[data-theme=dark] #login>img{filter:invert(1) hue-rotate(180deg)}
html[data-theme=dark] :is(.panel,.card,.card:first-child,.filters,dialog,.profit-month,.rankrow){background:#222427;color:var(--ink)}
html[data-theme=dark] :is(.outline,.settings-actions .logout-button){background:#292b2e;color:var(--ink);border-color:var(--line)}
html[data-theme=dark] :is(input,select,.filters input,.filters select,.supplier-filter button,.metric-cutoff select){background:#181a1c;color:var(--ink);border-color:#45464a}
html[data-theme=dark] :is(th,.tag,.settings-member>strong){background:#2c2e31;color:#d6d2cd}
html[data-theme=dark] :is(td,th,.yearcard,.note,.chart,.access-row,.settings-member,.supplier-row,.client-project,.mix-detail,.cost-averages,.coverage-gap,#contractor-nav,#supplier-list,#settings-members,#settings-dialog h3,.sidebar-settings button,.category-legend button,.category-contractors button,.client-pie-legend button){border-color:var(--line)}
html[data-theme=dark] :is(.sub,.small,.role-label,.chart-description,.chart-key,.year-basis,.metric-cutoff,.expand-cue,.coverage-heading p,.coverage-sold small,.coverage-gap span,.coverage-ring small,.pie-total span,.client-revenue-total span,.client-project summary small,.card .label,.card:first-child .label,.card small,.card:first-child small,.revenue-column>span,.revenue-column small,.profit-month small,.mix-detail summary span,.cost-share span,.client-pie-legend button>span:last-child,#account-email,#sync-status,#access-dialog>p,.supplier-row small,.supplier-tools span,.members-heading span,.filters label,.supplier-filter>span){color:#b8b4af}
html[data-theme=dark] :is(a,.link,.year-toolbar a,.project-revenue-body a,.client-rank-bars button,.category-legend button,.category-contractors button,.client-pie-legend button,.coverage-ring,td button,.dialoghead button){color:var(--ink)}
html[data-theme=dark] :is(.rankrow:hover,tbody tr:hover,.outline:hover,.supplier-row:hover,.client-project summary:hover,.category-legend button:hover,.client-pie-legend button:hover,.dialoghead button:hover,.settings-actions .logout-button:hover){background:#303236}
html[data-theme=dark] nav button span{color:#c3bfba}
html[data-theme=dark] nav>button.active:not(#contractor-section){background:#ece9e5}
html[data-theme=dark] nav>button.active:not(#contractor-section) span{color:#171717}
html[data-theme=dark] #contractor-section.active,html[data-theme=dark] #contractor-section.active span{color:var(--ink)}
html[data-theme=dark] #contractor-nav button span{color:#b8b4af}
html[data-theme=dark] #contractor-nav button.active{background:#36383b;box-shadow:inset 2px 0 #f1f0ee}
html[data-theme=dark] #contractor-nav button.active span{color:#fff}
html[data-theme=dark] nav button:hover:not(.active),html[data-theme=dark] #contractor-nav button:hover:not(.active){background:#2c2e31}
html[data-theme=dark] :is(.year-toolbar .solid,.client-year-picker .solid){background:#eeeae6;color:#171717;border-color:#eeeae6}
html[data-theme=dark] .notice{background:#282a2d;color:#c6c0b9}html[data-theme=dark] .notice strong{color:#fff}
html[data-theme=dark] .track{background:#3b3c40}html[data-theme=dark] .rankrow .bar{background:#d0cbc5}
html[data-theme=dark] .coverage-pill{color:#171717}html[data-theme=dark] .coverage-scenario{border:1px solid #444}
html[data-theme=dark] .revenue-column .bar-margin{color:#e0dcd7}
html[data-theme=dark] .margin-badge small,html[data-theme=dark] .profit-month .margin-badge small{color:inherit}
html[data-theme=dark] :is(.category-layout g,.client-pie-layout g){stroke:#222427}
html[data-theme=dark] .theme-switch{background:#121416}html[data-theme=dark] .sidebar-settings .theme-switch button{color:#b8b4af}html[data-theme=dark] .sidebar-settings .theme-switch button[aria-pressed=true]{background:#393c40;color:#fff}
html[data-theme=dark] :focus-visible{outline-color:#d7d2cb}
.mobile-topbar,.mobile-menu-heading{display:none}#menu-backdrop{display:none}#title:focus{outline:none}
@media(max-width:760px){
 html{scroll-padding-top:76px}body{overflow-x:clip}body.mobile-menu-open{overflow:hidden}
 .mobile-topbar{display:flex;position:sticky;top:0;z-index:30;align-items:center;gap:10px;min-height:64px;padding:8px 16px;padding-top:max(8px,env(safe-area-inset-top));background:var(--white);border-bottom:1px solid var(--line)}
 .mobile-topbar>img{width:30px;height:30px;object-fit:contain;border-radius:6px}.mobile-topbar>span{font-size:16px;font-weight:800;letter-spacing:-.4px}
 #menu-toggle{margin-left:auto;width:44px;height:44px;padding:10px;border:1px solid var(--line);border-radius:12px;background:transparent;color:var(--ink)}#menu-toggle svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
 #people-sidebar{position:fixed;inset:0 0 0 auto;width:min(340px,88vw);height:100dvh;z-index:50;padding:20px 18px max(20px,env(safe-area-inset-bottom));border:0;border-left:1px solid var(--line);transform:translateX(105%);visibility:hidden;overflow-y:auto;overscroll-behavior:contain;box-shadow:-12px 0 40px #0002}
 .mobile-menu-open #people-sidebar{transform:translateX(0);visibility:visible}.mobile-menu-open #menu-backdrop{display:block;position:fixed;inset:0;z-index:40;background:#0008;touch-action:none}
 .mobile-menu-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;font-size:22px}.mobile-menu-heading button{border:0;background:transparent;color:inherit;width:44px;height:44px;font-size:30px;border-radius:12px}
 #people-sidebar .brand{display:none}#people-sidebar nav{margin:0;gap:6px;flex-shrink:0}#people-sidebar nav>button{min-height:48px;margin:0;padding:13px 14px}#people-sidebar nav button span{font-size:15px}#people-sidebar #contractor-nav button{min-height:44px}#people-sidebar #contractor-nav button span{font-size:14px}#people-sidebar .sidebar-settings{padding-top:24px}.sidebar-settings .theme-switch button{min-height:44px;font-size:14px}
 main{margin:0;padding:20px 14px calc(28px + env(safe-area-inset-bottom));width:100%;min-width:0}header{margin-bottom:18px;gap:10px;align-items:center}h1{font-size:32px;letter-spacing:-1.2px;margin:4px 0 8px}header p{font-size:13px;line-height:1.5;margin:0 0 8px}h2{font-size:20px;line-height:1.25}h3{line-height:1.4}
 #content,.grid,.cards,.finance-hero-grid{min-width:0}.grid{grid-template-columns:1fr;gap:0}.panel{padding:20px 16px;border-radius:20px;margin-bottom:16px}.panelhead{gap:10px;margin-bottom:18px}.panelhead .tag{white-space:normal}.panel p{overflow-wrap:anywhere}
 .cards,.finance-hero-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:16px 0}.card,.card:first-child{padding:17px 13px;border-radius:18px;min-width:0}.card strong{font-size:25px;letter-spacing:-1px;overflow-wrap:anywhere}.card .label{font-size:10px;line-height:1.4}.card small,.card:first-child small{font-size:11px;line-height:1.5}
 .finance-hero{padding:18px 14px;min-height:200px;border-radius:20px;gap:12px}.finance-hero>strong{font-size:clamp(21px,5.8vw,32px);letter-spacing:-1px;white-space:normal;overflow-wrap:anywhere}.profit-hero>strong{font-size:42px}.profit-hero em{font-size:24px}.hero-label{font-size:10px;line-height:1.4}.hero-note{font-size:11px;line-height:1.5}.hero-profit-total{font-size:13px}.hero-positive{font-size:12px}.hero-progress{margin:8px 0}.hero-spark{height:40px}
 .year-toolbar{gap:12px;margin-bottom:18px}.year-toolbar>div{flex-basis:100%;display:flex;gap:8px}.year-toolbar button{min-height:44px;padding:10px 20px}.year-toolbar a{font-size:12px}.year-basis{font-size:12px;line-height:1.5;margin:12px 0 16px}
 .client-year-picker{margin:12px 0 16px;gap:12px}.client-year-picker h2{font-size:15px}.client-year-picker>div{width:100%;flex-wrap:nowrap;overflow-x:auto;padding:2px 0 8px;gap:7px}.client-year-picker button{min-height:44px;flex-shrink:0;padding:10px 16px}
 .coverage-heading{gap:12px;flex-wrap:wrap}.coverage-heading h2{font-size:23px}.coverage-heading p{font-size:13px;line-height:1.5}.coverage-pill{padding:8px 12px;font-size:12px}.coverage-layout{grid-template-columns:1fr;gap:22px;padding:14px 0 0}.coverage-ring{max-width:245px}.coverage-ring b{font-size:46px}.coverage-sold{font-size:36px}.coverage-sold small{font-size:14px}.coverage-gap{margin:18px 0;padding:16px 0}.coverage-gap strong{font-size:25px}.coverage-scenario{padding:20px}.coverage-scenario strong{font-size:27px}.coverage-scenario p{font-size:14px}
 .filters{gap:14px;padding:16px}.filters>label,.supplier-filter{min-width:0;flex:1 1 130px}.filters .search{min-width:0;flex-basis:100%}.filters select,.filters input,.supplier-filter button{min-width:0;max-width:none;width:100%;min-height:44px;font-size:16px}.filters label,.supplier-filter>span{font-size:12px}#reset{min-height:44px}
 .metric-cutoff{font-size:13px;gap:8px}.metric-cutoff select{font-size:16px;min-height:44px}.chart-description{font-size:13px;line-height:1.6}.chart-key{font-size:12px;gap:12px 18px}.revenue-columns{gap:12px;grid-template-columns:repeat(12,68px);padding:18px 2px 14px;scroll-snap-type:x proximity;overscroll-behavior-x:contain}.revenue-column{scroll-snap-align:start;min-height:44px}.profit-months{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.profit-month{padding:15px 12px}.profit-month>strong{font-size:21px}.margin-badge{font-size:13px}
 .rankrow{grid-template-columns:20px minmax(0,1fr) 80px;font-size:12px;gap:8px;min-height:60px}.rankrow .track{grid-column:2;grid-row:2}.rankrow .amount{grid-column:3;grid-row:1/3}.rankrow>span:nth-child(2){overflow-wrap:anywhere}.role-label{font-size:11px}.client-rank-bars button{font-size:13px;min-height:58px}.client-rank-bars button>span{overflow-wrap:anywhere}.client-rank-bars button strong{white-space:nowrap}
 .category-layout,.client-pie-layout{grid-template-columns:1fr;gap:20px}.category-layout svg,.client-pie-layout svg{max-height:280px}.category-legend button,.client-pie-legend button{grid-template-columns:10px minmax(0,1fr) 48px 78px;gap:8px;font-size:12px;min-height:48px}.category-legend button>span,.client-pie-legend button>span{overflow-wrap:anywhere}.client-pie-legend{max-height:none}
 .mix-detail summary{flex-wrap:wrap;min-height:44px;gap:8px}.mix-detail summary span{font-size:12px}.mix-project{padding:14px 0 0;font-size:12px}.mix-project span{overflow-wrap:anywhere}.labeled-segment,.labeled-segment>b{font-size:11px}.labeled-segment{padding:12px 3px;overflow-wrap:anywhere}.cost-share{gap:8px;font-size:13px}.cost-share span{width:90px}.cost-averages p{font-size:13px;line-height:1.5}
 .tablewrap{max-width:100%;overscroll-behavior-x:contain}table{font-size:12px}td,th{padding:12px 8px}td button{min-height:36px}.client-project summary{padding:16px;gap:12px;flex-wrap:wrap}.client-project summary>span{min-width:100px;overflow-wrap:anywhere}.project-revenue-body{padding:0 14px 18px}.client-revenue-total{flex-wrap:wrap;gap:8px}
 dialog,#settings-dialog,#access-dialog,#supplier-dialog{width:calc(100vw - 20px);max-width:calc(100vw - 20px);max-height:calc(100dvh - 24px);padding:20px 16px;border-radius:18px;overflow:auto}dialog .dialoghead{position:sticky;top:-20px;z-index:2;background:var(--white);padding:8px 0 12px;align-items:flex-start}.dialoghead h2{font-size:23px;overflow-wrap:anywhere}.dialoghead button{min-width:44px;width:44px;height:44px}.settings-actions button,#supplier-search,#invite-email,#password-form input,#login-form input{min-height:44px;font-size:16px}.supplier-row{min-height:48px}.supplier-footer{position:sticky;bottom:-20px;background:var(--white);padding:16px 0}.supplier-footer button{min-height:44px}.tablewrap:focus-visible{outline-offset:-2px}
 html[data-theme=dark] .mobile-topbar,html[data-theme=dark] dialog .dialoghead,html[data-theme=dark] .supplier-footer{background:#222427}
}
@media(max-width:360px){.finance-hero-grid{grid-template-columns:1fr}.finance-hero{min-height:180px}.cards{grid-template-columns:1fr}.category-legend button,.client-pie-legend button{grid-template-columns:10px minmax(0,1fr) 42px 72px;gap:6px}.coverage-sold{font-size:32px}}
@media(prefers-reduced-motion:no-preference){@media(max-width:760px){#people-sidebar{transition:transform .18s ease,visibility .18s ease}}}

/* Dark surfaces keep charts vivid, with the same semantic margin thresholds. */
html[data-theme=dark]{--paper:#10131c;--white:#1c2130;--ink:#f5f6fc;--muted:#b6bed2;--line:#343d53;--margin-low:#ff637c;--margin-mid:#ffdb38;--margin-good:#3fffa8;--delivery-color:#ff637c;--operating-color:#b78aff}
html[data-theme=dark] aside{background:#171c29}
html[data-theme=dark] .brand,html[data-theme=dark] #login>img{mix-blend-mode:screen}
html[data-theme=dark] :is(.panel,.card,.card:first-child,.filters,dialog,.profit-month,.rankrow){background:#1c2130}
html[data-theme=dark] .panel{border:1px solid #2b3448}
html[data-theme=dark] .revenue-hero{background:#38282c;color:#ffb4a2}
html[data-theme=dark] .sold-hero{background:#302b49;color:#d4c5ff}
html[data-theme=dark] .quarter-hero{background:#3d252f;color:#ffaaa5}
html[data-theme=dark] .profit-hero{color:#163d30!important}
html[data-theme=dark] .hero-progress{background:#51466e}
html[data-theme=dark] .hero-spark i{background:#ff9a87}
html[data-theme=dark] .hero-spark i.forecast{background:repeating-linear-gradient(135deg,#ff9a87,#ff9a87 3px,#593b3d 3px,#593b3d 6px)}
html[data-theme=dark] :is(.margin-key.low,.margin-bar.low){--margin-color:var(--margin-low)}
html[data-theme=dark] :is(.margin-key.mid,.margin-bar.mid){--margin-color:var(--margin-mid)}
html[data-theme=dark] :is(.margin-key.good,.margin-bar.good){--margin-color:var(--margin-good)}
html[data-theme=dark] .labeled-segment{color:#171b29}
html[data-theme=dark] .margin-badge.low{background:#492d36;color:#ffb1aa}
html[data-theme=dark] .margin-badge.mid{background:#443c28;color:#ffda89}
html[data-theme=dark] .margin-badge.good{background:#213f39;color:#8de8ba}
html[data-theme=dark] .coverage-scenario{background:#302b49;border-color:#5d4f81}
html[data-theme=dark] :is(.mobile-topbar,dialog .dialoghead,.supplier-footer){background:#171c29}
/* A phone gets a clear reading order, not a compressed desktop grid. */
@media(max-width:760px){
 .finance-hero-grid{grid-template-columns:1fr;gap:12px}
 .finance-hero{position:relative;min-height:0;padding:22px;gap:10px;border-radius:22px}
 .finance-hero>strong{font-size:36px;line-height:1.1;letter-spacing:-1.2px;white-space:nowrap}
 .profit-hero>strong{font-size:48px}.profit-hero em{font-size:26px}
 .hero-label{font-size:11px;letter-spacing:.6px}.hero-profit-total{font-size:14px;line-height:1.5}
 .finance-hero .hero-note,.finance-hero .hero-positive,.finance-hero .hero-spark{display:none}
 .finance-hero:after{content:'View details →';font-size:11px;font-weight:600;opacity:.75;margin-top:4px}
 .hero-progress{height:7px;margin:3px 0 2px}
 .panel>.cards{grid-template-columns:1fr;gap:0;margin:12px 0 0}
 .panel>.cards>.card{padding:17px 0;border-bottom:1px solid var(--line);border-radius:0}
 .panel>.cards>.card:last-child{border:0}.panel>.cards .card strong{font-size:28px}
 .panel>.cards .card small{margin-top:7px}.panel>.cards .card .label{font-size:11px}
 .chart-key{gap:8px 14px;font-size:11px}.chart-key i{width:12px;height:12px}
 .mix-bar:has(.labeled-segment){min-height:18px;height:18px;border-radius:8px;margin:20px 0}
 .mix-bar .labeled-segment{padding:0;min-height:18px}.mix-bar .labeled-segment>*{display:none}
 .cost-share{display:grid;grid-template-columns:1fr auto;font-size:14px;row-gap:5px;padding:10px 0;margin:0;border-bottom:1px solid var(--line)}
 .cost-share strong{grid-column:2}.cost-share span{grid-column:1/3;text-align:left;width:auto;font-size:13px}
 .profit-months{grid-template-columns:1fr}.profit-month{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;text-align:left}
 .profit-month>strong{grid-column:1;grid-row:2;margin:0}.profit-month .margin-badge{grid-column:2;grid-row:1/3}.profit-month small{margin:4px 0}
}

html[data-theme=dark] .margin-badge.low{background:#ff637c;color:#30101a}
html[data-theme=dark] .margin-badge.mid{background:#ffdb38;color:#332700}
html[data-theme=dark] .margin-badge.good{background:#3fffa8;color:#063324}
html[data-theme=dark] .revenue-column>div.margin-bar{box-shadow:0 -4px 20px color-mix(in srgb,var(--margin-color) 16%,transparent)}
html[data-theme=dark] .profit-month{border-color:#394359}
html[data-theme=dark] .revenue-column>div.margin-bar.forecast{background:repeating-linear-gradient(135deg,transparent,transparent 5px,#10131c66 5px,#10131c66 10px),var(--margin-color)}

html[data-theme=dark] .brand,html[data-theme=dark] #login>img{filter:invert(1) grayscale(1) brightness(3);mix-blend-mode:screen}
html[data-theme=dark] .mobile-topbar>img{filter:grayscale(1) brightness(0) invert(1);mix-blend-mode:screen}

/* Keep nested metric captions on their badge's semantic ink in both themes. */
html .margin-badge small,html[data-theme=dark] .card .margin-badge small,html[data-theme=dark] .profit-month .margin-badge small{color:inherit!important;opacity:1}
html[data-theme=dark] .finance-hero .hero-note{opacity:1}