/* THE DOCKET CLEARANCE, AS OBJECTS (INV-1761; Bennett 2026-10-03: "No small stale text.
   Everything objects and colors and snappy and perfectly intuitive!"). One vocabulary for the
   lead page's card (`_docket_clearance.html`) and the popup's Docket box
   (`_lead_docket_section.html`): the hero (the status in its tone), the hold bar (the window,
   a cell per day), the court tiles, the note cards, and the proof chips that open.
   Tokens only — both themes; nothing here knows a hex. */

/* ── tones: one ink, one soft ground, one on-ink per tone ───────────────────── */
.dkc-hero, .dkc-note, .dkc-chip, .dkc-label b, .dkc-box-hero { --dkc-ink: var(--text-secondary); --dkc-soft: var(--bg-surface-2); --dkc-on: var(--bg-surface); }
.dkc-hero[data-tone="green"], .dkc-note[data-tone="green"], .dkc-chip[data-tone="green"], .dkc-label b[data-tone="green"], .dkc-box-hero[data-tone="green"] { --dkc-ink: var(--status-verified); --dkc-soft: var(--status-verified-soft); --dkc-on: var(--on-status-verified, #fff); }
.dkc-hero[data-tone="yellow"], .dkc-note[data-tone="yellow"], .dkc-chip[data-tone="yellow"], .dkc-label b[data-tone="yellow"], .dkc-box-hero[data-tone="yellow"] { --dkc-ink: var(--status-warning); --dkc-soft: var(--status-warning-soft); --dkc-on: var(--on-status-warning, #fff); }
.dkc-hero[data-tone="red"], .dkc-note[data-tone="red"], .dkc-chip[data-tone="red"], .dkc-box-hero[data-tone="red"] { --dkc-ink: var(--status-error); --dkc-soft: var(--status-error-soft); --dkc-on: var(--on-status-error, #fff); }
.dkc-hero[data-tone="blue"], .dkc-note[data-tone="blue"], .dkc-chip[data-tone="blue"], .dkc-box-hero[data-tone="blue"] { --dkc-ink: var(--accent-brief); --dkc-soft: var(--accent-brief-soft); --dkc-on: var(--on-accent-brief, #fff); }

/* ── the card ───────────────────────────────────────────────────────────────── */
.dkc { display: grid; gap: 16px; padding: 18px 22px 20px; }
.dkc-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 14px; }
.dkc-block { min-width: 0; }
.dkc-label { margin: 0 0 8px; display: flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 700; letter-spacing: 0.09em; text-transform: uppercase; color: var(--text-muted); }
.dkc-label b { padding: 2px 9px; border-radius: 999px; font-size: 11px; font-weight: 650; letter-spacing: 0; text-transform: none; color: var(--dkc-ink); background: var(--dkc-soft); }

/* ── the hero ───────────────────────────────────────────────────────────────── */
.dkc-hero { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; column-gap: 14px; row-gap: 12px; padding: 16px 18px; border-radius: 16px; background: var(--dkc-soft); border: 1px solid color-mix(in srgb, var(--dkc-ink) 30%, transparent); }
.dkc-hero[data-tone="grey"] { border-color: var(--border-default); }
.dkc-hero__disc { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 999px; background: var(--dkc-ink); color: var(--dkc-on); box-shadow: 0 0 0 5px color-mix(in srgb, var(--dkc-ink) 16%, transparent); }
.dkc-hero[data-tone="grey"] .dkc-hero__disc { background: var(--text-muted); box-shadow: 0 0 0 5px color-mix(in srgb, var(--text-muted) 14%, transparent); }
.dkc-hero__main { display: grid; gap: 3px; min-width: 0; }
.dkc-hero__word { font-size: 21px; font-weight: 700; letter-spacing: -0.015em; line-height: 1.15; color: var(--dkc-ink); }
.dkc-hero[data-tone="grey"] .dkc-hero__word { color: var(--text-primary); }
.dkc-hero__line { font-size: 13.5px; line-height: 1.4; color: var(--text-primary); overflow-wrap: anywhere; }
.dkc-hero__side { display: flex; align-items: center; justify-content: flex-end; min-width: 0; }
.dkc-hero__hold, .dkc-hero__chips { grid-column: 1 / -1; min-width: 0; }
.dkc-hero__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.dkc-count { display: grid; justify-items: center; min-width: 76px; padding: 7px 14px 8px; border-radius: 13px; line-height: 1; background: var(--bg-surface); border: 1px solid color-mix(in srgb, var(--dkc-ink) 32%, transparent); }
.dkc-count b { font-size: 25px; font-weight: 750; letter-spacing: -0.02em; color: var(--dkc-ink); font-variant-numeric: tabular-nums; }
.dkc-count i { margin-top: 4px; font-style: normal; font-size: 10px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--dkc-ink); white-space: nowrap; }
.dkc-spin { width: 18px; height: 18px; border-radius: 999px; border: 2.5px solid color-mix(in srgb, var(--dkc-on) 35%, transparent); border-top-color: var(--dkc-on); animation: dkc-spin 0.8s linear infinite; }
@keyframes dkc-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .dkc-spin { animation-duration: 2.4s; } }

/* the door, when it is the thing to press: in the hero, in its tone */
.dkc-hero .dkc-door.cl-btn--door { height: 34px; padding: 0 16px; border-radius: 10px; font-size: 13.5px; font-weight: 650; white-space: nowrap; border-width: 1.5px; background: var(--bg-surface); border-color: color-mix(in srgb, var(--dkc-ink) 65%, var(--border-default)); color: var(--text-primary); transition: background 0.12s ease, border-color 0.12s ease, transform 0.08s ease; }

@media (hover: hover) { .dkc-hero .dkc-door.cl-btn--door:hover { border-color: var(--dkc-ink); background: color-mix(in srgb, var(--dkc-ink) 14%, var(--bg-surface)); } }
.dkc-hero .dkc-door.cl-btn--door:active { transform: translateY(1px); }

/* ── the hold bar ───────────────────────────────────────────────────────────── */
.dkc-hold { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 10px 14px; border-radius: 12px; background: var(--bg-surface); border: 1px solid color-mix(in srgb, var(--status-verified) 26%, var(--border-default)); }
.dkc-hold[data-state="out"], .dkc-hold[data-state="last"] { border-color: color-mix(in srgb, var(--status-warning) 40%, var(--border-default)); }
.dkc-hold__end { display: grid; gap: 2px; line-height: 1.15; }
.dkc-hold__end i { font-style: normal; font-size: 10px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); white-space: nowrap; }
.dkc-hold__end b { font-size: 14px; font-weight: 650; color: var(--text-primary); font-variant-numeric: tabular-nums; white-space: nowrap; }
.dkc-hold__end--until { justify-items: end; text-align: right; }
.dkc-hold__bar { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 3px; height: 14px; }
.dkc-hold__bar i { border-radius: 4px; background: color-mix(in srgb, var(--text-faint) 28%, transparent); transition: background 0.2s ease; }
.dkc-hold__bar i[data-on] { background: var(--status-verified); }
.dkc-hold[data-state="last"] .dkc-hold__bar i:last-child { background: var(--status-warning); }
.dkc-hold[data-state="out"] .dkc-hold__bar i { background: color-mix(in srgb, var(--status-warning) 42%, transparent); }
.dkc-hold[data-state="out"] .dkc-hold__end--until b { color: var(--status-warning); }
.dkc-hold--box { gap: 10px; padding: 7px 10px; border-radius: 10px; }
.dkc-hold--box .dkc-hold__end b { font-size: 12.5px; }
.dkc-hold--box .dkc-hold__end i { font-size: 9.5px; }
.dkc-hold--box .dkc-hold__bar { height: 10px; gap: 2px; }

/* ── chips ──────────────────────────────────────────────────────────────────── */
.dkc-chip { display: inline-flex; align-items: center; gap: 5px; height: 22px; padding: 0 9px; border-radius: 999px; font-size: 11.5px; font-weight: 600; line-height: 1; white-space: nowrap; color: var(--text-secondary); background: var(--bg-surface-2); border: 1px solid var(--border-default); text-decoration: none; }
.dkc-chip[data-tone="green"], .dkc-chip[data-tone="yellow"], .dkc-chip[data-tone="red"], .dkc-chip[data-tone="blue"] { color: var(--dkc-ink); background: var(--dkc-soft); border-color: transparent; }
.dkc-chip code { font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace); font-size: 10.5px; font-weight: 500; color: var(--text-muted); }
.dkc-chip--fact { height: 24px; background: var(--bg-surface); cursor: help; }
.dkc-chip--fact[data-tone="yellow"] { background: var(--bg-surface); border-color: color-mix(in srgb, var(--status-warning) 45%, var(--border-default)); }
.dkc-chip--link { cursor: pointer; background: var(--bg-surface); }

@media (hover: hover) { .dkc-chip--link:hover { border-color: var(--accent-brief); color: var(--accent-brief); } }
/* where a search came from, as a colour */
.dkc-chip--src { border-color: transparent; }
.dkc-chip--src[data-src="courtlistener"] { color: var(--label-2); background: var(--label-2-soft); }
.dkc-chip--src[data-src="westlaw"] { color: var(--label-6); background: var(--label-6-soft); }
.dkc-chip--src[data-src="ksf"] { color: var(--label-5); background: var(--label-5-soft); }
.dkc-chip--src[data-src="hand"], .dkc-chip--src[data-src="record"] { color: var(--label-7); background: var(--label-7-soft); }

/* ── the courts, as tiles ───────────────────────────────────────────────────── */
.dkc-legs { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(215px, 1fr)); gap: 10px; }
.dkc-leg { display: flex; align-items: flex-start; gap: 10px; min-width: 0; padding: 11px 12px; border-radius: 13px; border: 1px solid var(--border-default); background: var(--bg-surface); transition: transform 0.12s ease, box-shadow 0.12s ease, border-color 0.12s ease; }

@media (hover: hover) { .dkc-leg:hover { transform: translateY(-1px); box-shadow: 0 4px 14px color-mix(in srgb, var(--text-primary) 8%, transparent); } }
.dkc-leg[data-state="searched"] { border-color: color-mix(in srgb, var(--status-verified) 36%, var(--border-default)); background: color-mix(in srgb, var(--status-verified) 6%, var(--bg-surface)); }
.dkc-leg[data-state="owed"], .dkc-leg[data-state="stale"] { border-color: color-mix(in srgb, var(--status-warning) 52%, var(--border-default)); background: color-mix(in srgb, var(--status-warning) 9%, var(--bg-surface)); }
.dkc-leg[data-state="na"] { opacity: 0.72; }
.dkc-leg__mark { flex: none; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 999px; font-size: 13px; font-weight: 700; color: var(--text-muted); background: var(--status-muted-soft); }
.dkc-leg[data-state="searched"] .dkc-leg__mark { color: var(--on-status-verified, #fff); background: var(--status-verified); }
.dkc-leg[data-state="owed"] .dkc-leg__mark, .dkc-leg[data-state="stale"] .dkc-leg__mark { color: var(--on-status-warning, #fff); background: var(--status-warning); }
.dkc-leg__body { display: grid; gap: 7px; min-width: 0; }
.dkc-leg__name { font-size: 13.5px; font-weight: 650; line-height: 1.25; color: var(--text-primary); overflow-wrap: anywhere; }
.dkc-leg__facts { display: flex; flex-wrap: wrap; gap: 5px; }
/* the popup's box: the same tiles, compact — one row of chips */
.dkc-legs--box { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.dkc-legs--box .dkc-leg { align-items: center; gap: 7px; padding: 5px 10px 5px 6px; border-radius: 999px; }

@media (hover: hover) { .dkc-legs--box .dkc-leg:hover { transform: none; box-shadow: none; } }
.dkc-legs--box .dkc-leg__mark { width: 18px; height: 18px; }
.dkc-legs--box .dkc-leg__mark svg { width: 10px; height: 10px; }
.dkc-legs--box .dkc-leg__body { display: flex; align-items: center; gap: 7px; }
.dkc-legs--box .dkc-leg__name { font-size: 12px; white-space: nowrap; }
.dkc-legs--box .dkc-chip { height: 18px; padding: 0 7px; font-size: 10.5px; }

/* ── the notes: findings, rulings, the record's caveat ──────────────────────── */
.dkc-notes { display: grid; gap: 8px; }
.dkc-note { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 11px; padding: 11px 13px; border-radius: 13px; background: var(--dkc-soft); border: 1px solid color-mix(in srgb, var(--dkc-ink) 30%, transparent); }
.dkc-note__icon { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 8px; background: var(--dkc-ink); color: var(--dkc-on); }
.dkc-note b { display: block; font-size: 12.5px; font-weight: 650; line-height: 1.5; color: var(--dkc-ink); }
.dkc-note p, .lh-home .dkc-note p { margin: 2px 0 0; max-width: none; font-size: 13px; line-height: 1.5; color: var(--text-primary); display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
.dkc-note p.dkc-note__why, .lh-home .dkc-note p.dkc-note__why { color: var(--text-secondary); -webkit-line-clamp: 2; }
/* a ruled finding is settled: two lines, the rest on hover */
.dkc-note[data-tone="green"] p, .lh-home .dkc-note[data-tone="green"] p { -webkit-line-clamp: 2; }
.dkc-note--box { padding: 8px 10px; gap: 9px; margin-top: 8px; }
.dkc-note--box p { font-size: 12.5px; -webkit-line-clamp: 3; }

/* ── a lead nothing has searched: the three steps ───────────────────────────── */
.dkc-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 8px; }
.dkc-steps li { display: flex; align-items: center; gap: 9px; padding: 10px 12px; border-radius: 12px; border: 1px dashed var(--border-strong); font-size: 12.5px; line-height: 1.35; color: var(--text-secondary); }
.dkc-steps li svg { flex: none; color: var(--text-muted); }
.dkc-steps li b { font-weight: 650; color: var(--text-primary); }

/* ── the proof: chips that open ─────────────────────────────────────────────── */
.dkc-proof { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 8px; }
.dkc-proof > .dkc-tab, .dkc-fold { order: 1; }
.dkc-tab { display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 12px; border-radius: 10px; border: 1px solid var(--border-strong); background: var(--bg-surface); color: var(--text-primary); font-size: 12.5px; font-weight: 600; line-height: 1; cursor: pointer; user-select: none; list-style: none; text-decoration: none; transition: background 0.12s ease, border-color 0.12s ease, transform 0.08s ease; }
.dkc-tab::-webkit-details-marker { display: none; }
.dkc-tab::marker { content: ""; }

@media (hover: hover) { .dkc-tab:hover { background: color-mix(in srgb, var(--text-primary) 6%, var(--bg-surface)); border-color: var(--border-stronger, var(--border-strong)); } }
.dkc-tab:active { transform: translateY(1px); }
.dkc-tab svg { flex: none; color: var(--text-muted); }
.dkc-tab b { display: inline-grid; place-items: center; min-width: 20px; height: 18px; padding: 0 6px; border-radius: 999px; font-size: 11px; font-weight: 700; color: var(--text-secondary); background: var(--bg-surface-2); font-variant-numeric: tabular-nums; }

@media (hover: hover) { .dkc-tab--file:hover { border-color: var(--accent-brief); color: var(--accent-brief); } }

@media (hover: hover) { .dkc-tab--file:hover svg { color: var(--accent-brief); } }
.dkc-fold[open] { order: 2; flex: 1 1 100%; min-width: 0; border: 1px solid var(--border-default); border-radius: 14px; background: var(--bg-surface-2); overflow: hidden; }
.dkc-fold[open] > .dkc-tab { display: flex; width: 100%; height: 38px; border: 0; border-bottom: 1px solid var(--border-default); border-radius: 0; background: transparent; }
.dkc-fold[open] > .dkc-tab::after { content: "×"; margin-left: auto; font-size: 17px; font-weight: 400; color: var(--text-muted); }
.dkc-fold[open] > .dkc-tab b { background: var(--bg-surface); }
.dkc-fold__panel { display: grid; gap: 9px; min-width: 0; padding: 11px 12px 12px; }
.dkc-fold__panel .dk-cards { margin: 0; }
.dkc-rows { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; max-height: 420px; overflow-y: auto; }
.dkc-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 10px; background: var(--bg-surface); border: 1px solid var(--border-default); }
.dkc-row__q { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace); font-size: 11.5px; color: var(--text-primary); }
.dkc-hits { font-variant-numeric: tabular-nums; }
.dkc-files { display: flex; flex-wrap: wrap; gap: 6px; min-width: 0; }
.dkc-file { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; height: 28px; padding: 0 10px; border-radius: 9px; border: 1px solid var(--border-default); background: var(--bg-surface); color: var(--text-primary); font-size: 12px; font-weight: 500; text-decoration: none; transition: border-color 0.12s ease, color 0.12s ease; }

@media (hover: hover) { .dkc-file:hover { border-color: var(--accent-brief); color: var(--accent-brief); } }
.dkc-file svg { flex: none; color: var(--text-muted); }
.dkc-file span { min-width: 0; max-width: 52ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dkc-file__dot { flex: none; width: 8px; height: 8px; border-radius: 999px; background: var(--label-7); }
.dkc-file[data-src="courtlistener"] .dkc-file__dot { background: var(--label-2); }
.dkc-file[data-src="recap"] .dkc-file__dot { background: var(--label-5); }
.dkc-file[data-src="pacer"] .dkc-file__dot { background: var(--label-4); }
.dkc-file[data-src="westlaw"] .dkc-file__dot { background: var(--label-6); }
.dkc-cell { display: block; padding: 10px 12px; border-radius: 10px; background: var(--bg-surface); border: 1px solid var(--border-default); font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace); font-size: 12px; line-height: 1.6; color: var(--text-primary); white-space: pre-wrap; overflow-wrap: anywhere; }

/* ── the popup's Docket box: the same objects, compact ──────────────────────── */
.dkc-box-hero { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; background: var(--dkc-soft); border: 1px solid color-mix(in srgb, var(--dkc-ink) 30%, transparent); }
.dkc-box-hero[data-tone="grey"] { border-color: var(--border-default); }
.dkc-box-hero__disc { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 999px; background: var(--dkc-ink); color: var(--dkc-on); }
.dkc-box-hero[data-tone="grey"] .dkc-box-hero__disc { background: var(--text-muted); }
.dkc-box-hero__disc .dkc-spin { width: 13px; height: 13px; border-width: 2px; }
.dkc-box-hero__main { display: grid; gap: 1px; min-width: 0; }
.dkc-box-hero__main b { font-size: 14.5px; font-weight: 700; line-height: 1.2; color: var(--dkc-ink); }
.dkc-box-hero[data-tone="grey"] .dkc-box-hero__main b { color: var(--text-primary); }
.dkc-box-hero__main span { font-size: 12.5px; line-height: 1.35; color: var(--text-primary); overflow-wrap: anywhere; }
.dkc-box-hero .dkc-count { min-width: 0; padding: 4px 10px 5px; border-radius: 10px; }
.dkc-box-hero .dkc-count b { font-size: 17px; }
.dkc-box-hero .dkc-count i { margin-top: 2px; font-size: 9px; }
.dkc-box-hold { margin-top: 8px; }
.dkc-box-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }

@media (max-width: 640px) {
  .dkc { padding: 14px 14px 16px; }
  .dkc-hero { grid-template-columns: auto minmax(0, 1fr); }
  .dkc-hero__side { grid-column: 1 / -1; justify-content: flex-start; }
  .dkc-hold { grid-template-columns: 1fr 1fr; }
  .dkc-hold__bar { grid-column: 1 / -1; grid-row: 2; }
  .dkc-row { grid-template-columns: minmax(0, 1fr) auto; }
  .dkc-row__q { grid-column: 1 / -1; }
}

/* ── THE DOCKET TIMELINE (Lane D, specs/167 §2, INV-2485) ─────────────────────────────────
   `_docket_timeline.html`: a vertical rail, one node per dated event in its tone — the word,
   "by · when", one detail line, the doors as object chips. The popup's box folds it to six; the
   lead page and the ticket draw it whole. Tokens only, both themes. */
.dkt { --dkt-ink: var(--text-muted); display: grid; gap: 8px; min-width: 0; }
.dkt__head { display: flex; align-items: baseline; gap: 8px; }
.dkt__title { margin: 0; font-size: 11px; font-weight: 700; letter-spacing: 0.09em; text-transform: uppercase; color: var(--text-muted); }
.dkt__count { font-size: 11px; font-weight: 650; color: var(--text-muted); font-variant-numeric: tabular-nums; }
.dkt__rail { position: relative; margin: 0; padding: 0 0 0 2px; list-style: none; display: grid; gap: 0; }
.dkt__row { --dkt-ink: var(--text-muted); --dkt-soft: var(--bg-surface-2); position: relative; display: grid; grid-template-columns: 24px minmax(0, 1fr); column-gap: 10px; padding: 0 0 12px; animation: dkt-in 0.22s ease both; animation-delay: calc(min(var(--dkt-i, 0), 8) * 28ms); }
.dkt__row:not(:last-child)::before { content: ""; position: absolute; left: 11px; top: 24px; bottom: 0; width: 2px; border-radius: 2px; background: color-mix(in srgb, var(--border-default) 80%, transparent); }
.dkt__row[data-tone="engine"] { --dkt-ink: var(--accent-brief); --dkt-soft: var(--accent-brief-soft); }
.dkt__row[data-tone="ok"] { --dkt-ink: var(--status-verified); --dkt-soft: var(--status-verified-soft); }
.dkt__row[data-tone="bad"] { --dkt-ink: var(--status-error); --dkt-soft: var(--status-error-soft); }
.dkt__row[data-tone="warn"] { --dkt-ink: var(--status-warning); --dkt-soft: var(--status-warning-soft); }
.dkt__node { position: relative; z-index: 1; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 999px; font-size: 12px; font-weight: 700; line-height: 1; color: var(--dkt-ink); background: var(--dkt-soft); border: 1.5px solid color-mix(in srgb, var(--dkt-ink) 55%, transparent); }
.dkt__row.is-live .dkt__node { box-shadow: 0 0 0 4px color-mix(in srgb, var(--dkt-ink) 18%, transparent); animation: dkt-pulse 1.6s ease-in-out infinite; }
.dkt__body { display: grid; gap: 3px; min-width: 0; padding-top: 2px; overflow: hidden; }
.dkt__line { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; font-size: 13px; line-height: 1.35; }
.dkt__word { font-weight: 650; color: var(--dkt-ink); }
.dkt__row[data-tone="muted"] .dkt__word { color: var(--text-primary); }
.dkt__by { color: var(--text-primary); }
.dkt__by::before { content: "·"; margin-right: 8px; color: var(--text-faint); }
.dkt__when { margin-left: auto; font-size: 12px; color: var(--text-muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.dkt__detail { margin: 0; font-size: 12.5px; line-height: 1.4; color: var(--text-secondary); overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.dkt--page .dkt__detail, .dkt--ticket .dkt__detail { -webkit-line-clamp: 3; }
.dkt__doors { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 3px; min-width: 0; }
.dkt-chip { display: inline-block; vertical-align: middle; max-width: 100%; height: 22px; line-height: 20px; padding: 0 9px; border-radius: 999px; border: 1px solid var(--border-default); background: var(--bg-surface); color: var(--text-primary); font: inherit; font-size: 11.5px; font-weight: 550; line-height: 1; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; transition: border-color 0.12s ease, background 0.12s ease; }
.dkt-chip--mono { font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace); font-size: 11px; }
.dkt-chip--sheet { border-color: color-mix(in srgb, var(--accent-source) 40%, var(--border-default)); }
@media (hover: hover) { .dkt-chip:hover { border-color: var(--text-muted); background: var(--bg-surface-2); } }
.dkt-chip:focus-visible { outline: 2px solid var(--accent-brief); outline-offset: 1px; }
.dkt__more { justify-self: start; }
.dkt__empty { margin: 0; font-size: 12.5px; color: var(--text-muted); }
@keyframes dkt-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
@keyframes dkt-pulse { 50% { box-shadow: 0 0 0 7px color-mix(in srgb, var(--dkt-ink) 8%, transparent); } }
@media (prefers-reduced-motion: reduce) { .dkt__row { animation: none; } .dkt__row.is-live .dkt__node { animation: none; } }

/* the state model's pill glyph (Lane D, INV-2484) and a docket unit's word in Work */
.dk-state-pill::before { content: none; display: none; }
.dk-state-pill__glyph { font-style: normal; font-weight: 700; margin-right: 2px; }
.wk-dkword { display: inline-flex; align-items: center; gap: 4px; margin-left: 6px; padding: 0 7px; height: 18px; border-radius: 999px; font-size: 11px; font-weight: 600; vertical-align: 1px; color: var(--text-secondary); background: var(--bg-surface-2); white-space: nowrap; }
.wk-dkword i { font-style: normal; font-weight: 700; }
.wk-dkword[data-tone="green"] { color: var(--status-verified); background: var(--status-verified-soft); }
.wk-dkword[data-tone="yellow"] { color: var(--status-warning); background: var(--status-warning-soft); }
.wk-dkword[data-tone="red"] { color: var(--status-error); background: var(--status-error-soft); }
.wk-dkword[data-tone="blue"] { color: var(--accent-brief); background: var(--accent-brief-soft); }
.wk-dkword--panel { margin-left: 0; }

/* a court's own door (Lane D, specs/167 §4): "Check <court> again…" / "Search <court>…" in place */
.dkc-leg { position: relative; }
.dkc-leg__door { margin-left: auto; align-self: center; display: inline-flex; align-items: center; height: 24px; padding: 0 9px; border-radius: 999px; border: 1px solid var(--border-default); background: var(--bg-surface); color: var(--text-primary); font: inherit; font-size: 11.5px; font-weight: 550; cursor: pointer; white-space: nowrap; }
.dkc-legs--box .dkc-leg__door { height: 20px; width: 20px; padding: 0; justify-content: center; font-size: 12px; }
@media (hover: hover) { .dkc-leg__door:hover { border-color: var(--text-muted); background: var(--bg-surface-2); } }
.dkc-leg__door:focus-visible { outline: 2px solid var(--accent-brief); outline-offset: 1px; }

.dkc-note:has(> .dkc-note__door) { grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; }
.dkc-note__door { align-self: center; flex: none; }