/* The Weekly AI Debrief (debrief.js). Suneeta's widget styles, kept as
   written, with its color variables pointed at the site's own tokens.
   It sits below the fixed header: --debrief-top clears it.

   Grounds, set on the <aside> with data-ground:
     navy   the site's default, and the health plan pages
     cream  the small business pages
     auto   follows the visitor's system setting (home, Client Community)

   Text colors meet WCAG AA on each ground: emerald is used as text only on
   navy; on cream, accents are navy and amber. */

.dbf{
  --debrief-top:calc(var(--nav-h,72px) + 12px);
  --display:"Manrope",system-ui,sans-serif;
  --body:"Public Sans",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
}
.dbf,.dbf[data-ground="navy"]{
  --paper:var(--navy); --sheet:var(--card-navy); --ink:var(--on-navy);
  --ink2:var(--muted-navy); --ink3:var(--muted-navy); --rule:var(--line-navy);
  --sting:var(--red-on-navy); --sting-bg:color-mix(in srgb,var(--red-on-navy) 7%,var(--card-navy));
  --measure:var(--emerald); --measure-bg:color-mix(in srgb,var(--emerald) 7%,var(--card-navy));
}
.dbf[data-ground="cream"]{
  --paper:var(--cream); --sheet:var(--card-cream); --ink:var(--on-cream);
  --ink2:var(--muted-cream); --ink3:var(--muted-cream); --rule:var(--line-cream);
  --sting:var(--amber-on-cream); --sting-bg:color-mix(in srgb,var(--amber-on-cream) 5%,var(--card-cream));
  --measure:var(--navy); --measure-bg:var(--emerald-soft);
}
@media (prefers-color-scheme:light){
  .dbf[data-ground="auto"]{
    --paper:var(--cream); --sheet:var(--card-cream); --ink:var(--on-cream);
    --ink2:var(--muted-cream); --ink3:var(--muted-cream); --rule:var(--line-cream);
    --sting:var(--amber-on-cream); --sting-bg:color-mix(in srgb,var(--amber-on-cream) 5%,var(--card-cream));
    --measure:var(--navy); --measure-bg:var(--emerald-soft);
  }
}

.dbf{position:fixed;z-index:150;top:calc(env(safe-area-inset-top,0px) + var(--debrief-top,12px));right:max(12px,env(safe-area-inset-right,0px));display:grid;justify-items:end;gap:8px;font-family:var(--body);color:var(--ink);line-height:1.5}
.dbf-chip{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--rule);background:var(--sheet);color:var(--ink);border-radius:999px;padding:6px 12px 6px 10px;cursor:pointer;font:inherit;font-size:13px;box-shadow:0 2px 10px rgba(0,0,0,.08)}
.dbf-chip b{font-weight:600}
.dbf-chip:focus-visible{outline:none;box-shadow:var(--ring)}
.dbf-dot{width:8px;height:8px;border-radius:50%;background:var(--sting)}
.dbf-n{font-family:var(--mono);font-size:11px;background:var(--paper);border:1px solid var(--rule);border-radius:999px;padding:0 6px;color:var(--ink2)}
.dbf-panel{width:min(400px,calc(100vw - 24px));max-height:min(72vh,660px);display:flex;flex-direction:column;background:var(--sheet);border:1px solid var(--rule);border-radius:12px;box-shadow:0 12px 32px rgba(0,0,0,.16);overflow:hidden}
.dbf-head{padding:14px 16px 10px;border-bottom:1px solid var(--rule);display:grid;gap:8px}
.dbf-head h2{font-family:var(--display);font-size:18px;margin:0;font-weight:700;line-height:1.2;color:var(--ink)}
.dbf-sub{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink3)}
.dbf-filters{display:flex;flex-wrap:wrap;gap:6px}
.dbf-filters button{border:1px solid var(--rule);background:none;color:var(--ink2);border-radius:999px;padding:2px 10px;font:inherit;font-size:12px;cursor:pointer}
.dbf-filters button[aria-pressed="true"]{border-color:var(--measure);background:var(--measure-bg);color:var(--ink)}
.dbf-filters button:focus-visible{outline:none;box-shadow:var(--ring)}
.dbf-list{overflow-y:auto;padding:6px 10px 12px;display:grid;gap:8px;overscroll-behavior:contain}
.dbf-card{border:1px solid var(--rule);border-radius:10px;background:var(--sheet)}
.dbf-card>button{all:unset;box-sizing:border-box;display:grid;gap:6px;width:100%;padding:12px;cursor:pointer}
.dbf-card>button:focus-visible{outline:2px solid var(--emerald);outline-offset:-2px;border-radius:10px}
.dbf-tags{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.dbf-tag{font-family:var(--mono);font-size:10.5px;letter-spacing:.04em;text-transform:uppercase;padding:1px 7px;border-radius:4px}
.dbf-tag.known{background:var(--measure-bg);color:var(--measure)} .dbf-tag.termite{background:var(--sting-bg);color:var(--sting)} .dbf-tag.thread{background:var(--paper);color:var(--ink2);border:1px solid var(--rule)}
.dbf-line{font-family:var(--mono);font-size:10.5px;color:var(--ink2);border:1px solid var(--rule);border-radius:999px;padding:0 7px}
.dbf-line.mine{border-color:var(--sting);color:var(--sting)}
.dbf-title{font-weight:600;font-size:14px;line-height:1.35}
.dbf-sum{font-size:13px;color:var(--ink2);line-height:1.5}
.dbf-more{padding:0 12px 12px;display:grid;gap:8px;font-size:13px;line-height:1.5}
.dbf-more dl{margin:0}
.dbf-more dt{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink3)}
.dbf-more dd{margin:0 0 4px}
.dbf-check{background:var(--paper);border:1px solid var(--rule);border-radius:8px;padding:8px 10px}
.dbf-more a{color:var(--measure);text-underline-offset:2px}
.dbf-fig svg{width:100%;height:auto;display:block;font-family:var(--body)}
.dbf-foot{font-size:11.5px;color:var(--ink3);padding:8px 16px 12px;border-top:1px solid var(--rule)}
@media (max-width:520px){.dbf-chip .dbf-label{display:none}.dbf-panel{max-height:calc(100dvh - var(--debrief-top,12px) - 40px)}}
@media (prefers-reduced-motion:no-preference){.dbf-panel.is-opening{animation:dbfIn .18s ease-out}@keyframes dbfIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}}