html{--app-header-height:80px;scroll-padding-top:var(--app-header-height)}
body{font-size:var(--wf-ui-size);line-height:var(--wf-ui-line);background:var(--wf-white);color:var(--wf-ink)}
button{cursor:pointer}button:disabled{cursor:default;opacity:.5}a,button,input,textarea,select{-webkit-tap-highlight-color:transparent}button svg{width:20px;height:20px;flex:none}button{color:inherit}button:focus-visible,a:focus-visible{outline-offset:3px}
.starter-nav{position:sticky;top:0;z-index:10;background:var(--wf-brand);color:white}.masthead{height:80px;display:flex;align-items:center;gap:48px}.brand{flex:none}.brand .wf-logo{width:176px}.masthead nav{display:flex;align-self:stretch;gap:32px;align-items:stretch}.masthead nav a{display:flex;align-items:center;color:white;text-decoration:none;font-size:16px;position:relative;opacity:.75}.masthead nav a.active{opacity:1;font-weight:600}.masthead nav a.active:after{content:'';position:absolute;bottom:0;left:0;right:0;height:4px;border-radius:4px 4px 0 0;background:var(--wf-mint)}.header-tool{margin-left:auto;background:transparent;border:0;color:white;width:48px;height:48px;display:grid;place-items:center;border-radius:12px}.header-tool:hover{background:rgb(255 255 255 / .12)}.header-tool svg{width:24px;height:24px}
#app{min-height:calc(100vh - 160px);padding-top:32px;padding-bottom:48px}.page-heading{display:flex;justify-content:space-between;align-items:start;gap:24px}.page-heading h1{margin-top:8px}.page-heading p.subtitle{margin-top:8px;color:var(--wf-body);font-size:14px}.eyebrow{font-size:12px;letter-spacing:.08em;color:var(--wf-body);text-transform:uppercase;font-weight:600}.sync-link{display:flex;gap:8px;align-items:center;font-size:14px;color:var(--wf-teal);background:transparent;border:0;padding:8px 0;white-space:nowrap}.dot{width:8px;height:8px;border-radius:50%;background:var(--wf-teal);display:inline-block;flex:none}.dot.alert{background:var(--wf-coral)}
.totals{display:flex;gap:64px;padding:32px 0;align-items:center}.totals:first-child{padding-top:0}.total strong{display:block;font-size:28px;font-weight:500;line-height:1.4;letter-spacing:-.02em}.total span{color:var(--wf-body);font-size:14px}.total:last-child strong{color:var(--wf-teal)}.total small{font-size:14px;font-weight:400;letter-spacing:0}.toolbar{display:flex;align-items:center;gap:16px;margin-bottom:16px}.search{position:relative;flex:1;max-width:420px}.search svg{position:absolute;left:16px;top:14px;width:20px;height:20px;color:var(--wf-body)}input.search-input{border:1px solid var(--wf-border);background:var(--wf-surface);border-radius:12px;min-height:48px;padding:12px 16px 12px 48px;width:100%;font-size:14px;color:var(--wf-ink)}input.search-input::placeholder{color:var(--wf-body)}
.segments{display:flex;border-radius:12px;background:var(--wf-surface);padding:4px;gap:4px}.segments button{border:0;padding:8px 16px;min-height:40px;border-radius:8px;background:transparent;font-size:14px;color:var(--wf-body);white-space:nowrap}.segments button.active{background:white;color:var(--wf-ink);box-shadow:0 1px 6px rgb(6 76 67 / .08);font-weight:500}.quiet{border:0;background:transparent;color:var(--wf-teal);padding:8px 12px;min-height:40px;border-radius:8px;font-size:14px;display:inline-flex;align-items:center;justify-content:center;gap:8px}.quiet:hover{background:var(--wf-surface)}.toolbar .quiet{margin-left:auto}.icon-button{border:0;background:transparent;border-radius:12px;min-width:48px;min-height:48px;padding:12px;display:inline-flex;align-items:center;justify-content:center}.icon-button:hover{background:var(--wf-surface)}
.creditcontrol{border:1px solid var(--wf-border);border-radius:16px;overflow:clip}.creditcontrol table{width:100%;border-collapse:collapse;text-align:left;table-layout:fixed}.creditcontrol th{position:sticky;top:var(--app-header-height);z-index:2;width:20%;font-size:12px;font-weight:500;color:var(--wf-body);padding:16px 24px;background:var(--wf-surface)}.creditcontrol td{padding:16px 24px;border-top:1px solid var(--wf-mint);vertical-align:middle;font-size:14px}.creditcontrol tbody tr{cursor:pointer;transition:background .15s}.creditcontrol tbody tr:hover,.creditcontrol tbody tr:focus-within{background-color:var(--wf-surface)}.creditcontrol th:not(:first-child),.creditcontrol td:not(:first-child){text-align:center}.creditcontrol .action-label{justify-content:center}.creditcontrol .amount{text-align:center;font-weight:500;font-variant-numeric:tabular-nums}.row-link{display:block;border:0;background:transparent;text-align:left;padding:0;font-size:14px;font-weight:500;line-height:1.6;max-width:100%;width:100%;color:var(--wf-ink)}.row-link:hover{color:var(--wf-teal)}.secondary-line{display:block;font-size:12px;color:var(--wf-body);font-weight:400;margin-top:4px}.action-label{display:flex;gap:8px;align-items:center;line-height:1.4;font-size:14px}.action-label.attention:before{content:'';width:6px;height:6px;flex:none;border-radius:50%;background:var(--wf-coral)}.overdue{color:var(--wf-teal)}.muted{color:var(--wf-body)}.table-foot{display:flex;justify-content:space-between;padding:16px 0;font-size:12px;color:var(--wf-body)}.empty{padding:48px 24px;text-align:center;color:var(--wf-body)}.empty h3{color:var(--wf-ink);margin-bottom:8px}
.team-panel{background:var(--wf-surface);border-radius:16px;padding:24px;margin-bottom:24px}.team-panel .team-heading{display:flex;justify-content:space-between;margin-bottom:16px}.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.team-person{border-left:2px solid var(--wf-border);padding-left:16px;font-size:14px}.team-person strong{display:block;font-weight:500}.team-person p{font-size:12px;color:var(--wf-body);margin-top:4px}.team-foot{font-size:12px;color:var(--wf-body);margin-top:24px;display:flex;flex-wrap:wrap;gap:24px}.notice{padding:16px 24px;border-radius:12px;background:var(--wf-surface);border:1px solid var(--wf-border);font-size:14px;display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:16px}.notice strong{font-weight:500}.notice .quiet{flex:none}
.plan-intro{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--wf-mint);margin:32px 0 8px;padding-bottom:24px;gap:24px}.toggle-line{display:flex;align-items:center;gap:12px;font-size:14px}.switch{position:relative;display:inline-block;width:44px;height:24px;flex:none}.switch input{position:absolute;opacity:0;inset:0;width:100%;height:100%;cursor:pointer}.switch-track{display:block;border-radius:999px;background:var(--wf-border);height:24px;pointer-events:none}.switch-track:after{content:'';position:absolute;top:3px;left:3px;width:18px;height:18px;background:white;border-radius:50%;box-shadow:0 1px 3px rgb(6 76 67 / .15);transition:transform .15s}.switch input:checked+.switch-track{background:var(--wf-teal)}.switch input:checked+.switch-track:after{transform:translateX(20px)}.switch input:focus-visible+.switch-track{outline:3px solid var(--wf-teal);outline-offset:4px}.plan-list{position:relative;margin-top:24px}.milestone{display:flex;align-items:center;gap:24px;padding:24px 0;border-bottom:1px solid var(--wf-mint)}.day{flex:none;background:var(--wf-surface);border-radius:16px;width:80px;height:80px;display:flex;flex-direction:column;justify-content:center;align-items:center;color:var(--wf-teal)}.day strong{font-size:24px;line-height:1.3;font-weight:500}.day span{font-size:12px}.milestone-text{flex:1}.milestone-text h2{font-size:18px;font-weight:500}.milestone-text p{margin-top:4px;color:var(--wf-body);font-size:14px}.milestone-text .milestone-meta{font-size:12px;margin-top:8px;display:flex;gap:16px;flex-wrap:wrap}.milestone .quiet{padding:12px 16px}.plan-end{display:flex;align-items:center;justify-content:space-between;gap:32px;margin-top:32px}.plan-end p{max-width:620px;font-size:14px;color:var(--wf-body)}
.app-footer{display:flex;justify-content:space-between;gap:24px;padding-top:24px;padding-bottom:24px;border-top:1px solid var(--wf-mint);font-size:12px;color:var(--wf-body)}
.drawer-backdrop{position:fixed;inset:0;background:rgb(6 76 67 / .18);z-index:20}.drawer{position:fixed;top:0;right:0;width:600px;max-width:100%;height:100dvh;background:white;z-index:21;box-shadow:-8px 0 48px rgb(6 76 67 / .12);overflow:auto;animation:enter .18s ease-out}.drawer-top{display:flex;align-items:center;justify-content:space-between;padding:16px 32px;border-bottom:1px solid var(--wf-mint);position:sticky;top:0;z-index:2;background:white}.drawer-top span{font-size:14px;color:var(--wf-body)}.drawer-content{padding:32px}.drawer h2{margin-top:8px}.drawer .balance{font-size:32px;font-weight:500;letter-spacing:-.02em;margin-top:24px}.balance-caption{font-size:14px;color:var(--wf-body);margin-top:4px}.facts{display:grid;grid-template-columns:1fr 1fr;gap:16px 24px;margin:24px 0;font-size:14px}.facts dt{font-size:12px;color:var(--wf-body)}.facts dd{margin:4px 0 0}.facts button{padding:0;min-height:24px;justify-content:start}.next-card{padding:24px;background:var(--wf-surface);border-radius:16px;margin:24px 0}.next-card h3{font-size:16px;font-weight:500;margin:0 0 8px}.next-card p{font-size:14px;color:var(--wf-body)}.next-card .context-action{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px}.next-card .wf-button{border-radius:8px}.customer-contact{display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:14px;color:var(--wf-body)}.customer-contact a{font-size:14px}.activity-heading{display:flex;justify-content:space-between;align-items:center;margin-top:32px;margin-bottom:16px}.activity-heading h3{font-size:18px;font-weight:500}.timeline{display:flex;flex-direction:column;gap:24px}.entry{position:relative;padding-left:24px;border-left:1px solid var(--wf-border)}.entry:before{content:'';position:absolute;width:8px;height:8px;border-radius:50%;background:var(--wf-mint);left:-4.5px;top:6px}.entry.reply:before{background:var(--wf-teal)}.entry .entry-title{display:flex;justify-content:space-between;gap:12px;font-size:14px;font-weight:500}.entry .entry-date{font-size:12px;color:var(--wf-body);font-weight:400;white-space:nowrap}.entry p{font-size:14px;color:var(--wf-body);margin-top:8px;white-space:pre-wrap;overflow-wrap:anywhere}.entry .author{font-size:12px;color:var(--wf-body);margin-top:8px}.attachments{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.attachment{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--wf-border);background:white;border-radius:8px;padding:8px 12px;font-size:12px;color:var(--wf-teal)}.attachment svg{width:16px;height:16px}.note-form{margin:24px 0;padding-top:24px;border-top:1px solid var(--wf-mint)}.note-form textarea{min-height:96px}.note-form .note-actions{display:flex;justify-content:flex-end;margin-top:8px}.input{width:100%;border:1px solid var(--wf-border);border-radius:8px;padding:12px 16px;font-size:14px;line-height:1.6;min-height:48px;color:var(--wf-ink);background:white}.input::placeholder{color:var(--wf-body)}textarea.input{resize:vertical;min-height:112px}select.input{padding-right:32px}.label{font-size:14px;font-weight:600;display:block;margin-bottom:8px}.field{margin:16px 0}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.field-grid .field{margin:0}.help{color:var(--wf-body);font-size:12px;margin-top:8px}.checkbox{display:flex;align-items:center;gap:8px;font-size:14px;cursor:pointer}.checkbox input{accent-color:var(--wf-teal);width:18px;height:18px;flex:none}.check-row{display:flex;gap:24px;flex-wrap:wrap;margin-top:16px}.wf-button{border-radius:8px}.wf-button--secondary{border-width:1px}.form-actions{display:flex;justify-content:flex-end;align-items:center;gap:12px;padding-top:24px;margin-top:24px;border-top:1px solid var(--wf-mint)}.form-error{font-size:14px;color:var(--wf-brand);background:var(--wf-mint);padding:12px;border-radius:8px;margin:16px 0;border-left:4px solid var(--wf-coral)}
dialog{border:0;padding:0;border-radius:16px;width:680px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 48px);color:var(--wf-ink);box-shadow:0 24px 80px rgb(6 76 67 / .2)}dialog::backdrop{background:rgb(6 76 67 / .25)}.modal-header{padding:24px 32px 16px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--wf-mint);position:sticky;top:0;background:white;z-index:3}.modal-header h2{font-size:20px;font-weight:500}.modal-body{padding:24px 32px 32px}.modal-body>.intro{color:var(--wf-body);font-size:14px;margin-bottom:24px}.modal-body details{margin-top:16px}.modal-body summary{cursor:pointer;color:var(--wf-teal);font-size:14px;padding:8px 0}.reply-box{background:var(--wf-surface);border-radius:12px;padding:24px;font-size:14px;margin-bottom:24px;white-space:pre-wrap}.reply-box .from{font-size:12px;color:var(--wf-body);margin-bottom:12px}.email-preview{border:1px solid var(--wf-border);border-radius:12px;overflow:hidden;margin:16px 0}.email-preview .email-brand{background:var(--wf-brand);padding:24px}.email-brand img{width:144px}.email-preview .email-body{padding:24px;white-space:pre-wrap;font-size:14px}.email-preview.personal{border:0}.email-preview.personal .email-body{padding:8px 0}.preview-balance{padding:16px 24px;background:var(--wf-surface);display:flex;justify-content:space-between;font-size:14px}.preview-label{font-size:12px;color:var(--wf-body);margin:24px 0 8px}.settings-nav{margin-bottom:24px}.setting-row{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:24px 0;border-bottom:1px solid var(--wf-mint)}.setting-row:first-child{padding-top:0}.setting-row h3{font-size:16px;font-weight:500}.setting-row p{color:var(--wf-body);font-size:12px;margin-top:4px}.source-badge{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--wf-surface);font-size:12px;font-weight:600;color:var(--wf-teal);flex:none}.source-info{flex:1}.demo-controls{display:grid;gap:12px}.demo-control{background:var(--wf-surface);border:1px solid var(--wf-border);padding:16px;border-radius:12px;text-align:left;display:flex;justify-content:space-between;align-items:center;gap:24px}.demo-control strong{font-size:14px;font-weight:500;display:block}.demo-control span{font-size:12px;color:var(--wf-body)}.demo-control:hover{border-color:var(--wf-teal)}.split-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.small-card{background:var(--wf-surface);padding:16px;border-radius:12px;font-size:14px}.action-menu{display:grid;gap:4px}.action-menu button{padding:16px;border:0;background:white;text-align:left;border-radius:8px;font-size:14px}.action-menu button:hover{background:var(--wf-surface)}.danger{color:var(--wf-brand);border-color:var(--wf-coral)}
#toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,20px);background:var(--wf-brand);color:white;border-radius:12px;box-shadow:var(--wf-shadow);font-size:14px;padding:16px 24px;max-width:calc(100vw - 40px);opacity:0;pointer-events:none;z-index:100;transition:opacity .15s,transform .15s}#toast.visible{opacity:1;transform:translate(-50%,0)}
.form-actions{position:sticky;bottom:-32px;background:white;z-index:2;padding-bottom:16px}.masthead a:focus-visible{outline-color:var(--wf-mint)}
body.drawer-open,body.modal-open{overflow:hidden}
@media(max-width:700px){.masthead{gap:16px}.brand .wf-logo{width:112px}.masthead nav a{white-space:nowrap}.team-heading{flex-direction:column;align-items:start;gap:16px}.team-heading .checkbox{flex-wrap:wrap}.next-card .context-action .wf-button:not(.wf-button--compact){font-size:20px}.form-actions{bottom:-24px}.plan-intro{flex-direction:column;align-items:start}.plan-intro>.quiet{white-space:nowrap}}
@keyframes enter{from{transform:translateX(32px);opacity:0}to{transform:translateX(0);opacity:1}}
@media(min-width:1600px){#app{padding-top:48px}.totals{padding:32px 0 48px}.creditcontrol td{padding-block:20px}}
@media(max-width:1000px){.totals{gap:48px}.toolbar{flex-wrap:wrap}.search{max-width:none;flex:1;min-width:220px}.creditcontrol th,.creditcontrol td{padding-inline:16px}}
@media(max-width:700px){.masthead{height:72px;gap:24px}.brand .wf-logo{width:128px}.masthead nav{gap:16px}.masthead nav a{font-size:14px}.header-tool{min-width:40px;width:40px;padding:8px}.page-heading{display:block}.sync-link{margin-top:16px}.totals{gap:24px;justify-content:space-between;padding:24px 0}.total strong{font-size:20px}.total span,.total small{font-size:12px}.toolbar{gap:12px}.search{width:100%;flex-basis:100%}.toolbar .segments{flex:1}.segments button{padding:8px 12px;font-size:12px}.toolbar>.quiet{font-size:12px;padding:8px}.creditcontrol{border-radius:12px}.creditcontrol thead{display:none}.creditcontrol tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));padding:16px;gap:12px 8px;border-top:1px solid var(--wf-mint)}.creditcontrol tr:first-child{border:0}.creditcontrol td{padding:0;border:0}.creditcontrol td:nth-child(1){grid-column:1;grid-row:1}.creditcontrol td:nth-child(2){grid-column:2;grid-row:1}.creditcontrol td:nth-child(3){grid-column:2;grid-row:2;font-size:12px}.creditcontrol td:nth-child(4){display:none}.creditcontrol td:nth-child(5){grid-column:1;grid-row:2}.creditcontrol td:nth-child(5) .secondary-line{display:none}.action-label{font-size:12px}.row-link{font-size:14px}.table-foot{flex-wrap:wrap;gap:8px}.team-grid{grid-template-columns:1fr;gap:16px}.team-foot{gap:12px}.plan-intro{align-items:start;gap:16px}.plan-intro>.quiet{padding:8px 0}.milestone{gap:16px;padding:24px 0;align-items:start}.day{width:64px;height:72px}.milestone-text h2{font-size:16px}.milestone-text p{font-size:12px}.milestone .quiet{font-size:12px;padding:8px}.milestone-meta{gap:8px!important}.plan-end{flex-direction:column;align-items:start}.app-footer{flex-direction:column;gap:8px}.drawer-content{padding:24px}.drawer-top{padding:12px 20px}.modal-header{padding:16px 24px}.modal-body{padding:24px}.field-grid{grid-template-columns:1fr}.notice{padding:16px;font-size:12px;align-items:start}.notice .quiet{font-size:12px}.facts{gap:16px}.entry .entry-title{display:block}.entry .entry-date{display:block;margin-top:4px}.settings-nav.segments button{flex:1}.form-actions{flex-wrap:wrap}.form-actions .wf-button{flex:1}.customer-contact{font-size:12px}.next-card{padding:24px}.next-card .wf-button{font-size:16px}.plan-intro .toggle-line{align-items:start}.header-tool svg{width:20px;height:20px}}
@media(max-width:380px){.masthead{gap:16px}.brand .wf-logo{width:112px}.masthead nav{gap:12px}.total strong{font-size:18px}.totals{gap:12px}}
@media(max-width:700px){.masthead{gap:12px}.brand .wf-logo{width:112px}.masthead nav{gap:12px}.header-tool{width:36px;min-width:36px}.team-heading{flex-direction:column;align-items:start;gap:16px}.plan-intro{flex-direction:column;align-items:start}.next-card .context-action .wf-button:not(.wf-button--compact){font-size:20px}.form-actions{bottom:-24px}}
@media(max-width:380px){.brand .wf-logo{width:96px}}

/* Shared controls and the accounting-style Home dashboard. */
#app{min-height:calc(100vh - 80px)}
.header-tool{flex:none;padding:12px;transition:background .15s}
.header-tool:focus-visible{outline:2px solid var(--wf-mint)}
.column-sort{display:flex;align-items:center;gap:8px;width:100%;text-align:left;border:0;background:none;padding:0;min-height:28px;font-size:inherit;font-weight:inherit;line-height:1.5;color:inherit}
.creditcontrol th:not(:first-child) .column-sort{justify-content:center;text-align:center}
.column-sort:hover{color:var(--wf-teal)}
.sort-indicator{color:var(--wf-teal);font-size:14px;opacity:.4;flex:none}
th[aria-sort="ascending"] .sort-indicator,th[aria-sort="descending"] .sort-indicator{opacity:1}
.mobile-sort{display:none}
.scope-notice{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:0 0 16px;font-size:14px;color:var(--wf-body)}
.debt-filters{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.overdue-filter{min-height:40px;white-space:nowrap;color:var(--wf-body)}
@media(max-width:700px){.debt-filters{width:100%;gap:8px 16px}.overdue-filter{font-size:12px}.debt-filters .segments{width:100%}.debt-filters .segments button{flex:1}}
.home-page{background:var(--wf-surface)}
.business-heading{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:24px}
.business-heading>span{font-size:12px;color:var(--wf-body)}
.home-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;align-items:start}
.home-card{min-width:0;background:var(--wf-white);border:1px solid var(--wf-border);border-radius:12px;padding:24px}
.home-card h2{font-size:18px;font-weight:600;line-height:1.4;margin:0 0 24px}
.home-financial-card{display:flex;flex-direction:column;min-height:560px;height:100%}
.home-metrics{display:grid;grid-template-columns:1fr 1fr;margin-bottom:24px}
.home-metrics>div{min-width:0}
.home-metrics>div+div{border-left:1px solid var(--wf-mint);padding-left:16px;margin-left:16px}
.home-metrics strong{display:block;font-size:24px;font-weight:500;line-height:1.4;letter-spacing:-.03em;font-variant-numeric:tabular-nums;white-space:nowrap}
.home-metrics>div>span{display:block;font-size:12px;color:var(--wf-body);margin-top:4px}
.home-metrics .overdue .home-link{color:var(--wf-ink);text-decoration-color:var(--wf-coral)}
.home-link{border:0;background:none;padding:0;color:var(--wf-teal);font-size:12px;text-align:left;line-height:1.6;text-decoration:none;display:inline-flex;align-items:center;gap:8px;min-height:24px}
.home-link:hover{text-decoration:underline;text-underline-offset:4px}
.home-link svg{width:16px;height:16px}
.home-chart{display:flex;gap:8px;height:264px;min-height:200px;flex:1;margin:0 0 40px}
.home-chart-axis{display:flex;flex-direction:column;justify-content:space-between;min-width:32px;font-size:11px;color:var(--wf-body);text-align:right}
.home-chart-plot{position:relative;display:flex;align-items:stretch;justify-content:space-around;gap:8px;flex:1;min-width:0;border-bottom:1px solid var(--wf-border);background:linear-gradient(var(--wf-mint),var(--wf-mint)) top/100% 1px no-repeat,linear-gradient(var(--wf-mint),var(--wf-mint)) center/100% 1px no-repeat}
.home-chart-column{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;position:relative;width:18%;height:100%;border:0;background:none;padding:0}
.home-bar{display:block;width:100%;height:var(--height);min-height:2px;max-height:100%;border:1px solid var(--wf-teal);border-radius:6px 6px 0 0;background:var(--wf-mint)}
.home-bar.old{background:var(--wf-teal)}
.home-chart-column:hover .home-bar{background:var(--wf-border)}
.home-chart-column small{position:absolute;top:100%;padding-top:4px;width:130%;text-align:center;font-size:10px;color:var(--wf-body);line-height:1.4}
.home-card-links{border-top:1px solid var(--wf-mint);padding-top:16px;margin-top:auto}
.home-card-links>div{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;padding:4px 0}
.home-card-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px;align-items:center}
.home-card-actions .wf-button,.home-card-actions .quiet{font-size:12px;padding:8px 12px;min-height:40px;text-decoration:none}
.home-card-actions svg{width:16px;height:16px;flex:none}
.home-caption{font-size:11px;color:var(--wf-body);line-height:1.5;margin-top:16px}
.home-side-stack{display:flex;flex-direction:column;gap:24px}
.home-tasks-card h2{display:flex;justify-content:space-between;align-items:center}
.home-count{font-size:12px;font-weight:500;color:var(--wf-teal);background:var(--wf-surface);border-radius:999px;padding:4px 8px}
.home-task-list{max-height:208px;overflow:auto;margin:0 -8px 16px}
.home-task{border:0;background:none;text-align:left;padding:12px 8px;border-radius:8px;width:100%;display:block}
.home-task:hover{background:var(--wf-surface)}
.home-task strong{display:block;font-size:14px;font-weight:500}
.home-task span,.home-task small{display:block;font-size:12px;color:var(--wf-body);margin-top:4px}
.home-task small{font-size:11px}
.home-payments-card h2{margin-bottom:16px}
.home-payment-list{overflow:auto;max-height:184px}
.home-payment-list table{border-collapse:collapse;width:100%;font-size:11px;text-align:left}
.home-payment-list th{font-size:11px;font-weight:400;color:var(--wf-body)}
.home-payment-list th,.home-payment-list td{border-bottom:1px solid var(--wf-mint);padding:12px 0;vertical-align:top}
.home-payment-list td:nth-child(2){padding-inline:8px}
.home-payment-list td:last-child,.home-payment-list th:last-child{text-align:right;white-space:nowrap}
.home-payment-list .home-link{font-size:11px;white-space:nowrap}
.home-aging-card{grid-column:span 2}
.home-aging-list{display:grid;gap:16px}
.home-aging-row{position:relative;display:grid;grid-template-columns:1fr auto auto;gap:16px;align-items:center;padding:0 0 12px;text-align:left;border:0;background:none;font-size:14px}
.home-aging-row:after,.home-aging-row i{position:absolute;bottom:0;left:0;height:4px;border-radius:4px}
.home-aging-row:after{content:'';width:100%;background:var(--wf-surface)}
.home-aging-row i{width:var(--width);background:var(--wf-teal);z-index:1}
.home-aging-row strong{font-size:16px;font-weight:500;font-variant-numeric:tabular-nums}
.home-aging-row small{width:72px;text-align:right;color:var(--wf-body);font-size:12px}
.home-aging-row:hover{color:var(--wf-teal)}
.home-workflow-state{display:flex;align-items:center;gap:8px;color:var(--wf-teal);font-size:12px}
.home-control-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px}
.home-control-stats strong{font-size:28px;font-weight:500;display:block}
.home-control-stats span{font-size:11px;color:var(--wf-body);display:block}
.home-empty{font-size:14px;color:var(--wf-body)}
.settings-nav{width:100%}.settings-nav button{flex:1}
.modal-body .team-panel{padding:16px;background:var(--wf-surface)}
.modal-body .team-panel h2{font-size:16px}
.modal-body .team-panel .team-grid{gap:16px}
.modal-body .team-panel .checkbox{font-size:12px}
@media(max-width:1200px){.home-metrics strong{font-size:20px}.home-metrics>div+div{padding-left:12px;margin-left:12px}}
@media(max-width:1000px){.home-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.home-side-stack{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}.home-aging-card{grid-column:auto}.home-financial-card{min-height:528px}.home-metrics strong{font-size:22px}.home-control-stats{gap:12px}}
@media(max-width:700px){.mobile-sort{display:flex;gap:8px;align-items:center;justify-content:flex-end;color:var(--wf-body);font-size:12px;margin:0 0 16px}.mobile-sort select{max-width:calc(100% - 48px);color:var(--wf-teal);background:var(--wf-white);border:1px solid var(--wf-border);border-radius:8px;min-height:40px;padding:4px 8px;font-size:12px}.home-grid{grid-template-columns:1fr;gap:16px}.home-side-stack{grid-column:auto;display:flex;gap:16px}.home-financial-card{min-height:512px}.home-card{padding:24px}.home-metrics strong{font-size:24px}.home-chart{height:240px}.home-chart-column small{font-size:11px}.business-heading{gap:16px}.home-aging-row{gap:8px;font-size:12px}.home-aging-row strong{font-size:14px}.scope-notice{font-size:12px}.home-caption{font-size:12px}.home-control-stats span{font-size:12px}}
@media(max-width:600px){.masthead{height:112px;display:grid;grid-template-columns:1fr 48px;grid-template-rows:56px 48px;column-gap:16px;row-gap:0}.brand .wf-logo{width:160px}.header-tool{width:48px;min-width:48px;grid-column:2;grid-row:1;margin:0;padding:12px}.header-tool svg{width:24px;height:24px}.masthead nav{grid-column:1/-1;grid-row:2;gap:24px;justify-content:flex-start}.masthead nav a{font-size:14px}#app{min-height:calc(100vh - 112px);padding-top:24px}.modal-body .team-panel .team-grid{grid-template-columns:1fr}}

/* Priority is shown only on Next step: escalating urgency, or grey when handled. */
.tone-neutral,.tone-grey{--milestone-colour:#7A8288;--milestone-surface:#EEF0F2;--milestone-ink:#515B62}
.tone-mint{--milestone-colour:var(--wf-teal);--milestone-surface:var(--wf-mint);--milestone-ink:var(--wf-brand)}
.tone-amber{--milestone-colour:#B77909;--milestone-surface:#FFF3CF;--milestone-ink:#805500}
.tone-orange{--milestone-colour:#D45B14;--milestone-surface:#FFE9D8;--milestone-ink:#9A3F0D}
.tone-red{--milestone-colour:#D83C31;--milestone-surface:#FEE7E4;--milestone-ink:#B32920}
.tone-deep-red{--milestone-colour:#B42318;--milestone-surface:#B42318;--milestone-ink:var(--wf-white)}
.milestone-status{display:inline-flex;max-width:100%;padding:8px 12px;border-radius:8px;background:var(--milestone-surface);color:var(--milestone-ink);font-size:12px;font-weight:500;overflow-wrap:anywhere;vertical-align:middle}
.next-card h3.milestone-status{color:var(--milestone-ink);font-size:16px}
.milestone .day{background:var(--milestone-surface);color:var(--milestone-ink);box-shadow:inset 0 -4px var(--milestone-colour)}
.colour-swatch{display:inline-block;width:12px;height:12px;border-radius:50%;background:var(--milestone-colour);box-shadow:0 0 0 1px var(--wf-border);flex:none}
.milestone-colour-preview{min-height:48px;display:flex;align-items:center;gap:8px;padding:12px 16px;border-radius:8px;background:var(--milestone-surface);color:var(--milestone-ink);font-size:12px}
.next-card .milestone-context{display:flex;align-items:center;gap:8px;font-size:12px;margin:0 0 12px;color:var(--wf-body)}
@media(max-width:700px){.creditcontrol .milestone-status{padding:4px 8px;font-size:11px}}

/* Settings is a separate page with addressable sections. */
.header-tool.active{background:rgb(255 255 255 / .12)}
.settings-page{max-width:960px;margin-inline:auto}
.settings-page>h1{margin-bottom:24px}
.settings-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.settings-nav a{display:flex;align-items:center;justify-content:center;min-height:48px;padding:8px 16px;border-radius:8px;color:var(--wf-body);font-size:14px;line-height:1.5;text-align:center;text-decoration:none}
.settings-nav a:hover{color:var(--wf-teal)}
.settings-nav a.active{background:var(--wf-white);color:var(--wf-ink);box-shadow:0 1px 6px rgb(6 76 67 / .08);font-weight:500}
.settings-content{padding:32px;border:1px solid var(--wf-border);border-radius:16px;background:var(--wf-white)}
.settings-content>.intro,.settings-content form>.intro{font-size:14px;color:var(--wf-body);margin-bottom:24px}
.settings-content .plan-list{margin-top:0}
.settings-content .milestone:first-child{padding-top:0}
.settings-content .milestone-text{min-width:0}
.settings-content .plan-end{gap:24px}
.settings-content .plan-end .wf-button{flex:none}
#settings-form .form-actions{position:static;padding-bottom:0}
@media(max-width:700px){.settings-nav{grid-template-columns:repeat(2,minmax(0,1fr))}.settings-nav a{font-size:12px;padding:8px}.settings-content{padding:24px 16px;border-radius:12px}.settings-content .plan-end .wf-button{width:100%}.settings-content .milestone{gap:12px}.settings-content .day{width:56px}.settings-content .milestone .quiet{padding:8px 0}}

/* Each invoice owns its automatic chasing preference. */
.invoice-chasing{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:11px;color:var(--wf-body);min-height:36px;margin-top:4px;cursor:pointer;max-width:100%}
.switch--small{width:36px;height:20px}
.switch--small .switch-track{height:20px}
.switch--small .switch-track:after{width:14px;height:14px}
.switch--small input:checked+.switch-track:after{transform:translateX(16px)}
.invoice-chasing-setting{padding:16px 0;margin-top:16px;border-block:1px solid var(--wf-mint)}
.invoice-chasing-detail{cursor:pointer;align-items:flex-start}
.invoice-chasing-detail>.switch{margin-top:4px}
.invoice-chasing-detail>.switch input:disabled{cursor:default}
.invoice-chasing-detail>.switch input:disabled+.switch-track{opacity:.5}
@media(max-width:700px){.invoice-chasing{gap:8px;font-size:11px;min-height:32px}.creditcontrol td:nth-child(5){display:flex;flex-direction:column;align-items:center;justify-content:center}.invoice-chasing-detail{font-size:12px}}

@media(max-width:700px){html{--app-header-height:72px}}
@media(max-width:600px){html{--app-header-height:112px}}

/* Equal status boxes, with the actual agreement visible on every screen. */
.creditcontrol .milestone-status{display:flex;align-items:center;justify-content:center;width:100%;height:64px;min-height:64px;max-height:64px;padding:4px 8px;text-align:center}
.next-step-label{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;max-width:100%}
.creditcontrol td.next-step .secondary-line{display:block;width:100%;overflow-wrap:anywhere}
.creditcontrol td.next-step .next-step-date{font-weight:500;color:var(--wf-ink)}
.creditcontrol td.next-step .next-step-note{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.next-card .next-step-date{font-weight:500;color:var(--wf-ink);margin-bottom:4px}
.agreed-plan-note{white-space:pre-wrap}

/* Local bank review: recognise, allocate, then post to the invoice's software. */
.bank-page{max-width:960px;margin-inline:auto}
.bank-heading{display:flex;align-items:center;justify-content:space-between;gap:24px}
.bank-heading .help{font-size:14px}
.bank-day{display:flex;align-items:center;gap:16px;margin-top:24px;flex-wrap:wrap;font-size:14px;color:var(--wf-body)}
.bank-day .input{width:176px;min-height:40px;padding:8px 12px}
.bank-day .help{margin:0}
.bank-totals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;padding:32px 0}
.bank-totals strong{display:block;font-size:28px;line-height:1.4;font-weight:500;letter-spacing:-.02em}
.bank-totals span{display:block;font-size:12px;color:var(--wf-body);margin-top:4px}
.bank-guide{font-size:14px;color:var(--wf-body);margin-bottom:24px}
.bank-transactions{display:grid;gap:16px}
.bank-transaction{border:1px solid var(--wf-border);border-radius:16px;padding:24px;background:var(--wf-white);scroll-margin-top:calc(var(--app-header-height) + 24px)}
.bank-highlight{border-color:var(--wf-teal);box-shadow:0 0 0 2px var(--wf-mint)}
.bank-transaction-top{display:flex;justify-content:space-between;align-items:flex-start;gap:24px}
.bank-time{display:block;font-size:12px;color:var(--wf-body);margin-bottom:4px}
.bank-transaction h2{font-size:16px;font-weight:500;line-height:1.6}
.bank-reference{font-size:12px;color:var(--wf-body);margin-top:4px;overflow-wrap:anywhere}
.bank-money{text-align:right;flex:none}
.bank-money strong{font-size:20px;font-weight:500;display:block;font-variant-numeric:tabular-nums}
.bank-status{font-size:11px;display:inline-block;background:var(--wf-surface);color:var(--wf-body);padding:4px 8px;border-radius:8px;margin-top:8px}
.bank-status-posted{background:var(--wf-mint);color:var(--wf-brand)}
.bank-match,.bank-post{display:flex;align-items:center;justify-content:space-between;gap:24px;border-top:1px solid var(--wf-mint);margin-top:16px;padding-top:16px}
.bank-match p{font-size:14px}
.bank-match span,.bank-post>span{display:block;font-size:12px;color:var(--wf-body);margin-top:4px}
.bank-match .wf-button,.bank-post .wf-button{font-size:14px;flex:none;min-height:44px;padding:8px 16px}
.bank-allocation{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid var(--wf-mint);margin-top:16px;padding-top:16px;font-size:14px}
.bank-allocation>div{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px}
.bank-invoice-link{border:0;background:none;color:var(--wf-teal);padding:0;min-height:32px;font-size:14px;text-decoration:underline;text-underline-offset:4px}
.bank-allocation-state{color:var(--wf-body);font-size:12px}
.bank-remove{min-width:40px;min-height:40px;padding:8px;flex:none}
.bank-outgoing{font-size:12px;color:var(--wf-body);margin-top:16px}
.bank-warning{display:flex;flex-direction:column;align-items:flex-start;gap:4px;width:100%;padding:8px;margin-top:8px;border:1px solid #E9D59D;background:#FFF8E6;color:#805500;border-radius:8px;text-align:left;line-height:1.4;font-size:11px;overflow-wrap:anywhere}
.bank-warning small{font-size:10px;line-height:1.5;color:#805500}
.bank-warning:hover{border-color:#B77909;background:#FFF3CF}
.drawer-content>.bank-warning{padding:12px 16px;font-size:14px;margin-top:16px}
.drawer-content>.bank-warning small{font-size:12px}
.accounting-status{font-size:12px;color:var(--wf-teal);background:var(--wf-surface);padding:12px 16px;border-radius:8px;margin-bottom:16px}
@media(max-width:700px){.bank-heading{gap:12px;align-items:flex-start}.bank-heading .quiet{font-size:12px;padding:8px}.bank-heading .help{font-size:12px}.bank-totals{gap:12px;padding:24px 0}.bank-totals strong{font-size:20px}.bank-totals span{font-size:11px}.bank-guide{font-size:12px}.bank-transaction{padding:16px;border-radius:12px}.bank-transaction-top{gap:12px}.bank-transaction h2{font-size:14px}.bank-money strong{font-size:16px}.bank-match,.bank-post{flex-direction:column;align-items:stretch;gap:12px}.bank-match .wf-button,.bank-post .wf-button{width:100%}.bank-match p{font-size:12px}.bank-warning{margin-top:8px}.bank-day{gap:8px 12px;font-size:12px}}
