/* ── Question rows (used in Questions, Findings, Action Items, Generate Review) ─ */
.kc-q-row {
  display: flex; gap: 14px;
  padding: 14px 18px;
  border-bottom: 1px solid rgba(160,120,32,0.06);
}
.kc-q-row:last-child { border-bottom: none; }

.kc-q-row.kc-q-yes  { border-left: 3px solid var(--green-lt); padding-left: 15px; }
.kc-q-row.kc-q-no   { border-left: 3px solid var(--red-lt);   padding-left: 15px; background: rgba(192,57,43,0.03); }
.kc-q-row.kc-q-na   { border-left: 3px solid var(--smoke4);   padding-left: 15px; opacity: 0.85; }
.kc-q-row.kc-q-open { border-left: 3px solid var(--gold);     padding-left: 15px; }

.kc-q-status-pill {
  flex-shrink: 0;
  padding: 4px 10px;
  background: rgba(160,120,32,0.08);
  border: 1px solid rgba(160,120,32,0.30);
  color: var(--gold-lt);
  border-radius: 12px;
  font-family: var(--f-mono);
  font-size: 9px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 500;
  align-self: flex-start;
  min-width: 60px;
  text-align: center;
}
.kc-q-yes .kc-q-status-pill { background: rgba(61,179,110,0.10); border-color: rgba(61,179,110,0.40); color: var(--green-lt); }
.kc-q-no .kc-q-status-pill  { background: rgba(192,57,43,0.10);  border-color: rgba(192,57,43,0.40); color: var(--red-lt); }
.kc-q-na .kc-q-status-pill  { background: rgba(160,120,32,0.04); border-color: rgba(160,120,32,0.20); color: var(--smoke4); }

.kc-q-main { flex: 1; min-width: 0; }
.kc-q-text {
  font-family: var(--f-body);
  font-size: 13px;
  color: var(--smoke);
  letter-spacing: 0.01em;
  margin-bottom: 4px;
  line-height: 1.5;
}
.kc-q-desc {
  font-family: var(--f-body);
  font-size: 12px;
  color: var(--smoke3);
  line-height: 1.6;
  margin-bottom: 6px;
}
.kc-q-comment {
  margin-top: 8px;
  padding: 10px 12px;
  background: rgba(160,120,32,0.04);
  border: 1px solid rgba(160,120,32,0.10);
  border-radius: 4px;
  font-family: var(--f-body);
  font-size: 12px;
  color: var(--smoke2);
  line-height: 1.6;
}
.kc-q-comment-label {
  display: inline-block;
  font-family: var(--f-mono);
  font-size: 8px;
  letter-spacing: 0.14em;
  color: var(--gold);
  text-transform: uppercase;
  margin-right: 8px;
}
.kc-q-meta {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin-top: 8px;
}
.kc-q-tag {
  display: inline-block;
  padding: 2px 8px;
  background: rgba(160,120,32,0.05);
  border: 1px solid rgba(160,120,32,0.20);
  border-radius: 3px;
  font-family: var(--f-mono);
  font-size: 9px;
  letter-spacing: 0.10em;
  color: var(--smoke3);
  text-transform: uppercase;
}
.kc-q-risk-high   { background: rgba(192,57,43,0.08); border-color: rgba(192,57,43,0.30); color: var(--red-lt); }
.kc-q-risk-medium { background: rgba(196,154,22,0.08); border-color: rgba(196,154,22,0.35); color: var(--amber-lt); }
.kc-q-risk-low    { background: rgba(61,179,110,0.06); border-color: rgba(61,179,110,0.30); color: var(--green-lt); }
.kc-q-evidence    { background: rgba(74,130,194,0.06); border-color: rgba(74,130,194,0.30); color: #6ba0d8; }
.kc-q-action      { background: rgba(160,120,32,0.10); color: var(--gold-lt); }
.kc-q-citation {
  display: inline-block;
  font-family: var(--f-mono);
  font-size: 9px;
  letter-spacing: 0.06em;
  color: var(--smoke3);
  font-style: italic;
  padding: 2px 0;
}

/* ── Findings grouping ──────────────────────────────────────────────── */
.kc-finding-cat { }
.kc-finding-cat-head {
  font-family: var(--f-display);
  font-size: 14px;
  letter-spacing: 0.04em;
  color: var(--gold);
  padding: 12px 18px;
  border-bottom: 1px solid rgba(160,120,32,0.20);
  background: rgba(160,120,32,0.04);
  text-transform: capitalize;
}

/* ── PDF embed ──────────────────────────────────────────────────────── */
.kc-pdf-frame-wrap {
  width: 100%;
  height: 70vh;
  background: #1a1a1a;
}
.kc-pdf-frame {
  width: 100%; height: 100%;
  border: 0;
  background: #1a1a1a;
}

/* ── Walking view ───────────────────────────────────────────────────── */
.kc-walk-wrap {
  max-width: 720px;
  margin: 0 auto;
  padding: 0;
}

.kc-walk-card {
  background: linear-gradient(170deg,
    rgba(11,14,24,1) 0%,
    rgba(8,11,20,1) 50%,
    rgba(6,8,16,1) 100%);
  border: 1px solid rgba(160,120,32,0.18);
  border-radius: var(--r);
  padding: 28px 32px;
  box-shadow:
    inset 0 1px 0 rgba(210,175,90,0.06),
    0 4px 18px rgba(0,0,0,0.50);
}
body[data-theme="light"] .kc-walk-card {
  background: rgba(255,255,255,0.92);
  border-color: rgba(60,100,145,0.22);
  box-shadow: 0 4px 18px rgba(60,100,145,0.10);
}

.kc-walk-card-meta {
  display: flex; gap: 8px; flex-wrap: wrap;
  margin-bottom: 16px;
}

.kc-walk-card-q {
  font-family: var(--f-display);
  font-size: 22px;
  font-weight: 400;
  letter-spacing: 0.02em;
  color: var(--smoke);
  line-height: 1.3;
  margin-bottom: 14px;
}

.kc-walk-card-desc {
  font-family: var(--f-body);
  font-size: 13px;
  line-height: 1.7;
  color: var(--smoke2);
  margin-bottom: 14px;
  letter-spacing: 0.01em;
}

.kc-walk-card-cite {
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  color: var(--smoke4);
  font-style: italic;
  padding: 8px 12px;
  border-left: 2px solid rgba(160,120,32,0.30);
  background: rgba(160,120,32,0.03);
  margin-bottom: 22px;
  line-height: 1.5;
}

.kc-walk-answers {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-bottom: 20px;
}

.kc-walk-ans {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 18px 12px;
  background: rgba(11,14,24,0.40);
  border: 1.5px solid rgba(160,120,32,0.20);
  border-radius: var(--r);
  cursor: pointer;
  transition: all 0.18s;
  font-family: var(--f-ui);
}

.kc-walk-ans:hover {
  border-color: rgba(160,120,32,0.50);
  background: rgba(160,120,32,0.06);
}

.kc-walk-ans-lbl {
  font-size: 18px;
  font-weight: 400;
  color: var(--smoke);
  margin-bottom: 2px;
  letter-spacing: 0.06em;
}
.kc-walk-ans-sub {
  font-family: var(--f-mono);
  font-size: 9px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--smoke4);
}

.kc-walk-ans-yes.active { border-color: var(--green-lt); background: rgba(61,179,110,0.10); }
.kc-walk-ans-yes.active .kc-walk-ans-lbl { color: var(--green-lt); }
.kc-walk-ans-no.active  { border-color: var(--red-lt);   background: rgba(192,57,43,0.10); }
.kc-walk-ans-no.active .kc-walk-ans-lbl  { color: var(--red-lt); }
.kc-walk-ans-na.active  { border-color: var(--smoke3);   background: rgba(160,120,32,0.06); }
.kc-walk-ans-na.active .kc-walk-ans-lbl  { color: var(--smoke); }

.kc-walk-comment-wrap { margin-bottom: 16px; }
.kc-walk-comment-lbl {
  display: block;
  font-family: var(--f-mono);
  font-size: 9px;
  letter-spacing: 0.14em;
  color: var(--smoke3);
  text-transform: uppercase;
  margin-bottom: 6px;
}
.kc-walk-comment {
  width: 100%;
  padding: 10px 12px;
  background: rgba(11,14,24,0.60);
  border: 1px solid rgba(160,120,32,0.20);
  border-radius: var(--r);
  color: var(--smoke);
  font-family: var(--f-body);
  font-size: 13px;
  line-height: 1.6;
  resize: vertical;
  outline: none;
}
.kc-walk-comment:focus { border-color: rgba(160,120,32,0.50); }

.kc-walk-evidence {
  display: flex; align-items: flex-start; gap: 10px;
  cursor: pointer;
  padding: 10px 12px;
  border: 1px solid rgba(160,120,32,0.15);
  border-radius: 4px;
  background: rgba(160,120,32,0.03);
  font-family: var(--f-body);
  font-size: 12px;
  color: var(--smoke2);
  line-height: 1.5;
}
.kc-walk-evidence input[type="checkbox"] {
  margin-top: 2px;
  accent-color: var(--gold);
}

.kc-walk-nav {
  display: flex; align-items: center; gap: 16px;
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid rgba(160,120,32,0.08);
}
.kc-walk-nav-progress { flex: 1; }
.kc-walk-nav-bar {
  height: 4px;
  background: rgba(160,120,32,0.08);
  border-radius: 2px;
  overflow: hidden;
}
.kc-walk-nav-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--gold) 0%, var(--gold-lt) 100%);
  border-radius: 2px;
  transition: width 0.3s;
}

.kc-walk-actions {
  display: flex; align-items: center; gap: 12px;
  margin-top: 14px;
}
.kc-walk-save-hint {
  font-family: var(--f-mono);
  font-size: 9px;
  letter-spacing: 0.10em;
  color: var(--smoke4);
  text-transform: uppercase;
}

/* ── Generate form ──────────────────────────────────────────────────── */
.kc-gen-form-wrap {
  max-width: 720px;
  margin: 0 auto;
}

.kc-field {
  margin-bottom: 16px;
}

.kc-field-row {
  display: flex; gap: 12px;
  margin-bottom: 16px;
}

.kc-field-lbl {
  display: block;
  font-family: var(--f-mono);
  font-size: 9px;
  letter-spacing: 0.14em;
  color: var(--smoke3);
  text-transform: uppercase;
  margin-bottom: 6px;
}

.kc-field .kc-input { width: 100%; }

.kc-field-hint {
  font-family: var(--f-body);
  font-size: 11px;
  color: var(--smoke4);
  margin-top: 4px;
  letter-spacing: 0.01em;
  font-style: italic;
}

/* ═══════════════════════════════════════════════════════════════════════
   ACTION ITEMS module — list rows, drawer, modal, priority pills
   ═══════════════════════════════════════════════════════════════════════ */

/* ── List rows (similar shape to .kc-audit-row) ─────────────────────── */
.kc-ai-row {
  display: flex; align-items: center; gap: 16px;
  padding: 14px 18px;
  border-bottom: 1px solid rgba(160,120,32,0.06);
  cursor: pointer;
  transition: background 0.15s;
}
.kc-ai-row:last-child { border-bottom: none; }
.kc-ai-row:hover { background: rgba(160,120,32,0.04); }
body[data-theme="light"] .kc-ai-row:hover { background: rgba(60,100,145,0.04); }

.kc-ai-row-priority { flex-shrink: 0; width: 70px; }
.kc-ai-row-main { flex: 1; min-width: 0; }
.kc-ai-row-title {
  font-family: var(--f-body);
  font-size: 13px;
  color: var(--smoke);
  letter-spacing: 0.01em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  margin-bottom: 4px;
}
.kc-ai-row-sub {
  font-family: var(--f-mono);
  font-size: 10px;
  color: var(--smoke3);
  letter-spacing: 0.06em;
}

.kc-ai-row-due {
  flex-shrink: 0;
  width: 130px;
  text-align: right;
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.10em;
  color: var(--smoke3);
  text-transform: uppercase;
}
.kc-ai-row-due .kc-due-overdue { color: var(--red-lt); }
.kc-ai-row-due .kc-due-soon    { color: var(--amber-lt); }

.kc-ai-row-status {
  flex-shrink: 0;
  width: 100px;
  text-align: right;
}

.kc-ai-row-arrow {
  flex-shrink: 0;
  color: var(--smoke4);
  font-family: var(--f-mono);
  font-size: 16px;
  opacity: 0.5;
  transition: all 0.15s;
}
.kc-ai-row:hover .kc-ai-row-arrow {
  transform: translateX(2px);
  opacity: 1;
  color: var(--gold);
}

/* ── Priority pills ─────────────────────────────────────────────────── */
.kc-prio-pill {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 12px;
  border: 1px solid;
  font-family: var(--f-mono);
  font-size: 9px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 500;
  min-width: 56px;
  text-align: center;
}
.kc-prio-high   { background: rgba(192,57,43,0.10);  border-color: rgba(192,57,43,0.40);  color: var(--red-lt); }
.kc-prio-normal { background: rgba(160,120,32,0.06); border-color: rgba(160,120,32,0.30); color: var(--gold-lt); }
.kc-prio-low    { background: rgba(160,120,32,0.04); border-color: rgba(160,120,32,0.20); color: var(--smoke3); }

/* ── Mono tag (small inline label) ──────────────────────────────────── */
.kc-mono-tag {
  display: inline-block;
  padding: 1px 6px;
  background: rgba(160,120,32,0.05);
  border: 1px solid rgba(160,120,32,0.18);
  border-radius: 3px;
  font-family: var(--f-mono);
  font-size: 9px;
  letter-spacing: 0.10em;
  color: var(--smoke3);
  text-transform: uppercase;
}

/* ── Drawer (slides from right) ─────────────────────────────────────── */
.kc-drawer-scrim {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.55);
  z-index: 11000;
  opacity: 0;
  transition: opacity 0.22s ease;
  pointer-events: none;
}
.kc-drawer-scrim.kc-drawer-open {
  opacity: 1;
  pointer-events: auto;
}
body[data-theme="light"] .kc-drawer-scrim {
  background: rgba(20,30,50,0.40);
}

.kc-drawer {
  position: fixed;
  inset: 0 0 0 auto;
  width: min(560px, 100vw);
  max-height: 100%;
  background: linear-gradient(170deg,
    rgba(11,14,24,1) 0%,
    rgba(8,11,20,1) 50%,
    rgba(6,8,16,1) 100%);
  border-left: 1px solid rgba(160,120,32,0.30);
  box-shadow: -8px 0 32px rgba(0,0,0,0.50);
  z-index: 11001;
  transform: translateX(100%);
  transition: transform 0.22s cubic-bezier(0.4, 0, 0.2, 1);
  display: block;
  overflow-y: scroll;
  overflow-x: hidden;
}
.kc-drawer.kc-drawer-open {
  transform: translateX(0);
}
body[data-theme="light"] .kc-drawer {
  background: rgba(252,251,247,0.99);
  border-left-color: rgba(60,100,145,0.30);
  box-shadow: -8px 0 32px rgba(60,100,145,0.15);
}

.kc-drawer-loading {
  padding: 60px 32px;
  text-align: center;
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  color: var(--smoke4);
  text-transform: uppercase;
}

.kc-drawer-head {
  display: flex; align-items: flex-start; gap: 16px;
  padding: 22px 28px 18px;
  border-bottom: 1px solid rgba(160,120,32,0.10);
}

.kc-drawer-title {
  font-family: var(--f-display);
  font-size: 22px;
  letter-spacing: 0.02em;
  color: var(--smoke);
  line-height: 1.3;
  margin-top: 4px;
  word-break: break-word;
}

.kc-drawer-close {
  background: none;
  border: 1px solid rgba(160,120,32,0.18);
  border-radius: 4px;
  width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  color: var(--smoke3);
  font-size: 22px;
  font-family: var(--f-body);
  cursor: pointer;
  transition: all 0.15s;
  flex-shrink: 0;
  line-height: 1;
}
.kc-drawer-close:hover {
  border-color: rgba(160,120,32,0.50);
  color: var(--smoke);
  background: rgba(160,120,32,0.06);
}

.kc-drawer-body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 22px 28px;
}

.kc-drawer-pills {
  display: flex; gap: 10px; flex-wrap: wrap;
  margin-bottom: 22px;
}

.kc-drawer-section {
  margin-bottom: 20px;
}

.kc-drawer-label {
  font-family: var(--f-mono);
  font-size: 9px;
  letter-spacing: 0.16em;
  color: var(--smoke4);
  text-transform: uppercase;
  margin-bottom: 6px;
}

.kc-drawer-text {
  font-family: var(--f-body);
  font-size: 13px;
  color: var(--smoke);
  letter-spacing: 0.01em;
  line-height: 1.6;
}

.kc-drawer-note {
  margin-top: 8px;
  padding: 10px 12px;
  background: rgba(160,120,32,0.05);
  border-left: 2px solid rgba(160,120,32,0.40);
  font-family: var(--f-body);
  font-size: 12px;
  color: var(--smoke2);
  line-height: 1.6;
  font-style: italic;
}

.kc-drawer-history { display: flex; flex-direction: column; gap: 4px; }

.kc-drawer-foot {
  display: flex;
  gap: 10px;
  padding: 18px 28px 22px;
  border-top: 1px solid rgba(160,120,32,0.10);
}

/* ── Modal (centered, for create form) ──────────────────────────────── */
/* ⚠⚠ THIS RULE PUT EVERY MODAL IN THE SUITE IN THE TOP-LEFT CORNER.
   THREE stylesheets define .kc-modal-scrim, and they load 1 -> 2 -> 4. File 1 centres it with
   `display:flex; align-items:center; justify-content:center`. THIS rule redefined the same class
   with NO display at all, so it won on cascade order and the scrim went back to a plain block.
   File 4 then makes the modal inside a scrim `position:static; display:block` -- a design that
   depends on the SCRIM being the centrer -- so with the flex gone the card had nothing centring it
   and collapsed against the left margin.
   Tim: "why are so many of the pop up forms to fill out in the compliance suite all scruntched up
   on the left margin of the screen."
   The centring is restored HERE, on the rule that actually applies, rather than by deleting one of
   the three definitions -- each carries its own background, z-index and transition, and untangling
   them is a bigger change than the bug warrants. */
.kc-modal-scrim {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.65);
  z-index: 11100;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  opacity: 0;
  transition: opacity 0.20s ease;
  pointer-events: none;
}
.kc-modal-scrim.kc-modal-open {
  opacity: 1;
  pointer-events: auto;
}
body[data-theme="light"] .kc-modal-scrim {
  background: rgba(20,30,50,0.50);
}

.kc-modal {
  position: fixed;
  inset: 0;
  z-index: 11101;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px;
  pointer-events: none;
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 0.20s ease, transform 0.20s ease;
}
.kc-modal.kc-modal-open {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.kc-modal-card {
  width: min(580px, 100%);
  max-height: calc(100vh - 64px);
  background: linear-gradient(170deg,
    rgba(11,14,24,1) 0%,
    rgba(8,11,20,1) 50%,
    rgba(6,8,16,1) 100%);
  border: 1px solid rgba(160,120,32,0.30);
  border-radius: var(--r);
  box-shadow: 0 24px 60px rgba(0,0,0,0.60);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
body[data-theme="light"] .kc-modal-card {
  background: rgba(252,251,247,0.99);
  border-color: rgba(60,100,145,0.30);
  box-shadow: 0 24px 60px rgba(60,100,145,0.20);
}

.kc-modal-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 20px 24px 16px;
  border-bottom: 1px solid rgba(160,120,32,0.10);
}

.kc-modal-body {
  padding: 22px 24px;
  overflow-y: auto;
  flex: 1;
}

.kc-modal-foot {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  padding: 16px 24px 20px;
  border-top: 1px solid rgba(160,120,32,0.10);
  background: rgba(0,0,0,0.20);
}
body[data-theme="light"] .kc-modal-foot { background: rgba(60,100,145,0.04); }

/* ── Radio buttons (used in assignee picker) ────────────────────────── */
.kc-radio {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--f-body);
  font-size: 12px;
  color: var(--smoke2);
  letter-spacing: 0.01em;
  cursor: pointer;
  padding: 4px 0;
}
.kc-radio input[type="radio"] {
  accent-color: var(--gold);
  margin: 0;
}

/* ═══════════════════════════════════════════════════════════════════════
   LICENSES module — list rows, expiration countdown, attachments
   ═══════════════════════════════════════════════════════════════════════ */

/* ── License rows (similar shape to .kc-ai-row but with type tag column) ─ */
.kc-lic-row {
  display: flex; align-items: center; gap: 14px;
  padding: 14px 18px;
  border-bottom: 1px solid rgba(160,120,32,0.06);
  cursor: pointer;
  transition: background 0.15s;
}
.kc-lic-row:last-child { border-bottom: none; }
.kc-lic-row:hover { background: rgba(160,120,32,0.04); }
body[data-theme="light"] .kc-lic-row:hover { background: rgba(60,100,145,0.04); }

.kc-lic-row-type {
  flex-shrink: 0;
  width: 130px;
}

.kc-lic-row-main {
  flex: 1;
  min-width: 0;
}

.kc-lic-row-name {
  font-family: var(--f-body);
  font-size: 13px;
  color: var(--smoke);
  letter-spacing: 0.01em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  margin-bottom: 4px;
}

.kc-lic-row-sub {
  font-family: var(--f-mono);
  font-size: 10px;
  color: var(--smoke3);
  letter-spacing: 0.06em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.kc-lic-row-exp {
  flex-shrink: 0;
  width: 130px;
  text-align: right;
}

.kc-lic-row-status {
  flex-shrink: 0;
  width: 95px;
  text-align: right;
}

/* Strong mono — used for the days-left countdown */
.kc-mono-strong {
  font-family: var(--f-mono);
  font-size: 11px;
  letter-spacing: 0.10em;
  font-weight: 600;
  text-transform: uppercase;
}

/* ── Attachment list inside detail drawer ───────────────────────────── */
.kc-att-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 4px;
}

.kc-att-row {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-areas:
    "name actions"
    "meta actions";
  gap: 2px 12px;
  padding: 8px 10px;
  background: rgba(160,120,32,0.04);
  border: 1px solid rgba(160,120,32,0.10);
  border-radius: 4px;
}
body[data-theme="light"] .kc-att-row {
  background: rgba(60,100,145,0.04);
  border-color: rgba(60,100,145,0.12);
}

.kc-att-name {
  grid-area: name;
  font-family: var(--f-body);
  font-size: 12px;
  color: var(--smoke);
  letter-spacing: 0.01em;
  word-break: break-word;
}

.kc-att-meta {
  grid-area: meta;
  font-family: var(--f-mono);
  font-size: 9px;
  color: var(--smoke4);
  letter-spacing: 0.10em;
  text-transform: uppercase;
}

.kc-att-actions {
  grid-area: actions;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.kc-att-link {
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.10em;
  color: var(--gold-lt);
  text-transform: uppercase;
  text-decoration: none;
  padding: 4px 8px;
  border: 1px solid rgba(160,120,32,0.30);
  border-radius: 3px;
  transition: all 0.15s;
}
.kc-att-link:hover {
  border-color: rgba(160,120,32,0.60);
  background: rgba(160,120,32,0.06);
}

.kc-att-del {
  background: none;
  border: 1px solid rgba(192,57,43,0.20);
  color: var(--red-lt);
  font-family: var(--f-mono);
  font-size: 9px;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  padding: 4px 8px;
  border-radius: 3px;
  cursor: pointer;
  transition: all 0.15s;
}
.kc-att-del:hover {
  background: rgba(192,57,43,0.10);
  border-color: rgba(192,57,43,0.50);
}

/* ═══════════════════════════════════════════════════════════════════════
   UI-12 KAIT INTEGRATION — two-pane layout + right chat pane + chips
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Workspace (left side) ───────────────────────────────────────────── */
.kc-workspace {
  flex: 1 1 auto;
  min-width: 0;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  transition: flex-basis 0.25s ease;
}

/* ── Kait pane (right side, persistent on desktop) ───────────────────── */
.kc-kait-pane {
  flex: 0 0 360px;
  width: 360px;
  height: 100%;
  display: flex;
  flex-direction: column;
  background: linear-gradient(175deg,
    rgba(11,14,24,0.97) 0%,
    rgba(8,11,20,0.97) 50%,
    rgba(6,8,16,0.97) 100%);
  border-left: 1px solid rgba(160,120,32,0.25);
  box-shadow: -2px 0 16px rgba(0,0,0,0.30) inset;
  transition: width 0.25s ease, flex-basis 0.25s ease, opacity 0.20s ease, transform 0.25s ease;
  overflow: hidden;
}
body[data-theme="light"] .kc-kait-pane {
  background: rgba(252,251,247,0.98);
  border-left-color: rgba(60,100,145,0.25);
  box-shadow: -2px 0 16px rgba(60,100,145,0.10) inset;
}

.kc-kait-closed {
  flex: 0 0 0;
  width: 0;
  border-left-width: 0;
  opacity: 0;
  pointer-events: none;
}

.kc-kait-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid rgba(160,120,32,0.12);
  flex-shrink: 0;
}
body[data-theme="light"] .kc-kait-head { border-bottom-color: rgba(60,100,145,0.15); }

.kc-kait-title-wrap { min-width: 0; flex: 1; }

.kc-kait-eyebrow {
  font-family: var(--f-mono);
  font-size: 9px;
  letter-spacing: 0.20em;
  text-transform: uppercase;
  color: var(--gold-lt);
  margin-bottom: 4px;
}

.kc-kait-context-label {
  font-family: var(--f-display);
  font-size: 16px;
  letter-spacing: 0.01em;
  color: var(--smoke);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.kc-kait-collapse {
  background: none;
  border: 1px solid rgba(160,120,32,0.20);
  border-radius: 4px;
  width: 30px; height: 30px;
  display: flex; align-items: center; justify-content: center;
  color: var(--smoke3);
  font-family: var(--f-mono);
  font-size: 11px;
  cursor: pointer;
  transition: all 0.15s;
  flex-shrink: 0;
}
.kc-kait-collapse:hover {
  border-color: rgba(160,120,32,0.50);
  color: var(--smoke);
  background: rgba(160,120,32,0.06);
}

.kc-kait-messages {
  flex: 1;
  overflow-y: auto;
  padding: 18px 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

/* Welcome state */
.kc-kait-welcome {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 8px 4px;
}

.kc-kait-welcome-eyebrow {
  font-family: var(--f-mono);
  font-size: 9px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold-lt);
}

.kc-kait-welcome-title {
  font-family: var(--f-display);
  font-size: 24px;
  letter-spacing: 0.01em;
  color: var(--smoke);
  line-height: 1.2;
}

.kc-kait-welcome-text {
  font-family: var(--f-body);
  font-size: 13px;
  color: var(--smoke2);
  line-height: 1.55;
  letter-spacing: 0.01em;
}

.kc-kait-chip-demo {
  display: inline-block;
  padding: 1px 8px;
  background: rgba(160,120,32,0.10);
  border: 1px solid rgba(160,120,32,0.30);
  border-radius: 10px;
  color: var(--gold-lt);
  font-family: var(--f-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
}

.kc-kait-suggestions {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 6px;
}

.kc-kait-suggest {
  text-align: left;
  background: rgba(160,120,32,0.04);
  border: 1px solid rgba(160,120,32,0.18);
  border-radius: 4px;
  padding: 10px 12px;
  font-family: var(--f-body);
  font-size: 12px;
  color: var(--smoke2);
  letter-spacing: 0.01em;
  cursor: pointer;
  transition: all 0.15s;
}
.kc-kait-suggest:hover {
  background: rgba(160,120,32,0.10);
  border-color: rgba(160,120,32,0.40);
  color: var(--smoke);
}
body[data-theme="light"] .kc-kait-suggest {
  background: rgba(60,100,145,0.04);
  border-color: rgba(60,100,145,0.18);
}
body[data-theme="light"] .kc-kait-suggest:hover {
  background: rgba(60,100,145,0.10);
  border-color: rgba(60,100,145,0.40);
}

/* Messages */
.kc-kait-msg {
  display: flex;
  flex-direction: column;
  max-width: 100%;
}

.kc-kait-msg-user {
  align-items: flex-end;
}

.kc-kait-msg-user .kc-kait-msg-body {
  background: linear-gradient(135deg, rgba(160,120,32,0.16) 0%, rgba(160,120,32,0.10) 100%);
  border: 1px solid rgba(160,120,32,0.30);
  color: var(--smoke);
  padding: 10px 14px;
  border-radius: 14px 14px 4px 14px;
  font-family: var(--f-body);
  font-size: 13px;
  letter-spacing: 0.01em;
  line-height: 1.55;
  max-width: 92%;
  word-wrap: break-word;
  overflow-wrap: anywhere;
}
body[data-theme="light"] .kc-kait-msg-user .kc-kait-msg-body {
  background: linear-gradient(135deg, rgba(60,100,145,0.12) 0%, rgba(60,100,145,0.08) 100%);
  border-color: rgba(60,100,145,0.28);
}

.kc-kait-msg-assistant .kc-kait-msg-body {
  background: rgba(0,0,0,0.20);
  border: 1px solid rgba(160,120,32,0.12);
  color: var(--smoke);
  padding: 12px 14px;
  border-radius: 14px 14px 14px 4px;
  font-family: var(--f-body);
  font-size: 13px;
  letter-spacing: 0.01em;
  line-height: 1.6;
  max-width: 100%;
  word-wrap: break-word;
  overflow-wrap: anywhere;
}
body[data-theme="light"] .kc-kait-msg-assistant .kc-kait-msg-body {
  background: rgba(60,100,145,0.05);
  border-color: rgba(60,100,145,0.15);
}

.kc-kait-msg-body p { margin: 0 0 8px 0; }
.kc-kait-msg-body p:last-child { margin-bottom: 0; }
.kc-kait-msg-body ul {
  margin: 6px 0 6px 16px;
  padding: 0;
}
.kc-kait-msg-body li { margin-bottom: 4px; }
.kc-kait-msg-body strong { color: var(--gold-lt); font-weight: 600; }
.kc-kait-msg-body em { font-style: italic; color: var(--smoke2); }
.kc-kait-msg-body code,
.kc-kait-inline-code {
  font-family: var(--f-mono);
  font-size: 11px;
  background: rgba(160,120,32,0.08);
  padding: 1px 5px;
  border-radius: 3px;
  color: var(--gold-lt);
}
.kc-kait-code {
  font-family: var(--f-mono);
  font-size: 11px;
  background: rgba(0,0,0,0.30);
  padding: 10px 12px;
  border-radius: 4px;
  border: 1px solid rgba(160,120,32,0.15);
  color: var(--smoke);
  overflow-x: auto;
  white-space: pre-wrap;
  margin: 8px 0;
}

/* Typing indicator */
.kc-kait-typing .kc-kait-typing-dots {
  display: flex;
  gap: 4px;
  padding: 14px 16px;
  background: rgba(0,0,0,0.20);
  border: 1px solid rgba(160,120,32,0.12);
  border-radius: 14px 14px 14px 4px;
  width: fit-content;
}
.kc-kait-typing-dots span {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--gold-lt);
  opacity: 0.4;
  animation: kc-kait-pulse 1.2s infinite;
}
.kc-kait-typing-dots span:nth-child(2) { animation-delay: 0.2s; }
.kc-kait-typing-dots span:nth-child(3) { animation-delay: 0.4s; }


/* ============================================================================
   ADULT-USE TRANSITION — control centre
   A programme surface, not a report: the countdown is the anchor, the market
   vitals sit under it, and the three working columns are side by side so the
   gap list and the incoming feed are visible at the same time.
   ============================================================================ */

.kc-tr-hero {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 24px;
  padding: 22px 22px 18px; margin-bottom: 14px;
  border: 1px solid var(--line); border-radius: 10px;
  background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0));
}
/* ⚠ THE COUNTDOWN IS THE ANCHOR. Everything on this screen is measured against one fixed date, so
   it is set far larger than anything else and every other figure reads as detail beneath it. */
.kc-tr-count {
  font-family: var(--f-display); font-size: 76px; font-weight: 500;
  letter-spacing: -0.03em; line-height: 0.95; color: var(--smoke);
}
.kc-tr-hero-main { min-width: 0; }
.kc-tr-count-label { font-size: 13px; color: var(--smoke3); margin-top: 4px; }
.kc-tr-gates { display: flex; gap: 26px; }
.kc-tr-gate { text-align: right; }
.kc-tr-gate-days { font-family: var(--f-display); font-size: 28px; font-weight: 500; letter-spacing: -0.015em; }
.kc-tr-gate-label { font-size: 11px; color: var(--smoke3); }

.kc-tr-vitals { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 12px; margin-bottom: 14px; }
.kc-tr-vital { border: 1px solid var(--line); border-radius: 10px; padding: 14px 16px; }
.kc-tr-vital-head { font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--smoke3); margin-bottom: 10px; }
.kc-tr-figure { font-family: var(--f-display); font-size: 34px; font-weight: 500; letter-spacing: -0.02em; line-height: 1; }
.kc-tr-figure-sm { font-family: var(--f-display); font-size: 22px; font-weight: 500; margin-top: 10px; line-height: 1; }

/* Activity bars: counts per month, nothing projected. */
.kc-tr-bars { display: flex; align-items: flex-end; gap: 8px; height: 74px; }
.kc-tr-bar { flex: 1; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; height: 100%; }
.kc-tr-bar-fill {
  width: 100%; min-height: 2px; border-radius: 3px 3px 0 0;
  background: linear-gradient(180deg, var(--gold, #c8a86b), rgba(200,168,107,0.35));
}

/* ⚠ EACH COLUMN SCROLLS ON ITS OWN so the page keeps its shape as the data grows: the feed will
   run to hundreds of items long before the gap list does, and one long column must not push the
   others off screen. */
/* Four columns since patch 410: the fourth is what has been pulled into the programme, which had
   no place to appear at all -- a feed item could be linked and the click produced no visible
   change anywhere on the screen. */
.kc-tr-cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
@media (max-width: 1500px) { .kc-tr-cols { grid-template-columns: 1fr 1fr; } }
.kc-tr-col {
  border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px;
  max-height: 460px; overflow-y: auto;
}
.kc-tr-col-head {
  font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--smoke3);
  margin-bottom: 10px; position: sticky; top: -12px;
  background: var(--bg2, #0c0f1a); padding: 6px 0;
}

@media (max-width: 1100px) {
  .kc-tr-vitals, .kc-tr-cols { grid-template-columns: 1fr; }
  .kc-tr-hero { flex-direction: column; align-items: flex-start; gap: 14px; }
  .kc-tr-gates { gap: 18px; }
  .kc-tr-count { font-size: 56px; }
  .kc-tr-col { max-height: none; }
}

/* .kc-standalone-root was deleted in patch 406. It existed only for the Adult-Use Transition and
   Landscape panels promoted to top-level tabs in 403; both returned to the Compliance Suite as
   tiles, so the rule had no users left. Admin's inline User Management mount deliberately never
   used it -- height:100% against an auto-height parent collapses to nothing. */

/* ── Adult-Use Transition: cockpit treatment ────────────────────────────────
   The countdown is the instrument everything else is read against, so it is set
   like one: oversized, tight, tabular figures so the digits do not jitter as the
   number changes, and a rule beneath it that reads as a horizon rather than a
   card border. */
.kc-tr-hero {
  position: relative;
  background:
    radial-gradient(120% 140% at 12% 0%, rgba(200,168,107,0.10), transparent 58%),
    linear-gradient(180deg, rgba(255,255,255,0.045), rgba(255,255,255,0.008));
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
}
.kc-tr-hero::after {
  /* The horizon line: brightest under the countdown, fading out across the gates. */
  content: '';
  position: absolute; left: 0; right: 0; bottom: 0; height: 1px;
  background: linear-gradient(90deg, var(--gold, #c8a86b), rgba(200,168,107,0.15) 46%, transparent);
}
.kc-tr-count {
  /* ⚠ TABULAR FIGURES. A countdown re-renders on every load and proportional digits change width
     as the number does, so the whole block twitches. tnum pins them. */
  font-variant-numeric: tabular-nums;
  font-size: 92px;
  font-weight: 600;
  letter-spacing: -0.045em;
  line-height: 0.9;
  background: linear-gradient(180deg, var(--smoke) 30%, rgba(200,168,107,0.75));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.kc-tr-count-label {
  text-transform: uppercase;
  letter-spacing: 0.16em;
  font-size: 10px;
  color: var(--smoke3);
  margin-top: 8px;
}
.kc-tr-gate-days { font-variant-numeric: tabular-nums; }
.kc-tr-gate {
  padding-left: 18px;
  border-left: 1px solid var(--line);
}
.kc-tr-gate-label { text-transform: uppercase; letter-spacing: 0.1em; font-size: 9px; }

/* ── The news feed ──────────────────────────────────────────────────────────
   Not table rows. A headline you can open, with its provenance above it and its
   actions below. */
.kc-tr-news {
  padding: 14px 0;
  border-bottom: 1px solid var(--line);
}
.kc-tr-news:last-child { border-bottom: 0; }
.kc-tr-news-meta {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  font-size: 9px; text-transform: uppercase; letter-spacing: 0.1em;
  color: var(--smoke3); margin-bottom: 6px;
}
.kc-tr-news-urgency {
  padding: 2px 7px; border-radius: 3px; font-weight: 600;
  background: rgba(255,255,255,0.06); color: var(--smoke2);
}
/* ⚠ ONLY 'high' AND 'critical' GET COLOUR. Colouring every urgency is how the signals panel became
   a wall of red that told you nothing. */
.kc-tr-u-high, .kc-tr-u-critical { background: rgba(255,61,61,0.16); color: #ff8a8a; }
.kc-tr-news-type { opacity: 0.75; }
.kc-tr-news-age { opacity: 0.75; }
/* The effective date is the only meta value that carries a deadline, so it is the one that is
   legible rather than muted. */
.kc-tr-news-eff { color: var(--gold, #c8a86b); opacity: 0.9; }
.kc-tr-news-title {
  display: block; font-size: 15px; font-weight: 500; line-height: 1.35;
  color: var(--smoke); text-decoration: none;
}
.kc-tr-news-title:hover { color: var(--gold, #c8a86b); text-decoration: underline; }
.kc-tr-news-sum { font-size: 12px; color: var(--smoke2); line-height: 1.55; margin-top: 5px; }
.kc-tr-news-foot { display: flex; align-items: center; gap: 12px; margin-top: 9px; }
.kc-tr-news-src { font-size: 11px; color: var(--smoke3); text-decoration: none; }
.kc-tr-news-src:hover { color: var(--gold, #c8a86b); }

/* ── Expandable rows ────────────────────────────────────────────────────────
   A milestone or obligation opens in place to a status control and a note. */
.kc-tr-item { border-bottom: 1px solid var(--line); }
.kc-tr-item:last-child { border-bottom: 0; }
.kc-tr-item-head {
  display: flex; align-items: flex-start; gap: 14px; width: 100%;
  padding: 12px 0; background: none; border: 0; text-align: left; cursor: pointer;
}
.kc-tr-item-head:hover .kc-tr-item-title { color: var(--gold, #c8a86b); }
.kc-tr-item-when { min-width: 78px; }
.kc-tr-item-days {
  display: block; font-variant-numeric: tabular-nums;
  font-size: 17px; font-weight: 500; color: var(--smoke);
}
.kc-tr-item-main { flex: 1; min-width: 0; }
.kc-tr-item-title { display: block; font-size: 13px; font-weight: 500; color: var(--smoke); }
.kc-tr-item-sub { display: block; font-size: 11px; color: var(--smoke3); line-height: 1.5; margin-top: 3px; }
.kc-tr-item-open { background: rgba(255,255,255,0.02); }
.kc-tr-item-body { padding: 4px 0 16px 92px; display: flex; flex-direction: column; gap: 6px; }
.kc-tr-item-actions { display: flex; align-items: center; gap: 10px; margin-top: 6px; }
.kc-textarea {
  width: 100%; background: rgba(0,0,0,0.25); border: 1px solid var(--line);
  border-radius: 6px; color: var(--smoke); padding: 9px 11px;
  font-family: var(--f-body); font-size: 12px; line-height: 1.55; resize: vertical;
}
.kc-textarea:focus, .kc-select:focus { outline: none; border-color: var(--gold, #c8a86b); }
.kc-select {
  background: rgba(0,0,0,0.25); border: 1px solid var(--line); border-radius: 6px;
  color: var(--smoke); padding: 7px 10px; font-family: var(--f-body); font-size: 12px;
  max-width: 220px;
}

@media (max-width: 1100px) {
  .kc-tr-count { font-size: 64px; }
  .kc-tr-gate { padding-left: 0; border-left: 0; }
  .kc-tr-item-body { padding-left: 0; }
}