/* Delegus Check (/check): run-it-yourself agent test. Navy/cobalt, Lucide, one accent. Every motion stands for a real
   state change (a decision arriving, a receipt verified, a hold completing); reduced motion shows end states. */
.ck{--ck-line:var(--steel-2,#C9D5DE);--ck-ink:var(--ink,#10243A);--ck-ink2:var(--ink-2,#3A4E63);--ck-cob:var(--cobalt,#2447F0);
  --ck-ok:#1E7A4F;--ck-ok-bg:#E6F4EC;--ck-no:#B3122B;--ck-no-bg:#FBE9EC;--ck-wait:#5B7186;--ck-wait-bg:#EEF2F6;--ck-mono:var(--mono,'IBM Plex Mono',ui-monospace,monospace)}
.ck-hero{padding:56px 0 28px}
.ck-hero h1{margin:8px 0 14px;font-size:clamp(34px,4.4vw,56px);line-height:1.04;letter-spacing:-.025em;text-wrap:balance;max-width:18ch}
.ck-hero .lede{font-size:18px;line-height:1.6;color:var(--ck-ink2);max-width:62ch;margin:0}
.ck-how{list-style:none;margin:26px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.ck-how li{padding:14px 14px 16px;border:1px solid var(--ck-line);border-radius:12px;background:#fff;font-size:14.5px;line-height:1.45;color:var(--ck-ink2)}
.ck-how b{display:block;color:var(--ck-ink);font-size:15px;margin-bottom:4px}
.ck-how .n{font:600 12px/1 var(--ck-mono);color:var(--ck-cob);display:block;margin-bottom:8px}
.ck-note{margin:18px 0 0;font-size:14px;line-height:1.55;color:var(--ck-ink2);max-width:72ch}

/* panels: a nested bezel, an outer hairline frame around a white inner card */
.ck-panel{margin:28px 0 0;padding:6px;border:1px solid var(--ck-line);border-radius:18px;background:var(--paper-2,#F5F7F9)}
.ck-in{background:#fff;border:1px solid var(--ck-line);border-radius:13px;padding:22px}
.ck-panel h2{margin:0 0 4px;font-size:22px;letter-spacing:-.01em}
.ck-panel .sub{margin:0 0 16px;color:var(--ck-ink2);font-size:15px}
.ck-step{font:600 12px/1 var(--ck-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ck-cob);margin:0 0 8px}

.ck-areas{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.ck-area{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border:1px solid var(--ck-line);border-radius:10px;font-weight:600;color:var(--ck-ink);background:#fff}
.ck-area svg{width:18px;height:18px;color:var(--ck-wait)}
.ck-area[aria-pressed="true"]{border-color:var(--ck-cob);background:#EEF2FF}
.ck-area[aria-pressed="true"] svg{color:var(--ck-cob)}
.ck-area:focus-visible,.ck-btn:focus-visible,.ck-copy:focus-visible,.ck-chip:focus-visible,.ck-hold:focus-visible{outline:2px solid var(--ck-cob);outline-offset:2px}

.ck-perm{border:1px solid var(--ck-line);border-radius:12px;padding:16px;margin:0 0 16px}
.ck-perm .words{margin:0 0 12px;font-size:16px;line-height:1.5;color:var(--ck-ink)}
.ck-rule{display:grid;grid-template-columns:150px minmax(0,1fr);gap:8px 14px;align-items:center;padding:10px 0;border-top:1px dashed var(--ck-line)}
.ck-rule .t{font:600 13px/1.3 var(--ck-mono);color:var(--ck-ink)}
.ck-rule label{display:grid;gap:4px;font-size:13px;color:var(--ck-ink2)}
.ck-rule input{font:500 16px/1.3 var(--ck-mono);padding:9px 10px;border:1px solid var(--ck-line);border-radius:8px;color:var(--ck-ink);background:#fff;min-width:0;width:100%;box-sizing:border-box}
.ck-rule input:focus{outline:2px solid var(--ck-cob);outline-offset:1px}
.ck-fields{display:grid;gap:8px}
.ck-err{margin:10px 0 0;color:var(--ck-no);font-size:14.5px}
.ck-err.calm{color:var(--ck-ink2)}

.ck-btn{all:unset;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 20px;border-radius:10px;font-weight:600;background:var(--ck-cob);color:#fff}
.ck-btn:hover{background:#1B3AD6}
.ck-btn[disabled]{opacity:.5;cursor:default}
.ck-btn.sec{background:#fff;color:var(--ck-ink);border:1px solid var(--ck-line)}
.ck-btn svg{width:18px;height:18px}

/* the session: server URL, tasks, cancel */
.ck-url{display:flex;gap:8px;align-items:stretch;margin:0 0 6px}
.ck-url code{flex:1;min-width:0;display:flex;align-items:center;padding:10px 12px;border:1px solid var(--ck-line);border-radius:10px;background:#0A1726;color:#EAF1F8;font:500 14px/1.4 var(--ck-mono);overflow-wrap:anywhere}
.ck-copy{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:6px;padding:0 12px;min-height:44px;border:1px solid var(--ck-line);border-radius:10px;font-weight:600;font-size:14px;color:var(--ck-ink);background:#fff;flex:none}
.ck-copy svg{width:16px;height:16px}
.ck-meta{display:flex;flex-wrap:wrap;gap:6px 18px;font:500 13px/1.4 var(--ck-mono);color:var(--ck-ink2);margin:6px 0 18px}
.ck-tasks{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:10px}
.ck-task{border:1px solid var(--ck-line);border-radius:12px;padding:12px 14px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;align-items:start}
.ck-task b{font-size:15px;color:var(--ck-ink)}
.ck-task p{grid-column:1;margin:0;font-size:15px;line-height:1.5;color:var(--ck-ink2)}
.ck-task .ck-copy{grid-row:1/span 2;grid-column:2}

/* hold-to-confirm cancel: the ring fills over 1.2 s; release cancels the hold; it completes only on a 2xx */
.ck-cancel{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;padding:14px;border:1px solid #E9C3CA;border-radius:12px;background:#FFF7F8}
.ck-cancel p{margin:0;flex:1 1 240px;font-size:15px;color:var(--ck-ink2)}
.ck-hold{all:unset;cursor:pointer;position:relative;display:inline-flex;align-items:center;gap:10px;min-height:46px;padding:0 18px 0 12px;border-radius:999px;border:1px solid var(--ck-no);color:var(--ck-no);font-weight:700;background:#fff;user-select:none;-webkit-user-select:none;touch-action:none}
.ck-hold svg.ring{width:26px;height:26px;transform:rotate(-90deg)}
.ck-hold svg.ring circle{fill:none;stroke-width:3}
.ck-hold svg.ring .bg{stroke:#F2D3D8}
.ck-hold svg.ring .fg{stroke:var(--ck-no);stroke-dasharray:62.83;stroke-dashoffset:62.83}
.ck-hold[data-state="done"]{background:var(--ck-no);color:#fff;cursor:default}
.ck-hold[data-state="done"] svg.ring .fg{stroke:#fff;stroke-dashoffset:0}
.ck-hold[data-state="done"] svg.ring .bg{stroke:rgba(255,255,255,.35)}
.ck-confirm{display:inline-flex;gap:8px;flex-wrap:wrap}
.ck-confirm[hidden],.ck-hold[hidden]{display:none}

/* the live feed */
.ck-feed-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.ck-live{font:600 12px/1 var(--ck-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ck-wait)}
.ck-live.on{color:var(--ck-ok)}
.ck-feed{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:8px}
.ck-empty{color:var(--ck-ink2);font-size:15px;padding:14px;border:1px dashed var(--ck-line);border-radius:12px;margin:12px 0 0}
.ck-ev{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:6px 12px;align-items:center;padding:12px 14px;border:1px solid var(--ck-line);border-radius:12px;background:#fff}
.ck-ev .seq{font:600 12px/1 var(--ck-mono);color:var(--ck-wait);align-self:start;padding-top:4px}
.ck-ev .what{min-width:0}
.ck-ev .tool{font:600 14px/1.35 var(--ck-mono);color:var(--ck-ink);overflow-wrap:anywhere}
.ck-ev .args{font:500 12px/1.35 var(--ck-mono);color:var(--ck-wait);overflow-wrap:anywhere;margin-top:2px}
.ck-ev .res{font:500 12.5px/1.35 var(--ck-mono);color:var(--ck-ink2);overflow-wrap:anywhere}
.ck-ev .tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.ck-tag{font:600 11px/1 var(--ck-mono);letter-spacing:.04em;padding:4px 7px;border-radius:6px;background:var(--ck-wait-bg);color:var(--ck-ink2)}
.ck-tag.warn{background:#FDF1DC;color:#7A5200}
.ck-ev.sys{grid-template-columns:auto minmax(0,1fr);background:var(--paper-2,#F5F7F9);font-size:14.5px;color:var(--ck-ink2)}
.ck-ev .side{display:grid;justify-items:end;gap:6px}
/* the decision pill: neutral "checking" until the decision is in hand, then the shape of the result */
.ck-pill{display:inline-flex;align-items:center;gap:6px;font:700 12.5px/1 var(--ck-mono);letter-spacing:.06em;padding:6px 10px;border-radius:999px;background:var(--ck-wait-bg);color:var(--ck-wait);transition:background .25s,color .25s,border-radius .25s}
.ck-pill svg{width:14px;height:14px}
.ck-pill.allow{background:var(--ck-ok-bg);color:var(--ck-ok);border-radius:8px}
.ck-pill.deny{background:var(--ck-no-bg);color:var(--ck-no);border-radius:8px}
.ck-reason{font:500 11.5px/1.3 var(--ck-mono);color:var(--ck-no);text-align:right;overflow-wrap:anywhere}
/* the receipt chip: really verifies, in this browser, under the published test key; never green "genuine" */
.ck-chip{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:0 9px;border:1px dashed var(--ck-line);border-radius:8px;font:600 11.5px/1.2 var(--ck-mono);color:var(--ck-ink2);background:#fff;max-width:100%}
.ck-chip svg{width:14px;height:14px;flex:none}
.ck-chip[data-state="test-valid"]{border-style:solid;border-color:#B9C6D3;color:var(--ck-ink)}
.ck-chip[data-state="altered"],.ck-chip[data-state="not-test"]{border-style:solid;border-color:var(--ck-no);color:var(--ck-no)}
.ck-chip-why{grid-column:1/-1;margin:4px 0 0;font-size:13px;color:var(--ck-ink2)}

/* the report: a board whose rows each flip once, when their count is in */
.ck-board{list-style:none;margin:14px 0 0;padding:0;border:1px solid #22406A;border-radius:14px;background:#0B1624;overflow:hidden}
.ck-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 16px;align-items:center;padding:14px 16px;border-top:1px solid #1F3A57;color:#C9D7E6}
.ck-row:first-child{border-top:0}
.ck-row .lbl{font-size:15px;line-height:1.4}
.ck-row .lbl small{display:block;font:500 12px/1.4 var(--ck-mono);color:#8FA3B8;margin-top:3px}
.ck-row .val{font:700 18px/1 var(--ck-mono);color:#fff;letter-spacing:.02em;white-space:nowrap;display:inline-block;transform-origin:50% 50%}
.ck-row .val.flip{animation:ck-flip .42s ease-out both}
@keyframes ck-flip{from{transform:rotateX(90deg);opacity:0}to{transform:none;opacity:1}}
.ck-row.hl .val{color:#8FA6FF}
.ck-limits{margin:16px 0 0;padding-left:18px;color:var(--ck-ink2);font-size:14.5px;line-height:1.55}
.ck-share{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:16px 0 0}
.ck-share code{font:500 14px/1.4 var(--ck-mono);overflow-wrap:anywhere}

@media (max-width:860px){.ck-how{grid-template-columns:1fr 1fr}}
@media (max-width:560px){
  .ck-hero{padding:36px 0 20px}
  .ck-how{grid-template-columns:1fr}
  .ck-in{padding:16px}
  .ck-rule{grid-template-columns:1fr}
  .ck-url{flex-direction:column}
  .ck-task{grid-template-columns:1fr}.ck-task .ck-copy{grid-row:auto;grid-column:1;justify-self:start}
  .ck-ev{grid-template-columns:auto minmax(0,1fr)}.ck-ev .side{grid-column:1/-1;justify-items:start;grid-auto-flow:column;justify-content:start;align-items:center}
  .ck-reason{text-align:left}
}
@media (prefers-reduced-motion:reduce){.ck-pill{transition:none}.ck-row .val.flip{animation:none}}
.ck-provider{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin:12px 0 0;font-size:14.5px;color:var(--ck-ink2)}
