/* Site brief first. Archivo, navy and brass use the existing Kingsleigh tokens. */
.ct-header { background: var(--m-navy); color: #fff; padding: calc(var(--m-sat) + 24px) 24px 26px; }
.ct-header-row, .ct-focus-top, .ct-section-head, .ct-job-heading, .ct-job-meta { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ct-header h1 { margin: 10px 0 0; font-size: clamp(30px, 8vw, 38px); line-height: 1.05; letter-spacing: -.045em; font-weight: 750; }
.ct-title-dot { color: var(--m-brass-dark); }
.ct-eyebrow { font-size: 10px; font-weight: 700; line-height: 1.5; letter-spacing: .13em; text-transform: uppercase; }
.ct-header .ct-eyebrow { color: var(--m-brass-dark); }
.ct-greeting { margin: 18px 0 4px; font-size: 15px; }
.ct-date { margin: 0; color: var(--m-navy-body); font-size: 12px; }
.ct-profile { width: 48px; height: 48px; flex: none; display: grid; place-items: center; text-decoration: none; border: 1px solid #5d543e; border-radius: 16px; color: var(--m-brass-dark); font-weight: 700; }
#m-view > .ct-main { padding: 18px 18px calc(28px + var(--m-sab)); gap: 22px; }
.ct-main { --ct-muted: #616573; font-size: 14px; line-height: 1.5; }
.ct-main h2, .ct-main p { margin: 0; }
.ct-main a:focus-visible, .ct-main button:focus-visible, .ct-main summary:focus-visible, .ct-profile:focus-visible, .trade-action:focus-visible { outline: 3px solid #986e1a; outline-offset: 4px; }
.ct-ref { font: 500 11px/1.5 var(--m-mono); color: var(--m-amber-deep); overflow-wrap: anywhere; }
.ct-focus { position: relative; background: var(--m-card); border: 1px solid var(--m-line); border-radius: 20px; padding: 23px 20px 20px; box-shadow: 0 8px 22px #1b233407; overflow: hidden; }
.ct-focus::before { content: ""; position: absolute; left: 20px; right: 20px; top: 0; height: 3px; background: var(--m-brass); }
.ct-focus-top { flex-wrap: wrap; color: var(--ct-muted); }
.ct-focus h2 { font-size: clamp(24px, 6.8vw, 30px); letter-spacing: -.035em; line-height: 1.16; margin-top: 21px; overflow-wrap: anywhere; }
.ct-focus .ct-job-kind { margin: 9px 0 14px; color: var(--ct-muted); font-size: 14px; }
.ct-scope-note { color: var(--ct-muted); font-size: 12px; }
.ct-progress { display: block; appearance: none; border: 0; width: 100%; height: 4px; border-radius: 4px; margin: 10px 0 0; overflow: hidden; background: var(--m-tile); color: var(--m-brass); }
.ct-progress::-webkit-progress-bar { background: var(--m-tile); }
.ct-progress::-webkit-progress-value { background: var(--m-brass); border-radius: 4px; }
.ct-progress::-moz-progress-bar { background: var(--m-brass); }
.ct-next { border-top: 1px solid var(--m-line); padding-top: 18px; margin-top: 22px; }
.ct-next > span { font-size: 12px; font-weight: 750; }
.ct-next p { color: var(--ct-muted); font-size: 13px; margin: 5px 0 16px; }
.ct-button { min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; padding: 12px 16px; background: var(--m-navy); color: #fff; border: 1px solid var(--m-navy); border-radius: 12px; font: 650 14px/1.4 var(--m-font); text-decoration: none; cursor: pointer; }
.ct-button-quiet { background: transparent; color: var(--m-ink); border-color: #c9c5bb; justify-content: center; }
.ct-section-head { align-items: baseline; flex-wrap: wrap; margin-bottom: 12px; }
.ct-section-head h2, .ct-section-title { font-size: 17px; letter-spacing: -.02em; font-weight: 750; }
.ct-section-head > span { color: var(--ct-muted); font: 10px/1.5 var(--m-mono); }
.ct-section-head > a { display: inline-flex; min-height: 44px; align-items: center; color: var(--m-amber-deep); font-weight: 650; font-size: 12px; }
.ct-action-grid, .trade-action-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ct-action { min-height: 138px; padding: 15px; display: flex; flex-direction: column; align-items: flex-start; gap: 5px; background: var(--m-card); border: 1px solid var(--m-line); border-radius: 14px; text-decoration: none; }
.ct-action-icon { color: var(--m-amber-deep); font-size: 25px; line-height: 1; margin-bottom: 8px; }
.ct-action strong { font-size: 14px; line-height: 1.3; }
.ct-action > span:last-child { font-size: 12px; color: var(--ct-muted); line-height: 1.4; }
.ct-work-list { border: 1px solid var(--m-line); border-radius: 16px; overflow: hidden; background: #fff; }
.ct-work-link { display: flex; align-items: center; justify-content: space-between; gap: 15px; text-decoration: none; padding: 17px; }
.ct-work-link + .ct-work-link { border-top: 1px solid var(--m-line); }
.ct-work-link > span:first-child { min-width: 0; display: flex; flex-direction: column; gap: 5px; }
button.ct-work-link { width: 100%; background: none; border: 0; font: inherit; color: inherit; text-align: left; cursor: pointer; }
.ct-plan-entry + .ct-plan-entry { border-top: 1px solid var(--m-line); }
.ct-plan-status:not(:empty) { padding: 0 17px 14px; font-size: 13px; line-height: 1.5; }
.ct-plan-status .ct-work-link { padding: 12px 0; }
.ct-work-link strong { line-height: 1.4; }
.ct-arrow { color: var(--m-amber-deep); font-size: 22px; flex: none; }
.ct-address { font-size: 13px; color: var(--ct-muted); overflow-wrap: anywhere; }
.ct-small-alert { color: var(--m-amber-deep); font-size: 12px; }
.ct-help { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 48px; font-size: 13px; color: #51576a; text-decoration: none; padding: 7px 2px; }
.ct-help > span { font-size: 20px; }
.ct-empty { padding: 26px 22px; background: #fff; border: 1px solid var(--m-line); border-radius: 18px; }
.ct-empty .ct-eyebrow { color: var(--m-amber-deep); }
.ct-empty h2 { margin: 12px 0; font-size: 27px; line-height: 1.15; letter-spacing: -.03em; }
.ct-empty p { margin-bottom: 22px; color: var(--ct-muted); }
.ct-notice { padding: 16px; border: 1px solid var(--m-amber-line); background: var(--m-amber-tint); color: var(--m-amber-deep); border-radius: 14px; font-size: 13px; line-height: 1.5; }
.ct-notice p { margin: 7px 0 14px; }
.ct-offer { display: flex; flex-direction: column; gap: 7px; text-decoration: none; }
.ct-data-note { font-size: 12px; color: var(--m-amber-deep); border-bottom: 1px solid var(--m-line); }
.ct-data-note summary { min-height: 44px; padding: 10px 0; cursor: pointer; }
.ct-data-note p { padding-bottom: 15px; line-height: 1.6; }
.ct-job { display: block; padding: 20px; border: 1px solid var(--m-line); background: #fff; border-radius: 16px; text-decoration: none; }
.ct-job-meta { justify-content: flex-start; flex-wrap: wrap; font-size: 11px; color: var(--ct-muted); }
.ct-job-heading { align-items: flex-start; margin: 12px 0 6px; }
.ct-job-heading h2 { font-size: 18px; line-height: 1.25; letter-spacing: -.02em; overflow-wrap: anywhere; }
.ct-job-heading > span { color: var(--m-amber-deep); font-size: 22px; flex: none; }
.ct-job .ct-scope-note { margin-top: 16px; }
.ct-flags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 13px; }
.ct-job-closed { background: #f8f7f3; }
.trade-action-group { padding: 18px 0 4px; }
.trade-action-group h2 { margin: 0 0 12px; font-size: 17px; letter-spacing: -.02em; }
.trade-action { min-height: 58px; padding: 14px; background: #fff; border: 1px solid var(--m-line); border-radius: 12px; color: var(--m-ink); font: 600 14px/1.4 var(--m-font); text-align: left; text-decoration: none; display: flex; align-items: center; cursor: pointer; }
@media (hover: hover) { .ct-job:hover, .ct-action:hover, .ct-work-link:hover, .trade-action:hover { border-color: #bdb5a4; background: #fdfbf5; } }
@media (prefers-reduced-motion: no-preference) {
  .ct-button, .ct-job, .ct-action, .ct-work-link, .trade-action { transition: background-color 140ms ease, border-color 140ms ease; }
  .ct-home > .ct-focus { animation: ct-arrive 180ms ease-out; }
  @keyframes ct-arrive { from { opacity: .8; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
}
@media (max-width: 350px) {
  .ct-header { padding-left: 18px; padding-right: 18px; }
  #m-view > .ct-main { padding-left: 12px; padding-right: 12px; }
  .ct-focus { padding-left: 16px; padding-right: 16px; }
  .ct-action-grid, .trade-action-grid { gap: 8px; }
  .ct-action { padding: 12px; }
}

/* ---- The Board (m/board.js) — contractor cross-job surface ------------------ */
.ct-board-headline { margin-top: 10px; font-size: 14px; font-weight: 600; color: var(--m-brass-dark); }
.ct-board-section { margin-bottom: 8px; }
.ct-board-list { background: #fff; border: 1px solid var(--m-line); border-radius: 18px; overflow: hidden; }
.ct-board-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 14px; padding: 15px 17px; text-decoration: none; align-items: start; overflow-wrap: anywhere; }
.ct-board-item + .ct-board-item { border-top: 1px solid var(--m-line); }
.ct-board-item strong { grid-column: 1; line-height: 1.35; }
.ct-board-item .ct-arrow { grid-column: 2; grid-row: 1 / span 4; align-self: center; }
.ct-board-clock { grid-column: 1; font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--ct-muted); }
.ct-tone-over .ct-board-clock { color: #a8323a; }
.ct-tone-now  .ct-board-clock { color: var(--m-amber-deep); }
.ct-board-because { grid-column: 1; margin-top: 3px; font-size: 12.5px; line-height: 1.45; color: #51576a; }
.ct-board-clear { padding: 16px 17px; background: #fff; border: 1px solid var(--m-line); border-radius: 18px; font-size: 13px; color: var(--ct-muted); line-height: 1.5; }
.ct-board-dates, .ct-board-feed { list-style: none; margin: 0; padding: 0; background: #fff; border: 1px solid var(--m-line); border-radius: 18px; overflow: hidden; }
.ct-board-dates li, .ct-board-feed li { display: flex; flex-direction: column; gap: 3px; padding: 14px 17px; }
.ct-board-dates li + li, .ct-board-feed li + li { border-top: 1px solid var(--m-line); }
.ct-board-feed span { font-size: 13px; color: var(--ct-muted); line-height: 1.45; overflow-wrap: anywhere; }
.ct-board-missing { margin: 4px 0 12px; padding: 12px 14px; border-left: 3px solid #a8323a; background: #fff3ef; font-size: 12.5px; line-height: 1.5; color: #87303a; overflow-wrap: anywhere; }
/* 11 Oct — items grouped under their job; each says what it opens */
.ct-board-group + .ct-board-group { margin-top: 14px; }
.ct-board-job { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; padding: 0 2px 6px; color: var(--m-ink); font-size: 13px; font-weight: 650; text-decoration: none; overflow-wrap: anywhere; }
.ct-board-job > span:first-child { min-width: 0; }
.ct-board-job-go { flex: none; color: var(--m-amber-deep); font-size: 12px; font-weight: 700; }
.ct-board-do { grid-column: 1; margin-top: 6px; color: var(--m-amber-deep); font-size: 12.5px; font-weight: 700; }
/* ---- Leads (m/leads.js) — office lead activities, 11 Oct ------------------------ */
.ct-lead-list, .ct-lead-timeline { list-style: none; margin: 0; padding: 0; background: #fff; border: 1px solid var(--m-line); border-radius: 18px; overflow: hidden; }
.ct-lead-row { display: flex; flex-direction: column; gap: 3px; padding: 15px 17px; text-decoration: none; color: var(--m-ink); }
.ct-lead-row + .ct-lead-row, .ct-lead-timeline li + li { border-top: 1px solid var(--m-line); }
.ct-lead-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ct-lead-chip { align-self: flex-start; font-size: 10.5px; font-weight: 700; letter-spacing: .04em; padding: 3px 9px; border-radius: 999px; background: var(--m-tile); color: var(--ct-muted); }
.ct-lead-next { font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--ct-muted); }
.ct-lead-none { color: var(--m-amber-deep); }
.ct-lead-over, .ct-lead-over > span:first-of-type { color: var(--m-red-deep); }
.ct-lead-facts, .ct-lead-nextcard, .ct-lead-form { display: flex; flex-direction: column; gap: 6px; padding: 15px 17px; background: #fff; border: 1px solid var(--m-line); border-radius: 18px; font-size: 13px; color: var(--ct-muted); overflow-wrap: anywhere; }
.ct-lead-timeline li { display: flex; flex-direction: column; gap: 3px; padding: 14px 17px; font-size: 13px; color: var(--ct-muted); overflow-wrap: anywhere; }
.ct-lead-timeline strong { color: var(--m-ink); }
.ct-lead-timeline .ct-button { margin-top: 8px; min-height: 44px; }
.ct-lead-done { background: #f8f7f3; }
.ct-lead-form label { display: flex; flex-direction: column; gap: 4px; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.ct-lead-form select, .ct-lead-form input, .ct-lead-form textarea { font: 400 14px/1.4 var(--m-font); color: var(--m-ink); padding: 10px; min-height: 44px; border: 1px solid var(--m-line); border-radius: 10px; background: var(--m-bg); text-transform: none; letter-spacing: 0; }
.ct-lead-when, .ct-lead-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.ct-lead-clear { padding: 16px 17px; background: #fff; border: 1px solid var(--m-line); border-radius: 18px; font-size: 13px; color: var(--ct-muted); }
.ct-lead-missing { font-size: 12.5px; line-height: 1.5; color: var(--m-red-deep); }

/* ---- Product approvals (m/submittals.js) — trade proposes, office decides (11 Oct) ---- */
.ct-sub-back { min-width: 44px; min-height: 44px; padding: 0; background: none; border: 0; color: #fff; font-size: 26px; text-align: left; cursor: pointer; }
.ct-sub-lede { color: var(--ct-muted); font-size: 13px; line-height: 1.55; }
.ct-sub-list { display: flex; flex-direction: column; gap: 10px; }
.ct-sub-card { display: flex; flex-direction: column; gap: 4px; padding: 15px 17px; background: #fff; border: 1px solid var(--m-line); border-left: 4px solid var(--m-line); border-radius: 16px; overflow-wrap: anywhere; }
.ct-sub-ok { border-left-color: var(--m-green); }
.ct-sub-bad { border-left-color: var(--m-red); }
.ct-sub-ask { border-left-color: var(--m-amber-deep); }
.ct-sub-status { font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--ct-muted); }
.ct-sub-ok .ct-sub-status { color: var(--m-green); }
.ct-sub-bad .ct-sub-status { color: var(--m-red-deep); }
.ct-sub-ask .ct-sub-status { color: var(--m-amber-deep); }
.ct-sub-meta { font-size: 12.5px; color: var(--ct-muted); line-height: 1.5; }
.ct-sub-link { display: inline-flex; min-height: 44px; align-items: center; font-size: 13px; font-weight: 650; color: var(--m-amber-deep); }
.ct-sub-note { padding: 9px 11px; background: var(--m-bg); border-radius: 10px; font-size: 13px; }
.ct-sub-next { font-size: 12.5px; color: #51576a; }
.ct-sub-form, .ct-sub-confirm { display: flex; flex-direction: column; gap: 12px; padding: 17px; background: #fff; border: 1px solid var(--m-line); border-radius: 18px; }
.ct-sub-card .ct-sub-confirm { padding: 12px 0 0; border: 0; border-top: 1px solid var(--m-line); border-radius: 0; }
/* the native hidden attribute wins over the shared display above (extra-work receipt, 11 Oct) */
.ct-sub-form[hidden], .ct-sub-confirm[hidden] { display: none; }
.ct-sub-field { display: flex; flex-direction: column; gap: 6px; font-size: 12px; font-weight: 700; color: var(--ct-muted); }
.ct-sub-field input, .ct-sub-field textarea { box-sizing: border-box; width: 100%; min-height: 44px; padding: 11px; border: 1px solid var(--m-line); border-radius: 11px; background: var(--m-bg); color: var(--m-ink); font: 400 16px/1.4 var(--m-font); }
.ct-sub-msg { min-height: 1.2em; font-size: 12.5px; line-height: 1.5; color: var(--m-red-deep); }
.ct-sub-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding-top: 8px; }
.ct-sub-actions > :first-child, .ct-sub-wide { grid-column: 1 / -1; }

/* ---- Compliance wallet (m/wallet.js) — one item per card or certificate identity (11 Oct) ----
   Text colours hold 4.5:1 on their backgrounds at these sizes; status is in words, not colour alone. */
.ct-wallet-top { padding: calc(var(--m-sat) + 22px) 18px 6px; }
.ct-wallet-top h1 { margin: 0; font-size: 22px; line-height: 1.2; font-weight: 700; }
.ct-wallet-top p { margin: 3px 0 0; font-size: 13px; line-height: 1.45; color: #616573; }
.ct-wallet { --ctw-muted: #616573; font-size: 13px; line-height: 1.45; overflow-wrap: anywhere; }
.ct-wallet h2 { margin: 0; font-size: 11px; font-weight: 700; letter-spacing: .1em; color: var(--ctw-muted); }
.ct-wallet h3 { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; font-size: 14px; font-weight: 700; }
.ct-wallet p { margin: 0; }
.ct-wallet-panel { display: flex; flex-direction: column; gap: 8px; padding: 12px 14px; background: var(--m-card); border: 1px solid var(--m-line); border-radius: 14px; }
.ct-wallet-panel p, .ct-wallet-note, .ct-wallet-empty, .ct-wallet-office p { font-size: 12.5px; color: var(--ctw-muted); }
.ct-wallet .ct-wallet-warn { color: var(--m-red-deep); }
.ct-wallet-empty { padding: 14px 16px; border: 1px dashed var(--m-line); border-radius: 14px; background: var(--m-card); }
.ct-wallet-section { display: flex; flex-direction: column; gap: 9px; }
.ct-wallet-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.ct-wallet-add, .ct-wallet-action, .ct-wallet-close { min-height: 44px; padding: 10px 16px; border: 0; border-radius: 999px; background: var(--m-navy); color: #fff; font: 700 13px/1.3 var(--m-font); cursor: pointer; }
.ct-wallet-action { align-self: flex-start; }
.ct-wallet-close { background: var(--m-navy-raised); }
.ct-wallet-group { display: flex; flex-direction: column; gap: 6px; padding: 12px; background: var(--m-card); border: 1px solid var(--m-line); border-left: 4px solid var(--m-line); border-radius: 14px; }
.ct-wallet-level-3 { border-left-color: var(--m-red); }
.ct-wallet-level-2 { border-left-color: var(--m-disabled); }
.ct-wallet-level-1 { border-left-color: var(--m-amber); }
.ct-wallet-level-0 { border-left-color: var(--m-green); }
.ct-wallet-holder { font-size: 12.5px; font-weight: 500; color: var(--ctw-muted); }
.ct-wallet-records { list-style: none; margin: 0; padding: 0; }
.ct-wallet-records > li + li { border-top: 1px solid var(--m-line); }
.ct-wallet-record { display: flex; align-items: center; gap: 11px; width: 100%; min-height: 44px; padding: 8px 0; background: none; border: 0; color: inherit; font: inherit; text-align: left; }
button.ct-wallet-record { cursor: pointer; }
.ct-wallet-thumb { width: 46px; height: 46px; flex: none; display: flex; align-items: center; justify-content: center; border: 1px solid var(--m-line); border-radius: 10px; background: var(--m-tile); color: var(--ctw-muted); font-size: 10px; font-weight: 700; line-height: 1.2; text-align: center; overflow: hidden; }
.ct-wallet-rec { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 3px; }
.ct-wallet-num { font: 500 12px/1.4 var(--m-mono); color: var(--ctw-muted); }
.ct-wallet-status { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; padding: 4px 9px; border: 1px solid; border-radius: 999px; font-size: 12px; font-weight: 700; line-height: 1.35; }
.ct-wallet-dot { width: 7px; height: 7px; border-radius: 50%; flex: none; }
.ct-wallet-expired { color: var(--m-red-deep); background: var(--m-red-tint); border-color: var(--m-red-line); }
.ct-wallet-soon { color: var(--m-amber-deep); background: var(--m-amber-tint); border-color: var(--m-amber-line); }
.ct-wallet-unknown { color: #4F5361; background: var(--m-tile); border-color: var(--m-line); }
.ct-wallet-ok { color: #22603D; background: var(--m-green-tint); border-color: #BFE3CD; }
.ct-wallet-big { margin-top: 13px; padding: 9px 15px; font-size: 15px; }
.ct-wallet-recnote { font-size: 12px; line-height: 1.45; color: var(--ctw-muted); }
.ct-wallet-groupnote { font-size: 12px; line-height: 1.45; color: var(--m-amber-deep); }
.ct-wallet-go { flex: none; max-width: 68px; color: var(--m-amber-deep); font-size: 12px; font-weight: 700; text-align: right; }
.ct-wallet-office { display: flex; flex-direction: column; gap: 8px; }
.ct-wallet-attend { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.ct-wallet-attend li { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 2px 10px; font-size: 12.5px; }
.ct-wallet-attend li > span:last-child { font-weight: 700; color: var(--ctw-muted); }
.ct-wallet-ask { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 44px; padding: 13px 14px; border: 0; border-radius: 14px; background: var(--m-navy); color: var(--m-navy-body); font: inherit; font-size: 12.5px; line-height: 1.45; text-align: left; cursor: pointer; }
.ct-wallet-ask strong { color: #fff; }
.ct-wallet-ask > span:last-child { flex: none; color: var(--m-brass-dark); font-size: 17px; }
.ct-wallet button:focus-visible, .ct-wallet-close:focus-visible { outline: 3px solid #986e1a; outline-offset: 3px; }
#m-view button[data-copyid] { min-height: 44px; min-width: 44px; }
@media (max-width: 350px) {
  .ct-wallet-group { padding: 10px; }
  .ct-wallet-thumb { width: 38px; height: 38px; }
  .ct-wallet-record { gap: 8px; }
}