/* kova/kraft-briefs.css — KRAFT Studio OS (brief inbox + work board)
   Additive styles only; every value resolves to tokens.css. */

.krw-host { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.krw { display: flex; flex-direction: column; flex: 1; min-height: 0; gap: var(--s-3); }

/* ---- banner ---- */
.krw-banner {
  display: flex; align-items: center; gap: 8px;
  background: var(--accent-soft); border: 1px solid color-mix(in srgb, var(--accent) 22%, transparent);
  color: var(--accent-3); border-radius: var(--r-md); padding: 10px 14px; font-size: var(--t-body-sm);
}
.krw-banner b { font-weight: var(--w-semibold); }

/* ---- analytics strip ---- */
.krw-strip { display: grid; grid-template-columns: repeat(6, 1fr); gap: var(--s-3); }
.krw-stat { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: var(--s-3) var(--s-4); }
.krw-stat-value { font-size: 26px; font-weight: var(--w-semibold); color: var(--ink); font-variant-numeric: tabular-nums; letter-spacing: -0.01em; line-height: 1.1; }
.krw-stat-label { font-size: var(--t-meta); color: var(--mute); margin-top: 2px; }
.krw-stat-cap { background: var(--surface-2); }
.krw-stat-cap-of { color: var(--mute-2); font-size: 16px; font-weight: var(--w-regular); }

/* ---- filter bar ---- */
.krw-filterbar { display: flex; align-items: center; gap: var(--s-3); flex-wrap: wrap; }
.krw-search { display: flex; align-items: center; gap: 6px; background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r-md); padding: 6px 10px; min-width: 240px; color: var(--mute); }
.krw-search input { border: 0; background: none; outline: none; font: inherit; font-size: var(--t-body-sm); color: var(--ink); width: 100%; }
.krw-search input::placeholder { color: var(--mute-2); }
.krw-search-x { border: 0; background: none; cursor: pointer; color: var(--mute); font-size: 15px; line-height: 1; }
.krw-search-x:hover { color: var(--ink); }

/* ---- kanban board (contained horizontal scroll — not the page) ---- */
.krw-board { display: flex; gap: var(--s-3); flex: 1; min-height: 0; overflow-x: auto; overflow-y: hidden; padding-bottom: var(--s-2); }
.krw-col { flex: 0 0 232px; display: flex; flex-direction: column; min-height: 0;
  background: var(--surface-2); border: 1px solid var(--line-2); border-radius: var(--r-lg); }
.krw-col-head { display: flex; align-items: center; justify-content: space-between; padding: var(--s-3) var(--s-3) var(--s-2); }
.krw-col-title { font-family: var(--font-mono); font-size: var(--t-eyebrow); letter-spacing: var(--tr-eyebrow); text-transform: uppercase; color: var(--mute); }
.krw-col-count { font-size: var(--t-meta); color: var(--mute); background: var(--surface-3); border-radius: var(--r-pill); padding: 1px 7px; font-variant-numeric: tabular-nums; }
.krw-col-body { flex: 1; overflow-y: auto; padding: 0 var(--s-2) var(--s-2); display: flex; flex-direction: column; gap: var(--s-2); }
.krw-col-empty { color: var(--mute-2); text-align: center; padding: var(--s-4) 0; font-size: var(--t-meta); }
.krw-col-changes { border-color: var(--danger-line); }
.krw-col-new { border-color: color-mix(in srgb, var(--info) 30%, var(--line-2)); }

/* ---- board card ---- */
.krw-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); padding: var(--s-3);
  display: flex; flex-direction: column; gap: 8px; cursor: pointer;
  transition: box-shadow var(--m-1) var(--ease-out), border-color var(--m-1) var(--ease-out), transform var(--m-1) var(--ease-out); }
.krw-card:hover { box-shadow: var(--z-2); border-color: var(--line-strong); transform: translateY(-1px); }
.krw-card:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.krw-card-top { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.krw-card-title { font-size: var(--t-body-sm); font-weight: var(--w-medium); color: var(--ink); line-height: 1.35;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.krw-card-foot { display: flex; align-items: center; justify-content: space-between; }
.krw-card-comments { font-size: var(--t-meta); color: var(--mute); display: inline-flex; align-items: center; gap: 3px; }

/* ---- source badge ---- */
.krw-source { display: inline-flex; align-items: center; gap: 5px; font-size: var(--t-meta); color: var(--ink-2); }
.krw-source-dot { width: 7px; height: 7px; border-radius: var(--r-pill); background: var(--m-mod, var(--mute)); flex-shrink: 0; }

/* ---- due chip ---- */
.krw-due { display: inline-flex; align-items: center; gap: 3px; font-size: var(--t-meta); color: var(--mute); font-variant-numeric: tabular-nums; }
.krw-due.is-soon { color: var(--warn); }
.krw-due.is-overdue { color: var(--danger); font-weight: var(--w-semibold); }

/* ---- constraint chips ---- */
.krw-cchips { display: flex; flex-wrap: wrap; gap: 4px; }

/* ---- provenance ---- */
.krw-prov { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; cursor: pointer;
  background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--r-md); padding: 10px 12px; color: var(--ink-2);
  transition: border-color var(--m-1) var(--ease-out), background var(--m-1) var(--ease-out); }
.krw-prov:hover { border-color: var(--accent); background: var(--accent-soft); }
.krw-prov-type { font-family: var(--font-mono); font-size: var(--t-eyebrow); letter-spacing: var(--tr-eyebrow); text-transform: uppercase; color: var(--mute); }
.krw-prov-label { font-size: var(--t-body-sm); color: var(--ink); flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.krw-prov-ref { font-size: var(--t-meta); color: var(--accent); }

/* ---- drawer sections ---- */
.krw-deye { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.krw-dsec { margin-bottom: var(--s-5); }
.krw-dsec-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--s-3); }
.krw-dsec-eyebrow { font-family: var(--font-mono); font-size: var(--t-eyebrow); letter-spacing: var(--tr-eyebrow); text-transform: uppercase; color: var(--mute); }

.krw-cgrid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-2); }
.krw-cgrid-cell { background: var(--surface-2); border: 1px solid var(--line-2); border-radius: var(--r-md); padding: var(--s-3); }
.krw-cgrid-k { font-family: var(--font-mono); font-size: var(--t-eyebrow); letter-spacing: var(--tr-eyebrow); text-transform: uppercase; color: var(--mute); }
.krw-cgrid-v { font-size: var(--t-body); color: var(--ink); font-weight: var(--w-medium); margin-top: 3px; }

/* ---- feasibility ---- */
.krw-feas { background: var(--surface-2); border: 1px solid var(--line-2); border-radius: var(--r-md); padding: var(--s-3) var(--s-4); }
.krw-feas-row { display: flex; align-items: baseline; justify-content: space-between; font-size: var(--t-body-sm); padding: 4px 0; color: var(--ink-2); }
.krw-feas-row b { color: var(--ink); font-variant-numeric: tabular-nums; }
.krw-feas-row b.is-over { color: var(--danger); }
.krw-feas-verdict { margin-top: var(--s-2); padding-top: var(--s-2); border-top: 1px solid var(--line-2); font-size: var(--t-meta); }
.krw-feas-verdict.is-ok { color: var(--success); }
.krw-feas-verdict.is-over { color: var(--danger); }

/* ---- references ---- */
.krw-ref { font-size: var(--t-body-sm); color: var(--ink-2); background: var(--surface-2); border: 1px solid var(--line-2); border-radius: var(--r-md); padding: 8px 12px; margin-bottom: 6px; line-height: 1.5; }

/* ---- conversation thread ---- */
.krw-thread { display: flex; flex-direction: column; gap: var(--s-3); margin-bottom: var(--s-3); }
.krw-msg { display: flex; gap: 8px; align-items: flex-start; }
.krw-msg-body { background: var(--surface-2); border: 1px solid var(--line-2); border-radius: 4px 10px 10px 10px; padding: 8px 10px; flex: 1; min-width: 0; }
.krw-msg.is-me .krw-msg-body { background: var(--accent-soft); border-color: color-mix(in srgb, var(--accent) 20%, transparent); }
.krw-msg-who { font-size: var(--t-meta); color: var(--ink); font-weight: var(--w-medium); margin-bottom: 2px; }
.krw-msg-text { font-size: var(--t-body-sm); color: var(--ink-2); line-height: 1.5; }
.krw-reply { display: flex; gap: 8px; align-items: flex-end; }
.krw-reply .k-textarea { flex: 1; }

/* ---- history ---- */
.krw-hist { display: flex; flex-direction: column; gap: 6px; }
.krw-hist-row { display: flex; align-items: center; justify-content: space-between; }

/* ---- responsive ---- */
@media (max-width: 1100px) {
  .krw-strip { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 720px) {
  .krw-strip { grid-template-columns: repeat(2, 1fr); }
  .krw-cgrid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .krw-card:hover { transform: none; }
}