:root{
    --font: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, Roboto, "Helvetica Neue", Arial, sans-serif;
    --z-rail:5; --z-day:10; --z-topbar:20; --z-filter:18; --z-search:30; --z-backdrop:40; --z-dialog:50;
    --tl:760px; --ease:cubic-bezier(.22,.61,.36,1);
    --evw:405px; /* events side-panel reserved width */
  }
  html[data-theme="dark"]{
    --bg:#0b0b0d; --bg-grad:#101013; --surface:#151517; --surface-2:#1e1e22; --surface-3:#26262b; --hair:rgba(255,255,255,.09);
    --bubble-them:#262629; --ink-them:#ededf0;
    --ink:#ececef; --muted:#9b9ba4; --faint:#74747c;
    --time-them:#a2a2ab; --time-me:rgba(255,255,255,.74);
    --pill:rgba(255,255,255,.08); --pill-ink:#c7c7cf;
    --signal:#5a90ff; --sms:#33c86b; --email:#f0a54a; --event:#a98bff;
    --whatsapp:#22b05e; --imessage:#3f7bf5; --messenger:#c05ae0; --other:#8f97a3;
    --signal-bubble:#2b62d9; --sms-bubble:#177f3f;
    --amber:#e6a94a; --mark:#ffd54a; --mark-ink:#1a1400;
    --gaslight:#e0794e; --gaslight-bg:rgba(224,121,78,.13); --gaslight-line:rgba(224,121,78,.42);
    --threat:#e05563; --threat-bg:rgba(224,85,99,.13); --threat-line:rgba(224,85,99,.42);
    --avatar-bg:#d7e6ee; --avatar-ink:#1f6f8b;
    --shadow:0 1px 2px rgba(0,0,0,.4); --shadow-lg:0 24px 60px rgba(0,0,0,.55);
  }
  html[data-theme="light"]{
    --bg:#eef0f3; --bg-grad:#f6f7f9; --surface:#ffffff; --surface-2:#e9ebef; --surface-3:#dfe2e7; --hair:rgba(0,0,0,.10);
    --bubble-them:#e5e6ea; --ink-them:#15161a;
    --ink:#15161a; --muted:#585b62; --faint:#8a8d95;
    --time-them:#6c6f77; --time-me:rgba(255,255,255,.82);
    --pill:rgba(0,0,0,.06); --pill-ink:#4a4d54;
    --signal:#1f52c8; --sms:#1a8f49; --email:#b5731a; --event:#6d4fd0;
    --whatsapp:#178a47; --imessage:#2557c0; --messenger:#9438b5; --other:#6b7280;
    --signal-bubble:#2b62d9; --sms-bubble:#137a3a;
    --amber:#8a5a00; --mark:#ffe08a; --mark-ink:#3a2c00;
    --gaslight:#bf5a2c; --gaslight-bg:rgba(191,90,44,.10); --gaslight-line:rgba(191,90,44,.34);
    --threat:#bc3644; --threat-bg:rgba(188,54,68,.10); --threat-line:rgba(188,54,68,.34);
    --avatar-bg:#cfe2ec; --avatar-ink:#1f6f8b;
    --shadow:0 1px 2px rgba(0,0,0,.10); --shadow-lg:0 24px 60px rgba(0,0,0,.22);
  }
  *{box-sizing:border-box}
  html{scroll-behavior:auto} /* instant: content loads on the fly, smooth scroll fights it */
  html.noSmooth{scroll-behavior:auto}
  body{margin:0; font-family:var(--font); background:var(--bg); color:var(--ink); -webkit-font-smoothing:antialiased; line-height:1.45}

  /* ---------- top bar ---------- */
  .topbar{position:sticky; top:0; z-index:var(--z-topbar); display:flex; align-items:center; gap:12px;
    padding:10px 16px; background:color-mix(in srgb, var(--surface) 84%, transparent);
    backdrop-filter:saturate(1.4) blur(18px); -webkit-backdrop-filter:saturate(1.4) blur(18px); border-bottom:1px solid var(--hair)}
  .mark-dot{width:34px;height:34px;border-radius:10px;flex:0 0 auto;background:linear-gradient(135deg,var(--event),var(--signal));display:grid;place-items:center}
  .mark-dot svg{width:20px;height:20px;color:#fff}
  .who{display:flex;flex-direction:column;min-width:0;margin-right:auto}
  .who .name{font-weight:650;font-size:16px;letter-spacing:-.01em;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .who .sub{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .actions{display:flex;align-items:center;gap:4px}
  .btn{appearance:none;border:0;background:transparent;color:var(--muted);font:inherit;border-radius:10px;cursor:pointer;transition:background .16s var(--ease),color .16s var(--ease)}
  .iconbtn{width:38px;height:38px;display:grid;place-items:center}
  .iconbtn:hover,.btn:hover{background:var(--surface-2);color:var(--ink)}
  .btn:focus-visible,.chip:focus-visible,.strack:focus-visible{outline:2px solid var(--signal);outline-offset:2px}
  .iconbtn svg{width:20px;height:20px}
  .iconbtn.on{color:var(--signal)}
  .addbtn{display:inline-flex;align-items:center;gap:7px;padding:0 14px;height:38px;background:var(--event);color:#fff;font-weight:600;font-size:13.5px}
  .addbtn:hover{background:var(--event);filter:brightness(1.08);color:#fff}
  .addbtn svg{width:17px;height:17px}
  @media (max-width:620px){ .addbtn span{display:none} .addbtn{padding:0;width:38px;justify-content:center} }
  /* ---------- primary navigation: inline labelled tabs ---------- */
  .navtabs{display:flex;align-items:center;gap:3px;flex-wrap:wrap}
  .navtab{display:inline-flex;align-items:center;gap:7px;padding:8px 12px;border-radius:10px;
    color:var(--muted);font-size:13.5px;font-weight:560;text-decoration:none;white-space:nowrap;
    border:1px solid transparent;transition:background .16s var(--ease),color .16s var(--ease),border-color .16s var(--ease)}
  .navtab svg{width:17px;height:17px;flex:0 0 auto}
  .navtab:hover{background:var(--surface-2);color:var(--ink)}
  .navtab.on{color:var(--signal);background:color-mix(in srgb,var(--signal) 13%,transparent);
    border-color:color-mix(in srgb,var(--signal) 32%,transparent)}
  .navtab-out{color:var(--faint)}
  .navtab-out span{display:none}
  @media (max-width:1080px){ .navtab span{display:none} .navtab{padding:8px} }

  @media (max-width:540px){
    .topbar{gap:6px;padding:9px 8px 9px 12px}
    .iconbtn{width:36px;height:36px}
    .addbtn{width:36px;height:36px}
    .who .name{font-size:15px}
  }

  /* ---------- filter bar ---------- */
  .filterbar{position:sticky;top:59px;z-index:var(--z-filter);display:flex;align-items:center;gap:10px;flex-wrap:wrap;
    padding:8px 16px;background:color-mix(in srgb, var(--surface) 80%, transparent);
    backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--hair)}
  .chips{display:flex;gap:6px;flex-wrap:wrap}
  .chip{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--hair);background:transparent;color:var(--pill-ink);
    font:inherit;font-size:12.5px;padding:5px 11px;border-radius:999px;cursor:pointer;white-space:nowrap;
    transition:border-color .16s var(--ease),background .16s var(--ease),color .16s var(--ease),opacity .16s}
  .chip .cdot{width:9px;height:9px;border-radius:50%;background:var(--c,var(--muted))}
  .chip .cn{color:var(--faint);font-variant-numeric:tabular-nums}
  .chip[aria-pressed="true"]{border-color:color-mix(in srgb,var(--c) 55%,var(--hair));background:color-mix(in srgb,var(--c) 15%,transparent);color:var(--ink)}
  .chip[aria-pressed="false"]{opacity:.5}
  .chip[aria-pressed="false"] .cdot{background:var(--muted)}
  .jump{margin-left:auto;display:flex;align-items:center;gap:8px}
  .jump select{font:inherit;font-size:12.5px;background:var(--surface-2);color:var(--ink);border:1px solid var(--hair);border-radius:8px;padding:6px 8px;max-width:160px;display:none}
  @media (max-width:900px){ .jump select{display:inline-block} }

  /* ---------- timeline filter (date range + contains text) ---------- */
  .filterrow{display:flex;align-items:center;gap:8px;flex-wrap:wrap;width:100%}
  .filterrow input[type=date]{font:inherit;font-size:12.5px;background:var(--surface-2);color:var(--ink);
    border:1px solid var(--hair);border-radius:8px;padding:6px 9px;color-scheme:dark light}
  .filterrow .fdash{color:var(--faint);font-size:12px}
  .finp{display:inline-flex;align-items:center;gap:6px;flex:1 1 170px;min-width:130px;
    background:var(--surface-2);border:1px solid var(--hair);border-radius:8px;padding:0 9px}
  .finp svg{width:14px;height:14px;color:var(--muted);flex:0 0 auto}
  .finp input{flex:1;min-width:0;font:inherit;font-size:13px;background:transparent;border:0;color:var(--ink);padding:7px 0;outline:none}
  .finp .fmode{flex:0 0 auto;font:inherit;font-size:12px;color:var(--muted);background:transparent;border:0;
    border-right:1px solid var(--hair);padding:0 8px 0 2px;margin-right:2px;outline:none;cursor:pointer;
    -webkit-appearance:menulist-button;appearance:auto}
  .finp .fmode:focus{color:var(--ink)}
  .filterrow input[type=date]:focus,.finp:focus-within{outline:2px solid var(--signal);outline-offset:1px}
  /* active-filter accent: a value present in any input tints its border */
  .filterrow input[type=date]:valid:not([value=""]),
  .finp:has(input:not(:placeholder-shown)){border-color:color-mix(in srgb,var(--signal) 55%,var(--hair))}
  .ctxstep{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:var(--muted)}
  .ctxstep[hidden]{display:none}
  .ctxstep .ctxlab{color:var(--faint)}
  .ctxstep button{width:22px;height:22px;border-radius:6px;border:1px solid var(--hair);background:var(--surface-2);
    color:var(--ink);cursor:pointer;font-size:14px;line-height:1;display:grid;place-items:center}
  .ctxstep button:hover{background:var(--surface-3)}
  .ctxstep b{min-width:16px;text-align:center;color:var(--ink);font-variant-numeric:tabular-nums}
  .filterrow .fbtn{font:inherit;font-size:12px;color:var(--muted);border:1px solid var(--hair);
    border-radius:8px;padding:6px 11px;background:transparent;cursor:pointer}
  .filterrow .fbtn:hover{color:var(--ink);border-color:var(--signal)}
  .filterrow .fbtn[hidden]{display:none}
  /* match navigator: ◀ n/total ▶ */
  .matchnav{margin-left:auto;display:inline-flex;align-items:center;gap:4px}
  .matchnav[hidden]{display:none}
  .matchnav button{width:26px;height:26px;flex:0 0 auto;display:grid;place-items:center;border:1px solid var(--hair);
    border-radius:7px;background:var(--surface-2);color:var(--muted);cursor:pointer;
    transition:background .16s var(--ease),color .16s var(--ease),opacity .16s}
  .matchnav button:hover:not(:disabled){background:var(--surface-3);color:var(--ink)}
  .matchnav button:disabled{opacity:.4;cursor:default}
  .matchnav button svg{width:15px;height:15px}
  .matchnav #matchPos{min-width:52px;text-align:center;font-size:12px;color:var(--signal);
    font-variant-numeric:tabular-nums;white-space:nowrap}

  /* AI search mode: segmented contains·word·AI slider, ask/history chrome, reasons */
  .seg{display:inline-flex;border:1px solid var(--hair);border-radius:8px;overflow:hidden}
  .seg label{position:relative;cursor:pointer}
  .seg input{position:absolute;opacity:0;pointer-events:none}
  .seg span{display:block;padding:4px 10px;font-size:12px;color:var(--muted);user-select:none}
  .seg label:has(input:checked) span{background:var(--signal);color:#fff}
  .seg label:focus-within span{outline:2px solid var(--signal);outline-offset:-2px}
  .aiprog{font-size:12px;color:var(--muted);white-space:nowrap}
  .aihist{position:relative;display:inline-block}
  .aihist-menu{position:absolute;right:0;top:calc(100% + 4px);z-index:40;min-width:260px;max-height:320px;
    overflow:auto;background:var(--surface-2);border:1px solid var(--hair);border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.4)}
  .aihist-menu[hidden]{display:none}
  .aihist-menu button{display:block;width:100%;text-align:left;padding:8px 10px;font-size:12px;color:var(--ink);
    background:none;border:0;border-bottom:1px solid var(--hair);cursor:pointer}
  .aihist-menu button:hover{background:var(--signal);color:#fff}
  .aihist-menu .ahq{display:block;font-weight:600}
  .aihist-menu .ahm{opacity:.7}
  .airz{font-size:12px;color:var(--signal);margin:2px 0 8px 6px;font-style:italic}

  /* the currently-focused match in the navigator */
  .row.match-active .bubble,.email.match-active{outline:2px solid var(--signal);outline-offset:2px}
  mark.hl.on{background:var(--signal);color:#fff}

  /* filtered thread: context band around a run of messages, dimmed non-matches */
  .band{position:relative;border:1px dashed color-mix(in srgb,var(--signal) 34%,transparent);
    border-radius:12px;padding:20px 12px 10px;margin:14px 0;background:color-mix(in srgb,var(--signal) 4%,transparent)}
  .band-lab{position:absolute;top:-9px;left:14px;font-size:10px;font-weight:600;color:var(--signal);
    background:var(--bg);padding:1px 8px;border-radius:6px;border:1px solid color-mix(in srgb,var(--signal) 30%,transparent)}
  .row.ctx .bubble{opacity:.55}
  mark.hl{background:var(--mark);color:var(--mark-ink);border-radius:3px;padding:0 3px}

  /* ---------- layout ---------- */
  .layout{display:grid;grid-template-columns:minmax(0,var(--tl));justify-content:center;padding:8px 20px 60px}
  @media (max-width:900px){ .layout{padding:4px 12px 60px} }

  /* ---------- edge timescale (detail-in-context fisheye) ----------
     A time axis of the whole span whose middle expands the ~5-week window around
     the reading position to day resolution; the rest compresses into thin context
     bands. Built + repositioned on scroll by scrubber.js from the nav-histogram. */
  /* top is refined at runtime by scrubber.js to sit just below the (variable
     height) filter bar; this value is the pre-JS fallback for the two-row bar. */
  .scrubber{position:fixed;top:150px;right:14px;bottom:18px;width:178px;z-index:var(--z-filter);
    pointer-events:none;user-select:none}
  @media (max-width:1200px){ .scrubber{width:132px} }
  @media (max-width:900px){ .scrubber{display:none} }
  .scrubber .strack{position:relative;height:100%;pointer-events:auto;cursor:crosshair;-webkit-tap-highlight-color:transparent}
  .scrubber .saxis{position:absolute;top:0;bottom:0;right:12px;width:1px;background:var(--hair);pointer-events:none}
  .scrubber .sband{position:absolute;left:0;right:7px;border-radius:8px;pointer-events:none;
    background:color-mix(in srgb,var(--signal) 8%,transparent);
    border-top:1px solid color-mix(in srgb,var(--signal) 26%,transparent);
    border-bottom:1px solid color-mix(in srgb,var(--signal) 26%,transparent)}
  .scrubber .sden{position:absolute;right:12px;display:flex;justify-content:flex-end;transform:translateY(-50%);pointer-events:none}
  .scrubber .sden i{display:block;border-radius:2px;opacity:.85}
  .scrubber .sctxlab{position:absolute;right:20px;transform:translateY(-50%);font-size:10px;color:var(--faint);white-space:nowrap;
    background:var(--bg);padding:0 3px;font-variant-numeric:tabular-nums;pointer-events:none}
  .scrubber .sctxlab.year{color:var(--ink);font-weight:700}
  .scrubber .sday{position:absolute;right:12px;height:0;pointer-events:none}
  .scrubber .sday i{position:absolute;right:0;top:0;width:6px;height:1px;background:var(--hair);transform:translateY(-50%)}
  .scrubber .sday.major i{width:11px;background:color-mix(in srgb,var(--muted) 55%,transparent)}
  .scrubber .sday span{position:absolute;right:15px;top:0;transform:translateY(-50%);font-size:10px;color:var(--muted);
    white-space:nowrap;background:var(--bg);padding:0 3px;font-variant-numeric:tabular-nums}
  .scrubber .sday.major span{color:var(--ink);font-weight:650}
  /* event dot rides the axis at the true day; the label is a separate, de-clumped chip */
  .scrubber .snotch{position:absolute;right:12px;transform:translate(50%,-50%);width:9px;height:9px;border-radius:50%;
    background:var(--event);border:2px solid var(--bg);cursor:pointer;z-index:4}
  .scrubber .snotch.dim{width:7px;height:7px;opacity:.72}
  .scrubber .sleaders{position:absolute;inset:0;pointer-events:none;overflow:visible;z-index:3}
  .scrubber .sleaders path{fill:none;stroke:color-mix(in srgb,var(--event) 55%,transparent);stroke-width:1.25}
  .scrubber .slabel{position:absolute;right:24px;transform:translateY(-50%);max-width:calc(100% - 32px);white-space:nowrap;
    overflow:hidden;text-overflow:ellipsis;font-size:10px;font-weight:600;color:var(--ink);background:var(--bg);
    border:1px solid var(--hair);border-radius:6px;padding:2px 7px;cursor:pointer;z-index:4;box-shadow:var(--shadow)}
  .scrubber .slabel .dt{color:var(--faint);font-weight:600;margin-right:5px;font-variant-numeric:tabular-nums}
  .scrubber .slabel:hover{z-index:9;border-color:color-mix(in srgb,var(--event) 45%,var(--hair))}
  .scrubber .sclust{position:absolute;right:12px;transform:translate(50%,-50%);min-width:17px;height:16px;padding:0 4px;
    border-radius:8px;background:var(--event);color:#fff;font-size:9.5px;font-weight:800;display:flex;align-items:center;
    justify-content:center;border:2px solid var(--bg);cursor:pointer;z-index:5;box-shadow:var(--shadow);font-variant-numeric:tabular-nums}
  .scrubber .sclust:hover{filter:brightness(1.08)}
  .scrubber .scursor{position:absolute;left:0;right:0;height:0;pointer-events:none;z-index:5}
  .scrubber .scursor::before{content:"";position:absolute;left:0;right:7px;top:0;height:2px;transform:translateY(-50%);
    background:linear-gradient(to left,var(--signal),color-mix(in srgb,var(--signal) 8%,transparent))}
  .scrubber .scursor b{position:absolute;right:20px;top:0;transform:translateY(-50%);font-size:10px;font-weight:700;color:#fff;
    background:var(--signal);padding:1px 6px;border-radius:6px;white-space:nowrap;box-shadow:0 2px 8px rgba(0,0,0,.4);font-variant-numeric:tabular-nums}
  .scrubber[data-drag] .strack{cursor:grabbing}
  /* persistent overlay: hover read-out (A) + resize grips (B) */
  .scrubber .soverlay{position:absolute;inset:0;pointer-events:none}
  .scrubber .shoverline{position:absolute;left:0;right:7px;height:0;opacity:0;z-index:6}
  .scrubber .shoverline::before{content:"";position:absolute;left:0;right:0;top:0;height:0;transform:translateY(-50%);
    border-top:1px dashed color-mix(in srgb,var(--ink) 40%,transparent)}
  .scrubber[data-hover] .shoverline{opacity:1}
  .scrubber .sreadout{position:absolute;right:34px;transform:translate(-100%,-50%);opacity:0;transition:opacity .1s var(--ease);z-index:12;
    background:var(--surface);border:1px solid var(--hair);border-radius:10px;box-shadow:var(--shadow-lg);padding:7px 11px;white-space:nowrap;min-width:132px}
  .scrubber[data-hover] .sreadout{opacity:1}
  .scrubber .sreadout b{display:block;font-size:13px;font-weight:650;color:var(--ink);letter-spacing:-.01em;font-variant-numeric:tabular-nums}
  .scrubber .sreadout small{display:block;font-size:11px;color:var(--muted);margin-top:2px;font-variant-numeric:tabular-nums}
  .scrubber .sreadout em{display:inline-block;margin-top:5px;font-style:normal;font-size:9.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
    color:var(--signal);background:color-mix(in srgb,var(--signal) 15%,transparent);border-radius:5px;padding:1px 6px}
  .scrubber .sreadout::after{content:"";position:absolute;right:-6px;top:50%;transform:translateY(-50%) rotate(45deg);width:11px;height:11px;
    background:var(--surface);border-right:1px solid var(--hair);border-top:1px solid var(--hair);border-bottom-left-radius:2px}
  .scrubber .sgrip{position:absolute;left:0;right:0;height:22px;transform:translateY(-50%);cursor:ns-resize;z-index:10;pointer-events:auto;
    display:flex;align-items:center;justify-content:flex-end;padding-right:2px;opacity:.32;transition:opacity .16s var(--ease)}
  .scrubber[data-hover] .sgrip,.scrubber[data-resizing] .sgrip{opacity:1}
  .scrubber .sgrip:hover{opacity:1}
  .scrubber .sgrip::before{content:"";position:absolute;left:0;right:7px;top:50%;height:2px;transform:translateY(-50%);
    background:var(--signal);opacity:.5;border-radius:2px}
  .scrubber .sgrip i{position:relative;width:30px;height:15px;border-radius:6px;background:var(--surface-3);box-shadow:var(--shadow);
    border:1px solid color-mix(in srgb,var(--signal) 60%,transparent);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2.5px}
  .scrubber .sgrip i::before,.scrubber .sgrip i::after{content:"";width:14px;height:1.5px;border-radius:2px;background:color-mix(in srgb,var(--signal) 85%,var(--muted))}
  .scrubber .sgrip:hover i,.scrubber[data-resizing] .sgrip i{border-color:var(--signal);background:color-mix(in srgb,var(--signal) 26%,var(--surface-3))}
  .scrubber .szoom{position:absolute;left:6px;top:-1px;font-size:10px;font-weight:700;color:var(--signal);font-variant-numeric:tabular-nums;
    background:color-mix(in srgb,var(--signal) 14%,transparent);border:1px solid color-mix(in srgb,var(--signal) 30%,transparent);border-radius:6px;
    padding:2px 7px;z-index:9;pointer-events:none;opacity:0;transition:opacity .16s var(--ease)}
  .scrubber[data-hover] .szoom,.scrubber[data-resizing] .szoom{opacity:1}

  /* ---------- timeline ---------- */
  .thread{background:linear-gradient(var(--bg),var(--bg-grad));border-radius:2px;min-width:0}
  .dayhead{display:flex;align-items:center;gap:12px;margin:26px 2px 12px;color:var(--faint);scroll-margin-top:120px}
  .dayhead:first-child{margin-top:8px}
  .dayhead::before,.dayhead::after{content:"";height:1px;background:var(--hair);flex:1}
  .dayhead span{font-size:11.5px;font-weight:600;letter-spacing:.04em;white-space:nowrap;color:var(--faint)}
  @media (max-width:900px){ .dayhead{scroll-margin-top:112px} }
  .empty{color:var(--muted);text-align:center;padding:60px 20px;font-size:14px}

  /* source group */
  .srcgroup{margin:14px 0}
  .srchead{display:inline-flex;align-items:center;gap:7px;margin:0 0 6px 2px;font-size:11.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--c)}
  .srchead .sdot{width:8px;height:8px;border-radius:50%;background:var(--c)}
  .srchead .srcimg{margin-left:6px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--faint);border:1px solid var(--hair);border-radius:6px;padding:1px 7px;cursor:pointer;font-size:11px}
  .srchead .srcimg:hover{color:var(--ink);border-color:var(--signal)}

  /* bubbles */
  .row{display:flex;margin-top:2px}
  .row.me{justify-content:flex-end}
  .row.them{justify-content:flex-start}
  .row.gap{margin-top:9px}
  .bubble{position:relative;max-width:min(80%,540px);padding:8px 13px;border-radius:19px;font-size:15.5px;line-height:1.42;box-shadow:var(--shadow);white-space:pre-wrap;overflow-wrap:break-word;word-break:break-word}
  .row.them .bubble{background:var(--bubble-them);color:var(--ink-them);border-bottom-left-radius:7px}
  .row.me.src-signal .bubble{background:var(--signal-bubble);color:#fff;border-bottom-right-radius:7px}
  .row.me.src-sms .bubble{background:var(--sms-bubble);color:#fff;border-bottom-right-radius:7px}
  .row.mid .bubble{border-radius:19px}
  .meta{display:inline-flex;align-items:center;gap:5px;font-size:11px;margin-left:12px;float:right;position:relative;top:6px;white-space:nowrap}
  .row.them .meta{color:var(--time-them)}
  .row.me .meta{color:var(--time-me)}
  .tick{width:15px;height:11px}
  /* per-message platform stamp: quiet glyph + name folded into the timestamp,
     tinted to the source hue on incoming, kept light on the coloured me bubble */
  .meta .pstamp{display:inline-flex;align-items:center;gap:3px;font-weight:600;color:var(--c,var(--muted))}
  .meta .pstamp svg{width:11px;height:11px;flex:0 0 auto}
  .meta .pstamp::after{content:"·";margin:0 1px 0 3px;opacity:.55;font-weight:400}
  .row.me .meta .pstamp{color:var(--time-me)}
  .trunc{display:block;margin-top:7px;padding-top:7px;border-top:1px solid rgba(255,255,255,.28);font-size:12px;color:#fff;opacity:.92}
  .trunc b{font-weight:700}

  /* attachments: images + link previews inside bubbles */
  .bubble.media{padding:5px;background:var(--bubble-them)}
  .row.me .bubble.media{background:color-mix(in srgb,var(--sms) 22%,var(--surface))}
  .bubble .attach{display:block;margin:0 0 2px;border-radius:13px;overflow:hidden;line-height:0}
  .bubble.media .attach{margin:0}
  .bubble .attach img{display:block;width:100%;max-width:270px;height:auto;border-radius:13px}
  .bubble.hasimg{max-width:290px}
  /* explicit images are NOT stored as pixels: the transcript flags explicit
     (with a clinical imageAlt) and the bubble shows this placeholder frame in
     place of any photo — nothing to reveal, no source screen. */
  .bubble .exframe{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
    min-width:180px;max-width:270px;min-height:104px;margin:0 0 2px;padding:20px 16px;border-radius:13px;text-align:center;line-height:1.25;
    background:repeating-linear-gradient(45deg,rgba(180,40,30,.12),rgba(180,40,30,.12) 11px,rgba(180,40,30,.045) 11px,rgba(180,40,30,.045) 22px);
    border:1px dashed rgba(255,120,100,.55)}
  .bubble.media .exframe{margin:0}
  .exframe .ex-tag{font-size:12px;font-weight:700;letter-spacing:.02em;color:#ffdad0;
    background:rgba(180,40,30,.72);padding:4px 11px;border-radius:999px;border:1px solid rgba(255,150,130,.5)}
  .exframe .ex-note{font-size:11px;color:var(--faint)}
  /* legacy blurred-image path (kept for any explicit link-card thumbnails). The
     #btnExplicit toggle flips body.explicit-shown to reveal all; a single image
     is revealed by clicking its veil (adds .revealed). */
  .bubble .attach.explicit{position:relative}
  body:not(.explicit-shown) .attach.explicit:not(.revealed) img{filter:blur(24px);transform:scale(1.08)}
  .attach.explicit .veil{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:5px;text-align:center;cursor:pointer;line-height:1.2;background:rgba(8,9,13,.38);transition:opacity .18s}
  body.explicit-shown .attach.explicit .veil,.attach.explicit.revealed .veil{opacity:0;pointer-events:none}
  .attach.explicit .veil-tag{font-size:12px;font-weight:700;letter-spacing:.02em;color:#ffdad0;
    background:rgba(180,40,30,.72);padding:4px 10px;border-radius:999px;border:1px solid rgba(255,150,130,.5)}
  .attach.explicit .veil-hint{font-size:11px;color:rgba(255,255,255,.82)}
  #btnExplicit[aria-pressed="false"] .eyeslash{display:none}
  #btnExplicit[aria-pressed="false"]{color:var(--sms)}
  .bubble .linkcard{display:flex;align-items:center;gap:10px;margin:6px 0 2px;padding:9px 11px;border-radius:12px;
    background:color-mix(in srgb,var(--surface) 70%,transparent);border:1px solid var(--hair);text-decoration:none;min-width:200px}
  .bubble.media .linkcard{margin:0}
  .row.them .bubble .linkcard{background:rgba(255,255,255,.06)}
  .row.me .bubble .linkcard{background:rgba(0,0,0,.16);border-color:rgba(255,255,255,.14)}
  .bubble .linkcard .lkico{flex:0 0 auto;width:30px;height:30px;border-radius:8px;display:grid;place-items:center;background:color-mix(in srgb,var(--sms) 30%,transparent);color:var(--sms)}
  .row.me .bubble .linkcard .lkico{color:#eafff2;background:rgba(255,255,255,.16)}
  .bubble .linkcard .lktext{display:flex;flex-direction:column;min-width:0;gap:1px}
  .bubble .linkcard .lktext b{font-weight:600;font-size:13.5px;line-height:1.3;color:var(--ink);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .row.me .bubble .linkcard .lktext b{color:#fff}
  .bubble .linkcard .lktext i{font-style:normal;font-size:11.5px;color:var(--muted)}
  .row.me .bubble .linkcard .lktext i{color:rgba(255,255,255,.72)}

  /* uncropped-image caption: an image was shared but its pixels aren't stored inline
     (they remain in the per-day source stitch); show the transcriber's description */
  .bubble .imgcap{display:flex;gap:8px;align-items:flex-start;margin:4px 0 2px;padding:8px 10px;border-radius:12px;
    border:1px dashed var(--hair);background:color-mix(in srgb,var(--surface) 55%,transparent);font-size:12.5px;line-height:1.38;color:var(--muted);font-style:italic;max-width:260px}
  .bubble.media .imgcap{margin:0}
  .row.them .bubble .imgcap{background:rgba(255,255,255,.045)}
  .row.me .bubble .imgcap{background:rgba(0,0,0,.14);border-color:rgba(255,255,255,.16);color:rgba(255,255,255,.8)}
  .bubble .imgcap .capico{flex:0 0 auto;color:var(--sms);opacity:.85;margin-top:1px}
  .row.me .bubble .imgcap .capico{color:#eafff2}
  .bubble .imgcap .capico svg{width:15px;height:15px;display:block}

  /* system notice */
  .sysrow{display:flex;justify-content:center;margin:12px 0}
  .sysrow p{margin:0;max-width:80%;text-align:center;color:var(--muted);font-size:12.5px;display:inline-flex;gap:7px;align-items:center}
  .sysrow svg{width:14px;height:14px;opacity:.75;flex:0 0 auto}
  .sysrow.card p{background:var(--surface);border:1px solid var(--hair);padding:10px 14px;border-radius:12px}
  .sysrow.card b{color:var(--ink);font-weight:600}

  /* email card */
  .email{margin:14px 0;border:1px solid var(--hair);border-radius:14px;overflow:hidden;background:var(--surface);box-shadow:var(--shadow)}
  .email .ehead{display:flex;align-items:center;gap:8px;padding:9px 14px;background:color-mix(in srgb,var(--email) 12%,transparent);border-bottom:1px solid var(--hair)}
  .email .ebadge{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;color:var(--email);text-transform:uppercase;letter-spacing:.03em}
  .email .ebadge .sdot{width:8px;height:8px;border-radius:50%;background:var(--email)}
  .email .ehead .enotrel{margin-left:auto;display:inline-flex;align-items:center;gap:5px;padding:3px 9px;font-size:11.5px;font-weight:600;color:var(--muted);background:transparent;border:1px solid var(--hair);border-radius:999px;cursor:pointer;transition:color .12s,border-color .12s,background .12s}
  .email .ehead .enotrel svg{width:13px;height:13px}
  .email .ehead .enotrel:hover{color:#e5484d;border-color:color-mix(in srgb,#e5484d 45%,transparent);background:color-mix(in srgb,#e5484d 10%,transparent)}
  .email time{margin-left:auto;font-size:12px;color:var(--muted)}
  .email .ebody{padding:12px 14px}
  .email .hrow{font-size:12.5px;color:var(--muted);margin-bottom:2px}
  .email .hrow b{color:var(--ink);font-weight:600}
  .email .subj{font-weight:650;font-size:15px;margin:8px 0 6px}
  .email .etext{white-space:pre-wrap;font-size:14.5px;line-height:1.5}

  /* event node */
  .event{display:flex;gap:12px;margin:16px 0;position:relative;padding-left:2px}
  .event .enode{flex:0 0 auto;width:34px;height:34px;border-radius:50%;background:color-mix(in srgb,var(--event) 20%,var(--surface));border:1.5px solid var(--event);display:grid;place-items:center;margin-top:2px}
  .event .enode svg{width:17px;height:17px;color:var(--event)}
  .event .ecard{flex:1 1 auto;background:color-mix(in srgb,var(--event) 8%,var(--surface));border:1px solid color-mix(in srgb,var(--event) 30%,var(--hair));border-radius:12px;padding:11px 14px;box-shadow:var(--shadow)}
  .event .etop{display:flex;align-items:center;gap:8px;margin-bottom:3px}
  .event .ecat{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--event)}
  .event .etime{font-size:12px;color:var(--muted)}
  .event h4{margin:0;font-size:15.5px;font-weight:650;letter-spacing:-.01em}
  .event .edetail{margin:5px 0 0;font-size:14px;color:var(--muted);white-space:pre-wrap;line-height:1.5}
  .event .ectl{margin-left:auto;display:flex;gap:2px;opacity:0;transition:opacity .15s}
  .event:hover .ectl,.event:focus-within .ectl{opacity:1}
  .event .ectl button{width:26px;height:26px;border-radius:7px}
  .event .ectl svg{width:15px;height:15px}

  mark{background:var(--mark);color:var(--mark-ink);border-radius:3px;padding:0 1px}
  .hidden{display:none !important}

  /* provenance */
  .prov{max-width:var(--tl);margin:0 auto;padding:26px 18px 50px;color:var(--faint);font-size:12px;line-height:1.6}
  .prov .rule{height:1px;background:var(--hair);margin-bottom:16px}
  .prov p{margin:0 0 8px} .prov b{color:var(--muted);font-weight:600} .prov .warn{color:var(--amber)}

  /* dialogs */
  dialog{border:0;border-radius:16px;background:var(--surface);color:var(--ink);box-shadow:var(--shadow-lg);padding:0;max-height:90vh}
  dialog::backdrop{background:rgba(0,0,0,.62);backdrop-filter:blur(3px)}
  .dlg-head{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--hair)}
  .dlg-head h2{margin:0;font-size:16px;font-weight:650}
  .dlg-head p{margin:2px 0 0;font-size:12.5px;color:var(--muted)}
  .dlg-close{margin-left:auto}
  #eventDlg{width:min(520px,94vw)}
  #eventForm{padding:16px 18px;display:grid;gap:13px}
  #eventForm .frow{display:grid;gap:5px}
  #eventForm .two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  #eventForm label{font-size:12.5px;font-weight:600;color:var(--muted)}
  #eventForm input,#eventForm select,#eventForm textarea{font:inherit;font-size:14.5px;background:var(--surface-2);border:1px solid var(--hair);color:var(--ink);border-radius:9px;padding:9px 11px;width:100%}
  #eventForm input:focus,#eventForm select:focus,#eventForm textarea:focus{outline:2px solid var(--event);border-color:transparent}
  #eventForm textarea{min-height:74px;resize:vertical}
  #eventForm .foot{display:flex;align-items:center;gap:8px;margin-top:4px}
  #eventForm .foot .io{font-size:12px;color:var(--muted);cursor:pointer;text-decoration:underline;background:none;border:0;padding:4px}
  #eventForm .foot .spacer{margin-left:auto}
  .fbtn{display:inline-flex;align-items:center;justify-content:center;font:inherit;font-size:13.5px;font-weight:600;padding:9px 16px;border-radius:9px;border:1px solid var(--hair);background:var(--surface-2);color:var(--ink);cursor:pointer;text-decoration:none}
  .fbtn.primary{background:var(--event);border-color:transparent;color:#fff}
  .fbtn.danger{background:var(--threat);border-color:transparent;color:#fff}
  .fbtn:hover{filter:brightness(1.05)}
  .fbtn:disabled,.fbtn[disabled]{opacity:.55;cursor:default;filter:none;pointer-events:none}

  #sources{width:min(920px,94vw)}
  #sources .dlg-body{padding:16px 18px;overflow:auto;max-height:calc(90vh - 66px)}
  #sources h3{font-size:13px;margin:2px 0 10px;color:var(--muted);font-weight:600}
  .stitchbox{max-height:56vh;overflow:auto;border:1px solid var(--hair);border-radius:12px;background:var(--bg);text-align:center;margin-bottom:20px}
  .stitchbox img{width:min(360px,80%);margin:0}
  .tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(108px,1fr));gap:8px}
  .tiles a{display:block;border:1px solid var(--hair);border-radius:8px;overflow:hidden;position:relative;aspect-ratio:1170/900;background:var(--bg)}
  .tiles a span{position:absolute;left:6px;top:5px;font-size:10.5px;background:rgba(0,0,0,.6);color:#fff;padding:1px 6px;border-radius:6px}
  .tiles img{width:100%;height:100%;object-fit:cover;object-position:top}

  /* motion */
  @keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
  .thread.play > *{animation:rise .45s var(--ease) both;animation-delay:calc(var(--i,0)*16ms)}
  dialog[open]{animation:rise .26s var(--ease)}
  @media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} .thread.play>*{animation:none} dialog[open]{animation:none} }

  /* print */
  @media print{
    .topbar,.filterbar,.rail,.scrubber,.actions,.event .ectl,.srchead .srcimg,.dayfull,.prov .noprint{display:none !important}
    body{background:#fff}
    .layout{grid-template-columns:1fr;padding:0}
    .dayhead{position:static}
    .row .bubble,.email,.event{break-inside:avoid}
    .row.me .bubble{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  }


/* ==== Go app overrides ==== */
.filterbar form{ margin:0; }
.chip{ user-select:none; }
.chip input{ position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
.chip:has(input:checked){ border-color:color-mix(in srgb,var(--c) 55%,var(--hair)); background:color-mix(in srgb,var(--c) 15%,transparent); color:var(--ink); }
.chip:has(input:checked) .cdot{ background:var(--c); }
.chip:has(input:not(:checked)){ opacity:.5; }
.chip:has(input:not(:checked)) .cdot{ background:var(--muted); }
#eventDlg:not([open]){ display:none; }
.loginbody{ min-height:100vh; margin:0; display:grid; place-items:center; background:linear-gradient(var(--bg),var(--bg-grad)); padding:24px; }
.logincard{ width:min(360px,92vw); background:var(--surface); border:1px solid var(--hair); border-radius:16px; padding:26px 24px; box-shadow:var(--shadow-lg); display:grid; gap:14px; text-align:center; }
.logincard .mark-dot{ margin:0 auto; }
.logincard h1{ margin:6px 0 0; font-size:20px; letter-spacing:-.01em; }
.logincard p{ margin:0; color:var(--muted); font-size:13px; }
.logincard input{ font:inherit; font-size:15px; padding:11px 13px; border-radius:10px; border:1px solid var(--hair); background:var(--surface-2); color:var(--ink); }
.logincard input:focus{ outline:2px solid var(--signal); border-color:transparent; }
.logincard button{ font:inherit; font-weight:600; font-size:14px; padding:11px; border-radius:10px; border:0; background:var(--signal-bubble); color:#fff; cursor:pointer; }
.logincard button:hover{ filter:brightness(1.06); }
.loginerr{ background:color-mix(in srgb,#e0533a 15%,transparent); color:#e0705a; border:1px solid color-mix(in srgb,#e0533a 40%,var(--hair)); border-radius:9px; padding:8px 10px; font-size:13px; }
.logoutlink{ text-decoration:none; }

/* ==== notice banner (email / oauth) ==== */
.tos{ margin:14px auto; max-width:760px; background:var(--amber-bg); color:var(--amber); border:1px solid color-mix(in srgb,var(--amber) 35%,var(--hair)); border-radius:10px; padding:10px 14px; font-size:12.5px; line-height:1.5; }
.tos.err{ background:color-mix(in srgb,#e0533a 14%,transparent); color:#e0705a; border-color:color-mix(in srgb,#e0533a 40%,var(--hair)); }
.tos code{ background:var(--surface-2); padding:1px 5px; border-radius:5px; }

/* ==== event form: precision control ==== */
#eventForm .pseg{ display:grid; grid-template-columns:repeat(4,1fr); gap:5px; background:var(--surface-2); border:1px solid var(--hair); border-radius:10px; padding:4px; }
#eventForm .pseg button{ appearance:none; border:0; background:transparent; color:var(--muted); font:inherit; font-size:12.5px; font-weight:600; padding:8px 4px; border-radius:7px; cursor:pointer; }
#eventForm .pseg button.on{ background:var(--event); color:#fff; }
#eventForm .pgroup{ display:grid; gap:12px; }
#eventForm .presetrow{ display:flex; flex-wrap:wrap; gap:6px; }
#eventForm .chip2{ font:inherit; font-size:12px; padding:6px 11px; border-radius:999px; border:1px solid var(--hair); background:var(--surface-2); color:var(--muted); cursor:pointer; }
#eventForm .chip2.on{ background:color-mix(in srgb,var(--event) 16%,transparent); border-color:color-mix(in srgb,var(--event) 45%,var(--hair)); color:var(--ink); }
#eventForm .endtoggle{ display:inline-flex; border:1px solid var(--hair); border-radius:7px; overflow:hidden; margin-left:6px; vertical-align:middle; }
#eventForm .endtoggle button{ appearance:none; font:inherit; font-size:10.5px; padding:3px 8px; background:var(--surface-2); border:0; color:var(--muted); cursor:pointer; }
#eventForm .endtoggle button.on{ background:var(--event); color:#fff; }
#eventForm .phint{ margin:0; font-size:11.5px; color:var(--faint); }
#eventForm .pprev{ display:flex; align-items:center; gap:9px; font-size:12.5px; color:var(--muted); background:color-mix(in srgb,var(--event) 8%,var(--surface)); border:1px dashed color-mix(in srgb,var(--event) 34%,var(--hair)); border-radius:10px; padding:9px 12px; }
#eventForm .pprev .pv{ flex:0 0 auto; width:24px; height:24px; border-radius:50%; border:1.5px solid var(--event); }
#eventForm .pprev .pv.span{ width:12px; height:24px; border-radius:5px; border:0; background:var(--event); }
#eventForm .lblhint{ font-weight:400; color:var(--faint); }
#eventForm .linkedmini{ border:1px dashed color-mix(in srgb,var(--event) 34%,var(--hair)); border-radius:10px; padding:9px 11px; font-size:12.5px; color:var(--muted); }
#eventForm .linkedmini b{ color:var(--ink); }
/* resolved evidence reference chips (event form + events panel) */
/* resolved evidence references — clickable bookmark chips (panel + event dialog) */
.refchips{display:flex;flex-direction:column;gap:8px;margin-top:7px}
.rchip{display:flex;align-items:center;gap:8px;width:100%;text-align:left;font:inherit;cursor:pointer;position:relative;
  background:var(--surface);border:1px solid var(--hair);border-radius:11px;padding:8px 9px;color:var(--ink);
  transition:border-color .15s var(--ease),background .15s var(--ease)}
.rchip:hover{border-color:color-mix(in srgb,var(--event) 55%,var(--hair));background:color-mix(in srgb,var(--event) 6%,transparent)}
.rchip .kdot{width:8px;height:8px;border-radius:50%;flex:0 0 auto;background:var(--c,var(--muted));align-self:flex-start;margin-top:3px}
.rchip .rbody{min-width:0;flex:1;display:flex;flex-direction:column;gap:2px}
.rchip .who{display:flex;flex-direction:row;align-items:center;gap:5px;flex-wrap:nowrap;min-width:0;font-size:11px;font-weight:650;color:var(--c,var(--muted))}
.rchip .who .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rchip .who .src,.rchip .who .arr,.rchip .who .dirbadge{flex:0 0 auto}
.rchip .who .arr{color:var(--faint);font-weight:500}
.rchip .who .nm{color:var(--ink)}
.rchip .who .src{color:var(--faint);font-weight:600;text-transform:uppercase;font-size:9px;letter-spacing:.04em}
.rchip .rdate{font-size:10px;color:var(--faint);font-variant-numeric:tabular-nums;letter-spacing:.02em}
.rchip .rdate.rdate-att{margin-left:14px}
.rchip .snip{font-size:12.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rchip .snip.missing{font-style:italic;color:var(--faint)}
.rchip .jump{flex:0 0 auto;color:var(--faint);opacity:0;align-self:center;transition:opacity .15s,color .15s}
.rchip:hover .jump{opacity:1;color:var(--event)}
.rchip .jump svg{width:15px;height:15px}
.reftag-x{appearance:none;border:0;background:transparent;color:var(--faint);cursor:pointer;font-size:14px;line-height:1;
  width:18px;height:18px;display:grid;place-items:center;border-radius:50%;flex:0 0 auto;padding:0;align-self:center}
.reftag-x:hover{color:var(--ink);background:color-mix(in srgb,var(--faint) 28%,transparent)}
.dirbadge{display:inline-flex;align-items:center;gap:3px;font-size:9.5px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;padding:1px 6px;border-radius:20px}
.dirbadge svg{width:11px;height:11px}
.dirbadge.in{color:var(--sms);background:color-mix(in srgb,var(--sms) 16%,transparent)}
.dirbadge.out{color:var(--signal);background:color-mix(in srgb,var(--signal) 16%,transparent)}
.rchip .pfrom{color:var(--faint);white-space:nowrap;font-size:10.5px}
/* nested attachment: parent email pill wrapping the file */
.rchip.att-nest{flex-direction:column;align-items:stretch;gap:8px;padding:9px;
  background:color-mix(in srgb,var(--email) 7%,transparent);border-color:color-mix(in srgb,var(--email) 30%,var(--hair))}
.rchip.att-nest:hover{background:color-mix(in srgb,var(--email) 12%,transparent);border-color:color-mix(in srgb,var(--email) 45%,var(--hair))}
.rchip .parent{display:flex;align-items:center;gap:6px;min-width:0}
.rchip .parent .pe{display:inline-flex;align-items:center;gap:5px;flex:1;min-width:0}
.rchip .parent .pe svg{width:13px;height:13px;color:var(--email);flex:0 0 auto}
.rchip .parent .pn{font-weight:640;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}
.attfile{display:flex;align-items:center;gap:8px;margin-left:14px;width:calc(100% - 14px);position:relative;
  background:var(--surface);border:1px solid var(--hair);border-radius:9px;padding:7px 9px;cursor:pointer;font:inherit;color:inherit;text-align:left}
.attfile::before{content:"";position:absolute;left:-8px;bottom:14px;width:9px;height:9px;border-left:1.5px solid color-mix(in srgb,var(--email) 40%,var(--hair));border-bottom:1.5px solid color-mix(in srgb,var(--email) 40%,var(--hair));border-bottom-left-radius:4px}
.attfile:hover{border-color:color-mix(in srgb,var(--email) 55%,var(--hair))}
.attfile .ft{font-size:9px;font-weight:800;color:#fff;background:#d9534f;border-radius:5px;padding:2px 5px;flex:0 0 auto}
.attfile.doc .ft{background:#2f6fd0}
.attfile .fn{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12.5px}
.attfile .jump{color:var(--faint);opacity:0}.attfile:hover .jump{opacity:1;color:var(--email)}
.rchip .rx-abs{position:absolute;top:6px;right:6px}
/* bookmark jump flash on the target message/email */
@keyframes jumpflash{0%{box-shadow:0 0 0 3px color-mix(in srgb,var(--event) 70%,transparent)}100%{box-shadow:0 0 0 3px transparent}}
.jump-flash .bubble,.email.jump-flash{outline:2px solid var(--event);outline-offset:2px}
.jump-flash{animation:jumpflash 1.5s var(--ease);border-radius:16px}

/* ==== always-visible Events side panel (owns +Event, Select, drop targets) ==== */
.eventspanel{position:fixed;top:59px;right:0;bottom:0;width:var(--evw);z-index:var(--z-filter);
  display:flex;flex-direction:column;background:var(--surface);border-left:1px solid var(--hair)}
.ep-head{display:flex;align-items:center;gap:9px;padding:13px 16px 11px;border-bottom:1px solid var(--hair)}
.ep-head .ep-t{font-size:11px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.ep-head .ep-n{margin-left:auto;font-size:11px;font-weight:800;color:var(--event);
  background:color-mix(in srgb,var(--event) 18%,transparent);border-radius:20px;padding:1px 8px;font-variant-numeric:tabular-nums}
.ep-actions{padding:11px 14px;border-bottom:1px solid var(--hair);display:flex;flex-direction:column;gap:9px}
.ep-arow{display:flex;gap:8px}
.epbtn{display:inline-flex;align-items:center;justify-content:center;gap:8px;flex:1;font:inherit;font-size:13px;font-weight:600;
  border:1px solid var(--hair);background:var(--surface-2);color:var(--ink);border-radius:10px;padding:9px 12px;cursor:pointer;
  transition:background .16s var(--ease),border-color .16s var(--ease),color .16s var(--ease)}
.epbtn svg{width:16px;height:16px}
.epbtn:hover{border-color:var(--event)}
.epbtn.primary{background:var(--event);color:#fff;border-color:var(--event)}
.epbtn.primary:hover{filter:brightness(1.08)}
.epbtn.on{background:color-mix(in srgb,var(--signal) 16%,transparent);border-color:var(--signal);color:var(--signal)}
.epbtn.ghost{flex:0 0 auto;background:transparent;border-color:transparent;color:var(--muted);padding:6px 10px}
.epbtn.ghost:hover{background:var(--surface-2)}
.epbtn.sm{font-size:12px}
.ep-selstate{display:none;align-items:center;gap:10px}
body.selecting .ep-selstate{display:flex}
.ep-selc{font-size:13px;color:var(--muted);white-space:nowrap}
.ep-selc b{color:var(--ink);font-size:15px;font-variant-numeric:tabular-nums}
.ep-dragcue{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--signal);font-weight:560;margin:0 auto}
.ep-dragcue svg{width:14px;height:14px}
.ep-note{padding:9px 16px;font-size:11.5px;color:var(--faint);border-bottom:1px solid var(--hair)}
.ep-list{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:10px}
.ep-empty{color:var(--muted);font-size:12.5px;text-align:center;padding:24px 12px}
.evcard{border:1px solid var(--hair);background:var(--bg);border-radius:12px;padding:4px 4px 10px;
  transition:border-color .16s var(--ease),box-shadow .16s var(--ease),background .16s var(--ease)}
.evcard .ec-open{display:block;width:100%;text-align:left;background:transparent;border:0;padding:8px 9px 2px;cursor:pointer;font:inherit;color:inherit}
.evcard .ec-top{display:flex;align-items:center;gap:8px}
.evcard .ec-top svg{width:15px;height:15px;color:var(--event);flex:0 0 auto}
.evcard .ec-ttl{font-size:13.5px;font-weight:600;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.evcard .ec-date{display:block;font-size:11px;color:var(--muted);margin-top:4px;padding-left:23px;font-variant-numeric:tabular-nums}
.evcard .ec-refs{padding:0 9px;margin-top:8px}
.evcard .ec-refs:empty{display:none}
.evcard:hover{border-color:color-mix(in srgb,var(--event) 50%,var(--hair))}
.evcard.sel{border-color:var(--event);background:color-mix(in srgb,var(--event) 9%,transparent);box-shadow:0 0 0 3px color-mix(in srgb,var(--event) 20%,transparent)}
.evcard.drop-over{border-color:var(--event);border-style:dashed;background:color-mix(in srgb,var(--event) 16%,transparent)}
.evcard .ec-hint{display:none;margin:9px 9px 0;padding-top:9px;border-top:1px dashed color-mix(in srgb,var(--event) 40%,var(--hair));font-size:11px;color:var(--event);text-align:center}
.evcard.sel .ec-hint{display:block}
/* reserve the panel column on the whole timeline body (topbar spans full width
   above it); the fixed panel + axis sit in the reserved strip */
body.tl-body{padding-right:var(--evw)}
body.tl-body .topbar{margin-right:calc(-1 * var(--evw))}
.scrubber{right:calc(var(--evw) + 8px)}
@media (max-width:1200px){ :root{--evw:375px} }
@media (max-width:900px){ :root{--evw:295px} .ep-note{display:none} }
@media (max-width:640px){ .eventspanel{display:none} :root{--evw:0px} }

/* ==== timeline navigator: chapters (scrollspy TOC) + time ruler ==== */
.layout{ grid-template-columns:minmax(0,var(--tl)) 332px; gap:22px; align-items:start; }
.layout .thread{ grid-column:1; grid-row:1; }
.layout .eventrail{ grid-column:2; grid-row:1; }
.eventrail{ position:sticky; top:104px; height:calc(100vh - 124px); display:grid; grid-template-columns:1fr 84px; gap:10px; min-width:0; }

/* chapters — a scrollspy table of contents */
.er-chapters{ overflow-y:auto; overflow-x:hidden; padding-right:6px; scrollbar-width:thin; scrollbar-color:var(--surface-3) transparent; }
.er-chapters::-webkit-scrollbar{ width:9px; }
.er-chapters::-webkit-scrollbar-thumb{ background:var(--surface-3); border-radius:9px; border:3px solid var(--bg); }
.er-head{ position:sticky; top:0; z-index:2; padding:2px 0 9px; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--faint); background:linear-gradient(var(--bg) 62%,transparent); }
.er-mon-h{ margin:13px 2px 5px; font-size:11.5px; font-weight:650; letter-spacing:-.01em; color:var(--muted); transition:color .18s var(--ease); }
.er-mon.active .er-mon-h{ color:var(--event); }
.er-item{ position:relative; display:block; padding:7px 26px 8px 12px; border-radius:9px; cursor:pointer; transition:background .18s var(--ease); }
.er-item:hover{ background:color-mix(in srgb,var(--event) 7%,var(--surface)); }
.er-item:focus-visible{ outline:2px solid var(--event); outline-offset:1px; }
.er-item.active{ background:color-mix(in srgb,var(--event) 15%,var(--surface)); }
.er-item-ttl{ display:block; font-size:12.5px; line-height:1.4; color:var(--muted); transition:color .18s var(--ease); overflow-wrap:break-word; }
.er-item.active .er-item-ttl,.er-item:hover .er-item-ttl{ color:var(--ink); }
.er-item-meta{ display:flex; align-items:center; gap:8px; margin-top:3px; }
.er-item-cat{ font-size:9px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--faint); transition:color .18s var(--ease); }
.er-item.active .er-item-cat{ color:var(--event); }
.er-item-ev{ font-size:9.5px; font-weight:700; color:var(--event); background:color-mix(in srgb,var(--event) 16%,transparent); border-radius:999px; padding:0 6px; }
.er-item-edit{ position:absolute; top:5px; right:4px; width:22px; height:22px; border-radius:6px; display:grid; place-items:center; background:transparent; border:0; color:var(--faint); cursor:pointer; opacity:0; transition:opacity .14s; }
.er-item:hover .er-item-edit,.er-item:focus-within .er-item-edit{ opacity:1; }
.er-item-edit:hover{ background:var(--surface-2); color:var(--ink); }
.er-item-edit svg{ width:13px; height:13px; }
.er-empty{ font-size:12px; color:var(--muted); line-height:1.5; padding:10px 2px; }

/* time ruler — year-month labels + event dots (a static time index, no drag) */
.er-ruler{ position:relative; }
.er-ruler .er-track{ position:absolute; top:8px; bottom:8px; right:11px; width:2px; border-radius:2px; background:var(--hair); }
.er-ruler .er-mlabel{ position:absolute; right:22px; transform:translateY(-50%); font-size:10px; font-weight:650; letter-spacing:-.01em; color:var(--faint); white-space:nowrap; background:var(--bg); padding:1px 3px; transition:color .18s var(--ease); }
.er-ruler .er-mlabel.on{ color:var(--event); }
.er-ruler .er-evt{ position:absolute; right:8px; width:7px; height:7px; border-radius:50%; background:color-mix(in srgb,var(--event) 52%,var(--muted)); transform:translateY(-50%); box-shadow:0 0 0 2px var(--bg); transition:transform .16s var(--ease),background .16s var(--ease); }
.er-ruler .er-evt.on{ background:var(--event); transform:translateY(-50%) scale(1.45); }
.er-ruler .er-cursor{ position:absolute; right:11px; width:26px; height:0; border-top:2px solid var(--event); transform:translateY(-1px); opacity:0; transition:opacity .2s var(--ease); pointer-events:none; z-index:4; }
.er-ruler.has-cursor .er-cursor{ opacity:1; }
.er-ruler .er-cursor::after{ content:""; position:absolute; right:0; top:0; width:10px; height:10px; border-radius:50%; background:var(--event); transform:translate(50%,-50%); box-shadow:0 0 0 2px var(--bg), 0 0 9px color-mix(in srgb,var(--event) 70%,transparent); }

/* event line — a chapter-break marker inside the chat thread */
.eventline{ display:flex; align-items:center; gap:12px; margin:20px 2px 16px; scroll-margin-top:120px; }
.eventline::before,.eventline::after{ content:""; height:1px; flex:1; background:color-mix(in srgb,var(--event) 26%,var(--hair)); }
.eventline-tag{ display:inline-flex; align-items:center; gap:8px; max-width:80%; font:inherit; text-align:left; cursor:pointer; padding:5px 13px; border-radius:999px;
  border:1px solid color-mix(in srgb,var(--event) 32%,var(--hair)); background:color-mix(in srgb,var(--event) 10%,var(--surface)); color:var(--ink); transition:background .16s var(--ease),box-shadow .16s var(--ease); }
.eventline-tag:hover{ background:color-mix(in srgb,var(--event) 18%,var(--surface)); }
.eventline-tag svg{ width:14px; height:14px; color:var(--event); flex:0 0 auto; }
.eventline-ttl{ font-size:12.5px; font-weight:600; letter-spacing:-.01em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.eventline-date{ font-size:11px; color:var(--muted); flex:0 0 auto; }
.eventline.spy-on .eventline-tag{ background:color-mix(in srgb,var(--event) 20%,var(--surface)); box-shadow:0 0 0 2px color-mix(in srgb,var(--event) 30%,transparent); }

/* collapsed cluster of same-day events */
.eventgroup{ margin:20px 2px 16px; }
.eventgroup-head{ display:flex; align-items:center; gap:12px; width:100%; font:inherit; padding:0; background:none; border:0; cursor:pointer; }
.eventgroup-head::before,.eventgroup-head::after{ content:""; height:1px; flex:1; background:color-mix(in srgb,var(--event) 26%,var(--hair)); }
.eventgroup-pill{ display:inline-flex; align-items:center; gap:8px; padding:5px 13px; border-radius:999px; border:1px solid color-mix(in srgb,var(--event) 32%,var(--hair)); background:color-mix(in srgb,var(--event) 10%,var(--surface)); color:var(--ink); transition:background .16s var(--ease),box-shadow .16s var(--ease); }
.eventgroup-head:hover .eventgroup-pill{ background:color-mix(in srgb,var(--event) 18%,var(--surface)); }
.eventgroup-pill b{ font-size:12.5px; font-weight:650; letter-spacing:-.01em; }
.eventgroup .egchev{ width:14px; height:14px; color:var(--event); flex:0 0 auto; transition:transform .18s var(--ease); }
.eventgroup.open .egchev{ transform:rotate(90deg); }
.eventgroup.spy-on .eventgroup-pill{ background:color-mix(in srgb,var(--event) 20%,var(--surface)); box-shadow:0 0 0 2px color-mix(in srgb,var(--event) 30%,transparent); }
.eventgroup-list{ display:none; margin:8px 0 2px; padding-left:22px; }
.eventgroup.open .eventgroup-list{ display:grid; gap:3px; }
.eventline.sub{ display:block; margin:0; }
.eventline.sub::before,.eventline.sub::after{ display:none; }
.eventline.sub .eventline-tag{ max-width:100%; }

/* flash a linked message when its chapter is clicked */
.row.flash .bubble{ animation:flashpulse 1.6s var(--ease); }
@keyframes flashpulse{ 0%{ box-shadow:0 0 0 2px var(--event), var(--shadow); } 100%{ box-shadow:var(--shadow); } }
@media (prefers-reduced-motion:reduce){ .row.flash .bubble{ animation:none; outline:2px solid var(--event); outline-offset:2px; } }

/* mobile: chapters become a capped list above the thread; ruler hidden */
@media (max-width:900px){
  .layout{ grid-template-columns:minmax(0,1fr); }
  .layout .thread,.layout .eventrail{ grid-column:1; }
  .eventrail{ position:static; height:auto; display:block; margin-bottom:10px; }
  .er-chapters{ max-height:42vh; border:1px solid var(--hair); border-radius:12px; padding:4px 8px; }
  .er-head{ background:var(--bg); }
  .er-ruler{ display:none; }
}
@media print{
  .eventrail{ position:static; height:auto; display:block; }
  .er-ruler,.er-item-edit{ display:none !important; }
  .er-chapters{ overflow:visible; max-height:none; }
  .layout{ grid-template-columns:1fr !important; }
}

/* ==== message selection → evidence ==== */
body.selecting #thread .row{ cursor:pointer; }
body.selecting #thread .row:hover .bubble{ outline:2px solid color-mix(in srgb,var(--event) 45%,transparent); outline-offset:2px; }
#thread .row.sel .bubble{ outline:2px solid var(--event); outline-offset:2px; }
#thread .row.sel .bubble::after{ content:""; position:absolute; top:-8px; width:20px; height:20px; border-radius:50%; background:var(--event); box-shadow:var(--shadow); z-index:3;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E"); background-size:13px; background-repeat:no-repeat; background-position:center; }
#thread .row.them.sel .bubble::after{ left:-8px; }
#thread .row.me.sel .bubble::after{ right:-8px; }
/* emails + attachment chips are pickable too (messages keep the bubble badge above) */
body.selecting .email.selref, body.selecting .srcchip.selref{ cursor:pointer; }
body.selecting .email.selref:hover{ outline:2px dashed color-mix(in srgb,var(--event) 45%,transparent); outline-offset:2px; }
body.selecting .srcchip.selref:hover{ border-color:color-mix(in srgb,var(--event) 55%,var(--hair)); }
.email.selref.sel{ outline:2px solid var(--event); outline-offset:2px; }
.srcchip.selref.sel{ outline:2px solid var(--event); outline-offset:1px; }
.selref.dragging{ opacity:.5; }

.selbar{ position:fixed; left:50%; bottom:22px; transform:translateX(-50%); z-index:var(--z-dialog); display:flex; align-items:center; gap:10px;
  background:var(--surface); border:1px solid color-mix(in srgb,var(--event) 40%,var(--hair)); border-radius:14px; box-shadow:var(--shadow-lg); padding:8px 10px 8px 14px; }
.selbar .selc{ font-size:13px; font-weight:650; color:var(--ink); white-space:nowrap; }
.selbar .selc b{ color:var(--event); }
.seladd{ position:relative; }
.selbtn{ font:inherit; font-size:13px; font-weight:600; padding:8px 13px; border-radius:9px; border:0; cursor:pointer; background:var(--event); color:#fff; }
.selbtn.ghost{ background:var(--surface-2); color:var(--muted); }
.selbtn.ghost:hover{ color:var(--ink); }
.selmenu{ position:absolute; bottom:calc(100% + 8px); right:0; min-width:264px; max-height:340px; overflow:auto; background:var(--surface); border:1px solid var(--hair); border-radius:12px; box-shadow:var(--shadow-lg); padding:6px; display:none; }
.selmenu.open{ display:block; }
.selmenu .mlabel{ font-size:10.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--faint); font-weight:700; padding:6px 10px 3px; }
.selmenu button{ display:flex; align-items:center; gap:9px; width:100%; text-align:left; font:inherit; font-size:13.5px; color:var(--ink); background:transparent; border:0; border-radius:8px; padding:9px 10px; cursor:pointer; }
.selmenu button:hover{ background:var(--surface-2); }
.selmenu .ico{ flex:0 0 auto; width:22px; height:22px; border-radius:6px; display:grid; place-items:center; background:color-mix(in srgb,var(--event) 18%,transparent); color:var(--event); font-weight:700; }

/* ---------- email view (timeline) ---------- */
.email .edir{font-size:12px;color:var(--muted)}
/* email body framed as a headed "document", matching attachment previews below
   it (see .docview) but tinted with the email hue. Always open; the iframe is
   sized to its content by lazyviews.js, so a short body leaves no dead space. */
.ebody-doc{margin:12px 14px 14px;border:1px solid var(--hair);border-radius:12px;overflow:hidden;background:var(--surface)}
.ebody-h{display:flex;align-items:center;gap:11px;padding:10px 13px;background:color-mix(in srgb,var(--email) 9%,var(--surface-2));border-bottom:1px solid var(--hair)}
.ebody-h .dvi{flex:0 0 auto;width:30px;height:30px;border-radius:8px;display:grid;place-items:center;background:color-mix(in srgb,var(--email) 18%,transparent);color:var(--email)}
.ebody-h .dvi svg{width:16px;height:16px}
.ebody-h .dv-name{min-width:0;font-weight:600;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ebody-h .dv-tag{flex:0 0 auto;margin-left:auto;font-size:11px;font-weight:700;color:var(--email);border:1px solid color-mix(in srgb,var(--email) 40%,transparent);border-radius:999px;padding:2px 9px;letter-spacing:.03em}
.email .eframe{display:block;width:100%;border:0;background:#fff;min-height:44px}
.ebody-body > .etext{padding:14px;white-space:pre-wrap;font-size:14.5px;line-height:1.5}

/* email → source documents (chip row) */
.email .srcdocs{padding:12px 14px 13px}
.email .srcdocs-lbl{display:flex;align-items:center;gap:7px;font-size:11.5px;font-weight:600;color:var(--faint);margin:0 2px 8px}
.email .srcdocs-lbl svg{width:14px;height:14px}
.email .srcchips{display:flex;flex-wrap:wrap;gap:8px}
.email .srcchip{display:inline-flex;align-items:center;gap:9px;max-width:100%;text-decoration:none;color:var(--ink);
  border:1px solid var(--hair);background:var(--surface-2);border-radius:999px;padding:5px 12px 5px 6px;transition:background .14s var(--ease)}
.email .srcchip:hover{background:var(--surface-3)}
.email .srcchip:focus-visible{outline:2px solid var(--signal);outline-offset:2px}
.email .srcchip .ft{flex:0 0 auto;width:26px;height:26px;border-radius:7px;display:grid;place-items:center;font-size:8.5px;font-weight:800;letter-spacing:.02em}
.email .srcchip .cn{font-size:12.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:240px}
.email .srcchip .dli{width:15px;height:15px;color:var(--faint);flex:0 0 auto}
.email .srcchip:hover .dli{color:var(--ink)}
.email .srcchip.src-eml .ft{background:color-mix(in srgb,var(--email) 18%,transparent);color:var(--email)}
.email .srcchip.src-docx .ft{background:color-mix(in srgb,var(--signal) 18%,transparent);color:var(--signal)}
.email .srcchip.src-pdf .ft{background:color-mix(in srgb,#d64545 22%,transparent);color:#d64545}
.email .srcchip.src-file .ft{background:var(--pill);color:var(--muted)}
.email .esplit{height:1px;background:var(--hair)}

/* ---------- email page ---------- */
.mailwrap{max-width:900px;margin:0 auto;padding:18px 16px 60px}
/* secondary nav within the Email page: Search / Downloaded */
.mailsubnav{display:flex;align-items:center;gap:4px;margin-bottom:18px;padding-bottom:12px;border-bottom:1px solid var(--hair)}
.mailsubtab{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border-radius:9px;
  color:var(--muted);font-size:13.5px;font-weight:560;text-decoration:none;white-space:nowrap;
  border:1px solid transparent;transition:background .16s var(--ease),color .16s var(--ease),border-color .16s var(--ease)}
.mailsubtab svg{width:16px;height:16px;flex:0 0 auto}
.mailsubtab:hover{background:var(--surface-2);color:var(--ink)}
.mailsubtab.on{color:var(--email);background:color-mix(in srgb,var(--email) 14%,transparent);
  border-color:color-mix(in srgb,var(--email) 34%,transparent)}
/* first-run / progress hint inside the results column */
.mailhint{margin:16px 2px;color:var(--muted);font-size:13px;line-height:1.55}
.mailhint a{color:var(--email);text-decoration:none;font-weight:600}
.mailhint a:hover{text-decoration:underline}
.mailhint .mrdone{display:inline-flex}
/* empty state for the Downloaded tab */
.mailempty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:56px 24px}
.mailempty svg{width:40px;height:40px;color:var(--faint);margin-bottom:6px}
.mailempty-t{margin:0;font-size:15px;font-weight:650;color:var(--ink)}
.mailempty-s{margin:0;max-width:44ch;font-size:13px;line-height:1.55;color:var(--muted)}
.mailempty .fbtn{margin-top:12px}
.mailsearch{background:var(--surface);border:1px solid var(--hair);border-radius:14px;padding:14px}
.msgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.msgrid label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted)}
.msgrid input,.msgrid select{font:inherit;font-size:14px;background:var(--surface-2);border:1px solid var(--hair);color:var(--ink);border-radius:8px;padding:8px 10px}
.msactions{display:flex;align-items:center;gap:12px;margin-top:12px}
.mailh{margin:22px 2px 8px;color:var(--muted);font-size:13px;text-transform:uppercase;letter-spacing:.04em}
.mailresulthead{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:14px 0 8px}
.selall{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}
.mailresults{list-style:none;margin:0;padding:0;border:1px solid var(--hair);border-radius:12px;overflow:hidden}
.mailresult+.mailresult{border-top:1px solid var(--hair)}
.mailresult .mrline{display:grid;grid-template-columns:auto minmax(120px,1fr) 2fr auto auto;gap:10px;align-items:center;padding:9px 12px}
.mailresult label.mrline{cursor:pointer}
.mailresult:not(.done):hover{background:var(--surface-2)}
.mrfrom{font-weight:600;font-size:13.5px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mrsubj{font-size:13.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mrdate{font-size:12px;color:var(--faint);white-space:nowrap}
/* already-archived hit: greyed, not selectable, marked with a tick + badge */
.mailresult.done{background:color-mix(in srgb,var(--surface-2) 55%,transparent)}
.mailresult.done .mrfrom,.mailresult.done .mrsubj,.mailresult.done .mrdate{color:var(--faint)}
.mailresult.done .mrtick{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;color:var(--sms)}
.mailresult.done .mrtick svg{width:16px;height:16px}
.mrdone{justify-self:end;display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;white-space:nowrap;
  padding:3px 9px;border-radius:999px;background:color-mix(in srgb,var(--sms) 15%,transparent);color:var(--sms)}
.selall-n{color:var(--faint);font-weight:400}
/* Downloaded tab: flat list of every committed email, newest first */
.mailarchive{list-style:none;margin:0;padding:0;border:1px solid var(--hair);border-radius:12px;overflow:hidden}
.mailarchive li+li{border-top:1px solid var(--hair)}
.mailarow{display:grid;grid-template-columns:minmax(140px,1fr) 2fr auto auto;gap:12px;align-items:center;
  padding:10px 14px;text-decoration:none;color:inherit}
.mailarow:hover{background:var(--surface-2)}
.mailarow .mrclip{justify-self:end}
/* Downloaded archive row: link fills, with a relevance badge + toggle on the right */
.mailarow-li{display:flex;align-items:center;gap:8px;padding-right:12px}
.mailarow-li .mailarow{flex:1;min-width:0}
.mailarow-li.irrel{background:color-mix(in srgb,var(--muted) 7%,transparent)}
.mailarow-li.irrel .mailarow{opacity:.5}
.mrbadge{flex:none;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);border:1px solid var(--hair);border-radius:999px;padding:2px 8px;white-space:nowrap}
.mailarow-li .mrtoggle{flex:none;font-size:12px;font-weight:600;color:var(--muted);background:transparent;border:1px solid var(--hair);border-radius:8px;padding:4px 10px;cursor:pointer;white-space:nowrap;transition:color .12s,border-color .12s,background .12s}
.mailarow-li .mrtoggle:hover{color:var(--ink);border-color:var(--muted);background:var(--surface-2)}
.mrows{display:flex;flex-direction:column;gap:8px}
/* Queue tab: header row with retry-all, and per-row error + retry */
.mailqhead{display:flex;align-items:center;justify-content:space-between;gap:12px}
.mailqhead .mailh{margin:22px 0 8px}
.mrend{display:inline-flex;align-items:center;gap:10px;min-width:0}
.vbadge{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;border:1px solid var(--hair);font-size:12px;font-weight:600;white-space:nowrap}
.mrend .vbadge.err{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:340px}
.vbadge.warn{background:color-mix(in srgb,var(--amber) 16%,transparent);color:var(--amber);border-color:color-mix(in srgb,var(--amber) 40%,transparent)}
.fbtn.retry{padding:5px 12px;font-size:12.5px;flex:0 0 auto}
.fbtn.retry:hover{border-color:var(--email);color:var(--email)}
.mrow{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--surface);border:1px solid var(--hair);border-radius:10px;padding:10px 13px}
.mrmeta{display:flex;flex-direction:column;min-width:0}
.mrmeta b{font-size:13.5px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mrmeta span{font-size:12px;color:var(--muted)}
.selmenu .selnone{ font-size:12.5px; color:var(--faint); padding:6px 10px 8px; }

/* ---------- import page ---------- */
.importform{display:flex;flex-direction:column;gap:16px;margin-top:16px}
.impcard{background:var(--surface);border:1px solid var(--hair);border-radius:12px;padding:16px}
.impcard-t{margin:0 0 10px;font-size:13.5px;font-weight:650}
.impdrop{display:block;border:1.5px dashed color-mix(in srgb,var(--signal) 40%,var(--hair));border-radius:11px;background:color-mix(in srgb,var(--signal) 5%,transparent);padding:22px 16px;text-align:center;color:var(--muted);font-size:13px;cursor:pointer}
.impdrop input[type=file]{display:block;margin:0 auto 8px}
.importform textarea{width:100%;box-sizing:border-box;font:inherit;font-size:13px;background:var(--surface-2);border:1px solid var(--hair);border-radius:9px;color:var(--ink);padding:10px;resize:vertical}
.impsources{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.impsource{display:inline-flex}
.impsource input{position:absolute;opacity:0;pointer-events:none}
.impsource span{padding:6px 13px;border-radius:999px;border:1px solid var(--hair);font-size:12.5px;color:var(--muted);background:var(--surface-2);cursor:pointer}
.impsource input:checked + span{border-color:color-mix(in srgb,var(--sms) 55%,var(--hair));background:color-mix(in srgb,var(--sms) 15%,transparent);color:var(--ink);font-weight:600}
.impsource input:focus-visible + span{outline:2px solid var(--signal);outline-offset:2px}
.impfields{display:flex;gap:12px;flex-wrap:wrap}
.impfields label{display:flex;flex-direction:column;gap:5px;flex:1;min-width:180px;font-size:11.5px;font-weight:600;color:var(--muted)}
.impfields input{font:inherit;font-size:13px;background:var(--surface-2);border:1px solid var(--hair);border-radius:8px;padding:8px 10px;color:var(--ink)}

/* ---------- email connection banner ---------- */
.mailconn{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.mailconn-ok{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;color:var(--sms);font-weight:600}
.mailconn-note{font-size:12.5px;color:var(--muted)}

/* provenance link from a cropped photo to its full source screen */
.srcshot{display:inline-flex;align-items:center;gap:.25em;margin-top:4px;font-size:.72rem;
  color:var(--muted,#8a90a0);text-decoration:none;opacity:.85}
.srcshot:hover{opacity:1;text-decoration:underline}
/* rendered document preview (expandable panel) */
.docview{margin:12px 14px 14px;border:1px solid var(--hair);border-radius:12px;overflow:hidden;background:var(--surface)}
.docview-h{display:flex;align-items:center;gap:11px;padding:10px 13px;background:var(--surface-2);border-bottom:1px solid var(--hair)}
.docview-h .dvi{flex:0 0 auto;width:30px;height:30px;border-radius:8px;display:grid;place-items:center;background:color-mix(in srgb,var(--signal) 16%,transparent);color:var(--signal)}
.docview-h .dvi svg{width:16px;height:16px}
.docview-h .dv-name{min-width:0;font-weight:600;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.docview-h .dv-tag{flex:0 0 auto;margin-left:auto;font-size:11px;font-weight:600;color:var(--muted);border:1px solid var(--hair);border-radius:999px;padding:2px 9px}
.docstage{position:relative;background:#fff;color:#111}
.docview .docbody{padding:18px 22px;overflow:hidden;transition:max-height .28s var(--ease)}
.docview:not(.open) .docbody{max-height:120px}
.docview.open .docbody{max-height:none;padding-bottom:52px}
.docview .docbody img{max-width:100%;height:auto}
.docview .docbody table{border-collapse:collapse;max-width:100%}
.docfade{position:absolute;left:0;right:0;bottom:0;height:78px;display:flex;align-items:flex-end;justify-content:center;padding-bottom:12px;
  background:linear-gradient(to bottom,rgba(255,255,255,0),#fff 78%);pointer-events:none}
.docview.open .docfade{display:none}
.peek{pointer-events:auto;appearance:none;border:1px solid rgba(0,0,0,.14);cursor:pointer;font:inherit;font-size:12.5px;font-weight:650;color:#222;background:#fff;
  height:34px;padding:0 15px;border-radius:999px;box-shadow:0 6px 18px rgba(0,0,0,.18);display:inline-flex;align-items:center;gap:7px;transition:transform .15s var(--ease)}
.peek:hover{transform:translateY(-1px)}
.peek:focus-visible{outline:2px solid var(--signal);outline-offset:2px}
.peek svg{width:14px;height:14px}
.doccollapse{position:absolute;left:0;right:0;bottom:0;display:none;justify-content:center;padding:10px 0 12px;background:linear-gradient(to bottom,rgba(255,255,255,0),#fff 60%)}
.docview.open .doccollapse{display:flex}
.collapsebtn{appearance:none;border:1px solid rgba(0,0,0,.14);background:#fff;color:#333;font:inherit;font-size:12px;font-weight:650;cursor:pointer;
  height:30px;padding:0 13px;border-radius:999px;display:inline-flex;align-items:center;gap:6px}
.collapsebtn:focus-visible{outline:2px solid var(--signal);outline-offset:2px}
.collapsebtn svg{width:13px;height:13px}

/* per-source panels in the generalized source-images dialog */
#sources .srcpanel{margin-top:18px}
#sources .srcpanel:first-of-type{margin-top:0}
#sources .srcpanel-h{margin:0 0 10px;font-size:14px;font-weight:650;letter-spacing:.02em}
#sources .dlg-empty{margin:8px 0;font-size:13px;color:var(--muted,#8a90a0)}

/* per-source "full day" link in a day divider */
.dayfull{margin-left:.6em;font-size:.72rem;color:var(--muted,#8a90a0);text-decoration:none;opacity:.8}
.dayfull:hover{opacity:1;text-decoration:underline}

  /* ===================== timeline windowing + nav rework ===================== */
  /* windowing sentinels (trigger paging; content is trimmed with scrollTop compensation) */
  .tl-sentinel{height:1px;pointer-events:none}

  /* lazy rendered-document preview control (auto-loads in-window; the button is
     a manual retry if the fetch fails) */
  .docview.lazy .docview-h{display:flex;align-items:center;gap:8px}
  .dv-load{appearance:none;border:1px solid var(--hair);background:var(--surface-2);color:var(--ink);font:inherit;font-size:12.5px;padding:5px 11px;border-radius:8px;cursor:pointer;margin-left:auto;transition:background .16s var(--ease)}
  .dv-load:hover{background:var(--surface-3)}
  .dv-load:disabled{opacity:.6;cursor:default}

  .mono{font-family:ui-monospace,"SF Mono","Cascadia Code","Roboto Mono",Menlo,monospace}

  /* ---------- source images page (/sources) ---------- */
  .srcpage{max-width:1180px;margin:0 auto;padding:16px 16px 60px}
  .srcpage .tnum{font-variant-numeric:tabular-nums}
  .srcpage .dot{width:9px;height:9px;border-radius:50%;flex:0 0 auto;background:var(--c,var(--muted))}

  .srcpage .shelf{background:var(--surface);border:1px solid var(--hair);border-radius:16px;padding:14px 16px;box-shadow:var(--shadow);margin:2px 0 8px}
  .srcpage .shelf-head{display:flex;align-items:baseline;gap:10px;margin-bottom:12px;flex-wrap:wrap}
  .srcpage .shelf-head .t{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--faint)}
  .srcpage .shelf-head .h{font-size:12px;color:var(--muted)}
  .srcpage .shelfrow{display:flex;gap:14px;flex-wrap:wrap}
  .srcpage .convcard{flex:1 1 280px;min-width:260px;border:1px solid var(--hair);border-radius:13px;padding:12px 13px;background:var(--bg-grad)}
  .srcpage .convcard .cc-nm{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:680}
  .srcpage .convcard .cc-meta{font-size:12px;color:var(--muted);margin-top:2px}
  .srcpage .convcard .cc-act{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
  .srcpage .convcard .cc-act a{font-size:12px;color:var(--muted);text-decoration:none;border:1px solid var(--hair);padding:4px 10px;border-radius:8px}
  .srcpage .convcard .cc-act a:hover{border-color:var(--signal);color:var(--signal)}

  .srcpage .section-lab{display:flex;align-items:center;gap:12px;margin:16px 2px 2px}
  .srcpage .section-lab .t{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--faint);white-space:nowrap}
  .srcpage .section-lab .ln{height:1px;background:var(--hair);flex:1}

  .srcpage .layout{display:grid;grid-template-columns:248px 1fr;gap:20px;align-items:start;margin-top:8px}
  .srcpage .rail{position:sticky;top:70px;background:var(--surface);border:1px solid var(--hair);border-radius:16px;overflow:hidden;box-shadow:var(--shadow)}
  .srcpage .rail-head{padding:12px 14px 8px;border-bottom:1px solid var(--hair)}
  .srcpage .rail-head .t{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--faint)}
  .srcpage .rail-scroll{max-height:66vh;overflow-y:auto;padding:6px}
  .srcpage .mono-month{position:sticky;top:0;background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:blur(4px);padding:8px 10px 5px;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);z-index:1}
  .srcpage .dayitem{width:100%;text-align:left;display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;cursor:pointer;color:var(--ink);text-decoration:none}
  .srcpage .dayitem:hover{background:var(--surface-2)}
  .srcpage .dayitem.on{background:color-mix(in srgb,var(--signal) 12%,transparent)}
  .srcpage .dayitem.on .dnum{color:var(--signal)}
  .srcpage .dcol{display:flex;flex-direction:column;min-width:0;flex:1}
  .srcpage .dnum{font-size:14px;font-weight:620;letter-spacing:-.01em}
  .srcpage .dwk{font-size:11px;color:var(--muted)}
  .srcpage .ddots{display:flex;gap:4px;flex:0 0 auto}

  .srcpage .viewer{min-width:0}
  .srcpage .vbar{display:flex;align-items:center;gap:12px;background:var(--surface);border:1px solid var(--hair);border-radius:14px;padding:10px 12px;box-shadow:var(--shadow);position:sticky;top:70px;z-index:5}
  .srcpage .navbtn{width:36px;height:36px;border-radius:10px;border:1px solid var(--hair);background:var(--surface-2);color:var(--ink)}
  .srcpage .navbtn:hover:not([disabled]){border-color:var(--signal);color:var(--signal)}
  .srcpage .navbtn[disabled]{opacity:.4;cursor:default}
  .srcpage .vday{display:flex;flex-direction:column}
  .srcpage .vday b{font-size:16px;font-weight:660;letter-spacing:-.01em}
  .srcpage .vday small{font-size:12px;color:var(--muted)}
  .srcpage .vcount{margin-left:auto;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
  .srcpage .kbd{border:1px solid var(--hair);border-bottom-width:2px;border-radius:6px;padding:1px 6px;font-size:11px;color:var(--muted);background:var(--surface-2)}

  .srcpage .srcblock{margin-top:18px}
  .srcpage .srchead{display:flex;align-items:center;gap:9px;margin-bottom:10px}
  .srcpage .srchead .nm{font-size:13px;font-weight:680}
  .srcpage .srchead .open{margin-left:auto;font-size:12px;color:var(--muted);text-decoration:none;border:1px solid var(--hair);padding:4px 10px;border-radius:8px}
  .srcpage .srchead .open:hover{border-color:var(--signal);color:var(--signal)}
  .srcpage .shot{border:1px solid var(--hair);border-radius:14px;background:var(--bg-grad);padding:14px;box-shadow:var(--shadow);max-height:560px;overflow:auto}
  .srcpage .shot img{display:block;max-width:100%;margin:0 auto;border-radius:8px}

  @media (max-width:820px){
    .srcpage .layout{grid-template-columns:1fr}
    .srcpage .rail{position:static}
    .srcpage .rail-scroll{max-height:none;display:flex;overflow-x:auto;overflow-y:hidden}
    .srcpage .mono-month{display:none}
    .srcpage .dayitem{flex-direction:column;align-items:flex-start;min-width:96px}
    .srcpage .vbar{position:static}
  }

  /* ---- source images: explicit-region redaction overlay ---- */
  .srcpage .srchead .redcount{font-size:11px;font-weight:600;color:var(--sms);background:color-mix(in srgb,var(--sms) 14%,transparent);border:1px solid color-mix(in srgb,var(--sms) 30%,transparent);border-radius:6px;padding:1px 7px}
  .srcpage .shotframe{position:relative;display:inline-block;max-width:100%}
  .srcpage .shotframe img{display:block;max-width:100%}
  .srcpage .redact{position:absolute;background:#0a0a0c;border:1px solid rgba(255,255,255,.16);border-radius:3px;cursor:pointer;overflow:hidden;transition:opacity .16s var(--ease)}
  .srcpage .redact::after{content:"explicit — hidden";position:absolute;inset:0;display:grid;place-items:center;text-align:center;font-size:10px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--faint);opacity:0;transition:opacity .16s var(--ease)}
  .srcpage .redact:hover::after{opacity:.75}
  .srcpage .redact.off,.srcpage.revealed .redact{opacity:0;pointer-events:none}
  #btnReveal.on{color:var(--sms);background:color-mix(in srgb,var(--sms) 12%,transparent)}

  /* ===================== Reports (Gaslight / Threats) ===================== */
  /* The rpt* styles are written against the gaslight accent vars; the threats
     page re-points them at the threat palette with one body-level override. */
  body.rpt-threats{--gaslight:var(--threat);--gaslight-bg:var(--threat-bg);--gaslight-line:var(--threat-line)}
  .mark-flame{background:linear-gradient(135deg,var(--gaslight),var(--amber))}
  .mark-flame svg{width:19px;height:19px;color:#fff}

  .rptbar{position:sticky;top:59px;z-index:var(--z-filter);display:flex;align-items:center;gap:14px;flex-wrap:wrap;
    padding:8px 16px;background:color-mix(in srgb,var(--surface) 82%,transparent);
    backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--hair)}
  .rptsubnav{display:flex;gap:4px}
  .rptsubtab{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border-radius:9px;font-size:13px;font-weight:560;
    color:var(--muted);text-decoration:none;border:1px solid transparent}
  .rptsubtab svg{width:15px;height:15px}
  .rptsubtab.on{color:var(--gaslight);background:var(--gaslight-bg);border-color:var(--gaslight-line)}
  .rptctl{display:flex;align-items:center;gap:10px;margin-left:auto;flex-wrap:wrap}
  .rptctl-lab{font-size:12px;color:var(--faint)}
  .rptseg{display:inline-flex;background:var(--surface-2);border:1px solid var(--hair);border-radius:9px;overflow:hidden}
  .rptseg-b{padding:6px 12px;font-size:12.5px;color:var(--muted);text-decoration:none;font-variant-numeric:tabular-nums;
    border-right:1px solid var(--hair);transition:background .16s var(--ease),color .16s var(--ease)}
  .rptseg-b:last-child{border-right:0}
  .rptseg-b:hover{background:var(--surface-3);color:var(--ink)}
  .rptseg-b.on{background:var(--gaslight);color:#fff}
  .rptexpand{font:inherit;font-size:12.5px;color:var(--muted);background:var(--surface-2);border:1px solid var(--hair);
    border-radius:9px;padding:6px 12px;cursor:pointer;transition:color .16s var(--ease),border-color .16s var(--ease)}
  .rptexpand:hover{color:var(--ink);border-color:var(--gaslight-line)}

  .rptwrap{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:246px minmax(0,1fr);gap:28px;padding:0 20px 90px;align-items:start}
  .rptwrap-empty{display:block}

  .sdot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--c,var(--muted));flex:0 0 auto}

  /* sidebar navigator */
  .rptside{position:sticky;top:114px;max-height:calc(100vh - 130px);overflow-y:auto;padding:22px 6px 30px 0;font-size:12.5px}
  .rptside-g{margin-bottom:16px}
  .rptside-h{display:flex;align-items:center;gap:7px;padding:6px 8px;margin-bottom:2px;color:var(--ink);text-decoration:none;
    font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase}
  .rptside-h:hover{color:var(--gaslight)}
  .rptside-c{margin-left:auto;font-weight:600;color:var(--faint);background:var(--surface-2);border:1px solid var(--hair);
    border-radius:999px;padding:1px 8px;font-size:10.5px}
  .rptside-i{display:flex;align-items:center;gap:8px;padding:6px 9px;border-radius:8px;text-decoration:none;color:var(--muted);line-height:1.35}
  .rptside-i:hover{background:var(--surface-2);color:var(--ink)}
  .rptside-i.on{background:var(--gaslight-bg);color:var(--gaslight);font-weight:560}
  .rptside-i .t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .rptside-i .n{flex:0 0 auto;font-variant-numeric:tabular-nums;font-size:10.5px;color:var(--faint)}
  .rptside-i.on .n{color:var(--gaslight)}

  .rptmain{min-width:0;padding-top:22px}

  /* dashboard */
  .rptdash{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:10px}
  .rpttile{background:var(--surface);border:1px solid var(--hair);border-radius:14px;padding:14px 16px;min-width:0}
  .rpttile .lab{display:block;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--faint);margin-bottom:9px}
  .rpttile .big{font-size:30px;font-weight:680;line-height:1;font-variant-numeric:tabular-nums}
  .rpttile .big.small{font-size:22px}
  .rpttile .big em{font-size:14px;font-style:normal;color:var(--faint);font-weight:500}
  .rpttile-sub{display:block;margin-top:6px;font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}
  .rptkvs{display:flex;flex-wrap:wrap;gap:12px}
  .rptkv{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--muted)}
  .rptkv b{font-size:19px;font-weight:680;font-variant-numeric:tabular-nums;color:var(--ink)}
  .rptwidetile{grid-column:1 / -1}
  .rptbars{display:flex;flex-direction:column;gap:6px}
  .rptbar{display:grid;grid-template-columns:180px minmax(0,1fr) 30px;align-items:center;gap:10px;font-size:12px}
  .rptbar .bn{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .rptbar .track{height:8px;background:var(--surface-2);border-radius:5px;overflow:hidden}
  .rptbar .fill{display:block;height:100%;background:var(--gaslight);opacity:.82;border-radius:5px}
  .rptbar .bc{text-align:right;color:var(--faint);font-variant-numeric:tabular-nums}

  /* confidence / severity chips */
  .conf{display:inline-block;font-size:10px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:2px 7px;border-radius:999px;
    background:var(--surface-2);color:var(--muted)}
  .conf.critical{background:var(--threat);color:#fff}
  .conf.high{background:var(--gaslight-bg);color:var(--gaslight)}
  .conf.medium{background:color-mix(in srgb,var(--amber) 16%,transparent);color:var(--amber)}
  .conf.low{background:var(--surface-3);color:var(--faint)}

  /* sections */
  .rptsec{margin-top:26px}
  .rptsec-h{display:flex;align-items:center;gap:9px;padding-bottom:9px;margin-bottom:12px;border-bottom:1px solid var(--hair);scroll-margin-top:120px}
  .rptsec-h h2{margin:0;font-size:18px;font-weight:660}
  .rptsec-c{margin-left:auto;font-size:12px;color:var(--faint);font-variant-numeric:tabular-nums}

  /* incident card */
  .rptcard{background:var(--surface);border:1px solid var(--hair);border-radius:14px;margin-bottom:11px;overflow:hidden;scroll-margin-top:124px}
  .rptcard[open]{box-shadow:var(--shadow)}
  .rptsum{list-style:none;cursor:pointer;display:flex;gap:11px;align-items:flex-start;padding:14px 16px}
  .rptsum::-webkit-details-marker{display:none}
  .rptchev{width:18px;height:18px;color:var(--faint);flex:0 0 auto;margin-top:2px;transition:transform .18s var(--ease)}
  .rptcard[open] .rptchev{transform:rotate(90deg)}
  .rptsum-m{min-width:0;flex:1}
  .rptsum-t{font-size:15px;font-weight:620;line-height:1.32}
  .rptsum-meta{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:7px}
  .rptdate{font-size:11.5px;color:var(--faint);font-variant-numeric:tabular-nums}
  .rptpat{font-size:11px;color:var(--muted);border:1px solid var(--hair);border-radius:999px;padding:2px 8px}
  .rptmsgn{font-size:11px;color:var(--faint)}
  .rptbody{padding:0 16px 16px 45px}
  .rptwhy{margin:0;font-size:14px;line-height:1.55;color:var(--ink);max-width:72ch}
  .rptcontra{margin-top:12px;background:color-mix(in srgb,var(--amber) 9%,var(--surface));
    border:1px solid color-mix(in srgb,var(--amber) 28%,var(--hair));border-radius:10px;padding:10px 13px}
  .rptcontra .l{display:block;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--amber);margin-bottom:4px}
  .rptcontra p{margin:0;font-size:13px;line-height:1.5}

  /* transcript */
  .rpttxh{display:flex;align-items:center;gap:10px;margin:16px 0 8px}
  .rpttxh .tl{font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
  .rptleg{margin-left:auto;display:flex;gap:12px;font-size:10.5px;color:var(--faint)}
  .rptleg span{display:inline-flex;align-items:center;gap:5px}
  .rptleg .lf::before{content:"";width:9px;height:9px;border-radius:2px;background:var(--gaslight)}
  .rptleg .lc::before{content:"";width:9px;height:9px;border-radius:2px;background:var(--bubble-them)}
  .rptgap{display:flex;align-items:center;justify-content:center;margin:12px 0 4px}
  .rptgap span{font-size:10.5px;color:var(--faint);background:var(--surface-2);border:1px solid var(--hair);border-radius:999px;padding:2px 12px;font-variant-numeric:tabular-nums}
  .rpttx{display:flex;flex-direction:column;gap:7px;padding:12px;background:var(--bg);border:1px solid var(--hair);border-radius:12px}
  .rptmsg{display:flex;flex-direction:column;gap:3px;max-width:86%}
  .rptmsg.them{align-self:flex-start;align-items:flex-start}
  .rptmsg.me{align-self:flex-end;align-items:flex-end}
  .rptbub{padding:8px 12px;border-radius:14px;font-size:13.5px;line-height:1.45;white-space:pre-wrap;word-break:break-word;
    background:var(--bubble-them);color:var(--ink-them);border:1px solid transparent}
  .rptmsg.them .rptbub{border-bottom-left-radius:5px}
  .rptmsg.me .rptbub{background:var(--signal-bubble);color:#fff;border-bottom-right-radius:5px}
  .rptmsg.ctx .rptbub{opacity:.6}
  .rptmsg.flag .rptbub{background:var(--gaslight-bg);border-color:var(--gaslight-line);color:var(--ink)}
  .rptmsg.reply .rptbub{background:var(--signal-bubble);color:#fff;box-shadow:0 0 0 2px color-mix(in srgb,var(--signal) 55%,transparent)}
  .rptsubj{font-size:11px;font-weight:600;color:var(--muted);padding:0 3px}
  .rptmm{display:flex;gap:7px;align-items:center;font-size:10px;color:var(--faint);padding:0 4px;flex-wrap:wrap}
  .rptmsg.me .rptmm{flex-direction:row-reverse}
  .rptmm .who{color:var(--muted);font-weight:600}
  .rptmm .mid{font-variant-numeric:tabular-nums;opacity:.85}
  .fchip{display:inline-flex;align-items:center;gap:3px;color:var(--gaslight);font-weight:700;text-transform:uppercase;font-size:9px;letter-spacing:.04em}
  .fchip svg{width:11px;height:11px}
  .rchip{color:var(--signal);font-weight:700;text-transform:uppercase;font-size:9px;letter-spacing:.04em}
  .rptsys{align-self:center;font-size:10.5px;color:var(--faint);background:var(--surface-2);border:1px solid var(--hair);border-radius:999px;padding:2px 12px}
  .rptnoctx{margin-top:12px;font-size:11px;color:var(--faint);word-break:break-word}

  /* empty state */
  .rptempty{max-width:440px;margin:80px auto;text-align:center}
  .rptempty-i{width:56px;height:56px;margin:0 auto 16px;border-radius:16px;display:grid;place-items:center;background:var(--gaslight-bg);color:var(--gaslight)}
  .rptempty-i svg{width:28px;height:28px}
  .rptempty-t{font-size:17px;font-weight:640;margin:0 0 6px}
  .rptempty-s{font-size:13.5px;color:var(--muted);margin:0;line-height:1.5}

  @media (max-width:900px){
    .rptwrap{grid-template-columns:1fr}
    .rptside{display:none}
    .rptdash{grid-template-columns:repeat(2,minmax(0,1fr))}
    .rptbar{top:57px}
    .rptbody{padding-left:16px}
  }
  @media (prefers-reduced-motion:reduce){
    .rptchev,.rptseg-b,.rptexpand{transition:none}
  }

  /* ---- transcript: explicit direction on message bubbles ---- */
  .rptdir{display:flex;align-items:center;gap:5px;font-size:10.5px;color:var(--faint);padding:0 5px 1px;max-width:100%}
  .rptdir b{color:var(--muted);font-weight:640;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .rptdir-arw{opacity:.7;flex:0 0 auto}

  /* ---- transcript: emails as distinct cards ---- */
  .rptmail{align-self:stretch;max-width:100%;background:var(--surface-2);border:1px solid var(--hair);border-radius:12px;
    padding:11px 13px;display:flex;flex-direction:column;gap:7px}
  .rptmail.flag{background:var(--gaslight-bg);border-color:var(--gaslight-line)}
  .rptmail.reply{background:color-mix(in srgb,var(--signal) 10%,var(--surface-2));border-color:color-mix(in srgb,var(--signal) 34%,var(--hair))}
  .rptmail-h{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
  .rptmail-tag{display:inline-flex;align-items:center;gap:5px;color:var(--email);font-weight:700;text-transform:uppercase;font-size:9.5px;letter-spacing:.05em;flex:0 0 auto}
  .rptmail-tag svg{width:13px;height:13px}
  .rptmail-dir{display:inline-flex;align-items:baseline;gap:6px;color:var(--muted);font-size:11.5px;min-width:0}
  .rptmail-dir b{color:var(--ink);font-weight:600;overflow-wrap:anywhere}
  .rptmail-arw{color:var(--faint);flex:0 0 auto}
  .rptmail-d{margin-left:auto;color:var(--faint);font-size:10.5px;font-variant-numeric:tabular-nums;flex:0 0 auto}
  .rptmail-subj{font-size:14.5px;font-weight:700;color:var(--ink);line-height:1.35;
    background:var(--surface);border:1px solid var(--hair);border-radius:9px;padding:8px 12px}
  .rptmail-subj::before{content:"Subject: ";color:var(--faint);font-weight:640;font-size:11px;
    text-transform:uppercase;letter-spacing:.05em;margin-right:2px}
  .rptmail-ex{font-size:12.5px;line-height:1.5;color:var(--muted);white-space:pre-wrap;word-break:break-word}
  .rptfull{margin-top:1px}
  .rptfull>summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:5px;font-size:11.5px;color:var(--signal);font-weight:560;width:max-content;padding:2px 0}
  .rptfull>summary::-webkit-details-marker{display:none}
  .rptfull>summary::before{content:"▸";font-size:9px;transition:transform .16s var(--ease)}
  .rptfull[open]>summary::before{transform:rotate(90deg)}
  .rptfull>summary:hover{color:var(--ink)}
  .rptfull-b{margin-top:8px;padding:11px 13px;background:var(--bg);border:1px solid var(--hair);border-radius:9px;
    font-size:12.5px;line-height:1.55;color:var(--ink);white-space:pre-wrap;word-break:break-word;max-height:440px;overflow:auto}
  .rptmail-id{font-size:10px;color:var(--faint);font-variant-numeric:tabular-nums}

  @media (prefers-reduced-motion:reduce){ .rptfull>summary::before{transition:none} }

/* ============================== Caselaw library (/caselaw) ============================== */
:root{ --clw:#6ea8fe; --clw-bg:rgba(110,168,254,.13); --clw-line:rgba(110,168,254,.42); }
:root[data-theme="light"]{ --clw:#2f6fd0; --clw-bg:rgba(47,111,208,.10); --clw-line:rgba(47,111,208,.34); }
.mark-clw{background:linear-gradient(135deg,var(--clw),var(--event))}
.mark-clw svg{width:19px;height:19px;color:#fff}
.clwtab.on{color:var(--clw);background:var(--clw-bg);border-color:var(--clw-line)}
.clwtab svg{width:15px;height:15px}
.clwhint{font-size:11.5px;color:var(--faint)}
.clwhint code{background:var(--surface-2);padding:1px 5px;border-radius:5px}
.clwwrap{grid-template-columns:300px minmax(0,1fr)}
.clwside-h{cursor:default}
.clwcase{padding:9px 10px;border:1px solid transparent;border-radius:11px;margin:0 0 7px}
.clwcase.on{background:var(--surface);border-color:var(--hair)}
.clwcase-d{display:block;font-size:10.5px;color:var(--faint);font-variant-numeric:tabular-nums;letter-spacing:.02em}
.clwcase-t{display:block;font-size:12.5px;font-weight:620;color:var(--ink);line-height:1.35;margin:2px 0 7px}
.clwdocs{display:flex;flex-wrap:wrap;gap:5px}
.clwdoc-l{font-size:11px;padding:3px 9px;border:1px solid var(--hair);border-radius:999px;color:var(--muted);text-decoration:none;background:var(--surface-2)}
.clwdoc-l:hover{color:var(--ink);border-color:var(--clw-line)}
.clwdoc-l.on{color:var(--clw);background:var(--clw-bg);border-color:var(--clw-line);font-weight:600}
.clwread{background:var(--surface);border:1px solid var(--hair);border-radius:14px;padding:28px 32px 38px}
.clwdoct{display:inline-block;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--clw);background:var(--clw-bg);border:1px solid var(--clw-line);border-radius:999px;padding:3px 10px;margin-bottom:10px}
.clwhead h1{margin:0;font-size:21px;font-weight:680;letter-spacing:-.01em;line-height:1.25}
.clwmeta{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:9px 18px;margin:16px 0 4px;padding:13px 15px;background:var(--surface-2);border:1px solid var(--hair);border-radius:11px}
.clwkv{font-size:12.5px;min-width:0}
.clwkv .k{display:block;color:var(--faint);font-size:10px;text-transform:uppercase;letter-spacing:.06em;margin-bottom:1px}
.clwkv .v{color:var(--ink);word-break:break-word}
.clwkv a{color:var(--clw);text-decoration:none;word-break:break-all}
.clwkv a:hover{text-decoration:underline}
.clwbody{max-width:78ch;font-size:14.5px;line-height:1.72;color:var(--ink);margin-top:18px}
.clwbody h1{font-size:19px;margin:28px 0 10px;line-height:1.3}
.clwbody h2{font-size:16.5px;margin:26px 0 9px;line-height:1.3}
.clwbody h3,.clwbody h4{font-size:14.5px;margin:22px 0 7px}
.clwbody p{margin:0 0 13px}
.clwbody ul,.clwbody ol{margin:0 0 13px;padding-left:26px}
.clwbody li{margin:0 0 7px}
.clwbody li>p{margin-bottom:7px}
.clwbody blockquote{margin:14px 0;padding:9px 16px;border-left:3px solid var(--clw-line);background:var(--surface-2);border-radius:0 9px 9px 0;color:var(--muted)}
.clwbody blockquote p:last-child{margin-bottom:0}
.clwbody hr{border:0;border-top:1px solid var(--hair);margin:24px 0}
.clwbody code{background:var(--surface-2);padding:1px 5px;border-radius:5px;font-size:.92em}
.clwbody table{border-collapse:collapse;font-size:13px;margin:14px 0;display:block;overflow-x:auto;max-width:100%}
.clwbody th,.clwbody td{border:1px solid var(--hair);padding:6px 10px;text-align:left;vertical-align:top}
.clwbody th{background:var(--surface-2)}
.clwerr,.clwpick{padding-top:80px}
.clwempty-i svg{width:26px;height:26px}
.rptempty-i.clwempty-i{background:var(--clw-bg);color:var(--clw)}
@media (max-width:900px){
  .clwwrap{grid-template-columns:1fr}
  .clwwrap .rptside{display:block;position:static;max-height:none;padding-top:14px}
}

  /* ---------- import review ---------- */
  .revsplit{display:grid;grid-template-columns:320px 1fr;gap:16px;margin-top:16px}
  @media (max-width:780px){ .revsplit{grid-template-columns:1fr} }
  .revoriginal{background:var(--surface);border:1px solid var(--hair);border-radius:12px;padding:12px;align-self:start;position:sticky;top:70px;max-height:80vh;overflow:auto}
  .revimg{max-width:100%;border:1px solid var(--hair);border-radius:8px;display:block;margin-bottom:8px}
  .revpdf{width:100%;height:70vh;border:1px solid var(--hair);border-radius:8px}
  .revpaste{font-size:12px;white-space:pre-wrap;word-break:break-word;color:var(--muted);margin:0}
  .revmsgs{min-width:0}
  .revhead{margin-bottom:8px}
  .revbatch{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;font-weight:600;color:var(--muted)}
  .revbatch input{font:inherit;font-size:12.5px;background:var(--surface-2);border:1px solid var(--hair);border-radius:7px;color:var(--ink);padding:4px 8px}
  .revrow{display:grid;grid-template-columns:auto auto auto 1fr auto;gap:8px;align-items:center;background:var(--surface);border:1px solid var(--hair);border-radius:10px;padding:8px 10px;margin-bottom:8px}
  .revrow select,.revrow input{font:inherit;font-size:12.5px;background:var(--surface-2);border:1px solid var(--hair);border-radius:7px;color:var(--ink);padding:5px 8px;min-width:0}
  .revrow .revtext{width:100%}
  .revdel{color:var(--faint);cursor:pointer;display:inline-flex;align-items:center;gap:4px;font-size:13px}
  .revdel input{accent-color:var(--threat)}
  .revrow:has(.revdel input:checked){opacity:.45;text-decoration:line-through}
  .revactions{display:flex;gap:10px;justify-content:flex-end;margin-top:10px}
  @media (max-width:780px){ .revrow{grid-template-columns:1fr 1fr;grid-auto-rows:auto} .revrow .revtext{grid-column:1/-1} }