/* pure-desk.css — shared look for the working desks built 9/25/26 (hatC: TC desk, compliance review, CDA, auditor view,
   listing activity report, home digest, showing cart, speed-to-lead, follow-up, trust account). Brand rules only:
   navy #172E55 structure, gold #DCCAAF the single accent, green #117F39 confirm, red #ED1C24 warning, Open Sans,
   one shadow, cards white + hairline + 3px accent bar on top, pills 360. No page-local palette. */
:root{
  --dk-navy:#172E55;--dk-navy2:#1d3a6b;--dk-gold:#DCCAAF;--dk-green:var(--pure-good,#117F39);--dk-red:var(--pure-problem,#CC171E);--dk-amber:var(--pure-attention,#9A6A12);--dk-info:var(--pure-info,#2D5A9E);   /* 10/12/2026 E2: the four status colors are the shared tokens */
  --dk-ink:#000;--dk-ink2:#404040;--dk-ink3:#8E8E8E;--dk-line:#BFBFBF;--dk-hair:#e3ddd2;--dk-cream:#f8f4ef;
  --dk-shadow:5px 5px 10px rgba(0,0,0,.10);--dk-font:'Open Sans',system-ui,sans-serif;--dk-ease:cubic-bezier(.2,.7,.2,1)
}
.dk{font:14px/19px var(--dk-font);color:var(--dk-ink2);background:var(--dk-cream);min-height:100vh}
.dk *{box-sizing:border-box}
.dk a{color:var(--dk-navy);text-decoration:underline}
.dk a:hover{color:var(--dk-navy2)}
.dk-wrap{max-width:1320px;margin:0 auto;padding:18px 20px 64px}
.dk-head{background:linear-gradient(135deg,var(--dk-navy),var(--dk-navy2));color:#fff;border-top:3px solid var(--dk-gold);padding:20px 0 22px}
.dk-head .dk-wrap{padding:0 20px;display:flex;gap:18px;align-items:flex-end;flex-wrap:wrap}
.dk-eyebrow{font:600 12px/14px var(--dk-font);letter-spacing:.14em;text-transform:uppercase;color:var(--dk-gold)}
.dk-head h1{font:700 var(--pure-fs-title,24px)/32px var(--dk-font);margin:2px 0 4px;color:#fff}
.dk-head p{margin:0;max-width:78ch;color:#d7deea;font-size:14px;line-height:19px}
.dk-head .dk-grow{flex:1;min-width:260px}
.dk-kpis{display:flex;gap:10px;flex-wrap:wrap}
.dk-kpi{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);border-radius:8px;padding:10px 14px;min-width:104px}
.dk-kpi b{display:block;font:600 20px/27px var(--dk-font);color:#fff}
.dk-kpi span{font:600 12px/14px var(--dk-font);letter-spacing:.08em;text-transform:uppercase;color:#c9d3e4}
.dk-kpi.warn b{color:#ffb4b7}
.dk-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0 4px}
.dk-tabs button{appearance:none;border:1px solid var(--dk-line);background:#fff;color:var(--dk-navy);border-radius:360px;padding:0 16px;min-height:44px;font:600 13px var(--dk-font);cursor:pointer;transition:background .15s var(--dk-ease)}
.dk-tabs button[aria-selected=true]{background:var(--dk-navy);border-color:var(--dk-navy);color:#fff}
.dk-tabs button:focus-visible,.dk-btn:focus-visible{outline:2px solid var(--dk-gold);outline-offset:2px}
.dk-card{background:#fff;border:1px solid var(--dk-hair);border-top:3px solid var(--dk-navy);border-radius:16px;box-shadow:var(--dk-shadow);padding:18px 20px;margin-top:16px}
.dk-card.gold{border-top-color:var(--dk-gold)}.dk-card.green{border-top-color:var(--dk-green)}.dk-card.red{border-top-color:var(--dk-red)}
.dk-card h2{font:600 12px/16px var(--dk-font);letter-spacing:.12em;text-transform:uppercase;color:var(--dk-navy);margin:0 0 12px}
.dk-card h3{font:600 16px/22px var(--dk-font);color:var(--dk-ink);margin:0 0 4px}
.dk-muted{color:var(--dk-ink3);font-size:12px;line-height:16px}
.dk-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px}
.dk-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--dk-hair);flex-wrap:wrap}
.dk-row:first-child{border-top:0}
.dk-row .dk-main{flex:1;min-width:200px}
.dk-row .dk-main b{color:var(--dk-ink);font-weight:600}
.dk-row .dk-main .dk-muted{display:block;margin-top:2px}
.dk-when{width:64px;text-align:center;flex:none}
.dk-when b{display:block;font:600 18px/25px var(--dk-font);color:var(--dk-navy)}
.dk-when span{font:600 12px/14px var(--dk-font);text-transform:uppercase;color:var(--dk-ink3)}
.dk-chip{display:inline-block;font:600 12px/14px var(--dk-font);letter-spacing:.06em;text-transform:uppercase;border-radius:360px;padding:3px 10px;background:#f1efe9;color:var(--dk-ink2);white-space:nowrap}
.dk-chip.ok{background:var(--pure-good-soft,#e7f3ec);color:var(--dk-green)}.dk-chip.bad{background:var(--pure-problem-soft,#fde8e9);color:var(--dk-red)}.dk-chip.warn{background:var(--pure-attention-soft,#fbf3e2);color:var(--dk-amber)}.dk-chip.info{background:var(--pure-info-soft,#eaf0f8);color:var(--dk-info)}
.dk-chip.navy{background:var(--dk-navy);color:#fff}.dk-chip.gold{background:var(--dk-gold);color:var(--dk-navy)}
.dk-btn{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:0 16px;border-radius:360px;border:1px solid var(--dk-navy);background:#fff;color:var(--dk-navy);font:600 13px var(--dk-font);cursor:pointer;text-decoration:none}
.dk-btn.pri{background:var(--dk-navy);color:#fff}
.dk-btn.go{background:var(--dk-green);border-color:var(--dk-green);color:#fff}
.dk-btn.stop{border-color:var(--dk-red);color:var(--dk-red)}
.dk-btn:disabled{opacity:.45;cursor:not-allowed}
.dk-btn.sm{min-height:36px;padding:0 12px;font-size:12px}
.dk-banner{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--dk-hair);border-top:3px solid var(--dk-gold);background:#fff;border-radius:8px;padding:12px 14px;margin-top:16px;font-size:13px;line-height:18px}
.dk-banner.sample{border-top-color:var(--dk-gold);background:#fffaf1}
.dk-banner.off{border-top-color:var(--dk-navy)}
.dk-banner b{color:var(--dk-ink)}
.dk-banner svg{flex:none;width:18px;height:18px;margin-top:1px;stroke:var(--dk-navy);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.dk-table{width:100%;border-collapse:collapse;font-size:13px}
.dk-table th{text-align:left;font:600 12px/14px var(--dk-font);letter-spacing:.08em;text-transform:uppercase;color:var(--dk-ink3);padding:8px 10px;border-bottom:1px solid var(--dk-hair)}
.dk-table td{padding:10px;border-bottom:1px solid var(--dk-hair);vertical-align:top}
.dk-table td.num,.dk-table th.num{text-align:right;font-variant-numeric:tabular-nums}
.dk-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.dk-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;align-items:end}
.dk-form label{display:block;font:600 12px/14px var(--dk-font);letter-spacing:.08em;text-transform:uppercase;color:var(--dk-ink3)}
.dk-form input,.dk-form select,.dk-form textarea,.dk-in{width:100%;min-height:44px;border:1px solid var(--dk-line);border-radius:8px;padding:8px 12px;font:14px var(--dk-font);color:var(--dk-ink);background:#fff;margin-top:4px}
.dk-bar{height:10px;border-radius:360px;background:#efece5;overflow:hidden}
.dk-bar i{display:block;height:100%;background:var(--dk-navy);border-radius:360px}
.dk-spark{display:flex;align-items:stretch;gap:6px;height:150px;padding-top:8px}
.dk-spark .col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:4px;min-width:0;height:100%}
.dk-spark .bars{flex:1;width:100%;display:flex;align-items:flex-end;justify-content:center;min-height:0}
.dk-spark .stack{width:100%;max-width:34px;display:flex;flex-direction:column-reverse;border-radius:5px 5px 0 0;overflow:hidden;background:#f1efe9}
.dk-spark .stack i{display:block;width:100%}
.dk-spark small{font:600 12px/14px var(--dk-font);color:var(--dk-ink3);white-space:nowrap}
.dk-legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;margin-top:8px}
.dk-legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px;vertical-align:-1px}
.dk-empty{padding:22px;text-align:center;color:var(--dk-ink3)}
.dk-foot{margin-top:22px;font-size:12px;color:var(--dk-ink3)}
.dk-foot code{background:#f1efe9;border-radius:5px;padding:1px 6px;font-size:12px}
@media (max-width:640px){
  html main.dk-wrap,html .dk-wrap{padding-left:0!important;padding-right:0!important}   /* E11: the shell already gives the page its 16 px edge (the phone floor puts 16 px on every main); cards and the header block now share it */
  html .dk-head .dk-wrap{padding-left:16px!important;padding-right:16px!important}
  .dk-head h1{font-size:24px;line-height:32px}
  .dk-card{padding:14px}
  .dk-kpi{min-width:0;flex:1 1 40%}
  .dk-when{width:52px}
}
@media (max-width:640px){ .dk-btn.sm{min-height:44px;padding:0 14px} .dk-tabs button{flex:1 1 auto} }

/* pass14 (9/28/26, pages): three additions, all additive.
   1. .dk-mark  a MARKER, not a status: outlined, sentence case, with a small diamond. It labels something a person or
      persona can do ("Ginger can help") and never says pass/fail, so it cannot be read as a chip state in either theme.
   2. .dk-stack  a table that becomes one card per row at phone width; each td carries data-label.
   3. dark theme  html[data-theme="dark"] (set by pure-theme.js) so every desk reads on the dark canvas. Light is unchanged. */
.dk-mark{display:inline-flex;align-items:center;gap:6px;font:600 12px/15px var(--dk-font);color:#6b5f4d;border:1px solid #b8a98f;border-radius:360px;padding:2px 10px 2px 8px;background:transparent;white-space:nowrap}
.dk-mark::before{content:"";width:6px;height:6px;background:#b8a98f;transform:rotate(45deg);flex:none}
.dk-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.dk-confirm{border:1px solid var(--dk-red);border-radius:8px;padding:10px 12px;font-size:12.5px;line-height:17px;color:var(--dk-ink);background:#fff7f7}
.dk-confirm .dk-acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
@media (max-width:640px){
  .dk-stack{display:block}
  .dk-stack caption{display:block;width:100%}
  .dk-stack thead{position:absolute;left:0;top:0;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .dk-stack thead tr,.dk-stack thead th{position:absolute;left:0;top:0;width:1px;height:1px;padding:0;overflow:hidden}
  .dk-stack tbody,.dk-stack tr,.dk-stack td{display:block}
  .dk-stack tr{border:1px solid var(--dk-hair);border-radius:8px;padding:8px 10px;margin:0 0 10px}
  .dk-stack td{border:0;padding:4px 0}
  .dk-stack td[data-label]::before{content:attr(data-label);display:block;font:600 12px/14px var(--dk-font);letter-spacing:.08em;text-transform:uppercase;color:var(--dk-ink3)}
  .dk-stack td.dk-empty{display:block}
  .dk-stack td.dk-empty[colspan]::before{content:none}
}
html[data-theme="dark"]{--dk-ink:#eef4fd;--dk-ink2:#c5d1e6;--dk-ink3:#9aa9c2;--dk-line:#3a4a66;--dk-hair:#26364f;--dk-cream:#0a1526;--dk-green:#5fd08a}
html[data-theme="dark"] .dk{background:#0a1526;color:var(--dk-ink2)}
html[data-theme="dark"] .dk a{color:#dccaaf}
html[data-theme="dark"] .dk a:hover{color:#f0e3cd}
html[data-theme="dark"] .dk-head{background:linear-gradient(135deg,#0f1c33,#14203a)}
html[data-theme="dark"] .dk-card{background:#14203a;border-color:#26364f;border-top-color:#dccaaf}
html[data-theme="dark"] .dk-card.gold{border-top-color:#dccaaf}
html[data-theme="dark"] .dk-card h2,html[data-theme="dark"] .dk-when b{color:#dccaaf}
html[data-theme="dark"] .dk-card h3,html[data-theme="dark"] .dk-row .dk-main b,html[data-theme="dark"] .dk-banner b{color:var(--dk-ink)}
html[data-theme="dark"] .dk-tabs button{background:#14203a;color:#eef4fd;border-color:#3a4a66}
html[data-theme="dark"] .dk-tabs button[aria-selected=true]{background:#dccaaf;border-color:#dccaaf;color:#172e55}
html[data-theme="dark"] .dk-btn{background:transparent;color:#eef4fd;border-color:#6b7d9c}
html[data-theme="dark"] .dk-btn.pri{background:#dccaaf;border-color:#dccaaf;color:#172e55}
html[data-theme="dark"] .dk-btn.go{background:#1d8f4a;border-color:#1d8f4a;color:#fff}
html[data-theme="dark"] .dk-btn.stop{border-color:#ff8f94;color:#ff8f94}
html[data-theme="dark"] .dk-chip{background:#1c2c4a;color:#c5d1e6}
html[data-theme="dark"] .dk-chip.ok{background:rgba(95,208,138,.16);color:#5fd08a}
html[data-theme="dark"] .dk-chip.bad{background:rgba(255,143,148,.16);color:#ff8f94}
html[data-theme="dark"] .dk-chip.warn{background:rgba(228,190,110,.16);color:#e4be6e}
html[data-theme="dark"] .dk-chip.navy{background:#26364f;color:#eef4fd}
html[data-theme="dark"] .dk-mark{color:#dccaaf;border-color:#847969}
html[data-theme="dark"] .dk-mark::before{background:#847969}
html[data-theme="dark"] .dk-banner{background:#14203a;border-color:#26364f;border-top-color:#dccaaf}
html[data-theme="dark"] .dk-banner.sample{background:#1a2438}
html[data-theme="dark"] .dk-banner svg{stroke:#dccaaf}
html[data-theme="dark"] .dk-confirm{background:#2a1a24;border-color:#ff8f94}
html[data-theme="dark"] .dk-form input,html[data-theme="dark"] .dk-form select,html[data-theme="dark"] .dk-form textarea,html[data-theme="dark"] .dk-in,html[data-theme="dark"] .dk-table select,html[data-theme="dark"] .dk-table input{background:#0f1c33;color:#eef4fd;border-color:#3a4a66}
html[data-theme="dark"] .dk-bar{background:#26364f}
html[data-theme="dark"] .dk-bar i{background:#dccaaf}
html[data-theme="dark"] .dk-foot code{background:#1c2c4a;color:#c5d1e6}
html[data-theme="dark"] .dk-spark .stack{background:#1c2c4a}