/* Customer dashboard kit, copied whole so this folder stands alone. Classes begin with dk-. Variants are is- classes. */
.dk-scope,.dk-app{
  --dk-ink:#1b2820; --dk-ink-2:#4f5d53; --dk-page:#f3f4f0; --dk-card:#ffffff; --dk-line:#dbe0d8; --dk-line-soft:#eef0eb; --dk-sunk:#eceee9;
  --dk-green:#1f5a3c; --dk-green-2:#7fae93; --dk-green-tint:#e8efe9; --dk-side:#17301f; --dk-side-on:#24472f; --dk-side-ink:#cfdcd2; --dk-side-mark:#8fd1a5;
  --dk-warn:#7a4f00; --dk-warn-tint:#f7ecd2; --dk-bad:#9b2c2c; --dk-bad-tint:#f4dcdc; --dk-note:#fbf8f0; --dk-note-edge:#b9a97a; --dk-hl:#fffbea; --dk-hl-edge:#e0c867;
  --dk-font:"Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;
  --dk-fs-s:12.5px; --dk-fs-b:14px; --dk-fs-m:15px; --dk-fs-h:21px; --dk-fs-k:30px;
  --dk-gap:14px; --dk-pad:14px 16px; --dk-r:6px; --dk-r-s:4px; --dk-tap:44px;
}
.dk-app{margin:0;font:var(--dk-fs-b)/1.4 var(--dk-font);color:var(--dk-ink);background:var(--dk-page)}
.dk-app *{box-sizing:border-box}
.dk-shell{display:grid;grid-template-columns:200px minmax(0,1fr);min-height:100vh}
.dk-side{background:var(--dk-side);color:var(--dk-side-ink);padding:18px 0}
.dk-brand{display:block;padding:0 18px 18px;font-size:15px;font-weight:700;color:#fff;line-height:1.25}
.dk-nav a{display:block;padding:9px 18px;font-size:13.5px;color:inherit;text-decoration:none}
.dk-nav a:hover{background:var(--dk-side-on)}
.dk-nav a.is-on{background:var(--dk-side-on);color:#fff;border-left:3px solid var(--dk-side-mark);padding-left:15px}
.dk-nav a:focus-visible{outline:3px solid var(--dk-side-mark);outline-offset:-3px}
.dk-main{padding:20px 26px 28px;min-width:0}
.dk-title{margin:0 0 4px;font-size:var(--dk-fs-h);font-weight:700}
.dk-sub{margin:0 0 16px;color:var(--dk-ink-2);font-size:13px}
@media (max-width:760px){
  .dk-shell{grid-template-columns:minmax(0,1fr)}
  .dk-side{padding:8px 0}
  .dk-brand{padding:6px 14px 8px}
  .dk-nav{display:flex;overflow-x:auto}
  .dk-nav a{white-space:nowrap;min-height:var(--dk-tap);display:flex;align-items:center}
  .dk-nav a.is-on{border-left:0;border-bottom:3px solid var(--dk-side-mark);padding-left:18px}
  .dk-main{padding:16px 14px 24px}
}
.dk-row{display:grid;gap:var(--dk-gap);margin-bottom:var(--dk-gap)}
.dk-row > *{min-width:0}
.dk-c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.dk-c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.dk-c4{grid-template-columns:repeat(4,minmax(0,1fr))}
.dk-c5{grid-template-columns:repeat(5,minmax(0,1fr))}
.dk-c32{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr)}
.dk-c23{grid-template-columns:minmax(0,1fr) minmax(0,1.6fr)}
@media (max-width:900px){.dk-c4,.dk-c5{grid-template-columns:repeat(2,minmax(0,1fr))}.dk-c32,.dk-c23,.dk-c3{grid-template-columns:minmax(0,1fr)}}
@media (max-width:520px){.dk-c2,.dk-c4,.dk-c5{grid-template-columns:minmax(0,1fr)}}
.dk-card{background:var(--dk-card);border:1px solid var(--dk-line);border-radius:var(--dk-r);padding:var(--dk-pad)}
.dk-card.is-flush{padding:0}
.dk-card-h{margin:0 0 8px;font-size:var(--dk-fs-s);font-weight:700;color:var(--dk-ink-2)}
.dk-kpi{font-size:var(--dk-fs-k);font-weight:700;line-height:1.1}
.dk-kpi-l{margin-top:2px;font-size:var(--dk-fs-s);color:var(--dk-ink-2)}
.dk-table{width:100%;border-collapse:collapse;font-size:13px}
.dk-table th{padding:6px 8px;text-align:left;font-size:12px;font-weight:700;color:var(--dk-ink-2);border-bottom:1px solid var(--dk-line)}
.dk-table td{padding:8px;border-bottom:1px solid var(--dk-line-soft)}
.dk-table-wrap{overflow-x:auto}
.dk-pill{display:inline-block;padding:2px 9px;border-radius:10px;font-size:12px;font-weight:600;background:var(--dk-green-tint);color:var(--dk-green);white-space:nowrap}
.dk-pill.is-warn{background:var(--dk-warn-tint);color:var(--dk-warn)}
.dk-pill.is-mute{background:#e9ebe7;color:var(--dk-ink-2)}
.dk-pill.is-bad{background:var(--dk-bad-tint);color:var(--dk-bad)}
.dk-btn{display:inline-block;padding:7px 14px;border-radius:var(--dk-r-s);background:var(--dk-green);color:#fff;font-weight:600;font-size:13px;text-decoration:none;border:0}
.dk-btn.is-ghost{background:var(--dk-card);color:var(--dk-green);border:1.5px solid var(--dk-green);padding:5.5px 12.5px}
button.dk-btn{font-family:inherit;cursor:pointer;min-height:var(--dk-tap)}
.dk-btn:focus-visible{outline:3px solid var(--dk-green);outline-offset:2px}
.dk-bars{display:flex;align-items:flex-end;gap:10px;height:150px;padding-top:6px;margin-bottom:22px}
.dk-bars div{position:relative;flex:1;background:var(--dk-green-2);border-radius:3px 3px 0 0;min-height:6px}
.dk-bars div.is-hi{background:var(--dk-green)}
.dk-bars b{position:absolute;top:-17px;left:0;right:0;text-align:center;font-size:11.5px;font-weight:600}
.dk-bars span{position:absolute;bottom:-18px;left:0;right:0;text-align:center;font-size:11.5px;color:var(--dk-ink-2)}
.dk-steps{display:flex;margin:8px 0 2px}
.dk-step{flex:1;text-align:center;font-size:11.5px;color:var(--dk-ink-2)}
.dk-step::before{content:"";display:block;width:16px;height:16px;margin:0 auto 4px;border-radius:50%;background:var(--dk-line)}
.dk-step.is-done::before{background:var(--dk-green)}
.dk-step.is-now::before{background:#fff;border:3px solid var(--dk-green)}
.dk-step.is-done,.dk-step.is-now{color:var(--dk-ink);font-weight:600}
.dk-slot{display:inline-block;margin:0 6px 6px 0;padding:7px 12px;border:1.5px solid #cdd4ca;border-radius:var(--dk-r-s);background:var(--dk-card);font-size:13px}
.dk-slot.is-on{border-color:var(--dk-green);background:var(--dk-green-tint);font-weight:700}
button.dk-slot{font-family:inherit;cursor:pointer;min-height:var(--dk-tap)}
.dk-msg{padding:10px 12px;border-bottom:1px solid var(--dk-line-soft);font-size:13px}
.dk-msg b{display:block;font-size:13px}
.dk-msg.is-on{background:var(--dk-green-tint);border-left:3px solid var(--dk-green);padding-left:9px}
.dk-draft{margin-top:12px;padding:12px 14px;background:var(--dk-note);border:1px dashed var(--dk-note-edge);border-radius:var(--dk-r);font-size:13.5px}
.dk-flow{display:grid;grid-template-columns:minmax(0,1fr) 150px minmax(0,1fr) 150px minmax(0,1fr);align-items:center;margin:22px 0 28px}
.dk-node{padding:14px 16px;background:var(--dk-card);border:2px solid var(--dk-ink);border-radius:var(--dk-r);text-align:center;font-weight:700}
.dk-node small{display:block;margin-top:3px;font-weight:400;color:var(--dk-ink-2)}
.dk-link{margin:0 4px;border-top:2px solid var(--dk-green)}
.dk-link-l{margin-bottom:4px;text-align:center;font-size:12px;font-weight:600;color:var(--dk-green)}
@media (max-width:760px){
  .dk-flow{grid-template-columns:minmax(0,1fr);row-gap:10px}
  .dk-link{border-top:0;border-left:2px solid var(--dk-green);height:24px;margin:0 auto;width:0}
  .dk-link-l{display:none}
}
.dk-blk{margin-bottom:6px;padding:6px 8px;background:var(--dk-green-tint);border-left:4px solid var(--dk-green);border-radius:var(--dk-r-s);font-size:12px;font-weight:600}
.dk-blk.is-warn{background:var(--dk-warn-tint);border-color:#b57a00}
.dk-blk.is-mute{background:var(--dk-sunk);border-color:#8b968e}
.dk-board{display:grid;gap:var(--dk-gap);grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.dk-col{min-height:200px;padding:10px;background:var(--dk-sunk);border-radius:var(--dk-r)}
.dk-col.is-hl{background:var(--dk-hl)}
.dk-col-h{margin:0 0 8px;font-size:var(--dk-fs-s);font-weight:700;color:var(--dk-ink-2)}
.dk-deal{margin-bottom:8px;padding:9px 10px;background:var(--dk-card);border:1px solid var(--dk-line);border-radius:5px;font-size:13px}
.dk-deal b{display:block}
.dk-deal.is-hl{background:var(--dk-hl);border-color:var(--dk-hl-edge)}
.dk-muted{color:var(--dk-ink-2)}
.dk-sm{font-size:var(--dk-fs-s)}
.dk-gap-b{margin-bottom:var(--dk-gap)}
.dk-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* Additions for the mock drafts, same tokens. */
.dk-example{display:inline-block;padding:2px 8px;border:1px dashed var(--dk-note-edge);background:var(--dk-note);border-radius:4px;font-size:11.5px;color:var(--dk-ink-2)}
.dk-check{list-style:none;margin:0;padding:0}
.dk-check li{display:flex;align-items:flex-start;gap:10px;padding:8px 0;border-bottom:1px solid var(--dk-line-soft);font-size:13.5px}
.dk-check li:last-child{border-bottom:0}
.dk-check i{flex:none;width:18px;height:18px;margin-top:1px;border:2px solid #9aa59c;border-radius:4px;background:#fff}
.dk-check li.is-done i{border-color:var(--dk-green);background:var(--dk-green)}
.dk-check li.is-done i::after{content:"";display:block;width:5px;height:9px;margin:1px 0 0 5px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.dk-check small{display:block;color:var(--dk-ink-2);font-size:12px}
.dk-kv{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:13px}
.dk-kv dt{color:var(--dk-ink-2);margin:0}
.dk-kv dd{margin:0;font-weight:600}
.dk-rank{width:100%;border-collapse:collapse;font-size:13px}
.dk-rank td{padding:7px 6px;border-bottom:1px solid var(--dk-line-soft)}
.dk-rank tr.is-me td{background:var(--dk-green-tint);font-weight:700}
.dk-rank td:first-child{width:22px;color:var(--dk-ink-2)}
.dk-rank td:last-child{text-align:right;font-variant-numeric:tabular-nums}
.dk-note-row{padding:9px 0;border-bottom:1px solid var(--dk-line-soft);font-size:13px}
.dk-note-row b{display:block;font-size:12px;color:var(--dk-ink-2);font-weight:600}
.dk-head{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}
.dk-head .dk-title{font-size:24px}
.dk-head-meta{display:flex;flex-wrap:wrap;gap:8px 18px;color:var(--dk-ink-2);font-size:13.5px}
.dk-head-meta b{color:var(--dk-ink);font-weight:600}
.dk-actions{display:flex;flex-wrap:wrap;gap:8px}
.dk-side-sub{display:block;padding:0 18px 14px;font-size:12px;color:var(--dk-side-ink);opacity:.85}
.dk-side-foot{padding:18px 18px 0;font-size:12px;color:var(--dk-side-ink);opacity:.8}
@media (max-width:760px){.dk-side-sub,.dk-side-foot{display:none}}
textarea.dk-ta{width:100%;min-height:64px;padding:8px 10px;border:1px solid var(--dk-line);border-radius:var(--dk-r-s);font:13px/1.4 var(--dk-font);color:var(--dk-ink);resize:vertical}