/* PM OS on lav-ui v2 (the Sales IQ design), 2026-10-15.
   Loaded after each page's own <style>, so it restyles the existing classes without touching any markup the
   page scripts depend on. Colors are lav-ui tokens only (https://lavatory.ai/ui/), so light and dark both work.
   Rules written ".lav .x" restore buttons that the shared ".lav button" reset would otherwise flatten. */

/* page header: title left, page tabs as jump pills, freshness chip */
.head{align-items:center;gap:12px;padding:2px 0 14px;margin-bottom:12px;border-bottom:1px solid var(--lav-line)}
h1{font-size:var(--lav-fs-xl);font-weight:var(--lav-w-strong);letter-spacing:-.3px;color:var(--lav-ink)}
.head .lav-fresh{order:2}
.tabs{gap:6px}
.tabs a{border-radius:14px;padding:5px 12px;font-size:12px;font-weight:var(--lav-w-strong);color:var(--lav-ink);background:var(--lav-panel);
  border:1px solid var(--lav-line);min-height:30px;display:inline-flex;align-items:center;justify-content:center;
  transition:transform var(--lav-dur-1) var(--lav-ease-out),border-color var(--lav-dur-2) var(--lav-ease-std)}
.tabs a:hover{border-color:var(--lav-ink)}
.tabs a:active{transform:scale(.97)}
.tabs a.on{background:var(--lav-accent-bg);border-color:var(--lav-accent-bg);color:var(--lav-accent-ink)}
.sub,.lead{color:var(--lav-mut);font-size:12.5px;line-height:1.5;max-width:860px}

/* section headers: the Sales IQ 2px rule */
h2{font-size:var(--lav-fs-lg);text-transform:none;letter-spacing:-.3px;color:var(--lav-ink);font-weight:var(--lav-w-strong);
  margin:34px 0 12px;padding-bottom:6px;border-bottom:2px solid var(--lav-ink)}
h2::after{display:none}
h2 .ct{font-size:12px;color:var(--lav-brand);font-weight:var(--lav-w-strong)}
h2.fold:hover{color:var(--lav-brand)}
#focus h2{color:var(--lav-ink)}

/* stat strip = metric tiles */
.stats{gap:var(--lav-sp-3)}
.stat{background:var(--lav-panel);border:1px solid var(--lav-line);border-radius:var(--lav-r);box-shadow:var(--lav-shadow-1);
  padding:12px 15px;min-width:104px;font-size:var(--lav-fs-xs);text-transform:uppercase;letter-spacing:.05em;
  font-weight:var(--lav-w-strong);color:var(--lav-mut)}
.stat b{font-size:22px;font-weight:var(--lav-w-strong);letter-spacing:-.4px;line-height:1.15;color:var(--lav-ink);
  text-transform:none;margin-bottom:4px;font-variant-numeric:tabular-nums lining-nums}

/* filter chips: v2 selected = ink outline */
.chip,.catchip{transition:border-color var(--lav-dur-2) var(--lav-ease-std)}
.chip.on{background:var(--lav-panel);border-color:var(--lav-ink);color:var(--lav-ink)}
.filters .lbl{color:var(--lav-mut-2);font-weight:var(--lav-w-strong)}

/* cards and panels */
.card{transition:transform var(--lav-dur-2) var(--lav-ease-out),box-shadow var(--lav-dur-2) var(--lav-ease-std),border-color var(--lav-dur-2) var(--lav-ease-std)}
.card:hover{transform:translateY(-2px);box-shadow:var(--lav-shadow-2);border-color:var(--lav-line-strong)}
.card.dragging{transform:none}
.pop,.gpop{box-shadow:var(--lav-shadow-pop);border-color:var(--lav-line)}
.empty,.loading,.aiempty{color:var(--lav-mut);font-size:12.5px}

/* primary actions: ink in light, gold in dark (v2 accent) */
.lav .npbtn,.lav .aiq button,.lav .mfoot .primary,.lav .addbar button,.npbtn,.aiq button,.mfoot .primary,.addbar button{
  background:var(--lav-accent-bg);color:var(--lav-accent-ink);border:1px solid var(--lav-accent-bg);
  transition:transform var(--lav-dur-1) var(--lav-ease-out),opacity var(--lav-dur-2) var(--lav-ease-std)}
.lav .npbtn:hover,.lav .aiq button:hover,.lav .mfoot .primary:hover,.lav .addbar button:hover{background:var(--lav-accent-bg);opacity:.88}
.lav .npbtn:active,.lav .aiq button:active,.lav .mfoot .primary:active,.lav .addbar button:active,.lav .btn:active{transform:scale(.97)}
.lav .mfoot .ghost{background:var(--lav-panel);border:1px solid var(--lav-line);color:var(--lav-ink-2)}

/* secondary buttons the shared reset flattens */
.lav .btn{border:1px solid var(--lav-line-strong);background:var(--lav-panel);color:var(--lav-ink-2)}
.lav .btn:hover{border-color:var(--lav-ink)}
.lav .btn.ok{background:var(--lav-good);border-color:var(--lav-good);color:#fff}
.lav .btn.no{color:var(--lav-bad);border-color:var(--lav-bad-bg);background:var(--lav-bad-bg)}
.lav .btn.no:hover{border-color:var(--lav-bad)}
.lav .btn.danger{background:var(--lav-bad);border-color:var(--lav-bad);color:#fff}
.lav .fstar,.lav .ghostbtn{border:1px solid transparent}
.lav .fstar{color:var(--lav-gold)}
.lav .fstar:hover,.lav .ghostbtn:hover{border-color:var(--lav-line);background:var(--lav-bg)}
.lav .ghostbtn.on{background:var(--lav-done-bg);border-color:var(--lav-line-strong)}
.lav .sw{background:var(--lav-line-strong)}
.lav .sw.on{background:var(--lav-good)}

/* inputs */
input,select,textarea{color:var(--lav-ink)}
input::placeholder,textarea::placeholder{color:var(--lav-mut-2)}

/* dialog */
.mask{background:var(--lav-scrim)}
.modal{border:1px solid var(--lav-line);box-shadow:var(--lav-shadow-pop);border-radius:var(--lav-r-lg)}
.mask.on .modal{animation:pm-rise var(--lav-dur-3) var(--lav-ease-emph)}
@keyframes pm-rise{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}

/* toast: readable in both themes */
.toast{background:var(--lav-hero-1);color:var(--lav-hero-ink);box-shadow:var(--lav-shadow-pop)}
.toast.bad{background:var(--lav-bad);color:#fff}

/* version footer */
.wrap>.lav-foot{margin-top:var(--lav-sp-7)}

@media (prefers-reduced-motion:reduce){.card,.tabs a,.chip{transition:none}.card:hover{transform:none}.mask.on .modal{animation:none}}
@media (max-width:640px){h1{font-size:var(--lav-fs-lg)}.stat{min-width:0;flex:1 1 calc(33% - 12px)}.stat b{font-size:18px;overflow-wrap:anywhere}}

/* tables: long project names and paths wrap instead of widening the page; phones scroll the table sideways */
td{overflow-wrap:anywhere}
.pm-xs,#tblwrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--lav-r)}
.pm-xs table,#tblwrap table{min-width:640px}
input:not([type]),input[type=text],input[type=search],input[type=number],input[type=date],textarea{background-color:var(--lav-panel)}