@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;1,400&family=DM+Sans:wght@300;400;500&display=swap');

/* ─── EXACT FtF TOKENS ───────────────────────────────────────── */
:root {
  --ff-serif: 'Playfair Display', Georgia, serif;
  --ff-sans:  'DM Sans', system-ui, sans-serif;

  --bg:    #0f0809;
  --bg2:   #130b0d;
  --card:  #1e1214;
  --card2: #1f1214;
  --g:     #c94150;
  --gl:    #e0606e;
  --gdim:  rgba(201,65,80,.09);
  --hi:    #f0ede8;
  --mid:   #9a8a8d;
  --lo:    #8c7c80;
  --rule:  rgba(255,255,255,.06);

  --amber: rgba(255,160,80,.85);
  --amber-dim: rgba(255,160,80,.1);
  --amber-bdr: rgba(255,160,80,.25);

  --red:     rgba(220,90,90,.8);
  --red-dim: rgba(220,90,90,.1);
  --red-bdr: rgba(220,90,90,.22);

  --blue:     rgba(100,165,255,.8);
  --blue-dim: rgba(100,165,255,.1);
  --blue-bdr: rgba(100,165,255,.22);

  --sage:     #5faa8c;
  --sage-dim: rgba(95,170,140,.1);
  --sage-bdr: rgba(95,170,140,.25);
  --sage-l:   #7ec4aa;

  --slate:     #6e8faa;
  --slate-dim: rgba(110,143,170,.1);
  --slate-bdr: rgba(110,143,170,.25);

  --max: 820px;
  --nav-h: 40px;

  --r-sm: 4px;
  --r:    8px;
  --r-lg: 12px;
  --r-xl: 16px;
  --r-f:  9999px;
}

/* ─── LIGHT MODE ─────────────────────────────────────────────── */
@media (prefers-color-scheme: light) {
  :root {
    --bg:    #faf8f6;
    --bg2:   #f2eeed;
    --card:  #ffffff;
    --card2: #f5f1ee;
    --g:     #c94150;
    --gl:    #b03040;
    --gdim:  rgba(201,65,80,.07);
    --hi:    #1a1012;
    --mid:   #5a4a4e;
    --lo:    #6e5c60;
    --rule:  rgba(0,0,0,.09);

    --sage:     #3d9678;
    --sage-dim: rgba(61,150,120,.1);
    --sage-bdr: rgba(61,150,120,.28);
    --sage-l:   #2a7a60;

    --slate:     #4a7090;
    --slate-dim: rgba(74,112,144,.1);
    --slate-bdr: rgba(74,112,144,.28);

    --amber:     rgba(190,110,10,.85);
    --amber-dim: rgba(190,110,10,.09);
    --amber-bdr: rgba(190,110,10,.28);

    --red:     rgba(185,40,45,.85);
    --red-dim: rgba(185,40,45,.08);
    --red-bdr: rgba(185,40,45,.25);

    --blue:     rgba(50,120,200,.85);
    --blue-dim: rgba(50,120,200,.09);
    --blue-bdr: rgba(50,120,200,.25);
  }

  /* Font smoothing: better for dark-on-light */
  body { -webkit-font-smoothing: auto; }

  /* Sidebar + topbar */
  #topnav { background: rgba(250,248,246,.92); }
  #topbar  { background: var(--bg2); }
  .sb-item:hover { background: rgba(0,0,0,.03); }

  /* Cards — add subtle depth */
  .card { box-shadow: 0 1px 4px rgba(0,0,0,.06); }

  /* Buttons */
  .btn-secondary { border-color: rgba(0,0,0,.12); }
  .btn-secondary:hover:not(:disabled) { background: var(--bg2); border-color: rgba(0,0,0,.18); }

  /* Inputs — !important needed: base .input rule comes later in file and would otherwise win */
  .input {
    background: var(--card2) !important;
    border: 1px solid #a89a9e !important;
    color: var(--hi);
  }
  .input:focus { background: #fff !important; border-color: var(--g) !important; box-shadow: 0 0 0 3px rgba(201,65,80,.1); }
  .gate-field input { background: var(--card2) !important; border: 1px solid #a89a9e !important; }
  .gate-field input:focus { border-color: rgba(201,65,80,.5) !important; box-shadow: 0 0 0 3px rgba(201,65,80,.08); }

  select.input {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%235a4a4e' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  }

  /* Item rows & accordions (white-on-dark patterns flipped) */
  .item-row:hover           { background: rgba(0,0,0,.03); }
  .accordion-btn:hover      { background: rgba(0,0,0,.03); color: var(--hi); }
  .btn-ghost:hover:not(:disabled) { background: rgba(0,0,0,.06); }
  .icon-btn:hover { background: rgba(0,0,0,.06); }
  .accordion-btn.open       { background: rgba(0,0,0,.03); border-bottom: 1px solid var(--rule); }
  .accordion              { border-color: rgba(0,0,0,.08); }
  .accordion:hover          { border-color: rgba(0,0,0,.12); }
  .add-form-wrap            { background: rgba(0,0,0,.02); border-color: rgba(0,0,0,.08); }

  /* Insert/detail rows */
  .ai-block                 { border-bottom-color: rgba(0,0,0,.06); }
  .ai-strengths-concerns    { border-bottom-color: rgba(0,0,0,.06); }
  .ai-sc-col-right          { border-left-color:   rgba(0,0,0,.06); border-top-color: rgba(0,0,0,.06); }
  .acc-row + .acc-row       { border-top-color:    rgba(0,0,0,.06); }
  .crit-row                 { border-bottom-color: rgba(0,0,0,.06); }
  .crit-group + .crit-group { border-top-color:    rgba(0,0,0,.06); }
  .crit-group-hdr           { background: var(--bg2); }

  /* Results */
  .results-table tr.data-row:hover td  { background: rgba(0,0,0,.025); }
  .results-table tr.sel td             { background: rgba(201,65,80,.05); }
  .detail-inner                        { background: var(--card); }
  .results-app-header                  { background: var(--bg2); }
  .detail-app-bar                      { background: var(--bg2); }
  .app-group-hdr                       { background: var(--bg2); }
  .app-row:hover                       { background: rgba(0,0,0,.03); }

  /* Verdict banners */
  .verdict-banner { background: var(--card); box-shadow: 0 1px 4px rgba(0,0,0,.06); }
  .verdict-title-pills .stat-pill { background: rgba(0,0,0,.07); border-color: rgba(0,0,0,.12); }

  /* Upload page */
  .upload-drop-zone { background: var(--card); border-color: rgba(0,0,0,.12); }
  .upload-drop-zone.drag-over { background: var(--gdim); border-color: var(--g); }
  .upload-steps { border-top-color: rgba(0,0,0,.09); }
  .upload-step  { background: var(--card); border-color: rgba(0,0,0,.1); }

  /* Stat header parallelogram tints — slightly more opaque on light */
  .rsh-stat-eligible   { background: rgba(61,150,120,.1); }
  .rsh-stat-unclear    { background: rgba(74,112,144,.1); }
  .rsh-stat-ineligible { background: rgba(185,40,45,.08); }
  .rsh-stat-error      { background: rgba(190,110,10,.09); }
  .rsh-stat-advance    { background: rgba(61,150,120,.12); }

  /* Badge neutral */
  .badge-neutral { background: rgba(0,0,0,.05); }

  /* Scrollbar */
  ::-webkit-scrollbar-track { background: var(--bg2); }

  /* Gate right panel — keep dark deliberately */
  .gate-right { background: var(--bg2); }
}

/* ─── RESET ──────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: var(--bg);
  color: var(--hi);
  font-family: var(--ff-sans);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
button { cursor: pointer; font-family: var(--ff-sans); }
input, select, textarea { font-family: var(--ff-sans); }
strong { color: var(--hi); font-weight: 500; }

/* ─── SCROLLBAR ──────────────────────────────────────────────── */
::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb { background: var(--g); border-radius: 2px; }

/* ─── APP SHELL ──────────────────────────────────────────────── */
/* ─── APP SHELL — SIDEBAR LAYOUT ────────────────────────────── */
#app { display: flex; flex-direction: row; height: 100vh; overflow: hidden; }

/* ─── SIDEBAR ────────────────────────────────────────────────── */
#sidebar {
  width: 200px;
  min-width: 200px;
  flex-shrink: 0;
  background: var(--bg2);
  border-right: 1px solid var(--rule);
  display: flex;
  flex-direction: column;
  height: 100vh;
  overflow: hidden;
  transition: width .22s ease, min-width .22s ease;
  z-index: 100;
}
#sidebar.collapsed { width: 52px; min-width: 52px; }

/* ─── RESULT IDENTITY HEADER ─────────────────────────────────── */
.result-identity {
  padding: 24px 32px 16px;
  border-bottom: 1px solid var(--rule);
  flex-shrink: 0;
}
.result-identity-eyebrow {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--lo);
  margin-bottom: 6px;
}
.result-identity-desc {
  font-size: 13px;
  font-style: italic;
  color: var(--mid);
  line-height: 1.6;
  margin-bottom: 6px;
}
.result-identity-name {
  font-family: var(--ff-serif);
  font-size: clamp(20px, 2.4vw, 30px);
  font-weight: 400;
  color: var(--hi);
  line-height: 1.15;
  letter-spacing: -.01em;
  margin-bottom: 10px;
}
.result-identity-badge { display: flex; gap: 6px; flex-wrap: wrap; }

/* Clean up detail app bar — actions only */
.detail-app-bar {
  justify-content: space-between;
}
.detail-app-bar .detail-app-bar-actions {
  display: flex;
  align-items: center;
  gap: 4px;
  flex: 1;
}

/* App loading overlay */
#app-loading {
  position: fixed;
  inset: 0;
  z-index: 9998;
  background: var(--bg);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity .28s ease;
}
.app-loading-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
}
.app-loading-logo {
  width: 48px; height: 48px;
  border-radius: 12px;
  border: 1px solid rgba(201,65,80,.35);
  background: linear-gradient(135deg, rgba(201,65,80,.14), rgba(201,65,80,.06));
  display: flex; align-items: center; justify-content: center;
  font-family: var(--ff-serif);
  font-size: 24px; font-weight: 400;
  color: var(--g);
  margin-bottom: 8px;
}

/* Numbered nav items disabled when no cycle is active */
#sidebar.no-cycle .sb-nav .sb-item {
  opacity: .3;
  pointer-events: none;
  cursor: not-allowed;
}

.sb-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 18px 14px 16px;
  border-bottom: 1px solid var(--rule);
  flex-shrink: 0;
  overflow: hidden;
}
.sb-logo-mark {
  width: 32px; height: 32px;
  border-radius: 8px;
  border: 1px solid rgba(201,65,80,.35);
  background: linear-gradient(135deg, rgba(201,65,80,.14), rgba(201,65,80,.06));
  display: flex; align-items: center; justify-content: center;
  font-family: var(--ff-serif);
  font-size: 16px; font-weight: 400;
  color: var(--g);
  flex-shrink: 0;
}
.sb-brand-text { min-width: 0; overflow: hidden; }
.sb-brand-name {
  font-size: 10px; font-weight: 600;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--lo); white-space: nowrap;
}
.sb-brand-sub {
  font-size: 10px; color: var(--lo);
  opacity: .7; white-space: nowrap; margin-top: 1px;
}
#sidebar.collapsed .sb-brand-text { display: none; }

.sb-nav { flex: 1; padding: 8px 0; display: flex; flex-direction: column; }
.sb-bottom { display: flex; flex-direction: column; padding-bottom: 0; }
.sb-divider { height: 1px; background: var(--rule); margin: 4px 0; }

.sb-item {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 10px 14px;
  background: transparent;
  border: none;
  border-left: 2px solid transparent;
  cursor: pointer;
  font-family: var(--ff-sans);
  color: var(--lo);
  text-align: left;
  width: 100%;
  transition: background .12s, color .12s, border-color .12s;
  white-space: nowrap;
  overflow: hidden;
}
.sb-item:hover { background: var(--card); color: var(--mid); }
.sb-item.active {
  background: rgba(201,65,80,.13);
  color: var(--gl);
  border-left-color: var(--g);
}

.sb-num {
  font-family: var(--ff-serif);
  font-size: 18px; font-weight: 400;
  color: inherit;
  flex-shrink: 0;
  width: 22px; text-align: center; line-height: 1;
}
.sb-icon {
  display: flex; align-items: center; justify-content: center;
  width: 22px; flex-shrink: 0;
  color: inherit;
}
.sb-icon svg { opacity: .75; }
.sb-item.active .sb-icon svg { opacity: 1; }
.sb-label {
  font-size: 12px; font-weight: 500;
  letter-spacing: .04em;
  transition: opacity .15s;
  flex: 1;
}
.sb-badge {
  font-size: 9px;
  font-weight: 600;
  color: var(--lo);
  background: rgba(255,255,255,.07);
  border-radius: 99px;
  padding: 1px 6px;
  min-width: 18px;
  text-align: center;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  display: none; /* shown via JS as inline-flex */
}
.sb-item.active .sb-badge { color: var(--g); background: var(--gdim); }
#sidebar.collapsed .sb-badge { display: none !important; }
#sidebar.collapsed .sb-label { opacity: 0; width: 0; overflow: hidden; }
#sidebar.collapsed .sb-item { justify-content: center; padding: 10px; }
#sidebar.collapsed .sb-num  { width: auto; }

/* Cloud storage status indicator */
.cloud-status-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 7px 14px;
  border: none;
  border-top: 1px solid var(--rule);
  background: transparent;
  font: inherit;
  text-align: left;
  cursor: default;
}
/* Clickable to retry queued writes. */
.cs-offline, .cs-error { cursor: pointer; }
.cloud-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  flex-shrink: 0;
}
.cs-connected .cloud-dot { background: var(--sage); }
.cs-local     .cloud-dot { background: var(--amber); animation: cs-pulse 2s ease-in-out infinite; }
.cs-offline   .cloud-dot { background: var(--amber); animation: cs-pulse 1.6s ease-in-out infinite; }
.cs-syncing   .cloud-dot { background: var(--sage); animation: cs-pulse 1s  ease-in-out infinite; }
.cs-error     .cloud-dot { background: var(--red); }
.cs-checking  .cloud-dot { background: var(--lo); animation: cs-pulse 1.2s ease-in-out infinite; }

@keyframes cs-pulse {
  0%, 100% { opacity: 1; }
  50%       { opacity: .3; }
}

.cloud-status-label {
  font-size: 10px;
  color: var(--lo);
  white-space: nowrap;
  overflow: hidden;
}
.cs-connected .cloud-status-label { color: var(--sage); }
.cs-syncing   .cloud-status-label { color: var(--sage); }
.cs-error     .cloud-status-label { color: var(--red); }
.cs-local     .cloud-status-label { color: var(--amber); }
.cs-offline   .cloud-status-label { color: var(--amber); }

#sidebar.collapsed .cloud-status-label { display: none; }
#sidebar.collapsed .cloud-status-wrap  { justify-content: center; padding: 7px; }

.sb-toggle {
  display: flex; align-items: center; justify-content: center;
  height: 38px; width: 100%;
  background: transparent; border: none;
  border-top: 1px solid var(--rule);
  cursor: pointer;
  color: var(--lo);
  transition: color .15s, background .12s;
  flex-shrink: 0;
}
.sb-toggle:hover { color: var(--mid); background: var(--card); }

/* ─── MAIN WRAP + TOPBAR ─────────────────────────────────────── */
#main-wrap { flex: 1; display: flex; flex-direction: column; overflow: hidden; min-width: 0; }

#topbar {
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0 24px;
  border-bottom: 1px solid var(--rule);
  background: var(--bg2);
  flex-shrink: 0;
  transition: height .15s, padding .15s;
}
/* Collapse entirely when no actions live here */
#topbar:not(:has(button)) {
  height: 0;
  padding: 0;
  border: none;
  overflow: hidden;
}

/* ─── MAIN ───────────────────────────────────────────────────── */
#main { flex: 1; overflow: hidden; display: flex; flex-direction: column; }

.content {
  flex: 1;
  overflow-y: auto;
  padding: 0;
}

.page        { display: none; }
.page.active { display: block; }

/* Results page fills the viewport so panels can scroll independently */
#p-results.active { display: flex; flex-direction: column; height: 100%; }

/* ─── SINGLE PAGE — LANDING HERO ────────────────────────────── */

.single-hero {
  min-height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 80px 52px;
  position: relative;
  text-align: center;
}
.single-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 80% 60% at 50% 40%, rgba(201,65,80,.06) 0%, transparent 70%);
  pointer-events: none;
}

.single-hero-eyebrow {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--g);
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 20px;
  justify-content: center;
}
.single-hero-eyebrow::before,
.single-hero-eyebrow::after {
  content: '';
  width: 24px;
  height: 1px;
  background: var(--g);
  opacity: .5;
}

.single-hero h1 {
  font-family: var(--ff-serif);
  font-size: clamp(40px, 6vw, 72px);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: -.02em;
  margin-bottom: 22px;
  max-width: 640px;
}

.single-hero-lede {
  font-family: var(--ff-serif);
  font-style: italic;
  font-size: clamp(15px, 1.8vw, 18px);
  color: var(--gl);
  line-height: 1.6;
  margin-bottom: 48px;
  max-width: 500px;
}

.single-hero-actions {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  justify-content: center;
  margin-bottom: 0;
}

/* After upload — result zone */
.single-result-zone {
  width: 100%;
  max-width: var(--max);
  margin: 0 auto;
  padding: 0 52px 72px;
}

/* ─── BATCH PAGE ─────────────────────────────────────────────── */
.page-wrap {
  width: 100%;
  max-width: var(--max);
  margin: 0 auto;
  padding: 60px 52px;
}

.sec-eye {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--g);
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}
.sec-eye span { color: var(--lo); font-family: var(--ff-serif); font-size: 11px; }

h2.sec-title {
  font-family: var(--ff-serif);
  font-size: clamp(30px, 4vw, 48px);
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -.02em;
  margin-bottom: 18px;
}

.sec-lede {
  font-size: 14px;
  color: var(--mid);
  line-height: 1.85;
  max-width: 580px;
  margin-bottom: 44px;
  padding-left: 18px;
  border-left: 2px solid rgba(201,65,80,.3);
}

/* ─── CONFIG PAGE ────────────────────────────────────────────── */
#p-config.active { display: flex; flex-direction: column; height: 100%; }
#p-config .content { max-width: 100%; padding: 0; }

/* ─── CONFIG BACK BUTTON ─────────────────────────────────────── */
.cfg-back-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  font-weight: 500;
  color: var(--lo);
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 0;
  transition: color .15s;
}
.cfg-back-btn:hover { color: var(--mid); }
.cfg-back-sep { color: var(--rule); margin: 0 6px; font-size: 11px; }
.config-ctx-type {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--lo);
  margin-left: 8px;
  padding: 1px 7px;
  border-radius: var(--r-f);
  background: var(--card2);
  border: 1px solid var(--rule);
}

/* ─── CONFIG LIST PAGE ───────────────────────────────────────── */
.gcfg-body {
  padding: 32px 40px;
  display: flex;
  flex-direction: column;
  gap: 40px;
  overflow-y: auto;
  flex: 1;
}
.gcfg-section { display: flex; flex-direction: column; gap: 0; }
.gcfg-section-hdr {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.gcfg-section-title {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--lo);
}
.gcfg-section-actions { display: flex; gap: 6px; align-items: center; }
.gcfg-list {
  border: 1px solid var(--rule);
  border-radius: var(--r);
  overflow: hidden;
}
.gcfg-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--rule);
  background: var(--card);
  transition: background .12s;
}
.gcfg-row:last-child { border-bottom: none; }
.gcfg-row:hover { background: var(--card2); }
.gcfg-row-active { background: var(--gdim); }
.gcfg-row-active:hover { background: var(--gdim); }
.gcfg-row-left { display: flex; align-items: center; gap: 12px; min-width: 0; flex: 1; }
.gcfg-active-indicator { flex-shrink: 0; width: 18px; display: flex; align-items: center; justify-content: center; }
.gcfg-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.gcfg-dot-on  { background: var(--g); box-shadow: 0 0 0 2px var(--gdim); }
.gcfg-dot-off { background: var(--rule); border: 1px solid var(--lo); opacity: .4; }
.gcfg-row-info { min-width: 0; flex: 1; }
.gcfg-row-name {
  font-size: 13px;
  font-weight: 500;
  color: var(--hi);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.gcfg-row-meta {
  font-size: 11px;
  color: var(--lo);
  margin-top: 2px;
}
.gcfg-row-actions { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.gcfg-rename-input { padding: 4px 8px; font-size: 13px; height: auto; }
.gcfg-new-form {
  background: var(--card);
  border: 1px solid var(--rule);
  border-radius: var(--r);
  padding: 16px 18px;
  margin-bottom: 10px;
}
.gcfg-new-form-actions { display: flex; gap: 8px; margin-top: 12px; }
.gcfg-empty {
  padding: 24px 18px;
  font-size: 13px;
  color: var(--lo);
  font-style: italic;
  background: var(--card);
}

/* ─── CONFIG CONTEXT HEADER ──────────────────────────────────── */
#config-context:empty { display: none; }
.config-ctx {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 40px;
  border-bottom: 1px solid var(--rule);
  flex-shrink: 0;
}
.config-ctx-global { background: var(--bg2); }
.config-ctx-cycle  { background: var(--gdim); }
.config-ctx-icon   { font-size: 15px; flex-shrink: 0; color: var(--lo); }
.config-ctx-title  { font-size: 12px; font-weight: 600; color: var(--hi); }
.config-ctx-sub    { font-size: 10px; color: var(--lo); margin-top: 2px; }
.config-ctx .btn   { margin-left: auto; flex-shrink: 0; }

.config-tabbar {
  display: flex;
  align-items: center;
  border-bottom: 1px solid var(--rule);
  background: var(--bg2);
  padding: 0 40px;
  flex-shrink: 0;
  box-shadow: 0 2px 12px rgba(0,0,0,.25);
}
.config-tab {
  padding: 14px 16px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--lo);
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  transition: color .15s, border-color .15s;
  font-family: var(--ff-sans);
  white-space: nowrap;
  margin-bottom: -1px;
}
.config-tab:hover  { color: var(--mid); }
.config-tab.active { color: var(--gl); border-bottom-color: var(--g); }

.config-tabbar-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
}
.save-status {
  font-size: 10px;
  color: var(--lo);
  letter-spacing: .1em;
  text-transform: uppercase;
}

.config-content {
  flex: 1;
  overflow-y: auto;
  padding: 48px 52px;
}

/* ─── BUTTONS ────────────────────────────────────────────────── */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 10px 22px;
  border-radius: var(--r);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .06em;
  text-transform: uppercase;
  border: 1px solid transparent;
  transition: background .15s, border-color .15s, color .15s, transform .12s ease-out, box-shadow .15s, opacity .15s;
  white-space: nowrap;
  line-height: 1.4;
  font-family: var(--ff-sans);
}
.btn:disabled { opacity: .35; cursor: not-allowed; }

/* Green primary */
.btn-primary {
  background: var(--g);
  color: var(--bg);
  border-color: var(--g);
  font-weight: 600;
}
.btn-primary:hover:not(:disabled) {
  background: var(--gl);
  border-color: var(--gl);
  color: var(--bg);
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(201,65,80,.3);
}

.btn-secondary {
  background: transparent;
  color: var(--mid);
  border-color: rgba(255,255,255,.1);
}
.btn-secondary:hover:not(:disabled) {
  background: var(--card);
  color: var(--hi);
  border-color: rgba(255,255,255,.15);
  transform: translateY(-1px);
}

.btn-ghost {
  background: transparent;
  color: var(--lo);
  border-color: transparent;
}
.btn-ghost:hover:not(:disabled) { color: var(--mid); background: rgba(255,255,255,.07); transform: translateY(-1px); }

.btn-danger { background: transparent; color: var(--red); border-color: var(--red-bdr); }
.btn-danger:hover:not(:disabled) { background: var(--red-dim); }

.btn-sm   { padding: 6px 14px; font-size: 11px; border-radius: var(--r-sm); gap: 5px; }
.btn-lg   { padding: 13px 32px; font-size: 13px; font-weight: 600; }
.btn-full { width: 100%; justify-content: center; }

.icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px; height: 28px;
  border: none;
  background: transparent;
  border-radius: var(--r-sm);
  color: var(--lo);
  transition: color .15s, background .15s;
  flex-shrink: 0;
}
.icon-btn:hover { background: rgba(255,255,255,.07); color: var(--hi); }

/* ─── INSIGHT / CARD BLOCKS ──────────────────────────────────── */
.card {
  background: var(--card);
  border: 1px solid var(--rule);
  border-radius: var(--r-lg);
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0,0,0,.4), 0 4px 14px rgba(0,0,0,.22);
}
.card + .card { margin-top: 12px; }

.card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 22px;
  border-bottom: 1px solid var(--rule);
  background: rgba(255,255,255,.02);
}
.card-title {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--g);
}
.card-note {
  font-size: 13px;
  color: var(--mid);
  line-height: 1.7;
  padding: 11px 22px;
  border-bottom: 1px solid var(--rule);
  background: rgba(255,255,255,.015);
}
.card-body { padding: 22px; }

/* Insight block — accent-dim bg, green border */
.insight-block {
  background: var(--gdim);
  border: 1px solid rgba(201,65,80,.15);
  border-radius: var(--r-lg);
  padding: 22px 26px;
}
.insight-block-label {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--g);
  margin-bottom: 10px;
}
.insight-block p { font-size: 13px; color: var(--mid); line-height: 1.75; }

/* ─── FORMS ──────────────────────────────────────────────────── */
.form-group { margin-bottom: 18px; }
.form-group:last-child { margin-bottom: 0; }

label {
  display: block;
  font-size: 10px;
  font-weight: 500;
  color: var(--lo);
  margin-bottom: 7px;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.input {
  width: 100%;
  padding: 10px 14px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--r);
  font-size: 14px;
  font-weight: 300;
  color: var(--hi);
  background: rgba(255,255,255,.04);
  transition: border-color .15s, box-shadow .15s;
  -webkit-appearance: none;
  appearance: none;
  line-height: 1.5;
}
.input:focus {
  outline: none;
  border-color: rgba(201,65,80,.5);
  box-shadow: 0 0 0 3px rgba(201,65,80,.08);
  background: rgba(255,255,255,.055);
}
.input::placeholder { color: var(--lo); }
textarea.input { resize: vertical; line-height: 1.7; }

select.input {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%239a8a8d' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  padding-right: 32px;
}

.form-row { display: flex; gap: 12px; }
.form-row .form-group { flex: 1; min-width: 0; }
.form-actions { display: flex; gap: 8px; justify-content: flex-end; padding-top: 4px; }
.hint-text { font-size: 12px; color: var(--lo); margin-top: 6px; line-height: 1.6; }

/* ─── BADGES ─────────────────────────────────────────────────── */
.badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 9px;
  border-radius: var(--r-f);
  font-size: 10px;
  font-weight: 500;
  line-height: 1.5;
  white-space: nowrap;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.badge-success { background: var(--sage-dim); color: var(--sage-l); border: 1px solid var(--sage-bdr); }
.badge-warning { background: var(--amber-dim);      color: var(--amber); border: 1px solid var(--amber-bdr); }
.badge-danger  { background: var(--red-dim);        color: var(--red);   border: 1px solid var(--red-bdr);   }
.badge-info    { background: var(--blue-dim);       color: var(--blue);  border: 1px solid var(--blue-bdr);  }
.badge-neutral { background: rgba(255,255,255,.05); color: var(--mid);   border: 1px solid var(--rule);      }

.sev-blocking {
  color: var(--red); font-size: 10px; font-weight: 500;
  text-transform: uppercase; letter-spacing: .06em;
  background: var(--red-dim); border: 1px solid var(--red-bdr);
  padding: 1px 8px; border-radius: var(--r-f); display: inline-block; margin-top: 4px;
}
.sev-warning {
  color: var(--amber); font-size: 10px; font-weight: 500;
  text-transform: uppercase; letter-spacing: .06em;
  background: var(--amber-dim); border: 1px solid var(--amber-bdr);
  padding: 1px 8px; border-radius: var(--r-f); display: inline-block; margin-top: 4px;
}

/* ─── EMPTY STATES ───────────────────────────────────────────── */
.empty-state { text-align: center; padding: 80px 24px; }
.empty-state svg { display: block; margin: 0 auto 20px; opacity: .2; color: var(--mid); }
.empty-state h3 {
  font-family: var(--ff-serif);
  font-size: 22px;
  font-weight: 400;
  font-style: italic;
  color: var(--mid);
  margin-bottom: 8px;
}
.empty-state p { font-size: 13px; color: var(--lo); line-height: 1.75; max-width: 300px; margin: 0 auto; }

/* ─── PROGRESS ───────────────────────────────────────────────── */
.progress-bar  { height: 2px; background: var(--rule); border-radius: var(--r-f); overflow: hidden; }
.progress-fill { height: 100%; background: var(--g); border-radius: var(--r-f); transition: width .35s ease; }

.progress-zone {
  background: var(--card);
  border: 1px solid var(--rule);
  border-left: 3px solid var(--g);
  border-radius: var(--r-lg);
  padding: 16px 22px;
  margin-bottom: 20px;
}
.progress-label { font-size: 13px; color: var(--mid); margin-bottom: 10px; }

/* ─── SPINNER ─────────────────────────────────────────────────── */
.spinner {
  display: inline-block;
  width: 14px; height: 14px;
  border: 1.5px solid var(--rule);
  border-top-color: var(--g);
  border-radius: 50%;
  animation: spin .65s linear infinite;
  vertical-align: middle;
  flex-shrink: 0;
}
.spinner-lg { width: 30px; height: 30px; border-width: 2px; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ─── ANIMATIONS ─────────────────────────────────────────────── */
@keyframes fadeSlideIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes scaleIn {
  from { transform: scale(0.72); opacity: 0; }
  to   { transform: scale(1); opacity: 1; }
}
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ─── FOCUS VISIBLE ──────────────────────────────────────────── */
.btn:focus-visible,
.sb-item:focus-visible,
.icon-btn:focus-visible,
.accordion-btn:focus-visible,
.rfilter-chip:focus-visible,
.detail-tab:focus-visible {
  outline: 2px solid var(--g);
  outline-offset: 2px;
}
.input:focus-visible { outline: none; }

/* ─── REDUCED MOTION ─────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* ─── CONFIG ITEMS ───────────────────────────────────────────── */
.item-row {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 14px 22px;
  border-bottom: 1px solid rgba(255,255,255,.04);
  transition: background .1s;
}
.item-row:last-child { border-bottom: none; }
.item-row:hover { background: rgba(255,255,255,.025); }
.item-info  { flex: 1; min-width: 0; }
.item-label { font-size: 13px; font-weight: 500; color: var(--hi); }
.item-desc  { font-size: 12px; color: var(--lo); margin-top: 3px; line-height: 1.55; }

/* Add form — try-it / insight style */
.add-form-wrap {
  background: var(--gdim);
  border: 1px solid rgba(201,65,80,.18);
  border-left: 3px solid var(--g);
  border-radius: 0 var(--r-lg) var(--r-lg) 0;
  padding: 18px 22px;
  margin-bottom: 16px;
}
.add-form-title {
  font-family: var(--ff-serif);
  font-size: 14px;
  font-weight: 400;
  color: var(--gl);
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}

/* ─── BATCH CARDS — track card style ────────────────────────── */
.batch-card {
  background: var(--card);
  border-left: 3px solid var(--g);
  border-radius: 0 var(--r-lg) var(--r-lg) 0;
  border: 1px solid var(--rule);
  border-left-width: 3px;
  border-left-color: var(--g);
  margin-bottom: 10px;
  overflow: hidden;
}
.batch-card-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 18px;
  background: linear-gradient(90deg, var(--gdim), transparent);
  border-bottom: 1px solid var(--rule);
}
.batch-num {
  width: 20px; height: 20px;
  border-radius: var(--r-f);
  color: rgba(201,65,80,.4);
  font-family: var(--ff-serif);
  font-size: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.batch-name {
  flex: 1;
  font-size: 13px;
  font-weight: 400;
  border: none;
  background: transparent;
  color: var(--hi);
  min-width: 0;
  font-family: var(--ff-sans);
}
.batch-name:focus { outline: none; }
.batch-body { padding: 12px 18px; }

/* ─── STATS — rec-item style ─────────────────────────────────── */
.stats-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-bottom: 28px;
}
.stat-card {
  background: var(--card);
  border: 1px solid var(--rule);
  border-radius: var(--r-lg);
  padding: 22px 18px;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.stat-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, var(--g), transparent);
}
.stat-value {
  font-family: var(--ff-serif);
  font-size: 32px;
  font-weight: 400;
  color: var(--hi);
  line-height: 1.1;
  letter-spacing: -.02em;
}
.stat-label {
  font-size: 10px;
  font-weight: 500;
  color: var(--lo);
  margin-top: 6px;
  text-transform: uppercase;
  letter-spacing: .14em;
}

/* ─── RESULTS TABLE ──────────────────────────────────────────── */
.results-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--card);
  border-radius: var(--r-lg);
  overflow: hidden;
  border: 1px solid var(--rule);
}
.results-table th {
  text-align: left;
  padding: 11px 18px;
  font-size: 10px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .14em;
  color: var(--lo);
  border-bottom: 1px solid var(--rule);
  background: rgba(255,255,255,.025);
  white-space: nowrap;
}
.results-table td {
  padding: 13px 18px;
  border-bottom: 1px solid rgba(255,255,255,.04);
  font-size: 13px;
  color: var(--mid);
  vertical-align: middle;
  line-height: 1.5;
}
.results-table tr.data-row           { cursor: pointer; }
.results-table tr.data-row:hover td  { background: rgba(255,255,255,.03); }
.results-table tr.sel td             { background: rgba(201,65,80,.05); }
.results-table tr.detail-row td      { padding: 0; border-bottom: 1px solid var(--rule); }
.results-table tr:last-child td      { border-bottom: none; }

.detail-inner { padding: 24px 22px; background: rgba(0,0,0,.15); }

/* ─── VERDICT BANNER ─────────────────────────────────────────── */
.verdict-banner {
  border-radius: var(--r-lg);
  padding: 26px 30px;
  margin-bottom: 18px;
  border: 1px solid var(--rule);
  background: var(--card);
  position: relative;
  overflow: hidden;
}
.verdict-banner-main {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  min-width: 0;
}

/* Pills inline with verdict title */
.verdict-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 4px;
}
.verdict-title-row .verdict-banner-title { margin-bottom: 0; }
.verdict-title-pills {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  flex-shrink: 0;
}
/* Override stat-pill to be slightly more compact inside the banner */
.verdict-title-pills .stat-pill {
  font-size: 10px;
  padding: 3px 9px;
  background: rgba(255,255,255,.08);
  border-radius: var(--r-f);
  border: 1px solid rgba(255,255,255,.1);
}

.verdict-banner-focus {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 12px;
}
.verdict-focus-tag {
  font-size: 10px;
  font-weight: 400;
  padding: 2px 8px;
  border-radius: var(--r-f);
  background: var(--card2);
  border: 1px solid var(--rule);
  color: var(--mid);
}
.verdict-banner::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 2px;
}
.verdict-inscope::after    { background: linear-gradient(90deg, var(--sage), transparent 55%); }
.verdict-outscope::after   { background: linear-gradient(90deg, var(--red), transparent 55%); }
.verdict-borderline::after { background: linear-gradient(90deg, var(--slate), transparent 55%); }
.verdict-unclear::after    { background: linear-gradient(90deg, var(--slate), transparent 55%); }

.verdict-banner-icon {
  width: 38px; height: 38px;
  border-radius: 50%;
  background: var(--gdim);
  border: 1px solid rgba(201,65,80,.15);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-family: var(--ff-serif);
  font-size: 16px;
  font-weight: 400;
  color: var(--lo);
  animation: scaleIn .22s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.verdict-banner-body  { flex: 1; min-width: 0; }
.verdict-banner-title {
  font-family: var(--ff-serif);
  font-size: 22px;
  font-weight: 400;
  line-height: 1.15;
  margin-bottom: 4px;
  color: var(--hi);
  letter-spacing: -.01em;
  animation: fadeUp .18s ease-out .05s both;
}
.verdict-banner-rec {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--mid);
  margin-bottom: 12px;
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: var(--r-f);
  background: rgba(255,255,255,.05);
  border: 1px solid var(--rule);
}
.verdict-banner-summary {
  font-size: 13px;
  line-height: 1.85;
  color: var(--mid);
  padding-left: 16px;
  border-left: 2px solid rgba(201,65,80,.25);
}

.verdict-inscope    .verdict-banner-icon    { background: var(--sage-dim); border-color: var(--sage-bdr); color: var(--sage-l); }
.verdict-inscope    .verdict-banner-title   { color: var(--sage-l); }
.verdict-inscope    .verdict-banner-rec     { color: var(--sage); }
.verdict-inscope    .verdict-banner-summary { border-left-color: var(--sage-bdr); }
.verdict-outscope   .verdict-banner-icon    { background: var(--red-dim);   border-color: var(--red-bdr);   color: var(--red); }
.verdict-outscope   .verdict-banner-title   { color: var(--red); }
.verdict-outscope   .verdict-banner-rec     { color: var(--red); }
.verdict-outscope   .verdict-banner-summary { border-left-color: var(--red-bdr); }
.verdict-borderline .verdict-banner-icon    { background: var(--slate-dim); border-color: var(--slate-bdr); color: var(--slate); }
.verdict-borderline .verdict-banner-title   { color: var(--slate); }
.verdict-borderline .verdict-banner-rec     { color: var(--slate); }
.verdict-borderline .verdict-banner-summary { border-left-color: var(--slate-bdr); }
.verdict-unclear    .verdict-banner-icon    { background: var(--slate-dim); border-color: var(--slate-bdr); color: var(--slate); }
.verdict-unclear    .verdict-banner-title   { color: var(--slate); }
.verdict-unclear    .verdict-banner-rec     { color: var(--slate); }
.verdict-unclear    .verdict-banner-summary { border-left-color: var(--slate-bdr); }

/* ─── STAT PILLS ─────────────────────────────────────────────── */
.stat-pills { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 18px; }
.stat-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 4px 12px;
  background: rgba(255,255,255,.04);
  border: 1px solid var(--rule);
  border-radius: var(--r-f);
  font-size: 11px;
  font-weight: 500;
  color: var(--mid);
  white-space: nowrap;
  letter-spacing: .03em;
}
.stat-pill-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }
.dot-green  { background: var(--sage); }
.dot-amber  { background: var(--amber); }
.dot-red    { background: var(--red); }
.dot-neutral{ background: var(--lo); }

/* ─── ACCORDIONS — cluster style ────────────────────────────── */
.accordion {
  border: 1px solid var(--rule);
  border-radius: var(--r-lg);
  margin-bottom: 8px;
  overflow: hidden;
  background: var(--card);
}
.accordion:last-child { margin-bottom: 0; }
.accordion:hover { border-color: rgba(201,65,80,.15); }

.accordion-btn {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 14px 20px;
  background: transparent;
  border: none;
  text-align: left;
  cursor: pointer;
  font-family: var(--ff-sans);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--mid);
  transition: color .15s, background .15s;
  line-height: 1.3;
}
.accordion-btn:hover            { background: rgba(255,255,255,.025); color: var(--hi); }
.accordion-btn.open             { background: rgba(255,255,255,.025); border-bottom: 1px solid var(--rule); color: var(--hi); }
.accordion-chevron              { flex-shrink: 0; color: var(--lo); transition: transform .2s ease; }
.accordion-btn.open .accordion-chevron { transform: rotate(180deg); }
.accordion-body  { padding: 4px 0; display: none; }
.accordion-body.open { display: block; }

.acc-row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 11px 20px;
  border-bottom: 1px solid rgba(255,255,255,.04);
  font-size: 13px;
  font-weight: 300;
  line-height: 1.65;
  color: var(--mid);
}
.acc-row:last-child { border-bottom: none; }
.acc-icon { flex-shrink: 0; margin-top: 2px; }
.ck-pass { color: var(--sage-l); }
.ck-fail { color: var(--red); }
.ck-warn { color: var(--amber); }

.flag-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; margin-top: 6px; }
.flag-dot.on  { background: var(--amber); }
.flag-dot.off { background: var(--sage); }

/* AI blocks — action style */
/* ─── AI ASSESSMENT BLOCKS ───────────────────────────────────── */
.ai-block { padding: 14px 20px; border-bottom: 1px solid rgba(255,255,255,.04); }
.ai-block:last-child { border-bottom: none; }

/* Strengths / Concerns two-column grid */
.ai-strengths-concerns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.ai-sc-col {
  padding: 14px 20px;
}
.ai-sc-col-right {
  border-left: 1px solid rgba(255,255,255,.04);
}
.ai-list {
  padding-left: 18px;
  margin: 6px 0 0;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.85;
  color: var(--mid);
}
.ai-list li { margin-bottom: 4px; }
.item-criterion {
  display: inline-block;
  font-size: 9.5px;
  font-weight: 500;
  letter-spacing: .04em;
  padding: 1px 7px;
  border-radius: var(--r-f);
  background: var(--card2);
  border: 1px solid var(--rule);
  color: var(--lo);
  margin-left: 7px;
  white-space: nowrap;
  vertical-align: middle;
  position: relative;
  top: -1px;
}

/* Concern groups (red flags + other concerns) */
.ai-concern-group { margin-bottom: 8px; }
.ai-concern-group-hdr {
  font-size: 10px; font-weight: 700;
  letter-spacing: .08em; text-transform: uppercase;
  color: var(--red); margin: 8px 0 2px;
}
.ai-concern-other { color: var(--lo); }
.concern-flag { list-style: none; margin-left: -18px; padding-left: 0; }
.concern-flag-icon { margin-right: 4px; }

/* Pass-all notes in accordions */
.acc-all-pass {
  display: flex; align-items: center; gap: 8px;
  padding: 12px 20px; font-size: 13px; color: var(--sage-l);
}
.acc-pass-note {
  font-size: 11px; color: var(--lo);
  padding: 8px 20px; font-style: italic;
  border-top: 1px solid var(--rule);
}

@media (max-width: 600px) {
  .ai-strengths-concerns { grid-template-columns: 1fr; }
  .ai-sc-col-right { border-left: none; border-top: 1px solid rgba(255,255,255,.04); }
}

/* ─── CRITERIA REVIEW ────────────────────────────────────────── */
.crit-list { padding: 4px 0; }

.crit-row {
  padding: 13px 20px;
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.crit-row:last-child { border-bottom: none; }

.crit-row-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 5px;
}

.crit-name {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--hi);
  margin-bottom: 6px;
}
.crit-row-head .crit-name { margin-bottom: 0; }

/* High / Moderate / Low pill */
.crit-pill {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
  padding: 3px 10px;
  border-radius: var(--r-f);
  border: 1px solid transparent;
  flex-shrink: 0;
  text-transform: uppercase;
}
.crit-high     { color: var(--sage-l); background: var(--sage-dim);  border-color: var(--sage-bdr); }
.crit-moderate { color: var(--amber);  background: var(--amber-dim); border-color: var(--amber-bdr); }
.crit-low      { color: var(--red);    background: var(--red-dim);   border-color: var(--red-bdr); }

/* In Scope / Borderline / Out of Scope badge */
.crit-scope-wrap {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin-top: 6px;
}

.crit-scope-badge {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 12px;
  border-radius: var(--r);
  border: 1px solid transparent;
  flex-shrink: 0;
  min-width: 148px;
}
.crit-inscope   { background: var(--sage-dim);  border-color: var(--sage-bdr);  color: var(--sage-l); }
.crit-borderline { background: var(--slate-dim); border-color: var(--slate-bdr); color: var(--slate); }
.crit-outscope  { background: var(--red-dim);   border-color: var(--red-bdr);   color: var(--red); }

.crit-scope-icon {
  font-size: 13px;
  font-weight: 700;
  flex-shrink: 0;
  line-height: 1;
}
.crit-scope-labels { display: flex; flex-direction: column; gap: 1px; }
.crit-scope-rating {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  line-height: 1.2;
}
.crit-scope-sub {
  font-size: 10px;
  letter-spacing: .05em;
  text-transform: uppercase;
  opacity: .65;
  line-height: 1.2;
}

.crit-note {
  font-size: 12px;
  font-weight: 300;
  color: var(--mid);
  line-height: 1.7;
  padding-top: 1px;
}
.crit-sub-label {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--lo);
  flex-shrink: 0;
}

/* ─── CRITERIA KANBAN ────────────────────────────────────────── */
.crit-kanban {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  padding: 12px 16px 0;
}
.crit-kanban-cols-1 { grid-template-columns: 1fr; }
.crit-kanban-cols-2 { grid-template-columns: 1fr 1fr; }

.crit-kanban-col {
  border-radius: var(--r);
  border: 1px solid var(--rule);
  background: var(--bg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.crit-kanban-hdr {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: 8px 12px;
  display: flex;
  align-items: center;
  gap: 6px;
  border-bottom: 1px solid transparent;
}

.crit-kanban-count {
  margin-left: auto;
  font-size: 10px;
  font-weight: 400;
  opacity: .6;
}

.crit-col-inscope    .crit-kanban-hdr { color: var(--sage-l);  background: var(--sage-dim);  border-color: var(--sage-bdr); }
.crit-col-borderline .crit-kanban-hdr { color: var(--slate);   background: var(--slate-dim); border-color: var(--slate-bdr); }
.crit-col-outscope   .crit-kanban-hdr { color: var(--red);     background: var(--red-dim);   border-color: var(--red-bdr); }

.crit-card {
  padding: 10px 12px;
  border-bottom: 1px solid var(--rule);
  flex: 1;
}
.crit-card:last-child { border-bottom: none; }

.crit-card-name {
  font-size: 11px;
  font-weight: 600;
  color: var(--hi);
  margin-bottom: 3px;
  line-height: 1.3;
}
.crit-card-sub {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--lo);
  margin-bottom: 6px;
}
.crit-card-note {
  font-size: 12px;
  color: var(--mid);
  line-height: 1.65;
}

.crit-kanban-footer {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  padding: 10px 16px 14px;
}
.crit-footer-badge {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .04em;
  padding: 3px 10px;
  border-radius: var(--r-f);
  border: 1px solid transparent;
  opacity: .6;
}
.crit-footer-inscope    { color: var(--sage-l);  background: var(--sage-dim);  border-color: var(--sage-bdr); }
.crit-footer-borderline { color: var(--slate);   background: var(--slate-dim); border-color: var(--slate-bdr); }
.crit-footer-outscope   { color: var(--red);     background: var(--red-dim);   border-color: var(--red-bdr); }

.crit-other { padding: 0 16px 12px; }
.crit-other-hdr {
  font-size: 10px; font-weight: 600;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--lo);
  padding: 12px 4px 8px;
  border-top: 1px solid var(--rule);
  margin-top: 4px;
}

@media (max-width: 640px) {
  .crit-kanban,
  .crit-kanban-cols-2 { grid-template-columns: 1fr; }
}


.ai-label {
  font-size: 10px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .14em;
  color: var(--lo);
  margin-bottom: 7px;
}
.ai-content { font-size: 13px; font-weight: 300; line-height: 1.85; color: var(--mid); }
.ai-content ul { padding-left: 18px; }
.ai-content li { margin-bottom: 5px; }

/* ─── UPLOAD ZONE ────────────────────────────────────────────── */
.upload-zone {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  border: 1px dashed rgba(201,65,80,.3);
  border-radius: var(--r-xl);
  background: var(--gdim);
  padding: 44px 48px;
  max-width: 480px;
  width: 100%;
  gap: 12px;
  transition: border-color .15s, background .15s;
  cursor: pointer;
}
.upload-zone.drag-over {
  border-color: var(--gl);
  background: rgba(201,65,80,.14);
}
.upload-zone-icon {
  width: 52px; height: 52px;
  border-radius: var(--r-lg);
  background: rgba(201,65,80,.08);
  border: 1px solid rgba(201,65,80,.2);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gl);
  margin-bottom: 4px;
}
.upload-zone-title {
  font-family: var(--ff-serif);
  font-size: 18px;
  font-weight: 400;
  font-style: italic;
  color: var(--hi);
}
.upload-zone-sub { font-size: 12px; font-weight: 300; color: var(--lo); line-height: 1.75; max-width: 300px; }

/* Or divider */
.or-divider {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%;
  max-width: 480px;
  color: var(--lo);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.or-divider::before, .or-divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--rule);
}

/* Paste card */
.paste-card {
  background: var(--card);
  border: 1px solid var(--rule);
  border-radius: var(--r-lg);
  padding: 22px;
  width: 100%;
  max-width: 480px;
}

/* ─── TOPNAV EXPORT ──────────────────────────────────────────── */
#top-actions .btn-secondary {
  background: transparent;
  border-color: var(--rule);
  color: var(--lo);
  font-size: 10px;
}
#top-actions .btn-secondary:hover {
  background: var(--card);
  color: var(--mid);
  border-color: rgba(255,255,255,.12);
}

/* ═══════════════════════════════════════════════════════════════
   PASSWORD GATE
═══════════════════════════════════════════════════════════════ */
#gate {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  font-family: var(--ff-sans);
}

.gate-left {
  width: 480px;
  flex-shrink: 0;
  background: var(--bg2);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 60px 52px;
  z-index: 2;
  border-right: 1px solid var(--rule);
}
.gate-card { width: 100%; display: flex; flex-direction: column; }
.gate-logo { margin-bottom: 40px; }
.gate-logo-mark {
  width: 44px; height: 44px;
  border-radius: 10px;
  border: 1px solid rgba(201,65,80,.35);
  background: linear-gradient(135deg, rgba(201,65,80,.14), rgba(201,65,80,.06));
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--ff-serif);
  font-size: 22px;
  font-weight: 400;
  color: var(--g);
}
.gate-eyebrow {
  font-size: 10px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .2em;
  color: var(--g);
  margin-bottom: 12px;
}
.gate-title {
  font-family: var(--ff-serif);
  font-size: 38px;
  font-weight: 400;
  color: var(--hi);
  line-height: 1.1;
  margin-bottom: 18px;
  letter-spacing: -.02em;
}
.gate-sub {
  font-size: 13px;
  font-weight: 300;
  color: var(--mid);
  line-height: 1.85;
  margin-bottom: 38px;
  padding-left: 18px;
  border-left: 2px solid rgba(201,65,80,.25);
}

.gate-form  { display: flex; flex-direction: column; gap: 12px; }
.gate-field { display: flex; flex-direction: column; gap: 6px; }
.gate-field label {
  font-size: 10px;
  font-weight: 500;
  color: var(--lo);
  letter-spacing: .14em;
  text-transform: uppercase;
}
.gate-field input {
  width: 100%;
  padding: 12px 15px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: var(--r);
  font-size: 14px;
  font-weight: 300;
  color: var(--hi);
  font-family: var(--ff-sans);
  transition: border-color .15s, box-shadow .15s;
}
.gate-field input::placeholder { color: var(--lo); }
.gate-field input:focus {
  outline: none;
  border-color: rgba(201,65,80,.45);
  box-shadow: 0 0 0 3px rgba(201,65,80,.08);
}
.gate-error {
  font-size: 13px;
  font-weight: 300;
  color: var(--red);
  background: var(--red-dim);
  border: 1px solid var(--red-bdr);
  border-radius: var(--r);
  padding: 10px 14px;
  line-height: 1.55;
}
.gate-submit {
  width: 100%;
  padding: 13px;
  background: var(--g);
  color: var(--bg);
  font-family: var(--ff-sans);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  border: none;
  border-radius: var(--r);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition: background .15s, opacity .15s;
  margin-top: 4px;
}
.gate-submit:hover    { background: var(--gl); }
.gate-submit:disabled { opacity: .4; cursor: not-allowed; }
.gate-spinner {
  width: 13px; height: 13px;
  border: 1.5px solid rgba(15,8,9,.25);
  border-top-color: var(--bg);
  border-radius: 50%;
  animation: spin .65s linear infinite;
  flex-shrink: 0;
}
.gate-footer         { margin-top: 44px; display: flex; flex-direction: column; gap: 14px; }
.gate-footer-divider { height: 1px; background: var(--rule); }
.gate-footer-text    { font-size: 10px; font-weight: 400; color: var(--lo); letter-spacing: .1em; text-transform: uppercase; }

.gate-right { flex: 1; position: relative; overflow: hidden; background: var(--bg2); }
.gate-right-img {
  position: absolute; inset: 0;
  background-image: url('https://images.unsplash.com/photo-1584515933487-779824d29309?w=1400&q=85&fit=crop');
  background-size: cover;
  background-position: center;
  filter: grayscale(60%) brightness(.35) hue-rotate(-10deg);
  opacity: .9;
}
.gate-right-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to right, rgba(19,11,13,.95) 0%, rgba(19,11,13,.4) 45%, transparent 100%);
}
.gate-right-quote  { position: absolute; bottom: 52px; left: 52px; right: 52px; z-index: 2; }
.gate-right-quote-text {
  font-family: var(--ff-serif);
  font-size: 17px;
  font-weight: 400;
  font-style: italic;
  color: rgba(240,237,232,.6);
  line-height: 1.75;
  margin-bottom: 14px;
  max-width: 380px;
  padding-left: 18px;
  border-left: 2px solid rgba(201,65,80,.3);
}
.gate-right-quote-attr {
  font-size: 10px;
  font-weight: 500;
  color: var(--lo);
  letter-spacing: .16em;
  text-transform: uppercase;
  padding-left: 20px;
}

#gate.fade-out { opacity: 0; pointer-events: none; transition: opacity .45s ease; }

/* ─── HOME PAGE ──────────────────────────────────────────────── */
#p-home.active { display: flex; flex-direction: column; overflow-y: auto; }

.home-hero {
  flex: 1;
  display: flex;
  align-items: stretch;
  gap: 52px;
  padding: 52px 60px 52px 64px;
  position: relative;
  overflow: hidden;
  min-height: calc(100vh - 40px);
}

/* Background: radial crimson glow */
.home-bg-gradient {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 55% 70% at 85% 40%, rgba(201,65,80,.10) 0%, transparent 65%),
    radial-gradient(ellipse 30% 50% at 90% 80%, rgba(201,65,80,.06) 0%, transparent 60%);
  pointer-events: none;
}

/* Background: faint ECG line */
.home-bg-ecg {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 160px;
  opacity: .055;
  pointer-events: none;
}
.home-ecg-path {
  fill: none;
  stroke: var(--g);
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Background: large faded monogram */
.home-bg-monogram {
  position: absolute;
  right: -40px;
  top: 50%;
  transform: translateY(-55%);
  font-family: var(--ff-serif);
  font-size: clamp(260px, 30vw, 420px);
  font-weight: 400;
  color: var(--g);
  opacity: .03;
  pointer-events: none;
  line-height: 1;
  user-select: none;
}

.home-eyebrow {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--g);
  margin-bottom: 18px;
  display: flex;
  align-items: center;
  gap: 14px;
}
.home-eyebrow::before {
  content: '';
  width: 28px; height: 1px;
  background: var(--g); opacity: .6;
}

.home-title {
  font-family: var(--ff-serif);
  font-size: clamp(30px, 3.5vw, 52px);
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -.02em;
  color: var(--hi);
  margin-bottom: 16px;
}

.home-cycle-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 32px;
  flex-wrap: wrap;
}
.home-meta-sub { font-size: 12px; color: var(--lo); }

.home-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

/* Left column */
.home-left {
  flex: 1;
  min-width: 0;
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* Right column */
.home-right {
  width: 46%;
  flex-shrink: 0;
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 12px;
  justify-content: center;
}
.home-right-empty { justify-content: center; align-items: center; }

/* Verdict strip */
.home-verdict-strip {
  display: flex;
  border-radius: var(--r-xl);
  overflow: hidden;
  border: 1px solid var(--rule);
}
.home-verdict-block {
  flex: 1;
  padding: 28px 16px 20px;
  text-align: center;
  border-right: 1px solid var(--rule);
}
.home-verdict-block:last-child { border-right: none; }
.home-verdict-num {
  font-family: var(--ff-serif);
  font-size: 52px;
  font-weight: 400;
  line-height: 1;
  margin-bottom: 8px;
}
.home-verdict-label {
  font-size: 10px; font-weight: 600;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--lo);
}
.hv-eligible   { background: var(--sage-dim); }
.hv-eligible   .home-verdict-num { color: var(--sage-l); }
.hv-unclear    { background: var(--slate-dim); }
.hv-unclear    .home-verdict-num { color: var(--slate); }
.hv-ineligible { background: var(--red-dim); }
.hv-ineligible .home-verdict-num { color: var(--red); }

/* Meta cards row */
.home-meta-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
.home-meta-card {
  background: var(--card);
  border: 1px solid var(--rule);
  border-radius: var(--r-lg);
  padding: 16px;
  text-align: center;
  transition: background .12s, border-color .12s;
}
.home-meta-card:hover { background: var(--card2); border-color: rgba(255,255,255,.12); }
.home-meta-card-amber { border-color: var(--amber-bdr); background: var(--amber-dim); }
.home-meta-card-sage  { border-color: var(--sage-bdr);  background: var(--sage-dim); }
.home-meta-num {
  font-family: var(--ff-serif);
  font-size: 30px; font-weight: 400;
  color: var(--hi); line-height: 1;
  margin-bottom: 5px;
}
.home-meta-label {
  font-size: 11px; font-weight: 600;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--lo);
}

/* Distribution bar */
.home-dist-bar {
  display: flex;
  height: 10px;
  border-radius: var(--r-f);
  overflow: hidden;
  background: var(--card2);
}
.home-dist-seg { height: 100%; transition: width .4s ease; }
.hds-eligible   { background: var(--sage); }
.hds-unclear    { background: var(--slate); }
.hds-ineligible { background: var(--red); }
.home-dist-legend {
  display: flex;
  gap: 16px;
  font-size: 10px;
  color: var(--lo);
  margin-top: 6px;
}
.home-dist-legend span { display: flex; align-items: center; gap: 5px; }
.home-dist-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }

/* Bottom row: two split cards */
.home-bottom-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.home-split-card {
  background: var(--card);
  border: 1px solid var(--rule);
  border-radius: var(--r-lg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.home-split-section {
  padding: 16px 18px;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
  transition: background .12s;
}
.home-split-section[style*="cursor:pointer"]:hover { background: rgba(255,255,255,.025); }

.home-split-divider { height: 1px; background: var(--rule); flex-shrink: 0; }

.home-split-eyebrow {
  font-size: 10px; font-weight: 600;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--lo);
  display: flex; align-items: center; gap: 8px;
}

.home-split-num {
  font-family: var(--ff-serif);
  font-size: 52px; font-weight: 400;
  color: var(--hi); line-height: 1;
}
.home-split-unit {
  font-size: 28px; color: var(--lo); margin-left: 2px;
}
.home-split-sub  { font-size: 12px; color: var(--lo); }

/* Needs attention */
.home-attention-badge {
  font-family: var(--ff-sans);
  font-size: 11px; font-weight: 700;
  background: var(--red-dim); color: var(--red);
  border: 1px solid var(--red-bdr);
  border-radius: var(--r-f);
  padding: 1px 8px;
  letter-spacing: 0;
  text-transform: none;
}
.home-split-detail {
  display: flex; flex-direction: column; gap: 4px;
  font-size: 12px; color: var(--mid);
}

/* Board review — decisions and comments */
.home-rev-summary { font-weight: 400; color: var(--lo); text-transform: none; letter-spacing: 0; font-size: 11px; margin-left: auto; }
.home-rev-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--rule); flex-shrink: 0; }
.home-rev-dot.hbd-decision { background: var(--sage); }
.home-rev-dot.hbd-comment  { background: var(--slate); }

.home-board-stats { display: flex; align-items: flex-start; gap: 22px; }
.home-board-stat  { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.home-board-stat-num {
  font-family: var(--ff-serif);
  font-size: 30px; font-weight: 400;
  color: var(--hi); line-height: 1;
}
.home-board-stat-label {
  font-size: 12px; color: var(--mid);
  white-space: nowrap;
}
.home-board-stat-sub {
  font-size: 10px; color: var(--lo);
  white-space: nowrap;
}

.home-board-feed  { display: flex; flex-direction: column; gap: 8px; }
.home-board-event { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: var(--mid); }
.home-board-event .home-rev-dot { margin-top: 5px; }
.home-board-event-body { flex: 1; min-width: 0; }
.home-board-event-text {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.home-board-event-text strong { color: var(--hi); font-weight: 500; }
.home-board-event-meta {
  font-size: 10px; color: var(--lo);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* Cycle health bar */
.home-health-bar-wrap {
  height: 8px; border-radius: var(--r-f);
  background: var(--card2); border: 1px solid var(--rule);
  overflow: hidden;
}
.home-health-bar { height: 100%; border-radius: var(--r-f); transition: width .4s ease; }
.home-health-label { font-size: 13px; font-weight: 500; }

/* Empty right state */
.home-empty-right {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  border: 1px dashed var(--rule);
  border-radius: var(--r-xl);
  padding: 48px 32px;
  text-align: center;
  color: var(--lo);
}
.home-empty-right svg { opacity: .15; }
.home-empty-right p { font-size: 13px; max-width: 220px; line-height: 1.6; }

/* Mobile */
@media (max-width: 860px) {
  .home-hero { flex-direction: column; align-items: flex-start; gap: 32px; padding: 40px 24px; }
  .home-right { width: 100%; }
  .home-bg-monogram { font-size: 160px; right: -20px; opacity: .025; }
  .home-verdict-num { font-size: 36px; }
}

/* Light mode */
@media (prefers-color-scheme: light) {
  .home-meta-card:hover { background: var(--bg2); border-color: rgba(0,0,0,.15); }
}

/* ─── UNIFIED UPLOAD PAGE ────────────────────────────────────── */
#p-single.active { display: flex; flex-direction: column; }

.upload-page {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 48px 40px;
  min-height: 100%;
}

.upload-page-ready {
  align-items: flex-start;
  padding-top: 60px;
}

/* Idle state */
.upload-idle-wrap {
  width: 100%;
  max-width: 540px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
}

.upload-idle-head {
  text-align: center;
  margin-bottom: 32px;
}

.upload-title {
  font-family: var(--ff-serif);
  font-size: clamp(32px, 5vw, 56px);
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -.02em;
  margin-top: 14px;
}

/* Batch / Compose toggle */
.upload-mode-toggle {
  display: flex;
  background: var(--card);
  border: 1px solid var(--rule);
  border-radius: var(--r-f);
  padding: 3px;
  gap: 2px;
  margin-bottom: 20px;
  align-self: center;
}
.upload-mode-btn {
  flex: 1;
  padding: 6px 22px;
  border-radius: calc(var(--r-f) - 2px);
  border: none;
  background: transparent;
  font-family: var(--ff-sans);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .05em;
  color: var(--lo);
  cursor: pointer;
  transition: background .15s, color .15s;
  white-space: nowrap;
}
.upload-mode-btn.active { background: var(--g); color: #fff; font-weight: 600; }

/* Compose char count */
.compose-chars { font-size: 11px; color: var(--lo); text-align: center; padding: 4px 0 2px; }
.compose-chars-warn { color: var(--amber); }

.upload-drop-zone {
  width: 100%;
  border: 1.5px dashed rgba(201,65,80,.25);
  border-radius: var(--r-xl);
  padding: 44px 32px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  text-align: center;
  transition: border-color .2s, background .2s;
  background: var(--card);
}
.upload-drop-zone.drag-over {
  border-color: var(--g);
  background: var(--gdim);
}
.upload-drop-icon  { color: var(--g); opacity: .75; margin-bottom: 4px; }
.upload-drop-title { font-size: 15px; font-weight: 400; color: var(--hi); }
.upload-drop-hint  { font-size: 12px; color: var(--mid); }
.upload-drop-hints {
  display: flex;
  align-items: center;
  gap: 0;
  font-size: 12px;
  color: var(--mid);
  flex-wrap: wrap;
  justify-content: center;
}
.upload-hint-sep { color: var(--lo); }
/* What belongs in an application, below the line explaining how files
   are grouped — content guidance, distinct from the format list. */
.upload-drop-kinds {
  margin-top: 5px;
  font-size: 11px;
  line-height: 1.45;
  color: var(--lo);
  max-width: 46ch;
  text-wrap: balance;
}
.upload-formats {
  font-size: 10px;
  letter-spacing: .1em;
  color: var(--lo);
  margin-top: 8px;
}

/* ─── SYNC NOTIFICATION BANNER ──────────────────────────────── */
#sync-notification { flex-shrink: 0; }
.sync-notif {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 16px;
  background: var(--amber-dim);
  border-bottom: 1px solid var(--amber-bdr);
  font-size: 12px;
  color: var(--amber);
  animation: sync-slide-in .2s ease;
}
@keyframes sync-slide-in {
  from { transform: translateY(-100%); opacity: 0; }
  to   { transform: translateY(0);     opacity: 1; }
}
.sync-notif-icon { flex-shrink: 0; font-size: 14px; }
.sync-notif-msg  { flex: 1; line-height: 1.5; }
.sync-notif-close {
  background: none; border: none; cursor: pointer;
  color: var(--amber); font-size: 14px; padding: 2px 4px;
  opacity: .7; flex-shrink: 0;
}
.sync-notif-close:hover { opacity: 1; }

/* ─── SCREENING ERROR ────────────────────────────────────────── */
.screen-error-overlay {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(10, 5, 6, .62);
  backdrop-filter: blur(3px);
  animation: fadeUp .18s ease;
}
.screen-error-modal {
  position: relative;
  width: 100%;
  max-width: 440px;
  max-height: calc(100vh - 48px);
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  padding: 30px 28px 24px;
  background: var(--card);
  border: 1px solid var(--red-bdr);
  border-radius: var(--r-lg);
  box-shadow: 0 22px 60px rgba(0, 0, 0, .45);
  text-align: center;
  animation: fadeSlideIn .2s ease;
}
.screen-error-close {
  position: absolute;
  top: 10px; right: 10px;
  display: flex; align-items: center; justify-content: center;
  width: 26px; height: 26px;
  padding: 0;
  background: none;
  border: none;
  border-radius: var(--r-sm);
  color: var(--lo);
  cursor: pointer;
  opacity: .7;
}
.screen-error-close:hover { opacity: 1; color: var(--hi); background: var(--card2); }
.screen-error-icon {
  display: flex; align-items: center; justify-content: center;
  width: 40px; height: 40px;
  flex-shrink: 0;
  border-radius: var(--r-f);
  background: var(--red-dim);
  border: 1px solid var(--red-bdr);
  color: var(--red);
}
.screen-error-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 100%;
}
.screen-error-title {
  font-family: var(--ff-serif);
  font-size: 21px;
  font-weight: 400;
  color: var(--hi);
}
.screen-error-detail {
  font-size: 13px;
  color: var(--mid);
  line-height: 1.7;
  overflow-wrap: anywhere;
}
.screen-error-ctx {
  font-size: 11px;
  color: var(--lo);
  background: var(--card2);
  border: 1px solid var(--rule);
  border-radius: var(--r);
  padding: 6px 12px;
  text-align: left;
  overflow-wrap: anywhere;
}
.screen-error-ctx strong { color: var(--mid); font-weight: 500; }
.screen-error-tech {
  text-align: left;
  margin-top: 2px;
}
.screen-error-tech summary {
  font-size: 11px;
  color: var(--lo);
  cursor: pointer;
  user-select: none;
  padding: 4px 0;
}
.screen-error-tech summary:hover { color: var(--mid); }
.screen-error-tech code {
  display: block;
  max-height: 160px;
  overflow-y: auto;
  font-size: 10.5px;
  color: var(--mid);
  background: var(--card2);
  border: 1px solid var(--rule);
  border-radius: var(--r);
  padding: 8px 12px;
  margin-top: 6px;
  word-break: break-word;
  overflow-wrap: anywhere;
  line-height: 1.6;
}
/* A result rebuilt from a response that stopped before closing its JSON. */
.recovered-note {
  background: var(--amber-dim);
  border: 1px solid var(--amber-bdr);
  color: var(--amber);
  border-radius: var(--r);
  padding: 8px 12px;
  margin-bottom: 14px;
  font-size: 11.5px;
  line-height: 1.5;
}

/* Stored unparseable model output, shown on an errored application in
   /results/details. Collapsed by default: the failure message above it is the
   headline, this is the evidence. */
.raw-response {
  max-width: 720px;
  margin: 0 auto 24px;
  text-align: left;
}
.raw-response-summary {
  font-size: 11.5px;
  color: var(--lo);
  cursor: pointer;
  user-select: none;
  padding: 4px 0;
}
.raw-response-summary:hover { color: var(--mid); }
.raw-response-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 6px;
}
.raw-response-body {
  display: block;
  max-height: 420px;
  overflow: auto;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11px;
  color: var(--mid);
  background: var(--card2);
  border: 1px solid var(--rule);
  border-radius: var(--r);
  padding: 10px 14px;
  margin: 6px 0 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  line-height: 1.55;
}

/* The model's own output when it could not be parsed — pre-wrapped rather
   than word-broken like .screen-error-tech code, since it is usually JSON and
   its line structure is the point. */
.screen-error-raw {
  display: block;
  max-height: 220px;
  overflow: auto;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 10.5px;
  color: var(--mid);
  background: var(--card2);
  border: 1px solid var(--rule);
  border-radius: var(--r);
  padding: 8px 12px;
  margin: 6px 0 0;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  line-height: 1.55;
  text-align: left;
}
.screen-error-raw-actions {
  display: flex;
  gap: 6px;
  margin-top: 6px;
}
.screen-error-raw-note {
  font-size: 10.5px;
  color: var(--lo);
  margin-top: 6px;
  line-height: 1.5;
}
.screen-error-actions {
  display: flex;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 2px;
}

/* Model picker — laid out by .screen-models in the shared run bar */
.model-btn {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 10px 14px;
  border: 1px solid var(--rule);
  border-radius: var(--r);
  background: var(--card);
  cursor: pointer;
  transition: border-color .15s, background .15s;
  font-family: var(--ff-sans);
  gap: 2px;
}
.model-btn:hover { background: var(--card2); border-color: rgba(255,255,255,.12); }
.model-btn.active { border-color: var(--g); background: var(--gdim); }
.model-btn-name {
  font-size: 12px; font-weight: 600; color: var(--mid);
  display: flex; align-items: center; gap: 6px;
}
.model-btn.active .model-btn-name { color: var(--gl); }
.model-btn-sub { font-size: 10px; color: var(--lo); }
.model-badge {
  font-size: 9px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  background: var(--gdim); color: var(--g);
  border: 1px solid rgba(201,65,80,.2);
  border-radius: var(--r-f); padding: 1px 6px;
}
.model-btn.active .model-badge { background: var(--g); color: #fff; border-color: transparent; }

/* Paste link */
.upload-paste-link {
  background: none;
  border: none;
  font-family: var(--ff-sans);
  font-size: 12px;
  font-weight: 400;
  color: var(--lo);
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: rgba(255,255,255,.15);
  margin-top: 6px;
  padding: 4px 0;
  transition: color .15s;
}
.upload-paste-link:hover { color: var(--mid); }

/* Steps section */
.upload-steps {
  width: 100%;
  margin-top: 36px;
  border-top: 1px solid var(--rule);
  padding-top: 24px;
}
.upload-steps-label {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--lo);
  text-align: center;
  margin-bottom: 16px;
}
.upload-steps-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  flex-wrap: wrap;
}
.upload-step {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 500;
  color: var(--mid);
  background: var(--card);
  border: 1px solid var(--rule);
  border-radius: var(--r);
  padding: 7px 14px;
}
.upload-step svg { color: var(--lo); flex-shrink: 0; }
.upload-step-arrow {
  font-size: 12px;
  color: var(--lo);
  opacity: .4;
}

/* Paste full-screen mode */
.upload-paste-mode .upload-ready-wrap { max-width: 760px; }
.upload-paste-eyebrow {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--g);
}
.upload-paste-title {
  font-family: var(--ff-serif);
  font-size: 28px;
  font-weight: 400;
  color: var(--hi);
  margin: 4px 0 16px;
  letter-spacing: -.01em;
}
.upload-paste-textarea {
  min-height: 340px;
  resize: vertical;
}

/* Paste area (legacy idle) */
/* Compose mode layout */
.upload-compose-wrap { max-width: 600px; }

/* ─── SHARED WIDE SCREEN LAYOUT (compose, batch, single, paste) ─ */
.upload-page-compose {
  align-items: flex-start;
  justify-content: flex-start;
  padding: 32px 40px;
}
.compose-layout {
  width: 100%;
  max-width: 900px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  flex: 1;
}
/* Batch queue only: a card grid earns the extra width, where the
   text-editing views need a readable measure. */
.compose-layout-wide {
  max-width: 1440px;
  gap: 18px;
}
.compose-hdr {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  flex-shrink: 0;
}

/* Single-file / paste title */
.screen-file-title {
  font-family: var(--ff-serif);
  font-size: clamp(20px, 2.8vw, 34px);
  font-weight: 400;
  margin: 4px 0 0;
  line-height: 1.1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.screen-file-meta {
  font-size: 12px;
  color: var(--lo);
  margin-top: 3px;
}
.rescore-eyebrow-tag {
  color: var(--amber);
  font-weight: 500;
}

/* Batch: invert column proportions — file list is the primary content */
.compose-cols-batch .compose-col-left {
  flex: 1;
  width: auto;
  min-width: 0;
}
.compose-cols-batch .compose-col-right {
  width: 220px;
  min-width: 200px;
  flex: none;
}

/* Idle screen */
.idle-drop-col {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.idle-drop-zone {
  flex: 1;
  min-height: 260px;
}
.idle-steps-col {
  flex: none !important;
  width: 240px !important;
  min-width: 220px !important;
}
.idle-steps {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--rule);
  border-radius: var(--r);
  overflow: hidden;
}
.idle-step {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--rule);
}
.idle-step:last-child { border-bottom: none; }
.idle-step-icon {
  width: 22px;
  height: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--g);
  flex-shrink: 0;
  margin-top: 1px;
}
.idle-step-name {
  font-size: 12px;
  font-weight: 500;
  color: var(--hi);
  margin-bottom: 2px;
}
.idle-step-desc {
  font-size: 11px;
  color: var(--lo);
  line-height: 1.4;
}

.compose-cols {
  display: flex;
  gap: 16px;
  align-items: stretch;
  /* flex:1 so a nested textarea still fills the shell's height — it used
     to be a direct child of .compose-layout and inherit that growth. */
  flex: 1;
  min-height: 380px;
}
.compose-col-left {
  width: 260px;
  min-width: 220px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.compose-col-right {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.compose-col-hdr {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--lo);
  padding-bottom: 2px;
}
.compose-col-checks {
  flex: none;
  width: 220px;
  min-width: 200px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.compose-drop {
  padding: 12px 14px;
  flex-direction: row;
  gap: 8px;
  flex-shrink: 0;
}
.compose-file-list {
  flex: 1;
  overflow-y: auto;
  min-height: 0;
}
.compose-files-empty {
  flex: 1;
  font-size: 11.5px;
  color: var(--lo);
  line-height: 1.6;
  padding: 6px 2px;
  font-style: italic;
}
/* The text column in the paste / single / re-screen views. Capped so a
   wide window gives the checks panel room instead of stretching lines
   of application text to an unreadable measure. */
.compose-col-text {
  flex: 1;
  min-width: 0;
  max-width: 940px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.compose-textarea {
  flex: 1;
  min-height: 160px;
  resize: none;
  font-size: 13px;
}
.compose-bottom {
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex-shrink: 0;
}

/* Columns collapse in two steps rather than one: the checks panel is
   context, so it goes first and the working columns keep their width
   down to the phone breakpoint. */
.compose-cols { flex-wrap: wrap; }
@media (max-width: 1100px) {
  .compose-cols { min-height: 0; }
  .compose-col-checks { width: 100%; min-width: 0; }
  .compose-col-text { max-width: none; }
}
@media (max-width: 760px) {
  .compose-cols { flex-direction: column; min-height: auto; }
  .compose-col-left { width: 100%; min-width: 0; }
}
@media (max-width: 640px) {
  .upload-page-compose { padding: 20px 16px; }
  .compose-textarea { min-height: 140px; }
}
.upload-drop-zone-compact {
  padding: 18px 24px;
  flex-direction: row;
  justify-content: center;
  gap: 10px;
}
.upload-drop-zone-compact .upload-drop-icon { margin-bottom: 0; }
.upload-drop-zone-compact .upload-formats { margin-top: 0; }
.compose-divider {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 8px 0;
  color: var(--lo);
  font-size: 11px;
}
.compose-divider::before,
.compose-divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--rule);
}

.upload-paste-area {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* Ready states */
.upload-ready-wrap {
  width: 100%;
  max-width: 640px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.upload-ready-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.upload-ready-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--mid);
  background: var(--card2);
  border: 1px solid var(--rule);
  border-radius: var(--r-f);
  padding: 5px 14px;
}

.upload-batch-count {
  font-size: 14px;
  font-weight: 500;
  color: var(--hi);
}

.upload-single-textarea { min-height: 260px; resize: vertical; }

/* Compact file list (compose sources) */
.batch-compact-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  background: var(--card);
  border-radius: var(--r);
  border: 1px solid var(--rule);
}

.batch-compact-name {
  flex: 1;
  font-size: 13px;
  color: var(--hi);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.batch-compact-meta {
  font-size: 11px;
  color: var(--lo);
  flex-shrink: 0;
}

.trunc-badge { color: var(--amber); }

/* ─── BATCH QUEUE (/screen, batch-ready) ─────────────────────────
   A responsive grid of dossier cards. A folder-grouped application
   lists its documents against a crimson spine, so "these separate
   files are one application" is visible rather than implied. */

.bq-toolbar {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px 20px;
  flex-wrap: wrap;
  flex-shrink: 0;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--rule);
}
.bq-tally {
  font-size: 12px;
  color: var(--lo);
  letter-spacing: .01em;
}
.bq-tally-n {
  font-family: var(--ff-serif);
  font-size: 17px;
  color: var(--hi);
  margin-right: 1px;
}
.bq-tally-sep { color: var(--rule); margin: 0 7px; }
.bq-tally-warn {
  color: var(--amber);
  margin-left: 10px;
  padding-left: 10px;
  border-left: 1px solid var(--amber-bdr);
}
.bq-toolbar-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.bq-toolbar-actions label { cursor: pointer; }

/* Drop target spans the whole grid, so added files need no aiming */
.bq-region {
  flex: 1;
  min-height: 0;
  border-radius: var(--r-lg);
  border: 1.5px dashed transparent;
  margin: 0 -10px;
  padding: 14px 10px;
  transition: border-color .18s, background .18s;
}
.bq-region-over {
  border-color: var(--g);
  background: var(--gdim);
}

.bq-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
  gap: 12px;
  align-content: start;
}

.bq-card {
  display: flex;
  flex-direction: column;
  gap: 9px;
  padding: 15px 16px 14px;
  background: var(--card);
  border: 1px solid var(--rule);
  border-radius: var(--r-lg);
  min-width: 0;
}
.bq-card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}
.bq-card-name {
  font-family: var(--ff-serif);
  font-size: 17px;
  font-weight: 400;
  line-height: 1.25;
  color: var(--hi);
  margin: 0;
  min-width: 0;
  overflow-wrap: anywhere;
}
.bq-card-del { flex-shrink: 0; opacity: .45; transition: opacity .15s; }
.bq-card:hover .bq-card-del,
.bq-card-del:focus-visible { opacity: 1; }

.bq-card-kind {
  font-size: 9.5px;
  font-weight: 600;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--lo);
}

/* The spine: brackets a folder's documents into one application */
.bq-manifest {
  list-style: none;
  margin: 0;
  padding: 1px 0 1px 11px;
  border-left: 1.5px solid rgba(201,65,80,.35);
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.bq-doc {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  font-size: 11.5px;
  min-width: 0;
}
.bq-doc-name {
  flex: 1;
  color: var(--mid);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}
.bq-doc-size {
  color: var(--lo);
  font-size: 10.5px;
  font-variant-numeric: tabular-nums;
  flex-shrink: 0;
}
.bq-doc-empty .bq-doc-name,
.bq-doc-empty .bq-doc-size { color: var(--amber); }

.bq-card-foot {
  margin-top: auto;
  padding-top: 3px;
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
  font-size: 11px;
  color: var(--lo);
  font-variant-numeric: tabular-nums;
}
.bq-card-foot-warn { color: var(--amber); }

/* Ghost cell: always-present add affordance inside the grid */
.bq-add {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  min-height: 116px;
  padding: 18px 16px;
  text-align: center;
  cursor: pointer;
  border: 1.5px dashed rgba(201,65,80,.28);
  border-radius: var(--r-lg);
  color: var(--lo);
  background: transparent;
  transition: border-color .15s, background .15s, color .15s;
}
.bq-add:hover { border-color: var(--g); background: var(--gdim); color: var(--mid); }
.bq-add svg { color: var(--g); opacity: .7; margin-bottom: 3px; }
/* Three steps of hierarchy: the action, what belongs here, then how
   folders behave — so the cell reads in that order rather than as a block. */
.bq-add-title { font-size: 12.5px; color: var(--mid); }
.bq-add-sub {
  font-size: 11px;
  line-height: 1.45;
  max-width: 31ch;
  text-wrap: balance;
}
.bq-add-note {
  margin-top: 7px;
  padding-top: 7px;
  border-top: 1px solid var(--rule);
  font-size: 10px;
  line-height: 1.4;
  color: var(--lo);
  opacity: .8;
  max-width: 30ch;
  text-wrap: balance;
}

/* ── Card editing ─────────────────────────────────────────────── */
/* A lone document has nothing to bracket, so it shows without the spine */
.bq-manifest-flat {
  border-left-color: transparent;
  padding-left: 0;
}
/* Always editable, but quiet: reads as the card's title until you reach
   for it, so the grid stays a list of applications rather than a form. */
.bq-card-name-input {
  flex: 1;
  min-width: 0;
  font-family: var(--ff-serif);
  font-size: 16.5px;
  line-height: 1.25;
  padding: 3px 6px;
  margin-left: -6px;
  background: transparent;
  border-color: transparent;
}
.bq-card-name-input:hover { border-color: var(--rule); }
.bq-card-name-input:focus {
  background: var(--bg2);
  border-color: var(--g);
}
.bq-doc-del { flex-shrink: 0; opacity: .5; }
.bq-doc-del:hover, .bq-doc-del:focus-visible { opacity: 1; color: var(--g); }

.bq-card-edit {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  padding-top: 9px;
  border-top: 1px solid var(--rule);
}
.bq-card-edit label { cursor: pointer; }
/* Route into the full text editor, alongside "Add documents". Sits inline
   rather than pushed right: with a Split control too, a right-aligned link
   would strand itself on its own line when the row wraps. */
.bq-card-textlink {
  padding: 0 2px;
  background: none;
  border: none;
  font-family: var(--ff-sans);
  font-size: 11px;
  color: var(--lo);
  cursor: pointer;
  transition: color .15s;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.bq-card-textlink:hover { color: var(--g); }

/* Breadcrumb back to the queue, as /config uses for its editor */
.bq-crumb {
  padding: 0;
  background: none;
  border: none;
  font-family: var(--ff-sans);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--lo);
  cursor: pointer;
  transition: color .15s;
}
.bq-crumb:hover { color: var(--g); }
.bq-title-input {
  font-family: var(--ff-serif);
  font-size: clamp(19px, 2.6vw, 30px);
  font-weight: 400;
  padding: 4px 10px;
  margin: 5px 0 0;
  width: 100%;
  max-width: 620px;
}

@media (max-width: 700px) {
  .bq-toolbar-actions { width: 100%; }
  .bq-region { margin: 0; padding: 12px 0; }
}
@media (hover: none) {
  .bq-card-del { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .bq-region, .bq-add, .bq-card-del, .bq-card-textlink { transition: none; }
}

/* ─── SHARED RUN BAR (RunBar.svelte, every screening view) ────────
   Model choice + the run action, in the same place in every view. */
.screen-runbar {
  display: flex;
  gap: 16px 24px;
  flex-shrink: 0;
}
.screen-runbar-models { min-width: 0; }
.screen-runbar-route {
  display: block;
  font-size: 10px;
  color: var(--lo);
  margin-bottom: 5px;
}
.screen-models { display: flex; gap: 8px; }

/* Header placement: run controls beside the page title. The model buttons
   keep their sub-labels, so each is two lines and the run button
   bottom-aligns with them. */
.screen-runbar-header {
  align-items: flex-end;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px 12px;
}
.screen-runbar-header .screen-runbar-route {
  margin-bottom: 3px;
  text-align: right;
}
.screen-runbar-header .model-btn {
  flex: 0 1 auto;
  padding: 7px 13px;
  white-space: nowrap;
}
.screen-runbar-header .screen-run {
  padding: 11px 20px;
  min-width: 0;
}

/* Bottom placement: full-width sticky bar (unused today, kept because the
   component still supports it). */
.screen-runbar-bottom {
  position: sticky;
  bottom: 0;
  z-index: 2;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-top: 4px;
  padding: 14px 0 2px;
  background: linear-gradient(to bottom, transparent, var(--bg) 22%);
  border-top: 1px solid var(--rule);
}
.screen-runbar-bottom .screen-models { flex-wrap: wrap; }
.screen-runbar-bottom .model-btn { flex: 0 1 170px; }
.screen-runbar-bottom .screen-run { flex-shrink: 0; min-width: 190px; }

/* Header actions cluster: the view's secondary control + the run bar */
.compose-hdr-actions {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 10px 14px;
  flex-wrap: wrap;
  flex-shrink: 0;
}

@media (max-width: 860px) {
  .compose-hdr { flex-direction: column; align-items: stretch; }
  .compose-hdr-actions { justify-content: flex-start; }
  .screen-runbar-header { justify-content: flex-start; width: 100%; }
  .screen-runbar-header .screen-runbar-route { text-align: left; }
  .screen-runbar-header .screen-models { flex: 1 1 auto; }
  .screen-runbar-header .model-btn { flex: 1 1 0; }
}
@media (max-width: 700px) {
  .screen-runbar-bottom { align-items: stretch; }
  .screen-runbar-bottom .screen-runbar-models,
  .screen-runbar-bottom .screen-models { width: 100%; }
  .screen-runbar-bottom .model-btn { flex: 1 1 0; }
  .screen-runbar-bottom .screen-run { width: 100%; }
  .screen-runbar-header .screen-run { width: 100%; }
}

/* ─── RESULTS PAGE — FULL-SCREEN LAYOUT ─────────────────────── */

/* Batch: fills height, panels scroll internally */
.results-page {
  display: flex;
  flex-direction: column;
  flex: 1;
  overflow: hidden;
  height: 100%;
}

/* ── Stat header ── */
.results-stat-header {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  padding: 0 0 0 24px;
  border-bottom: 1px solid var(--rule);
  background: var(--bg2);
  flex-shrink: 0;
  overflow: hidden;
  min-height: 52px;
}
.rsh-left {
  display: flex;
  align-items: center;
  gap: 14px;
  padding-right: 16px;
}
.rsh-eyebrow {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--g);
  white-space: nowrap;
}
.rsh-divider {
  width: 1px;
  height: 14px;
  background: var(--rule);
  flex-shrink: 0;
}
.rsh-back {
  font-size: 10px;
  opacity: .7;
  padding: 4px 8px;
  letter-spacing: .04em;
}
.rsh-back:hover { opacity: 1; }
.rsh-total {
  font-size: 12px;
  font-weight: 500;
  color: var(--hi);
  white-space: nowrap;
}
/* Parallelogram stat blocks */
.rsh-stats {
  display: flex;
  align-items: stretch;
}
.rsh-stat {
  display: flex;
  align-items: center;
  padding: 0 30px 0 28px;
  transform: skewX(-14deg);
  margin-right: -8px;
  position: relative;
}
/* Last block extends past right edge to fill the corner gap from the skew */
.rsh-stat:last-child {
  margin-right: 0;
  padding-right: 48px;
}
.rsh-stat-eligible   { background: var(--sage-dim); }
.rsh-stat-unclear    { background: var(--slate-dim); }
.rsh-stat-ineligible { background: var(--red-dim); }
.rsh-stat-error      { background: var(--amber-dim); }
/* Effective recommendation = advance; outlined to read as a decision, not a verdict */
.rsh-stat-advance    { background: var(--sage-dim); box-shadow: inset 0 0 0 1px var(--sage-bdr); }

.rsh-stat-inner {
  transform: skewX(14deg);
  display: flex;
  align-items: baseline;
  gap: 8px;
  white-space: nowrap;
}
.rsh-stat-num {
  font-size: 22px;
  font-weight: 700;
  line-height: 1;
}
.rsh-stat-eligible   .rsh-stat-num { color: var(--sage-l); }
.rsh-stat-unclear    .rsh-stat-num { color: var(--slate); }
.rsh-stat-ineligible .rsh-stat-num { color: var(--red); }
.rsh-stat-error      .rsh-stat-num { color: var(--amber); }
.rsh-stat-advance    .rsh-stat-num { color: var(--sage-l); }

.rsh-stat-label {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--mid);
}
.rsh-stat-sub {
  font-size: 10px;
  font-weight: 400;
  color: var(--lo);
  padding-left: 7px;
  border-left: 1px solid rgba(255,255,255,.1);
  margin-left: 1px;
}

/* ── Two-column body ── */
.results-body {
  flex: 1;
  display: flex;
  overflow: hidden;
}

/* Left panel */
.results-left {
  width: 300px;
  min-width: 300px;
  border-right: 1px solid var(--rule);
  overflow-y: auto;
  overflow-x: hidden;
  flex-shrink: 0;
  transition: width .22s ease, min-width .22s ease;
}
.results-left.hidden {
  width: 0;
  min-width: 0;
}
.results-left-inner {
  min-width: 300px; /* prevents squish during collapse animation */
  padding-bottom: 40px;
}

.app-group { margin-bottom: 2px; }
.app-group:first-child .app-group-hdr { border-top: none; }

/* Selected row border matches the verdict group colour */
.app-group:has(.agg-eligible)   .app-row { border-left-color: rgba(95,170,140,.18); }
.app-group:has(.agg-unclear)    .app-row { border-left-color: rgba(110,143,170,.18); }
.app-group:has(.agg-ineligible) .app-row { border-left-color: rgba(220,90,90,.14); }
.app-group:has(.agg-error)      .app-row { border-left-color: rgba(220,90,90,.14); }
.app-group:has(.agg-eligible)   .app-row.selected { border-left-color: var(--sage); }
.app-group:has(.agg-unclear)    .app-row.selected { border-left-color: var(--slate); }
.app-group:has(.agg-ineligible) .app-row.selected { border-left-color: var(--red); }
.app-group:has(.agg-error)      .app-row.selected { border-left-color: var(--red); }

.app-group-hdr {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: 10px 16px;
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--lo);
  cursor: pointer;
  user-select: none;
  position: sticky;
  top: 0;
  background: var(--bg2);
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
  z-index: 1;
  transition: background .12s;
}
.app-group-hdr:hover { background: var(--card); }
.app-group-hdr-label { flex: 1; display: flex; align-items: center; gap: 5px; }
.app-group-count { font-weight: 400; color: var(--lo); margin-right: 4px; }
.agg-eligible   { color: var(--sage-l); }
.agg-unclear    { color: var(--slate); }
.agg-ineligible { color: var(--red); }
.agg-error      { color: var(--red); }

.group-chevron {
  flex-shrink: 0;
  color: var(--lo);
  transform: rotate(-90deg);
  transition: transform .2s ease;
}
.group-chevron.open { transform: rotate(0deg); }

.app-row {
  padding: 9px 20px;
  cursor: pointer;
  border-left: 3px solid transparent;
  transition: background .12s, border-color .12s;
}
.app-row:hover { background: var(--card); }
.app-row.selected {
  background: var(--card2);
  border-left-color: var(--g);
}
.app-row.selected .app-row-name { color: var(--hi); font-weight: 500; }
.app-row-name {
  font-size: 12px;
  font-weight: 400;
  color: var(--mid);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 2px;
}
.app-row-meta {
  display: flex;
  align-items: center;
  gap: 5px;
  min-height: 14px;
}
.app-row-date {
  font-size: 10.5px;
  color: var(--lo);
  flex-shrink: 0;
}
.app-row-issue {
  font-size: 10px;
  font-weight: 500;
  padding: 1px 5px;
  border-radius: var(--r-f);
  letter-spacing: .01em;
}
.app-row-issue-block {
  background: var(--red-dim);
  color: var(--red);
}
.app-row-issue-flag {
  background: var(--amber-dim);
  color: var(--amber);
}
.app-row-issue-warn {
  background: var(--amber-dim);
  color: var(--amber);
  opacity: .75;
}
.app-row-chips { display: flex; gap: 4px; flex-wrap: wrap; }

/* Status chips */
.schip {
  display: inline-flex;
  align-items: center;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .02em;
  border-radius: var(--r-f);
  padding: 2px 7px;
  border: 1px solid transparent;
  white-space: nowrap;
}
.schip-ok   { color: var(--sage-l); background: var(--sage-dim); border-color: var(--sage-bdr); }
.schip-warn { color: var(--amber); background: var(--amber-dim);  border-color: var(--amber-bdr); }
.schip-fail { color: var(--red);   background: var(--red-dim);    border-color: var(--red-bdr); }

/* Right panel */
.results-right {
  flex: 1;
  overflow-y: auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

/* App identity bar — always visible at top of right panel */
.detail-app-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 24px;
  border-bottom: 1px solid var(--rule);
  background: var(--bg2);
  flex-shrink: 0;
  position: sticky;
  top: 0;
  z-index: 2;
}
.detail-app-bar-left {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  flex: 1;
}
.detail-app-bar-name {
  font-size: 13px;
  font-weight: 500;
  color: var(--hi);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.detail-app-bar-badges { display: flex; gap: 6px; flex-shrink: 0; }
.detail-app-bar-actions {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
}
.detail-app-bar-nav {
  display: flex;
  align-items: center;
  gap: 2px;
  flex-shrink: 0;
  border-left: 1px solid var(--rule);
  padding-left: 10px;
  margin-left: 8px;
}
.detail-app-bar-pos {
  font-size: 10px;
  color: var(--lo);
  letter-spacing: .06em;
  margin-right: 6px;
  white-space: nowrap;
}

.results-detail-inner { padding: 32px 40px; animation: fadeSlideIn .18s cubic-bezier(0.16, 1, 0.3, 1); }
.results-detail-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  color: var(--lo);
  font-size: 13px;
  text-align: center;
  padding: 40px;
}

/* ── Single result: wrapper + two-column split ── */
.results-single-wrap {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
}
.results-single-wrap .results-single-split {
  flex: 1;
  min-height: 0;
  overflow: hidden;
}

.results-single-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.results-single-left {
  padding: 40px 36px 60px;
  border-right: 1px solid var(--rule);
  overflow-y: auto;
}
.results-single-right {
  padding: 40px 36px 60px;
  overflow-y: auto;
}
.single-split-divider {
  height: 1px;
  background: var(--rule);
  margin: 20px 0;
}
.single-result-actions {
  display: flex;
  gap: 8px;
  margin-top: 28px;
  padding-top: 20px;
  border-top: 1px solid var(--rule);
  flex-wrap: wrap;
}

@media (max-width: 940px) {
  .results-single-split { grid-template-columns: 1fr; }
  .results-single-left  { border-right: none; border-bottom: 1px solid var(--rule); padding: 28px 20px; }
  .results-single-right { padding: 28px 20px; }
  .results-left  { width: 240px; min-width: 240px; }
  .results-left-inner { min-width: 240px; }
  .results-stat-header { padding: 0 0 0 14px; min-height: 44px; }
  .rsh-stat { padding: 0 20px 0 18px; }
  .rsh-stat:last-child { padding-right: 32px; }
  .rsh-stat-num { font-size: 17px; }
}

/* ─── CYCLE STRIP (sidebar) ──────────────────────────────────── */
#cycle-strip { flex-shrink: 0; }
.cycle-strip {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 8px 14px;
  cursor: pointer;
  border-bottom: 1px solid var(--rule);
  border-top: 1px solid var(--rule);
  transition: background .12s;
}
.cycle-strip:hover { background: var(--card); }
.cycle-strip-create {
  padding: 10px 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  border-bottom: 1px solid var(--rule);
  border-top: 1px solid var(--rule);
}
.cycle-strip-label { font-size: 10px; color: var(--lo); }
.cycle-strip-name {
  font-size: 11px;
  font-weight: 500;
  color: var(--hi);
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cycle-strip-chevron { color: var(--lo); flex-shrink: 0; }
#sidebar.collapsed .cycle-strip-name,
#sidebar.collapsed .cycle-strip-label,
#sidebar.collapsed .cycle-strip-chevron { display: none; }
.cycle-dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
}
.cycle-dot-active   { background: var(--sage); }
.cycle-dot-closed   { background: var(--amber); }
.cycle-dot-archived { background: var(--lo); }

.cycle-strip-open { background: var(--card); }
.cycle-strip-chevron { transition: transform .12s; }
.cycle-strip-chevron-open { transform: rotate(180deg); }

.cycle-menu-backdrop {
  position: fixed;
  inset: 0;
  z-index: 149;
}
.cycle-menu {
  position: fixed;
  z-index: 150;
  background: var(--card);
  border: 1px solid var(--rule);
  border-radius: var(--r-lg);
  box-shadow: 0 6px 24px rgba(0,0,0,.45), 0 1px 3px rgba(0,0,0,.4);
  padding: 6px;
  animation: fadeSlideIn .12s ease;
}
.cycle-menu-list {
  max-height: 280px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.cycle-menu-item {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 7px 8px;
  border: none;
  background: transparent;
  border-radius: var(--r-sm);
  cursor: pointer;
  text-align: left;
  font-size: 12px;
  color: var(--hi);
  transition: background .12s;
}
.cycle-menu-item:hover { background: var(--bg2); }
.cycle-menu-item-sel { font-weight: 500; }
.cycle-menu-item-name {
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cycle-menu-check { color: var(--sage); flex-shrink: 0; }
.cycle-menu-footer {
  border-top: 1px solid var(--rule);
  margin-top: 4px;
  padding-top: 4px;
}
.cycle-menu-manage {
  display: block;
  width: 100%;
  padding: 7px 8px;
  border: none;
  background: transparent;
  border-radius: var(--r-sm);
  cursor: pointer;
  text-align: left;
  font-size: 11.5px;
  color: var(--lo);
  transition: background .12s, color .12s;
}
.cycle-menu-manage:hover { background: var(--bg2); color: var(--hi); }

/* ─── CYCLES PAGE ────────────────────────────────────────────── */
#p-cycles.active { display: block; overflow-y: auto; height: 100%; }
.cycle-row {
  display: flex;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 1px solid var(--rule);
  gap: 16px;
  cursor: pointer;
  transition: background .12s;
}
.cycle-row:last-child { border-bottom: none; }
.cycle-row:hover { background: rgba(255,255,255,.02); }
.cycle-row-active { background: var(--gdim); border-left: 3px solid var(--g); }
.cycle-row-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.cycle-row-name { font-size: 13px; font-weight: 500; color: var(--hi); }
.cycle-row-desc { font-size: 12px; color: var(--mid); }
.cycle-active-badge {
  font-size: 10px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase;
  color: var(--g); margin-left: 8px;
}
.cycle-row-actions { display: flex; gap: 8px; flex-shrink: 0; }

@media (prefers-color-scheme: light) {
  .cycle-row:hover { background: rgba(0,0,0,.02); }
  .cycle-row-active { background: var(--gdim); }
}

/* ─── IN REVIEW PAGE ─────────────────────────────────────────── */
#p-review.active, #p-reviewed.active { display: flex; flex-direction: column; height: 100%; }

.review-page-header {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 10px 24px;
  border-bottom: 1px solid var(--rule);
  background: var(--bg2);
  flex-shrink: 0;
}

/* Review log */
.review-section {
  margin-top: 20px;
  border: 1px solid var(--rule);
  border-radius: var(--r-lg);
  overflow: hidden;
}
.review-section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  background: var(--card);
  border-bottom: 1px solid var(--rule);
}
.review-log { display: flex; flex-direction: column; }
.review-log-empty {
  padding: 16px;
  font-size: 12px;
  color: var(--lo);
  font-style: italic;
  text-align: center;
}
.review-log-entry {
  padding: 14px 16px;
  border-bottom: 1px solid var(--rule);
}
.review-log-entry:last-child { border-bottom: none; }
.review-log-header {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 6px;
}
.review-log-name {
  font-size: 13px;
  font-weight: 500;
  color: var(--hi);
}
.review-log-role {
  font-size: 10px;
  color: var(--lo);
  letter-spacing: .05em;
}
.review-log-badges { display: flex; gap: 5px; }
.review-log-time {
  font-size: 10px;
  color: var(--lo);
  margin-left: auto;
  white-space: nowrap;
}
.review-log-note {
  font-size: 12px;
  color: var(--mid);
  line-height: 1.7;
  padding-left: 2px;
  border-left: 2px solid var(--rule);
  padding-left: 10px;
}

/* Pending reviewers */
.review-section-pending {
  padding: 10px 16px;
  background: var(--bg2);
  border-top: 1px solid var(--rule);
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.review-pending-name {
  font-size: 11px;
  color: var(--lo);
  background: var(--card);
  border: 1px solid var(--rule);
  border-radius: var(--r-f);
  padding: 2px 10px;
}

/* Review form */
.review-form-wrap {
  padding: 16px;
  background: var(--gdim);
  border-bottom: 1px solid var(--rule);
}

/* "Reviewing as …" — replaces the old reviewer picker: a review belongs to the
   signed-in user, so the form states who that is instead of asking. */
.review-as {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 14px;
  padding: 8px 12px;
  background: var(--card);
  border: 1px solid var(--rule);
  border-radius: var(--r);
}
.review-as-label {
  font-size: 10px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--lo);
}
.review-as-name {
  font-size: 13px;
  font-weight: 500;
  color: var(--hi);
}
.review-as-note {
  margin-left: auto;
  font-size: 10px;
  color: var(--amber);
}

@media (prefers-color-scheme: light) {
  .review-log-entry:hover { background: rgba(0,0,0,.02); }
}

/* ─── HISTORY PAGE ───────────────────────────────────────────── */
.hist-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 12px;
}
.hist-header-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.hist-group { margin-bottom: 28px; }
.hist-date-label {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--lo);
  margin-bottom: 8px;
  padding-left: 2px;
}

.hist-card { padding: 0; overflow: hidden; }
.hist-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 20px;
  cursor: pointer;
  border-bottom: 1px solid var(--rule);
  transition: background .12s;
}
.hist-row:last-child { border-bottom: none; }
.hist-row:hover { background: rgba(255,255,255,.025); }

.hist-row-main {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  flex: 1;
}
.hist-label {
  font-size: 13px;
  font-weight: 500;
  color: var(--hi);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex-shrink: 0;
  max-width: 300px;
}
.hist-chips { display: flex; gap: 5px; flex-wrap: wrap; }

.hist-row-right {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.hist-time {
  font-size: 11px;
  color: var(--lo);
  white-space: nowrap;
}
.hist-delete {
  opacity: 0;
  transition: opacity .15s;
}
.hist-row:hover .hist-delete { opacity: 1; }

@media (prefers-color-scheme: light) {
  .hist-row:hover { background: rgba(0,0,0,.03); }
}

/* ─── HEARTBEAT LOADING ──────────────────────────────────────── */
.heartbeat-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  min-height: 60vh;
  gap: 28px;
  padding: 40px;
}

.hb-outer {
  width: 100%;
  max-width: 520px;
  overflow: hidden;
  mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
  -webkit-mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
}

.hb-scroller {
  display: flex;
  width: 200%;
  animation: hb-scroll 2.8s linear infinite;
}

.hb-svg {
  width: 50%;
  height: 56px;
  flex-shrink: 0;
  overflow: visible;
}

/* Glow layer (blurred duplicate for the halo effect) */
.hb-glow {
  fill: none;
  stroke: var(--g);
  stroke-width: 6;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: .2;
  filter: blur(4px);
}

/* Main line */
.hb-line {
  fill: none;
  stroke: var(--g);
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

@keyframes hb-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

.hb-title {
  font-family: var(--ff-serif);
  font-size: 26px;
  font-weight: 400;
  color: var(--hi);
  letter-spacing: -.01em;
  margin: 0;
}

.hb-sub {
  font-size: 12px;
  color: var(--lo);
  letter-spacing: .06em;
  text-align: center;
  margin: 0;
}

/* Queue progress under the per-application step bar, matched to its width
   so the two read as one block. */
.batch-hb-progress {
  width: 360px;
  max-width: 100%;
  margin: 20px auto 0;
  text-align: center;
}
.batch-hb-progress .progress-label {
  font-size: 12px;
  color: var(--lo);
  margin-bottom: 8px;
}

/* Batch progress zone with embedded ECG */
.batch-prog-zone-animated {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 16px 0;
}
.batch-ecg {
  max-width: 100%;
  height: 36px;
}
.batch-ecg .hb-svg {
  height: 36px;
}
.batch-ecg .hb-glow {
  stroke-width: 4;
}
.batch-ecg .hb-line {
  stroke-width: 1.5;
}

/* ─── DETAIL TAB BAR ─────────────────────────────────────────── */
.detail-tab-bar {
  display: flex;
  border-bottom: 1px solid var(--rule);
  padding: 0 20px;
  background: var(--bg2);
  flex-shrink: 0;
}
.detail-app-bar-tabs {
  display: flex;
  align-self: stretch;
  align-items: stretch;
  border-left: 1px solid var(--rule);
  border-right: 1px solid var(--rule);
  padding: 0 8px;
  margin-left: auto;
}
.detail-app-bar-tabs .detail-tab {
  padding: 0 10px;
  font-size: 10px;
  letter-spacing: .06em;
  margin-bottom: -1px;
}
.detail-app-bar-nav-icon { color: var(--lo); flex-shrink: 0; }
.detail-tab {
  padding: 10px 16px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--lo);
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  font-family: var(--ff-sans);
  display: flex;
  align-items: center;
  gap: 6px;
  transition: color .15s, border-color .15s;
  margin-bottom: -1px;
}
.detail-tab:hover { color: var(--mid); }
.detail-tab.active { color: var(--gl); border-bottom-color: var(--g); }

/* ─── APPLICATION TEXT PANEL ─────────────────────────────────── */
.app-text-panel {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
}
.app-text-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 20px;
  border-bottom: 1px solid var(--rule);
  font-size: 11px;
  color: var(--lo);
  flex-shrink: 0;
}
.app-text-chars {
  font-size: 10px;
  color: var(--lo);
  background: var(--card2);
  border: 1px solid var(--rule);
  border-radius: var(--r-f);
  padding: 1px 8px;
}
.app-text-body {
  flex: 1;
  overflow-y: auto;
  padding: 20px 24px 40px;
  font-size: 13px;
  line-height: 1.8;
  color: var(--mid);
}
.app-text-heading {
  font-family: var(--ff-serif);
  font-size: 16px;
  font-weight: 400;
  color: var(--hi);
  margin: 20px 0 8px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--rule);
}
.app-text-heading:first-child { margin-top: 0; }
.app-text-hr {
  border: none;
  border-top: 1px solid var(--rule);
  margin: 20px 0;
}
.app-text-line { margin: 0; }
.app-text-gap  { height: 10px; }
.app-text-empty { color: var(--lo); font-style: italic; }

/* ─── APPLICATION TEXT PANEL ─────────────────────────────────── */
.app-text-panel { display: flex; flex-direction: column; height: 100%; overflow: hidden; }

.app-text-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 16px;
  border-bottom: 1px solid var(--rule);
  background: var(--bg2);
  flex-shrink: 0;
  flex-wrap: wrap;
}
.app-text-chars {
  font-size: 10px; color: var(--lo);
  background: var(--card2); border: 1px solid var(--rule);
  border-radius: var(--r-f); padding: 1px 8px;
}

/* Formatted / Raw toggle */
.app-view-toggle {
  display: flex;
  background: var(--card);
  border: 1px solid var(--rule);
  border-radius: var(--r-f);
  padding: 2px; gap: 2px;
  margin-left: auto;
}
.app-view-btn {
  padding: 3px 12px;
  border-radius: calc(var(--r-f) - 1px);
  border: none; background: transparent;
  font-family: var(--ff-sans);
  font-size: 10px; font-weight: 500; letter-spacing: .04em;
  color: var(--lo); cursor: pointer;
  transition: background .12s, color .12s;
}
.app-view-btn.active { background: var(--g); color: #fff; }

/* Scrollable body */
.app-text-body {
  flex: 1; overflow-y: auto;
  padding: 32px 40px 64px;
  font-size: 14px;
  line-height: 1.9;
}
.app-text-body-inner {
  max-width: 700px;
  margin: 0 auto;
}
.app-text-raw {
  flex: 1; overflow-y: auto;
  padding: 24px 32px;
  font-family: monospace;
  font-size: 12.5px; line-height: 1.8;
  color: var(--mid);
  white-space: pre-wrap; word-break: break-word;
  margin: 0;
  max-width: 900px;
}

/* Headings */
.app-text-heading {
  font-family: var(--ff-serif);
  font-size: 19px; font-weight: 400;
  color: var(--hi); letter-spacing: -.02em;
  margin: 36px 0 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--rule);
  line-height: 1.25;
}
.app-text-heading:first-child { margin-top: 0; }
.app-text-hr { border: none; border-top: 1px solid var(--rule); margin: 28px 0; }

/* Key-value table */
.app-kv-table {
  display: grid;
  grid-template-columns: minmax(140px, 36%) 1fr;
  border: 1px solid var(--rule);
  border-radius: var(--r-lg);
  overflow: hidden;
  margin: 0 0 20px;
  font-size: 13px;
  box-shadow: 0 1px 3px rgba(0,0,0,.25);
}
.app-kv-row { display: contents; }
.app-kv-key {
  background: var(--card2);
  padding: 9px 14px;
  font-size: 11.5px; font-weight: 500;
  color: var(--mid); letter-spacing: .01em;
  border-bottom: 1px solid var(--rule);
}
.app-kv-value {
  background: var(--card);
  padding: 9px 14px;
  font-size: 13px;
  color: var(--hi);
  border-bottom: 1px solid var(--rule);
  word-break: break-word;
  line-height: 1.65;
}
.app-kv-row:last-child .app-kv-key,
.app-kv-row:last-child .app-kv-value { border-bottom: none; }

/* Budget / data table */
.app-table-wrap {
  overflow-x: auto;
  margin: 0 0 20px;
  border: 1px solid var(--rule);
  border-radius: var(--r-lg);
  box-shadow: 0 1px 3px rgba(0,0,0,.25);
}
.app-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.app-table th {
  background: var(--card2);
  padding: 9px 14px;
  font-size: 10px; font-weight: 600;
  letter-spacing: .09em; text-transform: uppercase;
  color: var(--mid); text-align: left;
  border-bottom: 1px solid var(--rule);
}
.app-table td {
  padding: 9px 14px;
  color: var(--hi);
  border-bottom: 1px solid var(--rule);
  vertical-align: top;
  line-height: 1.65;
}
.app-table tr:last-child td { border-bottom: none; }
.app-table tbody tr:hover td { background: rgba(255,255,255,.025); }

/* ─── BUDGET TABLE ───────────────────────────────────────────── */
.budget-table-wrap {
  overflow-x: auto;
  margin: 0 0 20px;
  border: 1px solid var(--rule);
  border-radius: var(--r-lg);
  box-shadow: 0 1px 3px rgba(0,0,0,.25);
}
.budget-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.budget-table thead th {
  background: var(--card2);
  padding: 8px 14px;
  font-size: 10px; font-weight: 600;
  letter-spacing: .09em; text-transform: uppercase;
  color: var(--mid); border-bottom: 2px solid var(--rule);
  white-space: nowrap;
}
.budget-table thead th.budget-label-col { text-align: left; }
.budget-table thead th.budget-amt-col   { text-align: right; }
.budget-label-col {
  text-align: left;
  color: var(--hi);
  min-width: 160px;
  padding: 8px 14px;
  border-bottom: 1px solid var(--rule);
}
.budget-amt-col {
  text-align: right;
  padding: 8px 18px 8px 14px;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  letter-spacing: .01em;
  color: var(--mid);
  border-bottom: 1px solid var(--rule);
}
.budget-table tr:last-child td { border-bottom: none; }
.budget-table tbody tr:hover td { background: rgba(255,255,255,.025); }
.budget-table tr.budget-total td {
  font-weight: 600;
  color: var(--hi);
  border-top: 2px solid var(--rule);
  border-bottom: none;
  background: rgba(255,255,255,.02);
}
.budget-table tr.budget-total .budget-amt-col { color: var(--sage); }

@media (prefers-color-scheme: light) {
  .budget-table thead th { background: var(--bg2); }
  .budget-table tbody tr:hover td { background: rgba(0,0,0,.02); }
  .budget-table tr.budget-total td { background: rgba(0,0,0,.02); }
}

/* Lists */
.app-list {
  padding-left: 22px; margin: 0 0 18px;
  color: var(--hi); font-size: 14px; line-height: 1.85;
}
.app-list li { margin-bottom: 6px; }
.app-list li::marker { color: var(--g); opacity: .6; }

/* Paragraphs */
.app-para {
  color: var(--hi); font-size: 14px;
  line-height: 1.9; margin: 0 0 16px;
  font-weight: 300;
}
.app-text-empty { color: var(--lo); font-style: italic; font-size: 13px; }

@media (prefers-color-scheme: light) {
  .app-kv-key  { background: var(--bg2); }
  .app-kv-value, .app-table td { background: var(--card); }
  .app-table th { background: var(--bg2); }
  .app-table tbody tr:hover td { background: rgba(0,0,0,.02); }
  .app-para { font-weight: 400; }
  .app-list { font-weight: 400; }
}

/* ─── SCORING RINGS ──────────────────────────────────────────── */
.scoring-rings {
  display: flex;
  align-items: flex-start;
  justify-content: space-around;
  padding: 20px 20px 16px;
  border-bottom: 1px solid var(--rule);
}
.score-ring-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
  flex: 1;
}
.score-ring-svg {
  width: 72px;
  height: 72px;
  display: block;
  overflow: visible;
}
.score-ring-track {
  fill: none;
  stroke: rgba(255,255,255,.08);
  stroke-width: 4.5;
}
.score-ring-fill {
  fill: none;
  stroke-width: 4.5;
  stroke-linecap: round;
  transition: stroke-dashoffset .5s cubic-bezier(.4,0,.2,1), stroke .3s ease;
}
.score-ring-text {
  font-size: 12px;
  font-weight: 700;
  fill: var(--hi);
  text-anchor: middle;
  dominant-baseline: central;
  font-family: var(--ff-sans);
  letter-spacing: -.02em;
}
.score-ring-sub {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--lo);
  text-align: center;
}

@media (prefers-color-scheme: light) {
  .score-ring-track { stroke: rgba(0,0,0,.08); }
}

/* ─── UTILITY: EXTRA BUTTON SIZE ─────────────────────────────── */
.btn-xs { padding: 3px 10px; font-size: 10px; border-radius: var(--r-sm); gap: 4px; }

/* ─── DELETE CONFIRMATION ────────────────────────────────────── */
.delete-confirm {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}
.delete-confirm span {
  font-size: 11px;
  color: var(--mid);
  letter-spacing: .04em;
}

/* ─── CONFIRM LABEL (batch clear) ────────────────────────────── */
.confirm-label {
  font-size: 11px;
  color: var(--mid);
  letter-spacing: .04em;
  white-space: nowrap;
}

/* ─── FIELD VALIDATION ERROR ─────────────────────────────────── */
.field-error {
  font-size: 11px;
  color: var(--red);
  margin-top: 5px;
}

/* ─── FILE PILL (single upload preview) ──────────────────────── */
.file-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: var(--mid);
  background: var(--card2);
  border: 1px solid var(--rule);
  border-radius: var(--r-f);
  padding: 4px 12px;
  margin-bottom: 10px;
}

/* ─── TRUNCATION WARNING ─────────────────────────────────────── */
.truncation-warn {
  font-size: 12px;
  color: var(--amber);
  background: var(--amber-dim);
  border: 1px solid var(--amber-bdr);
  border-radius: var(--r);
  padding: 8px 12px;
  margin-bottom: 12px;
  line-height: 1.55;
}

/* ─── PRINT ──────────────────────────────────────────────────── */
@media print {
  #gate, #sidebar, #topbar, .single-hero-actions, .single-hero-eyebrow,
  .single-hero-lede, .single-hero h1, #top-actions,
  .accordion-btn, .stat-pills, .detail-app-bar,
  .single-result-actions, .results-stat-header { display: none !important; }

  body { background: #fff; color: #111; font-size: 12px; }
  #app { display: block !important; height: auto; overflow: visible; }
  #main { overflow: visible; }
  .content { overflow: visible; }
  .page { display: none !important; }
  #p-results { display: block !important; }

  .verdict-banner { border: 1px solid #ddd; background: #f9f9f9 !important; }
  .verdict-banner-title { color: #111 !important; }
  .verdict-banner-rec   { color: #333 !important; }
  .stat-card { border: 1px solid #ddd; }
  .accordion-body { display: block !important; max-height: none !important; }
  .card { border: 1px solid #ddd; box-shadow: none; }
  .results-table { font-size: 11px; }
  a { color: inherit; text-decoration: none; }

  .page-wrap { padding: 16px; max-width: 100%; }
}

/* ─── MOBILE ─────────────────────────────────────────────────── */
@media (max-width: 640px) {
  /* Sidebar collapses on mobile */
  #sidebar { width: 52px; min-width: 52px; }
  #sidebar .sb-brand-text { display: none; }
  #sidebar .sb-label { opacity: 0; width: 0; overflow: hidden; }
  #sidebar .sb-item { justify-content: center; padding: 10px; }
  #topbar { padding: 0 12px; }

  /* Gate */
  #gate { flex-direction: column; }
  .gate-left { width: 100%; padding: 40px 28px; }
  .gate-right { display: none; }

  /* Single page */
  .single-hero { padding: 48px 24px; }
  .single-hero h1 { font-size: 32px; }
  .single-hero-actions { flex-direction: column; gap: 10px; }

  /* Batch & config */
  .page-wrap { padding: 32px 20px; }
  .config-content { padding: 32px 20px; }
  .config-tabbar { padding: 0 16px; overflow-x: auto; }
  .card-header { flex-wrap: wrap; gap: 8px; }

  /* Results table: hide less critical columns */
  .results-table th:nth-child(3),
  .results-table td:nth-child(3),
  .results-table th:nth-child(4),
  .results-table td:nth-child(4) { display: none; }

  /* Top actions */
  #top-actions { gap: 4px; }
  #top-actions .btn { padding: 5px 10px; font-size: 10px; }
}

/* ─── RESULTS FILTER BAR ─────────────────────────────────────── */
.results-filter-bar {
  padding: 10px 12px 8px;
  border-bottom: 1px solid var(--rule);
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.results-filter-input {
  width: 100%;
  box-sizing: border-box;
  background: var(--bg2);
  border: 1px solid var(--rule);
  border-radius: var(--r-sm);
  color: var(--hi);
  font-size: 11.5px;
  padding: 5px 9px;
  outline: none;
  font-family: var(--ff-sans);
}
.results-filter-input:focus {
  border-color: rgba(255,255,255,.18);
}
.rfilter-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.rfilter-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 10.5px;
  font-family: var(--ff-sans);
  padding: 2px 8px;
  border-radius: var(--r-f);
  border: 1px solid var(--rule);
  background: transparent;
  color: var(--mid);
  cursor: pointer;
  transition: background .12s, color .12s, border-color .12s;
  white-space: nowrap;
}
.rfilter-chip:hover { background: var(--card2); color: var(--hi); }
.rfilter-chip.active { border-color: rgba(255,255,255,.25); background: var(--card2); color: var(--hi); }
.rfilter-chip-eligible.active  { border-color: var(--sage-bdr);  background: var(--sage-dim);  color: var(--sage-l); }
.rfilter-chip-unclear.active   { border-color: var(--slate-bdr); background: var(--slate-dim); color: var(--slate); }
.rfilter-chip-ineligible.active { border-color: var(--red-bdr);  background: var(--red-dim);   color: var(--red); }
.rfilter-chip-error.active     { border-color: var(--amber-bdr); background: var(--amber-dim); color: var(--amber); }
.rfilter-chip-comment.active   { border-color: var(--blue-bdr);  background: var(--blue-dim);  color: var(--blue); }
.rfilter-chip-changed.active   { border-color: rgba(201,65,80,.35); background: var(--gdim);   color: var(--gl); }
.rfilter-n {
  font-size: 10px;
  opacity: .7;
}
.rfilter-sep {
  width: 1px;
  align-self: stretch;
  margin: 2px 4px;
  background: var(--rule);
}
.rfilter-empty {
  padding: 20px 16px;
  text-align: center;
  font-size: 12px;
  color: var(--lo);
  font-style: italic;
}

/* ─── SCREENING STEP INDICATOR ──────────────────────────────── */
.seg-bar {
  display: flex;
  gap: 5px;
  width: 360px;
  max-width: 100%;
  margin: 22px auto 0;
}
.seg {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
}
.seg-fill {
  width: 100%;
  height: 5px;
  border-radius: 3px;
  background: var(--card2);
  transition: background .3s ease;
}
.seg-label {
  font-size: 10.5px;
  color: var(--lo);
  white-space: nowrap;
  transition: color .3s ease, font-weight .1s;
}

/* completed */
.seg.seg-done .seg-fill  { background: var(--g); }
.seg.seg-done .seg-label { color: var(--mid); }

/* active — bright glow pulse */
.seg.seg-active .seg-fill {
  background: var(--g);
  animation: seg-glow 1s ease-in-out infinite;
}
.seg.seg-active .seg-label { color: var(--hi); font-weight: 500; }

/* connecting (step === -1) — dim scan on first segment */
.seg-bar.seg-connecting .seg:first-child .seg-fill {
  background: var(--gdim);
  animation: seg-scan 1.4s ease-in-out infinite;
}
.seg-bar.seg-connecting .seg:first-child .seg-label { color: var(--mid); }

@keyframes seg-glow {
  0%, 100% { opacity: 1;   box-shadow: 0 0 0px 0px transparent; }
  50%       { opacity: .65; box-shadow: 0 0 8px 3px rgba(201,65,80,.45); }
}
@keyframes seg-scan {
  0%, 100% { opacity: .35; }
  50%       { opacity: .9;  }
}

/* ─── RESCORE ────────────────────────────────────────────────── */
.rescore-pill {
  color: var(--amber) !important;
  border-color: var(--amber-bdr) !important;
  background: var(--amber-dim) !important;
}
.rescore-append {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px 12px;
  border: 1px solid var(--rule);
  border-radius: var(--r);
  background: var(--bg2);
}
.rescore-append-label {
  font-size: 11.5px;
  color: var(--mid);
}
.rescore-append-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.rescore-appended-file {
  font-size: 11px;
  padding: 2px 8px;
  border-radius: var(--r-f);
  background: var(--sage-dim);
  border: 1px solid var(--sage-bdr);
  color: var(--sage-l);
}

/* ─── CONFIG COPY-FROM ───────────────────────────────────────── */
.copy-from-wrap {
  display: flex;
  align-items: center;
  gap: 6px;
  position: relative;
}
.copy-from-select {
  font-size: 11.5px;
  padding: 4px 8px;
  border-radius: var(--r-sm);
  background: var(--bg2);
  border: 1px solid var(--rule);
  color: var(--mid);
  cursor: pointer;
  max-width: 160px;
  font-family: var(--ff-sans);
}
.copy-from-select:hover { border-color: rgba(255,255,255,.15); color: var(--hi); }
.copy-from-msg {
  font-size: 11px;
  color: var(--sage);
  white-space: nowrap;
}

/* ─── RESULTS TABLE (/results/table) ────────────────────────── */
/* One row per application, four derived traffic-light columns, a verdict and a
   comment thread. Non-green cells explain themselves on hover/focus (.rt-pop)
   and in full when the row is expanded (.rt-x). */

.rt-toolbar {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 9px 24px;
  border-bottom: 1px solid var(--rule);
  flex-shrink: 0;
  flex-wrap: wrap;
}
.rt-search { width: 240px; flex-shrink: 0; }
.rt-legend {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-left: auto;
}
.rt-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--lo);
  white-space: nowrap;
}

.rt-scroll {
  flex: 1;
  overflow: auto;
  padding-bottom: 60px;
}

.rt-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.rt-table thead th {
  position: sticky;
  top: 0;
  z-index: 3;
  background: var(--bg2);
  padding: 10px 14px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--mid);
  text-align: left;
  white-space: nowrap;
  border-bottom: 1px solid var(--rule);
}
.rt-table thead th.rt-col-dim { text-align: center; }

.rt-col-ref     { width: 96px; }
/* Title is capped so the dimension/recommendation/comment columns get the
   space; long titles clamp to two lines instead of stretching the column. */
.rt-col-title   { width: 220px; max-width: 240px; }
.rt-col-dim     { width: 92px; text-align: center; }
.rt-col-rec     { width: 240px; }
/* The flexible column — absorbs whatever the fixed columns leave over. */
.rt-col-comment { min-width: 260px; }

.rt-row {
  cursor: pointer;
  transition: background .12s;
}
.rt-row > td {
  padding: 11px 14px;
  border-bottom: 1px solid var(--rule);
  vertical-align: middle;
}
.rt-row:hover > td      { background: rgba(255,255,255,.03); }
.rt-row-open > td       { background: rgba(255,255,255,.045); border-bottom-color: transparent; }
.rt-row:focus-visible   { outline: 2px solid var(--g); outline-offset: -2px; }

.rt-ref {
  font-size: 11.5px;
  font-weight: 500;
  letter-spacing: .04em;
  color: var(--mid);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.rt-title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  color: var(--hi);
  font-weight: 500;
  line-height: 1.4;
}
.rt-title-sub {
  display: block;
  font-size: 10.5px;
  color: var(--lo);
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rt-dash { color: var(--lo); }

/* ── Traffic lights ── */
.rt-dot-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: transparent;
  border: none;
  padding: 4px 6px;
  border-radius: var(--r-f);
  cursor: pointer;
  transition: background .12s;
}
.rt-dot-btn:hover { background: rgba(255,255,255,.07); }
.rt-dot-btn:focus-visible { outline: 2px solid var(--g); outline-offset: 1px; }
.rt-dot {
  width: 13px;
  height: 13px;
  border-radius: 50%;
  flex-shrink: 0;
  display: inline-block;
}
.rt-dot-xs { width: 8px; height: 8px; }
.rt-dot-green { background: var(--sage); box-shadow: 0 0 0 3px var(--sage-dim); }
.rt-dot-amber { background: var(--amber); box-shadow: 0 0 0 3px var(--amber-dim); }
.rt-dot-red   { background: var(--red);   box-shadow: 0 0 0 3px var(--red-dim); }
.rt-dot-na    { background: transparent; border: 1.5px dashed var(--rule); box-shadow: none; }
.rt-dot-n {
  font-size: 9.5px;
  font-weight: 600;
  color: var(--lo);
  font-variant-numeric: tabular-nums;
}

/* ── Verdict + recommendation ── */
.rt-rec-line {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
}
.rt-verdict {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .07em;
  text-transform: uppercase;
  white-space: nowrap;
}
.rt-verdict-green { color: var(--sage-l); }
.rt-verdict-amber { color: var(--slate); }
.rt-verdict-red   { color: var(--red); }
.rt-rec-badge { font-size: 10px; }

/* ── Comment cell ── */
/* The thread is shared, so the cell shows who said what, not just the text */
.rt-comment-preview,
.rt-comment-add {
  display: block;
  width: 100%;
  text-align: left;
  background: transparent;
  border: none;
  padding: 2px 0;
  cursor: pointer;
  font-family: var(--ff-sans);
}
.rt-comment-line {
  display: flex;
  align-items: baseline;
  gap: 5px;
  min-width: 0;
}
.rt-comment-line + .rt-comment-line { margin-top: 3px; }
.rt-comment-who {
  flex: none;
  max-width: 96px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 10.5px;
  font-weight: 600;
  color: var(--lo);
}
.rt-comment-who-own { color: var(--gl); }
.rt-comment-text {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-width: 0;
  font-size: 12px;
  color: var(--mid);
  line-height: 1.5;
}
.rt-comment-line-tight .rt-comment-text { -webkit-line-clamp: 1; }
.rt-comment-preview:hover .rt-comment-text { color: var(--hi); }
.rt-comment-meta {
  display: block;
  font-size: 10px;
  color: var(--lo);
  margin-top: 3px;
}
.rt-comment-add {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  color: var(--lo);
  opacity: 0;
  transition: opacity .12s, color .12s;
}
.rt-comment-add-reply { margin-top: 2px; }
.rt-row:hover .rt-comment-add,
.rt-row-open .rt-comment-add,
.rt-comment-add:focus-visible { opacity: 1; }
.rt-comment-add:hover { color: var(--g); }
/* Somebody has already written about this column */
.rt-dot-cmt { color: var(--lo); flex: none; opacity: .75; }

/* ── Expanded row ── */
.rt-xrow > td {
  padding: 0 14px 16px;
  background: rgba(255,255,255,.045);
  border-bottom: 1px solid var(--rule);
}
.rt-x {
  display: grid;
  grid-template-columns: minmax(320px, 1fr) minmax(320px, 1fr);
  align-items: start;
  gap: 16px;
  animation: fadeSlideIn .18s ease;
}
.rt-x-main { min-width: 0; }
.rt-x-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.rt-x-top-body { flex: 1; min-width: 0; }
.rt-x-close { flex-shrink: 0; }
.rt-x-actions { display: flex; align-items: center; gap: 4px; flex-shrink: 0; margin-top: 14px; }
.rt-x-reason {
  font-size: 12.5px;
  line-height: 1.7;
  color: var(--mid);
  padding: 8px 0 8px 12px;
  border-left: 2px solid var(--rule);
}
.rt-x-reason-green { border-left-color: var(--sage-bdr); }
.rt-x-reason-amber { border-left-color: var(--slate-bdr); }
.rt-x-reason-red   { border-left-color: var(--red-bdr); }
.rt-x-error {
  font-size: 12.5px;
  color: var(--red);
  padding: 10px 12px;
  background: var(--red-dim);
  border: 1px solid var(--red-bdr);
  border-radius: var(--r);
}

.rt-x-clean {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
  margin-bottom: 12px;
}
.rt-x-clean-chip {
  display: flex;
  align-items: center;
  gap: 6px;
  background: var(--card);
  border: 1px solid var(--rule);
  border-radius: var(--r-f);
  padding: 5px 10px;
  min-width: 0;
}
.rt-x-clean-chip-green {
  background: var(--sage-dim);
  border-color: var(--sage-bdr);
}
.rt-x-clean-chip-green .rt-x-clean-label,
.rt-x-clean-chip-green .rt-x-clean-sub {
  color: var(--sage-l);
}
.rt-x-clean-label {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--hi);
}
.rt-x-clean-sub {
  font-size: 10.5px;
  color: var(--lo);
}
.rt-x-clean-chip .rt-x-dim-comment { margin-left: 2px; }

.rt-x-dims {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.rt-x-dim {
  background: var(--card);
  border: 1px solid var(--rule);
  border-radius: var(--r-lg);
  padding: 11px 13px 12px;
  min-width: 0;
}
.rt-x-dim-hdr {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
.rt-x-dim-label {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--hi);
}
.rt-x-dim-level {
  font-size: 9.5px;
  font-weight: 600;
  letter-spacing: .07em;
  text-transform: uppercase;
  padding: 2px 7px;
  border-radius: var(--r-f);
  border: 1px solid var(--rule);
  color: var(--lo);
  white-space: nowrap;
}
.rt-x-dim-level-green { color: var(--sage-l); background: var(--sage-dim); border-color: var(--sage-bdr); }
.rt-x-dim-level-amber { color: var(--amber);  background: var(--amber-dim); border-color: var(--amber-bdr); }
.rt-x-dim-level-red   { color: var(--red);    background: var(--red-dim);   border-color: var(--red-bdr); }
.rt-x-dim-comment {
  margin-left: auto;
  background: transparent;
  border: none;
  font-family: var(--ff-sans);
  font-size: 10px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--lo);
  cursor: pointer;
  opacity: 0;
  transition: opacity .12s, color .12s;
}
.rt-x-dim:hover .rt-x-dim-comment,
.rt-x-clean-chip:hover .rt-x-dim-comment,
.rt-x-dim-comment:focus-visible { opacity: 1; }
.rt-x-dim-comment:hover { color: var(--g); }

.rt-x-list { list-style: none; display: flex; flex-direction: column; gap: 7px; }
.rt-x-item {
  font-size: 12px;
  line-height: 1.6;
  padding-left: 10px;
  border-left: 2px solid var(--rule);
}
.rt-x-item-red   { border-left-color: var(--red-bdr); }
.rt-x-item-amber { border-left-color: var(--amber-bdr); }
.rt-x-item-label { display: block; color: var(--hi); font-weight: 500; }
.rt-x-item-detail { display: block; color: var(--lo); margin-top: 1px; }
.rt-x-none { font-size: 12px; color: var(--lo); font-style: italic; }
.rt-x-passed {
  font-size: 10px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--lo);
  margin-top: 9px;
  padding-top: 8px;
  border-top: 1px solid var(--rule);
}
.rt-x-other { margin-top: 12px; }
.rt-x-other .rt-x-list { margin-top: 6px; }

/* ── Comments panel ── */
.rt-x-side {
  background: var(--card);
  border: 1px solid var(--rule);
  border-radius: var(--r-lg);
  padding: 14px 16px 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}
.rt-cmt-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}
.rt-cmt-refresh {
  flex: none;
  background: transparent;
  border: none;
  padding: 0;
  cursor: pointer;
  font-family: var(--ff-sans);
  font-size: 10px;
  color: var(--lo);
  transition: color .12s;
}
.rt-cmt-refresh:hover:not(:disabled) { color: var(--g); }
.rt-cmt-refresh:disabled { cursor: default; opacity: .6; }
.rt-cmt-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-height: 320px;
  overflow-y: auto;
}
.rt-cmt {
  padding-bottom: 9px;
  border-bottom: 1px solid var(--rule);
}
.rt-cmt:last-child { border-bottom: none; padding-bottom: 0; }
/* Your own note, so a shared thread reads as a conversation */
.rt-cmt-own { border-left: 2px solid var(--gdim); padding-left: 8px; margin-left: -10px; }
.rt-cmt-you {
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 1px 5px;
  border-radius: var(--r-f);
  background: var(--gdim);
  color: var(--gl);
}
.rt-cmt-email {
  font-size: 10px;
  color: var(--lo);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 150px;
}
.rt-cmt-hdr {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
  margin-bottom: 4px;
}
.rt-cmt-author { font-size: 11.5px; font-weight: 500; color: var(--hi); }
.rt-cmt-tag {
  font-size: 9.5px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 1px 6px;
  border-radius: var(--r-f);
  background: var(--gdim);
  border: 1px solid rgba(201,65,80,.2);
  color: var(--gl);
}
.rt-cmt-time { font-size: 10px; color: var(--lo); margin-left: auto; white-space: nowrap; }
.rt-cmt-body { font-size: 12.5px; line-height: 1.65; color: var(--mid); white-space: pre-wrap; }
.rt-cmt-tools { display: flex; gap: 2px; margin-top: 3px; }
.rt-cmt-edit { display: flex; flex-direction: column; gap: 6px; margin-top: 4px; }
.rt-cmt-actions { display: flex; gap: 6px; justify-content: flex-end; }
.rt-cmt-empty { font-size: 11.5px; color: var(--lo); font-style: italic; line-height: 1.6; }
.rt-cmt-form {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-top: 10px;
  border-top: 1px solid var(--rule);
}
.rt-cmt-form .input, .rt-cmt-edit .input { font-size: 12.5px; padding: 8px 10px; }
.rt-cmt-select { font-size: 11.5px; padding: 5px 10px; }
.rt-cmt-form-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.rt-cmt-as { font-size: 10px; color: var(--lo); letter-spacing: .04em; }

/* ── Decision panel (recommendation override + audit trail) ── */
.rt-dec {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--rule);
}
.rt-dec-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.rt-dec-none { font-size: 11px; color: var(--lo); font-style: italic; }
.rt-dec-ai {
  font-size: 11px;
  line-height: 1.55;
  color: var(--gl);
  background: var(--gdim);
  border-radius: var(--r-sm);
  padding: 6px 9px;
}
.rt-dec-current { display: inline-flex; align-items: center; gap: 5px; flex-wrap: wrap; justify-content: flex-end; }
/* The board's three decisions are one choice on a scale — advance it, send it
   back, stop it — so they are drawn as a single segmented track rather than
   three detached buttons. Each icon encodes the direction the application
   travels next (forward / back to the applicant / halt), which is the real
   difference between them; a generic tick-question-cross trio would not say
   that. Exactly one segment is ever in force, and it is the filled one. */
.rt-dec-opts {
  display: flex;
  border: 1px solid var(--rule);
  border-radius: var(--r-sm);
  overflow: hidden;
}
.rt-dec-opt {
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 8px 8px 9px;
  font-family: var(--ff-sans);
  font-size: 11px;
  font-weight: 500;
  color: var(--mid);
  background: transparent;
  border: none;
  cursor: pointer;
  transition: background .12s, color .12s;
  white-space: nowrap;
}
.rt-dec-opt + .rt-dec-opt { border-left: 1px solid var(--rule); }
.rt-dec-opt-icon { flex-shrink: 0; opacity: .6; transition: opacity .12s; }
.rt-dec-opt-main { overflow: hidden; text-overflow: ellipsis; }
.rt-dec-opt:hover:not(:disabled) { background: rgba(255,255,255,.045); color: var(--hi); }
.rt-dec-opt:hover:not(:disabled) .rt-dec-opt-icon { opacity: 1; }
.rt-dec-opt:focus-visible { outline: 2px solid var(--g); outline-offset: -2px; }

/* Seated bar along the bottom edge — the marker's position on the track. */
.rt-dec-opt::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 2px;
  background: transparent;
}

/* In force: filled and seated, in the tone the decision implies. Deliberately
   the heaviest thing in the group — the old treatment faded it to .55 opacity,
   which read as "unavailable" rather than "this is the decision". */
.rt-dec-opt-current { cursor: default; font-weight: 600; }
.rt-dec-opt-current .rt-dec-opt-icon { opacity: 1; }
.rt-dec-opt-green.rt-dec-opt-current { background: var(--sage-dim);  color: var(--sage-l); }
.rt-dec-opt-amber.rt-dec-opt-current { background: var(--slate-dim); color: var(--slate); }
.rt-dec-opt-red.rt-dec-opt-current   { background: var(--red-dim);   color: var(--red); }
.rt-dec-opt-green.rt-dec-opt-current::after { background: var(--sage); }
.rt-dec-opt-amber.rt-dec-opt-current::after { background: var(--slate); }
.rt-dec-opt-red.rt-dec-opt-current::after   { background: var(--red); }

/* Staged: ringed but not filled — a proposal awaiting Save, not the record.
   Tinted by the same tone as the decision it would write, so picking Advance
   never previews in the brand crimson that Decline owns. */
.rt-dec-opt-picked { font-weight: 600; }
.rt-dec-opt-picked .rt-dec-opt-icon { opacity: 1; }
.rt-dec-opt-green.rt-dec-opt-picked { color: var(--sage-l); box-shadow: inset 0 0 0 1.5px var(--sage-bdr); }
.rt-dec-opt-amber.rt-dec-opt-picked { color: var(--slate);  box-shadow: inset 0 0 0 1.5px var(--slate-bdr); }
.rt-dec-opt-red.rt-dec-opt-picked   { color: var(--red);    box-shadow: inset 0 0 0 1.5px var(--red-bdr); }
.rt-dec-opt-green.rt-dec-opt-picked:hover { background: var(--sage-dim); }
.rt-dec-opt-amber.rt-dec-opt-picked:hover { background: var(--slate-dim); }
.rt-dec-opt-red.rt-dec-opt-picked:hover   { background: var(--red-dim); }
.rt-dec-form { display: flex; flex-direction: column; gap: 6px; }
.rt-dec-form .input { font-size: 12.5px; padding: 8px 10px; }
.rt-dec-summary { font-size: 11.5px; color: var(--mid); }
.rt-dec-summary strong { color: var(--hi); }
.rt-dec-actions { display: flex; align-items: center; gap: 6px; }
.rt-dec-actions .rt-cmt-as { margin-right: auto; }
.rt-dec-error { font-size: 11px; color: var(--red); line-height: 1.5; }
.rt-dec-log { display: flex; flex-direction: column; gap: 8px; max-height: 220px; overflow-y: auto; }
.rt-dec-log-title {
  font-size: 9.5px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--lo);
}
.rt-dec-entry { padding-bottom: 7px; border-bottom: 1px dashed var(--rule); }
.rt-dec-entry:last-child { border-bottom: none; padding-bottom: 0; }
.rt-dec-entry-head { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.rt-dec-entry-move { display: flex; align-items: center; gap: 6px; margin-top: 3px; flex-wrap: wrap; }
.rt-dec-from { font-size: 11px; color: var(--lo); text-decoration: line-through; }
.rt-dec-arrow { font-size: 11px; color: var(--lo); }
.rt-dec-entry-note { font-size: 11.5px; line-height: 1.6; color: var(--mid); margin-top: 3px; white-space: pre-wrap; }

/* "was Advance" marker under the recommendation badge in the table cell */
.rt-rec-changed {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  margin-top: 3px;
  font-size: 9.5px;
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--gl);
  white-space: nowrap;
}

/* ── Hover / focus popover ── */
.rt-pop {
  position: fixed;
  z-index: 60;
  transform: translateX(-50%);
  width: 320px;
  max-width: calc(100vw - 24px);
  background: var(--card);
  border: 1px solid var(--rule);
  border-radius: var(--r-lg);
  box-shadow: 0 6px 24px rgba(0,0,0,.45), 0 1px 3px rgba(0,0,0,.4);
  padding: 11px 13px 10px;
  pointer-events: none;
  animation: fadeSlideIn .12s ease;
}
.rt-pop-hdr { display: flex; align-items: center; gap: 8px; }
.rt-pop-title {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--hi);
}
.rt-pop-level {
  margin-left: auto;
  font-size: 9.5px;
  font-weight: 600;
  letter-spacing: .07em;
  text-transform: uppercase;
  padding: 2px 7px;
  border-radius: var(--r-f);
  border: 1px solid var(--rule);
  color: var(--lo);
}
.rt-pop-sub {
  font-size: 10px;
  color: var(--lo);
  margin: 5px 0 9px;
  line-height: 1.5;
}
.rt-pop-list { list-style: none; display: flex; flex-direction: column; gap: 7px; }
.rt-pop-list > li { padding-left: 9px; border-left: 2px solid var(--rule); }
.rt-pop-list > li.rt-x-item-red   { border-left-color: var(--red-bdr); }
.rt-pop-list > li.rt-x-item-amber { border-left-color: var(--amber-bdr); }
.rt-pop-item-label { display: block; font-size: 11.5px; font-weight: 500; color: var(--hi); line-height: 1.45; }
.rt-pop-item-detail {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 11px;
  color: var(--lo);
  line-height: 1.55;
  margin-top: 2px;
}
.rt-pop-more, .rt-pop-clear { font-size: 11px; color: var(--lo); }
.rt-pop-more { margin-top: 7px; }
/* Board comments tagged to this column, under the AI's findings */
.rt-pop-notes {
  margin-top: 9px;
  padding-top: 8px;
  border-top: 1px solid var(--rule);
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.rt-pop-note { display: flex; align-items: baseline; gap: 6px; min-width: 0; }
.rt-pop-note .rt-comment-who { max-width: 120px; }
.rt-pop-note-body {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 11.5px;
  line-height: 1.5;
  color: var(--mid);
}
.rt-pop-notes .rt-pop-more { margin-top: 0; }
.rt-pop-foot {
  font-size: 9.5px;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--lo);
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid var(--rule);
}

@media (max-width: 1100px) {
  .rt-x { grid-template-columns: minmax(0, 1fr); }
  .rt-col-title   { width: 180px; max-width: 200px; }
  .rt-col-comment { min-width: 150px; }
}

@media (prefers-color-scheme: light) {
  .rt-row:hover > td { background: rgba(0,0,0,.025); }
  .rt-row-open > td  { background: rgba(0,0,0,.04); }
  .rt-xrow > td      { background: rgba(0,0,0,.04); }
  .rt-dot-btn:hover  { background: rgba(0,0,0,.05); }
  /* Excludes the picked segment so its tone tint above still wins here. */
  .rt-dec-opt:hover:not(:disabled):not(.rt-dec-opt-picked) { background: rgba(0,0,0,.05); }
  .rt-pop { box-shadow: 0 6px 22px rgba(0,0,0,.14), 0 1px 3px rgba(0,0,0,.1); }
}

/* Printing the table is how the board takes it into the room */
@media print {
  .rt-toolbar, .rt-comment-add, .rt-x-dim-comment, .rt-cmt-form, .rt-cmt-refresh, .rt-pop, .rt-dec-opts, .rt-dec-form { display: none !important; }
  .rt-scroll { overflow: visible; }
  .rt-table thead th { position: static; }
}

/* Nested nav item — "Results Table" sits under Results */
.sb-subitem { padding-left: 30px; }
.sb-subitem .sb-label { font-size: 11.5px; font-weight: 400; }
#sidebar.collapsed .sb-subitem { padding-left: 10px; }