/* ClaroVision APP calm layer (TK-1540, 2026-10-14). Loads AFTER the page's own <style>.
   Same rules and tokens as the approved website layer (website calm.css) and the Scout tour
   mock (business/marketing/design/scout-tour/prototype.html): flat dark page, hairline
   panels, pill tabs, small solid cyan buttons, no glow, no grain, no backdrop blur.
   Applies to index.html (the dashboard) and capture.html (rep capture). No new colours,
   no wording, no markup change. Rollback = remove the <link> to this file. */
:root{--cv-panel:rgba(15,23,36,.55);--cv-panel2:#0d141f;--cv-line:rgba(148,163,184,.14);--cv-line2:rgba(34,211,238,.35);--cv-cyan:#22d3ee;--cv-ink:#04070c;--cv-r:14px}

/* 1. Flat page: no aurora blobs, no glow, no vignette, no grain */
.aurora,.glow,.vign,.grain{display:none!important}

/* 2. Header: compact flat bar, no blur; logo flat (no sheen), dot without halo */
header{background:rgba(4,7,12,.94);backdrop-filter:none;-webkit-backdrop-filter:none}
.logo .dot{box-shadow:none}
.logo .c1,.logo .c2{animation:none;background:none;-webkit-text-fill-color:currentColor}
.logo .c1{color:var(--txt)}.logo .c2{color:var(--cyan)}
.net i,.net.off i,.hp-head .dot{box-shadow:none}

/* 3. Pill tabs (top ribbon): normal case, active = faint cyan fill + inset cyan line (already the
   app's shape; this pins it and removes the heavy ribbon rule so it reads like the mock) */
nav{border-top-color:var(--cv-line)}
nav button{font-family:var(--fb);text-transform:none;letter-spacing:0;border-radius:8px}
nav button.active{background:rgba(34,211,238,.12);box-shadow:inset 0 0 0 1px var(--cv-line2)}
nav button:hover{background:rgba(148,163,184,.08)}

/* 4. Buttons: solid cyan primary, bordered secondary, 10px corners, no lift, no glow */
.btn,.btn.cap,.send,.hp-send,#sysmsg button,#help-btn{background:var(--cv-cyan)!important;color:var(--cv-ink)!important;box-shadow:none!important;border-radius:10px;filter:none}
.btn:hover,.btn.cap:hover{transform:none;box-shadow:none;filter:none;opacity:.92}
.btn.sec{background:var(--cv-panel2)!important;color:var(--txt)!important;border:1px solid var(--cv-line);box-shadow:none!important}
.btn.sec:hover{border-color:var(--cv-line2);box-shadow:none!important;opacity:1}
.send{border-radius:12px}
.send:disabled{opacity:1;background:var(--cv-panel2)!important;color:var(--mut)!important;border:1px solid var(--cv-line)}
.send.offline{background:var(--amber)!important;color:var(--cv-ink)!important}
.spin{border-color:rgba(4,7,12,.35);border-top-color:var(--cv-ink)}
#help-btn{box-shadow:0 6px 20px rgba(0,0,0,.4)!important}
.skip{color:var(--cv-ink)}
.hp-foot .hp-tickets .badge,.hp-linkbtn .badge{color:var(--cv-ink)}

/* 5. Panels: one hairline card style everywhere, 14px radius, no blur, no shadow stack, no lift */
.card,.step,.chartwrap,.hero,.add-panel,.proof-panel,.rcard,.deal,.call,.thumb,table,.tbl-wrap{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;box-shadow:none!important}
.card,.step,.chartwrap,.hero,.rcard{background:var(--cv-panel);border:1px solid var(--cv-line);border-radius:var(--cv-r)}
.hero{padding:30px 28px}
.hero::after{display:none}
.hero .grad{background:none;-webkit-text-fill-color:currentColor;color:var(--cyan)}
.card.warn{background:var(--cv-panel);border-color:rgba(251,191,36,.4)}
.card:hover,.step:hover{transform:none;border-color:var(--cv-line2);box-shadow:none}
.tbl-wrap{border:1px solid var(--cv-line);background:transparent;border-radius:var(--cv-r)}
table{background:var(--cv-panel)}
.rcard.good{border-color:rgba(52,211,153,.35)}.rcard.warn{border-color:rgba(251,191,36,.4)}.rcard.bad{border-color:rgba(248,113,113,.4)}
.deal,.call{background:var(--cv-panel)}

/* 6. Featured / accent panel: faint cyan fill + cyan line (same as the site's featured card) */
.proof-panel,.capture{background:rgba(34,211,238,.06);border-color:var(--cv-line2)}
.hero,.chartwrap,.add-panel{border-color:var(--cv-line)}
.capture{border-radius:var(--cv-r);box-shadow:none!important}

/* 7. Tables: plain hairline rows, small mono header kept (it is the app's data voice) */
th,td{border-bottom-color:var(--cv-line)}
tbody tr:hover,table tr:hover{background:rgba(34,211,238,.04)}

/* 8. Inputs and segmented control: flat, no glow ring (focus stays visible, 2px outline kept) */
input:focus,select:focus{box-shadow:none;border-color:var(--cyan)}
.btn:focus-visible,nav button:focus-visible,.bnav button:focus-visible{box-shadow:none}
.seg-btn.on{background:rgba(34,211,238,.12);box-shadow:inset 0 0 0 1px var(--cv-line2)}
.chip.on{border-color:rgba(52,211,153,.4)}

/* 9. Overlays: no blur; solid panels */
.sheet-bg,#sysmsg,#toast{backdrop-filter:none;-webkit-backdrop-filter:none}
#toast{box-shadow:0 8px 24px rgba(0,0,0,.4)}
.sheet{box-shadow:none;border-top-color:var(--cv-line2)}
.sheet-grid button.on{background:rgba(34,211,238,.12)}
#help-panel{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;box-shadow:0 8px 24px rgba(0,0,0,.4)!important;border-radius:var(--cv-r)!important}
#detail .detail-box,#sysmsg .card{box-shadow:0 8px 24px rgba(0,0,0,.4)}

/* 10. Bottom bars (phones): solid, hairline top, active icon without glow */
.bnav{background:#070c14;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none}
.bnav button.on svg{filter:none}
.pill{background:#070c14;backdrop-filter:none;-webkit-backdrop-filter:none}

/* 11. Sign-in card (inline styles in index.html, hence !important) */
#signinForm{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;box-shadow:none!important;border-radius:var(--cv-r)!important}

/* 12. Info "i" tips: keep, flat */
#tipbox{box-shadow:0 8px 24px rgba(0,0,0,.4)}