/* ==========================================================================
   JurisAgent — pages/family-criminal.css
   Page-specific styles for /family-law and /criminal-defense ONLY.
   Loaded after site.css. Every class here is prefixed `fc-` so nothing
   collides with the shared design system. Colors come from site.css tokens
   or the page-scoped tokens below; no literals in component rules.
   .fc-report carries .paper-island in the HTML (prints like ink on paper).

   Contents
   A  Shared: hero visual, floating card, figure helpers, matter types
   B  Family law: statement files, category bars, custody lanes, parenting
      week, redline + clause list
   C  Criminal defense: production index, missing discovery, video frame,
      search hits, report-vs-video compare, unified timeline, issues,
      speedy-trial clock
   D  Responsive
   ========================================================================== */

/* --------------------------------------------------------------------------
   Page-scoped color tokens (light on :root, dark on :root[data-theme="dark"]).
   --fc-*   shared by both pages   --fam-* family law   --crim-* criminal
   -------------------------------------------------------------------------- */
:root {
  --fc-seal-drop: rgba(122,31,36,.16);      /* hero seal drop shadow */
  --fc-msg-bg: #F6F1E6;                     /* client-message draft inside .app-dark */
  --fc-msg-line: #DED6C6;
  --fc-msg-edge: transparent;               /* outline of the draft against the app */
  --fam-parent-a: #E6D7B5;                  /* parenting week: Parent A days */
  --fam-parent-a-ink: #4B3A14;
  --fam-safety-bg: rgba(229,143,134,.1);    /* urgent safety row (on night, both themes) */
  --fam-safety-line: rgba(229,143,134,.5);
  --fam-safety-pill: rgba(229,143,134,.2);
  --fam-safety-pill-ink: #F4C1BB;
  --crim-report-shadow: 0 1px 0 rgba(0,0,0,.03), 0 30px 60px -28px rgba(21,23,28,.4);
  /* Body-cam still: a video frame is dark footage in both themes */
  --crim-frame-glow: rgba(80,92,110,.55);
  --crim-frame-warm: rgba(150,120,70,.35);
  --crim-frame-top: #1B1E25;
  --crim-frame-bottom: #0F1115;
  --crim-frame-edge: transparent;
  --crim-scanline: rgba(255,255,255,.03);
  --crim-vehicle: rgba(10,11,14,.75);
  --crim-headlight: rgba(240,220,160,.25);
  --crim-headlight-2: rgba(240,220,160,.2);
  --crim-hud: rgba(243,238,227,.9);
  --crim-caption-bg: rgba(15,17,21,.75);
  --crim-caption-ink: #F3EEE3;
}
:root[data-theme="dark"] {
  --fc-seal-drop: rgba(0,0,0,.45);
  --fc-msg-bg: #1F2228;                     /* raised compose surface, not paper */
  --fc-msg-line: rgba(236,232,225,.1);
  --fc-msg-edge: rgba(236,232,225,.12);
  --fam-parent-a: #3B3020;
  --fam-parent-a-ink: #E8CF98;
  --fam-safety-bg: rgba(229,143,134,.09);
  --fam-safety-line: rgba(229,143,134,.42);
  --fam-safety-pill: rgba(229,143,134,.18);
  --fam-safety-pill-ink: #F4C1BB;
  --crim-report-shadow: var(--shadow-paper);
  --crim-frame-glow: rgba(80,92,110,.5);
  --crim-frame-warm: rgba(150,120,70,.3);
  --crim-frame-top: #181A20;
  --crim-frame-bottom: #0B0C0F;
  --crim-frame-edge: rgba(236,232,225,.08);
  --crim-scanline: rgba(255,255,255,.025);
  --crim-vehicle: rgba(6,7,9,.8);
  --crim-headlight: rgba(240,220,160,.22);
  --crim-headlight-2: rgba(240,220,160,.18);
  --crim-hud: rgba(236,232,225,.88);
  --crim-caption-bg: rgba(11,12,15,.8);
  --crim-caption-ink: #ECE8E1;
}


/* ==========================================================================
   A  Shared
   ========================================================================== */

/* Hero: copy left, product mock right, floating detail card + seal */
.fc-hero .page-hero-grid { align-items: start; }
.fc-hero .h1 { max-width: 12.5ch; }
.fc-hero-copy { padding-top: 4px; }
.fc-hero-copy .notes { margin-top: 40px; }
.fc-hero-vis { position: relative; margin-top: clamp(36px, 5vw, 64px); padding-bottom: 210px; }
.fc-hero-vis .fig-cap { position: absolute; right: 0; bottom: 0; max-width: 24ch; text-align: right; }
.fc-hero-vis .app-main { padding: 16px 20px 20px; }

.fc-float {
  position: absolute; z-index: 3; left: -48px; top: calc(100% - 196px); width: 340px;
  background: var(--card); border: 1px solid var(--rule-strong); border-radius: var(--r);
  padding: 12px 14px 10px; box-shadow: var(--shadow-float); font-size: 13px;
}
.fc-float .fields-h { gap: 10px; }
.fc-seal-hero {
  position: absolute; width: 132px; height: 132px; right: 12px; bottom: 44px; z-index: 2;
  background: radial-gradient(circle, var(--paper) 60%, transparent 61%); border-radius: 50%;
  transform: rotate(-12deg); filter: drop-shadow(0 10px 20px var(--fc-seal-drop));
}

.fc-top { align-items: start; }

/* Feed tweak: urgent safety row (attorney layer — routed to a human) */
.fc-urgent-row { background: linear-gradient(90deg, var(--accent-tint), transparent 80%); margin: 0 -10px; padding-left: 10px; padding-right: 10px; border-radius: 8px; }

/* Section helpers */
.fc-split { align-items: center; }
.fc-split-top { align-items: start; }
.fc-copy .h3 { margin-top: 14px; }
.fc-copy > p { color: var(--ink-2); margin-top: 16px; max-width: 52ch; }
.fc-copy .notes { margin-top: 28px; }
.fc-copy .flow { margin-top: 26px; }
.fc-fig .fig-cap { margin-top: 14px; }
.fc-wide { margin-top: var(--stack); }
.fc-figcap-out { margin-top: 14px; }

/* Small mono heading inside mockups */
.fc-k { font: 500 10.5px/1.2 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.fc-k-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 18px 0 8px; }

/* Matter types: ruled index (instead of a card grid) */
.fc-types { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: var(--stack); border-top: 1px solid var(--rule-ink); }
.fc-type { padding: 26px 26px 30px 0; border-bottom: 1px solid var(--rule); }
.fc-type:not(:nth-child(3n+1)) { padding-left: 26px; border-left: 1px solid var(--rule); }
.fc-type-n { font: 500 11px/1 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--accent); }
.fc-type h3 { font-family: var(--serif); font-size: clamp(24px, 2.2vw, 30px); line-height: 1.1; margin-top: 10px; }
.fc-type p { color: var(--ink-3); font-size: 15.5px; margin-top: 8px; max-width: 34ch; }
.fc-type .form-chips { margin-top: 14px; }
.fc-type .form-chips li { font-size: 11px; padding: 6px 8px; }


/* ==========================================================================
   B  Family law
   ========================================================================== */

/* Ingested statements */
.fc-files { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.fc-file { display: grid; grid-template-columns: 28px 1fr; gap: 2px 10px; align-items: center; padding: 10px; border: 1px solid var(--rule); border-radius: 8px; background: var(--paper); }
.fc-file-ico { grid-row: span 2; width: 28px; height: 34px; border: 1px solid var(--rule-strong); border-radius: 3px; background: var(--card); position: relative; }
.fc-file-ico::before, .fc-file-ico::after { content: ""; position: absolute; left: 5px; right: 5px; height: 2px; background: var(--rule); top: 10px; box-shadow: 0 5px 0 var(--rule), 0 10px 0 var(--rule); }
.fc-file-ico::after { top: auto; bottom: 4px; height: 0; box-shadow: none; }
.fc-file b { font: 500 11.5px/1.25 var(--mono); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.fc-file small { font-size: 11.5px; color: var(--muted); display: flex; gap: 6px; align-items: center; }
.fc-file small .ico { width: 11px; height: 11px; color: var(--ok); }

/* Category bars (monthly expenses) — single hue, labels direct */
.fc-bars { display: grid; gap: 7px; margin-top: 4px; }
.fc-bar { display: grid; grid-template-columns: 128px minmax(0, 1fr) 70px; gap: 10px; align-items: center; font-size: 12.5px; }
.fc-bar > span:first-child { color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fc-bar-track { height: 8px; border-radius: 2px; background: var(--paper-2); overflow: hidden; }
.fc-bar-track i { display: block; height: 100%; width: calc(var(--p, .5) * 100%); background: var(--agent); border-radius: 2px; }
.fc-bar .mono { text-align: right; font-size: 12px; }

/* Two-up panel inside a mockup */
.fc-two { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 22px; align-items: start; }
.fc-two > div { min-width: 0; }

/* Custody timeline: lanes by source */
.fc-lanes { position: relative; margin-top: 6px; }
.fc-lane { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 14px; align-items: center; height: 40px; border-bottom: 1px dashed var(--rule); }
.fc-lane-l { font: 500 10.5px/1.2 var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); display: flex; align-items: center; gap: 8px; }
.fc-lane-l .ico { width: 12px; height: 12px; color: var(--agent); }
.fc-track { position: relative; height: 100%; }
.fc-track::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: var(--rule-strong); }
.fc-track i { position: absolute; top: 50%; width: 11px; height: 11px; border-radius: 50%; background: var(--card); border: 1.5px solid var(--agent); transform: translate(-50%, -50%); }
.fc-track i.is-fill { background: var(--agent); }
.fc-track i.is-on { width: 15px; height: 15px; background: var(--agent); box-shadow: 0 0 0 4px var(--agent-tint); z-index: 1; }
.fc-track i.is-flag { background: var(--warn); border-color: var(--warn); box-shadow: 0 0 0 4px var(--warn-tint); }
.fc-axis { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 14px; margin-top: 8px; }
.fc-axis-m { display: flex; justify-content: space-between; font: 500 10.5px/1 var(--mono); letter-spacing: .08em; color: var(--muted); }
.fc-cursor { position: absolute; top: -6px; bottom: -6px; width: 0; border-left: 1.5px dashed var(--agent-2); }

.fc-events { margin-top: 18px; border-top: 1px solid var(--rule-ink); }
.fc-ev { display: grid; grid-template-columns: 112px minmax(0, 1fr) auto; gap: 14px; padding: 12px 0; border-bottom: 1px solid var(--rule-soft); align-items: baseline; font-size: 13.5px; }
.fc-ev time { font: 500 11.5px/1.3 var(--mono); color: var(--ink-3); }
.fc-ev p { color: var(--ink-2); }
.fc-ev q { font-family: var(--serif); font-size: 16.5px; color: var(--ink); }
.fc-ev.is-on { background: linear-gradient(90deg, var(--agent-tint), transparent 80%); margin: 0 -10px; padding-left: 10px; padding-right: 10px; border-radius: 6px; border-bottom-color: transparent; }
.fc-ev.is-flag time { color: var(--warn-ink); }
.fc-neutral { display: flex; gap: 8px; align-items: flex-start; margin-top: 14px; font-size: 12.5px; color: var(--ink-3); }
.fc-neutral .ico { color: var(--agent); margin-top: 3px; }

/* Parenting plan: two-week rotation grid */
.fc-week { display: grid; grid-template-columns: 56px repeat(7, minmax(0, 1fr)); gap: 4px; font: 500 10.5px/1 var(--mono); margin-top: 6px; }
.fc-week > span { display: grid; place-items: center; height: 30px; border-radius: 4px; }
.fc-week .wk-h { height: 20px; color: var(--muted); letter-spacing: .08em; }
.fc-week .wk-l { justify-items: start; color: var(--ink-3); letter-spacing: .06em; }
.fc-week .pa { width: auto; height: 30px; }
.fc-week .p-a { background: var(--fam-parent-a); color: var(--fam-parent-a-ink); }
.fc-week .p-b { background: var(--paper-3); color: var(--ink-3); box-shadow: inset 0 0 0 1px var(--rule-strong); }
.fc-legend { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 10px; font-size: 12px; color: var(--ink-3); }
.fc-legend span { display: inline-flex; align-items: center; gap: 6px; }
.fc-legend i { width: 12px; height: 12px; border-radius: 3px; }
.fc-legend .p-a { background: var(--fam-parent-a); }
.fc-legend .p-b { background: var(--paper-3); box-shadow: inset 0 0 0 1px var(--rule-strong); }

.fc-plan .doc-body { padding-top: 22px; font-size: 17px; }
.fc-plan .doc-body > p + p { margin-top: 10px; }
.fc-plan .doc-h { font: 500 10.5px/1.2 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); margin: 16px 0 6px; }
.fc-plan .doc-h:first-child { margin: 0 0 46px; } /* room for the source tooltip */

/* Redline (prenup) — agent-proposed changes are ink-blue; struck text muted */
.fc-redline { font: 16.5px/1.6 var(--serif); color: var(--ink); }
.fc-redline del { color: var(--muted); text-decoration-color: var(--muted); text-decoration-thickness: 1px; }
.fc-redline ins { text-decoration: none; background: var(--agent-tint); box-shadow: inset 0 -1.5px 0 var(--agent-2); padding: 0 2px; border-radius: 2px; }
.fc-clause-h { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 12px 0 8px; border-bottom: 1px solid var(--rule-ink); }
.fc-clause-h b { font-family: var(--serif); font-size: 20px; font-weight: 400; }
.fc-margin { display: flex; gap: 8px; align-items: flex-start; margin-top: 12px; padding: 10px 12px; border-left: 2px solid var(--agent); background: var(--paper); font-size: 12.5px; color: var(--ink-3); border-radius: 0 6px 6px 0; }
.fc-margin .mg { margin-top: -2px; }
.fc-clauses li { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--rule-soft); font-size: 13px; }
.fc-clauses li > .mono { color: var(--muted); font-size: 11px; }
.fc-clauses li.is-on { background: linear-gradient(90deg, var(--agent-tint), transparent); margin: 0 -10px; padding: 10px; border-radius: 6px; border-bottom-color: transparent; }
.fc-sched { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 14px; }
.fc-sched > div { padding: 10px 12px; border: 1px solid var(--rule); border-radius: 8px; background: var(--paper); }
.fc-sched b { display: block; font-family: var(--serif); font-size: 20px; font-weight: 400; line-height: 1.15; margin-top: 4px; }
.fc-sched small { font-size: 11.5px; color: var(--muted); }

/* Dark band: client message + safety routing */
.fc-msg { margin-top: 16px; border-radius: var(--r); background: var(--fc-msg-bg); color: var(--ink); box-shadow: 0 0 0 1px var(--fc-msg-edge); }
.fc-msg .doc-bar, .fc-msg .doc-foot { border-color: var(--fc-msg-line); }
.fc-msg .btn-ui-ghost { background: transparent; color: var(--ink); border-color: var(--rule-strong); }
.fc-msg-body { padding: 18px; font-size: 15px; line-height: 1.6; }
.fc-msg-body p + p { margin-top: 10px; }
.fc-msg-meta { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 18px 14px; }
.fc-safety { display: grid; grid-template-columns: 30px 1fr auto; gap: 12px; align-items: center; padding: 12px; border-radius: var(--r); background: var(--fam-safety-bg); box-shadow: inset 0 0 0 1px var(--fam-safety-line); }
.fc-safety b { font-weight: 500; }
.fc-safety .pill { background: var(--fam-safety-pill); color: var(--fam-safety-pill-ink); }
.app-dark .fc-safety .muted { color: var(--night-text-3); }


/* ==========================================================================
   C  Criminal defense
   ========================================================================== */

/* Production index (hero) */
.fc-prod td:first-child { white-space: nowrap; }
.fc-prod td:first-child .ico { margin-right: 8px; }
.fc-prod .ico { width: 13px; height: 13px; color: var(--agent); }
.fc-prod .bar { margin-top: 5px; max-width: 120px; }
.fc-prod-foot { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px 14px; align-items: center; margin-top: 14px; }

/* Bates index + missing discovery */
.fc-bates td:first-child { white-space: nowrap; }
.fc-bates td p { font-size: 12.5px; color: var(--ink-3); margin-top: 2px; }
.fc-bates .chips { margin-top: 6px; }
.fc-missing { margin-top: 16px; border: 1px dashed var(--warn); border-radius: var(--r); padding: 12px 14px; background: color-mix(in srgb, var(--warn-tint) 55%, transparent); }
.fc-missing-h { display: flex; align-items: center; gap: 8px; font-weight: 600; font-size: 13.5px; color: var(--warn-ink); }
.fc-missing-h .ico { color: var(--warn); }
.fc-missing li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 9px 0; border-bottom: 1px solid var(--warn-line); font-size: 13px; }
.fc-missing li:last-child { border-bottom: 0; padding-bottom: 2px; }
.fc-missing li span:first-child small { display: block; color: var(--ink-3); font-size: 12px; margin-top: 2px; }

/* Video frame (body-cam) */
.fc-video-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 20px; align-items: start; }
.fc-video-grid > div { min-width: 0; }
.fc-frame {
  position: relative; aspect-ratio: 16 / 9; border-radius: 8px; overflow: hidden;
  background:
    radial-gradient(120% 90% at 70% 40%, var(--crim-frame-glow), transparent 60%),
    radial-gradient(60% 50% at 25% 75%, var(--crim-frame-warm), transparent 70%),
    linear-gradient(180deg, var(--crim-frame-top), var(--crim-frame-bottom));
  box-shadow: inset 0 0 0 1px var(--crim-frame-edge);
}
.fc-frame::before { /* scanlines */
  content: ""; position: absolute; inset: 0;
  background: repeating-linear-gradient(0deg, var(--crim-scanline) 0 1px, transparent 1px 3px);
}
.fc-frame::after { /* abstract scene: headlights + vehicle silhouette */
  content: ""; position: absolute; left: 18%; right: 30%; bottom: 18%; height: 26%;
  border-radius: 40% 40% 10% 10%; background: var(--crim-vehicle);
  box-shadow: -40px 10px 30px -10px var(--crim-headlight), 140px 10px 30px -10px var(--crim-headlight-2);
}
.fc-hud { position: absolute; z-index: 1; font: 500 10.5px/1.3 var(--mono); letter-spacing: .06em; color: var(--crim-hud); }
.fc-hud-tl { top: 10px; left: 12px; }
.fc-hud-tr { top: 10px; right: 12px; text-align: right; }
.fc-hud-bl { bottom: 10px; left: 12px; display: inline-flex; align-items: center; gap: 6px; }
.fc-rec { width: 7px; height: 7px; border-radius: 50%; background: var(--accent-bright); }
.fc-caption { position: absolute; z-index: 1; left: 50%; bottom: 14px; transform: translateX(-50%); max-width: 80%; padding: 5px 10px; border-radius: 4px; background: var(--crim-caption-bg); color: var(--crim-caption-ink); font-size: 12.5px; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fc-scrub { position: relative; height: 26px; margin-top: 10px; border-radius: 6px; background: var(--paper-2); overflow: hidden; }
.fc-scrub i { position: absolute; top: 5px; bottom: 5px; width: 3px; border-radius: 2px; background: var(--agent); transform: translateX(-50%); }
.fc-scrub i.hit { background: var(--warn); width: 4px; }
.fc-scrub b { position: absolute; top: 0; bottom: 0; width: 2px; background: var(--accent-bright); }
.fc-scrub-l { display: flex; justify-content: space-between; margin-top: 4px; }

.fc-search { display: flex; align-items: center; gap: 8px; height: 36px; padding: 0 12px; border: 1px solid var(--rule-strong); border-radius: 8px; background: var(--paper); font-size: 13px; }
.fc-search .ico { color: var(--muted); }
.fc-search b { font-weight: 500; }
.fc-search .pill { margin-left: auto; }
.fc-hits li { padding: 10px 0; border-bottom: 1px solid var(--rule-soft); font-size: 13px; }
.fc-hits li > div { display: flex; justify-content: space-between; gap: 10px; align-items: center; }
.fc-hits p { margin-top: 4px; color: var(--ink-2); }
.fc-hits mark { background: var(--warn-tint); box-shadow: inset 0 -1.5px 0 var(--warn); color: var(--ink); padding: 0 1px; }

/* Synced sources strip */
.fc-sync { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--rule); }
.fc-sync .fc-lane { height: 34px; grid-template-columns: 96px minmax(0, 1fr); }
.fc-sync .fc-axis { grid-template-columns: 96px minmax(0, 1fr); }
.fc-seg { position: absolute; top: 50%; height: 10px; width: calc(var(--p, .5) * 100%); transform: translateY(-50%); border-radius: 3px; background: var(--agent-line); }
.fc-seg.alt { background: var(--agent); }

/* Report vs. video compare */
.fc-compare { display: grid; grid-template-columns: minmax(0, 1fr) 170px minmax(0, 1fr); gap: 0; align-items: center; margin-top: var(--stack); }
.fc-report { position: relative; color: var(--ink); background: var(--paper-obj); border: 1px solid var(--rule); border-radius: 3px; padding: 22px 24px 26px; box-shadow: var(--crim-report-shadow); transform: rotate(-1.2deg); }
.fc-report .notice-h { margin-bottom: 4px; }
.fc-report-p { font: 16.5px/1.55 var(--serif); margin-top: 12px; color: var(--paper-obj-ink); }
.fc-report-p mark { background: linear-gradient(transparent 55%, var(--warn-tint) 55%); box-shadow: 0 1.5px 0 var(--warn); color: var(--ink); padding: 0 1px; }
.fc-pg { position: absolute; right: 16px; bottom: 10px; font: 500 10.5px/1 var(--mono); color: var(--muted); }
.fc-gap { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; padding: 0 10px; }
.fc-gap svg { width: 150px; height: 18px; color: var(--warn); }
.fc-gap-n { font: 54px/.9 var(--serif); color: var(--warn-ink); }
.fc-gap-l { font: 500 10.5px/1.3 var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--warn-ink); }
.fc-clip { transform: rotate(1deg); }
.fc-clip .transcript { margin-top: 10px; }
.fc-flag-card { margin-top: 26px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 16px 20px; border-radius: var(--r); border: 1px solid var(--warn-line); background: var(--warn-tint); }
.fc-flag-card b { color: var(--warn-ink); }
.fc-flag-card p { font-size: 14.5px; color: var(--ink-2); margin-top: 3px; }

.fc-flags { margin-top: 18px; }
.fc-flags li { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: 10px; align-items: start; padding: 13px 0; border-bottom: 1px solid var(--rule); font-size: 14.5px; }
.fc-flags li .ico { color: var(--warn); margin-top: 3px; }
.fc-flags small { display: block; font-size: 12.5px; color: var(--muted); margin-top: 3px; }

/* Unified timeline (vertical) */
.fc-utl { position: relative; margin-top: 4px; }
.fc-utl::before { content: ""; position: absolute; left: 87px; top: 8px; bottom: 8px; width: 1px; background: var(--rule-strong); }
.fc-utl li { position: relative; display: grid; grid-template-columns: 64px 22px minmax(0, 1fr); gap: 0 12px; padding: 9px 0; font-size: 13px; align-items: start; }
.fc-utl time { font: 500 11.5px/1.5 var(--mono); color: var(--ink-3); text-align: right; }
.fc-utl li > i { width: 9px; height: 9px; border-radius: 50%; background: var(--card); border: 1.5px solid var(--agent); margin: 5px 0 0 6px; position: relative; z-index: 1; }
.fc-utl li.is-flag > i { background: var(--warn); border-color: var(--warn); box-shadow: 0 0 0 4px var(--warn-tint); }
.fc-utl li.is-flag time { color: var(--warn-ink); }
.fc-utl p { color: var(--ink-2); }
.fc-utl .src-chip { margin-top: 5px; }

/* Issues (research) */
.fc-issues li { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--rule-soft); align-items: start; }
.fc-issues b { font-weight: 600; font-size: 14px; }
.fc-issues p { font-size: 13px; color: var(--ink-3); margin-top: 3px; }
.fc-cite { display: inline-flex; align-items: center; gap: 5px; margin-top: 7px; font: 500 11px/1.3 var(--mono); color: var(--agent); border-bottom: 1px solid var(--agent-line); }
.fc-cite .ico { width: 11px; height: 11px; }
.fc-cite.unv { color: var(--warn-ink); border-bottom-color: var(--warn-line); }

/* Motion draft: leave room above the first sourced phrase for its tooltip */
.fc-motion .doc-body { padding-top: 22px; }
.fc-motion .doc-re { margin-bottom: 48px; }

/* Speedy-trial clock */
.fc-clock { margin-top: 6px; }
.fc-clock-bar { display: flex; height: 16px; border-radius: 4px; overflow: hidden; background: var(--paper-2); box-shadow: inset 0 0 0 1px var(--rule); }
.fc-clock-bar i { flex: var(--p) 0 0; height: 100%; }
.fc-clock-bar .el { background: var(--agent); }
.fc-clock-bar .ex { background: repeating-linear-gradient(135deg, var(--agent-line) 0 4px, transparent 4px 8px); box-shadow: inset 1px 0 0 var(--card), inset -1px 0 0 var(--card); }
.fc-clock-bar .rm { background: transparent; }
.fc-clock-k { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 10px; font-size: 12px; color: var(--ink-3); }
.fc-clock-k span { display: inline-flex; align-items: center; gap: 6px; }
.fc-clock-k i { width: 12px; height: 8px; border-radius: 2px; }
.fc-clock-k .el { background: var(--agent); }
.fc-clock-k .ex { background: repeating-linear-gradient(135deg, var(--agent-line) 0 3px, transparent 3px 6px); box-shadow: inset 0 0 0 1px var(--agent-line); }
.fc-clock-k .rm { background: var(--paper-2); box-shadow: inset 0 0 0 1px var(--rule); }
.fc-clock-big { display: flex; align-items: baseline; gap: 12px; margin-bottom: 12px; }
.fc-clock-big b { font: 400 54px/1 var(--serif); letter-spacing: -.02em; }
.fc-clock-big span { color: var(--ink-3); font-size: 14px; }
.fc-excl { margin-top: 14px; border-top: 1px solid var(--rule); }
.fc-excl li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--rule-soft); font-size: 13px; align-items: center; }

/* Dark band: privilege-aware family update */
.fc-priv { display: flex; gap: 8px; align-items: flex-start; margin: 0 18px 14px; padding: 9px 12px; border-radius: 7px; background: var(--agent-tint); border: 1px solid var(--agent-line); font-size: 12.5px; color: var(--agent); }
.fc-priv .ico { margin-top: 2px; }


/* ==========================================================================
   D  Responsive
   ========================================================================== */
@media (max-width: 1180px) {
  .fc-float { left: -16px; }
  .fc-compare { grid-template-columns: minmax(0, 1fr) 120px minmax(0, 1fr); }
  .fc-gap svg { width: 100px; }
  .fc-video-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 980px) {
  .fc-hero .h1 { max-width: 14ch; }
  .fc-hero-vis { margin: 8px 0 0 36px; }
  .fc-float { left: -36px; }
  .fc-types { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fc-type:not(:nth-child(3n+1)) { padding-left: 0; border-left: 0; }
  .fc-type:nth-child(2n) { padding-left: 26px; border-left: 1px solid var(--rule); }
  .fc-compare { grid-template-columns: minmax(0, 1fr); max-width: 640px; gap: 18px; }
  .fc-gap { flex-direction: row; justify-content: center; gap: 14px; padding: 6px 0; }
  .fc-gap svg { transform: rotate(90deg); width: 40px; }
  .fc-two { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 720px) {
  .fc-hero-vis { margin: 28px 0 0; padding-bottom: 0; }
  .fc-hero-vis .fig-cap { position: static; text-align: left; margin-top: 14px; max-width: none; }
  .fc-hero-vis .app-main { padding: 14px; }
  .fc-float { position: relative; left: auto; top: auto; width: auto; max-width: 360px; margin: 10px 8px 0 18px; }
  .fc-seal-hero { display: none; }
  .fc-urgent-row { margin: 0 -6px; padding-left: 6px; padding-right: 6px; }
  .fc-urgent-row .pill { display: none; }

  .fc-types { grid-template-columns: minmax(0, 1fr); }
  .fc-type, .fc-type:nth-child(2n), .fc-type:not(:nth-child(3n+1)) { padding: 22px 0 24px; border-left: 0; }

  .fc-files { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
  .fc-file { grid-template-columns: minmax(0, 1fr); padding: 8px 9px; }
  .fc-file-ico { display: none; }
  .fc-file b { font-size: 10.5px; }
  .fc-file small { font-size: 11px; }
  .fc-plan .doc-h:first-child { margin-bottom: 62px; }
  .fc-bar { grid-template-columns: 100px minmax(0, 1fr) 62px; gap: 8px; }
  .fc-lane, .fc-axis { grid-template-columns: 64px minmax(0, 1fr); gap: 8px; }
  .fc-sync .fc-lane, .fc-sync .fc-axis { grid-template-columns: 64px minmax(0, 1fr); }
  .fc-lane-l { font-size: 9.5px; letter-spacing: .04em; }
  .fc-lane-l .ico { display: none; }
  .fc-ev { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .fc-ev .src-chip { justify-self: start; }
  .fc-week { grid-template-columns: 40px repeat(7, minmax(0, 1fr)); gap: 3px; font-size: 9.5px; }
  .fc-week > span { height: 26px; }
  .fc-week .wk-h { height: 16px; }
  .fc-sched { grid-template-columns: minmax(0, 1fr); }
  .fc-clauses li { grid-template-columns: 28px minmax(0, 1fr); }
  .fc-clauses li .pill { grid-column: 2; justify-self: start; }
  .fc-safety { grid-template-columns: 26px 1fr; }
  .fc-safety .pill { grid-column: 2; justify-self: start; }

  .fc-bates th:nth-child(3), .fc-bates td:nth-child(3) { display: none; }
  .fc-prod th:nth-child(3), .fc-prod td:nth-child(3) { display: none; }
  .fc-missing li { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .fc-missing li .pill { justify-self: start; }
  .fc-caption { font-size: 11px; max-width: 90%; }
  .fc-caption { bottom: 30px; }
  .fc-search .pill, .fc-sync .fc-k-row > .mono { display: none; }
  .fc-search { height: auto; min-height: 36px; padding: 8px 12px; }
  .fc-hud { font-size: 9px; }
  .fc-report { padding: 18px 18px 26px; transform: none; }
  .fc-clip { transform: none; }
  .fc-flag-card { grid-template-columns: minmax(0, 1fr); }
  .fc-flags li { grid-template-columns: 22px minmax(0, 1fr); }
  .fc-flags li .pill { grid-column: 2; justify-self: start; }
  .fc-issues li { grid-template-columns: 26px minmax(0, 1fr); }
  .fc-issues li > .pill { grid-column: 2; justify-self: start; }
  .fc-issues .mg { width: 26px; height: 26px; font-size: 9px; }
  .fc-utl li { grid-template-columns: 54px 20px minmax(0, 1fr); gap: 0 8px; }
  .fc-utl::before { left: 73px; }
  .fc-clock-big b { font-size: 44px; }
  .fc-motion .doc-body { padding-top: 20px; }
  .fc-motion .doc-re { margin-bottom: 62px; }
  .fc-motion .srcpop, .fc-plan .srcpop { left: -4px; right: auto; }
  .fc-motion .srcpop::after, .fc-plan .srcpop::after { left: 18px; right: auto; }
}