/* ============================================================================
 * KoraSafe design-system tokens — the single --ks-* standard (#5916).
 *
 * Adopted from the Claude Design project "Governance core — refactored screens"
 * (tokens.css). This is the canonical token layer every migrated screen builds
 * on. Existing --ds-* screens are untouched; they migrate to --ks-* per the
 * per-screen alignment tickets (#5917-#5937).
 *
 * Reconciliation from the source tokens.css:
 *   - Themes scoped to :root[data-theme] to match the app shell (source used
 *     [data-theme] on the artboard). Light is the :root default; dark overrides.
 *   - Fonts: Inter + JetBrains Mono, matching the design source (decided
 *     2026-07-12 — the govern-core redesign uses the design's typeface; the rest
 *     of the app migrates off Instrument Sans over time). Loaded in src/index.html.
 *   - The source .ks-artboard reset / type scale is intentionally omitted (that
 *     was design-canvas chrome; the app has its own reset).
 * ==========================================================================*/

:root {
  /* Fonts — the design standard: Inter + JetBrains Mono */
  --ks-font-display: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --ks-font-body:    'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --ks-font-mono:    'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Light (default) */
  --ks-bg:           #fcfcfd;
  --ks-bg-soft:      #f6f7fb;
  --ks-bg-card:      #ffffff;
  --ks-bg-elevated:  #f4f6fc;
  --ks-bg-hover:     #eef0f8;

  --ks-fg:           #0e1428;
  --ks-fg-secondary: #1f2842;
  --ks-fg-muted:     #4b5363;
  --ks-fg-dim:       #6b7280;
  --ks-fg-on-accent: #ffffff;

  --ks-border:          rgba(15, 20, 40, 0.08);
  --ks-border-strong:   rgba(15, 20, 40, 0.14);
  --ks-border-emphasis: rgba(79, 70, 229, 0.32);

  --ks-indigo:        #4f46e5;
  --ks-button-primary: #4f46e5;
  --ks-indigo-light:  #6366f1;
  --ks-indigo-muted:  #818cf8;
  --ks-purple:        #7c3aed;
  --ks-purple-light:  #8b5cf6;
  --ks-purple-soft:   #a78bfa;
  --ks-cyan:          #0891b2;

  --ks-indigo-bg:     rgba(79, 70, 229, 0.07);
  --ks-purple-bg:     rgba(124, 58, 237, 0.07);
  --ks-tint-card:     rgba(79, 70, 229, 0.025);

  --ks-cta-gradient:    linear-gradient(135deg, #4f46e5, #7c3aed);
  --ks-shield-gradient: linear-gradient(135deg, #8b5cf6 0%, #6366f1 50%, #4338ca 100%);
  --ks-wordmark-grad:   linear-gradient(90deg, #4f46e5, #4338ca);
  --ks-accent-gradient: linear-gradient(120deg, #4f46e5 0%, #6d28d9 50%, #a78bfa 100%);

  --ks-red:   #dc2626;
  --ks-amber: #d97706;
  --ks-green: #059669;
  --ks-warn:  #dc2626;
  --ks-drift: #ea7317;
  /* fixed near-black for text/icons sitting on a bright accent fill (both themes) */
  --ks-fg-on-bright: #0a1020;

  /* Tailwind utility-compat tokens (#6013 1c) — migrated verbatim from --ds-* so
     the Tailwind color utilities (bg-red-bg, text-*-solid, accent, teal, …) render
     identically once tailwind.config points at --ks. Light values. The *-bg rgba
     are theme-independent, so defined once here. */
  --ks-accent:      #2547d0;
  --ks-teal:        #2547d0;
  --ks-blue-light:  #2547d0;
  --ks-blue-solid:  #2547d0;
  --ks-cyan-solid:  #0891b2;
  --ks-red-bg:      rgba(239, 68, 68, 0.15);
  --ks-red-muted:   #dc2626;
  --ks-red-solid:   #dc2626;
  --ks-green-bg:    rgba(16, 185, 129, 0.15);
  --ks-green-muted: #059669;
  --ks-green-solid: #059669;
  --ks-amber-bg:    rgba(245, 158, 11, 0.15);
  --ks-amber-muted: #b45309;
  --ks-amber-solid: #d97706;

  --ks-shadow-card: 0 1px 2px rgba(15, 20, 40, 0.04), 0 8px 28px rgba(15, 20, 40, 0.06);
  --ks-shadow-soft: 0 1px 2px rgba(15, 20, 40, 0.04);
  --ks-shadow-cta:  0 6px 24px rgba(79, 70, 229, 0.22);

  /* Structural tokens migrated from --ds-* (#6013). Non-color scales — identical
     in both themes, so defined once here. glass/overlay are theme-aware (below). */
  --ks-radius-sm: 6px;
  --ks-radius-md: 10px;
  --ks-radius-lg: 14px;
  --ks-radius-xl: 16px;
  --ks-radius-pill: 999px;
  --ks-radius-full: 9999px;

  --ks-space-1: 0.25rem;
  --ks-space-2: 0.5rem;
  --ks-space-3: 0.75rem;
  --ks-space-4: 1rem;
  --ks-space-5: 1.25rem;
  --ks-space-6: 1.5rem;
  --ks-space-8: 2rem;

  --ks-duration-fast: 0.15s;
  --ks-ease: cubic-bezier(0.16, 1, 0.3, 1);

  --ks-body-size: 1rem;
  --ks-body-weight: 400;
  --ks-h2-size: 1.5rem;
  --ks-h2-leading: 1.25;
  --ks-h2-weight: 500;
  --ks-h2-tracking: 0;
  --ks-h3-size: 1.125rem;
  --ks-h3-leading: 1.35;
  --ks-h4-size: 0.875rem;
  --ks-h4-leading: 1.4;
  --ks-h4-weight: 600;
  --ks-caption-size: 0.75rem;
  --ks-caption-leading: 1.4;
  --ks-overline-size: 0.6875rem;
  --ks-overline-leading: 1.2;
  --ks-overline-tracking: 0;
  --ks-overline-weight: 700;
  --ks-overline-color: var(--ks-fg-dim);
  --ks-small-size: 0.875rem;
  --ks-small-leading: 1.5;

  /* Page type scale (#6069) — the auth and full-page screens.
     A 1:1 port of the retiring --ds-* scale, so those screens render
     unchanged. Deliberately separate from the dense dashboard scale
     (.ks-display/.ks-h3/.ks-title/.ks-body/… in ks-app.css), which runs a
     step smaller: a login page and a data-dense console want different
     type, and the two disagreed under the same role names.

     Own tokens rather than reusing --ks-h2-size/--ks-h3-size, even though
     the values match, because the responsive steps below would otherwise
     shrink every dashboard consuming those tokens on mobile.

     No font-family here on purpose — these inherit body, which stays the
     single lever for the app typeface. */
  --ks-page-h1-size: 2.25rem;
  --ks-page-h1-weight: 500;
  --ks-page-h1-leading: 1.15;
  --ks-page-h1-tracking: 0;
  --ks-page-h2-size: 1.5rem;
  --ks-page-h2-weight: 500;
  --ks-page-h2-leading: 1.25;
  --ks-page-h2-tracking: 0;
  --ks-page-h3-size: 1.125rem;
  --ks-page-h3-weight: 500;
  --ks-page-h3-leading: 1.35;
  --ks-page-h3-tracking: 0;
  --ks-page-h4-size: 0.875rem;
  --ks-page-h4-weight: 600;
  --ks-page-h4-leading: 1.4;
  --ks-page-h4-tracking: 0;
  --ks-page-body-size: 1rem;
  --ks-page-body-weight: 400;
  --ks-page-body-leading: 1.6;
  --ks-page-small-size: 0.875rem;
  --ks-page-small-weight: 400;
  --ks-page-small-leading: 1.5;
  --ks-page-caption-size: 0.75rem;
  --ks-page-caption-weight: 500;
  --ks-page-caption-leading: 1.4;
  --ks-page-caption-tracking: 0;
  --ks-page-overline-size: 0.6875rem;
  --ks-page-overline-weight: 700;
  --ks-page-overline-leading: 1.2;
  --ks-page-overline-tracking: 0;
  --ks-leading-snug: 1.65;
  --ks-tracking-wide: 0.08em;
  --ks-weight-bold: 700;
  --ks-weight-semibold: 600;

  --ks-glass-bg: rgba(0, 0, 0, 0.04);
  --ks-glass-shadow: none;
  --ks-overlay: rgba(15, 23, 42, 0.6);
}

:root[data-theme='dark'] {
  --ks-bg:           #09122b;
  --ks-bg-soft:      #0b1638;
  --ks-bg-card:      #0e1a3d;
  --ks-bg-elevated:  #122150;
  --ks-bg-hover:     #16265c;

  --ks-fg:           #f3f4f6;
  --ks-fg-secondary: #cbd5e1;
  --ks-fg-muted:     #9aa7bd;
  --ks-fg-dim:       #868fa1;
  --ks-fg-on-accent: #ffffff;

  --ks-border:          rgba(148, 163, 184, 0.14);
  --ks-border-strong:   rgba(148, 163, 184, 0.24);
  --ks-border-emphasis: rgba(165, 180, 252, 0.42);

  --ks-indigo:        #6366f1;
  --ks-button-primary: #4f46e5;
  --ks-indigo-light:  #818cf8;
  --ks-indigo-muted:  #a5b4fc;
  --ks-purple:        #8b5cf6;
  --ks-purple-light:  #a78bfa;
  --ks-purple-soft:   #c4b5fd;
  --ks-cyan:          #67e8f9;

  --ks-indigo-bg:     rgba(99, 102, 241, 0.12);
  --ks-purple-bg:     rgba(139, 92, 246, 0.12);
  --ks-tint-card:     rgba(99, 102, 241, 0.04);

  --ks-cta-gradient:    linear-gradient(135deg, #6366f1, #8b5cf6);
  --ks-shield-gradient: linear-gradient(135deg, #a78bfa 0%, #6366f1 50%, #4f46e5 100%);
  --ks-wordmark-grad:   linear-gradient(90deg, #818cf8, #6366f1);
  --ks-accent-gradient: linear-gradient(120deg, #818cf8 0%, #a78bfa 50%, #c4b5fd 100%);

  --ks-red:   #ef4444;
  --ks-amber: #f59e0b;
  --ks-green: #10b981;
  --ks-warn:  #ef6f6f;
  --ks-drift: #f0843e;

  /* Tailwind utility-compat (#6013 1c) — dark values from --ds-*. blue-solid and
     the *-bg rgba are theme-independent (defined in :root above). */
  --ks-accent:      #9db4f2;
  --ks-teal:        #9db4f2;
  --ks-blue-light:  #9db4f2;
  --ks-cyan-solid:  #22d3ee;
  --ks-red-muted:   #fca5a5;
  --ks-red-solid:   #ef4444;
  --ks-green-muted: #6ee7b7;
  --ks-green-solid: #10b981;
  --ks-amber-muted: #fcd34d;
  --ks-amber-solid: #f59e0b;

  --ks-shadow-card: 0 1px 2px rgba(0, 0, 0, 0.4), 0 8px 28px rgba(0, 0, 0, 0.18);
  --ks-shadow-soft: 0 1px 2px rgba(0, 0, 0, 0.3);
  --ks-shadow-cta:  0 6px 24px rgba(99, 102, 241, 0.30);

  /* theme-aware structural tokens (#6013) */
  --ks-glass-bg: rgba(14, 24, 49, 0.76);
  --ks-glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
  --ks-overlay: rgba(2, 6, 23, 0.7);
}

/* Page type scale — responsive steps (#6069).
   Ported verbatim from the retiring --ds-* scale so the auth and full-page
   screens keep shrinking on small viewports exactly as they do today. Scoped
   to --ks-page-* on purpose: the dashboard scale shares these values but must
   NOT inherit the steps, or every --ks-h2-size/--ks-h3-size consumer in
   ks-app.css would shrink on mobile too. */
@media (max-width: 768px) {
  :root {
    --ks-page-h1-size: 1.75rem;
    --ks-page-h2-size: 1.25rem;
    --ks-page-h3-size: 1rem;
  }
}

@media (max-width: 480px) {
  :root {
    --ks-page-h1-size: 1.5rem;
    --ks-page-h2-size: 1.125rem;
  }
}

/* Shared helpers from the design system (mono + gradient text). */
.ks-mono { font-family: var(--ks-font-mono); }
.ks-grad-text {
  background: var(--ks-accent-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

/* ============================================================================
 * Governance-core identity screens — shared component layer (#5934-#5937).
 *
 * Ported from the design source `response.css` + the identity `.dc.html`
 * artboards. Everything is scoped under `.ks-screen` so the generic class
 * names (.btn, .card, .section, .layout, .rail) never collide with the app
 * shell or ks-app.css. Per-screen divergent classes are scoped under a
 * screen modifier (`.ks-screen--org-profile` etc.). Tokens resolve from the
 * `:root[data-theme]` blocks above, so both themes are correct automatically.
 * ==========================================================================*/
.ks-screen {
  font-family: var(--ks-font-body);
  color: var(--ks-fg);
  padding: 28px 32px 56px;
  max-width: 1200px;
  width: 100%;
  -webkit-font-smoothing: antialiased;
}
.ks-screen *, .ks-screen *::before, .ks-screen *::after { box-sizing: border-box; }
.ks-screen h1, .ks-screen h2, .ks-screen h3, .ks-screen h4 { font-family: var(--ks-font-display); color: var(--ks-fg); margin: 0; }
.ks-screen p { margin: 0; }
.ks-screen ul { margin: 0; padding: 0; list-style: none; }
.ks-screen .spacer { flex: 1; }
.ks-screen .muted { font-size: 12.5px; color: var(--ks-fg-dim); }

/* Page head */
.ks-screen .page-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.ks-screen .page-head h1 { font-size: 24px; font-weight: 600; letter-spacing: -0.02em; }
.ks-screen .page-head .sub { margin-top: 6px; font-size: 14px; color: var(--ks-fg-muted); max-width: 70ch; line-height: 1.55; }

/* Buttons */
.ks-screen .btn { font-size: 13px; font-weight: 500; font-family: inherit; border-radius: 10px; padding: 9px 15px; display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--ks-border-strong); background: var(--ks-bg-card); color: var(--ks-fg); cursor: pointer; transition: border-color .15s, transform .15s, background .15s; }
.ks-screen .btn svg { width: 15px; height: 15px; }
.ks-screen .btn:hover { border-color: var(--ks-border-emphasis); }
.ks-screen .btn:active { transform: scale(0.985); }
.ks-screen .btn:disabled { opacity: .55; cursor: default; }
.ks-screen .btn.primary { border: 0; border-radius: 999px; background: var(--ks-button-primary); color: var(--ks-fg-on-accent); box-shadow: none; }
.ks-screen .btn.primary:hover { background: color-mix(in srgb, var(--ks-button-primary), black 10%); }
.ks-screen .btn.primary:active { background: color-mix(in srgb, var(--ks-button-primary), black 16%); }
.ks-screen .btn.primary:focus-visible { outline: 2px solid var(--ks-indigo-muted); outline-offset: 2px; }
.ks-screen .btn.primary svg { color: inherit; stroke: currentColor; }

/* Primary buttons sit on a dark accent fill in light mode. Keep every shared
   outline-icon path on the same white foreground as its label, even when an
   icon utility or SVG presentation attribute supplies a darker color. */
/* Colored-fill CTA buttons keep a white icon in BOTH themes (#6014, root fix for
   the recurring light-mode dark-icon bug). The .ks-app-main light-mode rule forces
   inherited near-black text, so any icon not asserting its own color goes dark.
   This ONE unconditional block covers every colored-fill button — including the
   bespoke onboarding .continue — instead of a theme-scoped allow-list that keeps
   missing classes. All app icons are currentColor/stroke-driven. */
:is(.ks-btn--primary, .ds-btn--primary, .ds-cta-primary, .btn.primary, .btn-primary, .alpha-cta-btn, .cta-btn:not(.cta-btn-secondary), .tier-cta, .ks-setup-map .sf .continue) :is(.ks-btn__icon, .ds-btn__icon, svg) {
  color: var(--ks-fg-on-accent, var(--ds-text-on-accent)) !important;
  stroke: currentColor !important;
}
.ks-screen .btn.ghost { background: transparent; }
.ks-screen .btn.sm { padding: 0 13px; height: 34px; }

/* Icon button */
.ks-screen .icon-btn { width: 34px; height: 34px; border-radius: 9px; border: 1px solid var(--ks-border); background: var(--ks-bg-card); color: var(--ks-fg-muted); display: grid; place-items: center; cursor: pointer; }
.ks-screen .icon-btn:hover { color: var(--ks-fg); border-color: var(--ks-border-strong); }
.ks-screen .icon-btn svg { width: 17px; height: 17px; }

/* Search */
.ks-screen .search { display: flex; align-items: center; gap: 9px; background: var(--ks-bg-card); border: 1px solid var(--ks-border); border-radius: 10px; padding: 9px 13px; min-width: 300px; color: var(--ks-fg-dim); }
.ks-screen .search svg { width: 16px; height: 16px; }
.ks-screen .search input { border: 0; background: transparent; outline: none; color: var(--ks-fg); font: inherit; font-size: 13.5px; width: 100%; }
.ks-screen .search input::placeholder { color: var(--ks-fg-dim); }

/* Toolbar + chips */
.ks-screen .toolbar { display: flex; align-items: center; gap: 8px; margin: 24px 0 16px; flex-wrap: wrap; }
.ks-screen .chip { font-size: 12.5px; font-family: inherit; color: var(--ks-fg-muted); border: 1px solid var(--ks-border); background: var(--ks-bg-card); border-radius: 999px; padding: 6px 13px; display: inline-flex; align-items: center; gap: 7px; cursor: pointer; transition: border-color .15s, color .15s; }
.ks-screen .chip svg { width: 13px; height: 13px; }
.ks-screen .chip:hover { color: var(--ks-fg-secondary); border-color: var(--ks-border-strong); }
.ks-screen .chip.on { color: var(--ks-fg); border-color: var(--ks-border-emphasis); background: var(--ks-indigo-bg); }

/* Meta pill */
.ks-screen .pill { font-size: 11px; padding: 3px 9px; border-radius: 999px; display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--ks-border); color: var(--ks-fg-muted); background: var(--ks-bg-elevated); white-space: nowrap; }
.ks-screen .pill svg { width: 12px; height: 12px; }

/* Section header (mono overline) */
.ks-screen .section + .section { margin-top: 28px; }
.ks-screen .section h2 { font-size: 13px; font-family: var(--ks-font-mono); letter-spacing: .06em; text-transform: uppercase; color: var(--ks-fg-dim); font-weight: 500; margin-bottom: 13px; display: flex; align-items: center; gap: 8px; }
.ks-screen .section h2 svg { width: 14px; height: 14px; }

/* Avatars */
.ks-screen .av { width: 36px; height: 36px; border-radius: 50%; background: var(--ks-cta-gradient); color: #fff; display: grid; place-items: center; font-size: 13px; font-weight: 600; flex: none; }
.ks-screen img.av { object-fit: cover; background: var(--ks-bg-elevated); }
.ks-screen .av.g2 { background: linear-gradient(135deg, #8b5cf6, #6366f1); }
.ks-screen .av.g3 { background: linear-gradient(135deg, #6366f1, #4f46e5); }
.ks-screen .av.g4 { background: linear-gradient(135deg, #a78bfa, #8b5cf6); }
.ks-screen .av.g5 { background: linear-gradient(135deg, #818cf8, #a78bfa); }

/* Detail rail (sticky) */
.ks-screen .rail { position: sticky; top: 76px; display: flex; flex-direction: column; gap: 14px; align-self: start; }

/* Inline edit / notice messages */
.ks-screen .ks-msg { border-radius: 11px; padding: 11px 15px; font-size: 13px; margin-top: 16px; border: 1px solid var(--ks-border); }
.ks-screen .ks-msg[data-kind="error"] { color: var(--ks-red); background: color-mix(in srgb, var(--ks-red) 10%, transparent); border-color: color-mix(in srgb, var(--ks-red) 30%, transparent); }
.ks-screen .ks-msg[data-kind="success"] { color: var(--ks-green); background: color-mix(in srgb, var(--ks-green) 10%, transparent); border-color: color-mix(in srgb, var(--ks-green) 30%, transparent); }

/* Loading / empty */
.ks-screen .ks-loading { color: var(--ks-fg-muted); font-size: 14px; padding: 40px 4px; }
.ks-screen .ks-empty { border: 1px dashed var(--ks-border-strong); border-radius: 14px; padding: 28px; text-align: center; display: flex; flex-direction: column; gap: 6px; }
.ks-screen .ks-empty strong { font-size: 15px; color: var(--ks-fg); }
.ks-screen .ks-empty span { font-size: 13px; color: var(--ks-fg-muted); }

/* ---- Edit form (shared drawer-less inline editor) ---- */
.ks-screen .ks-form { background: var(--ks-bg-card); border: 1px solid var(--ks-border); border-radius: 16px; box-shadow: var(--ks-shadow-card); padding: 20px 22px; margin-top: 18px; display: flex; flex-direction: column; gap: 16px; }
.ks-screen .ks-form label { display: flex; flex-direction: column; gap: 7px; font-size: 11px; font-family: var(--ks-font-mono); letter-spacing: .04em; text-transform: uppercase; color: var(--ks-fg-dim); }
.ks-screen .ks-form input, .ks-screen .ks-form textarea, .ks-screen .ks-form select { width: 100%; background: var(--ks-bg-soft); border: 1px solid var(--ks-border); border-radius: 10px; padding: 11px 13px; color: var(--ks-fg); font: inherit; font-size: 14px; text-transform: none; letter-spacing: 0; }
.ks-screen .ks-form textarea { min-height: 84px; line-height: 1.5; resize: vertical; }
.ks-screen .ks-form fieldset { border: 1px solid var(--ks-border); border-radius: 12px; padding: 13px 15px; display: flex; flex-direction: column; gap: 9px; }
.ks-screen .ks-form legend { font-size: 11px; font-family: var(--ks-font-mono); letter-spacing: .04em; text-transform: uppercase; color: var(--ks-fg-dim); padding: 0 6px; }
.ks-screen .ks-form fieldset label { flex-direction: row; align-items: center; gap: 9px; font-family: inherit; font-size: 13px; letter-spacing: 0; text-transform: none; color: var(--ks-fg-secondary); }
.ks-screen .ks-form-actions { display: flex; gap: 10px; justify-content: flex-end; }

/* ================= Regulatory library exemplar (#5917) ================= */
.ks-screen--regulatory-library { max-width: 1120px; }
.ks-screen--regulatory-library .filter-chip { position: relative; }
.ks-screen--regulatory-library .filter-chip summary { list-style: none; }
.ks-screen--regulatory-library .filter-chip summary::-webkit-details-marker { display: none; }
.ks-screen--regulatory-library .filter-menu {
  position: absolute;
  z-index: 20;
  top: calc(100% + 7px);
  left: 0;
  min-width: 190px;
  padding: 6px;
  border: 1px solid var(--ks-border-strong);
  border-radius: 12px;
  background: var(--ks-bg-card);
  box-shadow: var(--ks-shadow-card);
}
.ks-screen--regulatory-library .filter-menu button {
  width: 100%;
  border: 0;
  border-radius: 8px;
  padding: 8px 10px;
  background: transparent;
  color: var(--ks-fg-secondary);
  font: inherit;
  font-size: 12.5px;
  text-align: left;
  cursor: pointer;
}
.ks-screen--regulatory-library .filter-menu button:hover,
.ks-screen--regulatory-library .filter-menu button.selected {
  color: var(--ks-fg);
  background: var(--ks-indigo-bg);
}
.ks-screen--regulatory-library .source-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.ks-screen--regulatory-library .source-card {
  min-width: 0;
  border: 1px solid var(--ks-border);
  border-radius: 16px;
  background: var(--ks-bg-card);
  box-shadow: var(--ks-shadow-card);
  transition: border-color .15s, transform .15s;
}
.ks-screen--regulatory-library .source-card:hover {
  border-color: var(--ks-border-strong);
  transform: translateY(-1px);
}
.ks-screen--regulatory-library .source-card > a {
  display: flex;
  min-height: 100%;
  flex-direction: column;
  gap: 12px;
  padding: 18px 20px;
  color: inherit;
  text-decoration: none;
}
.ks-screen--regulatory-library .meta-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ks-screen--regulatory-library .pill.type {
  color: var(--ks-indigo-muted);
  border-color: color-mix(in srgb, var(--ks-indigo-light) 32%, transparent);
  background: var(--ks-indigo-bg);
}
.ks-screen--regulatory-library .pill.binding {
  color: var(--ks-amber);
  border-color: color-mix(in srgb, var(--ks-amber) 32%, transparent);
  background: color-mix(in srgb, var(--ks-amber) 12%, transparent);
}
.ks-screen--regulatory-library .source-card h2 {
  font-size: 16px;
  font-weight: 600;
  letter-spacing: -.01em;
}
.ks-screen--regulatory-library .source-card p {
  color: var(--ks-fg-secondary);
  font-size: 13px;
  line-height: 1.5;
}
.ks-screen--regulatory-library .source-foot {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px solid var(--ks-border);
  color: var(--ks-fg-muted);
  font-size: 12.5px;
}
.ks-screen--regulatory-library .source-foot span { display: inline-flex; align-items: center; gap: 6px; }
.ks-screen--regulatory-library .source-foot svg { color: var(--ks-fg-dim); }
.ks-screen--regulatory-library .source-foot .changed { margin-left: auto; color: var(--ks-amber); font-weight: 500; }
.ks-screen--regulatory-library .source-foot .changed svg { color: var(--ks-amber); }
.ks-screen--regulatory-library .library-pagination-row {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  margin-top: 18px;
}
.ks-screen--regulatory-library .page-size { display: flex; flex-direction: column; gap: 5px; color: var(--ks-fg-dim); font-size: 11px; }
.ks-screen--regulatory-library .library-pagination-row select {
  border: 1px solid var(--ks-border);
  border-radius: 9px;
  background: var(--ks-bg-card);
  color: var(--ks-fg);
  padding: 7px 10px;
}
.ks-screen--regulatory-library .pagination { display: flex; align-items: center; gap: 12px; color: var(--ks-fg-muted); font-size: 12.5px; }
@media (max-width: 760px) {
  .ks-screen--regulatory-library .source-grid { grid-template-columns: 1fr; }
  .ks-screen--regulatory-library .page-head .search { min-width: 100%; }
  .ks-screen--regulatory-library .library-pagination-row { align-items: stretch; flex-direction: column; }
}

/* ======================== Source detail (#5918) ======================== */
.ks-screen--source-detail { max-width: 1100px; }
.ks-screen--source-detail .breadcrumbs { display: flex; align-items: center; gap: 8px; margin-bottom: 22px; color: var(--ks-fg-dim); font-size: 12.5px; }
.ks-screen--source-detail .breadcrumbs a { color: var(--ks-fg-muted); text-decoration: none; }
.ks-screen--source-detail .breadcrumbs a:hover { color: var(--ks-fg); }
.ks-screen--source-detail .breadcrumbs strong { color: var(--ks-fg); font-weight: 500; }
.ks-screen--source-detail .meta-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.ks-screen--source-detail .pill.type { color: var(--ks-indigo-muted); border-color: color-mix(in srgb, var(--ks-indigo-light) 32%, transparent); background: var(--ks-indigo-bg); }
.ks-screen--source-detail .pill.binding { color: var(--ks-amber); border-color: color-mix(in srgb, var(--ks-amber) 32%, transparent); background: color-mix(in srgb, var(--ks-amber) 12%, transparent); }
.ks-screen--source-detail .page-head h1 { font-size: 28px; letter-spacing: -.022em; }
.ks-screen--source-detail .page-head .sub { margin-top: 8px; max-width: 56ch; font-size: 14.5px; }
.ks-screen--source-detail .head-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.ks-screen--source-detail .head-actions a { text-decoration: none; white-space: nowrap; }
.ks-screen--source-detail .source-layout { display: grid; grid-template-columns: minmax(0, 1fr) 312px; gap: 28px; margin-top: 28px; align-items: start; }
.ks-screen--source-detail .prose p { color: var(--ks-fg-secondary); font-size: 14.5px; line-height: 1.65; }
.ks-screen--source-detail .prose p + p { margin-top: 12px; }
.ks-screen--source-detail .version-timeline { position: relative; padding-left: 26px; }
.ks-screen--source-detail .version-timeline::before { content: ''; position: absolute; left: 6px; top: 6px; bottom: 8px; width: 2px; background: var(--ks-border); }
.ks-screen--source-detail .version-item { position: relative; padding-bottom: 16px; }
.ks-screen--source-detail .version-item:last-child { padding-bottom: 0; }
.ks-screen--source-detail .version-item::before { content: ''; position: absolute; left: -23px; top: 18px; width: 11px; height: 11px; border-radius: 50%; background: var(--ks-bg); border: 2px solid var(--ks-border-strong); }
.ks-screen--source-detail .version-item.current::before { background: var(--ks-indigo); border-color: var(--ks-indigo-muted); box-shadow: 0 0 0 4px var(--ks-indigo-bg); }
.ks-screen--source-detail .version-card { padding: 15px 17px; border: 1px solid var(--ks-border); border-radius: 14px; background: var(--ks-bg-card); box-shadow: var(--ks-shadow-soft); }
.ks-screen--source-detail .version-item.current .version-card { border-color: var(--ks-border-emphasis); }
.ks-screen--source-detail .version-card:hover { border-color: var(--ks-border-strong); }
.ks-screen--source-detail .version-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ks-screen--source-detail .version-head strong { color: var(--ks-fg); font-family: var(--ks-font-display); font-size: 15px; }
.ks-screen--source-detail .version-head .date { color: var(--ks-fg-dim); font-family: var(--ks-font-mono); font-size: 11.5px; }
.ks-screen--source-detail .version-tag { padding: 3px 9px; border-radius: 999px; font-family: var(--ks-font-mono); font-size: 10.5px; letter-spacing: .03em; }
.ks-screen--source-detail .version-tag.current { color: var(--ks-green); background: color-mix(in srgb, var(--ks-green) 13%, transparent); }
.ks-screen--source-detail .version-tag.historical { color: var(--ks-fg-dim); background: var(--ks-bg-elevated); }
.ks-screen--source-detail .version-card > p { margin-top: 8px; color: var(--ks-fg-secondary); font-size: 13.5px; line-height: 1.55; }
.ks-screen--source-detail .version-foot { display: flex; align-items: center; gap: 14px; margin-top: 12px; padding-top: 11px; border-top: 1px solid var(--ks-border); color: var(--ks-fg-muted); font-size: 12.5px; }
.ks-screen--source-detail .version-foot > span { display: inline-flex; align-items: center; gap: 6px; }
.ks-screen--source-detail .version-links { margin-left: auto; gap: 14px; }
.ks-screen--source-detail .version-links a { display: inline-flex; align-items: center; gap: 5px; color: var(--ks-indigo-light); text-decoration: none; }
.ks-screen--source-detail .source-facts { overflow: hidden; border: 1px solid var(--ks-border); border-radius: 16px; background: var(--ks-bg-card); box-shadow: var(--ks-shadow-card); }
.ks-screen--source-detail .facts-title { padding: 15px 18px 4px; color: var(--ks-fg-dim); font-family: var(--ks-font-mono); font-size: 10.5px; letter-spacing: .07em; text-transform: uppercase; }
.ks-screen--source-detail .source-fact { padding: 11px 18px; border-top: 1px solid var(--ks-border); }
.ks-screen--source-detail .source-fact:first-of-type { border-top: 0; }
.ks-screen--source-detail .source-fact > span { display: block; margin-bottom: 3px; color: var(--ks-fg-dim); font-size: 11.5px; }
.ks-screen--source-detail .source-fact > strong { display: block; color: var(--ks-fg); font-size: 13.5px; font-weight: 500; line-height: 1.45; }
.ks-screen--source-detail .source-fact > strong.ks-mono { color: var(--ks-fg-secondary); font-size: 12.5px; font-weight: 400; }
.ks-screen--source-detail .source-fact .status { display: inline-flex; align-items: center; gap: 7px; color: var(--ks-green); font-weight: 600; }
.ks-screen--source-detail .source-fact .status i { width: 7px; height: 7px; border-radius: 50%; background: var(--ks-green); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ks-green) 16%, transparent); }
@media (max-width: 860px) {
  .ks-screen--source-detail .source-layout { grid-template-columns: 1fr; }
  .ks-screen--source-detail .rail { position: static; }
}

/* ======================== Version view (#5919) ======================== */
.ks-screen--version-view { max-width: 1180px; }
.ks-screen--version-view .breadcrumbs { display: flex; align-items: center; gap: 8px; margin-bottom: 22px; color: var(--ks-fg-dim); font-size: 12.5px; }
.ks-screen--version-view .breadcrumbs a { color: var(--ks-fg-muted); text-decoration: none; }
.ks-screen--version-view .breadcrumbs a:hover { color: var(--ks-fg); }
.ks-screen--version-view .breadcrumbs strong { color: var(--ks-fg); font-weight: 500; }
.ks-screen--version-view .page-head h1 { font-size: 23px; }
.ks-screen--version-view .page-head > a { text-decoration: none; }
.ks-screen--version-view .version-meta { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 7px; color: var(--ks-fg-muted); font-size: 12.5px; }
.ks-screen--version-view .version-meta > span { display: inline-flex; align-items: center; gap: 6px; }
.ks-screen--version-view .version-meta svg { color: var(--ks-fg-dim); }
.ks-screen--version-view .current-tag { padding: 3px 9px; border-radius: 999px; color: var(--ks-green); background: color-mix(in srgb, var(--ks-green) 13%, transparent); font-family: var(--ks-font-mono); font-size: 10.5px; }
.ks-screen--version-view .version-body { display: grid; grid-template-columns: 232px minmax(0, 1fr); gap: 28px; margin-top: 20px; }
.ks-screen--version-view .article-nav { position: sticky; top: 76px; align-self: start; max-height: calc(100vh - 96px); overflow: auto; padding-right: 14px; border-right: 1px solid var(--ks-border); }
.ks-screen--version-view .article-nav .nav-label { padding: 0 8px 8px; color: var(--ks-fg-dim); font-family: var(--ks-font-mono); font-size: 10px; letter-spacing: .07em; text-transform: uppercase; }
.ks-screen--version-view .article-nav a { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 8px 9px; border-radius: 8px; color: var(--ks-fg-muted); font-size: 12.5px; text-decoration: none; }
.ks-screen--version-view .article-nav a:hover { color: var(--ks-fg-secondary); background: var(--ks-bg-hover); }
.ks-screen--version-view .article-nav a.on { color: var(--ks-fg); background: var(--ks-indigo-bg); }
.ks-screen--version-view .article-nav .num, .ks-screen--version-view .article-nav .count { color: var(--ks-fg-dim); font-family: var(--ks-font-mono); font-size: 10.5px; }
.ks-screen--version-view .article-nav a.on .num { color: var(--ks-indigo-muted); }
.ks-screen--version-view .article-block { scroll-margin-top: 76px; margin-top: 26px; }
.ks-screen--version-view .article-block:first-child { margin-top: 0; }
.ks-screen--version-view .article-head { display: flex; align-items: baseline; gap: 11px; flex-wrap: wrap; padding-bottom: 12px; border-bottom: 1px solid var(--ks-border); }
.ks-screen--version-view .article-head > span { color: var(--ks-indigo-muted); font-family: var(--ks-font-mono); font-size: 12px; }
.ks-screen--version-view .article-head h2 { font-size: 17px; letter-spacing: -.01em; }
.ks-screen--version-view .article-head small { margin-left: auto; color: var(--ks-fg-dim); font-size: 12px; }
.ks-screen--version-view .article-split { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 16px; align-items: start; }
.ks-screen--version-view .legal-pane { padding: 15px 17px; border: 1px solid var(--ks-border); border-radius: 13px; background: var(--ks-bg-soft); }
.ks-screen--version-view .pane-label { display: flex; align-items: center; gap: 7px; margin-bottom: 10px; color: var(--ks-fg-dim); font-family: var(--ks-font-mono); font-size: 10px; letter-spacing: .07em; text-transform: uppercase; }
.ks-screen--version-view .legal-paragraph { display: flex; gap: 10px; margin-top: 11px; }
.ks-screen--version-view .legal-paragraph > span { flex: none; padding-top: 1px; color: var(--ks-indigo-muted); font-family: var(--ks-font-mono); font-size: 11.5px; }
.ks-screen--version-view .legal-paragraph p, .ks-screen--version-view .legal-unavailable { color: var(--ks-fg-secondary); font-size: 13px; line-height: 1.6; }
.ks-screen--version-view .read-link { display: inline-flex; align-items: center; gap: 6px; margin-top: 13px; padding-top: 11px; border-top: 1px solid var(--ks-border); color: var(--ks-indigo-light); font-size: 12px; text-decoration: none; }
.ks-screen--version-view .article-requirements { display: flex; flex-direction: column; gap: 10px; }
.ks-screen--version-view .version-requirement { padding: 13px 15px; border: 1px solid var(--ks-border); border-radius: 12px; background: var(--ks-bg-card); box-shadow: var(--ks-shadow-soft); }
.ks-screen--version-view .version-requirement:hover { border-color: var(--ks-border-strong); }
.ks-screen--version-view .requirement-row { display: flex; align-items: center; gap: 9px; margin-bottom: 7px; }
.ks-screen--version-view .requirement-type { padding: 3px 8px; border-radius: 6px; font-family: var(--ks-font-mono); font-size: 9.5px; letter-spacing: .04em; text-transform: uppercase; }
.ks-screen--version-view .requirement-type.safeguard { color: var(--ks-indigo-muted); background: var(--ks-indigo-bg); }
.ks-screen--version-view .requirement-type.oversight { color: var(--ks-purple-light); background: var(--ks-purple-bg); }
.ks-screen--version-view .requirement-type.prohibition { color: var(--ks-red); background: color-mix(in srgb, var(--ks-red) 12%, transparent); }
.ks-screen--version-view .requirement-citation { margin-left: auto; color: var(--ks-fg-dim); font-family: var(--ks-font-mono); font-size: 10.5px; }
.ks-screen--version-view .version-requirement p { color: var(--ks-fg); font-size: 13.5px; line-height: 1.5; }
.ks-screen--version-view .version-requirement > a { display: inline-flex; align-items: center; gap: 5px; margin-top: 8px; color: var(--ks-indigo-light); font-size: 12px; text-decoration: none; }
@media (max-width: 900px) {
  .ks-screen--version-view .version-body { grid-template-columns: 1fr; }
  .ks-screen--version-view .article-nav { position: static; max-height: none; border-right: 0; border-bottom: 1px solid var(--ks-border); padding: 0 0 14px; }
}
@media (max-width: 700px) {
  .ks-screen--version-view .article-split { grid-template-columns: 1fr; }
}

/* ============================ Org profile (#5934) ========================= */
.ks-screen--org-profile { max-width: 1100px; }
.ks-screen--org-profile .orghead { display: flex; align-items: center; gap: 16px; }
.ks-screen--org-profile .orghead .logo { width: 52px; height: 52px; border-radius: 13px; background: var(--ks-cta-gradient); color: #fff; display: grid; place-items: center; font-family: var(--ks-font-display); font-weight: 600; font-size: 22px; flex: none; box-shadow: var(--ks-shadow-cta); }
.ks-screen--org-profile .orghead h1 { font-size: 24px; font-weight: 600; letter-spacing: -0.02em; }
.ks-screen--org-profile .orghead .sub { font-size: 13.5px; color: var(--ks-fg-muted); margin-top: 4px; line-height: 1.5; }
.ks-screen--org-profile .orghead .head-act { margin-left: auto; }

.ks-screen--org-profile .col-main > .section { margin-top: 28px; }
.ks-screen--org-profile .layout { display: grid; grid-template-columns: 1fr 320px; gap: 28px; margin-top: 28px; align-items: start; }
@media (max-width: 900px) { .ks-screen--org-profile .layout { grid-template-columns: 1fr; } }

.ks-screen--org-profile .grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 720px) { .ks-screen--org-profile .grid2 { grid-template-columns: 1fr; } }
.ks-screen--org-profile .icard { background: var(--ks-bg-card); border: 1px solid var(--ks-border); border-radius: 14px; box-shadow: var(--ks-shadow-soft); padding: 17px 19px; }
.ks-screen--org-profile .icard .ch { display: flex; align-items: center; gap: 9px; margin-bottom: 14px; }
.ks-screen--org-profile .icard .ci { width: 30px; height: 30px; border-radius: 8px; background: var(--ks-indigo-bg); color: var(--ks-indigo-muted); display: grid; place-items: center; flex: none; }
.ks-screen--org-profile .icard .ci svg { width: 16px; height: 16px; }
.ks-screen--org-profile .icard .ct { font-size: 14px; font-weight: 600; color: var(--ks-fg); font-family: var(--ks-font-display); }
.ks-screen--org-profile .icard .cn { margin-left: auto; font-family: var(--ks-font-mono); font-size: 11px; color: var(--ks-fg-dim); }

.ks-screen--org-profile .tagset { display: flex; flex-wrap: wrap; gap: 8px; }
.ks-screen--org-profile .tag { font-size: 13px; padding: 7px 12px; border-radius: 999px; border: 1px solid var(--ks-border); background: var(--ks-bg-elevated); color: var(--ks-fg-secondary); display: inline-flex; align-items: center; gap: 8px; }
.ks-screen--org-profile .tag svg { width: 13px; height: 13px; color: var(--ks-indigo-muted); }
.ks-screen--org-profile .tag .sm { font-size: 11px; color: var(--ks-fg-dim); }
.ks-screen--org-profile .tag.empty { color: var(--ks-fg-dim); font-style: italic; }

.ks-screen--org-profile .uses { display: flex; gap: 12px; margin-top: 2px; }
@media (max-width: 720px) { .ks-screen--org-profile .uses { flex-direction: column; } }
.ks-screen--org-profile .use { flex: 1; border: 1px solid var(--ks-border); background: var(--ks-bg-card); border-radius: 12px; padding: 14px 15px; }
.ks-screen--org-profile .use[data-on="true"] { border-color: var(--ks-border-emphasis); background: var(--ks-indigo-bg); }
.ks-screen--org-profile .use .ut { display: flex; align-items: center; justify-content: space-between; }
.ks-screen--org-profile .use .un { font-size: 13.5px; font-weight: 600; color: var(--ks-fg); display: inline-flex; align-items: center; gap: 8px; }
.ks-screen--org-profile .use .un svg { width: 15px; height: 15px; color: var(--ks-indigo-muted); }
.ks-screen--org-profile .use .ud { font-size: 12px; color: var(--ks-fg-muted); margin-top: 9px; line-height: 1.5; }
.ks-screen--org-profile .toggle { width: 34px; height: 19px; border-radius: 999px; background: var(--ks-bg-elevated); border: 1px solid var(--ks-border); position: relative; flex: none; }
.ks-screen--org-profile .toggle::after { content: ""; position: absolute; top: 2px; left: 2px; width: 15px; height: 15px; border-radius: 50%; background: var(--ks-fg-dim); transition: transform .15s, background .15s; }
.ks-screen--org-profile .use[data-on="true"] .toggle { background: var(--ks-indigo); border-color: var(--ks-indigo); }
.ks-screen--org-profile .use[data-on="true"] .toggle::after { transform: translateX(15px); background: #fff; }

.ks-screen--org-profile .rail-panel { background: var(--ks-bg-card); border: 1px solid var(--ks-border); border-radius: 16px; box-shadow: var(--ks-shadow-card); overflow: hidden; }
.ks-screen--org-profile .rail-panel .ah { padding: 16px 18px 12px; }
.ks-screen--org-profile .rail-panel .ah .t { font-size: 14px; font-weight: 600; color: var(--ks-fg); font-family: var(--ks-font-display); display: flex; align-items: center; gap: 9px; }
.ks-screen--org-profile .rail-panel .ah .t svg { width: 16px; height: 16px; color: var(--ks-indigo-muted); }
.ks-screen--org-profile .rail-panel .ah .d { font-size: 12px; color: var(--ks-fg-muted); margin-top: 5px; line-height: 1.5; }
.ks-screen--org-profile .rail-row { display: block; padding: 13px 18px; border-top: 1px solid var(--ks-border); }
.ks-screen--org-profile .rail-row .rr { display: flex; align-items: center; gap: 9px; }
.ks-screen--org-profile .rail-row .nm { font-size: 13.5px; font-weight: 600; color: var(--ks-fg); }
.ks-screen--org-profile .rail-row .cnt { margin-left: auto; font-family: var(--ks-font-mono); font-size: 11px; color: var(--ks-fg-dim); }
.ks-screen--org-profile .rail-row .why { margin-top: 6px; font-size: 12px; color: var(--ks-fg-muted); line-height: 1.5; }

/* Applicable governance sources rail (#5990) — sources derived from subscribed packs. */
.ks-screen--org-profile .dsrc { display: block; padding: 13px 18px; border-top: 1px solid var(--ks-border); }
.ks-screen--org-profile .dsrc .dr { display: flex; align-items: center; gap: 9px; }
.ks-screen--org-profile .dsrc .nm { font-size: 13.5px; font-weight: 600; color: var(--ks-fg); }
.ks-screen--org-profile .dsrc .bind { margin-left: auto; flex: none; font-family: var(--ks-font-mono); font-size: 9.5px; letter-spacing: 0.04em; text-transform: uppercase; padding: 3px 7px; border-radius: 6px; }
.ks-screen--org-profile .dsrc .bind.binding { color: var(--ks-amber); background: color-mix(in srgb, var(--ks-amber) 13%, transparent); }
.ks-screen--org-profile .dsrc .bind.vol { color: var(--ks-fg-muted); background: var(--ks-bg-elevated); }
.ks-screen--org-profile .dsrc .why { margin-top: 8px; font-size: 11.5px; color: var(--ks-fg-dim); display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.ks-screen--org-profile .dsrc .why .wt { font-size: 10.5px; padding: 2px 7px; border-radius: 999px; background: var(--ks-indigo-bg); color: var(--ks-indigo-muted); }

/* ============================== Members (#5935) ========================== */
.ks-screen--members { max-width: 1160px; }
.ks-screen--members .layout { display: grid; grid-template-columns: 340px 1fr; gap: 22px; margin-top: 24px; align-items: start; }
@media (max-width: 900px) { .ks-screen--members .layout { grid-template-columns: 1fr; } }

/* member list */
.ks-screen--members .mlist { background: var(--ks-bg-card); border: 1px solid var(--ks-border); border-radius: 16px; box-shadow: var(--ks-shadow-card); overflow: hidden; }
.ks-screen--members .mlist .lh { padding: 13px 16px; border-bottom: 1px solid var(--ks-border); font-family: var(--ks-font-mono); font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--ks-fg-dim); display: flex; align-items: center; justify-content: space-between; }
.ks-screen--members .mrow { display: flex; align-items: center; gap: 12px; padding: 13px 16px; border: 0; border-top: 1px solid var(--ks-border); background: transparent; width: 100%; font: inherit; text-align: left; color: inherit; cursor: pointer; transition: background .12s; }
.ks-screen--members .mrow:first-of-type { border-top: 0; }
.ks-screen--members .mrow:hover { background: var(--ks-bg-hover); }
.ks-screen--members .mrow.sel { background: var(--ks-indigo-bg); box-shadow: inset 3px 0 0 var(--ks-indigo); }
.ks-screen--members .mrow .mi { min-width: 0; flex: 1; display: flex; flex-direction: column; }
.ks-screen--members .mrow .nm { font-size: 13.5px; font-weight: 600; color: var(--ks-fg); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ks-screen--members .mrow .dept { font-size: 12px; color: var(--ks-fg-muted); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ks-screen--members .mrow .rc { font-family: var(--ks-font-mono); font-size: 10.5px; color: var(--ks-fg-dim); background: var(--ks-bg-elevated); border: 1px solid var(--ks-border); border-radius: 999px; padding: 3px 8px; flex: none; }
.ks-screen--members .mcol-pager { margin-top: 12px; }

/* detail panel */
.ks-screen--members .detail { background: var(--ks-bg-card); border: 1px solid var(--ks-border); border-radius: 16px; box-shadow: var(--ks-shadow-card); overflow: hidden; }
.ks-screen--members .dhead { display: flex; align-items: center; gap: 16px; padding: 22px 24px; border-bottom: 1px solid var(--ks-border); }
.ks-screen--members .dhead .av { width: 56px; height: 56px; font-size: 19px; }
.ks-screen--members .dhead .nm { font-size: 19px; font-weight: 600; color: var(--ks-fg); font-family: var(--ks-font-display); letter-spacing: -0.01em; }
.ks-screen--members .dhead .em { font-size: 13px; color: var(--ks-fg-muted); margin-top: 3px; display: inline-flex; align-items: center; gap: 7px; }
.ks-screen--members .dhead .em svg { color: var(--ks-fg-dim); }
.ks-screen--members .dhead .act { margin-left: auto; }

.ks-screen--members .dsec { padding: 20px 24px; border-bottom: 1px solid var(--ks-border); }
.ks-screen--members .dsec:last-child { border-bottom: 0; }
.ks-screen--members .dsec .sl { font-family: var(--ks-font-mono); font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--ks-fg-dim); margin-bottom: 13px; display: flex; align-items: center; gap: 8px; }
.ks-screen--members .dsec .sl .hint { text-transform: none; letter-spacing: 0; color: var(--ks-fg-dim); font-family: var(--ks-font-body); }

.ks-screen--members .deptpick { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.ks-screen--members .deptbig { display: inline-flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 600; color: var(--ks-fg); background: var(--ks-bg-elevated); border: 1px solid var(--ks-border-strong); border-radius: 11px; padding: 10px 15px; }
.ks-screen--members .deptbig svg { color: var(--ks-indigo-muted); }
.ks-screen--members .deptpick .note { font-size: 12px; color: var(--ks-fg-dim); }

.ks-screen--members .roles { display: flex; flex-direction: column; gap: 10px; }
.ks-screen--members .role { display: flex; align-items: center; gap: 13px; padding: 13px 15px; border: 1px solid var(--ks-border); border-radius: 12px; background: var(--ks-bg-soft); }
.ks-screen--members .role .ri { width: 34px; height: 34px; border-radius: 9px; background: var(--ks-indigo-bg); color: var(--ks-indigo-muted); display: grid; place-items: center; flex: none; }
.ks-screen--members .role.admin .ri { background: var(--ks-purple-bg); color: var(--ks-purple-light); }
.ks-screen--members .role .rt { min-width: 0; flex: 1; }
.ks-screen--members .role .rn { font-size: 13.5px; font-weight: 600; color: var(--ks-fg); }
.ks-screen--members .role .rd { font-size: 12px; color: var(--ks-fg-muted); margin-top: 3px; }

.ks-screen--members .accsum { display: flex; flex-wrap: wrap; gap: 8px; }
.ks-screen--members .acc { font-size: 12px; padding: 6px 11px; border-radius: 999px; background: var(--ks-bg-elevated); border: 1px solid var(--ks-border); color: var(--ks-fg-secondary); display: inline-flex; align-items: center; gap: 7px; }
.ks-screen--members .acc svg { color: var(--ks-green); }

/* ============================ Departments (#5936) ======================== */
.ks-screen--departments { max-width: 1120px; }
.ks-screen--departments .list { display: flex; flex-direction: column; gap: 11px; }
.ks-screen--departments .drow { background: var(--ks-bg-card); border: 1px solid var(--ks-border); border-radius: 14px; box-shadow: var(--ks-shadow-soft); transition: border-color .15s; overflow: hidden; }
.ks-screen--departments .drow:hover { border-color: var(--ks-border-strong); }
.ks-screen--departments .drow.archived { opacity: .62; }
.ks-screen--departments .dhead { display: grid; grid-template-columns: 1fr auto; gap: 20px; align-items: center; padding: 16px 20px; }
.ks-screen--departments .dleft { display: flex; align-items: center; gap: 14px; min-width: 0; }
.ks-screen--departments .ic { width: 38px; height: 38px; border-radius: 10px; background: var(--ks-indigo-bg); color: var(--ks-indigo-muted); display: grid; place-items: center; flex: none; }
.ks-screen--departments .drow.archived .ic { background: var(--ks-bg-elevated); color: var(--ks-fg-dim); }
.ks-screen--departments .dmeta { min-width: 0; }
.ks-screen--departments .dname { font-size: 15.5px; font-weight: 600; color: var(--ks-fg); font-family: var(--ks-font-display); letter-spacing: -0.01em; display: flex; align-items: center; gap: 10px; }
.ks-screen--departments .ddesc { font-size: 13px; color: var(--ks-fg-muted); margin-top: 5px; line-height: 1.5; max-width: 70ch; }
.ks-screen--departments .dright { display: flex; align-items: center; gap: 18px; }
.ks-screen--departments .stat { text-align: right; }
.ks-screen--departments .stat .v { font-family: var(--ks-font-mono); font-size: 18px; color: var(--ks-fg); font-weight: 500; }
.ks-screen--departments .stat .k { font-size: 11px; color: var(--ks-fg-dim); margin-top: 2px; }
.ks-screen--departments .ownerslot { display: flex; flex-direction: column; padding: 0 14px 0 4px; border-right: 1px solid var(--ks-border); }
.ks-screen--departments .ownerslot .ol { font-size: 10px; font-family: var(--ks-font-mono); letter-spacing: .04em; text-transform: uppercase; color: var(--ks-fg-dim); }
.ks-screen--departments .ownerslot .ov { font-size: 12.5px; color: var(--ks-fg-secondary); margin-top: 3px; display: inline-flex; align-items: center; gap: 6px; }
.ks-screen--departments .ownerslot .ov svg { color: var(--ks-fg-dim); }
.ks-screen--departments .ownerslot .ov.empty { color: var(--ks-fg-dim); font-style: italic; }
.ks-screen--departments .rowacts { display: flex; align-items: center; gap: 7px; }
.ks-screen--departments .iact { width: 32px; height: 32px; border-radius: 8px; border: 1px solid var(--ks-border); background: transparent; color: var(--ks-fg-muted); display: grid; place-items: center; cursor: pointer; transition: color .15s, border-color .15s; }
.ks-screen--departments .iact:hover { color: var(--ks-fg); border-color: var(--ks-border-strong); }
.ks-screen--departments .iact.danger:hover { color: var(--ks-red); border-color: color-mix(in srgb, var(--ks-red) 32%, transparent); }
.ks-screen--departments .iact:disabled { opacity: .5; cursor: default; }
.ks-screen--departments .expander { width: 32px; height: 32px; border-radius: 8px; border: 1px solid transparent; background: transparent; color: var(--ks-fg-dim); display: grid; place-items: center; cursor: pointer; }
.ks-screen--departments .expander svg { transition: transform .18s; }
.ks-screen--departments .drow.open .expander svg { transform: rotate(180deg); }
.ks-screen--departments .reactivate { font-size: 12.5px; font-family: inherit; color: var(--ks-green); border: 1px solid color-mix(in srgb, var(--ks-green) 32%, transparent); background: color-mix(in srgb, var(--ks-green) 10%, transparent); border-radius: 9px; padding: 7px 12px; cursor: pointer; display: inline-flex; align-items: center; gap: 7px; }

/* members drill-in */
.ks-screen--departments .members { border-top: 1px solid var(--ks-border); background: var(--ks-bg-soft); padding: 16px 20px 18px 72px; }
.ks-screen--departments .members .mh { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.ks-screen--departments .members .mh .t { font-family: var(--ks-font-mono); font-size: 10.5px; letter-spacing: .05em; text-transform: uppercase; color: var(--ks-fg-dim); }
.ks-screen--departments .mgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
@media (max-width: 720px) { .ks-screen--departments .mgrid { grid-template-columns: 1fr; } }
.ks-screen--departments .mchip { display: flex; align-items: center; gap: 10px; padding: 9px 11px; border: 1px solid var(--ks-border); border-radius: 10px; background: var(--ks-bg-card); }
.ks-screen--departments .mchip .av { width: 28px; height: 28px; font-size: 11px; }
.ks-screen--departments .mchip .mn { font-size: 13px; color: var(--ks-fg); font-weight: 500; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ks-screen--departments .mchip .mr { font-size: 11.5px; color: var(--ks-fg-dim); margin-left: auto; flex: none; }
.ks-screen--departments .mchip .rm { width: 26px; height: 26px; border-radius: 7px; border: 1px solid transparent; background: transparent; color: var(--ks-fg-dim); display: grid; place-items: center; cursor: pointer; flex: none; }
.ks-screen--departments .mchip .rm:hover { color: var(--ks-red); border-color: color-mix(in srgb, var(--ks-red) 30%, transparent); }
.ks-screen--departments .addmember { margin-top: 11px; font-size: 12.5px; font-family: inherit; color: var(--ks-indigo-light); border: 1px dashed var(--ks-border-strong); background: transparent; border-radius: 9px; padding: 8px 13px; cursor: pointer; display: inline-flex; align-items: center; gap: 7px; }
.ks-screen--departments .addmember:disabled { opacity: .5; cursor: default; }

.ks-screen--departments .sech { display: flex; align-items: center; gap: 11px; margin: 26px 0 12px; }
.ks-screen--departments .sech .t { font-family: var(--ks-font-mono); font-size: 11px; letter-spacing: .07em; text-transform: uppercase; color: var(--ks-fg-dim); display: inline-flex; align-items: center; gap: 8px; }
.ks-screen--departments .sech .line { flex: 1; height: 1px; background: var(--ks-border); }
.ks-screen--departments .sech .cnt { font-family: var(--ks-font-mono); font-size: 11px; color: var(--ks-fg-dim); }

/* =============================== Roles (#5937) =========================== */
.ks-screen--roles { max-width: 1200px; }
.ks-screen--roles .layout { display: grid; grid-template-columns: 340px 1fr; gap: 22px; margin-top: 24px; align-items: start; }
@media (max-width: 920px) { .ks-screen--roles .layout { grid-template-columns: 1fr; } }

/* role list groups */
.ks-screen--roles .rgroup { margin-bottom: 20px; }
.ks-screen--roles .rgh { display: flex; align-items: center; gap: 9px; margin-bottom: 10px; padding: 0 4px; }
.ks-screen--roles .rgh .t { font-family: var(--ks-font-mono); font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--ks-fg-dim); display: inline-flex; align-items: center; gap: 6px; }
.ks-screen--roles .rgh .line { flex: 1; height: 1px; background: var(--ks-border); }
.ks-screen--roles .rgh .cnt { font-family: var(--ks-font-mono); font-size: 10.5px; color: var(--ks-fg-dim); }
.ks-screen--roles .rlist { display: flex; flex-direction: column; gap: 8px; }
.ks-screen--roles .rcard { display: flex; align-items: center; gap: 12px; padding: 13px 15px; background: var(--ks-bg-card); border: 1px solid var(--ks-border); border-radius: 12px; box-shadow: var(--ks-shadow-soft); cursor: pointer; transition: border-color .15s; width: 100%; text-align: left; font: inherit; color: inherit; }
.ks-screen--roles .rcard:hover { border-color: var(--ks-border-strong); }
.ks-screen--roles .rcard.sel { border-color: var(--ks-border-emphasis); background: var(--ks-indigo-bg); box-shadow: inset 3px 0 0 var(--ks-indigo); }
.ks-screen--roles .rcard.retired { opacity: .6; }
.ks-screen--roles .rci { width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; flex: none; background: var(--ks-bg-elevated); color: var(--ks-fg-muted); }
.ks-screen--roles .rcard.custom .rci { background: var(--ks-indigo-bg); color: var(--ks-indigo-muted); }
.ks-screen--roles .rcbody { min-width: 0; flex: 1; }
.ks-screen--roles .rcname { font-size: 13.5px; font-weight: 600; color: var(--ks-fg); display: flex; align-items: center; gap: 8px; }
.ks-screen--roles .rcdesc { font-size: 11.5px; color: var(--ks-fg-muted); margin-top: 3px; line-height: 1.4; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ks-screen--roles .rccount { font-family: var(--ks-font-mono); font-size: 10.5px; color: var(--ks-fg-dim); flex: none; }
.ks-screen--roles .tagsys { font-family: var(--ks-font-mono); font-size: 8.5px; letter-spacing: .04em; text-transform: uppercase; padding: 2px 6px; border-radius: 5px; background: var(--ks-bg-elevated); color: var(--ks-fg-dim); border: 1px solid var(--ks-border); }
.ks-screen--roles .tagret { font-family: var(--ks-font-mono); font-size: 8.5px; letter-spacing: .04em; text-transform: uppercase; padding: 2px 6px; border-radius: 5px; background: color-mix(in srgb, var(--ks-amber) 13%, transparent); color: var(--ks-amber); }

/* detail */
.ks-screen--roles .detail { background: var(--ks-bg-card); border: 1px solid var(--ks-border); border-radius: 16px; box-shadow: var(--ks-shadow-card); overflow: hidden; }
.ks-screen--roles .dh { display: flex; align-items: flex-start; gap: 15px; padding: 20px 22px; border-bottom: 1px solid var(--ks-border); }
.ks-screen--roles .dh .di { width: 44px; height: 44px; border-radius: 11px; background: var(--ks-indigo-bg); color: var(--ks-indigo-muted); display: grid; place-items: center; flex: none; }
.ks-screen--roles .dh .dn { font-size: 18px; font-weight: 600; color: var(--ks-fg); font-family: var(--ks-font-display); letter-spacing: -0.01em; display: flex; align-items: center; gap: 10px; }
.ks-screen--roles .dh .dd { font-size: 13px; color: var(--ks-fg-muted); margin-top: 5px; line-height: 1.5; max-width: 60ch; }
.ks-screen--roles .dh .dacts { margin-left: auto; display: flex; gap: 8px; flex: none; }

.ks-screen--roles .syslock { display: flex; align-items: center; gap: 11px; padding: 13px 22px; background: var(--ks-bg-soft); border-bottom: 1px solid var(--ks-border); font-size: 12.5px; color: var(--ks-fg-muted); }
.ks-screen--roles .syslock svg { color: var(--ks-fg-dim); flex: none; }
.ks-screen--roles .syslock .cta { margin-left: auto; }
.ks-screen--roles .retbanner { display: flex; align-items: center; gap: 12px; padding: 13px 22px; background: color-mix(in srgb, var(--ks-amber) 9%, transparent); border-bottom: 1px solid color-mix(in srgb, var(--ks-amber) 24%, transparent); font-size: 12.5px; color: var(--ks-amber); }
.ks-screen--roles .retbanner svg { flex: none; }
.ks-screen--roles .retbanner b { color: var(--ks-fg); font-weight: 600; }
.ks-screen--roles .retbanner .cta { margin-left: auto; }

.ks-screen--roles .permhead { display: flex; align-items: center; justify-content: space-between; padding: 16px 22px 6px; }
.ks-screen--roles .permhead .t { font-family: var(--ks-font-mono); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--ks-fg-dim); }
.ks-screen--roles .permhead .tally { font-size: 12px; color: var(--ks-fg-secondary); font-family: var(--ks-font-mono); }
.ks-screen--roles .permhead .tally b { color: var(--ks-fg); }
.ks-screen--roles .permbody { padding: 8px 22px 20px; }
.ks-screen--roles .rolefield { display: flex; flex-direction: column; gap: 7px; font-size: 11px; font-family: var(--ks-font-mono); letter-spacing: .04em; text-transform: uppercase; color: var(--ks-fg-dim); margin-bottom: 14px; }
.ks-screen--roles .rolefield input, .ks-screen--roles .rolefield textarea, .ks-screen--roles .rolefield select { background: var(--ks-bg-soft); border: 1px solid var(--ks-border); border-radius: 10px; padding: 11px 13px; color: var(--ks-fg); font: inherit; font-size: 14px; text-transform: none; letter-spacing: 0; }
.ks-screen--roles .rolefield textarea { min-height: 72px; line-height: 1.5; resize: vertical; }
.ks-screen--roles .parea { border: 1px solid var(--ks-border); border-radius: 12px; overflow: hidden; margin-top: 12px; }
.ks-screen--roles .pareah { display: flex; align-items: center; gap: 11px; padding: 12px 15px; background: var(--ks-bg-soft); border-bottom: 1px solid var(--ks-border); }
.ks-screen--roles .pareah .pi { width: 28px; height: 28px; border-radius: 8px; background: var(--ks-bg-elevated); color: var(--ks-fg-muted); display: grid; place-items: center; flex: none; }
.ks-screen--roles .pareah .pt { font-size: 13.5px; font-weight: 600; color: var(--ks-fg); }
.ks-screen--roles .pareah .pc { margin-left: auto; font-family: var(--ks-font-mono); font-size: 11px; color: var(--ks-fg-dim); }
.ks-screen--roles .pareah .selall { font-size: 11.5px; color: var(--ks-indigo-light); cursor: pointer; background: none; border: 0; font-family: inherit; }
.ks-screen--roles .pareah .selall:hover { text-decoration: underline; }
.ks-screen--roles .prow { display: flex; align-items: center; gap: 13px; padding: 11px 15px; border-top: 1px solid var(--ks-border); }
.ks-screen--roles .prow:first-child { border-top: 0; }
.ks-screen--roles .prow .pinfo { min-width: 0; flex: 1; }
.ks-screen--roles .prow .pn { font-size: 13px; color: var(--ks-fg); font-weight: 500; }
.ks-screen--roles .prow .pd { font-size: 11.5px; color: var(--ks-fg-dim); margin-top: 2px; line-height: 1.4; font-family: var(--ks-font-mono); }
.ks-screen--roles .grantpick select { min-width: 104px; background: var(--ks-bg-soft); border: 1px solid var(--ks-border); border-radius: 8px; padding: 7px 28px 7px 10px; color: var(--ks-fg); font: 11px var(--ks-font-mono); text-transform: uppercase; }
.ks-screen--roles .grantbadge { min-width: 58px; border: 1px solid var(--ks-border); border-radius: 999px; padding: 4px 8px; text-align: center; color: var(--ks-fg-dim); background: var(--ks-bg-soft); font: 9px var(--ks-font-mono); letter-spacing: .05em; text-transform: uppercase; }
.ks-screen--roles .grantbadge.read { color: var(--ks-cyan); background: color-mix(in srgb, var(--ks-cyan) 10%, transparent); border-color: color-mix(in srgb, var(--ks-cyan) 25%, transparent); }
.ks-screen--roles .grantbadge.edit { color: var(--ks-indigo-light); background: var(--ks-indigo-bg); border-color: var(--ks-border-emphasis); }
.ks-screen--roles .grantbadge.admin { color: var(--ks-green); background: color-mix(in srgb, var(--ks-green) 10%, transparent); border-color: color-mix(in srgb, var(--ks-green) 25%, transparent); }
.ks-screen--roles .btn.danger { color: var(--ks-red); }
.ks-screen--roles .btn.danger:hover:not(:disabled) { border-color: color-mix(in srgb, var(--ks-red) 32%, transparent); }
.ks-screen--roles .tog { width: 38px; height: 22px; border-radius: 999px; background: var(--ks-bg-elevated); border: 1px solid var(--ks-border); position: relative; cursor: pointer; flex: none; padding: 0; transition: background .15s, border-color .15s; }
.ks-screen--roles .tog::after { content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: var(--ks-fg-dim); transition: transform .15s, background .15s; }
.ks-screen--roles .tog.on { background: var(--ks-indigo); border-color: var(--ks-indigo); }
.ks-screen--roles .tog.on::after { transform: translateX(16px); background: #fff; }
.ks-screen--roles .tog.locked { cursor: default; opacity: .65; }
.ks-screen--roles .editbar { display: flex; align-items: center; gap: 10px; padding: 15px 22px; border-top: 1px solid var(--ks-border); background: var(--ks-bg-soft); }
.ks-screen--roles .editbar .dirty { font-size: 12px; color: var(--ks-amber); display: inline-flex; align-items: center; gap: 5px; }

/* members holding the role */
.ks-screen--roles .rmembers { padding: 4px 22px 20px; }
.ks-screen--roles .rmembers .ml { font-family: var(--ks-font-mono); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--ks-fg-dim); margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }
.ks-screen--roles .rmgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
@media (max-width: 720px) { .ks-screen--roles .rmgrid { grid-template-columns: 1fr; } }
.ks-screen--roles .rmchip { display: flex; align-items: center; gap: 10px; padding: 9px 11px; border: 1px solid var(--ks-border); border-radius: 10px; background: var(--ks-bg-soft); }
.ks-screen--roles .rmchip .av { width: 28px; height: 28px; font-size: 11px; }
.ks-screen--roles .rmchip .rmn { font-size: 13px; color: var(--ks-fg); font-weight: 500; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ks-screen--roles .rmchip .rme { font-size: 11px; color: var(--ks-fg-dim); margin-left: auto; flex: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 45%; }

/* ====================== Requirement detail (#5921) ====================== */
.ks-screen--requirement-detail { max-width: 1180px; }
.ks-screen--requirement-detail .page-head { margin: 20px 0 28px; padding-bottom: 24px; border-bottom: 1px solid var(--ks-border); }
.ks-screen--requirement-detail .page-head h1 { max-width: 850px; margin: 13px 0 10px; font-family: var(--ks-font-display); font-size: clamp(28px, 4vw, 42px); line-height: 1.08; letter-spacing: -.025em; color: var(--ks-fg); }
.ks-screen--requirement-detail .meta-row { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.ks-screen--requirement-detail .requirement-type, .ks-screen--requirement-detail .changed-tag, .ks-screen--requirement-detail .pill { display: inline-flex; align-items: center; gap: 6px; min-height: 26px; border-radius: 999px; padding: 4px 9px; font-family: var(--ks-font-mono); font-size: 10.5px; line-height: 1.2; }
.ks-screen--requirement-detail .requirement-type { border: 1px solid var(--ks-border-emphasis); background: var(--ks-indigo-bg); color: var(--ks-indigo-light); text-transform: uppercase; letter-spacing: .04em; }
.ks-screen--requirement-detail .requirement-type.prohibition { border-color: color-mix(in srgb, var(--ks-red) 35%, transparent); background: color-mix(in srgb, var(--ks-red) 10%, transparent); color: var(--ks-red); }
.ks-screen--requirement-detail .requirement-type.oversight { border-color: color-mix(in srgb, var(--ks-purple-light) 35%, transparent); background: var(--ks-purple-bg); color: var(--ks-purple-light); }
.ks-screen--requirement-detail .pill { border: 1px solid var(--ks-border); background: var(--ks-bg-elevated); color: var(--ks-fg-secondary); }
.ks-screen--requirement-detail .changed-tag { border: 1px solid color-mix(in srgb, var(--ks-amber) 35%, transparent); background: color-mix(in srgb, var(--ks-amber) 10%, transparent); color: var(--ks-amber); }
.ks-screen--requirement-detail .source-line { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; color: var(--ks-fg-muted); font-size: 13px; }
.ks-screen--requirement-detail .source-line svg { color: var(--ks-indigo-muted); }
.ks-screen--requirement-detail .detail-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 30px; align-items: start; }
.ks-screen--requirement-detail .detail-main { min-width: 0; }
.ks-screen--requirement-detail .section { margin-bottom: 30px; }
.ks-screen--requirement-detail .section h2 { display: flex; align-items: center; gap: 9px; margin: 0 0 13px; font-family: var(--ks-font-display); font-size: 17px; color: var(--ks-fg); }
.ks-screen--requirement-detail .section h2 svg { color: var(--ks-indigo-muted); }
.ks-screen--requirement-detail .detail-two-up { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ks-screen--requirement-detail .detail-card, .ks-screen--requirement-detail .requirement-legal-pane, .ks-screen--requirement-detail .definition-list, .ks-screen--requirement-detail .detail-facts { border: 1px solid var(--ks-border); border-radius: 14px; background: var(--ks-bg-card); box-shadow: var(--ks-shadow-soft); }
.ks-screen--requirement-detail .detail-card { padding: 16px 17px; }
.ks-screen--requirement-detail .card-label { display: flex; align-items: center; gap: 7px; color: var(--ks-fg); font-size: 12px; font-weight: 600; }
.ks-screen--requirement-detail .card-label svg { color: var(--ks-indigo-muted); }
.ks-screen--requirement-detail .detail-card p, .ks-screen--requirement-detail .detail-card ul { margin: 10px 0 0; color: var(--ks-fg-muted); font-size: 13px; line-height: 1.6; }
.ks-screen--requirement-detail .detail-card ul { padding: 0; list-style: none; }
.ks-screen--requirement-detail .detail-card li { display: flex; gap: 6px; }
.ks-screen--requirement-detail .detail-card li svg { margin-top: 4px; color: var(--ks-fg-dim); flex: none; }
.ks-screen--requirement-detail .requirement-legal-pane { overflow: hidden; }
.ks-screen--requirement-detail .legal-quote { display: grid; grid-template-columns: 24px 1fr; gap: 8px; padding: 16px 18px; border-bottom: 1px solid var(--ks-border); }
.ks-screen--requirement-detail .legal-quote > span { font-family: var(--ks-font-mono); font-size: 11px; color: var(--ks-fg-dim); }
.ks-screen--requirement-detail .legal-quote strong { color: var(--ks-fg); font-size: 13px; }
.ks-screen--requirement-detail .legal-quote p { margin: 7px 0 0; color: var(--ks-fg-muted); font-family: var(--ks-font-serif); font-size: 14px; line-height: 1.65; }
.ks-screen--requirement-detail .read-link { display: flex; align-items: center; gap: 7px; padding: 12px 18px; color: var(--ks-indigo-light); font-size: 12.5px; font-weight: 600; }
.ks-screen--requirement-detail .definition-list { overflow: hidden; }
.ks-screen--requirement-detail .definition-list article { display: grid; grid-template-columns: minmax(160px, .4fr) 1fr; gap: 18px; padding: 15px 18px; border-top: 1px solid var(--ks-border); }
.ks-screen--requirement-detail .definition-list article:first-child { border-top: 0; }
.ks-screen--requirement-detail .definition-list article div { display: flex; flex-direction: column; gap: 5px; }
.ks-screen--requirement-detail .definition-list article strong { font-size: 13px; color: var(--ks-fg); }
.ks-screen--requirement-detail .definition-list article span { color: var(--ks-fg-dim); font-size: 10.5px; }
.ks-screen--requirement-detail .definition-list article p { margin: 0; color: var(--ks-fg-muted); font-size: 13px; line-height: 1.55; }
.ks-screen--requirement-detail .evolution { position: relative; padding-left: 23px; }
.ks-screen--requirement-detail .evolution::before { content: ""; position: absolute; inset: 12px auto 12px 7px; width: 1px; background: var(--ks-border-strong); }
.ks-screen--requirement-detail .evolution-item { position: relative; margin-bottom: 11px; }
.ks-screen--requirement-detail .evolution-item::before { content: ""; position: absolute; left: -20px; top: 19px; width: 9px; height: 9px; border-radius: 50%; border: 2px solid var(--ks-bg); background: var(--ks-fg-dim); box-shadow: 0 0 0 1px var(--ks-border-strong); }
.ks-screen--requirement-detail .evolution-item.current::before { background: var(--ks-indigo); }
.ks-screen--requirement-detail .evolution-card { padding: 15px 17px; border: 1px solid var(--ks-border); border-radius: 12px; background: var(--ks-bg-card); }
.ks-screen--requirement-detail .evolution-card > div { display: flex; align-items: center; gap: 9px; }
.ks-screen--requirement-detail .evolution-card strong { color: var(--ks-fg); font-size: 13px; }
.ks-screen--requirement-detail .change-badge { border-radius: 999px; padding: 3px 7px; background: var(--ks-bg-elevated); color: var(--ks-fg-dim); font-family: var(--ks-font-mono); font-size: 9.5px; text-transform: uppercase; }
.ks-screen--requirement-detail .change-badge.modified { background: color-mix(in srgb, var(--ks-amber) 10%, transparent); color: var(--ks-amber); }
.ks-screen--requirement-detail .evolution-card p { margin: 8px 0; color: var(--ks-fg-muted); font-size: 13px; line-height: 1.55; }
.ks-screen--requirement-detail .evolution-card a { color: var(--ks-indigo-light); font-size: 12px; }
.ks-screen--requirement-detail .rail { position: sticky; top: 20px; }
.ks-screen--requirement-detail .detail-facts { overflow: hidden; }
.ks-screen--requirement-detail .facts-title { padding: 14px 16px; border-bottom: 1px solid var(--ks-border); font-family: var(--ks-font-display); font-size: 14px; font-weight: 600; color: var(--ks-fg); }
.ks-screen--requirement-detail .detail-facts > div:not(.facts-title) { display: flex; flex-direction: column; gap: 4px; padding: 11px 16px; border-top: 1px solid var(--ks-border); }
.ks-screen--requirement-detail .detail-facts > div:nth-child(2) { border-top: 0; }
.ks-screen--requirement-detail .detail-facts span { color: var(--ks-fg-dim); font-family: var(--ks-font-mono); font-size: 9.5px; text-transform: uppercase; letter-spacing: .04em; }
.ks-screen--requirement-detail .detail-facts strong, .ks-screen--requirement-detail .detail-facts a { color: var(--ks-fg-secondary); font-size: 12.5px; font-weight: 500; line-height: 1.4; }
.ks-screen--requirement-detail .detail-facts a { color: var(--ks-indigo-light); }
@media (max-width: 860px) { .ks-screen--requirement-detail .detail-layout { grid-template-columns: 1fr; } .ks-screen--requirement-detail .rail { position: static; } }
@media (max-width: 620px) { .ks-screen--requirement-detail .detail-two-up, .ks-screen--requirement-detail .definition-list article { grid-template-columns: 1fr; } }

/* ===================== Requirements list (#5920) ===================== */
.ks-screen--requirements-list { max-width: 1120px; }
.ks-screen--requirements-list .requirement-filter-chip { position: relative; }
.ks-screen--requirements-list .requirement-filter-chip summary { list-style: none; }
.ks-screen--requirements-list .requirement-filter-chip summary::-webkit-details-marker { display: none; }
.ks-screen--requirements-list .filter-menu { position: absolute; z-index: 20; top: calc(100% + 7px); left: 0; min-width: 210px; max-height: 280px; overflow: auto; padding: 6px; border: 1px solid var(--ks-border-strong); border-radius: 12px; background: var(--ks-bg-card); box-shadow: var(--ks-shadow-card); }
.ks-screen--requirements-list .filter-menu button { width: 100%; border: 0; border-radius: 8px; padding: 8px 10px; background: transparent; color: var(--ks-fg-secondary); font: inherit; font-size: 12.5px; text-align: left; cursor: pointer; }
.ks-screen--requirements-list .filter-menu button:hover, .ks-screen--requirements-list .filter-menu button.selected { color: var(--ks-fg); background: var(--ks-indigo-bg); }
.ks-screen--requirements-list .requirement-list { display: flex; flex-direction: column; gap: 11px; }
.ks-screen--requirements-list .requirement-card { display: block; padding: 15px 18px; border: 1px solid var(--ks-border); border-radius: 14px; background: var(--ks-bg-card); box-shadow: var(--ks-shadow-soft); color: inherit; text-decoration: none; transition: border-color .15s, transform .15s; }
.ks-screen--requirements-list .requirement-card:hover { border-color: var(--ks-border-strong); transform: translateY(-1px); }
.ks-screen--requirements-list .requirement-top { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ks-screen--requirements-list .requirement-type { flex: none; padding: 3px 8px; border-radius: 6px; font-family: var(--ks-font-mono); font-size: 9.5px; letter-spacing: .04em; text-transform: uppercase; }
.ks-screen--requirements-list .requirement-type.standard { color: var(--ks-indigo-muted); background: var(--ks-indigo-bg); }
.ks-screen--requirements-list .requirement-type.oversight { color: var(--ks-purple-light); background: var(--ks-purple-bg); }
.ks-screen--requirements-list .requirement-type.prohibition { color: var(--ks-red); background: color-mix(in srgb, var(--ks-red) 12%, transparent); }
.ks-screen--requirements-list .requirement-top h2 { font-size: 15px; font-weight: 600; letter-spacing: -.01em; }
.ks-screen--requirements-list .source-pill { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; padding: 3px 9px; border: 1px solid var(--ks-border); border-radius: 7px; background: var(--ks-bg-elevated); color: var(--ks-fg-secondary); font-family: var(--ks-font-mono); font-size: 11px; white-space: nowrap; }
.ks-screen--requirements-list .source-pill i { color: var(--ks-fg-dim); font-style: normal; }
.ks-screen--requirements-list .requirement-card > p { max-width: 84ch; margin-top: 8px; color: var(--ks-fg-secondary); font-size: 13.5px; line-height: 1.5; }
.ks-screen--requirements-list .requirement-meta { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-top: 11px; padding-top: 11px; border-top: 1px solid var(--ks-border); color: var(--ks-fg-muted); font-size: 12px; }
.ks-screen--requirements-list .requirement-meta > span { display: inline-flex; align-items: center; gap: 6px; }
.ks-screen--requirements-list .requirement-meta b { color: var(--ks-indigo-muted); font-weight: 400; }
.ks-screen--requirements-list .requirement-meta .open { margin-left: auto; color: var(--ks-indigo-light); }
.ks-screen--requirements-list .requirements-pagination { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-top: 18px; }
.ks-screen--requirements-list .requirements-pagination > label { display: flex; flex-direction: column; gap: 5px; color: var(--ks-fg-dim); font-size: 11px; }
.ks-screen--requirements-list .requirements-pagination select { padding: 7px 10px; border: 1px solid var(--ks-border); border-radius: 9px; background: var(--ks-bg-card); color: var(--ks-fg); }
.ks-screen--requirements-list .pagination { display: flex; align-items: center; gap: 12px; color: var(--ks-fg-muted); font-size: 12.5px; }
@media (max-width: 720px) {
  .ks-screen--requirements-list .page-head .search { min-width: 100%; }
  .ks-screen--requirements-list .source-pill { margin-left: 0; }
  .ks-screen--requirements-list .requirements-pagination { align-items: stretch; flex-direction: column; }
}

/* ============================================================================
 * Shared response-layer primitives — coverage, status, scope (#5925-#5927).
 * Ported from the design `response.css`; scoped under .ks-screen. Reused by the
 * policy + catalog + coverage screens.
 * ==========================================================================*/
.ks-screen .status { font-size: 12px; display: inline-flex; align-items: center; gap: 7px; color: var(--ks-fg-secondary); white-space: nowrap; }
.ks-screen .status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; flex: none; }
.ks-screen .status.active { color: var(--ks-green); }
.ks-screen .status.draft { color: var(--ks-fg-muted); }
.ks-screen .status.retired { color: var(--ks-fg-dim); }

.ks-screen .scope-chip { font-size: 11px; padding: 3px 9px; border-radius: 999px; border: 1px solid var(--ks-border); background: var(--ks-bg-elevated); color: var(--ks-fg-muted); display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.ks-screen .scope-chip svg { width: 11px; height: 11px; color: var(--ks-fg-dim); }
.ks-screen .scope-chip.global { color: var(--ks-indigo-muted); background: var(--ks-indigo-bg); border-color: color-mix(in srgb, var(--ks-indigo-light) 24%, transparent); }
.ks-screen .scope-chip.global svg { color: var(--ks-indigo-muted); }

.ks-screen .cov { font-family: var(--ks-font-mono); font-size: 10px; letter-spacing: .04em; text-transform: uppercase; padding: 3px 9px 3px 8px; border-radius: 999px; display: inline-flex; align-items: center; gap: 6px; border: 1px solid transparent; white-space: nowrap; line-height: 1.4; }
.ks-screen .cov::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; flex: none; }
.ks-screen .cov.draft { color: var(--ks-fg-muted); background: var(--ks-bg-elevated); border-color: var(--ks-border-strong); }
.ks-screen .cov.full { color: var(--ks-green); background: color-mix(in srgb, var(--ks-green) 14%, transparent); border-color: color-mix(in srgb, var(--ks-green) 30%, transparent); }
.ks-screen .cov.partial { color: var(--ks-amber); background: color-mix(in srgb, var(--ks-amber) 14%, transparent); border-color: color-mix(in srgb, var(--ks-amber) 30%, transparent); }
.ks-screen .cov.gap { color: var(--ks-red); background: color-mix(in srgb, var(--ks-red) 14%, transparent); border-color: color-mix(in srgb, var(--ks-red) 30%, transparent); }
.ks-screen .cov.exception { color: var(--ks-purple-light); background: var(--ks-purple-bg); border-color: color-mix(in srgb, var(--ks-purple-light) 34%, transparent); }

.ks-screen .covbar { display: flex; height: 8px; border-radius: 999px; overflow: hidden; background: var(--ks-bg-elevated); border: 1px solid var(--ks-border); }
.ks-screen .covbar > span { display: block; height: 100%; }
.ks-screen .covbar .s-full { background: var(--ks-green); }
.ks-screen .covbar .s-partial { background: var(--ks-amber); }
.ks-screen .covbar .s-gap { background: var(--ks-red); }
.ks-screen .covbar .s-exception { background: var(--ks-purple); }

/* Chip-style filter dropdown */
.ks-screen .filter { display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; color: var(--ks-fg-muted); border: 1px solid var(--ks-border); background: var(--ks-bg-card); border-radius: 999px; padding: 5px 11px 5px 13px; }
.ks-screen .filter svg { width: 13px; height: 13px; color: var(--ks-fg-dim); }
.ks-screen .filter select { border: 0; background: transparent; color: var(--ks-fg); font: inherit; font-size: 12.5px; outline: none; cursor: pointer; }
.ks-screen .filter .lab { color: var(--ks-fg-dim); }

/* Simple pager */
.ks-screen .pager { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 22px; font-size: 12.5px; color: var(--ks-fg-muted); }

/* ============================ Policy library (#5925) ===================== */
.ks-screen--policy-library { max-width: 1140px; }
.ks-screen--policy-library .list { display: flex; flex-direction: column; gap: 11px; }
.ks-screen--policy-library .prow { display: grid; grid-template-columns: 1fr 296px; gap: 28px; align-items: center; background: var(--ks-bg-card); border: 1px solid var(--ks-border); border-radius: 14px; padding: 16px 20px; box-shadow: var(--ks-shadow-soft); transition: border-color .15s, transform .15s; }
.ks-screen--policy-library .prow:hover { border-color: var(--ks-border-strong); transform: translateY(-1px); }
.ks-screen--policy-library .prow.retired { opacity: .62; }
@media (max-width: 820px) { .ks-screen--policy-library .prow { grid-template-columns: 1fr; gap: 16px; } }
.ks-screen--policy-library .head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.ks-screen--policy-library .ic { width: 34px; height: 34px; border-radius: 9px; background: var(--ks-indigo-bg); color: var(--ks-indigo-muted); display: grid; place-items: center; flex: none; }
.ks-screen--policy-library .prow.retired .ic { background: var(--ks-bg-elevated); color: var(--ks-fg-dim); }
.ks-screen--policy-library .title { font-size: 15.5px; font-weight: 600; font-family: var(--ks-font-display); color: var(--ks-fg); letter-spacing: -0.01em; }
.ks-screen--policy-library .scopes { margin-top: 11px; display: flex; flex-wrap: wrap; gap: 7px; }
.ks-screen--policy-library .desc { margin-top: 10px; font-size: 13px; color: var(--ks-fg-muted); line-height: 1.5; max-width: 72ch; }
.ks-screen--policy-library .metaline { margin-top: 12px; display: flex; align-items: center; gap: 18px; flex-wrap: wrap; font-size: 12px; color: var(--ks-fg-muted); }
.ks-screen--policy-library .metaline .m { display: inline-flex; align-items: center; gap: 6px; }
.ks-screen--policy-library .metaline .m svg { width: 13px; height: 13px; color: var(--ks-fg-dim); }
.ks-screen--policy-library .metaline .m .nm { color: var(--ks-fg-secondary); }
.ks-screen--policy-library .cov-col { display: flex; flex-direction: column; gap: 9px; }
.ks-screen--policy-library .crow { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.ks-screen--policy-library .pctnum { font-family: var(--ks-font-mono); font-size: 20px; color: var(--ks-fg); font-weight: 500; letter-spacing: -0.01em; }
.ks-screen--policy-library .pctnum.dim { color: var(--ks-fg-dim); }
.ks-screen--policy-library .pctnum .of { font-size: 11px; color: var(--ks-fg-dim); }
.ks-screen--policy-library .legend { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 10.5px; color: var(--ks-fg-dim); font-family: var(--ks-font-mono); }
.ks-screen--policy-library .legend .lg::before { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; margin-right: 5px; vertical-align: middle; }
.ks-screen--policy-library .legend .lg.full::before { background: var(--ks-green); }
.ks-screen--policy-library .legend .lg.partial::before { background: var(--ks-amber); }
.ks-screen--policy-library .legend .lg.gap::before { background: var(--ks-red); }
.ks-screen--policy-library .legend .lg.exc::before { background: var(--ks-purple); }
.ks-screen--policy-library .draftnote { font-size: 12px; color: var(--ks-fg-dim); display: inline-flex; align-items: center; gap: 7px; }
.ks-screen--policy-library .draftnote svg { width: 13px; height: 13px; }

/* =========================== Coverage (#5930) =========================== */
.ks-screen--coverage { max-width: 1120px; }
.ks-screen--coverage .page-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.ks-screen--coverage .page-head .sub { max-width: 760px; margin-top: 6px; color: var(--ks-fg-muted); font-size: 13.5px; line-height: 1.55; }
.ks-screen--coverage .notice { margin: 14px 0; color: var(--ks-indigo-light); font-size: 13px; }
.ks-screen--coverage .coverage-hero { margin-top: 22px; padding: 24px 26px; border: 1px solid var(--ks-border); border-radius: 18px; background: var(--ks-bg-card); box-shadow: var(--ks-shadow-card); }
.ks-screen--coverage .coverage-top { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }
.ks-screen--coverage .coverage-top > div:first-child { display: flex; align-items: center; gap: 11px; }
.ks-screen--coverage .hero-icon { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px; color: var(--ks-fg-on-accent); background: var(--ks-indigo); }
.ks-screen--coverage .coverage-top strong { color: var(--ks-fg); font-family: var(--ks-font-display); font-size: 18px; }
.ks-screen--coverage .hero-meta { color: var(--ks-fg-muted); font-size: 13px; }
.ks-screen--coverage .coverage-score { text-align: right; }
.ks-screen--coverage .coverage-score strong { display: block; font-family: var(--ks-font-mono); font-size: 40px; font-weight: 500; line-height: 1; }
.ks-screen--coverage .coverage-score small { font-size: 14px; color: var(--ks-fg-muted); }
.ks-screen--coverage .coverage-score span { color: var(--ks-fg-dim); font-size: 11px; }
.ks-screen--coverage .coverage-bar { display: flex; height: 16px; margin-top: 20px; overflow: hidden; border-radius: 999px; background: var(--ks-bg-elevated); }
.ks-screen--coverage .coverage-bar .full, .ks-screen--coverage .coverage-counts i.full { background: var(--ks-green); }
.ks-screen--coverage .coverage-bar .partial, .ks-screen--coverage .coverage-counts i.partial { background: var(--ks-amber); }
.ks-screen--coverage .coverage-bar .gap, .ks-screen--coverage .coverage-counts i.gap { background: var(--ks-red); }
.ks-screen--coverage .coverage-counts { display: flex; flex-wrap: wrap; gap: 10px 26px; margin-top: 16px; }
.ks-screen--coverage .coverage-counts span { display: inline-flex; align-items: center; gap: 8px; color: var(--ks-fg-secondary); font-size: 13px; }
.ks-screen--coverage .coverage-counts i { width: 10px; height: 10px; border-radius: 50%; }
.ks-screen--coverage .coverage-counts b { color: var(--ks-fg); font-family: var(--ks-font-mono); font-weight: 500; }
.ks-screen--coverage .coverage-toolbar { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin: 26px 0 13px; }
.ks-screen--coverage .coverage-toolbar h2 { color: var(--ks-fg); font-size: 17px; }
.ks-screen--coverage .coverage-toolbar p { margin-top: 3px; color: var(--ks-fg-dim); font-size: 12px; }
.ks-screen--coverage .search { min-width: 240px; }
.ks-screen--coverage .pagination-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
.ks-screen--coverage .rows-select { display: flex; flex-direction: column; gap: 4px; color: var(--ks-fg-dim); font-size: 11px; }
.ks-screen--coverage .rows-select select { padding: 7px 10px; border: 1px solid var(--ks-border); border-radius: 8px; color: var(--ks-fg); background: var(--ks-bg-card); }
.ks-screen--coverage .pagination { display: flex; align-items: center; gap: 10px; color: var(--ks-fg-muted); font-size: 12px; }
.ks-screen--coverage .gap-list { overflow: hidden; border: 1px solid var(--ks-border); border-radius: 16px; background: var(--ks-bg-card); box-shadow: var(--ks-shadow-card); }
.ks-screen--coverage .gap-card { display: flex; align-items: center; gap: 13px; padding: 15px 18px; border-top: 1px solid var(--ks-border); }
.ks-screen--coverage .gap-card:first-child { border-top: 0; }
.ks-screen--coverage .gap-card:hover { background: var(--ks-bg-hover); }
.ks-screen--coverage .gap-icon { width: 30px; height: 30px; display: grid; place-items: center; flex: none; border-radius: 8px; color: var(--ks-indigo-muted); background: var(--ks-indigo-bg); }
.ks-screen--coverage .gap-body { min-width: 0; flex: 1; }
.ks-screen--coverage .gap-head { display: flex; align-items: center; gap: 9px; }
.ks-screen--coverage .gap-head strong { color: var(--ks-fg); font-size: 13.5px; }
.ks-screen--coverage .gap-body p { margin-top: 5px; color: var(--ks-fg-muted); font-size: 12px; }
.ks-screen--coverage .status-gap { padding: 3px 8px; border-radius: 999px; color: var(--ks-red); background: color-mix(in srgb, var(--ks-red) 12%, transparent); font-family: var(--ks-font-mono); font-size: 9.5px; text-transform: uppercase; }
.ks-screen--coverage .assign { display: inline-flex; align-items: center; gap: 5px; flex: none; color: var(--ks-indigo-light); font-size: 12px; }
@media (max-width: 700px) { .ks-screen--coverage .page-head, .ks-screen--coverage .coverage-toolbar, .ks-screen--coverage .pagination-row { align-items: stretch; flex-direction: column; } .ks-screen--coverage .coverage-top { align-items: flex-start; } .ks-screen--coverage .gap-card { align-items: flex-start; flex-wrap: wrap; } .ks-screen--coverage .assign { margin-left: 43px; } }
/* Compact coverage pill (inline in chips) */
.ks-screen .cov.xs { font-size: 9px; padding: 2px 7px 2px 6px; gap: 5px; }
.ks-screen .cov.xs::before { width: 5px; height: 5px; }

/* ============================ Policy detail (#5926) ====================== */
.ks-screen--policy-detail { max-width: 1080px; }
.ks-screen--policy-detail .phead { display: flex; align-items: flex-start; gap: 18px; }
.ks-screen--policy-detail .phead .ic { width: 42px; height: 42px; border-radius: 11px; background: var(--ks-indigo-bg); color: var(--ks-indigo-muted); display: grid; place-items: center; flex: none; }
.ks-screen--policy-detail .phead h1 { font-size: 24px; font-weight: 600; letter-spacing: -0.02em; line-height: 1.25; }
.ks-screen--policy-detail .phead .head-act { margin-left: auto; flex: none; }
.ks-screen--policy-detail .meta-row { margin-top: 11px; display: flex; align-items: center; gap: 8px 14px; flex-wrap: wrap; font-size: 12.5px; color: var(--ks-fg-muted); }
.ks-screen--policy-detail .meta-row .m { display: inline-flex; align-items: center; gap: 6px; }
.ks-screen--policy-detail .meta-row .m svg { width: 13px; height: 13px; color: var(--ks-fg-dim); }
.ks-screen--policy-detail .meta-row .m .nm { color: var(--ks-fg-secondary); }
.ks-screen--policy-detail .scopes { margin-top: 11px; display: flex; flex-wrap: wrap; gap: 7px; }

.ks-screen--policy-detail .cband { margin: 22px 0 6px; background: var(--ks-bg-card); border: 1px solid var(--ks-border); border-radius: 16px; box-shadow: var(--ks-shadow-card); padding: 18px 22px; display: grid; grid-template-columns: auto 1fr; gap: 26px; align-items: center; }
@media (max-width: 640px) { .ks-screen--policy-detail .cband { grid-template-columns: 1fr; gap: 14px; } }
.ks-screen--policy-detail .cband .big { display: flex; align-items: baseline; gap: 8px; }
.ks-screen--policy-detail .cband .big .n { font-family: var(--ks-font-mono); font-size: 36px; font-weight: 500; color: var(--ks-fg); letter-spacing: -0.02em; }
.ks-screen--policy-detail .cband .barwrap .covbar { height: 12px; }
.ks-screen--policy-detail .cband .barwrap .legend { margin-top: 11px; display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 12px; color: var(--ks-fg-secondary); }
.ks-screen--policy-detail .cband .legend .lg { display: inline-flex; align-items: center; gap: 8px; }
.ks-screen--policy-detail .cband .legend .lg::before { content: ""; width: 9px; height: 9px; border-radius: 50%; }
.ks-screen--policy-detail .cband .legend .lg.full::before { background: var(--ks-green); }
.ks-screen--policy-detail .cband .legend .lg.partial::before { background: var(--ks-amber); }
.ks-screen--policy-detail .cband .legend .lg.gap::before { background: var(--ks-red); }
.ks-screen--policy-detail .cband .legend .lg.exc::before { background: var(--ks-purple); }
.ks-screen--policy-detail .cband .legend .lg.dim { color: var(--ks-fg-dim); }
.ks-screen--policy-detail .cband .legend .lg.dim::before { display: none; }
.ks-screen--policy-detail .cband .legend .c { font-family: var(--ks-font-mono); color: var(--ks-fg); }

.ks-screen--policy-detail .barhead { display: flex; align-items: center; justify-content: space-between; margin: 30px 0 14px; }
.ks-screen--policy-detail .barhead h2 { font-size: 13px; font-family: var(--ks-font-mono); letter-spacing: .06em; text-transform: uppercase; color: var(--ks-fg-dim); font-weight: 500; }
.ks-screen--policy-detail .barhead .hint { font-size: 12px; color: var(--ks-fg-dim); display: inline-flex; align-items: center; gap: 7px; }
.ks-screen--policy-detail .barhead .hint svg { width: 13px; height: 13px; }

.ks-screen--policy-detail .stmts { display: flex; flex-direction: column; gap: 11px; }
.ks-screen--policy-detail .stmt { background: var(--ks-bg-card); border: 1px solid var(--ks-border); border-radius: 14px; padding: 16px 18px; box-shadow: var(--ks-shadow-soft); transition: border-color .15s; cursor: pointer; display: block; color: inherit; }
.ks-screen--policy-detail .stmt:hover { border-color: var(--ks-border-strong); }
.ks-screen--policy-detail .stmt.is-gap { border-left: 3px solid color-mix(in srgb, var(--ks-red) 65%, transparent); }
.ks-screen--policy-detail .stmt.is-exc { border-left: 3px solid color-mix(in srgb, var(--ks-purple-light) 70%, transparent); }
.ks-screen--policy-detail .stmt .sh { display: flex; align-items: flex-start; gap: 14px; }
.ks-screen--policy-detail .stmt .sid { font-family: var(--ks-font-mono); font-size: 11px; color: var(--ks-fg-dim); padding-top: 2px; flex: none; }
.ks-screen--policy-detail .stmt .stext { font-size: 14.5px; font-weight: 500; color: var(--ks-fg); line-height: 1.5; flex: 1; }
.ks-screen--policy-detail .stmt .sh .cov { flex: none; margin-top: 1px; }
.ks-screen--policy-detail .maps { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--ks-border); display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
@media (max-width: 760px) { .ks-screen--policy-detail .maps { grid-template-columns: 1fr; } }
.ks-screen--policy-detail .map .ml { font-family: var(--ks-font-mono); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--ks-fg-dim); }
.ks-screen--policy-detail .map .chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 9px; }
.ks-screen--policy-detail .refchip { font-size: 12.5px; display: inline-flex; align-items: center; gap: 8px; padding: 6px 11px; border-radius: 999px; border: 1px solid var(--ks-border); background: var(--ks-bg-elevated); color: var(--ks-fg-secondary); transition: border-color .15s; }
.ks-screen--policy-detail .refchip:hover { border-color: var(--ks-border-strong); }
.ks-screen--policy-detail .refchip svg { width: 13px; height: 13px; color: var(--ks-fg-dim); }
.ks-screen--policy-detail .refchip.req svg { color: var(--ks-indigo-muted); }
.ks-screen--policy-detail .refchip .sdot { width: 7px; height: 7px; border-radius: 50%; background: var(--ks-green); flex: none; }
.ks-screen--policy-detail .refchip .sdot.down { background: var(--ks-red); }
.ks-screen--policy-detail .refchip.empty { color: var(--ks-red); border-color: color-mix(in srgb, var(--ks-red) 32%, transparent); background: color-mix(in srgb, var(--ks-red) 9%, transparent); }
.ks-screen--policy-detail .refchip.empty svg { color: var(--ks-red); }
.ks-screen--policy-detail .refchip.add { color: var(--ks-indigo-light); border-style: dashed; background: transparent; }
.ks-screen--policy-detail .refchip.add svg { color: var(--ks-indigo-light); }
.ks-screen--policy-detail .refchip.exc { color: var(--ks-purple-light); border-color: color-mix(in srgb, var(--ks-purple-light) 32%, transparent); background: var(--ks-purple-bg); }
.ks-screen--policy-detail .refchip.exc svg { color: var(--ks-purple-light); }

/* Shared detail-rail facts (ported from response.css) */
.ks-screen .facts { background: var(--ks-bg-card); border: 1px solid var(--ks-border); border-radius: 16px; box-shadow: var(--ks-shadow-card); overflow: hidden; }
.ks-screen .facts .ftitle { font-family: var(--ks-font-mono); font-size: 10.5px; letter-spacing: .07em; text-transform: uppercase; color: var(--ks-fg-dim); padding: 15px 18px 4px; }
.ks-screen .facts .fact { padding: 11px 18px; border-top: 1px solid var(--ks-border); }
.ks-screen .facts .fact:first-of-type { border-top: 0; }
.ks-screen .facts .fact .k { font-size: 11.5px; color: var(--ks-fg-dim); margin-bottom: 4px; }
.ks-screen .facts .fact .v { font-size: 13.5px; color: var(--ks-fg); font-weight: 500; line-height: 1.45; }
.ks-screen .facts .fact .v.mono { font-family: var(--ks-font-mono); font-size: 12.5px; font-weight: 400; color: var(--ks-fg-secondary); }
.ks-screen .facts .fact .v.link a { color: var(--ks-indigo-light); display: inline-flex; align-items: center; gap: 6px; }
.ks-screen .facts .fact .v.link svg { width: 13px; height: 13px; }

/* =========================== Policy statement (#5927) ==================== */
.ks-screen--policy-statement { max-width: 1060px; }
.ks-screen--policy-statement .phead .meta-row { display: flex; align-items: center; gap: 8px 12px; flex-wrap: wrap; margin-bottom: 13px; }
.ks-screen--policy-statement .sid-tag { font-family: var(--ks-font-mono); font-size: 11px; color: var(--ks-indigo-muted); background: var(--ks-indigo-bg); border: 1px solid color-mix(in srgb, var(--ks-indigo-light) 26%, transparent); padding: 3px 9px; border-radius: 7px; }
.ks-screen--policy-statement .parent { font-size: 12.5px; color: var(--ks-fg-muted); display: inline-flex; align-items: center; gap: 7px; }
.ks-screen--policy-statement .parent svg { width: 13px; height: 13px; color: var(--ks-fg-dim); }
.ks-screen--policy-statement .phead h1 { font-size: 23px; font-weight: 600; letter-spacing: -0.02em; line-height: 1.3; max-width: 40ch; }
.ks-screen--policy-statement .phead .scopes { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 7px; }

.ks-screen--policy-statement .layout { display: grid; grid-template-columns: 1fr 300px; gap: 28px; margin-top: 26px; align-items: start; }
@media (max-width: 900px) { .ks-screen--policy-statement .layout { grid-template-columns: 1fr; } }

.ks-screen--policy-statement .spine { display: flex; align-items: center; gap: 10px; font-size: 11.5px; color: var(--ks-fg-dim); font-family: var(--ks-font-mono); margin-bottom: 16px; flex-wrap: wrap; }
.ks-screen--policy-statement .spine .s { display: inline-flex; align-items: center; gap: 7px; }
.ks-screen--policy-statement .spine .s.here { color: var(--ks-fg); }
.ks-screen--policy-statement .spine .s svg { width: 13px; height: 13px; }
.ks-screen--policy-statement .spine i.sep { width: 14px; height: 1px; background: var(--ks-border-strong); }

.ks-screen--policy-statement .rule { background: var(--ks-bg-card); border: 1px solid var(--ks-border); border-radius: 16px; box-shadow: var(--ks-shadow-card); padding: 20px 22px; }
.ks-screen--policy-statement .rule .rl { font-family: var(--ks-font-mono); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--ks-fg-dim); margin-bottom: 11px; }
.ks-screen--policy-statement .rule .rtext { font-size: 18px; line-height: 1.5; color: var(--ks-fg); font-weight: 500; letter-spacing: -0.01em; }
.ks-screen--policy-statement .rule .rfoot { margin-top: 16px; padding-top: 15px; border-top: 1px solid var(--ks-border); display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.ks-screen--policy-statement .rule .why { font-size: 12.5px; color: var(--ks-fg-muted); display: inline-flex; align-items: center; gap: 8px; }
.ks-screen--policy-statement .rule .why svg { width: 14px; height: 14px; color: var(--ks-amber); }

.ks-screen--policy-statement .stack { display: flex; flex-direction: column; gap: 11px; }
.ks-screen--policy-statement .relcard { background: var(--ks-bg-card); border: 1px solid var(--ks-border); border-radius: 14px; box-shadow: var(--ks-shadow-soft); padding: 15px 17px; display: flex; align-items: center; gap: 14px; transition: border-color .15s, transform .15s; color: inherit; }
.ks-screen--policy-statement .relcard:hover { border-color: var(--ks-border-strong); transform: translateY(-1px); }
.ks-screen--policy-statement .relcard .ri { width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; flex: none; }
.ks-screen--policy-statement .relcard .ri.req { background: var(--ks-indigo-bg); color: var(--ks-indigo-muted); }
.ks-screen--policy-statement .relcard .ri.ctrl { background: color-mix(in srgb, var(--ks-green) 13%, transparent); color: var(--ks-green); }
.ks-screen--policy-statement .relcard .rt { min-width: 0; flex: 1; }
.ks-screen--policy-statement .relcard .rn { font-size: 14.5px; font-weight: 600; color: var(--ks-fg); font-family: var(--ks-font-display); letter-spacing: -0.01em; }
.ks-screen--policy-statement .relcard .rd { font-size: 12.5px; color: var(--ks-fg-muted); margin-top: 4px; display: flex; align-items: center; gap: 8px 13px; flex-wrap: wrap; }
.ks-screen--policy-statement .relcard .rd .m { display: inline-flex; align-items: center; gap: 6px; }
.ks-screen--policy-statement .relcard .rd .m svg { width: 12px; height: 12px; color: var(--ks-fg-dim); }
.ks-screen--policy-statement .relcard .rd .mono { font-family: var(--ks-font-mono); color: var(--ks-indigo-muted); }
.ks-screen--policy-statement .relcard .rr { display: flex; align-items: center; gap: 8px; flex: none; }
.ks-screen--policy-statement .relcard .rr svg { color: var(--ks-fg-dim); }
.ks-screen--policy-statement .relcard .exlink { font-size: 11.5px; color: var(--ks-indigo-light); }
.ks-screen--policy-statement .placeholder { border: 1px dashed var(--ks-border-strong); border-radius: 14px; padding: 18px 20px; display: flex; align-items: center; gap: 13px; color: var(--ks-fg-muted); background: var(--ks-tint-card); }
.ks-screen--policy-statement .placeholder svg { width: 18px; height: 18px; color: var(--ks-fg-dim); flex: none; }
.ks-screen--policy-statement .placeholder .pt { font-size: 13.5px; color: var(--ks-fg-secondary); font-weight: 500; }
.ks-screen--policy-statement .placeholder .pd { font-size: 12.5px; color: var(--ks-fg-dim); margin-top: 2px; }
.ks-screen--policy-statement .rail { position: sticky; top: 24px; }

.ks-screen--policy-statement .col-main > .section { margin-top: 28px; }

/* ======================= Control detail (#5929) ======================== */
.ks-screen--control-library .control-title-link { border: 0; padding: 0; background: transparent; color: var(--ks-fg); font: inherit; font-weight: 600; text-align: left; cursor: pointer; }
.ks-screen--control-library .control-title-link:hover { color: var(--ks-indigo-light); }
.ks-screen--control-detail { max-width: 1080px; }
.ks-screen--control-detail .back-link { display: inline-flex; align-items: center; gap: 6px; border: 0; background: transparent; color: var(--ks-fg-muted); font: inherit; font-size: 12px; cursor: pointer; }
.ks-screen--control-detail .back-link svg { transform: rotate(180deg); }
.ks-screen--control-detail .detail-head { display: flex; align-items: flex-start; gap: 16px; margin-top: 18px; }
.ks-screen--control-detail .head-icon { width: 44px; height: 44px; display: grid; place-items: center; flex: none; border-radius: 11px; color: var(--ks-indigo-muted); background: var(--ks-indigo-bg); }
.ks-screen--control-detail .detail-head h1 { font-size: 24px; }
.ks-screen--control-detail .meta-row { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.ks-screen--control-detail .pill { padding: 4px 9px; border: 1px solid var(--ks-border); border-radius: 999px; color: var(--ks-fg-secondary); background: var(--ks-bg-elevated); font-size: 11px; }
.ks-screen--control-detail .detail-layout { display: grid; grid-template-columns: minmax(0,1fr) 280px; gap: 26px; margin-top: 25px; align-items: start; }
.ks-screen--control-detail .steps { display: flex; align-items: center; gap: 8px; margin-bottom: 17px; color: var(--ks-fg-dim); font-family: var(--ks-font-mono); font-size: 11px; }
.ks-screen--control-detail .steps span { display: inline-flex; align-items: center; gap: 6px; }
.ks-screen--control-detail .steps b { width: 19px; height: 19px; display: grid; place-items: center; border-radius: 50%; color: var(--ks-fg-on-accent); background: var(--ks-indigo); font-size: 9px; }
.ks-screen--control-detail .steps i { width: 18px; height: 1px; background: var(--ks-border-strong); }
.ks-screen--control-detail .layer { overflow: hidden; margin-top: 14px; border: 1px solid var(--ks-border); border-radius: 15px; background: var(--ks-bg-card); box-shadow: var(--ks-shadow-card); }
.ks-screen--control-detail .layer > header { display: flex; align-items: center; gap: 12px; padding: 15px 18px; border-bottom: 1px solid var(--ks-border); }
.ks-screen--control-detail .layer > header > b { width: 31px; height: 31px; display: grid; place-items: center; flex: none; border-radius: 9px; color: var(--ks-indigo-muted); background: var(--ks-indigo-bg); font-family: var(--ks-font-mono); }
.ks-screen--control-detail .layer.adoption > header > b { color: var(--ks-purple-light); background: var(--ks-purple-bg); }
.ks-screen--control-detail .layer.enforce > header > b { color: var(--ks-green); background: color-mix(in srgb,var(--ks-green) 14%,transparent); }
.ks-screen--control-detail .layer header h2 { color: var(--ks-fg); font-size: 14px; }
.ks-screen--control-detail .layer header p { margin-top: 2px; color: var(--ks-fg-muted); font-size: 11.5px; }
.ks-screen--control-detail .layer header > span, .ks-screen--control-detail .layer header > strong { margin-left: auto; }
.ks-screen--control-detail .layer-body { padding: 16px 18px; }
.ks-screen--control-detail .ref-chip { display: inline-flex; align-items: center; gap: 7px; padding: 7px 11px; border: 1px solid var(--ks-border); border-radius: 999px; color: var(--ks-fg-secondary); background: var(--ks-bg-elevated); font-size: 12px; }
.ks-screen--control-detail .adoption-card, .ks-screen--control-detail .guardian-card { display: flex; align-items: center; gap: 11px; padding: 11px 13px; border: 1px solid var(--ks-border); border-radius: 11px; background: var(--ks-bg-soft); }
.ks-screen--control-detail .agent-icon, .ks-screen--control-detail .guardian-card > span { width: 32px; height: 32px; display: grid; place-items: center; flex: none; border-radius: 9px; color: var(--ks-fg-muted); background: var(--ks-bg-elevated); }
.ks-screen--control-detail .adoption-card > div, .ks-screen--control-detail .guardian-card > div { min-width: 0; flex: 1; }
.ks-screen--control-detail .adoption-card strong, .ks-screen--control-detail .guardian-card strong { color: var(--ks-fg); font-size: 13px; }
.ks-screen--control-detail .adoption-card p, .ks-screen--control-detail .guardian-card p { margin-top: 3px; color: var(--ks-fg-muted); font-size: 11.5px; }
.ks-screen--control-detail .guardian-card > span { width: 44px; height: 44px; color: var(--ks-fg-on-accent); background: var(--ks-shield-gradient); }
.ks-screen--control-detail .guardian-card em { font-style: normal; }
.ks-screen--control-detail .signal-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; margin-top: 14px; overflow: hidden; border-radius: 10px; background: var(--ks-border); }
.ks-screen--control-detail .signal-grid div { padding: 12px; background: var(--ks-bg-soft); }
.ks-screen--control-detail .signal-grid span { display: block; color: var(--ks-fg-dim); font-size: 10px; }
.ks-screen--control-detail .signal-grid strong { display: block; margin-top: 4px; color: var(--ks-fg); font-size: 12px; }
.ks-screen--control-detail .facts { position: sticky; top: 20px; overflow: hidden; border: 1px solid var(--ks-border); border-radius: 15px; background: var(--ks-bg-card); box-shadow: var(--ks-shadow-card); }
.ks-screen--control-detail .facts h2 { padding: 14px 16px; font-size: 14px; }
.ks-screen--control-detail .facts div { padding: 10px 16px; border-top: 1px solid var(--ks-border); }
.ks-screen--control-detail .facts span { display: block; color: var(--ks-fg-dim); font-size: 10px; }
.ks-screen--control-detail .facts strong { display: block; margin-top: 3px; color: var(--ks-fg-secondary); font-size: 12px; font-weight: 500; }
@media (max-width: 800px) { .ks-screen--control-detail .detail-layout { grid-template-columns: 1fr; } .ks-screen--control-detail .facts { position: static; } }
@media (max-width: 600px) { .ks-screen--control-detail .signal-grid { grid-template-columns: 1fr; } .ks-screen--control-detail .steps { flex-wrap: wrap; } }

/* Org profile — branding (logo + guidelines), #5991 cutover */
.ks-screen--org-profile .orghead .logo { overflow: hidden; }
.ks-screen--org-profile .orghead .logo img { width: 100%; height: 100%; object-fit: contain; display: block; }
.ks-screen--org-profile .logo-upload { cursor: pointer; }
.ks-screen--org-profile .brandcard { background: var(--ks-bg-card); border: 1px solid var(--ks-border); border-radius: 14px; box-shadow: var(--ks-shadow-soft); padding: 16px 18px; }
.ks-screen--org-profile .brand-input { width: 100%; background: var(--ks-bg-soft); border: 1px solid var(--ks-border); border-radius: 10px; padding: 12px 14px; color: var(--ks-fg); font: inherit; font-size: 13.5px; line-height: 1.6; resize: vertical; min-height: 120px; }
.ks-screen--org-profile .brand-input:disabled { opacity: .7; }
.ks-screen--org-profile .brandactions { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 12px; }

/* ================= Invitations — Governance Core identity (#6000) ================= */
.ks-screen--invitations { max-width: 1180px; }
.ks-screen--invitations .invite-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin: 22px 0 14px; }
.ks-screen--invitations .filter-chips, .ks-screen--invitations .bulk-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ks-screen--invitations .bulk-actions > span { color: var(--ks-fg-muted); font-size: 12px; }
.ks-screen--invitations .invite-table { overflow-x: auto; border: 1px solid var(--ks-border); border-radius: 16px; background: var(--ks-bg-card); box-shadow: var(--ks-shadow-card); }
.ks-screen--invitations .invite-row { min-width: 1020px; display: grid; grid-template-columns: 34px minmax(190px, 1.3fr) minmax(190px, 1.2fr) 105px 110px 110px 170px; align-items: center; gap: 12px; padding: 13px 16px; border-top: 1px solid var(--ks-border); color: var(--ks-fg-secondary); font-size: 12.5px; }
.ks-screen--invitations .invite-row:first-child { border-top: 0; }
.ks-screen--invitations .invite-head { color: var(--ks-fg-dim); background: var(--ks-bg-soft); font-family: var(--ks-font-mono); font-size: 10.5px; letter-spacing: .05em; text-transform: uppercase; }
.ks-screen--invitations .invite-row > span { min-width: 0; }
.ks-screen--invitations .invite-row strong, .ks-screen--invitations .invite-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ks-screen--invitations .invite-row strong { color: var(--ks-fg-secondary); font-size: 12.5px; font-weight: 500; }
.ks-screen--invitations .invite-row small { margin-top: 3px; color: var(--ks-fg-dim); font-size: 11px; }
.ks-screen--invitations .invite-email { overflow: hidden; color: var(--ks-fg); font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.ks-screen--invitations .invite-actions { display: flex; align-items: center; justify-content: flex-end; gap: 7px; }
.ks-screen--invitations .pill[data-status="pending"] { color: var(--ks-amber); border-color: color-mix(in srgb, var(--ks-amber) 34%, transparent); background: color-mix(in srgb, var(--ks-amber) 11%, transparent); }
.ks-screen--invitations .pill[data-status="accepted"] { color: var(--ks-green); border-color: color-mix(in srgb, var(--ks-green) 34%, transparent); background: color-mix(in srgb, var(--ks-green) 11%, transparent); }
.ks-screen--invitations .pill[data-status="revoked"] { color: var(--ks-red); border-color: color-mix(in srgb, var(--ks-red) 34%, transparent); background: color-mix(in srgb, var(--ks-red) 10%, transparent); }
.ks-screen--invitations .pill[data-status="expired"] { color: var(--ks-fg-dim); }
.ks-screen--invitations .invite-pager { display: flex; justify-content: flex-end; margin-top: 14px; }
@media (max-width: 720px) {
  .ks-screen--invitations .page-head { align-items: stretch; }
  .ks-screen--invitations .page-head .btn { align-self: flex-start; }
}