@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&display=swap');

/* ── DESIGN TOKENS ── */
:root {
  /* Color system (HSL channels — use as hsl(var(--name))) */
  --background:             24 25% 11%;
  --foreground:             0 0% 93%;
  --card:                   24 20% 14%;
  --card-foreground:        0 0% 93%;
  --popover:                24 20% 14%;
  --popover-foreground:     0 0% 93%;
  --primary:                43 100% 57%;
  --primary-foreground:     24 25% 11%;
  --secondary:              24 15% 18%;
  --secondary-foreground:   0 0% 85%;
  --muted:                  24 12% 20%;
  --muted-foreground:       24 10% 55%;
  --accent:                 43 100% 57%;
  --accent-foreground:      24 25% 11%;
  --destructive:            0 72% 51%;
  --destructive-foreground: 0 0% 100%;
  --border:                 24 15% 22%;
  --input:                  24 15% 22%;
  --ring:                   43 100% 57%;
  --gold:                   43 100% 57%;
  --gold-hover:             43 100% 50%;
  --sidebar-background:     24 25% 9%;
  --sidebar-foreground:     0 0% 80%;
  --sidebar-primary:        43 100% 57%;
  --sidebar-primary-fg:     24 25% 11%;
  --sidebar-accent:         24 20% 16%;
  --sidebar-accent-fg:      0 0% 93%;
  --sidebar-border:         24 15% 18%;
  --radius:                 0.75rem;

  /* ── SPACING SYSTEM ── */
  --sp-1:  0.25rem;   /*  4px */
  --sp-2:  0.5rem;    /*  8px */
  --sp-3:  0.75rem;   /* 12px */
  --sp-4:  1rem;      /* 16px */
  --sp-5:  1.25rem;   /* 20px */
  --sp-6:  1.5rem;    /* 24px */
  --sp-8:  2rem;      /* 32px */
  --sp-10: 2.5rem;    /* 40px */
  --sp-12: 3rem;      /* 48px */
  --sp-16: 4rem;      /* 64px */

  /* ── LAYOUT ── */
  --sidebar-w:          220px;
  --topbar-h:           58px;
  --page-x:             2.25rem;   /* 36px — main horizontal padding */
  --page-top:           2rem;      /* 32px — page title top padding */
  --view-pad-bottom:    3rem;      /* 48px */
  --card-pad:           1.5rem;    /* consistent card inner padding */
  --card-gap:           0.875rem;  /* gap between cards */

  /* ── TYPOGRAPHY ── */
  --text-xs:       0.6875rem;  /* 11px */
  --text-sm:       0.8125rem;  /* 13px */
  --text-body:     0.875rem;   /* 14px  — body copy */
  --text-subhead:  1rem;       /* 16px  — subheadings */
  --text-title:    1.5rem;     /* 24px  — section titles */
  --text-page:     1.75rem;    /* 28px  — page titles */
}

/* ── RESET & BASE ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; }

body {
  background-color: hsl(var(--background));
  color: hsl(var(--foreground));
  font-family: 'Outfit', system-ui, -apple-system, sans-serif;
  font-size: var(--text-body);
  line-height: 1.5;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 600;
  letter-spacing: -0.025em;
  color: hsl(var(--foreground));
}

a { color: inherit; text-decoration: none; }
button, input, select, textarea { font-family: inherit; }
img, svg, video { display: block; }

/* ── AUTH ── */
#auth-gate {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
}
.auth-box {
  width: 360px;
  padding: var(--sp-10);
  background: hsl(var(--sidebar-background));
  border: 1px solid hsl(var(--gold) / 0.25);
  border-radius: var(--radius);
  box-shadow: 0 4px 24px rgba(0,0,0,.4);
}
.auth-logo {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  margin-bottom: var(--sp-8);
}
.logo-mark {
  width: 38px; height: 38px;
  background: hsl(var(--gold) / 0.15);
  border: 1px solid hsl(var(--gold));
  border-radius: calc(var(--radius) - 2px);
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 13px; color: hsl(var(--gold));
}
.logo-text { font-size: 15px; font-weight: 700; letter-spacing: .06em; line-height: 1.2; }
.logo-text span { display: block; font-size: 10px; font-weight: 400; color: hsl(var(--muted-foreground)); letter-spacing: .1em; margin-top: 1px; }
.auth-form { display: flex; flex-direction: column; gap: var(--sp-2); }
.auth-form input {
  background: hsl(var(--muted));
  border: 1px solid hsl(var(--border));
  border-radius: calc(var(--radius) - 2px);
  padding: 11px 14px;
  color: hsl(var(--foreground));
  font-size: var(--text-body);
  outline: none;
  transition: border-color .15s;
}
.auth-form input:focus { border-color: hsl(var(--gold) / 0.5); }
.auth-form button {
  background: hsl(var(--gold) / 0.15);
  border: 1px solid hsl(var(--gold));
  border-radius: calc(var(--radius) - 2px);
  padding: 11px;
  color: hsl(var(--gold));
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .1em;
  cursor: pointer;
  transition: background .15s;
}
.auth-form button:hover { background: hsl(var(--gold) / 0.28); }
.auth-error { font-size: 12px; color: hsl(var(--destructive)); margin-top: var(--sp-2); min-height: 16px; }

/* ── LAYOUT ── */
#app { display: flex; min-height: 100vh; }

/* ── SIDEBAR ── */
#sidebar {
  width: var(--sidebar-w);
  background: hsl(var(--sidebar-background));
  display: flex;
  flex-direction: column;
  position: fixed;
  top: 0; left: 0; bottom: 0;
  z-index: 100;
  border-right: 1px solid hsl(var(--sidebar-border));
}

.sidebar-logo {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  padding: var(--sp-5) var(--sp-4) var(--sp-4);
  border-bottom: 1px solid hsl(var(--gold) / 0.15);
  margin-bottom: var(--sp-1);
}
.sidebar-logo-img {
  width: 140px;
  height: auto;
  display: block;
}
.sidebar-client-selector {
  margin: var(--sp-4) var(--sp-3);
  padding: var(--sp-2) var(--sp-3);
  background: hsl(var(--muted));
  border: 1px solid hsl(var(--gold));
  border-radius: calc(var(--radius) - 2px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  transition: background .15s;
}
.sidebar-client-selector:hover { background: hsl(var(--gold) / 0.1); }
.sidebar-client-name { font-size: 13px; font-weight: 600; color: hsl(var(--foreground)); }
.sidebar-client-caret { color: hsl(var(--gold)); display: flex; align-items: center; }

.sidebar-nav { flex: 1; padding: var(--sp-2) var(--sp-2); display: flex; flex-direction: column; gap: 1px; }

.nav-item {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  padding: var(--sp-2) 11px;
  border-radius: calc(var(--radius) - 2px);
  color: hsl(var(--muted-foreground));
  text-decoration: none;
  font-size: 13px;
  font-weight: 500;
  transition: background .15s, color .15s;
}
.nav-item svg { width: 15px; height: 15px; flex-shrink: 0; stroke: currentColor; fill: none; stroke-width: 1.8; }
.nav-item:hover { background: hsl(var(--sidebar-accent)); color: hsl(var(--foreground)); }
.nav-item.active {
  background: hsl(var(--gold) / 0.12);
  color: hsl(var(--gold));
  box-shadow: inset 2px 0 0 hsl(var(--gold));
}

.sidebar-status {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  padding: 14px var(--sp-4);
  border-top: 1px solid hsl(var(--sidebar-border));
  font-size: 11px;
  color: hsl(var(--muted-foreground) / 0.6);
}
.status-dot { width: 6px; height: 6px; border-radius: 50%; background: hsl(var(--muted)); transition: background .3s; }
.status-dot.online { background: #4ade80; box-shadow: 0 0 5px #4ade80; }
.sidebar-logout {
  display: block;
  width: calc(100% - 2 * var(--sp-4));
  margin: 8px var(--sp-4) 16px;
  padding: 8px;
  background: transparent;
  border: 1px solid hsl(var(--sidebar-border));
  border-radius: 6px;
  color: hsl(var(--muted-foreground) / 0.6);
  font-size: 12px;
  cursor: pointer;
  transition: color .2s, border-color .2s;
}
.sidebar-logout:hover { color: hsl(var(--foreground)); border-color: hsl(var(--foreground) / 0.3); }

/* ── MAIN ── */
#main {
  margin-left: var(--sidebar-w);
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

/* ── TOPBAR ── */
#topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 var(--page-x);
  height: var(--topbar-h);
  background: hsl(var(--background));
  border-bottom: 1px solid hsl(var(--border));
  position: sticky;
  top: 0;
  z-index: 50;
}
.topbar-left { display: flex; align-items: baseline; gap: var(--sp-3); }
.topbar-left h2 { font-size: var(--text-subhead); font-weight: 600; color: hsl(var(--muted-foreground)); }
.topbar-right { display: flex; align-items: center; gap: var(--sp-3); position: relative; }

.date-pill {
  display: flex;
  align-items: center;
  gap: var(--sp-1);
  padding: 6px 14px;
  background: hsl(var(--muted));
  border: 1px solid hsl(var(--border));
  border-radius: 9999px;
  font-size: 12px;
  color: hsl(var(--muted-foreground));
  cursor: pointer;
  transition: border-color .15s;
}
.date-pill:hover { border-color: hsl(var(--gold) / 0.35); }
.date-pill svg { width: 12px; height: 12px; }

.date-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  background: hsl(var(--sidebar-background));
  border: 1px solid hsl(var(--border));
  border-radius: var(--radius);
  padding: 14px;
  z-index: 200;
  min-width: 220px;
  box-shadow: 0 8px 24px rgba(0,0,0,.4);
}
.date-dropdown.hidden { display: none; }
.date-presets { display: flex; flex-direction: column; gap: 2px; margin-bottom: var(--sp-3); }
.date-preset {
  background: none;
  border: none;
  color: hsl(var(--muted-foreground));
  font-size: 13px;
  text-align: left;
  padding: 7px 10px;
  border-radius: calc(var(--radius) - 4px);
  cursor: pointer;
  transition: background .12s, color .12s;
}
.date-preset:hover { background: hsl(var(--gold) / 0.08); color: hsl(var(--foreground)); }
.date-preset.active { background: hsl(var(--gold) / 0.15); color: hsl(var(--gold)); }
.date-custom { border-top: 1px solid hsl(var(--border)); padding-top: var(--sp-3); display: flex; flex-direction: column; gap: var(--sp-1); }
.date-custom label { font-size: 11px; color: hsl(var(--muted-foreground)); text-transform: uppercase; letter-spacing: .05em; }
.date-custom input[type="date"] {
  background: hsl(var(--muted));
  border: 1px solid hsl(var(--border));
  border-radius: calc(var(--radius) - 4px);
  color: hsl(var(--foreground));
  font-size: 12px;
  padding: 6px 10px;
  width: 100%;
  box-sizing: border-box;
}

.avatar {
  width: 30px; height: 30px;
  background: hsl(var(--gold) / 0.15);
  border: 1px solid hsl(var(--gold));
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 10px; font-weight: 700; color: hsl(var(--gold));
}

/* ── VIEWS ── */
.view { display: none; flex-direction: column; }
.view.active { display: flex; }

.page-title {
  font-size: var(--text-page);
  font-weight: 600;
  padding: var(--page-top) var(--page-x) 0;
  letter-spacing: -0.025em;
  color: hsl(var(--foreground));
}

/* ── TABS ── */
.view-tabs { display: flex; gap: 2px; padding: var(--sp-4) var(--page-x) 0; }
.view-tabs-inner {
  display: flex;
  background: hsl(var(--muted));
  border-radius: 9999px;
  padding: 3px;
  gap: 2px;
}
.tab-btn {
  padding: 6px var(--sp-4);
  border-radius: 9999px;
  font-size: 13px;
  font-weight: 500;
  color: hsl(var(--muted-foreground));
  background: none;
  border: none;
  cursor: pointer;
  transition: background .15s, color .15s;
}
.tab-btn:hover { color: hsl(var(--foreground)); }
.tab-btn.active { background: hsl(var(--gold) / 0.2); color: hsl(var(--gold)); font-weight: 600; }

/* ── VIEW BODY ── */
.view-body { padding: var(--sp-6) var(--page-x) var(--view-pad-bottom); }

/* ── FORM / FLAT FIELDS ── */
.form-section { margin-bottom: var(--sp-8); }
.form-section-title {
  font-size: var(--text-xs);
  font-weight: 600;
  color: hsl(var(--muted-foreground));
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-bottom: var(--sp-5);
}
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-5); margin-bottom: var(--sp-4); }
.form-field { display: flex; flex-direction: column; gap: var(--sp-1); }
.form-label {
  font-size: var(--text-xs);
  font-weight: 500;
  color: hsl(var(--muted-foreground));
  text-transform: uppercase;
  letter-spacing: .07em;
}
.form-input {
  background: hsl(var(--muted));
  border: 1px solid transparent;
  border-radius: calc(var(--radius) - 2px);
  padding: 10px var(--sp-3);
  color: hsl(var(--foreground));
  font-size: 13px;
  outline: none;
  transition: border-color .15s;
}
.form-input:focus { border-color: hsl(var(--gold) / 0.4); }

/* ── BUTTONS ── */
.btn-outline {
  background: none;
  border: 1px solid hsl(var(--gold) / 0.35);
  border-radius: calc(var(--radius) - 2px);
  padding: var(--sp-2) var(--sp-4);
  color: hsl(var(--muted-foreground));
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  transition: border-color .15s, color .15s, background .15s;
}
.btn-outline:hover { border-color: hsl(var(--gold)); color: hsl(var(--gold)); background: hsl(var(--gold) / 0.1); }

.btn-gold {
  background: hsl(var(--gold) / 0.15);
  border: 1px solid hsl(var(--gold));
  border-radius: calc(var(--radius) - 2px);
  padding: var(--sp-2) var(--sp-4);
  color: hsl(var(--gold));
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: background .15s;
}
.btn-gold:hover { background: hsl(var(--gold) / 0.28); }

/* ── STATUS / INTEGRATION ── */
.integration-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 0;
  border-bottom: 1px solid hsl(var(--border));
}
.integration-name { font-size: 13px; font-weight: 500; }
.integration-meta { font-size: 12px; color: hsl(var(--muted-foreground)); margin-top: 2px; }
.status-badge {
  font-size: 11px;
  font-weight: 600;
  padding: 3px 9px;
  border-radius: 9999px;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.status-ok      { background: rgba(74,222,128,.1);  color: #4ade80; }
.status-error   { background: hsl(var(--destructive) / 0.15); color: hsl(var(--destructive)); }
.status-pending { background: hsl(var(--gold) / 0.1); color: hsl(var(--gold)); }
.status-none    { background: hsl(var(--muted)); color: hsl(var(--muted-foreground)); }

/* ── CLIENTS GRID ── */
.clients-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px,1fr)); gap: var(--card-gap); margin-top: var(--sp-3); }
.client-card {
  background: hsl(var(--card));
  border: 1px solid hsl(var(--border));
  border-radius: var(--radius);
  padding: var(--card-pad);
  cursor: pointer;
  transition: border-color .15s, box-shadow .15s;
}
.client-card:hover { border-color: hsl(var(--gold) / 0.3); box-shadow: 0 4px 16px rgba(0,0,0,.3); }
.client-card-name { font-size: var(--text-body); font-weight: 600; margin-bottom: 3px; }
.client-card-slug { font-size: 12px; color: hsl(var(--muted-foreground)); }
.client-card-industry {
  display: inline-block;
  margin-top: var(--sp-3);
  font-size: 11px;
  font-weight: 500;
  padding: 3px 9px;
  border-radius: 9999px;
  background: hsl(var(--gold) / 0.1);
  color: hsl(var(--gold));
  letter-spacing: .04em;
}

/* ── PLACEHOLDER ── */
.placeholder-view {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 80px 20px;
  text-align: center;
  color: hsl(var(--muted-foreground) / 0.6);
}
.placeholder-icon { font-size: 36px; margin-bottom: var(--sp-4); opacity: .4; }
.placeholder-view h3 { font-size: var(--text-subhead); font-weight: 600; color: hsl(var(--muted-foreground)); margin-bottom: var(--sp-2); }
.placeholder-view p { font-size: 13px; max-width: 300px; line-height: 1.6; }

/* ── CLIENT DROPDOWN ── */
.client-avatar { width:22px;height:22px;background:hsl(var(--gold) / 0.15);border:1px solid hsl(var(--gold));border-radius:5px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:hsl(var(--gold)); }
.client-dropdown { position:absolute;top:64px;left:12px;right:12px;background:hsl(var(--muted));border:1px solid hsl(var(--gold) / 0.3);border-radius:var(--radius);z-index:200;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.5); }
.client-dropdown-item { display:flex;align-items:center;gap:10px;padding:10px 14px;cursor:pointer;transition:background .12s; }
.client-dropdown-item:hover { background:hsl(var(--sidebar-accent)); }
.client-dd-avatar { width:26px;height:26px;background:hsl(var(--gold) / 0.15);border:1px solid hsl(var(--gold));border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:hsl(var(--gold));flex-shrink:0; }
.client-dd-name { font-size:13px;font-weight:600;color:hsl(var(--foreground)); }
.client-dd-slug { font-size:11px;color:hsl(var(--muted-foreground)); }

/* ── PLATFORM TABS ── */
.platform-tabs { display:flex;gap:2px;background:hsl(var(--muted));border-radius:9999px;padding:3px;width:fit-content; }
.ptab { padding:6px 18px;border-radius:9999px;font-size:13px;font-weight:500;color:hsl(var(--muted-foreground));background:none;border:none;cursor:pointer;transition:background .15s,color .15s; }
.ptab.active { background:hsl(var(--gold) / 0.2);color:hsl(var(--gold));font-weight:600; }

/* ── KPI ROW ── */
.kpi-row { display:grid;grid-template-columns:repeat(3,1fr);gap:var(--card-gap); }
.kpi-card {
  background: hsl(var(--card));
  border: 1px solid hsl(var(--border));
  border-radius: var(--radius);
  padding: var(--card-pad);
  transition: border-color .15s;
}
.kpi-card:hover { border-color: hsl(var(--gold) / 0.25); }
.kpi-platform { font-size:var(--text-xs);font-weight:600;color:hsl(var(--muted-foreground));text-transform:uppercase;letter-spacing:.08em;margin-bottom:var(--sp-2); }
.kpi-big { font-size:28px;font-weight:700;color:hsl(var(--foreground));letter-spacing:-.02em; }
.kpi-sub { font-size:13px;color:hsl(var(--muted-foreground));margin-top:var(--sp-1); }
.kpi-meta { display:flex;gap:var(--sp-3);flex-wrap:wrap;margin-top:var(--sp-1); }
.kpi-meta span { font-size:12px;color:hsl(var(--muted-foreground)); }
.kpi-loading { font-size:13px;color:hsl(var(--muted-foreground) / 0.6);margin-top:var(--sp-2); }
.kpi-error { font-size:12px;color:hsl(var(--destructive));margin-top:var(--sp-2); }

/* ── TWO COL ── */
.two-col { display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-5); }
.section-label { font-size:var(--text-xs);font-weight:600;color:hsl(var(--muted-foreground));text-transform:uppercase;letter-spacing:.08em;margin-bottom:var(--sp-2); }

/* ── SIGNAL GRID (full page) ── */
.signal-grid { display:flex;flex-wrap:wrap;gap:var(--card-gap);align-items:flex-start; }
.signal-card {
  width: 300px;
  flex: 0 0 300px;
  height: 200px;
  overflow: hidden;
  background: hsl(var(--card));
  border: 1px solid hsl(var(--border));
  border-radius: var(--radius);
  padding: 14px var(--sp-4);
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  transition: border-color .15s;
  box-sizing: border-box;
}
.signal-card:hover { border-color: hsl(var(--gold) / 0.3); }
.signal-card-top { display:flex;align-items:center;justify-content:space-between;gap:var(--sp-2); }
.signal-card-body { flex:1;display:flex;flex-direction:column;gap:var(--sp-1); }
.signal-title { font-size:13px;font-weight:500;color:hsl(var(--foreground));line-height:1.4; }
.signal-summary { font-size:12px;color:hsl(var(--muted-foreground));line-height:1.5;flex:1;overflow:hidden;display:-webkit-box;-webkit-line-clamp:10;-webkit-box-orient:vertical; }
.signal-card-footer { display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:var(--sp-1); }
.signal-read-more { font-size:11px;color:hsl(var(--gold));background:none;border:none;cursor:pointer;padding:0;opacity:.85; }
.signal-read-more:hover { opacity:1; }

/* ── SIGNAL LIST (overview panel) ── */
.signal-list, .alert-list { display:flex;flex-direction:column;gap:var(--sp-2); }
.signal-row { display:flex;align-items:flex-start;gap:var(--sp-3);padding:var(--sp-3) 0;border-bottom:1px solid hsl(var(--border)); }
.signal-row:last-child { border-bottom:none; }
.signal-source-badge { font-size:10px;font-weight:600;padding:3px 8px;border-radius:9999px;white-space:nowrap;text-transform:uppercase;letter-spacing:.05em;flex-shrink:0; }
.src-openfda          { background:rgba(224,92,92,.15);  color:#e05c5c; }
.src-clinicaltrials   { background:rgba(74,222,128,.12); color:#4ade80; }
.src-pubmed           { background:rgba(72,120,220,.15); color:#7eaaff; }
.src-niihreporter     { background:rgba(168,108,220,.15);color:#b87fff; }
.src-secedgar         { background:rgba(220,160,60,.15); color:#dca03c; }
.src-orangebook       { background:rgba(220,120,60,.15); color:#e07840; }
.src-euclinicaltrials { background:rgba(60,180,220,.15); color:#3cb4dc; }
.src-fdaapprovals     { background:rgba(224,92,92,.15);  color:#e05c5c; }
.src-googlenews       { background:rgba(100,180,100,.15);color:#64b464; }
.src-competitive      { background:hsl(var(--gold) / 0.15); color:hsl(var(--gold)); }
.signal-body { flex:1;min-width:0; }
.signal-summary-row { font-size:12px;color:hsl(var(--muted-foreground));line-height:1.5; }
.signal-link { font-size:11px;color:hsl(var(--gold));text-decoration:none;margin-top:var(--sp-1);display:inline-block; }
.signal-ts { font-size:11px;color:hsl(var(--muted-foreground) / 0.6);white-space:nowrap;flex-shrink:0; }

/* ── ALERTS ── */
.alert-row { display:flex;align-items:center;gap:var(--sp-2);padding:10px 0;border-bottom:1px solid hsl(var(--border));font-size:13px;color:hsl(var(--foreground)); }
.sev-badge { font-size:10px;font-weight:600;padding:2px 7px;border-radius:9999px;text-transform:uppercase;flex-shrink:0; }
.sev-critical .sev-badge { background:hsl(var(--destructive) / 0.2);color:hsl(var(--destructive)); }
.sev-high .sev-badge     { background:rgba(255,180,0,.15);color:#ffb400; }
.sev-medium .sev-badge   { background:hsl(var(--gold) / 0.15);color:hsl(var(--gold)); }

/* ── TABLES ── */
.gb-table { width:100%;border-collapse:collapse;font-size:13px; }
.gb-table th { text-align:left;font-size:11px;font-weight:600;color:hsl(var(--muted-foreground));text-transform:uppercase;letter-spacing:.07em;padding:8px var(--sp-3);border-bottom:1px solid hsl(var(--border)); }
.gb-table td { padding:11px var(--sp-3);border-bottom:1px solid hsl(var(--border) / 0.5);color:hsl(var(--foreground)); }
.gb-table tr:hover td { background:hsl(var(--muted) / 0.5); }
.td-primary { font-weight:500; }

/* ── FILTER ROW ── */
.filter-row { display:flex;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-1); }
.gb-select { background:hsl(var(--muted));border:1px solid hsl(var(--border));border-radius:calc(var(--radius) - 2px);padding:7px var(--sp-3);color:hsl(var(--foreground));font-size:13px;outline:none; }
.gb-select option { background:hsl(var(--sidebar-background)); }

/* ── BRIEFINGS ── */
.briefing-card { background:hsl(var(--card));border:1px solid hsl(var(--border));border-radius:var(--radius);padding:var(--card-pad);margin-bottom:var(--sp-2);cursor:pointer;transition:border-color .15s; }
.briefing-card:hover { border-color:hsl(var(--gold) / 0.3); }
.briefing-dates { font-size:12px;color:hsl(var(--gold));font-weight:600;margin-bottom:var(--sp-1); }
.briefing-preview { font-size:13px;color:hsl(var(--muted-foreground));line-height:1.5;margin-bottom:var(--sp-2); }
.briefing-meta { font-size:11px;color:hsl(var(--muted-foreground) / 0.6); }
.briefing-full { background:hsl(var(--card));border:1px solid hsl(var(--border));border-radius:var(--radius);padding:28px 32px;line-height:1.7;color:hsl(var(--foreground)); }
.briefing-full h1 { font-size:var(--text-title);font-weight:700;margin:0 0 var(--sp-4);color:hsl(var(--foreground)); }
.briefing-full h2 { font-size:var(--text-subhead);font-weight:600;color:hsl(var(--gold));margin:var(--sp-5) 0 var(--sp-2);border-bottom:1px solid hsl(var(--border));padding-bottom:var(--sp-1); }
.briefing-full ul { padding-left:20px;margin:var(--sp-2) 0; }
.briefing-full li { margin-bottom:5px;font-size:13px; }
.briefing-full p { font-size:13px;margin-bottom:var(--sp-2); }
.briefing-full strong { color:hsl(var(--foreground)); }

/* ── ADMIN ── */
.admin-client-card { background:hsl(var(--card));border:1px solid hsl(var(--border));border-radius:var(--radius);padding:var(--card-pad);margin-bottom:var(--sp-4); }
.admin-client-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-1); }
.admin-client-name { font-size:var(--text-subhead);font-weight:600; }
.admin-client-slug { font-size:12px;color:hsl(var(--muted-foreground)); }

/* ── PROVIDER BADGE ── */
.provider-badge { font-size:11px;font-weight:600;padding:2px 8px;border-radius:9999px;background:rgba(72,120,220,.15);color:#7eaaff;text-transform:uppercase; }

/* ── OUTREACH ── */
.reply-rate { font-size:12px;font-weight:600;padding:2px 8px;border-radius:9999px; }
.rate-hot  { background:rgba(40,180,100,.15);color:#4ade80; }
.rate-warm { background:hsl(var(--gold) / 0.15);color:hsl(var(--gold)); }
.rate-cold { background:hsl(var(--muted));color:hsl(var(--muted-foreground)); }

.disconnected-state { display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;text-align:center;gap:var(--sp-2); }
.disconnected-icon { font-size:32px;opacity:.4; }
.disconnected-title { font-size:var(--text-subhead);font-weight:600;color:hsl(var(--muted-foreground)); }
.disconnected-sub { font-size:12px;color:hsl(var(--muted-foreground) / 0.6); }
.disconnected-sub code { background:hsl(var(--muted));padding:2px 6px;border-radius:4px;color:hsl(var(--gold));font-size:11px; }

/* ── CAMPAIGN DRILL-DOWN ── */
.campaign-list-table tr.campaign-row { cursor:default; }
.drill-btn { background:transparent;border:1px solid hsl(var(--border));color:hsl(var(--gold));padding:3px 10px;border-radius:4px;font-size:11px;cursor:pointer;white-space:nowrap; }
.drill-btn:hover { background:hsl(var(--gold) / 0.1); }

.detail-nav { display:flex;align-items:center;gap:14px;margin-bottom:var(--sp-4); }
.detail-breadcrumb { font-size:12px;color:hsl(var(--muted-foreground)); }
.detail-breadcrumb .crumb-campaign:hover { color:hsl(var(--gold)); }
.gb-btn-secondary { background:transparent;border:1px solid hsl(var(--border));color:hsl(var(--muted-foreground));padding:5px 12px;border-radius:4px;font-size:12px;cursor:pointer; }
.gb-btn-secondary:hover { border-color:hsl(var(--gold));color:hsl(var(--gold)); }

.ad-cards-grid { display:flex;flex-wrap:wrap;gap:var(--card-gap);align-items:flex-start; }
.ad-creative-card { width:320px;flex:0 0 320px;background:hsl(var(--card));border:1px solid hsl(var(--border));border-radius:var(--radius);padding:var(--card-pad);display:flex;flex-direction:column;gap:var(--sp-2); }
.ad-creative-header { display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap; }
.ad-type-badge { font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;padding:2px 7px;border-radius:3px;background:rgba(66,153,225,.15);color:#63b3ed; }
.li-badge { background:rgba(0,119,181,.15);color:#5eaee0; }
.ad-metrics-inline { margin-left:auto;display:flex;gap:10px;font-size:11px;color:hsl(var(--muted-foreground)); }
.ad-headlines { font-size:13px;font-weight:600;color:hsl(var(--foreground));line-height:1.4; }
.ad-descriptions { font-size:12px;color:hsl(var(--muted-foreground));line-height:1.5; }
.ad-url { font-size:10px;color:hsl(var(--muted-foreground) / 0.6);word-break:break-all; }
.ad-url a { color:hsl(var(--muted-foreground) / 0.6);text-decoration:none; }
.ad-url a:hover { color:hsl(var(--gold)); }
.ad-creative-footer { display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:var(--sp-2);gap:var(--sp-2); }
.ad-creative-id { font-size:10px;color:hsl(var(--muted-foreground) / 0.6); }
.cm-preview-link { font-size:11px;color:hsl(var(--gold));text-decoration:none;white-space:nowrap; }
.cm-preview-link:hover { text-decoration:underline; }
.ad-boosted-post { font-size:12px;color:hsl(var(--muted-foreground));font-style:italic; }
.ad-company { font-size:11px;font-weight:600;color:hsl(var(--gold));text-transform:uppercase;letter-spacing:.4px; }
.ad-cta { display:inline-block;margin-top:var(--sp-1);font-size:11px;font-weight:600;color:hsl(var(--foreground));border:1px solid hsl(var(--border));border-radius:4px;padding:3px 10px; }

.drill-empty { display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 24px;text-align:center;gap:var(--sp-2); }
.drill-empty-icon { font-size:28px;opacity:.35; }
.drill-empty-title { font-size:var(--text-body);font-weight:600;color:hsl(var(--muted-foreground)); }
.drill-empty-sub { font-size:12px;color:hsl(var(--muted-foreground) / 0.6);max-width:400px;line-height:1.6; }
.drill-empty-err .drill-empty-icon { opacity:.5; }
.drill-empty-err .drill-empty-title { color:hsl(var(--destructive)); }

/* ── PIPELINE SUMMARY ── */
.pipeline-summary .kpi-row { grid-template-columns:repeat(3,1fr); }

/* ── MODAL ── */
.modal-overlay { position:fixed;inset:0;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;z-index:500; }
.modal-box { background:hsl(var(--card));border:1px solid hsl(var(--gold) / 0.3);border-radius:var(--radius);padding:28px;width:400px;box-shadow:0 16px 48px rgba(0,0,0,.6); }
.modal-title { font-size:var(--text-subhead);font-weight:700;margin-bottom:var(--sp-5); }

/* ── TOAST ── */
#gb-toast { position:fixed;bottom:28px;right:28px;background:hsl(var(--card));border:1px solid hsl(var(--gold));border-radius:calc(var(--radius) - 2px);padding:10px 18px;font-size:13px;color:hsl(var(--gold));opacity:0;pointer-events:none;transition:opacity .2s;z-index:999; }
#gb-toast.visible { opacity:1; }

/* ── MISC ── */
.gb-loading { font-size:13px;color:hsl(var(--muted-foreground) / 0.6);padding:20px 0; }
.empty-state { font-size:13px;color:hsl(var(--muted-foreground) / 0.6);padding:20px 0; }
.error-state { font-size:13px;color:hsl(var(--destructive));padding:20px 0; }
.hidden { display:none !important; }