/* ---------------------------------------------------------------------------
 * Brapho CRM application styles.
 * Consumes semantic tokens from tokens.css only. No raw hex values here.
 * ------------------------------------------------------------------------- */

/* --- reset & base -------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}

html,body{height:100%}

body{
  margin:0;
  background:var(--surface-page);
  color:var(--text-body);
  font-family:var(--font-sans);
  font-size:var(--size-body);
  line-height:var(--leading-normal);
  -webkit-font-smoothing:antialiased;
  text-wrap:pretty;
}

h1,h2,h3,h4{
  font-family:var(--font-serif);
  font-weight:var(--weight-semibold);
  color:var(--text-strong);
  line-height:var(--leading-snug);
  letter-spacing:var(--tracking-display);
  margin:0;
}
h1{font-size:1.875rem}
h2{font-size:1.375rem}
h3{font-size:1.0625rem}
p{margin:0}

a{color:var(--text-link);text-decoration:none;transition:var(--transition-ui)}
a:hover{color:var(--text-link-hover)}

:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;border-radius:var(--radius-sm)}
::selection{background:var(--rose-200);color:var(--ink-900)}

/* Monospace for anything numeric or identifying. */
.mono,.amount,.ref,.date,td.num,th.num{
  font-family:var(--font-mono);
  font-variant-numeric:tabular-nums;
}
.amount{font-weight:var(--weight-medium)}
.ref{font-size:var(--size-small);color:var(--text-muted);letter-spacing:.01em}

.muted{color:var(--text-muted)}
.small{font-size:var(--size-small)}
.label{
  font-family:var(--font-mono);
  font-size:var(--size-label);
  letter-spacing:var(--tracking-label);
  text-transform:uppercase;
  color:var(--text-muted);
}

/* --- app shell ----------------------------------------------------------- */
.shell{display:flex;min-height:100vh}

.sidebar{
  width:var(--sidebar-w);
  flex:0 0 var(--sidebar-w);
  background:var(--surface-sidebar);
  color:var(--text-inverse);
  display:flex;
  flex-direction:column;
  position:sticky;
  top:0;
  height:100vh;
}
.sidebar__brand{
  display:flex;align-items:center;gap:var(--space-2);
  height:var(--topbar-h);
  padding:0 var(--space-5);
  border-bottom:1px solid var(--line-grid-inverse);
}
.sidebar__brand strong{
  font-family:var(--font-serif);
  font-size:1.125rem;
  font-weight:var(--weight-semibold);
  color:var(--paper-100);
  letter-spacing:var(--tracking-display);
}
.sidebar__brand span{
  font-family:var(--font-mono);
  font-size:var(--size-label);
  letter-spacing:var(--tracking-label);
  color:var(--ink-300);
}
.sidebar__nav{padding:var(--space-4) var(--space-3);display:flex;flex-direction:column;gap:2px;flex:1}
.sidebar__section{
  font-family:var(--font-mono);font-size:var(--size-label);
  letter-spacing:var(--tracking-label);text-transform:uppercase;
  color:var(--ink-400);padding:var(--space-4) var(--space-3) var(--space-2);
}
.nav-item{
  display:flex;align-items:center;gap:var(--space-3);
  padding:var(--space-2) var(--space-3);
  border-radius:var(--radius-control);
  color:var(--paper-300);
  font-size:var(--size-small);
  transition:var(--transition-ui);
}
.nav-item:hover{background:var(--ink-800);color:var(--paper-100)}
.nav-item--active{background:var(--surface-accent);color:var(--paper-100)}
.nav-item--active:hover{background:var(--rose-700);color:var(--paper-100)}
.nav-item svg{width:17px;height:17px;flex:0 0 17px;stroke-width:1.6}
.sidebar__foot{
  padding:var(--space-4);border-top:1px solid var(--line-grid-inverse);
  font-size:var(--size-label);color:var(--ink-400);font-family:var(--font-mono);
}

.main{flex:1;min-width:0;display:flex;flex-direction:column}

.topbar{
  height:var(--topbar-h);
  flex:0 0 var(--topbar-h);
  background:var(--surface-topbar);
  border-bottom:var(--border-hairline);
  display:flex;align-items:center;justify-content:space-between;
  gap:var(--space-4);
  padding:0 var(--space-6);
  position:sticky;top:0;z-index:20;
}
.topbar__org{display:flex;align-items:center;gap:var(--space-3)}
.topbar__user{display:flex;align-items:center;gap:var(--space-3)}

.avatar{
  width:30px;height:30px;border-radius:var(--radius-pill);
  background:var(--surface-tint-violet);color:var(--violet-700);
  display:grid;place-items:center;
  font-family:var(--font-mono);font-size:var(--size-label);font-weight:var(--weight-medium);
  flex:0 0 30px;
}
.avatar--rose{background:var(--surface-tint-rose);color:var(--rose-700)}

.content{padding:var(--space-6);max-width:1400px;width:100%}
.page-head{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:var(--space-4);margin-bottom:var(--space-5);flex-wrap:wrap;
}
.page-head p{color:var(--text-muted);font-size:var(--size-small)}

/* --- controls ------------------------------------------------------------ */
.btn{
  display:inline-flex;align-items:center;gap:var(--space-2);
  padding:7px var(--space-4);
  border-radius:var(--radius-control);
  border:1px solid transparent;
  font-family:var(--font-sans);font-size:var(--size-small);font-weight:var(--weight-medium);
  line-height:1.4;cursor:pointer;transition:var(--transition-ui);
  text-decoration:none;
}
.btn--primary{background:var(--surface-accent);color:var(--paper-100);border-color:var(--surface-accent)}
.btn--primary:hover{background:var(--rose-700);border-color:var(--rose-700);color:var(--paper-100)}
.btn--secondary{background:var(--surface-card);color:var(--ink-800);border-color:var(--line-hairline)}
.btn--secondary:hover{background:var(--surface-hover);color:var(--ink-900)}
.btn--ghost{background:transparent;color:var(--text-muted);padding:5px var(--space-3)}
.btn--ghost:hover{background:var(--surface-hover);color:var(--text-body)}
.btn--danger{background:transparent;color:var(--state-danger);border-color:var(--line-hairline)}
.btn--danger:hover{background:var(--state-danger-tint)}
.btn--sm{padding:4px var(--space-3);font-size:var(--size-label)}
.btn svg{width:15px;height:15px;stroke-width:1.8}

input[type=text],input[type=email],input[type=password],input[type=search],
input[type=number],input[type=date],input[type=datetime-local],select,textarea{
  width:100%;
  padding:7px var(--space-3);
  border:1px solid var(--line-hairline);
  border-radius:var(--radius-control);
  background:var(--surface-card);
  color:var(--text-body);
  font-family:var(--font-sans);
  font-size:var(--size-small);
  transition:var(--transition-ui);
}
input:hover,select:hover,textarea:hover{border-color:var(--ink-300)}
input:focus,select:focus,textarea:focus{outline:2px solid var(--focus-ring);outline-offset:1px;border-color:var(--focus-ring)}
input[type=number],input[type=date],input[type=datetime-local]{font-family:var(--font-mono)}
textarea{resize:vertical;min-height:72px;line-height:var(--leading-normal)}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink-400) 50%),linear-gradient(135deg,var(--ink-400) 50%,transparent 50%);background-position:calc(100% - 15px) 50%,calc(100% - 10px) 50%;background-size:5px 5px;background-repeat:no-repeat;padding-right:var(--space-6)}

.field{display:flex;flex-direction:column;gap:5px;margin-bottom:var(--space-4)}
.field > label{font-size:var(--size-small);font-weight:var(--weight-medium);color:var(--text-body)}
.field .help{font-size:var(--size-label);color:var(--text-muted)}
.field .error{font-size:var(--size-label);color:var(--state-danger)}
.field--inline{flex-direction:row;align-items:center;gap:var(--space-2);margin-bottom:0}
.field--inline input[type=checkbox]{width:auto}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:0 var(--space-4)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:0 var(--space-4)}

/* --- cards & surfaces ---------------------------------------------------- */
.card{
  background:var(--surface-card);
  border:var(--border-hairline);
  border-radius:var(--radius-card);
  padding:var(--space-5);
}
.card--flush{padding:0;overflow:hidden}
.card__head{
  display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);
  padding:var(--space-4) var(--space-5);border-bottom:var(--border-hairline);
}
.card__body{padding:var(--space-5)}
.card__foot{padding:var(--space-3) var(--space-5);border-top:var(--border-hairline);background:var(--surface-raised)}

.stack{display:flex;flex-direction:column;gap:var(--space-5)}
.row{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap}
.row--between{justify-content:space-between}
.spacer{flex:1}

.empty{
  padding:var(--space-7) var(--space-5);text-align:center;color:var(--text-muted);
  font-size:var(--size-small);
}

/* --- KPI tiles ----------------------------------------------------------- */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:var(--space-4)}
.kpi{
  background:var(--surface-card);border:var(--border-hairline);
  border-radius:var(--radius-card);padding:var(--space-4) var(--space-5);
}
.kpi__label{
  font-family:var(--font-mono);font-size:var(--size-label);
  letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-muted);
}
.kpi__value{
  font-family:var(--font-mono);font-size:1.75rem;font-weight:var(--weight-medium);
  color:var(--text-strong);line-height:1.2;margin-top:var(--space-2);
  font-variant-numeric:tabular-nums;
}
.kpi__note{font-size:var(--size-label);color:var(--text-muted);margin-top:2px}
.kpi--alert .kpi__value{color:var(--state-danger)}
.kpi--won .kpi__value{color:var(--state-success)}

/* --- bar chart (stages) -------------------------------------------------- */
.bars{display:flex;flex-direction:column;gap:var(--space-3)}
.bar{display:grid;grid-template-columns:130px 1fr 96px;align-items:center;gap:var(--space-3);font-size:var(--size-small)}
.bar__track{height:22px;background:var(--surface-raised);border-radius:var(--radius-sm);overflow:hidden}
.bar__fill{height:100%;background:var(--surface-tint-rose);border-right:2px solid var(--surface-accent);min-width:2px}
.bar__fill--violet{background:var(--surface-tint-violet);border-right-color:var(--surface-accent-alt)}
.bar__fill--won{background:var(--surface-won);border-right-color:var(--state-success)}
.bar__fill--lost{background:var(--surface-lost);border-right-color:var(--ink-300)}
.bar__value{text-align:right;font-family:var(--font-mono);font-size:var(--size-small);color:var(--text-muted)}

/* --- tables -------------------------------------------------------------- */
.table{width:100%;border-collapse:collapse;font-size:var(--size-small)}
.table th{
  text-align:left;padding:var(--space-3) var(--space-4);
  font-family:var(--font-mono);font-size:var(--size-label);
  letter-spacing:var(--tracking-label);text-transform:uppercase;
  color:var(--text-muted);font-weight:var(--weight-medium);
  border-bottom:var(--border-hairline);white-space:nowrap;
}
.table td{padding:var(--space-3) var(--space-4);border-bottom:var(--border-hairline);vertical-align:middle}
.table tbody tr:last-child td{border-bottom:none}
.table tbody tr:hover{background:var(--surface-hover)}
.table .num{text-align:right;font-family:var(--font-mono);font-variant-numeric:tabular-nums}
.table a{font-weight:var(--weight-medium)}

/* --- chips / badges ------------------------------------------------------ */
.chip{
  display:inline-flex;align-items:center;gap:5px;
  padding:2px var(--space-2);border-radius:var(--radius-sm);
  font-family:var(--font-mono);font-size:var(--size-label);
  background:var(--surface-raised);color:var(--ink-600);
  border:1px solid transparent;white-space:nowrap;
}
.chip--rose{background:var(--surface-tint-rose);color:var(--rose-700)}
.chip--violet{background:var(--surface-tint-violet);color:var(--violet-700)}
.chip--paper{background:var(--surface-raised);color:var(--ink-600)}
.chip--won{background:var(--surface-won);color:var(--state-success)}
.chip--lost{background:var(--surface-lost);color:var(--ink-400)}
.chip--danger{background:var(--state-danger-tint);color:var(--state-danger)}
.chip--warning{background:var(--state-warning-tint);color:var(--state-warning)}
.chip--success{background:var(--state-success-tint);color:var(--state-success)}
.chip--outline{background:transparent;border-color:var(--line-hairline);color:var(--text-muted)}

/* --- filter bar ---------------------------------------------------------- */
.filters{
  display:flex;gap:var(--space-3);align-items:flex-end;flex-wrap:wrap;
  padding:var(--space-4) var(--space-5);
  background:var(--surface-card);border:var(--border-hairline);
  border-radius:var(--radius-card);margin-bottom:var(--space-4);
}
.filters .field{margin-bottom:0;min-width:150px}
.filters .field--search{flex:1;min-width:220px}

/* --- kanban -------------------------------------------------------------- */
.kanban{display:flex;gap:var(--space-4);overflow-x:auto;padding-bottom:var(--space-4);align-items:flex-start}
.column{
  flex:0 0 272px;
  background:var(--surface-column);
  border:var(--border-hairline);
  border-radius:var(--radius-card);
  display:flex;flex-direction:column;max-height:calc(100vh - 220px);
}
.column--rose{background:var(--surface-tint-rose)}
.column--violet{background:var(--surface-tint-violet)}
.column--won{background:var(--surface-won)}
.column--lost{background:var(--surface-lost)}
.column__head{
  padding:var(--space-3) var(--space-4);
  display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-2);
  border-bottom:1px solid rgba(0,0,0,.06);
}
.column__name{font-size:var(--size-small);font-weight:var(--weight-semibold);color:var(--text-strong)}
.column__meta{font-family:var(--font-mono);font-size:var(--size-label);color:var(--ink-600)}
.column__body{padding:var(--space-3);display:flex;flex-direction:column;gap:var(--space-3);overflow-y:auto;flex:1;min-height:80px}
.column--over{outline:2px dashed var(--focus-ring);outline-offset:-3px}

.deal{
  background:var(--surface-card);
  border:var(--border-hairline);
  border-radius:var(--radius-control);
  padding:var(--space-3);
  cursor:grab;
  transition:var(--transition-ui);
  display:block;
}
.deal:hover{box-shadow:var(--shadow-stamp);transform:translate(-1px,-1px)}
.deal--dragging{opacity:.4;cursor:grabbing}
.deal__title{font-size:var(--size-small);font-weight:var(--weight-medium);color:var(--text-strong);margin-bottom:2px;line-height:var(--leading-snug)}
.deal__contact{font-size:var(--size-label);color:var(--text-muted);margin-bottom:var(--space-2)}
.deal__foot{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);margin-top:var(--space-2)}
.deal__amount{font-family:var(--font-mono);font-size:var(--size-small);font-weight:var(--weight-medium);color:var(--text-strong)}

/* --- timeline ------------------------------------------------------------ */
.timeline{display:flex;flex-direction:column}
.tl-item{display:grid;grid-template-columns:24px 1fr;gap:var(--space-3);padding-bottom:var(--space-4)}
.tl-item__rail{display:flex;flex-direction:column;align-items:center;gap:4px}
.tl-item__dot{
  width:var(--node-size);height:var(--node-size);border-radius:var(--radius-pill);
  background:var(--node-primary);margin-top:6px;flex:0 0 var(--node-size);
}
.tl-item__dot--muted{background:var(--paper-400)}
.tl-item__dot--violet{background:var(--node-secondary)}
.tl-item__line{width:1px;flex:1;background:var(--line-hairline)}
.tl-item:last-child .tl-item__line{display:none}
.tl-item__body{min-width:0;padding-bottom:var(--space-1)}
.tl-item__head{display:flex;align-items:baseline;gap:var(--space-2);flex-wrap:wrap;margin-bottom:2px}
.tl-item__text{font-size:var(--size-small);color:var(--text-body);white-space:pre-wrap}

/* --- tabs ---------------------------------------------------------------- */
.tabs{display:flex;gap:var(--space-1);border-bottom:var(--border-hairline);margin-bottom:var(--space-5)}
.tab{
  padding:var(--space-2) var(--space-4);font-size:var(--size-small);
  color:var(--text-muted);border-bottom:2px solid transparent;margin-bottom:-1px;
  transition:var(--transition-ui);
}
.tab{display:inline-flex;align-items:center;gap:var(--space-2)}
.tab:hover{color:var(--text-body)}
.tab--active{color:var(--text-accent);border-bottom-color:var(--surface-accent);font-weight:var(--weight-medium)}

/* --- messages ------------------------------------------------------------ */
.messages{position:fixed;top:calc(var(--topbar-h) + var(--space-4));right:var(--space-6);z-index:60;display:flex;flex-direction:column;gap:var(--space-2)}
.message{
  padding:var(--space-3) var(--space-4);border-radius:var(--radius-control);
  font-size:var(--size-small);background:var(--surface-card);
  border:var(--border-hairline);box-shadow:var(--shadow-stamp);max-width:360px;
}
.message--success{border-left:3px solid var(--state-success)}
.message--error{border-left:3px solid var(--state-danger)}
.message--warning{border-left:3px solid var(--state-warning)}

/* --- two-column detail layout -------------------------------------------- */
.split{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:var(--space-5);align-items:start}
.deflist{display:grid;grid-template-columns:auto 1fr;gap:var(--space-2) var(--space-4);font-size:var(--size-small)}
.deflist dt{color:var(--text-muted)}
.deflist dd{margin:0;color:var(--text-body);word-break:break-word}

/* --- login --------------------------------------------------------------- */
.auth{min-height:100vh;display:grid;place-items:center;padding:var(--space-5);background:var(--surface-raised)}
.auth__card{
  width:100%;max-width:392px;background:var(--surface-card);
  border:var(--border-hairline);border-radius:var(--radius-card);
  padding:var(--space-7);
}
.auth__brand{display:flex;align-items:baseline;gap:var(--space-2);margin-bottom:var(--space-2)}
.auth__brand strong{font-family:var(--font-serif);font-size:1.5rem;color:var(--text-strong)}
.auth__brand span{font-family:var(--font-mono);font-size:var(--size-label);letter-spacing:var(--tracking-label);color:var(--text-muted)}
.auth__hint{
  margin-top:var(--space-5);padding-top:var(--space-4);border-top:var(--border-hairline);
  font-size:var(--size-label);color:var(--text-muted);font-family:var(--font-mono);line-height:1.7;
}
.auth__note{
  margin-top:var(--space-5);padding-top:var(--space-4);border-top:var(--border-hairline);
  font-size:var(--size-small);color:var(--text-muted);line-height:1.6;
}

/* --- modal --------------------------------------------------------------- */
dialog.modal{
  border:var(--border-hairline);border-radius:var(--radius-card);
  padding:0;max-width:640px;width:calc(100% - var(--space-6));
  background:var(--surface-card);color:var(--text-body);
}
dialog.modal::backdrop{background:rgba(18,23,29,.42)}

/* Disabled controls read as unavailable, not merely quiet. */
.btn[disabled]{opacity:.45;pointer-events:none}

/* --- pagination ---------------------------------------------------------- */
.pager{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);font-size:var(--size-small)}

/* --- responsive ---------------------------------------------------------- */
@media (max-width:980px){
  .split{grid-template-columns:1fr}
  .grid-2,.grid-3{grid-template-columns:1fr}
}
@media (max-width:760px){
  .shell{flex-direction:column}
  .sidebar{width:100%;flex:none;height:auto;position:static}
  .sidebar__nav{flex-direction:row;overflow-x:auto;padding:var(--space-2)}
  .sidebar__section,.sidebar__foot{display:none}
  .nav-item{white-space:nowrap}
  .content{padding:var(--space-4)}
  .topbar{padding:0 var(--space-4)}
}

/* --- travel modules: quotes, bookings, collections ------------------------ */
.nowrap{white-space:nowrap}
.check{display:flex;align-items:center;gap:var(--space-2);font-size:var(--size-small);color:var(--text-body);cursor:pointer}
.check input{width:auto;margin:0}
.totals{display:flex;justify-content:flex-end;padding:var(--space-4) var(--space-5);border-top:var(--border-hairline);background:var(--surface-raised)}
.totals dl{display:grid;grid-template-columns:auto 140px;gap:var(--space-2) var(--space-5);margin:0;font-size:var(--size-small)}
.totals dt{color:var(--text-muted);text-align:right}
.totals dd{margin:0;text-align:right;font-family:var(--font-mono);font-variant-numeric:tabular-nums}
.totals .totals__grand{font-size:var(--size-body-lg);font-weight:var(--weight-semibold);color:var(--text-strong);padding-top:var(--space-2);border-top:var(--border-hairline)}
.disclosure{margin-top:var(--space-5);padding-top:var(--space-4);border-top:var(--border-hairline)}
.disclosure summary{cursor:pointer;font-size:var(--size-small);font-weight:var(--weight-medium);color:var(--text-link)}
.progress{height:8px;background:var(--surface-raised);border-radius:var(--radius-pill);overflow:hidden;min-width:80px}
.progress__fill{height:100%;background:var(--surface-accent-alt);border-radius:var(--radius-pill)}
.progress__fill--paid{background:var(--state-success)}
.progress__fill--overdue{background:var(--state-danger)}
.balance{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4);margin-bottom:var(--space-4)}
.balance__label{font-size:var(--size-label);color:var(--text-muted);text-transform:uppercase;letter-spacing:var(--tracking-label)}
.balance__value{font-family:var(--font-mono);font-size:1.35rem;font-variant-numeric:tabular-nums;color:var(--text-strong)}
.balance__value--due{color:var(--state-danger)}
.balance__value--ok{color:var(--state-success)}
tr.row--void td{color:var(--text-muted);text-decoration:line-through}
tr.row--void td.keep{text-decoration:none}
tr.row--done .task-title{color:var(--text-muted);font-weight:500}
.inline-form{display:flex;gap:var(--space-2);align-items:center}
.inline-form input{min-width:180px}
.module-row{display:flex;gap:var(--space-4);align-items:flex-start;padding:var(--space-4) 0;border-bottom:var(--border-hairline)}
.module-row:last-of-type{border-bottom:none}
.module-row input[type=checkbox]{width:auto;margin-top:4px}
.module-row strong{display:block}

/* ==========================================================================
 * Workflow refresh: friendlier canvas, collapsible filters, client page,
 * high-volume pipeline, compact lists.
 * ======================================================================== */
body{background:var(--surface-app)}
.topbar{background:var(--surface-card)}
.card,.kpi,.filters{box-shadow:var(--shadow-soft)}
.card{border-color:var(--line-hairline)}
.table th{background:var(--surface-card)}
.table tbody tr:hover{background:var(--surface-raised)}
.btn--primary{box-shadow:var(--shadow-soft)}
h1{font-size:1.75rem}
.page-head{margin-bottom:var(--space-4)}
.page-head h1 + p{margin-top:2px}

/* who: avatar + name inline */
.who{display:inline-flex;align-items:center;gap:var(--space-2);white-space:nowrap}
.avatar--sm{width:24px;height:24px;flex:0 0 24px;font-size:10px}
.avatar--lg{width:56px;height:56px;flex:0 0 56px;font-size:1.05rem}
.avatar--muted{background:var(--surface-raised);color:var(--ink-400)}

/* --- toolbar + collapsible filters ---------------------------------------- */
.toolbar{
  display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center;
  padding:var(--space-3) var(--space-4);margin-bottom:var(--space-3);
  background:var(--surface-card);border:var(--border-hairline);border-radius:var(--radius-card);
  box-shadow:var(--shadow-soft);
}
.toolbar__search{flex:1;min-width:220px;position:relative}
.toolbar__search input{padding-left:34px}
.toolbar__search svg{position:absolute;left:11px;top:50%;width:15px;height:15px;transform:translateY(-50%);color:var(--ink-400);stroke-width:1.8}
.toolbar select{width:auto;min-width:150px}
.toolbar .btn{white-space:nowrap}
.filter-toggle[aria-expanded=true],.filter-toggle.is-active{background:var(--surface-tint-violet);border-color:var(--violet-200);color:var(--violet-700)}
.filter-count{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:var(--radius-pill);background:var(--surface-accent-alt);color:var(--paper-100);font-size:10px;font-family:var(--font-mono)}
.filter-panel{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:var(--space-3) var(--space-4);
  padding:var(--space-4);margin:-4px 0 var(--space-3);
  background:var(--surface-card);border:var(--border-hairline);border-radius:var(--radius-card);box-shadow:var(--shadow-soft);
}
.filter-panel[hidden]{display:none}
.filter-panel .field{margin:0}
.chips-row{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:center;margin:0 0 var(--space-3)}
.chip-filter{
  display:inline-flex;align-items:center;gap:6px;padding:3px 6px 3px 10px;border-radius:var(--radius-pill);
  background:var(--surface-tint-violet);color:var(--violet-700);font-size:var(--size-label);
}
.chip-filter a{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:var(--radius-pill);color:var(--violet-700);font-weight:600}
.chip-filter a:hover{background:var(--violet-200);color:var(--ink-900)}
.result-count{font-size:var(--size-small);color:var(--text-muted)}

/* segmented control (view switch, activity kind) */
.seg{display:inline-flex;padding:3px;gap:2px;background:var(--surface-raised);border-radius:var(--radius-control);border:var(--border-hairline)}
.seg a,.seg label{
  display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:calc(var(--radius-control) - 2px);
  font-size:var(--size-small);color:var(--text-muted);cursor:pointer;white-space:nowrap;
}
.seg a:hover,.seg label:hover{color:var(--text-body)}
.seg .is-on,.seg input:checked + span{background:var(--surface-card);color:var(--text-strong);box-shadow:var(--shadow-soft)}
.seg input{position:absolute;opacity:0;pointer-events:none}
.seg label{padding:0}
.seg label span{padding:5px 12px;border-radius:calc(var(--radius-control) - 2px);display:inline-flex;align-items:center;gap:6px}
.seg svg{width:14px;height:14px;stroke-width:1.8}

/* --- client page ------------------------------------------------------------ */
.profile{padding:var(--space-5);margin-bottom:var(--space-4)}
.profile__top{display:flex;gap:var(--space-4);align-items:flex-start;flex-wrap:wrap}
.profile__id{flex:1;min-width:260px}
.profile__id h1{font-size:1.6rem}
.profile__meta{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-4);margin-top:var(--space-2);font-size:var(--size-small);color:var(--text-muted)}
.profile__meta a{color:var(--text-body)}
.profile__meta svg{width:14px;height:14px;vertical-align:-2px;margin-right:4px;stroke-width:1.8}
.profile__owner{display:flex;flex-direction:column;gap:4px;min-width:220px}
.profile__owner select{min-width:200px}
.profile__actions{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-4);padding-top:var(--space-4);border-top:var(--border-hairline)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:var(--space-3);margin-top:var(--space-4)}
.stat{padding:var(--space-3);border-radius:var(--radius-control);background:var(--surface-raised)}
.stat__label{font-size:var(--size-label);color:var(--text-muted)}
.stat__value{font-family:var(--font-mono);font-size:1.1rem;color:var(--text-strong);font-variant-numeric:tabular-nums}
.stat__value--due{color:var(--state-danger)}

.alerts{display:flex;flex-direction:column;gap:6px;margin-top:var(--space-4)}
.alert{display:flex;gap:var(--space-2);align-items:flex-start;padding:8px 12px;border-radius:var(--radius-control);font-size:var(--size-small);border:1px solid transparent}
.alert::before{content:"";width:7px;height:7px;border-radius:var(--radius-pill);margin-top:7px;flex:0 0 7px;background:currentColor}
.alert--danger{background:var(--state-danger-tint);color:var(--state-danger)}
.alert--warning{background:var(--state-warning-tint);color:var(--state-warning)}
.alert--rose{background:var(--surface-tint-rose);color:var(--rose-700)}
.alert--violet{background:var(--surface-tint-violet);color:var(--violet-700)}

.composer textarea{min-height:64px}
.composer__row{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:flex-end;margin-top:var(--space-3)}
.composer__row .field{margin:0;min-width:180px;flex:1}
.composer__follow{margin-top:var(--space-3);padding:var(--space-3);border-radius:var(--radius-control);background:var(--surface-raised)}
.composer__follow summary{cursor:pointer;font-size:var(--size-small);font-weight:var(--weight-medium);color:var(--text-link)}
.composer__follow[open] summary{margin-bottom:var(--space-3)}

.pending{display:flex;flex-direction:column}
.pending__item{display:grid;grid-template-columns:auto 1fr auto;gap:var(--space-3);align-items:center;padding:var(--space-3) var(--space-5);border-top:var(--border-hairline)}
.pending__item:first-child{border-top:none}
.pending__body{min-width:0}
.pending__body p{font-size:var(--size-small);color:var(--text-body)}
.pending__actions{display:flex;gap:var(--space-2);align-items:center;flex-wrap:wrap;justify-content:flex-end}

.feed{display:flex;flex-direction:column}
.feed__item{display:grid;grid-template-columns:28px 1fr;gap:var(--space-3);padding:var(--space-3) 0;border-top:var(--border-hairline)}
.feed__item:first-child{border-top:none}
.feed__dot{width:28px;height:28px;border-radius:var(--radius-pill);display:grid;place-items:center;font-size:11px;font-family:var(--font-mono);background:var(--surface-raised);color:var(--ink-600)}
.feed__dot--violet{background:var(--surface-tint-violet);color:var(--violet-700)}
.feed__dot--rose{background:var(--surface-tint-rose);color:var(--rose-700)}
.feed__dot--success,.feed__dot--won{background:var(--state-success-tint);color:var(--state-success)}
.feed__dot--warning{background:var(--state-warning-tint);color:var(--state-warning)}
.feed__dot--lost{background:var(--surface-lost);color:var(--ink-400)}
.feed__head{display:flex;flex-wrap:wrap;gap:6px var(--space-2);align-items:baseline}
.feed__title{font-size:var(--size-small);font-weight:var(--weight-semibold);color:var(--text-strong)}
.feed__when{font-size:var(--size-label);color:var(--text-muted);font-family:var(--font-mono)}
.feed__body{font-size:var(--size-small);color:var(--text-body);white-space:pre-wrap;margin-top:2px}
.feed__foot{font-size:var(--size-label);color:var(--text-muted);margin-top:4px;display:flex;gap:var(--space-3);flex-wrap:wrap}

.mini-list{display:flex;flex-direction:column}
.mini-list__item{display:flex;justify-content:space-between;gap:var(--space-3);align-items:center;padding:10px var(--space-5);border-top:var(--border-hairline);font-size:var(--size-small)}
.mini-list__item:first-child{border-top:none}
.mini-list__main{min-width:0}
.mini-list__main a{font-weight:var(--weight-medium)}
.mini-list__sub{font-size:var(--size-label);color:var(--text-muted)}
.mini-list__side{text-align:right;white-space:nowrap}

.doc{display:grid;grid-template-columns:34px 1fr auto;gap:var(--space-3);align-items:center;padding:10px var(--space-5);border-top:var(--border-hairline)}
.doc:first-child{border-top:none}
.doc__icon{width:34px;height:34px;border-radius:var(--radius-control);display:grid;place-items:center;background:var(--surface-tint-violet);color:var(--violet-700);font-family:var(--font-mono);font-size:10px;text-transform:uppercase}
.doc__icon--pdf{background:var(--surface-tint-rose);color:var(--rose-700)}
.doc__name{font-size:var(--size-small);font-weight:var(--weight-medium);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}
.doc__meta{font-size:var(--size-label);color:var(--text-muted)}
.upload{padding:var(--space-4) var(--space-5);border-top:var(--border-hairline);background:var(--surface-raised)}
.upload summary{cursor:pointer;font-size:var(--size-small);font-weight:var(--weight-medium);color:var(--text-link)}
.upload[open] summary{margin-bottom:var(--space-3)}
.upload input[type=file]{font-size:var(--size-small);width:100%}

/* --- dashboard lists -------------------------------------------------------- */
.grid-auto{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--space-4)}
.rank{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-4) var(--space-5)}
.rank__row{display:grid;grid-template-columns:1fr auto;gap:4px var(--space-3);font-size:var(--size-small)}
.rank__track{grid-column:1/-1;height:6px;border-radius:var(--radius-pill);background:var(--surface-raised);overflow:hidden}
.rank__fill{height:100%;background:var(--surface-accent-alt);border-radius:var(--radius-pill)}
.rank__value{font-family:var(--font-mono);color:var(--text-muted);font-size:var(--size-label)}
.when-chip{display:inline-block;min-width:64px;text-align:center}
.card__head h2,.card__head h3{font-size:1.05rem}
.card__head .small{white-space:nowrap}

/* --- pipeline ---------------------------------------------------------------- */
.column__more{display:block;text-align:center;padding:8px;border-radius:var(--radius-control);font-size:var(--size-label);background:var(--surface-card);border:1px dashed var(--line-hairline)}
.closed-strip{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-2)}
.closed-strip a{display:flex;gap:var(--space-3);align-items:center;padding:var(--space-3) var(--space-4);border-radius:var(--radius-card);border:var(--border-hairline);background:var(--surface-card);font-size:var(--size-small);color:var(--text-body);box-shadow:var(--shadow-soft)}
.closed-strip a:hover{box-shadow:var(--shadow-raise)}
.deal{box-shadow:var(--shadow-soft)}
.deal--stale{border-left:3px solid var(--state-warning)}
.deal__meta{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);font-size:var(--size-label);color:var(--text-muted)}
.bulkbar{
  position:sticky;bottom:var(--space-4);z-index:15;display:flex;flex-wrap:wrap;gap:var(--space-3) var(--space-5);align-items:center;justify-content:space-between;
  padding:var(--space-3) var(--space-4);margin-top:var(--space-3);border-radius:var(--radius-card);
  background:var(--surface-ink);color:var(--text-inverse);box-shadow:var(--shadow-raise);font-size:var(--size-small);
}
.bulkbar[hidden]{display:none}
.bulkbar__count{display:flex;align-items:baseline;gap:var(--space-3)}
.bulkbar__clear{background:none;border:0;padding:0;font:inherit;font-size:var(--size-label);color:var(--ink-300);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.bulkbar__clear:hover{color:var(--paper-100)}
.bulkbar__actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3) var(--space-5)}
.bulkbar__group{display:flex;align-items:center;gap:var(--space-2)}
.bulkbar__group + .bulkbar__group{padding-left:var(--space-5);border-left:1px solid var(--line-grid-inverse)}
.bulkbar__group label{font-size:var(--size-label);color:var(--ink-300);white-space:nowrap}
.bulkbar__control{display:flex}
.bulkbar__control select{width:auto;min-width:180px;min-height:32px;padding-top:5px;padding-bottom:5px;background-color:var(--surface-card);border-color:transparent;border-radius:var(--radius-control) 0 0 var(--radius-control)}
.bulkbar__control .btn{border-radius:0 var(--radius-control) var(--radius-control) 0;border-color:transparent;border-left:var(--border-hairline);background:var(--surface-card)}
.bulkbar__control .btn:not([disabled]){background:var(--surface-accent);color:var(--paper-100);border-left-color:var(--surface-accent)}
.bulkbar__control .btn:not([disabled]):hover{background:var(--rose-700)}
.bulkbar__control .btn[disabled]{opacity:1;color:var(--ink-300)}
.confirm-list{list-style:none;margin:0;padding:var(--space-2) var(--space-3);border-radius:var(--radius-control);background:var(--surface-raised);font-size:var(--size-small);max-height:220px;overflow:auto}
.confirm-list li{padding:3px 0}
.confirm-list li.muted{font-size:var(--size-label)}
.check-cell{width:36px}
.check-cell input{width:16px;height:16px;margin:0;cursor:pointer;accent-color:var(--surface-accent)}
.cell-main{display:flex;flex-direction:column;min-width:0}
.cell-main a{font-weight:var(--weight-medium)}
.cell-title{color:var(--text-strong);font-weight:var(--weight-semibold)}
.cell-title:hover{color:var(--text-link-hover)}
.cell-sub .cell-sub__link{color:var(--text-muted);font-weight:var(--weight-regular)}
.cell-sub .cell-sub__link:hover{color:var(--text-link-hover)}
.cell-sub{font-size:var(--size-label);color:var(--text-muted)}
.table td.tight{white-space:nowrap;width:1%}

/* --- tasks -------------------------------------------------------------------- */
.task-actions{display:flex;gap:var(--space-2);justify-content:flex-end;align-items:center;flex-wrap:wrap}
.reassign{position:relative}
.reassign summary{list-style:none;cursor:pointer}
.reassign summary::-webkit-details-marker{display:none}
.reassign__panel{position:absolute;right:0;top:calc(100% + 6px);z-index:30;display:flex;gap:var(--space-2);padding:var(--space-3);background:var(--surface-card);border:var(--border-hairline);border-radius:var(--radius-card);box-shadow:var(--shadow-raise)}
.reassign__panel select{min-width:170px}
.behalf{font-size:var(--size-label);color:var(--violet-700)}

/* settings users table: selects must fit their labels */
.role-form select{min-width:150px}
.table td .nowrap-btn{white-space:nowrap}

@media (max-width:980px){
  .profile__owner{min-width:0;width:100%}
  .pending__item{grid-template-columns:1fr}
  .pending__actions{justify-content:flex-start}
}
a.kpi{display:block;color:inherit;transition:var(--transition-ui)}
a.kpi:hover{box-shadow:var(--shadow-raise);color:inherit;border-color:var(--ink-300)}
.split > *{min-width:0}
.seg{max-width:100%;overflow-x:auto;scrollbar-width:none}
.seg::-webkit-scrollbar{display:none}
@media (max-width:760px){
  .page-head > .row,.profile__actions{width:100%}
  .toolbar select{flex:1 1 140px}
  .table{display:block;overflow-x:auto}
}

/* ==========================================================================
 * v3: friendlier type and shapes. One sans for everything readable, mono
 * only for reference codes; rounder shapes; every control in a row shares
 * one height so rows line up.
 * ======================================================================== */
body{font-size:15px;line-height:1.55}
h1,h2,h3,h4{font-family:var(--font-sans);font-weight:700;letter-spacing:-.015em}
h1{font-size:1.6rem}
h2{font-size:1.1rem}
h3{font-size:1rem}
.profile__id h1{font-size:1.5rem}
.card__head h2,.card__head h3{font-size:1rem;font-weight:700}

.mono,.amount,td.num,th.num,.date,.kpi__value,.stat__value,.balance__value,.deal__amount,
.bar__value,.rank__value,.feed__when,.column__meta,.totals dd,.doc__icon,.avatar,
input[type=number],input[type=date],input[type=datetime-local]{
  font-family:var(--font-sans);font-variant-numeric:tabular-nums;
}
.ref,.cell-sub .mono{font-family:var(--font-mono);font-size:12px}
.kpi__value{font-weight:700;font-size:1.65rem;letter-spacing:-.01em}
.stat__value{font-weight:700}

.label,.kpi__label,.balance__label,.table th,.sidebar__section,.stat__label{
  font-family:var(--font-sans);text-transform:none;letter-spacing:0;font-weight:600;
}
.label,.kpi__label,.balance__label,.stat__label{font-size:12.5px;color:var(--text-muted)}
.table th{font-size:12.5px;color:var(--text-muted);padding-top:10px;padding-bottom:10px}
.sidebar__section{font-size:11.5px;color:var(--ink-400);text-transform:uppercase;letter-spacing:.06em}

.chip{
  font-family:var(--font-sans);font-weight:600;font-size:12px;
  border-radius:var(--radius-pill);padding:3px 10px;line-height:1.5;
}

.btn{min-height:38px;justify-content:center;font-weight:600;border-radius:var(--radius-control);padding:8px 16px}
.btn--sm{min-height:32px;padding:5px 12px;font-size:13px}
.btn--ghost{padding:8px 12px}
.btn--ghost.btn--sm{padding:5px 10px}
input[type=text],input[type=email],input[type=password],input[type=search],
input[type=number],input[type=date],input[type=datetime-local],select{min-height:38px;border-radius:var(--radius-control);font-size:14px}
textarea{border-radius:var(--radius-control);font-size:14px}
.seg{border-radius:12px;padding:4px}
.seg a,.seg label span{border-radius:9px;min-height:30px;font-weight:500}
.seg .is-on,.seg input:checked + span{font-weight:600}

.nav-item{border-radius:10px;padding:9px 12px;font-size:14px;font-weight:500}
.sidebar__brand strong{font-family:var(--font-sans);font-weight:700}
.card{border-radius:var(--radius-card)}
.kpi{border-radius:var(--radius-card)}
.avatar{font-weight:700;font-size:11px}

.sep{display:inline-block;width:12px}
.meta{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:center}

/* Every KPI tile is a link and looks like one. */
.kpi{position:relative;display:block;color:inherit;transition:var(--transition-ui)}
.kpi__go{position:absolute;top:14px;right:14px;width:26px;height:26px;border-radius:var(--radius-pill);
  display:grid;place-items:center;background:var(--surface-raised);color:var(--ink-600);transition:var(--transition-ui)}
.kpi__go svg{width:14px;height:14px;stroke-width:2}
a.kpi:hover .kpi__go{background:var(--surface-accent);color:var(--paper-100)}
a.kpi:hover{transform:translateY(-1px)}

/* --- dashboard v3 ----------------------------------------------------------- */
.duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4);align-items:stretch}
.duo > .card{display:flex;flex-direction:column}
.duo > .card > .attention,.duo > .card > .bars{flex:1}
.duo > .card > .card__foot{margin-top:auto}
.attention{display:flex;flex-direction:column}
.attention__item{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:var(--space-3);align-items:center;padding:12px var(--space-5);border-top:var(--border-hairline)}
.attention__item:first-child{border-top:none}
.attention__main{display:flex;flex-direction:column;min-width:0}
.attention__main strong{font-size:14px;font-weight:600;color:var(--text-strong);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.attention__main strong a{color:inherit}
.attention__main strong a:hover{color:var(--text-link)}
.attention__main .small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.icon-badge{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:var(--surface-raised);color:var(--ink-600)}
.icon-badge svg{width:18px;height:18px;stroke-width:1.8}
.icon-badge--danger{background:var(--state-danger-tint);color:var(--state-danger)}
.icon-badge--warning{background:var(--state-warning-tint);color:var(--state-warning)}
.icon-badge--rose{background:var(--surface-tint-rose);color:var(--rose-700)}
.icon-badge--violet{background:var(--surface-tint-violet);color:var(--violet-700)}
.icon-badge--success{background:var(--state-success-tint);color:var(--state-success)}
.date-pill{font-size:12.5px;font-weight:600;padding:4px 10px;border-radius:var(--radius-pill);background:var(--surface-raised);color:var(--ink-600);white-space:nowrap}

.chart-card{display:flex;flex-direction:column;gap:var(--space-3)}
.chart-total{display:flex;flex-direction:column;align-items:flex-end}
.chart-total strong{font-size:1.25rem;font-weight:700;color:var(--text-strong);font-variant-numeric:tabular-nums}
.chart{width:100%;height:auto;display:block;overflow:visible}
.chart__grid{stroke:var(--line-hairline);stroke-width:1}
.chart__tick{font-size:12px;fill:var(--text-muted);font-family:var(--font-sans)}
.chart__value{font-size:12.5px;font-weight:700;fill:var(--text-strong);font-family:var(--font-sans)}
.chart__bar{fill:var(--violet-600);transition:opacity var(--dur-fast) var(--ease-standard)}
.chart__hit{fill:transparent}
.chart__col{cursor:default;outline:none}
.chart:hover .chart__bar{opacity:.45}
.chart__col:hover .chart__bar,.chart__col:focus .chart__bar{opacity:1}
.bar{grid-template-columns:120px 1fr 110px}

.tab-panel[hidden]{display:none}
.tab-panel .table th:first-child,.tab-panel .table td:first-child{padding-left:var(--space-5)}
.tab-panel .table th:last-child,.tab-panel .table td:last-child{padding-right:var(--space-5)}
@media (max-width:980px){.duo{grid-template-columns:1fr}}
.table .num,.table td.num,.table th.num{font-family:var(--font-sans);font-variant-numeric:tabular-nums}

/* --- client page v3 ---------------------------------------------------------- */
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--space-3);margin:var(--space-4) 0 0;padding:var(--space-4);border-radius:var(--radius-control);background:var(--surface-raised)}
.facts div{min-width:0}
.facts dt{font-size:12.5px;color:var(--text-muted);font-weight:600}
.facts dd{margin:2px 0 0;font-size:14px;color:var(--text-strong);overflow:hidden;text-overflow:ellipsis}
.warn{color:var(--state-warning)}
dialog.modal{border:none;border-radius:20px;box-shadow:0 24px 60px rgba(18,23,29,.25);max-width:620px;padding:0}
.modal__head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:var(--space-5) var(--space-5) var(--space-3)}
.modal__head h2{font-size:1.1rem}
.modal__body{display:flex;flex-direction:column;gap:var(--space-3);padding:0 var(--space-5)}
.modal__body .field{margin:0}
.modal__foot{display:flex;justify-content:flex-end;gap:var(--space-2);padding:var(--space-4) var(--space-5) var(--space-5)}

/* --- tasks v3 ------------------------------------------------------------------ */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.count{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:var(--radius-pill);background:var(--surface-card);color:var(--ink-600);font-size:11.5px;font-weight:700}
.seg .is-on .count{background:var(--surface-raised)}
.count--danger{background:var(--state-danger-tint);color:var(--state-danger)}
.card--menus{overflow:visible}
.task-table td{padding-top:14px;padding-bottom:14px}
.task-table .col-when{width:130px;white-space:nowrap}
.task-table .col-who{width:210px}
.task-table .col-actions{width:170px}
.task-table th:first-child,.task-table td:first-child{padding-left:var(--space-5)}
.task-table th:last-child,.task-table td:last-child{padding-right:var(--space-5)}
.task-title{font-size:14px;font-weight:600;color:var(--text-strong)}
.date-pill--danger{background:var(--state-danger-tint);color:var(--state-danger)}
.date-pill--won{background:var(--state-success-tint);color:var(--state-success)}
.task-actions{display:flex;gap:var(--space-2);justify-content:flex-end;align-items:center}
.btn--icon{width:32px;padding:0}
.btn--icon svg{width:16px;height:16px}
.menu{position:relative}
.menu summary{list-style:none}
.menu summary::-webkit-details-marker{display:none}
.menu__panel{position:absolute;right:0;top:calc(100% + 6px);z-index:40;min-width:240px;display:flex;flex-direction:column;padding:6px;background:var(--surface-card);border:var(--border-hairline);border-radius:14px;box-shadow:var(--shadow-raise)}
.menu__item{display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;border:none;background:none;border-radius:10px;font:inherit;font-size:14px;color:var(--text-body);cursor:pointer;text-align:left}
.menu__item:hover{background:var(--surface-raised);color:var(--text-strong)}
.menu__item svg{width:16px;height:16px;stroke-width:1.8;color:var(--ink-400)}
.menu__form{padding:8px 10px;border-top:var(--border-hairline);margin-top:4px;display:flex;flex-direction:column;gap:6px}
.menu__form label{font-size:12.5px;font-weight:600;color:var(--text-muted)}

/* --- forms v3 ------------------------------------------------------------------ */
.form-card{display:flex;flex-direction:column;gap:var(--space-4)}
.form-card .field{margin:0}
.form-section{border:none;margin:0;padding:var(--space-4);border-radius:var(--radius-control);background:var(--surface-raised);display:flex;flex-direction:column;gap:var(--space-3)}
.form-section legend{float:left;width:100%;font-size:13px;font-weight:700;color:var(--text-strong);padding:0;margin-bottom:var(--space-1)}
.form-section .grid-2{gap:var(--space-3)}
.confirm-row{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:500;cursor:pointer}
.confirm-row input{width:18px;height:18px;margin:0;accent-color:var(--surface-accent)}
.form-actions{display:flex;justify-content:flex-end;gap:var(--space-2);padding-top:var(--space-2);border-top:var(--border-hairline)}
.facts--stack{grid-template-columns:1fr;background:none;padding:0;gap:var(--space-3)}
input[type=file]{font:inherit;font-size:13px;padding:6px;border:1px dashed var(--line-hairline);border-radius:var(--radius-control);background:var(--surface-card);width:100%}

/* --- campaigns v3 ---------------------------------------------------------------- */
.campaign-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:var(--space-4)}
.campaign{display:flex;flex-direction:column;gap:var(--space-3);color:inherit;transition:var(--transition-ui)}
.campaign:hover{box-shadow:var(--shadow-raise);color:inherit;transform:translateY(-1px)}
.campaign__top{display:flex;justify-content:space-between;gap:var(--space-3);align-items:flex-start}
.campaign__top h3{font-size:1.02rem}
.campaign__package{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;padding:5px 12px;border-radius:var(--radius-pill);background:var(--surface-tint-violet);color:var(--violet-700);font-size:13px;font-weight:600}
.campaign__package svg{width:15px;height:15px;stroke-width:1.8}
.funnel{display:flex;gap:2px;height:10px;border-radius:var(--radius-pill);overflow:hidden;background:var(--surface-raised)}
.funnel__seg{display:block;background:var(--paper-400)}
.funnel__seg--targeted,.dot--targeted{background:var(--paper-400)}
.funnel__seg--sent,.dot--sent{background:var(--rose-600)}
.funnel__seg--responded,.dot--responded{background:var(--violet-600)}
.funnel__seg--converted,.dot--converted{background:var(--state-success)}
.funnel__legend{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12.5px;color:var(--text-muted)}
.funnel__legend strong{color:var(--text-strong);font-weight:700}
.dot{display:inline-block;width:8px;height:8px;border-radius:var(--radius-pill);margin-right:6px;vertical-align:1px}
.campaign__stats{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-2);padding-top:var(--space-3);border-top:var(--border-hairline)}
.campaign__stats div{display:flex;flex-direction:column}
.campaign__stats strong{font-size:1.05rem;font-weight:700;color:var(--text-strong);font-variant-numeric:tabular-nums}
.menu{display:inline-block}
.task-actions{flex-wrap:nowrap}
.task-table .col-actions{width:190px}
.campaign__stats{grid-template-columns:repeat(2,1fr);row-gap:var(--space-3)}
.btn--icon svg{width:18px;height:18px}
@media (max-width:760px){
  .task-table .col-who{display:none}
  .task-table .col-when{width:auto}
  .task-table .col-actions{width:auto}
  .toolbar .seg{flex:1 1 100%}
}

/* ==========================================================================
 * v4: connected flows. Same-height rows, information on demand in modals,
 * one way to hand tasks over, the travel flow strip, document branding.
 * ======================================================================== */

/* rows share a height: tiles in a row stretch to the tallest one */
.kpis,.stats{align-items:stretch}
.kpi,.stat{display:flex;flex-direction:column;justify-content:flex-start}
.kpi__note{margin-top:auto;padding-top:4px}
.stats--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.kpis--5{grid-template-columns:repeat(5,minmax(0,1fr))}
@media (max-width:980px){.stats--4,.kpis--5{grid-template-columns:repeat(2,minmax(0,1fr))}}
.duo > .card{min-height:320px}
.duo > .card > .card__head{flex:0 0 auto}

/* client page: quieter header, everything else on demand */
.profile__meta a[data-open-modal]{color:var(--text-link);font-weight:600}
.profile__actions .btn .count{margin-left:2px}
.profile__actions form{display:inline-flex}
.pending__item{grid-template-columns:auto minmax(0,1fr) auto}
.pending__body .task-title{margin:0 0 2px}
.card--menus,.card--menus .pending{overflow:visible}

/* feed inside a flush card */
.feed--card{padding:0 var(--space-5)}
.feed__item--log{grid-template-columns:28px 1fr;padding:8px 0;align-items:center}
.feed__dot--log{width:8px;height:8px;justify-self:center;background:var(--ink-300);color:transparent}
.feed__log{display:flex;flex-wrap:wrap;gap:4px var(--space-3);align-items:baseline;font-size:12.5px;color:var(--text-muted)}
.feed__log .feed__when{font-size:11.5px}

/* modals */
dialog.modal{width:min(620px,calc(100vw - 32px))}
dialog.modal--wide{max-width:760px;width:min(760px,calc(100vw - 32px))}
dialog.modal::backdrop{background:rgba(18,23,29,.35);backdrop-filter:blur(2px)}
.modal__context{font-weight:600;color:var(--text-strong);padding:10px 14px;border-radius:var(--radius-control);background:var(--surface-raised)}
.modal__body--flush{padding:0}
.modal__body--flush .doc{padding-left:var(--space-5);padding-right:var(--space-5)}
.modal__body--flush .doc:first-child{border-top:var(--border-hairline)}
.modal__body--flush .empty{padding:var(--space-5)}
.upload--modal{margin-top:var(--space-2);border-top:var(--border-hairline);display:flex;flex-direction:column;gap:var(--space-3)}
.upload--modal .grid-2{gap:var(--space-3)}
.upload--modal .field{margin:0}
.facts--modal{grid-template-columns:repeat(2,minmax(0,1fr));background:none;padding:0;margin:0;gap:var(--space-4)}
.facts--modal dd{white-space:normal}
#info-modal .modal__body,#docs-modal .modal__body{padding-bottom:var(--space-3)}
#info-modal{max-width:640px}

/* menus */
.menu__item--danger{color:var(--state-danger)}
.menu__item--danger:hover{background:var(--state-danger-tint);color:var(--state-danger)}
.menu__panel{max-height:60vh;overflow:auto}

/* card toolbar (search inside a card) */
.card__toolbar{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center;padding:var(--space-3) var(--space-5);border-bottom:var(--border-hairline);background:var(--surface-raised)}
.card__toolbar .toolbar__search{flex:0 1 320px;min-width:200px}
.card__toolbar .small{flex:1 1 260px}
.members-table .col-actions{width:230px}
.members-table th:first-child,.members-table td:first-child{padding-left:var(--space-5)}
.members-table th:last-child,.members-table td:last-child{padding-right:var(--space-5)}
.members-table .cell-sub .chip{margin-right:6px}
.card__head .seg .count{margin-left:2px}


/* documents & logo settings */
.logo-row{display:flex;gap:var(--space-4);align-items:flex-start;flex-wrap:wrap}
.logo-preview{width:160px;height:88px;display:grid;place-items:center;border-radius:var(--radius-control);border:1px dashed var(--line-hairline);background:var(--surface-card);overflow:hidden}
.logo-preview img{max-width:140px;max-height:70px;object-fit:contain}
.doc-preview{border:var(--border-hairline);border-radius:var(--radius-control);padding:14px;background:#fff;font-size:11px;color:var(--text-muted)}
.doc-preview__head{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:start;padding-bottom:10px;border-bottom:2px solid var(--surface-ink)}
.doc-preview__logo{width:44px;height:30px;display:grid;place-items:center}
.doc-preview__logo img{max-width:44px;max-height:30px;object-fit:contain}
.doc-preview__logo span{width:34px;height:22px;border-radius:6px;background:var(--surface-raised)}
.doc-preview__lines{display:flex;flex-direction:column;min-width:0}
.doc-preview__lines b{color:var(--text-strong);font-size:12px}
.doc-preview__kind{text-transform:uppercase;letter-spacing:.1em;color:var(--text-accent);font-weight:600;font-size:9px}
.doc-preview__body{display:flex;flex-direction:column;gap:6px;padding:14px 0}
.doc-preview__body span{display:block;height:7px;border-radius:4px;background:var(--surface-raised)}
.doc-preview__foot{padding-top:8px;border-top:var(--border-hairline);font-size:10px;text-align:center}
.help{font-size:var(--size-label);color:var(--text-muted)}

/* campaign KPI tiles: same height, five across */
.kpis--5 .kpi__value{font-size:1.45rem}

/* Dashboard refinements (2026-09-28) */
.attention__when{font-weight:500;color:var(--text-muted)}
.bar__fill{display:flex;align-items:center;min-width:max-content;padding:0 8px;box-sizing:border-box}
.bar__money{font-family:var(--font-mono);font-size:12px;font-weight:600;color:var(--text-strong);white-space:nowrap}
.bar{grid-template-columns:130px 1fr 40px}
.insights{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4);align-items:stretch}
.insights--3{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
@media (max-width:980px){.insights{grid-template-columns:1fr}}
.rank__row > :first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.insights > .card{height:100%}
.rank__row a{color:var(--text-strong);font-weight:500}
.rank__row a:hover{color:var(--text-link)}
.rank__sub{grid-column:1/-1;font-size:var(--size-label);color:var(--text-muted);margin-top:-2px}
.rank__fill--alt{background:var(--surface-accent-alt)}
.rank__fill--won{background:var(--state-success)}
.rank__fill{background:var(--surface-accent-alt)}

/* Reminders, reports and funnel counts */
.reminder__side{display:flex;align-items:center;gap:var(--space-2)}
.link-quiet{color:var(--text-muted);text-decoration:underline;text-underline-offset:2px}
.link-quiet:hover{color:var(--text-link)}
.bar__money{font-weight:500;color:var(--text-body)}
.bar__count{text-align:right;font-family:var(--font-sans);font-size:15px;font-weight:700;color:var(--text-strong);font-variant-numeric:tabular-nums}
.reminder-setting{display:grid;grid-template-columns:1fr auto;gap:var(--space-4);align-items:end;padding:var(--space-3) 0;border-top:var(--border-hairline)}
.reminder-setting:first-of-type{border-top:none}
.report-table .report-bar-col{width:28%;min-width:120px}
.report-table td{vertical-align:middle}

/* Contact form: data on the left, the enquiry and actions on the right */
.split--form{grid-template-columns:minmax(0,1fr) 360px}
.form-title{font-size:1rem;font-weight:700;margin-bottom:var(--space-4)}
.form-title__note{font-size:var(--size-small);color:var(--text-muted);margin:calc(-1 * var(--space-3)) 0 var(--space-4)}
.contact-form .grid-2{gap:0 var(--space-4)}
.req{color:var(--text-muted);font-weight:var(--weight-regular)}
.field--invalid input,.field--invalid select{border-color:var(--state-danger)}
.field--flagged input{border-color:var(--state-warning);background:var(--state-warning-tint)}
.form-alert{padding:var(--space-3) var(--space-4);margin-bottom:var(--space-4);border-radius:var(--radius-control);background:var(--state-danger-tint);color:var(--state-danger);font-size:var(--size-small)}
.aside-actions{display:flex;flex-direction:column;gap:var(--space-2)}
.aside-actions .btn{width:100%}
.aside-actions .btn[hidden]{display:none}

.matches{margin:0 0 var(--space-4);padding:var(--space-3) var(--space-4);border-radius:var(--radius-control);background:var(--state-warning-tint);display:flex;flex-direction:column;gap:var(--space-3)}
.matches[hidden]{display:none}
.matches--blocking{background:var(--state-danger-tint)}
.matches__title{font-size:var(--size-small);font-weight:700;color:var(--state-warning)}
.matches--blocking .matches__title{color:var(--state-danger)}
.matches__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-2)}
.match{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--space-2) var(--space-3);align-items:center;padding:var(--space-3);border-radius:var(--radius-control);background:var(--surface-card)}
.match__who{display:flex;flex-direction:column;min-width:0}
.match__who a{color:var(--text-strong);font-weight:600}
.match__who a:hover{color:var(--text-link-hover)}
.match__who span{font-size:var(--size-label);color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.match__reasons{display:flex;gap:var(--space-1);flex-wrap:wrap;justify-content:flex-end}
.match__actions{grid-column:1/-1;display:flex;gap:var(--space-2);flex-wrap:wrap}
.matches__confirm[hidden]{display:none}

.combo{position:relative}
.combo__list{position:absolute;top:calc(100% - 18px);left:0;right:0;z-index:30;list-style:none;margin:0;padding:var(--space-1);max-height:260px;overflow:auto;background:var(--surface-card);border:var(--border-hairline);border-radius:var(--radius-control);box-shadow:var(--shadow-raise)}
.combo__list[hidden]{display:none}
.combo__list li{display:flex;justify-content:space-between;gap:var(--space-3);padding:8px 10px;border-radius:8px;font-size:var(--size-small);cursor:pointer}
.combo__list li:hover,.combo__list li[aria-selected=true]{background:var(--surface-hover)}
.combo__meta{font-size:var(--size-label);color:var(--text-muted)}

.pills-field{border:none;padding:0;margin:0}
.pills-field legend{font-size:var(--size-small);font-weight:var(--weight-medium);color:var(--text-body);padding:0;margin-bottom:var(--space-2)}
.pills{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.pill{position:relative;cursor:pointer}
.pill input{position:absolute;opacity:0;pointer-events:none}
.pill span{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:var(--radius-pill);border:var(--border-hairline);background:var(--surface-card);font-size:13px;font-weight:500;color:var(--text-body);transition:var(--transition-ui)}
.pill:hover span{border-color:var(--ink-300)}
.pill input:checked + span{background:var(--surface-tint-violet);border-color:var(--violet-200);color:var(--violet-700)}
.pill input:checked + span::before{content:"✓";font-size:11px}
.pill input:focus-visible + span{outline:2px solid var(--focus-ring);outline-offset:2px}

.switch-row{display:grid;grid-template-columns:auto 1fr;gap:var(--space-3);align-items:start;cursor:pointer}
.switch-row input{position:absolute;opacity:0;pointer-events:none}
.switch-row > span:last-child{display:flex;flex-direction:column;gap:2px}
.switch{position:relative;width:38px;height:22px;margin-top:1px;border-radius:var(--radius-pill);background:var(--paper-400);transition:var(--transition-ui)}
.switch::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:var(--paper-100);box-shadow:var(--shadow-soft);transition:transform var(--dur-fast) var(--ease-standard)}
.switch-row input:checked + .switch{background:var(--surface-accent-alt)}
.switch-row input:checked + .switch::after{transform:translateX(16px)}
.switch-row input:focus-visible + .switch{outline:2px solid var(--focus-ring);outline-offset:2px}
.deal-card__fields{margin-top:var(--space-4);padding-top:var(--space-4);border-top:var(--border-hairline)}
.deal-card__fields[hidden]{display:none}
@media (max-width:980px){.split--form{grid-template-columns:1fr}}

/* Board cards: title in ink, people in muted text, campaign as a quiet tag */
.deal__link{display:block;color:inherit}
.deal__link:hover .deal__title{color:var(--text-link-hover)}
.deal__title{font-weight:var(--weight-semibold)}
.deal__campaign{max-width:100%;overflow:hidden;text-overflow:ellipsis;font-size:11px;padding:1px 8px;margin-bottom:var(--space-1)}
.deal__unowned{color:var(--state-warning);font-weight:var(--weight-medium)}
.cell-sub__campaign{color:var(--violet-700)}

/* Campaign: did they buy the promoted package or something else */
.outcome{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-4)}
.outcome__stat{display:flex;flex-direction:column;gap:2px;padding:var(--space-3) var(--space-4);border-radius:var(--radius-control);background:var(--surface-raised)}
.outcome__stat strong{font-size:1.5rem;font-weight:700;color:var(--text-strong);font-variant-numeric:tabular-nums}
.outcome__stat span{font-size:var(--size-small);color:var(--text-muted)}
.outcome__stat--package{background:var(--state-success-tint)}
.outcome__stat--package strong{color:var(--state-success)}
.outcome__stat--other{background:var(--surface-tint-violet)}
.outcome__stat--other strong{color:var(--violet-700)}

/* Opportunity page ---------------------------------------------------------- */
.opp-head{align-items:flex-end}
.opp-head__meta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2) var(--space-3);margin-top:var(--space-2)}
.opp-head__side{display:flex;align-items:flex-end;gap:var(--space-4)}
.opp-head__amount{display:flex;flex-direction:column;align-items:flex-end;line-height:1.1}
.opp-head__amount strong{font-size:1.6rem;font-weight:700;color:var(--text-strong);font-variant-numeric:tabular-nums}

.nextstep{margin-bottom:var(--space-5);display:flex;flex-direction:column;gap:var(--space-4)}
.nextstep h2{font-size:1.05rem;font-weight:700;margin-bottom:2px}
.nextstep p{font-size:var(--size-small);color:var(--text-muted);margin:0}
.nextstep__row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);flex-wrap:wrap}
.nextstep__actions{display:flex;gap:var(--space-2);flex-wrap:wrap}
.nextstep--collect{border-left:3px solid var(--state-warning)}
.nextstep--paid,.nextstep--won{border-left:3px solid var(--state-success)}
.nextstep--decide,.nextstep--quote,.nextstep--book{border-left:3px solid var(--surface-accent-alt)}

.stepper{list-style:none;margin:0;padding:0;display:flex;gap:var(--space-2);counter-reset:step;flex-wrap:wrap}
.stepper li{counter-increment:step;display:flex;align-items:center;gap:var(--space-2);font-size:var(--size-label);font-weight:600;color:var(--text-muted)}
.stepper li::before{content:counter(step);display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--surface-raised);color:var(--ink-400);font-size:11px}
.stepper li:not(:last-child)::after{content:"";width:28px;height:1px;background:var(--line-hairline);margin-left:var(--space-1)}
.stepper li.is-done{color:var(--state-success)}
.stepper li.is-done::before{content:"✓";background:var(--state-success-tint);color:var(--state-success)}
.stepper li.is-current{color:var(--violet-700)}
.stepper li.is-current::before{background:var(--surface-accent-alt);color:var(--paper-100)}

.choice-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;border:var(--border-hairline);border-radius:var(--radius-control);overflow:hidden}
.choice{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:var(--space-4);align-items:center;padding:var(--space-3) var(--space-4)}
.choice + .choice{border-top:var(--border-hairline)}
.choice__main{display:flex;flex-direction:column;min-width:0}
.choice__total{font-variant-numeric:tabular-nums;color:var(--text-strong);min-width:90px;text-align:right}
.choice__actions{display:flex;gap:var(--space-2);justify-content:flex-end}

.figures{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-4)}
.figures > div{display:flex;flex-direction:column;gap:2px}
.figures strong{font-size:1.15rem;font-weight:700;color:var(--text-strong);font-variant-numeric:tabular-nums}
.figures .figures__paid{color:var(--state-success)}
.figures .figures__due{color:var(--state-danger)}
.meter{height:6px;border-radius:var(--radius-pill);background:var(--surface-raised);overflow:hidden}
.meter span{display:block;height:100%;background:var(--state-success);border-radius:inherit}

.aside-title{font-size:.95rem;font-weight:700;margin-bottom:var(--space-3)}
.aside-note{margin:0;padding:var(--space-3) var(--space-5);font-size:var(--size-label);color:var(--state-warning);background:var(--state-warning-tint)}
.person{display:flex;flex-direction:column;gap:2px;color:inherit}
.person strong{color:var(--text-strong)}
.person:hover strong{color:var(--text-link-hover)}
.person span{font-size:var(--size-label);color:var(--text-muted)}
.contact-links{display:flex;flex-direction:column;gap:var(--space-2);margin-top:var(--space-3);font-size:var(--size-small)}
.contact-links a{display:inline-flex;align-items:center;gap:var(--space-2);color:var(--text-body);min-width:0;overflow:hidden;text-overflow:ellipsis}
.contact-links a:hover{color:var(--text-link-hover)}
.contact-links svg{width:15px;height:15px;flex:0 0 15px;color:var(--ink-400)}
.mini-deal{display:flex;flex-direction:column;gap:4px;padding:var(--space-3) var(--space-5);border-top:var(--border-hairline);color:inherit}
.mini-deal:hover{background:var(--surface-hover)}
.mini-deal__title{font-size:var(--size-small);font-weight:600;color:var(--text-strong)}
.mini-deal__meta{display:flex;align-items:center;gap:var(--space-2);font-size:var(--size-label);color:var(--text-muted)}
.mini-deal--closed .mini-deal__title{font-weight:500;color:var(--text-body)}
.empty--sm{padding:var(--space-4) var(--space-5);font-size:var(--size-small)}
.confirm-points{margin:0;padding-left:var(--space-5);display:flex;flex-direction:column;gap:var(--space-2);font-size:var(--size-small)}
.amount-row{display:flex;gap:var(--space-2);align-items:center}
.amount-row input{flex:1}
@media (max-width:760px){
  .opp-head{align-items:flex-start}
  .figures{grid-template-columns:repeat(2,minmax(0,1fr))}
  .choice{grid-template-columns:minmax(0,1fr) auto}
  .choice__actions{grid-column:1/-1;justify-content:flex-start}
}
.balance-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);margin-bottom:var(--space-4)}
.balance-head h2{font-size:1rem;font-weight:700}
@media (max-width:760px){.table .col-doc{display:none}}

/* Activity feeds scroll inside their card instead of growing the page */
.feed--scroll{max-height:min(640px,70vh);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.modal--confirm{max-width:460px}
.modal--confirm .modal__body p{font-size:var(--size-small);color:var(--text-body);margin:0}
.due-row{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:center}
.due-row input{flex:0 1 240px}
.quick-dates{display:flex;flex-wrap:wrap;gap:var(--space-1)}
.aside-warn{margin-top:var(--space-3);padding:var(--space-3);border-radius:var(--radius-control);background:var(--state-warning-tint);color:var(--state-warning);font-size:var(--size-label);line-height:1.5}
.aside-warn a{color:inherit;font-weight:600;text-decoration:underline;text-underline-offset:2px}
.switch-row--field{padding:var(--space-3) 0}
.switch-row--field + .switch-row--field{border-top:var(--border-hairline)}

/* Campaigns ------------------------------------------------------------------ */
.summary-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-4);margin-bottom:var(--space-5);padding:var(--space-4) var(--space-5);background:var(--surface-card);border:var(--border-hairline);border-radius:var(--radius-card)}
.summary-strip > div{display:flex;flex-direction:column;gap:2px}
.summary-strip strong{font-size:1.5rem;font-weight:700;color:var(--text-strong);font-variant-numeric:tabular-nums}
.summary-strip__note{font-size:var(--size-label);color:var(--text-muted)}
.rate{display:flex;align-items:center;gap:var(--space-2);min-width:130px}
.rate__bar{flex:1;height:6px;border-radius:var(--radius-pill);background:var(--surface-raised);overflow:hidden}
.rate__bar i{display:block;height:100%;background:var(--surface-accent-alt)}
.rate__pct{font-size:var(--size-label);font-variant-numeric:tabular-nums;color:var(--text-body);min-width:34px;text-align:right}
.cfunnel{list-style:none;margin:0;padding:var(--space-4);display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--space-2)}
.cfunnel a{display:flex;flex-direction:column;gap:6px;padding:var(--space-3);border-radius:var(--radius-control);color:inherit}
.cfunnel a:hover{background:var(--surface-hover)}
.cfunnel__label{font-size:12.5px;color:var(--text-muted)}
.cfunnel__count{font-size:1.6rem;font-weight:700;line-height:1.1;color:var(--text-strong);font-variant-numeric:tabular-nums}
.cfunnel__bar{height:6px;border-radius:var(--radius-pill);background:var(--surface-raised);overflow:hidden}
.cfunnel__bar i{display:block;height:100%;background:var(--surface-accent-alt)}
.cfunnel__note{font-size:12px;color:var(--text-muted)}
.money-strong{color:var(--text-strong);font-weight:700}
@media (max-width:980px){.cfunnel{grid-template-columns:repeat(2,minmax(0,1fr))}.summary-strip{grid-template-columns:repeat(2,minmax(0,1fr))}}
.audience-filters{padding:var(--space-4) var(--space-5);border-bottom:var(--border-hairline)}
.audience-filters .grid-2{gap:0 var(--space-3)}
.audience-filters__checks{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-5)}
.audience-list{list-style:none;margin:0;padding:var(--space-2) 0;max-height:360px;overflow-y:auto}
.audience-list li{display:flex;justify-content:space-between;gap:var(--space-3);padding:6px var(--space-5);font-size:var(--size-small)}
.audience-list li .muted{font-size:var(--size-label)}

/* Sidebar brand, groups and the signed-in user ----------------------------- */
.sidebar__brand{gap:var(--space-3);color:inherit;text-decoration:none}
.sidebar__brand:hover .brand-text__name{color:var(--paper-100)}
.brand-mark{width:30px;height:30px;flex:0 0 30px}
.brand-mark line{stroke:var(--paper-400);stroke-width:2;stroke-linecap:round}
.brand-mark__a{fill:var(--node-primary)}
.brand-mark__b{fill:var(--node-secondary)}
.brand-text{display:flex;flex-direction:column;min-width:0;line-height:1.15}
.brand-text__name{font-family:var(--font-sans);font-size:1.1rem;font-weight:700;color:var(--paper-100);letter-spacing:-.01em}
.brand-text__name em{font-style:normal;font-weight:500;font-size:.72rem;letter-spacing:.12em;color:var(--ink-300);margin-left:3px;vertical-align:2px}
.brand-text__org{font-size:12px;color:var(--ink-300);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:160px}
.sidebar__section{padding-top:var(--space-5)}
.nav-item__badge{margin-left:auto;min-width:20px;height:20px;padding:0 6px;border-radius:var(--radius-pill);background:var(--rose-600);color:var(--paper-100);font-size:11px;font-weight:700;display:inline-grid;place-items:center}
.nav-item--active .nav-item__badge{background:var(--paper-100);color:var(--rose-700)}
.topbar__who{display:flex;flex-direction:column;align-items:flex-end;line-height:1.2}
.topbar__who strong{font-size:var(--size-small);font-weight:600;color:var(--text-strong)}
.topbar__who span{font-size:12px;color:var(--text-muted)}
.avatar--user{width:40px;height:40px;flex:0 0 40px;font-size:14px}
@media (max-width:760px){.topbar__who{display:none}.brand-text__org{display:none}}
.sidebar__brand .brand-text span,.sidebar__brand .brand-text em{font-family:var(--font-sans);letter-spacing:normal}
.sidebar__brand .brand-text__name em{letter-spacing:.12em}
.sidebar__brand .brand-text__name{font-size:1.15rem;font-weight:700;color:var(--paper-100)}
.sidebar__brand .brand-text__name em{font-size:.68rem;font-weight:600;color:var(--ink-300)}
.sidebar__brand .brand-text__org{font-size:12px;color:var(--ink-300)}
@media (min-width:981px) and (max-width:1280px){.kpis--5{grid-template-columns:repeat(3,minmax(0,1fr))}}
.nextstep .nextstep__warn{margin:0;padding:var(--space-2) var(--space-3);border-radius:var(--radius-control);background:var(--state-warning-tint);color:var(--state-warning);font-size:var(--size-label)}
.nextstep__warn a{color:inherit;font-weight:600;text-decoration:underline;text-underline-offset:2px}
.pax-missing{color:var(--state-warning);font-weight:600}

/* Global search in the top bar */
.topbar{justify-content:space-between}
.topbar__search{position:relative;flex:1;max-width:520px}
.topbar__search svg{position:absolute;left:12px;top:50%;width:16px;height:16px;transform:translateY(-50%);color:var(--ink-400);stroke-width:1.8}
.topbar__search input{padding-left:38px;padding-right:36px;background:var(--surface-raised);border-color:transparent}
.topbar__search input:focus{background:var(--surface-card)}
.topbar__search kbd{position:absolute;right:10px;top:50%;transform:translateY(-50%);font-family:var(--font-sans);font-size:11px;color:var(--ink-400);border:var(--border-hairline);border-radius:5px;padding:0 6px;line-height:18px}
.topbar__search input:focus + kbd{display:none}
.search-groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:var(--space-4);align-items:start}
.search-list{list-style:none;margin:0;padding:0}
.search-list li + li{border-top:var(--border-hairline)}
.search-list a{display:flex;flex-direction:column;gap:2px;padding:var(--space-3) var(--space-5);color:inherit}
.search-list a:hover{background:var(--surface-hover)}
.search-list strong{font-size:var(--size-small);color:var(--text-strong)}
.search-list span{font-size:var(--size-label);color:var(--text-muted)}
@media (max-width:760px){.topbar__search kbd{display:none}}