/* Constructicore dashboard. Loaded after site.css, whose brand tokens and components it reuses. */

body.app{background:var(--color-bg)}
[hidden]{display:none!important}
.app-header{background:var(--color-card);border-bottom:1px solid var(--color-border);position:sticky;top:0;z-index:50}
.app-bar{height:64px;display:flex;align-items:center;gap:var(--space-8)}
.app-bar .brand img{height:28px;width:auto}
.app-nav{display:flex;gap:var(--space-6);font-weight:500;font-size:var(--text-sm)}
.app-nav a{padding:6px 0;white-space:nowrap}
.app-nav a[aria-current="page"]{color:var(--color-primary);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:8px}
.app-user{position:relative;flex-shrink:0}
.app-user summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);font-weight:500;white-space:nowrap;padding:3px 10px 3px 3px;border-radius:999px}
.app-user summary:hover,.app-user[open] summary{background:var(--color-bg)}
.app-user summary.is-current .app-user-name{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px}
.app-user-who{margin:0;line-height:1.4}
.app-user-head{margin:var(--space-2) 0 0;padding-top:var(--space-2);border-top:1px solid var(--color-border);font-size:var(--text-xs);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--color-text-muted)}
.app-user-menu a[aria-current="page"]{font-weight:600;color:var(--color-primary)}
.app-user summary::-webkit-details-marker{display:none}
.avatar{flex:0 0 32px;width:32px;height:32px;border-radius:50%;background:var(--color-primary);color:var(--color-on-primary);display:grid;place-items:center;font-weight:600;font-size:var(--text-xs)}
.app-user-menu{position:absolute;right:0;top:44px;background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-card);padding:var(--space-4);min-width:220px;display:flex;flex-direction:column;gap:var(--space-2);font-size:var(--text-sm)}
.app-user-menu a:hover{text-decoration:underline}
.linklike{background:none;border:0;padding:0;font:inherit;color:var(--color-primary);text-decoration:underline;cursor:pointer;text-align:left}
.app-main{padding-block:var(--space-6) var(--space-16)}
.app-main .crumbs{padding-top:0;margin-bottom:var(--space-4)}

.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--space-5);flex-wrap:wrap;margin-bottom:var(--space-6)}
.page-title{font-size:clamp(1.6rem,3vw,2.1rem);margin:0;display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap;letter-spacing:-.02em;line-height:1.15}
.head-actions,.inline-form{display:flex;gap:var(--space-3);align-items:center;flex-wrap:wrap}
.inline-form input[type=date]{min-height:var(--control-height);border:1.5px solid var(--color-border);border-radius:var(--radius-sm);padding:0 10px;font:inherit}
.section-title{font-size:var(--text-xl);margin:var(--space-8) 0 var(--space-4);letter-spacing:0}
.sub-h{font-size:var(--text-lg);margin:var(--space-6) 0 var(--space-3)}
.card + .card{margin-top:var(--space-5)}
.card p{font-size:var(--text-sm)}
.form-card{margin-bottom:var(--space-5)}
.form-actions{display:flex;gap:var(--space-3);align-items:center;flex-wrap:wrap;margin-top:var(--space-5)}
.stack{display:flex;flex-direction:column;gap:var(--space-4)}
.fg-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.fg-3 .s2{grid-column:span 2}
.fg-3 .s3{grid-column:1/-1}
.check-field{display:flex;align-items:center;gap:var(--space-2);font-weight:400}
.check-field input{width:18px;height:18px;min-height:0}
.inline-label{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);font-weight:600}
.inline-label input{min-height:38px;border:1.5px solid var(--color-border);border-radius:var(--radius-sm);padding:0 10px;font:inherit}
.alert-ok{background:var(--cc-success-tint);border:1px solid var(--cc-success);color:var(--cc-success-text);font-weight:600;border-radius:var(--radius-sm);padding:var(--space-3) var(--space-4);margin-bottom:var(--space-5);font-size:var(--text-sm)}
.alert-warn{background:var(--cc-warning-tint);border:1px solid var(--cc-warning);color:var(--cc-warning-text);font-weight:600;border-radius:var(--radius-sm);padding:var(--space-3) var(--space-4);margin-bottom:var(--space-5);font-size:var(--text-sm)}
.error-list{margin:var(--space-2) 0 0 var(--space-5);font-weight:400}
.muted-text{color:var(--color-text-muted)}
.small-note{font-size:var(--text-xs)}
.plain-list{list-style:none;display:flex;flex-direction:column;gap:4px}
.num{font-family:var(--font-body);font-variant-numeric:tabular-nums}
.neg{color:var(--cc-error-text)}
code{font-family:var(--font-code);font-size:.9em;background:var(--color-bg);padding:1px 6px;border-radius:4px}

/* sign-in */
.auth-card{max-width:440px;margin:var(--space-12) auto}
.auth-title{font-size:var(--text-2xl);margin:0 0 var(--space-1)}
.auth-card .muted-text{margin-bottom:var(--space-5)}

/* toolbar, tabs and search */
.toolbar{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);flex-wrap:wrap;margin-bottom:var(--space-4)}
.tabs{display:flex;gap:var(--space-2);border-bottom:1px solid var(--color-border)}
.tabs a{padding:10px 14px;font-weight:600;font-size:var(--text-sm);color:var(--color-text-muted);border-bottom:3px solid transparent;margin-bottom:-1px}
.tabs a[aria-current="page"]{color:var(--color-primary);border-bottom-color:var(--color-primary)}
.page-tabs{margin:var(--space-8) 0 var(--space-4);overflow-x:auto}
.search input{min-height:var(--control-height);min-width:320px;border:1.5px solid var(--color-border);border-radius:var(--radius-sm);padding:0 14px;font:inherit;background:var(--color-card)}

/* project and subcontract rows */
.project-list{display:flex;flex-direction:column;gap:var(--space-3)}
.project-row,.sc-row{display:flex;align-items:center;gap:var(--space-5);padding:var(--space-5) var(--space-6)}
.card + .project-row,.project-list .card + .card{margin-top:0}
.project-main,.sc-main{flex:1;display:flex;flex-direction:column;gap:4px;min-width:0}
.project-name{font-family:var(--font-display);font-weight:700;font-size:var(--text-lg);color:var(--color-primary)}
.project-main:hover .project-name,a.sc-row:hover .project-name{text-decoration:underline}
.stats{display:flex;gap:var(--space-8)}
.stats div{min-width:110px}
.stats dt{font-family:var(--font-body);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-muted);font-variant-numeric:tabular-nums}
.stats dd{font-weight:600;margin-top:2px}
.fav{background:none;border:0;cursor:pointer;padding:4px}
.fav svg{width:22px;height:22px;fill:none;stroke:var(--color-text-muted);stroke-width:1.6}
.fav.on svg{fill:var(--cc-warning);stroke:var(--cc-warning)}
.empty{text-align:center;padding:var(--space-10)}
.archive-form{margin-top:var(--space-6)}

/* progress meter */
progress.meter{appearance:none;-webkit-appearance:none;width:100%;height:8px;border:0;border-radius:var(--radius-pill);background:var(--color-border);overflow:hidden;margin:var(--space-2) 0}
progress.meter::-webkit-progress-bar{background:var(--color-border);border-radius:var(--radius-pill)}
progress.meter::-webkit-progress-value{background:var(--color-primary);border-radius:var(--radius-pill)}
progress.meter::-moz-progress-bar{background:var(--color-primary);border-radius:var(--radius-pill)}

/* summary cards */
.summary-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-5);margin-top:var(--space-5);align-items:start}
.summary-grid .card + .card,.admin-stats .card + .card,.split-cards > .card + .card,.plan-choice > .card + .card{margin-top:0}
.headline{display:flex;flex-wrap:wrap;gap:var(--space-8);padding:var(--space-5) var(--space-6)}
.headline div{display:flex;flex-direction:column;gap:4px}
.big{font-size:var(--text-xl);font-weight:500;color:var(--color-text)}
.strong-num{color:var(--color-primary);font-weight:600}

/* data tables */
.data-table{width:100%;border-collapse:collapse;font-size:var(--text-sm);background:var(--color-card)}
.data-table th,.data-table td{padding:10px 10px;border-bottom:1px solid var(--color-border);text-align:left;vertical-align:middle}
.data-table thead th{font-family:var(--font-body);font-weight:500;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-muted);font-variant-numeric:tabular-nums}
.data-table .num,.data-table th.num{text-align:right}
.data-table .center{text-align:center}
.data-table tbody tr:hover{background:var(--color-bg)}
.data-table a{color:var(--color-primary);font-weight:600;text-decoration:underline}
.data-table tfoot th{font-weight:600}
.group-row th{background:var(--color-bg);font-family:var(--font-display);font-weight:700;color:var(--color-primary);font-size:var(--text-sm)}
tr.over td{background:var(--cc-warning-tint)}
.edit-table input,.app-lines input{width:100%;min-height:36px;border:1.5px solid var(--color-border);border-radius:6px;padding:4px 8px;font:inherit;background:var(--color-card)}
.edit-table input[readonly]{background:var(--color-bg);color:var(--color-text-muted)}
.edit-table input[type=checkbox]{width:18px;height:18px;min-height:0}
.w-ref{max-width:90px}
.w-pct{max-width:80px}
.w-money{max-width:140px}
input.num{text-align:right}
.row-edit summary{cursor:pointer;color:var(--color-primary);font-weight:600;font-size:var(--text-sm)}
.row-edit[open]{margin-top:var(--space-3)}
.row-edit .stack{margin-top:var(--space-3);min-width:240px}
.row-edit label{display:flex;flex-direction:column;gap:4px;font-size:var(--text-xs);font-weight:600}
.row-edit select,.row-edit input:not([type=checkbox]){min-height:36px;border:1.5px solid var(--color-border);border-radius:6px;padding:4px 8px;font:inherit}
.line-cert{flex-direction:row!important;justify-content:space-between;align-items:center;gap:var(--space-3);padding:6px 0;border-bottom:1px solid var(--color-border)}
.derivation{margin-top:var(--space-4)}
.derivation summary{cursor:pointer;color:var(--color-primary);font-weight:600;font-size:var(--text-sm)}
.derivation ul{margin-top:var(--space-3)}
.scope-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-2)}

/* secrets shown once */
.secret-card{border:2px solid var(--cc-success);margin-bottom:var(--space-5)}
.secret-card td.secret{font-size:var(--text-base);user-select:all;word-break:break-all;white-space:normal;text-align:left}
.note-text{margin-top:var(--space-4)}

.readonly-bar{position:fixed;bottom:0;left:0;right:0;background:var(--cc-warning-tint);border-top:1px solid var(--cc-warning);color:var(--cc-warning-text);text-align:center;padding:var(--space-3);font-weight:600;font-size:var(--text-sm)}

@media (max-width:960px){
	.project-row,.sc-row{flex-direction:column;align-items:stretch}
	.stats{flex-wrap:wrap;gap:var(--space-4)}
	.summary-grid,.fg-3{grid-template-columns:minmax(0,1fr)}
	.fg-3 .s2,.fg-3 .s3{grid-column:auto}
	.search input{min-width:0;width:100%}
	.search{width:100%}
	.app-bar{gap:var(--space-4)}
	.app-user-name{display:none}
	.scope-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:620px){
	.app-bar{gap:var(--space-4)}
	.app-bar .brand img{height:28px;width:28px}
	.app-nav{gap:var(--space-4)}
	.page-head .btn{width:100%}
	.headline{gap:var(--space-5)}
}

/* CSA paste from Excel */
.paste-card summary{cursor:pointer;list-style:none;margin:0}
.paste-card summary::-webkit-details-marker{display:none}
.paste-card summary::before{content:"+ ";font-family:var(--font-body);color:var(--color-primary);font-variant-numeric:tabular-nums}
.paste-card[open] summary::before{content:"\2212 "}
.paste-card[open] summary{margin-bottom:var(--space-3)}
.paste-box{width:100%;min-height:160px;font-family:var(--font-code);font-size:var(--text-sm);border:1.5px solid var(--color-border);border-radius:var(--radius-sm);padding:var(--space-3);tab-size:16;white-space:pre;overflow-x:auto;background:var(--color-card)}
.paste-box:focus{border-color:var(--color-primary);outline:3px solid var(--color-focus);outline-offset:1px}

.dirty-note{font-size:var(--text-sm);font-weight:600;color:var(--cc-warning-text);background:var(--cc-warning-tint);padding:4px 10px;border-radius:var(--radius-pill)}

/* payment calendar */
.cal-section{border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4) var(--space-5) var(--space-5);margin-top:var(--space-5)}
.cal-section legend{font-family:var(--font-display);font-weight:700;color:var(--color-primary);padding:0 var(--space-2)}
.calendar-form .field textarea{font-family:var(--font-body);font-variant-numeric:tabular-nums}
details.card > summary.card-h{cursor:pointer;list-style:none;margin:0;display:flex;align-items:center;gap:var(--space-3)}
details.card > summary.card-h::-webkit-details-marker{display:none}
details.card > summary.card-h::before{content:"+";font-family:var(--font-body);color:var(--color-primary);font-variant-numeric:tabular-nums}
details.card[open] > summary.card-h::before{content:"\2212"}
details.card[open] > summary.card-h{margin-bottom:var(--space-4)}
.periods-table td[title]{cursor:help;text-decoration:underline dotted var(--color-border);text-underline-offset:4px}
.periods-table tr.state-next td{background:var(--color-bg);font-weight:600}
.periods-table tr.state-missed td{background:var(--cc-error-tint)}
.next-period{max-width:280px}
.period-card{margin-bottom:var(--space-5)}
.period-dates{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--space-4);margin-top:var(--space-3)}
.period-dates dt{font-family:var(--font-body);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-muted);font-variant-numeric:tabular-nums}
.period-dates dd{font-weight:600;margin-top:2px;font-size:var(--text-sm)}
@media (max-width:960px){.period-dates{grid-template-columns:repeat(2,minmax(0,1fr))}}

.update-bar{background:var(--cc-warning-tint);border-bottom:1px solid var(--cc-warning);color:var(--cc-warning-text);text-align:center;padding:var(--space-3);font-weight:600;font-size:var(--text-sm)}
.update-bar a{text-decoration:underline}
.form-actions-inline{justify-content:flex-end}
.form-actions-inline .btn{margin-top:auto}

/* Company and contractor logos, contacts, team */
.logo-row{display:flex;gap:var(--space-5);align-items:flex-start;flex-wrap:wrap}
.logo-box{width:220px;max-width:100%;height:110px;border:1px dashed var(--color-border);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;background:var(--color-card);padding:var(--space-3)}
.logo-box img{max-width:100%;max-height:100%;object-fit:contain}
.logo-row>div:last-child{flex:1;min-width:240px}
.client-row{display:flex;gap:var(--space-4);align-items:center;margin-bottom:var(--space-4)}
.client-logo{max-width:120px;max-height:48px;object-fit:contain}
.sub-form{margin:var(--space-4) 0}
.sub-form>summary{cursor:pointer;margin-bottom:var(--space-3)}
.row-actions{text-align:right;white-space:nowrap}
.row-actions form{display:inline-block;margin-left:var(--space-3)}
.btn-sm{padding:4px 10px;font-size:var(--text-sm)}
.check-field label{display:flex;gap:var(--space-2);align-items:center;font-weight:400}
.send-block{display:flex;flex-direction:column;gap:var(--space-1)}
.send-block .alert{margin:0}
.trace{white-space:pre-wrap;word-break:break-all;font-size:var(--text-sm);max-height:320px;overflow:auto;background:var(--color-bg);padding:var(--space-3)}

/* Shared application view (/a/{token}) */
.share-logos{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);margin-bottom:var(--space-5);min-height:48px}
.share-logos img{max-height:56px;max-width:45%;object-fit:contain}
.share-name{font-family:Archivo,sans-serif;font-size:1.5rem;color:var(--color-primary)}
.share-stats{margin:var(--space-3) 0}
.share-bar{display:block;width:100%;height:14px;margin-top:var(--space-3)}
.share-bar .seg-left{fill:var(--color-border)}
.share-bar .seg-prev{fill:var(--cc-navy)}
.share-bar .seg-this{fill:var(--cc-sky)}
.legend{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-4);align-items:center;margin-top:var(--space-2)}
.key{display:inline-block;width:10px;height:10px;margin-right:4px}
.key-prev{background:var(--cc-navy)}
.key-this{background:var(--cc-sky)}
.key-left{background:var(--color-border)}
.share-chart{display:block;width:100%;height:auto;max-height:320px}
.share-chart .grid{stroke:var(--color-border);stroke-width:.15}
.share-chart .axis{stroke:var(--color-text-muted);stroke-width:.3}
.share-chart .bar{fill:var(--cc-sky)}
.share-chart .bar-this{fill:var(--cc-navy)}
.share-chart text{font-size:2.1px;text-anchor:middle;fill:var(--color-text-muted);font-family:"IBM Plex Sans",sans-serif}
.share-chart text.this{fill:var(--cc-navy);font-weight:600}
.share-foot{margin-top:var(--space-6)}
.share-card{display:flex;gap:var(--space-5);align-items:flex-start;flex-wrap:wrap}
.share-card>div:first-child{flex:1;min-width:240px}
.share-url{flex:1;min-width:280px}
.share-url input{width:100%;font-family:var(--font-body);font-size:var(--text-sm)}

/* Billing */
.plan-choice{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-5);align-items:start;margin-bottom:var(--space-4)}
.plan-buttons{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:auto;padding-top:var(--space-4)}
@media (max-width:760px){.plan-choice{grid-template-columns:minmax(0,1fr)}}

/* Sign-up and getting started */
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.getting-started .steps{margin:var(--space-3) 0 0 var(--space-5);display:flex;flex-direction:column;gap:var(--space-2)}
.getting-started .steps li.done{color:var(--color-text-muted)}

/* Notifications */
.bell{flex-shrink:0;margin-left:auto;position:relative;display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;color:var(--color-primary)}
.bell svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.bell:hover,.bell[aria-current]{background:var(--color-bg)}
.bell-count{position:absolute;top:2px;right:0;min-width:18px;height:18px;padding:0 4px;border-radius:9px;background:var(--cc-error);color:#fff;font-size:11px;font-weight:700;line-height:18px;text-align:center}
.notice-list{list-style:none;display:flex;flex-direction:column}
.notice-list li{padding:var(--space-4) 0;border-bottom:1px solid var(--color-border)}
.notice-list li:last-child{border-bottom:0}
.notice-list li.unread strong{color:var(--color-primary)}
.notice-list p{margin-top:var(--space-2)}

/* Notices and payment */
.position-table{margin-bottom:var(--space-4)}
.notice-actions{display:flex;flex-direction:column}
.letter-option{padding:var(--space-3) 0;border-top:1px solid var(--color-border)}
.letter-option .inline-form{flex-wrap:wrap;gap:var(--space-3);align-items:center}
.other-letter{margin-top:var(--space-3);gap:var(--space-2)}
.void-form{display:inline-flex;gap:var(--space-2);align-items:center}
.void-form input{width:9rem;padding:2px 6px;font-size:var(--text-sm)}
tr.voided td{color:var(--color-text-muted);text-decoration:line-through}
tr.voided td:last-child{text-decoration:none}

/* Admin console */
.admin-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(175px,1fr));gap:var(--space-4);margin-bottom:var(--space-5)}
.admin-stats .card{display:flex;flex-direction:column;gap:var(--space-1)}
.view-as-bar{background:var(--cc-warning-tint);color:var(--cc-warning-text);padding:var(--space-2) var(--space-4);text-align:center;font-weight:600;font-size:var(--text-sm)}
.view-as-bar .inline-form{display:inline}
.demo-bar{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--space-2) var(--space-4);background:var(--color-card);border-bottom:3px solid var(--cc-sky);color:var(--color-text);padding:var(--space-2) var(--space-4);font-size:var(--text-sm)}
.demo-bar .inline-form{display:inline}
.view-as-bar.acting{background:var(--cc-error-tint);color:var(--cc-error-text)}
.act-as summary{list-style:none;cursor:pointer}
.act-as summary::-webkit-details-marker{display:none}
.act-as[open] form{margin-top:var(--space-2);max-width:22rem;text-align:left}

/* Clock and site tablet */
.clock{max-width:520px;margin:0 auto;display:flex;flex-direction:column;gap:var(--space-4)}
.clock-card{text-align:center;display:flex;flex-direction:column;gap:var(--space-3)}
.clock-card.on{border:2px solid var(--cc-success)}
.clock-where{font-family:Archivo,sans-serif;font-size:1.5rem;font-weight:700;color:var(--color-primary)}
.clock-since{color:var(--color-text-muted)}
.clock-btn{width:100%;min-height:64px;font-size:1.25rem}
.clock-card .field{text-align:left}
.clock-week li{display:flex;justify-content:space-between;gap:var(--space-3);flex-wrap:wrap;padding:var(--space-2) 0;border-bottom:1px solid var(--color-border)}
.clock-privacy{text-align:center}
.kiosk{max-width:640px;margin:0 auto}
.kiosk-head{text-align:center;margin-bottom:var(--space-4)}
.kiosk-names{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:var(--space-3);border:0;padding:0}
.kiosk-names legend{font-weight:600;margin-bottom:var(--space-3)}
.kiosk-name{display:block;cursor:pointer;position:relative}
.kiosk-name input{position:absolute;opacity:0}
.kiosk-name span{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:72px;padding:var(--space-3);border:2px solid var(--color-border);border-radius:var(--radius-sm);font-weight:600;text-align:center;background:var(--color-card)}
.kiosk-name small{font-weight:400;color:var(--color-text-muted)}
.kiosk-name input:checked + span{border-color:var(--color-primary);background:var(--color-bg)}
.kiosk-name input:focus-visible + span{outline:3px solid var(--cc-sky);outline-offset:2px}
.ts-grid td,.ts-grid th{white-space:nowrap}
.ts-entry{padding:var(--space-4) 0;border-bottom:1px solid var(--color-border)}
.ts-entry-head{display:flex;justify-content:space-between;gap:var(--space-3);flex-wrap:wrap;align-items:center;margin-bottom:var(--space-3)}
.ts-fields{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.ts-hours{display:block;padding-top:8px;font-weight:600}
.ts-actions{display:flex;gap:var(--space-4);align-items:center;margin-top:var(--space-2)}

/* Narrower screens: the menu gets its own row and scrolls sideways (six links plus the logo need about 1060px) */
@media (max-width:1060px){
	.app-bar{height:auto;flex-wrap:wrap;padding-block:var(--space-2);row-gap:var(--space-1)}
	.app-nav{order:3;width:100%;overflow-x:auto;white-space:nowrap;padding-bottom:var(--space-2);scrollbar-width:none}
	.app-nav::-webkit-scrollbar{display:none}
	.bell{margin-left:auto}
	.bell + .app-user{margin-left:0}
}
.kiosk-head .page-title{text-align:center}
.search select{padding:8px 12px;border:1px solid var(--color-border);border-radius:var(--radius-sm);font:inherit;font-size:var(--text-sm);background:var(--color-card);color:var(--color-text)}

/* Setup wizard */
.wizard-steps{list-style:none;margin:0 0 var(--space-5);padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-2)}
.wizard-steps a{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3);border-radius:var(--radius-sm);border:1px solid var(--color-border);background:var(--color-card);color:var(--color-text);text-decoration:none;font-weight:600;font-size:var(--text-sm)}
.wizard-steps .current a{border-color:var(--color-primary);box-shadow:inset 0 -3px 0 var(--color-primary)}
.wizard-steps .done a{color:var(--color-text-muted)}
.wizard-num{display:inline-flex;align-items:center;justify-content:center;flex:none;width:26px;height:26px;border-radius:50%;background:var(--color-bg);color:var(--color-primary);font-family:var(--font-body);font-variant-numeric:tabular-nums}
.wizard-steps .current .wizard-num{background:var(--color-primary);color:var(--color-on-primary)}
.wizard-steps .done .wizard-num{background:var(--cc-success-tint);color:var(--cc-success-text)}
textarea.mono{font-family:var(--font-code);font-size:var(--text-sm);width:100%}
@media (max-width:760px){.wizard-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
.wizard-note{margin-bottom:var(--space-4)}
.wizard-note a{color:var(--color-primary);text-decoration:underline}

/* Certification from the client's schedule */
.line-cert{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,14rem);gap:var(--space-2);align-items:center;padding:var(--space-1) 0}
.cert-note-input{min-height:34px;border:1.5px solid var(--color-border);border-radius:var(--radius-sm);padding:0 8px;font:inherit;font-size:var(--text-sm)}
.cert-note{color:var(--cc-warning-text)}
@media (max-width:760px){.line-cert{grid-template-columns:minmax(0,1fr) auto}.cert-note-input{grid-column:1/-1}}

/* Main contractor portal */
.stats-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:var(--space-4);margin-bottom:var(--space-5)}
.stats-row .card{display:flex;flex-direction:column;gap:var(--space-1)}
.plain-list{margin:var(--space-3) 0 var(--space-5) var(--space-5);display:flex;flex-direction:column;gap:var(--space-2)}
.stats-row{align-items:stretch}
.stats-row .card{margin:0}
.stats-row .stat-text{font-weight:600;color:var(--color-primary)}

/* Package invitation */
.join-wrap{max-width:1100px;margin:0 auto}
.join-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:var(--space-5);align-items:start}
.kicker-text{font-family:var(--font-body);font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-muted);margin-bottom:var(--space-2);font-variant-numeric:tabular-nums}
.facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3) var(--space-5);margin-bottom:var(--space-5)}
.facts dt{font-size:var(--text-xs);color:var(--color-text-muted)}
.facts dd{font-weight:600;margin:0}
.join-accept{position:sticky;top:calc(80px + env(safe-area-inset-top, 0px))}
.invite-card .stack{margin-top:var(--space-3)}
@media (max-width:860px){.join-grid{grid-template-columns:minmax(0,1fr)}.join-accept{position:static}}
.sponsor-bar{background:var(--cc-success-tint);border-bottom:1px solid var(--cc-line);color:var(--cc-success-text);padding:var(--space-2) var(--space-4);text-align:center;font-size:var(--text-sm)}
.sponsor-bar .linklike{color:var(--cc-success-text);font-weight:600}
.linked-note{margin-top:var(--space-2);font-size:var(--text-sm)}

/* Assessment */
.assess-table .w-reason{min-width:12rem;width:100%;min-height:34px;border:1.5px solid var(--color-border);border-radius:var(--radius-sm);padding:0 8px;font:inherit;font-size:var(--text-sm)}
.assess-table tr.reduced td{background:var(--cc-warning-tint)}
.split-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-5);align-items:start;margin-top:var(--space-5)}
.money-table{width:100%;border-collapse:collapse;font-size:var(--text-sm)}
.money-table th{text-align:left;font-weight:500;padding:8px 0;border-bottom:1px solid var(--color-border)}
.money-table td{padding:8px 0;border-bottom:1px solid var(--color-border)}
.money-table tr.muted{color:var(--color-text-muted)}
.money-table tr.total th,.money-table tr.total td{font-weight:700;color:var(--color-primary);border-bottom:2px solid var(--color-primary)}
@media (max-width:860px){.split-cards{grid-template-columns:minmax(0,1fr)}}
.split-cards .card{margin:0}

/* Exchange messages */
.thread{list-style:none;display:flex;flex-direction:column;gap:var(--space-3);margin-bottom:var(--space-4);max-height:28rem;overflow:auto}
.thread li{padding:var(--space-3);border-radius:var(--radius-sm);background:var(--color-bg)}
.thread li.mine{background:var(--cc-success-tint)}
.thread-meta{font-size:var(--text-xs);color:var(--color-text-muted);margin-bottom:var(--space-1)}
.thread p{font-size:var(--text-sm)}

/* Sample project */
.sample-offer{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2) var(--space-3);margin-top:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--color-border)}
.sample-offer .small-note{flex-basis:100%}
.sample-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-3);font-size:var(--text-sm)}
.early-form{margin-top:var(--space-5);padding-top:var(--space-5);border-top:1px solid var(--color-border)}
.early-banner{border-left:4px solid var(--cc-success)}
.field > .label{font-size:var(--text-sm);font-weight:600;color:var(--color-text)}
.field > .check-field{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:var(--space-2);min-height:var(--control-height);font-weight:400}
.field > .check-field input{width:auto;min-height:0}
.revision-banner{border-left:4px solid var(--cc-warning)}
.revision-banner .data-table{margin-top:var(--space-3)}

/* Companies House lookup */
.ch-results{position:absolute;left:0;right:0;top:100%;z-index:20;list-style:none;margin:2px 0 0;padding:4px 0;background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-sm);box-shadow:var(--shadow-card);max-height:18rem;overflow:auto}
.ch-results li{padding:6px 10px;cursor:pointer;display:flex;flex-direction:column;gap:2px;font-size:var(--text-sm)}
.ch-results li:hover,.ch-results li:focus{background:var(--color-bg);outline:none}
.ch-results small{color:var(--color-text-muted)}
.ch-results .ch-note{cursor:default;color:var(--color-text-muted);font-size:var(--text-xs);border-top:1px solid var(--color-border)}
.ch-wrap{position:relative}

/* Two-factor sign-in */
.setup-steps { padding-left: 1.25rem; }
.setup-steps > li { margin-bottom: 1.25rem; }
.qr { margin: 0.75rem 0; }
.qr img { display: block; width: 200px; height: 200px; image-rendering: pixelated; background: #fff; }
.secret { word-spacing: 0.25rem; }
.recovery-codes { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr)); gap: 0.5rem; }
.recovery-codes code { font-family: var(--font-code); font-size: 1.05rem; }
.inline-form input:not([type=hidden]):not([type=date]):not([type=checkbox]):not([type=radio]){min-height:var(--control-height);border:1.5px solid var(--color-border);border-radius:var(--radius-sm);padding:0 10px;font:inherit}
.inline-form input[inputmode=numeric]{max-width:10rem;letter-spacing:.1em;font-variant-numeric:tabular-nums}

/* Line comment threads */
.line-comments{margin-top:var(--space-2);font-size:var(--text-sm)}
.line-comments summary{cursor:pointer;color:var(--color-primary);text-decoration:underline}
.line-comments ul{list-style:none;margin:var(--space-2) 0;padding:0;display:grid;gap:var(--space-2)}
.line-comments li{padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);background:var(--color-bg);border-left:3px solid var(--color-border)}
.line-comments li.lc-theirs{border-left-color:var(--cc-sky, var(--color-accent))}
.lc-who{display:block;font-size:var(--text-xs);color:var(--color-text-muted)}
.lc-text{display:block;white-space:normal}
.line-comments textarea{width:100%;min-width:14rem;border:1.5px solid var(--color-border);border-radius:var(--radius-sm);padding:6px 8px;font:inherit;margin:var(--space-2) 0}

/* Feedback */
.feedback-tab{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom, 0px));z-index:40;background:var(--color-primary);color:var(--color-on-primary);padding:8px 14px;border-radius:var(--radius-sm);font-weight:600;font-size:var(--text-sm);text-decoration:none;box-shadow:var(--shadow-card)}
.feedback-tab:hover,.feedback-tab:focus{text-decoration:underline}
.feedback-item.is-done{opacity:.7}
.feedback-message{white-space:normal;margin:var(--space-3) 0}
.fb-note{min-width:18rem}
@media print{.feedback-tab{display:none}}

/* Main contractor getting-started checklist */
.onboarding summary{cursor:pointer}
.onboarding .progress{height:6px;background:var(--color-border);border-radius:3px;overflow:hidden;margin:var(--space-2) 0 var(--space-4)}
.onb-bar{display:block;height:100%;background:var(--cc-success)}
.onb-0{width:0%}
.onb-10{width:10%}
.onb-20{width:20%}
.onb-30{width:30%}
.onb-40{width:40%}
.onb-50{width:50%}
.onb-60{width:60%}
.onb-70{width:70%}
.onb-80{width:80%}
.onb-90{width:90%}
.onb-100{width:100%}
.onboarding-steps{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-3)}
.onboarding-steps li{display:flex;gap:var(--space-3);align-items:flex-start}
.onb-mark{flex:none;width:22px;height:22px;border-radius:50%;border:2px solid var(--color-border);display:inline-flex;align-items:center;justify-content:center}
.onboarding-steps li.is-done .onb-mark{border-color:var(--cc-success);color:var(--cc-success-text)}
.onb-mark svg{width:14px;height:14px}
.onboarding-steps li.is-done s{color:var(--color-text-muted)}
.onboarding-steps a{color:var(--color-primary);text-decoration:underline;font-weight:600}
.onboarding .small-note{margin-top:var(--space-4)}

/* Sales CRM */
.crm-filter{margin:var(--space-4) 0}
.crm-filter input[type=search]{min-width:16rem}
.crm-timeline{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-3)}
.crm-contact{margin-bottom:var(--space-5)}
.crm-contact-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:var(--space-3) var(--space-5);margin:0 0 var(--space-3)}
.crm-contact-list dt{font-size:var(--text-sm);font-weight:600;color:var(--color-text-muted)}
.crm-contact-list dd{margin:0}
.crm-contact-list .chip{margin-left:var(--space-2)}
.tps-detail{display:block;margin-top:var(--space-1)}
.nowrap{white-space:nowrap}
.crm-timeline li{padding:var(--space-2) var(--space-3);border-left:3px solid var(--color-border);background:var(--color-bg);border-radius:var(--radius-sm)}
.crm-timeline strong{display:block}
.sales-resources summary{cursor:pointer}
.resources-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--space-5);margin-top:var(--space-3)}
.resources-grid .plain-list li{margin-bottom:var(--space-2)}

/* Alerts: visible links, and a next-step button */
.alert a:not(.btn){color:inherit;text-decoration:underline;font-weight:700}
.alert-with-next{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);flex-wrap:wrap}
.alert-next{flex:none}

/* Application autosave and figures */
.autosave-note{font-size:var(--text-sm);color:var(--color-text-muted)}
.autosave-note.is-saved{color:var(--cc-success-text)}
.autosave-note.is-offline{color:var(--cc-warning-text);font-weight:600}
.autosave-note.is-error{color:var(--cc-error-text);font-weight:600}
.cum-input[tabindex="-1"]:not(:focus){background:var(--color-bg);color:var(--color-text-muted)}
.prev-pct{color:var(--color-text-muted);background:var(--color-bg)}

/* Progress sliders on applications */
.entry-mode{display:flex;align-items:center;gap:var(--space-3);margin:var(--space-3) 0}
.segmented{display:inline-flex;border:1.5px solid var(--color-border);border-radius:var(--radius-sm);overflow:hidden}
.segmented button{background:var(--color-card);border:0;padding:8px 14px;font:inherit;font-size:var(--text-sm);font-weight:600;color:var(--color-text-muted);cursor:pointer}
.segmented button + button{border-left:1.5px solid var(--color-border)}
.segmented button[aria-pressed="true"]{background:var(--color-primary);color:var(--color-on-primary)}
.segmented button:focus-visible{outline:3px solid var(--color-focus);outline-offset:-3px}
.pct-slider{display:none}
.mode-sliders .pct-slider{display:block;width:100%;min-width:9rem;margin:0 0 6px;accent-color:var(--color-primary);height:28px}
.mode-sliders .w-pct{width:4.5rem}
/* Phone, slider mode: each line is a card */
@media (max-width:700px){
	.mode-sliders .app-lines-edit thead{display:none}
	.mode-sliders .app-lines-edit,.mode-sliders .app-lines-edit tbody{display:block;width:100%}
	.mode-sliders .table-scroll:has(.app-lines-edit){overflow-x:visible}
	.mode-sliders .app-lines-edit tr{display:grid;grid-template-columns:auto 1fr 1fr;gap:4px 12px;padding:12px 0;border-top:1px solid var(--color-border)}
	.mode-sliders .app-lines-edit tr.group-row{display:block;padding:10px 0 4px}
	.mode-sliders .app-lines-edit td{display:block;border:0;padding:0;text-align:left}
	.mode-sliders .app-lines-edit .c-ref{grid-column:1;grid-row:1;font-weight:600}
	.mode-sliders .app-lines-edit .c-desc{grid-column:2 / -1;grid-row:1}
	.mode-sliders .app-lines-edit .c-value,.mode-sliders .app-lines-edit .c-prev,.mode-sliders .app-lines-edit .c-cum{display:none}
	/* The slider takes the full width for finer control; the figure goes on the line below */
	.mode-sliders .app-lines-edit .c-pct{grid-column:1 / -1;grid-row:2;display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
	.mode-sliders .app-lines-edit .c-pct .pct-slider{flex:1 1 100%;min-width:0;height:40px;margin:0}
	.mode-sliders .app-lines-edit .c-pct .w-pct{width:5.5rem}
	.mode-sliders .app-lines-edit [data-label]::before{content:attr(data-label);display:block;font-size:var(--text-xs);color:var(--color-text-muted)}
	.mode-sliders .app-lines-edit .c-pct::before{display:none}
	.mode-sliders .app-lines-edit .c-prevpct{grid-column:1 / 3;grid-row:3;background:none}
	.mode-sliders .app-lines-edit .c-this{grid-column:3;grid-row:3;text-align:right}
	.mode-sliders .app-lines-edit td:not([class]){display:none}
}

/* Xero connection: the official Connect and Disconnect buttons, unaltered */
.xero-btn{background:none;border:0;padding:0;cursor:pointer;display:inline-block;line-height:0;border-radius:4px}
.xero-btn img{display:block;max-width:100%;height:auto}
.xero-btn:focus-visible{outline:3px solid var(--color-primary);outline-offset:2px}
.xero-status{display:grid;grid-template-columns:max-content 1fr;gap:.35rem 1rem;margin:0 0 1rem}
.xero-status dt{color:var(--color-text-muted);font-weight:600}
.xero-status dd{margin:0}

/* Commission: card title with its status or action on the right */
.card-head-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-3);margin-bottom:var(--space-3)}
.card-head-row .card-h{margin:0}
/* Sales team: ending someone's access opens a short form */
.end-access summary{list-style:none;display:inline}
.end-access summary::-webkit-details-marker{display:none}
.end-access[open] form{margin-top:var(--space-2);padding:var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-card);max-width:22rem;display:flex;flex-direction:column;gap:var(--space-2)}

/* Blog post editor */
.rte{border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-card)}
.rte-toolbar{display:flex;flex-wrap:wrap;gap:4px;align-items:center;padding:6px;border-bottom:1px solid var(--color-border);background:var(--color-bg);position:sticky;top:env(safe-area-inset-top,0px);z-index:2}
.rte-toolbar button{font:inherit;font-size:var(--text-sm);padding:4px 10px;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-card);color:var(--color-text);cursor:pointer}
.rte-toolbar button:hover{border-color:var(--color-primary)}
.rte-toolbar button[aria-pressed="true"]{background:var(--color-primary);color:var(--color-on-primary);border-color:var(--color-primary)}
.rte-toolbar button:disabled{opacity:.45;cursor:default}
.rte-sep{width:1px;height:22px;background:var(--color-border);margin:0 4px}
.rte-area{min-height:420px;max-width:none;padding:var(--space-4) var(--space-5);outline:none}
.rte-area:focus{box-shadow:inset 0 0 0 2px var(--color-primary)}
.rte-area h2{margin-top:var(--space-6)}
.rte-source{width:100%;min-height:420px;border:0;border-radius:0 0 var(--radius-sm) var(--radius-sm);padding:var(--space-4);font-family:var(--font-code);font-size:var(--text-sm);line-height:1.5;resize:vertical}
.post-form .card-h{margin-top:var(--space-6)}
.danger-zone{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center;justify-content:space-between}
.rte-area p,.rte-area li{font-size:1.0625rem;line-height:1.7;color:var(--color-text)}
.copy-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--space-2);margin-top:4px;font-size:var(--text-sm)}
.copy-text{color:var(--color-text-muted);overflow-wrap:anywhere}
/* Admin: extend a company's trial */
.extend-trial{margin-top:var(--space-5);padding-top:var(--space-4);border-top:1px solid var(--color-border)}
.inline-fields{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:center}
/* Sales CRM: preview of the trial invite email */
.email-preview{white-space:pre-wrap;overflow-wrap:anywhere;font-family:var(--font-body);font-size:var(--text-sm);line-height:1.6;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:var(--space-4);margin:0}

/* Admin: trials and beta */
.activation-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--space-4);margin:var(--space-2) 0 var(--space-3)}
.activation-stats .tagline{display:block;margin-bottom:2px}
.activation-stats .meter{display:block;width:100%;max-width:140px;margin-top:4px}
.activation-notes{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:flex-end}
.activation-notes textarea{flex:1 1 280px;min-height:2.6rem;font:inherit;font-size:var(--text-sm);padding:8px 10px;border:1px solid var(--color-border);border-radius:var(--radius-sm)}
/* Blog posts: publish date beside the save and publish buttons */
.post-bar{margin:var(--space-3) 0 var(--space-4)}
.post-bar-bottom{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:center;margin-top:var(--space-4)}
.post-actions{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:center}
.post-date{display:inline-flex;align-items:center;gap:var(--space-2);font-weight:600;font-size:var(--text-sm)}
.post-date input{font:inherit;font-weight:400;padding:7px 10px;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-card)}
.post-date-note{margin:6px 0 0}
/* Main contractor: CIS verification reminder */
.cis-note{border-left:4px solid var(--color-accent);background:var(--color-bg);padding:var(--space-3) var(--space-4);border-radius:0 var(--radius-sm) var(--radius-sm) 0;margin:var(--space-2) 0 var(--space-4);font-size:var(--text-sm)}
.cis-note p{margin:0}
/* Main contractor reports: payment performance */
.perf-range input[type=date]{padding:6px 8px;border:1px solid var(--color-border);border-radius:var(--radius-sm);font:inherit;font-size:var(--text-sm)}
.perf-card .big{display:block;font-size:var(--text-xl);font-weight:700;color:var(--color-primary)}
.certify-as-applied{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center;justify-content:space-between;padding:var(--space-3) var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-bg);margin:var(--space-2) 0}
.certify-as-applied p{margin:0}
.over-100 p{margin:0 0 var(--space-2)}
/* Rows and notifications that open their item */
[data-href]{cursor:pointer}
tr[data-href]:hover td{background:var(--color-bg)}
.notice-list li[data-href]:hover{background:var(--color-bg)}
.cover-note{margin-top:var(--space-4)}
.cover-note textarea{width:100%;font:inherit;padding:8px 10px;border:1px solid var(--color-border);border-radius:var(--radius-sm)}
.cover-note-sent{margin:var(--space-3) 0;padding:var(--space-3) var(--space-4);background:var(--color-bg);border-radius:var(--radius-sm)}

/* Variations register: status filter, evidence files, delete */
.filter-chips{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-bottom:var(--space-3)}
.filter-chips a{padding:4px 12px;border:1.5px solid var(--color-border);border-radius:999px;font-size:var(--text-sm);font-weight:600;color:var(--color-text);text-decoration:none}
.filter-chips a[aria-current]{border-color:var(--color-primary);color:var(--color-primary);background:var(--color-bg)}
.var-files{margin-top:var(--space-4);padding-top:var(--space-3);border-top:1px solid var(--color-border)}
.file-list{list-style:none;margin:0 0 var(--space-3);padding:0;display:grid;gap:6px;font-size:var(--text-sm)}
.file-list li{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:baseline}
.row-edit .check-field{flex-direction:row;align-items:center;gap:6px}
.var-delete{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center;margin-top:var(--space-3)}
.danger-link{color:var(--cc-error-text)}
.pay-less-after{margin-top:var(--space-3)}
.pay-less-after summary{cursor:pointer;color:var(--color-primary);font-weight:600}

/* Trial countdown and failed payment, on every page for the people who pay */
.trial-bar{position:fixed;bottom:0;left:0;right:0;background:var(--color-card);border-top:1px solid var(--color-border);color:var(--color-text);text-align:center;padding:var(--space-2) var(--space-3);font-size:var(--text-sm);z-index:20}
.trial-bar-urgent{background:var(--cc-warning-tint);border-top-color:var(--cc-warning);color:var(--cc-warning-text);font-weight:600}

/* Payment runs */
.chip-wrap{white-space:normal;display:inline-block;margin:2px 0}
.mark-paid{margin-top:var(--space-4)}

/* Money: this week's actions */
.action-list{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-2)}
.action-list li{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:baseline;padding:var(--space-2) 0;border-bottom:1px solid var(--color-border)}
.action-list li:last-child{border-bottom:0}

/* Site photos on an application */
.photo-grid{list-style:none;margin:0 0 var(--space-4);padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:var(--space-3)}
.photo-grid li{display:flex;flex-direction:column;gap:4px}
.photo-grid img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius-sm);border:1px solid var(--color-border);max-width:100%}
.photo-doc{display:flex;align-items:center;justify-content:center;aspect-ratio:4/3;border:1px solid var(--color-border);border-radius:var(--radius-sm);font-weight:700;color:var(--color-text-muted)}

/* Team: project access and the custom role editor */
.access-form{max-height:320px;overflow:auto}
.role-editor{margin-top:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--color-border)}
.perm-group{border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:var(--space-3);display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:6px var(--space-4)}
.perm-group legend{font-weight:700;padding:0 6px}

/* System page: performance and capacity spacing */
.perf-intro{margin:0 0 var(--space-4)}
.perf-card .sub-h{margin-top:var(--space-5)}
.support-list{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-3)}
.support-list .chip{margin-left:var(--space-2)}
.support-thread{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-3)}
.support-thread li{display:flex;flex-direction:column;gap:var(--space-1);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);border:1px solid var(--color-border)}
.support-thread .from-staff{background:var(--cc-success-tint)}
.support-thread .internal{background:var(--cc-warning-tint);border-style:dashed}
.phone-bar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2) var(--space-4);padding:var(--space-3) var(--space-4);margin-bottom:var(--space-4)}
.phone-bar .check-field{min-height:0;font-weight:600}
.phone-incoming,.phone-live{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2);margin-left:auto}
.phone-incoming{background:var(--cc-success-tint);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md)}
.softphone{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2) var(--space-3);margin-top:var(--space-3)}
.softphone-status{font-size:var(--text-sm);color:var(--color-text-muted)}
.lead-calls{margin-top:var(--space-3)}
.lead-calls summary{cursor:pointer;font-weight:600;font-size:var(--text-sm)}
.calls-filter{margin-bottom:var(--space-5)}
.cert-optional > summary{cursor:pointer;list-style:none}
.cert-optional > summary::-webkit-details-marker{display:none}
.cert-optional > summary::after{content:' +';color:var(--color-text-muted)}
.cert-optional[open] > summary::after{content:' -'}
.tour-lit{position:relative;z-index:1001;outline:3px solid var(--cc-sky);outline-offset:4px;border-radius:var(--radius-sm);box-shadow:0 0 0 8px color-mix(in srgb, var(--cc-sky) 25%, transparent)}
.tour-box{position:absolute;z-index:1002;max-width:22rem;background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4);box-shadow:var(--shadow-card)}
.tour-centre{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:min(24rem,calc(100vw - 32px))}
.tour-title{font-weight:700;margin:0 0 var(--space-2)}
.tour-text{margin:0 0 var(--space-3);font-size:var(--text-sm)}
.tour-bar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2)}
.tour-count,.tour-hint{font-size:var(--text-xs);color:var(--color-text-muted)}
.tour-count{margin-right:auto}
.try-points{margin:var(--space-3) 0 var(--space-4);display:grid;gap:var(--space-2)}
.try-points li::before{content:'\2713';color:var(--cc-success);font-weight:700;margin-right:var(--space-2)}
.demo-link{position:relative;display:inline-block}
.demo-link > summary{list-style:none}
.demo-link > summary::-webkit-details-marker{display:none}
.demo-link-box{position:absolute;right:0;z-index:20;width:min(26rem,90vw);margin-top:var(--space-2);padding:var(--space-3)}
.demo-link-box input{width:100%}
.revision-list{display:grid;gap:var(--space-2)}
.revision-list li{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--space-2);font-size:var(--text-sm)}
.menu-guides{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.app-user-menu .menu-pill{display:inline-block;padding:4px 12px;border-radius:999px;background:color-mix(in srgb, var(--cc-sky) 16%, var(--color-card));color:var(--cc-navy);font-weight:600;text-decoration:none}
.app-user-menu .menu-pill:hover{background:color-mix(in srgb, var(--cc-sky) 28%, var(--color-card));text-decoration:none}
.menu-signout{margin-top:var(--space-2);padding-top:var(--space-3);border-top:1px solid var(--color-border)}
.menu-signout .btn{width:100%;border-radius:999px}
.app-footer{margin-top:var(--space-10);padding:var(--space-5) 0;border-top:1px solid var(--color-border);font-size:var(--text-sm)}
.app-footer-inner{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3) var(--space-5)}
.app-footer nav{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-4)}
.app-footer-home{font-weight:600}
.app-footer-inner > span{margin-left:auto}
.response-list{display:grid;gap:var(--space-4)}
.response-msg{margin:var(--space-2) 0;padding:var(--space-2) var(--space-3);border-left:3px solid var(--color-border)}
.respond-cta{margin-top:var(--space-4);display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:center}
.respond-cta p{flex-basis:100%;margin:0 0 var(--space-2)}
.csa-match{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2) var(--space-3);margin-top:var(--space-3)}
.join-list{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-3)}
.join-list li{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--space-3)}
.sys-tab-nav{flex-wrap:wrap;margin-bottom:var(--space-5)}
.lead-delete{margin-top:var(--space-5);padding-top:var(--space-4);border-top:1px solid var(--color-border)}
.rep-day{margin-top:var(--space-4);border:0;background:none;padding-left:0}
.crm-rules{display:flex;flex-wrap:wrap;gap:var(--space-1) var(--space-4);align-items:baseline;margin-bottom:var(--space-4);padding:var(--space-3) var(--space-4);border-left:4px solid var(--color-primary);background:var(--color-card);border-radius:var(--radius-sm)}
.crm-rules span{flex:1 1 16rem}