:root{
  --bg:#020617; --panel:#0a1122; --panel2:#0d1529; --line:rgba(148,163,184,.14);
  --cyan:#1ecdf1; --pink:#ff7afb; --purple:#9f7aea; --green:#22c55e; --amber:#f59e0b; --red:#f87171;
  --text:#f1f5f9; --muted:#94a3b8; --muted2:#64748b;
  --card:#0d1529;
  --r:16px;
  color-scheme:dark;
}
*{box-sizing:border-box;margin:0;padding:0}
input,textarea,select{font-family:inherit;color:inherit}
a{color:var(--cyan)}
a:visited{color:#7dd3fc}
button.set-row{color:var(--text)}
.set-row .sub{color:var(--muted)}
body{background:var(--bg);color:var(--text);font-family:'Inter',system-ui,sans-serif;font-size:14px;min-height:100vh;display:flex;overflow-x:hidden;overflow-x:clip}
html{overflow-x:hidden;overflow-x:clip}
h1,h2,.brand-name,.card-title,.kpi-value{font-family:'Montserrat',sans-serif}
.bg-glow{position:fixed;border-radius:50%;filter:blur(120px);pointer-events:none;z-index:0;opacity:.5;contain:strict;overflow:clip}
.bg-glow-a{width:76vmin;height:76vmin;margin-left:-38vmin;margin-top:-38vmin;background:radial-gradient(circle,rgba(30,205,241,.40) 0%,rgba(255,122,251,.18) 45%,transparent 70%);animation:heartbeat 3.4s ease-in-out infinite}
.bg-glow-b{width:620px;height:620px;right:0;bottom:0;transform:translate(35%,35%);background:radial-gradient(circle,rgba(255,122,251,.16),transparent 70%)}
@keyframes heartbeat{0%,100%{opacity:.55;transform:scale(1)}14%{opacity:.85;transform:scale(1.045)}28%{opacity:.6;transform:scale(1.005)}42%{opacity:.8;transform:scale(1.03)}60%{opacity:.6;transform:scale(1)}}

/* ---------- Sidebar ---------- */
.sidebar{width:298px;min-width:298px;background:rgba(6,10,24,.92);border-right:1px solid var(--line);display:flex;flex-direction:column;padding:22px 14px;position:sticky;top:0;height:100vh;z-index:2;backdrop-filter:blur(8px)}
.brand{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:16px;border-bottom:1px solid var(--line);margin-bottom:14px}
.brand-ver{margin-top:5px;font-size:11px;color:var(--muted);letter-spacing:.4px}
.brand-logo{width:140px;max-width:100%;height:auto;display:block}
.brand-badge{width:46px;height:46px;border-radius:14px;background:linear-gradient(135deg,var(--cyan),var(--pink));display:flex;align-items:center;justify-content:center;font-family:'Montserrat';font-weight:800;font-size:17px;color:#020617;box-shadow:0 0 24px rgba(30,205,241,.45)}
.brand-name{font-weight:700;font-size:15px}
.brand-sub{font-size:10px;letter-spacing:1.5px;color:var(--pink);font-weight:700;margin-top:2px}
.nav{display:flex;flex-direction:column;gap:3px;flex:1;overflow-y:auto}
.nav-label{font-size:10px;letter-spacing:1.6px;text-transform:uppercase;color:var(--muted2);font-weight:700;padding:14px 10px 6px}
.nav-item{display:flex;align-items:center;gap:11px;background:none;border:0;color:var(--muted);font-family:'Inter';font-size:13.5px;font-weight:500;padding:10px 12px;border-radius:12px;cursor:pointer;text-align:left;transition:.18s;width:100%}
.nav-item:hover{background:rgba(30,205,241,.08);color:var(--text)}
.nav-item.active{background:linear-gradient(90deg,rgba(30,205,241,.18),rgba(255,122,251,.12));color:var(--text);box-shadow:inset 0 0 0 1px rgba(30,205,241,.25)}
.nav-ico{width:20px;text-align:center;font-size:15px;color:var(--cyan)}
.nav-item.active .nav-ico{color:var(--pink)}
.nav-badge{margin-left:auto;background:var(--pink);color:#020617;font-size:10.5px;font-weight:700;border-radius:99px;padding:1px 8px}
.live-dot{width:8px;height:8px;border-radius:50%;background:var(--green);margin-left:auto;box-shadow:0 0 10px var(--green);animation:pulse 1.6s infinite}
.live-dot.sm{width:7px;height:7px;margin:0}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
.user-card{display:flex;gap:10px;align-items:center;padding:12px;border-top:1px solid var(--line);margin-top:10px}
.avatar{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--cyan),var(--purple));display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;color:#020617;flex-shrink:0}
.user-name{font-weight:600;font-size:13px}
.user-role{font-size:11px;color:var(--muted)}

/* ---------- Main / topbar ---------- */
.main{flex:1;padding:26px 30px 0;position:relative;z-index:1;min-width:0;display:flex;flex-direction:column;min-height:100vh}
/* Sticky footer (Ryan, Oct 21 2026): the active screen grows to fill short
   pages so the legal footer rests at the bottom of the screen; taller
   content pushes it down naturally. */
.main>.screen.active{flex:1 0 auto}
.topbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;gap:16px}
.topbar h1{font-size:24px;font-weight:800;letter-spacing:-.3px}
.topbar-right{display:flex;align-items:center;gap:14px}
.topbar-left{display:flex;align-items:center;gap:14px;min-width:0}
.topbar .back-btn{margin:0;padding:7px 13px;font-size:13px;white-space:nowrap}
.topbar>.search{margin-left:auto}
.search input{background:var(--panel);border:1px solid var(--line);color:var(--text);border-radius:12px;padding:9px 14px;width:280px;font-size:13px;outline:none}
.search input:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(30,205,241,.15)}
.clock{display:flex;align-items:center;gap:8px;font-variant-numeric:tabular-nums;color:var(--muted);font-weight:600;font-size:13px}
.icon-btn{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:12px;width:38px;height:38px;cursor:pointer;font-size:16px;color:var(--text);display:inline-flex;align-items:center;justify-content:center}
.icon-btn .ping{position:absolute;top:8px;right:9px;width:8px;height:8px;border-radius:50%;background:var(--pink);box-shadow:0 0 8px var(--pink)}

/* ---------- Cards / KPIs ---------- */
.screen{display:none;animation:fade .25s ease}
.screen.active{display:block}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px}
.kpi{background:linear-gradient(160deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;position:relative;overflow:hidden}
.kpi::after{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(var(--cyan),var(--pink));opacity:.8}
.kpi-label{font-size:11.5px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.8px}
.kpi-value{font-size:30px;font-weight:800;margin:6px 0 2px}
.kpi-delta{font-size:12px;color:var(--muted)}
.kpi-delta.up{color:var(--green)} .kpi-delta.down{color:var(--green)}
.card{background:linear-gradient(165deg,rgba(20,30,55,.75),rgba(8,13,28,.9));border:1px solid var(--line);border-radius:var(--r);padding:20px;margin-bottom:20px;box-shadow:0 8px 32px rgba(0,0,0,.35)}
.card-title{font-size:15px;font-weight:700;margin-bottom:14px;display:flex;align-items:center;gap:8px}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.muted{color:var(--muted);font-size:13px;line-height:1.6}
.muted-sm{color:var(--muted2);font-size:11.5px}
.center{text-align:center}
.btn-primary{background:linear-gradient(135deg,var(--cyan),var(--pink));border:0;color:#020617;font-weight:700;font-size:13px;padding:10px 18px;border-radius:12px;cursor:pointer;font-family:'Inter';box-shadow:0 4px 18px rgba(30,205,241,.35);transition:.18s}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 6px 24px rgba(255,122,251,.4)}
.btn-ghost{background:rgba(30,205,241,.1);border:1px solid rgba(30,205,241,.35);color:var(--cyan);font-weight:600;font-size:13px;padding:9px 16px;border-radius:12px;cursor:pointer}
.btn-ghost:hover{background:rgba(30,205,241,.2)}
.btn-orange{background:#fba401;border:1px solid #fba401;color:#241a02}
.btn-orange:hover{background:#fb9d00;border-color:#fb9d00}
.btn-orange.active{background:#ed5e02;border-color:#ed5e02;color:#fff;box-shadow:0 0 12px rgba(251,164,1,.35)}

/* ---------- Dashboard widgets ---------- */
.funnel-row{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.funnel-name{width:130px;font-size:12.5px;color:var(--muted);font-weight:500}
.funnel-bar{flex:1;height:26px;background:rgba(148,163,184,.1);border-radius:8px;position:relative;overflow:hidden}
.funnel-fill{height:100%;border-radius:8px;background:linear-gradient(90deg,var(--cyan),var(--pink));display:flex;align-items:center;justify-content:flex-end;padding-right:10px;font-size:11.5px;font-weight:700;color:#020617;min-width:34px;transition:width .6s ease}
.feed{display:flex;flex-direction:column;gap:2px;max-height:300px;overflow-y:auto}
.feed-item{display:flex;gap:12px;padding:10px 4px;border-bottom:1px solid rgba(148,163,184,.08);font-size:13px}
.feed-item:last-child{border:0}
.feed-ico{width:32px;height:32px;border-radius:10px;background:rgba(30,205,241,.12);display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0}
.feed-time{margin-left:auto;color:var(--muted2);font-size:11px;white-space:nowrap}
.task{display:flex;gap:12px;align-items:flex-start;padding:10px 4px;border-bottom:1px solid rgba(148,163,184,.08);font-size:13px;cursor:pointer}
.task:last-child{border:0}
.task input{margin-top:3px;accent-color:var(--pink);width:16px;height:16px}
.task.done span{text-decoration:line-through;color:var(--muted2)}
.muse-teaser{border:1px solid rgba(255,122,251,.3);background:linear-gradient(165deg,rgba(255,122,251,.07),rgba(8,13,28,.9));box-shadow:0 0 30px rgba(255,122,251,.22),0 8px 32px rgba(0,0,0,.35)}
.muse-teaser .btn-primary{margin-top:14px}

/* ---------- Kanban ---------- */
.screen-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;flex-wrap:wrap;gap:10px}
.pill-row{display:flex;gap:8px;flex-wrap:wrap}
.stat-pill{background:var(--panel);border:1px solid var(--line);border-radius:99px;padding:6px 14px;font-size:12px;color:var(--muted)}
.stat-pill b{color:var(--text)}
.kanban{display:grid;grid-template-columns:repeat(7,minmax(230px,1fr));gap:14px;overflow-x:auto;padding-bottom:10px;align-items:start}
.kcol{background:rgba(10,17,34,.7);border:1px solid var(--line);border-radius:var(--r);padding:12px;min-height:200px}
.kcol.drag-over{border-color:var(--cyan);box-shadow:0 0 0 2px rgba(30,205,241,.3)}
.kcol-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;padding:2px 4px}
.kcol-name{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.6px}
.kcol-count{background:rgba(148,163,184,.15);border-radius:99px;font-size:11px;font-weight:700;padding:2px 9px;color:var(--muted)}
.kcard{background:linear-gradient(165deg,#131c33,#0b1226);border:1px solid var(--line);border-left:3px solid var(--cyan);border-radius:12px;padding:12px;margin-bottom:10px;cursor:grab;transition:.15s}
.kcard:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(0,0,0,.45);border-color:rgba(30,205,241,.4)}
.kcard.dragging{opacity:.4;transform:rotate(2deg)}
.kcard-name{font-weight:600;font-size:13.5px;margin-bottom:6px}
.kcard-meta{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.tag{font-size:10.5px;font-weight:700;padding:3px 9px;border-radius:99px;letter-spacing:.3px}
.tag.loan{background:rgba(30,205,241,.14);color:var(--cyan)}
.tag.fha{background:rgba(159,122,234,.16);color:var(--purple)}
.tag.va{background:rgba(34,197,94,.14);color:var(--green)}
.tag.conv{background:rgba(245,158,11,.14);color:var(--amber)}
.kcard-foot{display:flex;align-items:center;justify-content:space-between}
.mini-avatar{width:26px;height:26px;border-radius:50%;font-size:10px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;color:#020617}
.days{font-size:11px;color:var(--muted2)}
.days.hot{color:var(--pink);font-weight:700}

/* ---------- Inbox ---------- */
.inbox{display:flex;flex-direction:column;gap:16px;height:calc(100vh - 170px);min-height:480px}
.inbox-list{display:flex;flex-direction:column;overflow:hidden;margin:0;flex:1;min-height:0}
.inbox.cc-open .inbox-list{flex:0 1 46%}
.inbox-search{padding:4px 4px 12px}
.inbox-search input{width:100%;background:rgba(148,163,184,.08);border:1px solid var(--line);border-radius:10px;padding:9px 12px;color:var(--text);font-size:13px;outline:none}
#convo-list{overflow-y:auto;flex:1}
.convo{display:flex;flex-direction:row;gap:12px;padding:14px 12px 14px 18px;border-radius:12px;cursor:pointer;border:1px solid transparent;position:relative}
.convo::before{content:'';position:absolute;left:0;top:8px;bottom:8px;width:5px;border-radius:99px;background:var(--cc,var(--cyan))}
.cc-rail{flex:0 0 76px;display:flex;flex-direction:column;gap:1px;padding-top:1px}
.cc-type{font-size:12.5px;font-weight:800;color:var(--cc,var(--cyan));line-height:1.25}
.cc-dir3{font-size:11px;font-weight:600;color:var(--muted2)}
.cc-main{flex:1;min-width:0;display:flex;flex-direction:column}
.convo:hover{background:rgba(30,205,241,.06)}
.convo.active{background:rgba(30,205,241,.1);border-color:rgba(30,205,241,.3)}
.convo-main{flex:1;min-width:0}
.convo-name{font-weight:600;font-size:13px;display:flex;align-items:center;gap:7px}
.convo-snip{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:3px}
.convo-time{font-size:10.5px;color:var(--muted2)}
.unread{width:9px;height:9px;border-radius:50%;background:var(--pink);box-shadow:0 0 8px var(--pink);flex-shrink:0;margin-top:4px}
.chan{font-size:11px;font-weight:700;padding:2px 8px;border-radius:6px;background:rgba(159,122,234,.18);color:var(--purple)}
.chan.sms{background:rgba(30,205,241,.16);color:var(--cyan)}
.chan.call{background:rgba(52,211,153,.16);color:#34d399}
.chan.vm{background:rgba(251,164,1,.16);color:var(--orange)}
.cc-filters{display:flex;gap:6px;flex-wrap:wrap;padding:2px 2px 10px}
.cc-mkt{display:flex;align-items:center;gap:10px;padding:0 2px 10px}
.cc-mkt-row{flex:1;font-size:12.5px}
.cc-row1{display:flex;align-items:center;gap:8px}
.cc-name{font-weight:700;font-size:15.5px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-when{margin-left:auto;font-size:13px;font-weight:600;color:var(--muted);white-space:nowrap}
.cc-mhead{display:flex;align-items:center;gap:8px;margin-bottom:3px}
.cc-mhead .cc-when{margin-left:0;font-size:15px;font-weight:700;color:var(--text)}
.cc-mhead .unread{margin:0 0 0 auto}
.msg.cc-flash .msg-bubble{animation:ccflash 1.9s ease}
@keyframes ccflash{0%,55%{box-shadow:0 0 0 3px var(--pink)}100%{box-shadow:0 0 0 0 rgba(251,113,181,0)}}
.cc-row2{margin-top:3px;font-size:13.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-dir2{color:var(--muted2)}
#cc-detail{flex:1;min-height:0;display:flex;flex-direction:column}
.inbox-thread{display:none;flex-direction:column;margin:0;overflow:hidden}
.inbox.cc-open .inbox-thread{display:flex;flex:1;min-height:0}
#cc-close-bar{display:flex;justify-content:flex-end;padding:0 0 6px}
#screen-inbox .chip{font-size:13px}
#screen-inbox .inbox-search input{font-size:14px}
.convo.cc-un{background:rgba(251,113,181,.06);border-color:rgba(251,113,181,.28)}
.convo.cc-un:hover{background:rgba(251,113,181,.11)}
.cc-un .cc-row2{color:var(--text)}
.thread-head{padding:6px 4px 14px;border-bottom:1px solid var(--line);margin-bottom:6px}
.thread-head .who{font-weight:700;font-size:15px}
.thread-head .sub{font-size:12px;color:var(--muted);margin-top:3px}
.thread-body{flex:1;overflow-y:auto;padding:14px 6px;display:flex;flex-direction:column;gap:10px}
.msg{display:flex}
.msg>div{max-width:72%;min-width:0}
.msg .msg-bubble{max-width:100%;overflow-wrap:break-word;padding:10px 14px;border-radius:16px;font-size:13.5px;line-height:1.5}
.msg.them .msg-bubble{background:rgba(148,163,184,.12);border-bottom-left-radius:4px}
.msg.me{justify-content:flex-end}
.msg.me .msg-bubble{background:linear-gradient(135deg,rgba(30,205,241,.9),rgba(30,205,241,.65));color:#02141a;font-weight:500;border-bottom-right-radius:4px}
.msg.muse .msg-bubble{background:linear-gradient(135deg,rgba(255,122,251,.16),rgba(30,205,241,.1));border:1px solid rgba(255,122,251,.3);border-bottom-left-radius:4px}
.msg-time{font-size:11.5px;color:var(--muted2);margin-top:4px}
.msg-author{font-size:11px;font-weight:600;color:var(--muted);margin:0 0 3px 4px}
.grp-person{cursor:pointer}
.grp-person:hover{text-decoration:underline}
.msg-author[data-contact]{cursor:pointer}
.msg-author[data-contact]:hover{text-decoration:underline}
.grp-row{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;cursor:pointer;font-size:13.5px}
.grp-row:hover{background:rgba(148,163,184,.1)}
.grp-row input{width:16px;height:16px;accent-color:var(--brand,#fba401)}
.thread-reply{display:flex;gap:10px;padding-top:12px;border-top:1px solid var(--line)}
.thread-reply input{flex:1;background:rgba(148,163,184,.08);border:1px solid var(--line);border-radius:12px;padding:11px 14px;color:var(--text);font-size:13px;outline:none}
.thread-reply input:focus{border-color:var(--cyan)}

/* ---------- Tables ---------- */
.table-tools{display:flex;justify-content:flex-start;gap:12px;margin-bottom:16px;flex-wrap:wrap;row-gap:10px}
.sort-group{display:flex;flex-direction:column;gap:3px}
.sort-btns{display:flex;gap:6px}
.sort-cap{display:flex;align-items:center;gap:8px;font-size:10px;color:var(--muted);letter-spacing:.05em;white-space:nowrap}
.sort-cap::before,.sort-cap::after{content:'';flex:1;height:1px;background:var(--line)}
.tools-right{display:flex;gap:12px;align-items:flex-start;margin-left:auto}
.table-tools input{background:rgba(148,163,184,.08);border:1px solid var(--line);border-radius:12px;padding:9px 14px;color:var(--text);font-size:13px;width:320px;outline:none}
.data-table{width:100%;border-collapse:collapse;font-size:13px}
/* Wide tables scroll inside their own card instead of pushing the page
   sideways: any element holding a data table directly may scroll x. */
:has(> .data-table){overflow-x:auto;min-width:0}
.card{min-width:0}
@media(max-width:1250px){.data-table th{padding:8px 9px}.data-table td{padding:10px 9px}}
.data-table th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted2);font-weight:700;padding:10px 12px;border-bottom:1px solid var(--line)}
.data-table td{padding:12px;border-bottom:1px solid rgba(148,163,184,.07)}
.data-table tr:hover td{background:rgba(30,205,241,.04)}
.stage-pill{font-size:11px;font-weight:700;padding:4px 11px;border-radius:99px;white-space:nowrap}

/* ---------- Charts / platforms ---------- */
canvas{width:100%;display:block}
.platforms{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-bottom:20px}
.platform{background:linear-gradient(165deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:var(--r);padding:16px;text-align:center;transition:.18s}
a.platform{display:block;text-decoration:none;color:inherit;cursor:pointer}
a.platform:hover{border-color:var(--cyan,#22d3ee);transform:translateY(-1px)}
.platform:hover{transform:translateY(-3px);border-color:rgba(255,122,251,.4);box-shadow:0 10px 28px rgba(0,0,0,.4)}
.pf-ico{font-size:24px;margin-bottom:8px}
.pf-name{font-size:12px;font-weight:700}
.ss-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:2px 0 4px}
.ss-stat{background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.ss-stat-label{font-size:11px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.6px}
.ss-stat-value{font-size:21px;font-weight:800;margin:3px 0 1px}
.ss-stat-sub{font-size:12px;color:var(--muted)}
.pg-day{font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.6px;margin:14px 0 0}
.post-group{padding:12px 2px 13px;border-bottom:1px solid var(--line);display:flex;gap:13px}
.post-group:last-child{border-bottom:none;padding-bottom:2px}
.pg-thumb{width:104px;flex:none}
.pg-thumb img{width:104px;height:64px;object-fit:cover;border-radius:8px;border:1px solid var(--line);display:block;background:var(--panel2)}
.pg-thumb-fallback{height:64px;border-radius:8px;border:1px solid var(--line);background:var(--panel2);display:flex;align-items:center;justify-content:center;color:var(--muted)}
.pg-main{flex:1;min-width:0}
.kind-pill{font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:3px 8px;border-radius:999px;background:rgba(251,164,1,.13);color:#fba401;border:1px solid rgba(251,164,1,.4);white-space:nowrap;flex:none}
.pg-head{display:flex;justify-content:space-between;gap:14px;align-items:baseline}
.pg-text{font-weight:700;font-size:14px;line-height:1.35}
.pg-when{color:var(--muted);font-size:12px;white-space:nowrap}
.pg-nets{margin-top:9px;display:grid;gap:6px}
.pg-net{display:flex;align-items:center;gap:9px;font-size:13px}
.net-badge{width:23px;height:23px;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:800;color:#0b0f14;flex:none}
.pg-pname{width:76px;color:var(--muted);flex:none}
.pg-stats{font-weight:600}
.pg-time{margin-left:auto;color:var(--muted);font-size:12px;white-space:nowrap}
.pf-followers{font-size:19px;font-weight:800;font-family:'Montserrat';margin:6px 0 2px}
.pf-label{font-size:10.5px;color:var(--muted2);text-transform:uppercase;letter-spacing:.6px}
.pf-views{margin-top:10px;padding-top:10px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}
.pf-views b{color:var(--cyan)}
.kv-list{display:flex;flex-direction:column}
.kv-row{display:flex;justify-content:space-between;align-items:center;padding:10px 4px;border-bottom:1px solid rgba(148,163,184,.08);font-size:13px}
.kv-row:last-child{border:0}
.kv-row .v{font-weight:700;font-variant-numeric:tabular-nums}
.kv-row .bar{height:6px;border-radius:99px;background:rgba(148,163,184,.12);margin-top:6px;overflow:hidden}
.kv-row .bar i{display:block;height:100%;background:linear-gradient(90deg,var(--cyan),var(--pink));border-radius:99px}

/* ---------- Open house leads ---------- */
.oh-head{display:flex;align-items:center;gap:20px;margin-bottom:18px;flex-wrap:wrap}
.live-badge{display:flex;align-items:center;gap:9px;font-weight:800;font-size:13px;letter-spacing:1.2px;color:var(--green);background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.35);padding:9px 18px;border-radius:99px}
.oh-kpis{flex:1;margin:0}
.oh-kpis .kpi{padding:12px 18px}
.oh-kpis .kpi-value{font-size:24px}
.chip-row{display:flex;gap:10px;margin-bottom:18px;flex-wrap:wrap}
.chip{background:var(--panel);border:1px solid var(--line);color:var(--muted);font-size:12.5px;font-weight:600;padding:8px 16px;border-radius:99px;cursor:pointer}
.chip.active{border-color:var(--pink);color:var(--text);background:rgba(255,122,251,.1);box-shadow:0 0 14px rgba(255,122,251,.25)}
.oh-feed{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.oh-card{background:linear-gradient(165deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:var(--r);padding:16px;animation:slidein .45s ease;position:relative;overflow:hidden}
.oh-card.fresh{border-color:rgba(34,197,94,.5);box-shadow:0 0 22px rgba(34,197,94,.18)}
@keyframes slidein{from{opacity:0;transform:translateY(-14px) scale(.98)}to{opacity:1;transform:none}}
.oh-prop{font-size:11px;font-weight:700;color:var(--cyan);text-transform:uppercase;letter-spacing:.6px;margin-bottom:8px}
.oh-name{font-weight:700;font-size:15px}
.oh-contact{font-size:12.5px;color:var(--muted);margin:4px 0 10px}
.oh-foot{display:flex;align-items:center;justify-content:space-between}
.oh-time{font-size:11px;color:var(--muted2)}
.intent{font-size:10.5px;font-weight:700;padding:4px 10px;border-radius:99px}
.intent.tour{background:rgba(34,197,94,.15);color:var(--green)}
.intent.browse{background:rgba(148,163,184,.15);color:var(--muted)}
.intent.preapp{background:rgba(30,205,241,.15);color:var(--cyan)}

/* ---------- Ask Muse / FAB ---------- */
.fab{position:fixed;right:26px;bottom:26px;width:58px;height:58px;border-radius:50%;border:0;background:linear-gradient(135deg,var(--cyan),var(--pink));font-size:24px;cursor:pointer;box-shadow:0 8px 30px rgba(255,122,251,.5);color:#020617;z-index:50;transition:.2s}
.fab:hover{transform:scale(1.08)}
.muse-panel{max-width:760px;margin:0 auto}
.muse-thread{display:flex;flex-direction:column;gap:10px;max-height:380px;overflow-y:auto;padding:6px 2px 14px}
.muse-suggest{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.typing{display:inline-flex;gap:4px;padding:12px 16px}
.typing i{width:7px;height:7px;border-radius:50%;background:var(--pink);animation:tp 1s infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes tp{0%,100%{opacity:.3}50%{opacity:1}}

@media(max-width:1200px){.kpis{grid-template-columns:repeat(2,1fr)}.platforms{grid-template-columns:repeat(3,1fr)}.grid-2{grid-template-columns:1fr}.inbox{height:auto}.kanban{grid-template-columns:repeat(7,260px)}}
@media(max-width:820px){.sidebar{position:fixed;top:0;left:0;bottom:0;transform:translateX(-110%);transition:transform .3s ease;z-index:70;width:298px}body.nav-open .sidebar{transform:none}body .nav-toggle{display:flex}.main{padding:18px 18px 0}.kpis{grid-template-columns:1fr 1fr}.platforms{grid-template-columns:1fr 1fr}.contact-grid{grid-template-columns:1fr}
/* Mobile topbar (Ryan, Oct 21 2026): bigger pancake button, the search bar
   drops to its own full-width row under the title instead of crowding it,
   and the clock hides (the phone shows its own). */
body .nav-toggle{width:48px;height:48px;font-size:23px;border-radius:14px}
.topbar{flex-wrap:wrap;row-gap:10px}
.topbar>.search{order:4;flex:1 1 100%;margin-left:0}
.topbar>.search input{width:100%}
.topbar .clock{display:none}}

.nav-toggle{display:none}
/* ---------- Contact profile page ---------- */
.back-btn{background:none;border:1px solid var(--line);color:var(--muted);padding:9px 16px;border-radius:10px;cursor:pointer;margin-bottom:16px;font-size:14px;font-weight:600}
.back-btn:hover{color:var(--text);border-color:var(--cyan)}
.chead{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:stretch;gap:16px;margin-bottom:14px;padding:14px 18px}
.chead-main{display:flex;flex-direction:column;justify-content:center;min-width:0;flex:1 1 200px}
.chead-namerow{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.chead .assign-chip,.chead .temp-chip,.chead .ai-chip{padding:5px 10px}
.chead .temp-chip{height:54px;display:inline-flex;align-items:center;padding:0 18px;font-size:14px;border-radius:12px}
.chead .ai-chip{height:54px;padding:0 18px;font-size:14px;border-radius:12px}
.flag-btn{display:inline-flex;align-items:center;gap:7px;height:54px;padding:0 18px;font-size:14px;font-weight:700;border-radius:12px;border:1px solid var(--line);background:rgba(148,163,184,.06);color:var(--muted);cursor:pointer;font-family:inherit;transition:all .15s}
.flag-btn:hover{border-color:rgba(245,179,1,.5);color:var(--text)}
/* Priority lights up green when selected (Ryan, Oct 21 2026). */
.flag-btn.on{background:rgba(245,179,1,.16);border-color:rgba(245,179,1,.6);color:#f5b301;box-shadow:0 0 14px rgba(245,179,1,.35)}
/* Assigned line: plain text under the contact name, no pill (Ryan, Oct 21 2026) */
.chead-assigned{margin-top:2px}
.assign-text{font-size:13px;color:var(--muted)}
.assign-text b{color:var(--text);font-weight:600}
/* Three-container contact header (Ryan, Oct 21 2026): left holds the photo,
   name, Assigned line and the Hot/Priority/AI buttons; the middle holds the
   type bubbles over Convert to Partner; the right holds the action buttons.
   On mobile they stack: name block, actions, then Convert/info. */
.chead-wrap{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px;margin-bottom:14px;align-items:stretch}
.chead-left{display:flex;flex-wrap:wrap;gap:16px;align-items:stretch;padding:10px 14px;margin-bottom:0}
/* Square contact and partner photos everywhere (Ryan, Oct 21 2026): the
   photo holds a 1:1 aspect instead of stretching to the card height. */
.chead-left .d-ava{grid-area:photo;width:104px;height:104px;aspect-ratio:1/1;align-self:center;border-radius:16px;font-size:26px;background-size:cover;background-position:center}
.chead-left .assign-chip,.chead-left .temp-chip,.chead-left .ai-chip{padding:5px 4px}
.chead-left .temp-chip{height:54px;display:inline-flex;align-items:center;padding:0 8px;font-size:14px;border-radius:12px}
.chead-left .ai-chip{height:54px;padding:0 8px;font-size:14px;border-radius:12px}
.chead-left .flag-btn{padding:0 12px}
.chead-mid{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:7px 12px;margin-bottom:0;min-width:350px}
@media(max-width:1450px){.chead-mid{min-width:350px}}
@media(max-width:1350px){.chead-mid{min-width:350px}}
/* Full-width desktops: the chip row never wraps; the temperature chip (the
   one variable-length label) absorbs any squeeze instead. */
@media(min-width:1451px){#screen-contact .chead-meta{flex-wrap:nowrap}#screen-contact .chead-subbtns{flex-wrap:nowrap}.chead-left .temp-chip{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chead-subbtns .ai-chip{flex:0 0 auto;white-space:nowrap}#screen-contact .chead-subbtns .temp-chip{flex:0 0 auto}}
/* Contact actions in the far-right header box (Ryan, Oct 21 2026): Merge and
   Delete, the two opt-outs, DNC, and Block incoming calls. The name box
   gives up width (it is 1fr) so this box can hold them all. */
.chead-actions{width:100%;padding-top:2px;display:flex;flex-direction:row;align-items:flex-start;gap:12px}
/* The four switches stack in one column on the left of the actions
   area, the three buttons stack on the right (Ryan, Oct 24 2026,
   reorganized so this box can be narrower and box 1 gets the width).
   Small trims (gaps, button padding, box padding) keep the taller
   two-column arrangement inside the locked header height. */
.ca-rows{display:grid;grid-template-columns:1fr;gap:4px 8px;flex:1 1 auto}
/* Photo crop editor (Ryan, Oct 21 2026): zoom and drag to center when
   adding a contact photo, before it is saved as the square headshot. */
.pc-stage{position:relative;width:min(280px,72vw);aspect-ratio:1;margin:0 auto;border-radius:14px;overflow:hidden;background:#0b1220;touch-action:none;cursor:grab}
.pc-stage.grabbing{cursor:grabbing}
.pc-stage img{position:absolute;left:50%;top:50%;max-width:none;user-select:none;-webkit-user-drag:none}
.pc-controls{display:flex;align-items:center;gap:12px;margin-top:12px}
.pc-zoom{flex:1;display:flex;align-items:center;gap:8px;font-size:13px}
.pc-zoom input{flex:1}
.pc-btns{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}
/* Convert sits in the Merge/Delete row, three wide (Ryan, Oct 21 2026),
   sized like its neighbours instead of a big pill of its own. */
.ca-btns .mini-btn{white-space:nowrap;font-size:12px;padding:5px 6px}
.ca-btns{display:flex;flex-direction:column;gap:6px;order:2}
.ca-btns .mini-btn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:6px}
/* Merge and Delete size to their words now; Convert takes the rest of
   the row, which frees the width the action buttons box needed. */
.ca-btns .mini-btn{flex:0 0 auto}
.ca-btns #c-convert{flex:0 0 auto}
.ca-del{color:#ff8fab;border-color:rgba(255,94,122,.45)}
.ca-row{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:11.5px;cursor:pointer}
.merge-pick{display:flex;justify-content:space-between;gap:10px;width:100%;text-align:left;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:rgba(148,163,184,.05);margin-bottom:6px;cursor:pointer;color:var(--text);font-family:inherit;font-size:14px}
.merge-pick:hover{border-color:var(--cyan)}
.merge-conf{padding:10px 12px;border:1px solid var(--line);border-radius:10px;margin-bottom:8px}
.merge-conf label{display:flex;gap:8px;align-items:center;font-size:13.5px;cursor:pointer;margin-top:6px}
/* Middle and right containers swapped (Ryan, Oct 21 2026): the action
   buttons sit in the middle, Convert to Partner on the far right. The same
   order values drive the mobile stack (name, actions, Convert). */
.chead-left{order:1}
.chead-right{order:2}
.chead-mid{order:3}
.chead-mid .chead-stack{margin-left:0}
.chead-right{display:flex;align-items:center;padding:14px 10px;margin-bottom:0}
@media(max-width:900px){
  .chead-wrap{display:flex;flex-direction:column}
  .chead-left{order:1}
  /* Mobile header sections (Ryan, Oct 22 2026): 1 name box, 2 the
     lead source / referred by / last contact card (.cf-mob2, populated
     by cfMob2Layout in app.js), 3 the six action buttons, 4 the opt
     out / Merge / Delete card. Desktop order is untouched. */
  .cf-mob2{order:2}
  .chead-right{order:3}
  .chead-mid{order:4;min-width:0}
  /* Section 2 layout: the two source pills share a row. (The last
     contact block that also lived here was removed on Oct 24 2026.)
     Visibility/display of the card itself is set inline by
     cfMob2Layout. */
  .cf-mob2{display:flex;flex-direction:column;gap:8px;padding:10px 14px;margin-bottom:0}
  .cf-mob2 .chead-src{flex-direction:row;flex-wrap:wrap;align-items:center}
  /* Mobile only (Ryan, Oct 21 2026): the stacked header containers plus the
     tab bar are too tall to pin; they scroll away so the content underneath
     gets the full screen. Desktop keeps the fixed header. (Stronger
     selector: the base .chead-sticky rule sits later in this file.) */
  #screen-contact .chead-sticky{position:static}
  /* The six action buttons auto-fill their container and divide it evenly,
     so they resize with the phone instead of sizing to their labels. */
  .chead-right .d-quick{flex:1;width:100%;grid-template-columns:repeat(3,1fr)}
  /* Zoom/Teams and Calendly: the text and email panes stack top and bottom
     on a phone instead of squeezing side by side (Ryan, Oct 21 2026). */
  .fill-grid{grid-template-columns:1fr !important;grid-template-rows:auto auto}
  .cal-grid{grid-template-columns:1fr !important}
  .ca-rows{grid-template-columns:1fr}
  .chead-actions{flex-direction:column}
  .ca-btns{flex-direction:row;order:0}
  /* The email box gets a full eight lines on mobile (Ryan, Oct 21 2026). */
  #vc-email,#cal-email{min-height:176px}
}
.chead-stack{display:inline-flex;flex-direction:column;gap:6px;align-items:stretch;margin-left:auto}
.chead-stack .d-tags{justify-content:center}
#c-conv-wrap{display:inline-flex;align-items:center;justify-content:center;gap:8px}
/* Fixed contact header + tab bar (Ryan, Oct 21 2026): the header card and
   the tab box stay pinned while everything below them scrolls. */
.chead-sticky{position:sticky;top:0;z-index:45;background:var(--bg);padding-bottom:2px}
/* Fill-the-screen workspaces (Ryan, Oct 21 2026): the Text and Zoom/Teams
   panels stretch to the viewport (height set by fitFillPanel in app.js) so
   nothing in them scrolls; Communication history scrolls as normal. */
.fill-card{display:flex;flex-direction:column}
.fill-card .comp-pane{display:flex;flex-direction:column;flex:1;min-height:0}
.cpanel-sec[data-sec="text"] #comp-text{flex:1;resize:none;min-height:140px;margin-bottom:0;padding-bottom:38px}
.cpanel-sec[data-sec="vc"] .fill-grid{flex:1;min-height:0}
.cpanel-sec[data-sec="vc"] .fill-grid>div{display:flex;flex-direction:column;min-height:0}
.cpanel-sec[data-sec="vc"] .fill-grid textarea{flex:1;resize:none;min-height:0}
.call-choice{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:6px}
.call-opt{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:16px 18px;font-size:16px;text-align:left}
.call-opt span{font-size:13px;font-weight:400;opacity:.75}
.d-ava{width:44px;height:44px;border-radius:14px;background:linear-gradient(135deg,var(--cyan),var(--pink));display:flex;align-items:center;justify-content:center;font-weight:800;font-size:16px;color:#020617;flex-shrink:0;cursor:pointer}
.chead .d-ava{width:104px;height:auto;align-self:stretch;border-radius:16px;font-size:26px;background-size:cover;background-position:center}
.d-name{font-family:'Montserrat';font-weight:700;font-size:22px}
.d-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:0}
.d-quick{display:grid;grid-template-columns:repeat(3,82px);grid-template-rows:repeat(2,54px);align-content:center;gap:6px}
.d-quick .qbtn{padding:8px 4px;font-size:12.5px;display:flex;align-items:center;justify-content:center;text-align:center;white-space:nowrap}
@media(max-width:900px){.chead{grid-template-columns:1fr}.d-quick{grid-template-columns:repeat(3,1fr)}}
.chead-right .d-quick{grid-template-columns:repeat(3,118px)}
.chead-right .d-quick .qbtn{font-size:15.5px;padding:8px 12px}
/* Narrow windows: box 1 has no slack to donate below ~1650px, so the buttons step back to their old width and box 1 keeps every pixel (header height never grows). */
@media(max-width:1650px){.chead-right .d-quick{grid-template-columns:repeat(3,94px)}.chead-right .d-quick .qbtn{padding:8px 2px}}
@media(max-width:900px){.chead-right .d-quick{grid-template-columns:repeat(3,1fr)}}
.qbtn{padding:10px 18px;border-radius:12px;border:1px solid var(--line);background:rgba(148,163,184,.08);color:var(--text);font-weight:600;cursor:pointer;font-size:14px}
.qbtn:hover{border-color:var(--cyan)}
.contact-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:20px;align-items:start}
.c-col{display:flex;flex-direction:column;gap:20px;min-width:0}
.info-row{display:flex;gap:12px;align-items:flex-start;padding:9px 0;border-bottom:1px solid rgba(148,163,184,.08);font-size:14px}
.info-row:last-child{border-bottom:none}
.info-ico{width:30px;height:30px;border-radius:9px;background:rgba(30,205,241,.1);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.info-row .lbl{color:var(--muted);font-size:12px;display:block}
.info-row .val{font-weight:600}
.mini-btn{background:rgba(34,211,238,.12);border:1px solid rgba(34,211,238,.35);color:var(--cyan,#22d3ee);border-radius:8px;padding:7px 12px;font-size:12.5px;font-weight:600;cursor:pointer;white-space:nowrap}
.mini-btn:hover{background:rgba(34,211,238,.22)}
.t1003-row{display:flex;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid rgba(148,163,184,.1)}
.t1003-row .fl{width:150px;flex:none;color:var(--muted);font-size:13px}
.t1003-row .inp{flex:1}
.t1003-note{background:rgba(34,211,238,.08);border:1px solid rgba(34,211,238,.25);border-radius:10px;padding:10px 14px;font-size:13px;margin-bottom:12px}
.t1003-warn{background:rgba(251,191,36,.08);border:1px solid rgba(251,191,36,.3);border-radius:10px;padding:10px 14px;font-size:13px;margin-bottom:12px}
.pipe-card{background:rgba(148,163,184,.06);border:1px solid var(--line);border-radius:14px;padding:14px}
.pipe-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;gap:8px;flex-wrap:wrap}
.pipe-name{font-weight:700}
.steps{display:flex;gap:5px;margin:12px 0 4px}
.step{flex:1;height:7px;border-radius:4px;background:rgba(148,163,184,.15)}
.step.done{background:var(--cyan)}
.step.now{background:var(--pink);box-shadow:0 0 10px rgba(255,122,251,.7)}
.step-lbls{display:flex;justify-content:space-between;font-size:10px;color:var(--muted2);margin-top:6px}
.pipe-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.note{background:rgba(251,164,1,.15);border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:10px}
.note .n-text{font-size:14px;line-height:1.5}
.note .n-meta{font-size:12px;color:var(--muted);margin-top:8px}
.note-add textarea{width:100%;background:rgba(148,163,184,.07);border:1px solid var(--line);border-radius:12px;color:var(--text);padding:10px 12px;font-family:inherit;font-size:14px;resize:vertical}
.note-add .btn-primary{margin-top:8px;width:100%}
.note-add-row{display:flex;gap:8px;margin-top:8px;align-items:stretch}
.note-add-row .btn-primary{flex:1;width:auto;margin-top:0}
.mic-btn{flex:0 0 auto;width:52px;border-radius:12px;border:1px solid var(--line);background:rgba(148,163,184,.07);color:var(--text);cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;justify-content:center}
.mic-btn svg{display:block}
.mic-btn:hover{border-color:rgba(251,164,1,.55)}
.mic-btn.rec{background:#dc2626;border-color:#dc2626;color:#fff;animation:micpulse 1.1s ease-in-out infinite}
@keyframes micpulse{0%,100%{box-shadow:0 0 0 0 rgba(220,38,38,.45)}50%{box-shadow:0 0 0 8px rgba(220,38,38,0)}}
.dict-note{font-size:12.5px;color:var(--muted);margin-top:6px;min-height:0}
.note .n-text{white-space:pre-wrap}
.d-log{position:relative}
.log-item{display:flex;gap:12px;padding:10px 0;border-bottom:1px solid rgba(148,163,184,.08)}
.log-item.log-in{margin-left:34px}
.grp-tag{color:#fba401;font-weight:600}
.l-with{margin-top:5px;font-size:12.5px;color:var(--muted)}
.l-with [data-contact]{color:var(--cyan);font-weight:600}
.l-with a{color:var(--cyan);font-weight:600;text-decoration:none}
.call-card.call-in{margin-left:34px}
/* Inbound entries also sit on a faint tint so direction reads at a glance
   (Ryan, Oct 21 2026). */
.log-item.log-in{background:rgba(30,205,241,.08);border-radius:12px;padding-left:14px;padding-right:14px;border-bottom-color:transparent}
/* Notes in the history sit on orange (Ryan, Oct 21 2026). */
.log-item.log-note{background:rgba(251,164,1,.15);border-radius:12px;padding-left:14px;padding-right:14px;border-bottom-color:transparent}
.call-card.call-in{background:rgba(30,205,241,.08)}
@media(max-width:820px){.log-item.log-in{margin-left:22px}.call-card.call-in{margin-left:22px}}
/* Breathing room in the history feed (Ryan, Oct 21 2026): space under the
   "Call & Communication History" heading before the first entry, a touch
   more air between entries, and space under the last entry. */
#c-log{padding-top:10px;padding-bottom:12px}
/* Same heading-to-first-item gap for Pipeline and Notes (Ryan, Oct 21 2026;
   15px measured to match the Communication History seam exactly). */
#c-pipe{padding-top:15px}
#c-notes{padding-top:15px}
.log-item{padding-top:12px;padding-bottom:12px;margin-bottom:8px}
.log-item:last-child{border-bottom:none}
.log-ico{width:34px;height:34px;border-radius:50%;background:rgba(30,205,241,.1);border:1px solid rgba(30,205,241,.25);display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0}
.log-item .l-title{font-weight:600;font-size:14px}
.log-item .l-meta{font-size:12px;color:var(--muted)}
.log-item .l-text{font-size:13px;color:var(--muted);margin-top:3px;line-height:1.45}
#screen-contacts tbody tr{cursor:pointer}
.kcard{cursor:pointer}
.nav-backdrop{position:fixed;inset:0;background:rgba(2,6,23,.6);opacity:0;pointer-events:none;transition:opacity .25s;z-index:65}
body.nav-open .nav-backdrop{opacity:1;pointer-events:auto}


/* ---------- Worksheet ---------- */
.ws-card{margin-top:20px}
.ws-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.ws-saved{font-size:13px;color:#22c55e}
.ws-sub{color:var(--muted);font-size:13px;margin:6px 0 16px}
.ws-sec{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--cyan);font-weight:700;margin:20px 0 10px}
.ws-sec:first-child{margin-top:0}
.ws-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.wsf{display:flex;flex-direction:column;gap:6px;font-size:13px}
.wsf span{color:var(--muted);font-weight:600}
.wsf input,.wsf select,.wsf textarea{background:rgba(148,163,184,.07);border:1px solid var(--line);border-radius:10px;color:var(--text);padding:10px 12px;font-family:inherit;font-size:14px;width:100%}
.wsf input:focus,.wsf select:focus,.wsf textarea:focus{outline:none;border-color:var(--cyan)}
.wsf-wide{grid-column:1/-1}
.ws-actions{margin-top:18px;display:flex;gap:10px;align-items:center}
.ws-reports{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.rbtn{display:flex;gap:12px;align-items:center;padding:16px;border-radius:14px;border:1px solid var(--line);background:rgba(148,163,184,.05);color:var(--text);cursor:pointer;text-align:left;font-family:inherit}
.rbtn:hover{border-color:var(--cyan);background:rgba(30,205,241,.06)}
.rbtn-ico{font-size:24px}
.rbtn b{display:block;font-size:15px}
.rbtn i{display:block;font-style:normal;font-size:12px;color:var(--muted);margin-top:2px}
.rbtn:disabled{opacity:.45;cursor:not-allowed}
@media(max-width:900px){.ws-grid{grid-template-columns:1fr 1fr}.ws-reports{grid-template-columns:1fr}}
@media(max-width:560px){.ws-grid{grid-template-columns:1fr}}

/* ---------- Report overlay + print ---------- */
#print-root{display:none}
.report-overlay{position:fixed;inset:0;z-index:80;background:rgba(2,6,23,.85);overflow-y:auto;padding:30px 18px}
.report-paper{max-width:820px;margin:0 auto;background:#fff;color:#111;border-radius:8px;padding:48px 52px;box-shadow:0 24px 80px rgba(0,0,0,.5)}
.report-bar{max-width:820px;margin:0 auto 14px;display:flex;gap:10px;justify-content:flex-end}
.report-bar button{padding:10px 20px;border-radius:10px;border:1px solid var(--line);background:var(--panel);color:var(--text);font-weight:600;cursor:pointer}
.report-bar .btn-primary{border:none}
.rp-head{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:3px solid #0b9ec2;padding-bottom:14px;margin-bottom:18px}
.rp-title{font-family:'Montserrat';font-weight:800;font-size:24px;color:#0b2a3a}
.rp-sub{color:#555;font-size:13px;margin-top:4px}
.rp-brand{text-align:right;font-size:12px;color:#333;line-height:1.5}
.rp-brand b{font-size:15px;color:#0b2a3a}
.rp-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:0;border:1px solid #ddd;margin-bottom:18px}
.rp-cell{padding:9px 12px;border-bottom:1px solid #eee;border-right:1px solid #eee;font-size:13px}
.rp-cell .k{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#777}
.rp-cell .v{font-weight:700;font-size:14px;color:#111}
.rp-h{font-family:'Montserrat';font-weight:700;font-size:15px;color:#0b2a3a;margin:20px 0 10px;text-transform:uppercase;letter-spacing:.05em}
.rp-table{width:100%;border-collapse:collapse;font-size:13px;margin-bottom:6px}
.rp-table td{padding:8px 10px;border-bottom:1px solid #eee}
.rp-table td:last-child{text-align:right;font-weight:700}
.rp-table tr.total td{font-size:15px;border-top:2px solid #0b9ec2;border-bottom:none;color:#0b2a3a}
.rp-conds{font-size:13px;line-height:1.6;color:#222}
.rp-conds li{margin-bottom:5px}
.rp-foot{margin-top:26px;padding-top:14px;border-top:1px solid #ddd;font-size:11px;color:#777;line-height:1.6}
.rp-letter p{font-size:14px;line-height:1.75;color:#222;margin:0 0 14px}
.rp-sig{margin-top:30px;font-size:14px;color:#111}
@media print{
  body > *:not(#print-root){display:none !important}
  #print-root{display:block !important}
  .report-overlay{position:static;background:none;padding:0;overflow:visible}
  .report-bar{display:none !important}
  .report-paper{box-shadow:none;border-radius:0;max-width:none;margin:0;padding:0}
  @page{margin:14mm}
}
body.light .wsf input,body.light .wsf select,body.light .wsf textarea{background:#fff}



/* ---------- Contact control panel ---------- */
.cpanel{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:20px;padding:14px 16px}
.cpbtn{display:flex;align-items:center;gap:8px;padding:11px 16px;border-radius:12px;border:1px solid var(--line);background:rgba(148,163,184,.06);color:var(--muted);font-weight:600;font-size:14px;cursor:pointer;font-family:inherit;transition:all .15s}
.cpbtn:hover{color:var(--text);border-color:var(--cyan)}
.cpbtn.active{color:var(--text);border-color:var(--cyan);background:rgba(30,205,241,.1);box-shadow:0 0 16px rgba(30,205,241,.25)}
.cp-ico{font-size:16px}
.cp-count{background:rgba(30,205,241,.18);color:var(--cyan);font-size:11px;font-weight:700;border-radius:20px;padding:2px 8px;min-width:22px;text-align:center}
.cpbtn.active .cp-count{background:var(--cyan);color:#02141a}
.cpanel-sec{display:none}
.cpanel-sec.active{display:block;animation:fade .25s ease}
/* Breathing room between the panel header and its content on the Call,
   Text, and Email workspaces (Ryan, Oct 21 2026: the h3 sat at a 0px gap
   directly on the first field). */
.cpanel-sec[data-sec="text"] .card>h3,.cpanel-sec[data-sec="email"] .card>h3,.cpanel-sec[data-sec="call"] .card>h3{margin-bottom:16px}
/* Text workspace chooser (Ryan, Oct 21 2026): three boxes like the Call
   panel's choices; each one opens its own step below the boxes. */
.txt-choice{grid-template-columns:1fr 1fr}
.txt-choice .call-opt{padding:8px 14px;font-size:15px;gap:2px}
.txt-choice .call-opt span{font-size:11.5px}
.txt-choice.picked{grid-template-columns:1fr}
#txt-back{position:sticky;top:0;z-index:6;background:var(--card);align-self:flex-start}
/* Text workspace breathing room: a looser vertical rhythm between the
   header, the options, and every box across the four text panes. */
.cpanel-sec[data-sec="text"] .card{padding:18px}
.cpanel-sec[data-sec="text"] .card>h3{margin-bottom:10px}
.cpanel-sec[data-sec="text"] .call-choice{gap:14px;margin-bottom:10px}
.cpanel-sec[data-sec="text"] textarea{margin-bottom:14px;padding:12px 14px}
.cpanel-sec[data-sec="text"] .qr-row{margin-bottom:10px}
.cpanel-sec[data-sec="text"] .qr-chip{padding:9px 14px}
.cpanel-sec[data-sec="text"] .grp-row{padding:10px}
.cpanel-sec[data-sec="text"] .tv-chosen{margin-bottom:14px}
@media (max-width:760px){.txt-choice{grid-template-columns:1fr}}
.cpanel-sec .txt-pane{display:none}
.cpanel-sec .txt-pane.on{display:flex;flex-direction:column;flex:1;min-height:0}
.tv-chosen{display:flex;align-items:center;gap:10px;margin-bottom:10px;font-weight:600;flex-wrap:wrap}
/* Video and Group message boxes fill their pane like the Send Text box
   does (Ryan, Oct 21 2026): the compose area flexes to the card height
   and the textarea takes all of it. */
#tv-compose{display:flex;flex-direction:column;flex:1;min-height:0}
#tg-compose,#gv-compose{display:flex;flex-direction:column;flex:1;min-height:0}
.cpanel-sec[data-sec="text"] #tv-text,.cpanel-sec[data-sec="text"] #tg-text,.cpanel-sec[data-sec="text"] #gv-text{flex:1;min-height:170px;resize:none}
.loan-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:13px 4px;border-bottom:1px solid rgba(148,163,184,.1)}
.loan-row:last-child{border-bottom:none}
.loan-main b{font-size:16px}
.loan-main .l-sub{font-size:13px;color:var(--muted);margin-top:2px}
.loan-status{font-size:12px;font-weight:700;padding:5px 12px;border-radius:20px;background:rgba(34,197,94,.14);color:#22c55e;white-space:nowrap}


/* ---------- Loan pipeline ---------- */
.pipe-tabs{display:flex;gap:8px}
.kcard-sub{font-size:12px;color:var(--muted);margin-top:6px}
.loan-status.st-closed{background:rgba(96,165,250,.16);color:#60a5fa}
.loan-status.st-dead{background:rgba(100,116,139,.16);color:#94a3b8}
.loan-status.st-active{background:rgba(34,197,94,.14);color:#22c55e}
.loan-status.st-pre{background:rgba(251,191,36,.16);color:#fbbf24}
.loan-row{border-left:3px solid transparent;padding-left:10px}
.loan-row:has(.st-closed){border-left-color:#60a5fa}
.loan-row:has(.st-pre){border-left-color:#fbbf24}
.loan-row:has(.st-active){border-left-color:#22c55e}
.table-tools select{background:rgba(148,163,184,.08);border:1px solid var(--line);border-radius:12px;padding:9px 14px;color:var(--text);font-size:13px;font-family:inherit;outline:none;cursor:pointer}
.table-tools select option{background:#0d1528}
body.light .table-tools select{background:#fff}
body.light .table-tools select option{background:#fff;color:#0f172a}


/* ---------- Contact header: headshot, assignment, temperature ---------- */
/* The chip row spans the full width of the name box (its own grid row under
   photo + name) so Temperature, Preferred, Priority, and AI Assist fit on
   one line instead of stacking and growing the header (Ryan, Oct 21 2026). */
.chead-meta{display:flex;flex-direction:column;align-items:flex-end;justify-content:flex-start;gap:6px;margin-top:0;margin-left:auto;min-width:0;flex:0 1 auto;max-width:46%}
/* Priority and AI Assist live back under the Assigned line (Ryan, Oct 21
   2026), beside the name instead of in the full-width chip row. */
.chead-subbtns{display:flex;align-items:center;gap:6px;margin-top:8px;flex-wrap:wrap}
.chead-subbtns .flag-btn{padding:0 8px}
.chead-subbtns .temp-chip{padding:0 6px}
/* The header temperature chip is a link to the Communication tab. */
#c-temp{cursor:pointer}
/* Days since last contact on the right side of the temperature chip
   (Ryan, Oct 21 2026): the number with "days" underneath it. The chip
   grows wider to fit, never taller. */
.temp-chip .tc-word{white-space:nowrap}
.temp-chip .tc-days{display:flex;flex-direction:column;align-items:center;line-height:1.02;margin-left:7px;padding-left:7px;border-left:1px solid rgba(128,128,128,.35)}
.temp-chip .tc-days b{font-size:17px;font-weight:800}
.temp-chip .tc-days small{font-size:9px;font-weight:600;letter-spacing:.4px}
/* Third segment of the temperature chip (Ryan, Oct 24 2026): the last
   contact's type over its direction, behind a second divider line.
   It replaced the header's last-message line, which Ryan removed for
   carrying too much info. */
.temp-chip .tc-last{display:flex;flex-direction:column;align-items:flex-start;line-height:1.02;margin-left:7px;padding-left:7px;border-left:1px solid rgba(128,128,128,.35)}
.temp-chip .tc-last b{font-size:13.5px;font-weight:700;white-space:nowrap}
.temp-chip .tc-last small{font-size:9px;font-weight:600;letter-spacing:.4px;white-space:nowrap}
.chead-subbtns .ai-chip{padding:0 6px}
.assign-chip{font-size:13px;color:var(--muted);background:rgba(148,163,184,.08);border:1px solid var(--line);border-radius:20px;padding:6px 14px}
.assign-chip b{color:var(--text)}
.temp-chip{font-size:13px;font-weight:700;border-radius:20px;padding:6px 14px;border:1px solid}
.temp-chip.t-hot{color:#fb7185;border-color:rgba(251,113,133,.4);background:rgba(251,113,133,.1)}
.temp-chip.t-warm{color:#fbbf24;border-color:rgba(251,191,36,.4);background:rgba(251,191,36,.1)}
.temp-chip.t-cold{color:#7dd3fc;border-color:rgba(125,211,252,.4);background:rgba(125,211,252,.1)}
#c-ava{position:relative;cursor:pointer;overflow:hidden}
#c-ava.has-photo{background-size:cover;background-position:center;color:transparent}
#c-ava::after{content:'📷';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:20px;background:rgba(2,6,23,.55);opacity:0;transition:opacity .15s}
#c-ava:hover::after{opacity:1}


/* ---------- Sortable table ---------- */
.data-table th[data-sort]{cursor:pointer;user-select:none;white-space:nowrap}
.data-table th[data-sort]:hover{color:var(--cyan)}
.data-table th .sarr{font-size:10px;color:var(--cyan);margin-left:4px}
.th-temp{background:rgba(30,205,241,.07);border-radius:8px}
.temp-chip.t-luke{color:#fde047;border-color:rgba(253,224,71,.4);background:rgba(253,224,71,.08)}
.temp-chip.t-frozen{color:#94a3b8;border-color:rgba(148,163,184,.4);background:rgba(148,163,184,.08)}
td .temp-chip{padding:4px 10px;font-size:12px}


/* ---------- Temperature grouping ---------- */
#temp-group-btn.active{border-color:#ed5e02;color:#fff;background:#ed5e02;box-shadow:0 0 12px rgba(251,164,1,.35)}
.tgroup td{background:rgba(30,205,241,.05);padding:10px 16px;border-top:1px solid var(--line)}
.tgroup .gcount{margin-left:10px;font-size:12px;color:var(--muted)}
.tgroup .attn{color:#fb7185;font-weight:700}


/* ---------- AI Assist ---------- */
.ai-chip{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;border-radius:20px;padding:6px 14px;border:1px solid var(--line);background:rgba(148,163,184,.06);color:var(--muted);cursor:pointer;font-family:inherit;transition:all .15s}
.ai-chip:hover{border-color:var(--cyan);color:var(--text)}
.ai-chip.on{border-color:var(--cyan);color:var(--cyan);background:rgba(30,205,241,.1);box-shadow:0 0 14px rgba(30,205,241,.3)}
.ai-card{border:1px solid rgba(30,205,241,.35);background:linear-gradient(135deg,rgba(30,205,241,.07),rgba(255,122,251,.05));margin-bottom:20px}
.ai-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.ai-badge{font-weight:800;font-size:15px;background:linear-gradient(135deg,var(--cyan),var(--pink));-webkit-background-clip:text;background-clip:text;color:transparent}
.ai-on{font-size:11px;font-weight:800;color:var(--cyan);border:1px solid var(--cyan);border-radius:12px;padding:3px 10px;letter-spacing:1px}
.ai-review,.ai-finding{font-size:13.5px;color:var(--muted);margin-bottom:8px;line-height:1.5}
.ai-review b,.ai-finding b{color:var(--text)}
.ai-msg{background:rgba(2,6,23,.5);border:1px solid var(--line);border-left:3px solid var(--cyan);border-radius:10px;padding:12px 16px;font-size:14.5px;margin:12px 0;font-style:italic}
.ai-msg-edit{width:100%;box-sizing:border-box;background:rgba(2,6,23,.5);border:1px solid var(--line);border-left:3px solid var(--cyan);border-radius:10px;padding:12px 16px;font-size:14.5px;margin:12px 0 4px;font-family:inherit;color:var(--text);resize:vertical}
body.light .ai-msg-edit{background:#f1f5f9}
.ai-draft-note{font-size:12.5px;color:var(--muted);margin:2px 0 6px}
.ai-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:6px}
.ai-auto{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);cursor:pointer}
.ai-auto input{accent-color:var(--cyan);width:16px;height:16px;cursor:pointer}
.ai-sent{font-size:13px;color:#22c55e;font-weight:600}
body.light .ai-msg{background:#f1f5f9}


/* ---------- Settings menu + temperature rules ---------- */
.temp-table{margin-top:14px}
.temp-table td{vertical-align:middle}
.temp-in{width:76px;background:rgba(148,163,184,.08);border:1px solid var(--line);border-radius:10px;padding:8px 10px;color:var(--text);font-size:14px;font-family:inherit;outline:none}
.temp-in:focus{border-color:var(--cyan)}
.temp-actions{display:flex;align-items:center;gap:14px;margin-top:18px;flex-wrap:wrap}

/* ---------- Login gate ---------- */
#login-view{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;background:radial-gradient(1200px 800px at 20% 10%,rgba(30,205,241,.14),transparent 60%),radial-gradient(1000px 700px at 85% 90%,rgba(255,122,251,.12),transparent 60%),#020617}
#login-view.hidden{display:none}
.login-card{width:min(400px,92vw);background:rgba(13,21,41,.92);border:1px solid rgba(148,163,184,.2);border-radius:20px;padding:34px 30px;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.login-logo{width:180px;max-width:70%;height:auto;display:block;margin:0 auto 22px}
.login-card .lbl{font-size:12px;color:var(--muted);margin-bottom:6px}
.login-card .inp{width:100%}
.pw-wrap{position:relative}
.pw-wrap .inp{padding-right:46px}
#pw-toggle{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:0;font-size:18px;cursor:pointer;opacity:.7}
#pw-toggle:hover{opacity:1}
.pw-toggle2{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:0;cursor:pointer;opacity:.85;color:var(--text)}
.pw-toggle2:hover{opacity:1}
#pw-toggle{color:var(--text)}
#uc-logout{color:var(--muted)}
#uc-logout:hover{color:var(--text)}
/* ---------- Documents vault ---------- */
.doc-upload{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:14px 0}
.doc-redact{background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.35);color:#4ade80;border-radius:12px;padding:10px 14px;font-size:13.5px;margin:12px 0}
.doc-text{background:rgba(2,6,23,.6);border:1px solid var(--line);border-radius:12px;padding:14px;max-height:260px;overflow:auto;white-space:pre-wrap;font-size:12.5px;line-height:1.6;color:var(--muted);font-family:ui-monospace,monospace}
.doc-actions{display:flex;gap:10px;margin-top:12px}
.doc-row{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:12px;background:rgba(148,163,184,.07);margin-bottom:8px}
.doc-row .grow{flex:1;min-width:0}
.doc-row .nm{font-weight:600;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.doc-row .sub{font-size:12px;color:var(--muted)}
/* ---------- Global search + notifications ---------- */
.search{position:relative}
.gs-results{position:absolute;top:calc(100% + 8px);left:0;right:0;min-width:320px;background:var(--card);border:1px solid rgba(148,163,184,.25);border-radius:14px;box-shadow:0 18px 50px rgba(0,0,0,.45);overflow:hidden;z-index:200}
.gs-group{font-size:11px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted);padding:10px 14px 4px}
.gs-item{display:flex;flex-direction:column;gap:1px;width:100%;text-align:left;background:none;border:0;padding:9px 14px;cursor:pointer;color:var(--text);font-family:inherit}
.gs-item:hover{background:rgba(30,205,241,.12)}
.gs-item b{font-size:14px}
.gs-item span{font-size:12px;color:var(--muted)}
.gs-none{padding:14px;color:var(--muted);font-size:13px;text-align:center}
.bell-wrap{position:relative}
.bell-panel{position:absolute;top:calc(100% + 10px);right:0;width:340px;max-height:420px;overflow:auto;background:var(--card);border:1px solid rgba(148,163,184,.25);border-radius:14px;box-shadow:0 18px 50px rgba(0,0,0,.45);z-index:200;padding:8px}
.bell-head{font-size:12px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted);padding:8px 10px 4px}
.bell-item{display:flex;gap:10px;align-items:flex-start;width:100%;text-align:left;background:none;border:0;border-radius:10px;padding:10px;cursor:pointer;color:var(--text);font-family:inherit}
.bell-item:hover{background:rgba(30,205,241,.1)}
.bell-item .bi{font-size:18px}
.bell-item b{font-size:13.5px;display:block}
.bell-item span{font-size:12px;color:var(--muted)}
/* ---------- Settings ---------- */
.set-layout{display:grid;grid-template-columns:240px 1fr;gap:18px;align-items:start}
.set-nav{padding:10px;display:flex;flex-direction:column;gap:2px;position:sticky;top:16px}
.set-nav button{background:none;border:0;text-align:left;padding:11px 14px;border-radius:10px;font-size:14px;color:var(--text);cursor:pointer;font-family:inherit}
.set-nav button:hover{background:rgba(148,163,184,.12)}
.set-nav button.active{background:linear-gradient(135deg,rgba(30,205,241,.18),rgba(255,122,251,.12));color:var(--text);font-weight:700}
.set-body{min-height:480px}
.set-sec h3{margin:0 0 4px;font-size:18px}
.set-desc{color:var(--muted);font-size:13.5px;margin:0 0 18px;line-height:1.55;max-width:760px}
.set-row{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:12px;background:rgba(148,163,184,.07);margin-bottom:8px}
.set-row .grow{flex:1;min-width:0}
.set-row .nm{font-weight:600;font-size:14px}
.set-row .sub{font-size:12px;color:var(--muted)}
.dot{width:14px;height:14px;border-radius:50%;flex:none}
.icon-btn.sm{width:28px;height:28px;font-size:13px;padding:0}
.set-add{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.inp,.sel{background:var(--card);border:1px solid rgba(148,163,184,.25);color:var(--text);border-radius:10px;padding:11px 13px;font-size:14px;font-family:inherit}
.inp:focus,.sel:focus{outline:2px solid var(--cyan);border-color:transparent}
input[type=color].clr{width:40px;height:38px;padding:2px;border:1px solid rgba(148,163,184,.25);border-radius:10px;background:var(--card);cursor:pointer}
.mv-btn{background:rgba(148,163,184,.14);border:0;color:var(--text);border-radius:8px;width:28px;height:28px;cursor:pointer;font-size:14px}
.mv-btn:hover{background:rgba(30,205,241,.25)}
.pipe-sel{display:flex;gap:8px;margin-bottom:16px}
.notif-grid{display:grid;grid-template-columns:1fr auto auto auto;gap:0;align-items:center}
.notif-grid .nh{font-size:11px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted);padding:8px 12px}
.notif-grid .nr{padding:10px 12px;border-top:1px solid rgba(148,163,184,.12);font-size:14px}
.notif-grid .nc{text-align:center;border-top:1px solid rgba(148,163,184,.12);padding:10px}
.switch{position:relative;display:inline-block;width:40px;height:22px;flex:none}
.switch input{position:absolute;inset:0;width:100%;height:100%;opacity:0;margin:0;cursor:pointer;z-index:2}
.switch .sl{position:absolute;inset:0;background:rgba(148,163,184,.3);border-radius:20px;cursor:pointer;transition:.2s}
.switch .sl:before{content:'';position:absolute;width:16px;height:16px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s}
.switch input:checked + .sl{background:var(--cyan)}
.switch input:checked + .sl:before{transform:translateX(18px)}
.cf-val{width:100%}
/* ---------- Composer ---------- */
.composer{border:1px solid rgba(148,163,184,.2);border-radius:14px;padding:14px;margin-bottom:18px;background:rgba(148,163,184,.05)}
.comp-tabs{display:flex;gap:8px;margin-bottom:12px}
.comp-pane textarea,.cpanel-sec[data-sec="text"] .txt-pane textarea,.comp-pane .inp{width:100%;box-sizing:border-box;margin-bottom:10px;background:var(--card)}
.comp-pane textarea,.cpanel-sec[data-sec="text"] .txt-pane textarea{color:var(--text);font-family:inherit;font-size:14px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;resize:vertical}
.comp-foot{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.comp-email-flex{display:flex;gap:14px;align-items:flex-start}
.comp-email-main{flex:1;min-width:0}
#comp-alert-side{flex:none;width:290px;border:1px solid var(--line);border-radius:10px;padding:12px;background:rgba(30,205,241,.05)}
#comp-alert-text{width:100%;box-sizing:border-box;margin-bottom:6px}
@media(max-width:900px){.comp-email-flex{flex-direction:column}#comp-alert-side{width:auto;align-self:stretch}}
.qr-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.qr-chip{background:rgba(30,205,241,.12);border:1px solid rgba(30,205,241,.3);color:var(--text);border-radius:20px;padding:7px 13px;font-size:12.5px;cursor:pointer}
.qr-chip:hover{background:rgba(30,205,241,.25)}
@media(max-width:900px){.set-layout{grid-template-columns:1fr}.set-nav{position:static;flex-direction:row;overflow-x:auto}}
/* ---------- Closing calendar (list view) ---------- */
.close-head{display:flex;align-items:center;gap:14px;margin-bottom:16px}
.close-head .icon-btn{font-size:22px;width:38px;height:38px}
.close-title h2{margin:0;font-size:22px}
.cc-ytd h3{margin:0 0 12px;font-size:15px}
.ytd-top{display:flex;gap:28px;margin-bottom:14px}
.ytd-table td:nth-child(2),.ytd-table td:nth-child(3),.ytd-table th:nth-child(2),.ytd-table th:nth-child(3){text-align:right}
.ytd-table td:nth-child(3){font-weight:700;color:var(--cyan)}
.cc-comm h3{margin:0 0 12px;font-size:15px}
.cc-comm td:nth-child(4),.cc-comm td:nth-child(5),.cc-comm th:nth-child(4),.cc-comm th:nth-child(5){text-align:right}
.cc-comm td:nth-child(5){font-weight:700;color:#22c55e}
.cc-comm tr.total td{border-top:2px solid var(--line);font-weight:800}
.cc-summary{display:flex;align-items:center;gap:26px;flex-wrap:wrap;margin-bottom:18px;padding:16px 20px}
.cc-lo{margin-bottom:18px}
.cc-lo-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;flex-wrap:wrap;gap:8px}
.cc-lo-head h4{margin:0;font-size:15px;letter-spacing:1px}
.cc-lo-sub{font-size:13px;color:var(--muted)}
.cc-lo-sub b{color:var(--text)}
tr.row-closed td{color:var(--muted)}
tr.row-closed .actual-cell{color:#22c55e;font-weight:700}
tr.row-sched .actual-cell{color:var(--muted)}
.cc-empty{color:var(--muted);text-align:center;padding:36px;font-size:14px}
.cal-stat{display:flex;flex-direction:column;gap:2px}
.cs-label{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.8px}
.cs-val{font-size:20px;font-weight:800}
.cal-prog-wrap{display:flex;align-items:center;gap:12px;flex:1;min-width:220px}
.cal-progress{flex:1;height:12px;border-radius:8px;background:rgba(148,163,184,.15);overflow:hidden}
.cal-progress-bar{height:100%;width:0;border-radius:8px;background:linear-gradient(90deg,var(--cyan),#22c55e);transition:width .4s ease}
/* ---------- Loan modal ---------- */
.modal-overlay{position:fixed;inset:0;background:rgba(2,6,23,.7);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:300;padding:20px;opacity:0;visibility:hidden;transition:opacity .35s ease,visibility .35s}
.modal-overlay.open{opacity:1;visibility:visible}
.modal-overlay .modal{transform:translateY(12px) scale(.98);transition:transform .35s ease}
.modal-overlay.open .modal{transform:none}
.modal{width:480px;max-width:100%;max-height:90vh;overflow:auto}
.m-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.m-head h3{margin:0}
.lm-row{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid rgba(148,163,184,.1);font-size:14px}
.lm-row span{color:var(--muted)}
.lm-field{margin:14px 0}
.lm-field label{display:block;font-size:13px;font-weight:600;margin-bottom:6px}
.lm-field input[type="date"]{width:100%;background:rgba(148,163,184,.08);border:1px solid var(--line);border-radius:10px;padding:10px 12px;color:var(--text);font-family:inherit;font-size:14px;outline:none;color-scheme:dark}
.lm-field input[type="date"]:focus{border-color:var(--cyan)}
.lm-actions{display:flex;gap:10px;margin-top:18px}
.loan-row[data-loan]{cursor:pointer}
.loan-row[data-loan]:hover .loan-main b{color:var(--cyan)}
.kcard-cal{background:none;border:none;cursor:pointer;font-size:14px;opacity:.55;padding:2px 4px;border-radius:6px}
.kcard-cal:hover{opacity:1;background:rgba(30,205,241,.12)}
body.light .cal-day{background:rgba(255,255,255,.75)}
body.light .lm-field input[type="date"]{background:#fff;color-scheme:light}
body.light .modal-overlay{background:rgba(15,23,42,.5)}

/* ---------- Clickable contacts ---------- */
[data-contact]{cursor:pointer}
.convo-name[data-contact]:hover{color:var(--cyan)}
#thread-head .who[data-contact]:hover{color:var(--cyan)}
.oh-name[data-contact]:hover{color:var(--cyan);text-decoration:underline}
.feed-item [data-contact]:hover,.task [data-contact]:hover{color:var(--cyan);text-decoration:underline}
#screen-contacts tbody tr:hover td{color:var(--cyan)}

/* ---------- Light theme ---------- */
body.light{
  color-scheme:light;
  --bg:#edf1f7; --panel:#ffffff; --panel2:#f5f8fc; --line:rgba(15,23,42,.12);
  --cyan:#0b9ec2; --pink:#d63fd6;
  --text:#0f172a; --muted:#475569; --muted2:#94a3b8;
  --card:#ffffff;
}
body.light .bg-glow{opacity:.35}
body.light .sidebar{background:rgba(255,255,255,.94)}
body.light .card{background:linear-gradient(165deg,#ffffff,#f2f6fb);box-shadow:0 8px 26px rgba(15,23,42,.08)}
body.light .kpi{background:linear-gradient(160deg,#ffffff,#f2f6fb);box-shadow:0 8px 22px rgba(15,23,42,.07)}
body.light .platform{background:linear-gradient(165deg,#ffffff,#f2f6fb);box-shadow:0 6px 18px rgba(15,23,42,.06)}
body.light .kcol{background:rgba(255,255,255,.75)}
body.light .kcard{background:linear-gradient(165deg,#ffffff,#eef3f9)}
body.light .oh-card{background:linear-gradient(165deg,#ffffff,#f2f6fb)}
body.light .msg.them .msg-bubble{background:rgba(15,23,42,.07)}
body.light .nav-item:hover{background:rgba(11,158,194,.08)}
body.light .nav-item.active{background:linear-gradient(90deg,rgba(11,158,194,.14),rgba(214,63,214,.1))}
body.light .search input,body.light .inbox-search input,body.light .thread-reply input,body.light .table-tools input{background:#fff}
body.light .data-table tr:hover td{background:rgba(11,158,194,.05)}
body.light .convo.active{background:rgba(11,158,194,.09)}
body.light .funnel-bar{background:rgba(15,23,42,.08)}
body.light .icon-btn{background:#fff}
body.light .qbtn{background:#fff}
body.light .muse-teaser{background:linear-gradient(165deg,rgba(214,63,214,.08),#ffffff)}
.btn-xs{font-size:11px;padding:5px 10px;border-radius:8px;margin-left:8px;vertical-align:middle}
.scen-btns{display:flex;gap:6px;flex-wrap:wrap}
.scen-btn{flex:1;min-width:52px;padding:10px 4px;border-radius:10px;border:1px solid rgba(30,205,241,.35);background:rgba(30,205,241,.08);color:var(--cyan);font-weight:700;font-size:13px;cursor:pointer}
.scen-btn:hover{background:rgba(30,205,241,.18)}
.rp-2col{display:grid;grid-template-columns:1fr 1fr;gap:0 28px;margin-bottom:4px}
.rp-sens th{padding:8px 10px;text-align:left;font-size:12px;color:#666;border-bottom:2px solid #ddd;background:#f7f7f7}
.rp-sens td{text-align:left;font-weight:400}
.rp-sens tr.hl td{background:#f0f9ff;font-weight:700}
.rp-sens tr.total td{font-weight:800;border-top:2px solid #333}
.rp-p{font-size:13px;line-height:1.55;margin:0 0 10px;color:#333}
@media(max-width:640px){.rp-2col{grid-template-columns:1fr}}

.calc-top{display:flex;gap:12px;align-items:center;margin-bottom:16px;flex-wrap:wrap}
.calc-search-wrap{position:relative;flex:1;min-width:260px;max-width:480px}
#calc-contact-search{width:100%;padding:12px 16px;border-radius:12px;border:1px solid rgba(30,205,241,.3);background:rgba(255,255,255,.06);color:inherit;font-size:14px}
.calc-results{position:absolute;top:100%;left:0;right:0;background:var(--card);border:1px solid rgba(30,205,241,.3);border-radius:12px;margin-top:6px;z-index:50;display:none;overflow:hidden;box-shadow:0 12px 32px rgba(0,0,0,.35)}
.calc-hit{padding:11px 16px;cursor:pointer;font-size:14px}
.calc-hit:hover{background:rgba(30,205,241,.12)}
.calc-hit.none{color:var(--muted);cursor:default}
.calc-chip{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:rgba(30,205,241,.12);border:1px solid rgba(30,205,241,.4);font-size:14px;cursor:pointer}
.calc-chip-x{opacity:.6;font-size:12px}
.calc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin-bottom:18px}
.calc-btn{display:flex;gap:12px;align-items:center;text-align:left;padding:16px;border-radius:14px;border:1px solid rgba(30,205,241,.25);background:rgba(255,255,255,.04);cursor:pointer;color:inherit}
.calc-btn:hover{border-color:rgba(30,205,241,.6);background:rgba(30,205,241,.08)}
.calc-btn.open{border-color:var(--cyan);background:rgba(30,205,241,.14)}
.calc-btn-ico{font-size:26px}
.calc-btn-txt{min-width:0}
.calc-btn-txt b{display:block;font-size:14px;line-height:1.3}
.calc-btn-txt i{display:block;font-style:normal;font-size:12px;opacity:.65;margin-top:3px;line-height:1.35}
.calc-panel{margin-top:6px}
.calc-panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.calc-panel-head h3{margin:0;font-size:17px}
.calc-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin-bottom:14px}
.calc-kpi{background:rgba(30,205,241,.07);border:1px solid rgba(30,205,241,.22);border-radius:12px;padding:12px 14px}
.calc-kpi span{display:block;font-size:11px;opacity:.65;margin-bottom:4px}
.calc-kpi b{font-size:19px}
.calc-kpi i{display:block;font-style:normal;font-size:11px;opacity:.6;margin-top:2px}
.calc-alert{background:rgba(255,180,0,.1);border:1px solid rgba(255,180,0,.4);border-radius:12px;padding:12px 16px;font-size:14px}
.calc-alert p{margin:4px 0}

/* ---------- Calculator form (dressed up) ---------- */
.calc-form{background:linear-gradient(135deg,rgba(30,205,241,.06),rgba(30,205,241,.02));border:1px solid rgba(30,205,241,.18);border-radius:16px;padding:20px;margin-bottom:6px}
.calc-form-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:900px){.calc-form-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.calc-form-grid{grid-template-columns:1fr}}
.cf-field{display:flex;flex-direction:column;gap:7px;min-width:0}
.cf-field>span{font-size:12px;font-weight:700;letter-spacing:.02em;color:var(--muted);text-transform:uppercase}
.cf-field>span em{font-style:normal;text-transform:none;font-weight:400;opacity:.7}
.cf-input{position:relative}
.cf-input input,.cf-input select{width:100%;background:rgba(10,18,32,.55);border:1.5px solid rgba(148,163,184,.25);border-radius:12px;color:var(--text);padding:13px 14px;font-family:inherit;font-size:16px;font-weight:600;transition:border-color .15s,box-shadow .15s,background .15s}
.cf-input input::placeholder{color:rgba(148,163,184,.4);font-weight:400}
.cf-input input:hover,.cf-input select:hover{border-color:rgba(30,205,241,.45)}
.cf-input input:focus,.cf-input select:focus{outline:none;border-color:var(--cyan);box-shadow:0 0 0 3px rgba(30,205,241,.18);background:rgba(10,18,32,.8)}
.cf-input.has-prefix input{padding-left:34px}
.cf-input.has-suffix input{padding-right:40px}
.cf-adorn{position:absolute;top:50%;transform:translateY(-50%);font-size:15px;font-weight:700;color:var(--cyan);pointer-events:none;opacity:.85}
.cf-adorn.prefix{left:13px}
.cf-adorn.suffix{right:13px}
.cf-field.filled .cf-input input{border-color:rgba(30,205,241,.55);background:rgba(30,205,241,.07)}
.cf-field.filled>span:first-child::after{content:" • auto";color:var(--cyan);font-weight:700;text-transform:none;letter-spacing:0}
/* Light mode: the form fields above carry the dark theme's navy glass
   background (rgba(10,18,32,.55)), which reads as solid gray boxes on the
   white light-mode cards (Ryan, Oct 17 2026, loan record page). Give the
   light theme its own field surface; the calculators share these fields. */
body.light .cf-input input,body.light .cf-input select{background:rgba(255,255,255,.92);border-color:rgba(15,40,70,.22)}
body.light .cf-input input:focus,body.light .cf-input select:focus{background:#fff}
body.light .cf-input input::placeholder{color:rgba(71,85,105,.45)}
.cf-actions{display:flex;gap:12px;margin-top:18px;align-items:center}
.btn-calc{background:linear-gradient(135deg,#1ecdf1,#0ea5c9);border:none;color:#04121c;font-weight:800;font-size:15px;padding:14px 34px;border-radius:12px;cursor:pointer;letter-spacing:.02em;box-shadow:0 4px 18px rgba(30,205,241,.35);transition:transform .12s,box-shadow .12s}
.btn-calc:hover{transform:translateY(-1px);box-shadow:0 6px 24px rgba(30,205,241,.45)}
.btn-calc:active{transform:translateY(0)}
.calc-panel-head h3{display:flex;align-items:center;gap:10px}
.calc-ico-badge{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,rgba(30,205,241,.25),rgba(30,205,241,.08));border:1px solid rgba(30,205,241,.4);font-size:22px}
.calc-subgrid{grid-column:1/-1;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;padding:4px 0 4px 18px;border-left:2px solid rgba(30,205,241,.35);margin-left:8px}
.calc-chev{margin-left:auto;font-size:16px;color:var(--cyan);flex-shrink:0}
.calc-group{grid-column:1/-1}
.calc-loan-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:10px;margin-bottom:26px}
.calc-loan-lbl{font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.calc-loan-chip{padding:9px 16px;border-radius:999px;border:1.5px solid rgba(148,163,184,.3);background:rgba(148,163,184,.06);color:var(--text);font-family:inherit;font-size:13px;font-weight:600;cursor:pointer;transition:all .15s}
.calc-loan-chip:hover{border-color:var(--cyan)}
.calc-loan-chip.sel{border-color:var(--cyan);background:rgba(30,205,241,.14);box-shadow:0 0 0 3px rgba(30,205,241,.12)}
.calc-loan-lbl{font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:8px}
.calc-loan-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.calc-loan-card{text-align:left;padding:18px 20px;border-radius:14px;border:1.5px solid rgba(148,163,184,.25);background:rgba(148,163,184,.05);color:var(--text);font-family:inherit;cursor:pointer;transition:all .15s}
.calc-loan-card:hover{border-color:rgba(30,205,241,.5)}
.calc-loan-card.sel{border-color:var(--cyan);background:rgba(30,205,241,.08);box-shadow:0 0 0 3px rgba(30,205,241,.12)}
.clc-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.clc-top b{font-size:19px}
.clc-check{color:var(--cyan);font-weight:800;font-size:16px;min-width:20px;text-align:right}
.clc-rows{display:grid;grid-template-columns:1fr 1fr;gap:5px 10px}
.clc-rows span{font-size:13px;font-weight:600}
.clc-rows i{display:block;font-style:normal;font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.deal-team{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.deal-chip{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 16px;border-radius:12px;border:1px solid var(--line);background:rgba(148,163,184,.06);color:var(--text);font-family:inherit;cursor:pointer;transition:all .15s;min-width:110px}
.deal-chip:hover{border-color:var(--cyan);background:rgba(30,205,241,.07)}
.dc-name{font-size:13px;font-weight:700;white-space:nowrap}
.dc-title{font-size:10px;font-weight:700;color:var(--cyan);text-transform:uppercase;letter-spacing:.05em}
.deal-chip.primary{border:2px solid var(--cyan);background:rgba(30,205,241,.12);box-shadow:0 0 14px rgba(30,205,241,.35)}
.deal-chip.primary .dc-title{color:var(--cyan)}
.log-item.log-primary{border-left:3px solid var(--cyan);background:rgba(30,205,241,.05)}
.deal-wrap{position:relative;display:inline-block}
.deal-x{position:absolute;top:-8px;right:-8px;width:22px;height:22px;border-radius:50%;border:1px solid var(--line);background:#1a2340;color:var(--muted);font-size:11px;cursor:pointer;line-height:1;padding:0}
.deal-x:hover{color:#ff6b6b;border-color:#ff6b6b}
/* Light mode: the remove badge above hardcoded a dark navy disc, so on the
   white light-mode header it read as a gray blob with a gray x on it
   (Ryan, Oct 17 2026). */
body.light .deal-x{background:#ffffff;border-color:rgba(15,40,70,.28);color:#526179}
body.light .deal-x:hover{color:#e5484d;border-color:#e5484d}
.deal-chip.dashed{border-style:dashed;opacity:.65}
.deal-chip.dashed:hover{opacity:1}
.picker-hit{display:flex;justify-content:space-between;align-items:center;width:100%;padding:11px 14px;border-radius:10px;border:1px solid var(--line);background:rgba(148,163,184,.05);color:var(--text);font-family:inherit;cursor:pointer;margin-bottom:6px;text-align:left}
.picker-hit:hover{border-color:var(--cyan);background:rgba(30,205,241,.07)}
.picker-hit span{font-size:11px;color:var(--muted)}

/* ---------- Print / PDF worksheets ---------- */
#print-sheet{display:none}
@media print{
  body{background:#fff !important}
  body > *:not(#print-sheet){display:none !important}
  #print-sheet{display:block !important;position:static;width:100%;background:#fff;color:#111;font-family:Montserrat,Arial,sans-serif;padding:24px}
  .ps-head{border-bottom:3px solid #1e293b;padding-bottom:12px;margin-bottom:16px}
  .ps-brand{font-size:22px;font-weight:800;color:#0f172a;letter-spacing:.02em}
  .ps-title{font-size:15px;font-weight:600;color:#334155;margin-top:4px}
  .ps-date{font-size:12px;color:#64748b;margin-top:2px}
  .ps-meta{display:flex;gap:28px;font-size:13px;color:#334155;margin-bottom:18px;flex-wrap:wrap}
  .ps-h{font-size:14px;font-weight:700;color:#0f172a;text-transform:uppercase;letter-spacing:.05em;margin:18px 0 8px}
  .ps-table{width:100%;border-collapse:collapse;font-size:13px;margin-bottom:8px}
  .ps-table td{border:1px solid #cbd5e1;padding:7px 10px}
  .ps-table td:first-child{color:#475569;width:55%}
  .ps-foot{margin-top:26px;padding-top:10px;border-top:1px solid #cbd5e1;font-size:11px;color:#64748b}
  /* lighten calculator result components for print */
  #print-sheet .calc-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0 0 14px}
  #print-sheet .calc-kpi{background:#f1f5f9 !important;border:1px solid #cbd5e1;border-radius:10px;padding:12px}
  #print-sheet .calc-kpi span{font-size:11px;color:#475569}
  #print-sheet .calc-kpi b{font-size:17px;color:#0f172a}
  #print-sheet .calc-kpi i{font-size:11px;color:#64748b}
  #print-sheet .rp-table{width:100%;border-collapse:collapse;font-size:13px;margin:10px 0}
  #print-sheet .rp-table td{border:1px solid #cbd5e1;padding:7px 10px;color:#111}
  #print-sheet .rp-p{font-size:12px;color:#334155}
  #print-sheet .muted-sm{font-size:11px;color:#64748b}
  #print-sheet .calc-alert{background:#fef3c7;border:1px solid #f59e0b;border-radius:8px;padding:10px;font-size:13px}
}

/* Marketing — Google Reviews */
.mkt-summary{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.gr-score-wrap{display:flex;align-items:center;gap:18px}
.gr-score{font-size:44px;font-weight:800;font-family:Montserrat,sans-serif}
.mkt-stars{font-size:20px;letter-spacing:2px;margin-bottom:4px}
.mkt-star{color:#3a4356}
.mkt-star.on{color:#fbbc04}
.mkt-reviews{display:flex;flex-direction:column;gap:14px}
.mkt-review{border:1px solid var(--line);border-radius:12px;padding:16px}
.mkt-review-head{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.mkt-avatar{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#1ecdf1,#9f7aea);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;color:#fff;flex:none}
.mkt-review-name{font-weight:700}
.mkt-review-meta .mkt-stars{font-size:14px;margin:0;display:inline}
.mkt-review-meta .mkt-star{font-size:14px}
.mkt-review-text{font-size:14px;line-height:1.55;color:var(--text)}

/* Open House campaign */
.oh-week-list{display:flex;flex-direction:column;gap:10px}
.oh-stats{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.oh-top{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;flex-wrap:wrap}
.oh-sidebox{border:1px solid var(--line);border-radius:12px;padding:10px;background:rgba(251,164,1,.05)}
.oh-stat{background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:12px 18px;min-width:110px;text-align:center}
.oh-stat-v{font-size:26px;font-weight:800;font-family:Montserrat,sans-serif}
.oh-stat-l{font-size:12px;color:var(--muted);margin-top:2px}
.oh-table{border:1px solid var(--line);border-radius:12px;overflow:hidden}
.oh-row{display:grid;grid-template-columns:1fr 76px 72px 84px 64px 64px;align-items:center;gap:8px;padding:10px 14px;border-top:1px solid var(--line)}
.oh-row:first-child{border-top:none}
.oh-head-row{background:var(--panel2);padding:8px 14px}
.oh-col-h{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);text-align:center}
.oh-who .nm{font-weight:700}
.oh-who .sub{font-size:12px}
.oh-row.dim .oh-who{opacity:.65}
.oh-cell{width:40px;height:40px;margin:0 auto;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--muted);font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0}
.oh-cell.static{cursor:default}
.oh-cell.on{background:rgba(34,197,94,.15);border-color:#22c55e;color:#22c55e;font-weight:700}
.imp-banner{position:sticky;top:0;z-index:200;background:linear-gradient(90deg,#7c3aed,#d63fd6);color:#fff;text-align:center;padding:9px 14px;font-size:13px;font-weight:500;display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap}
.imp-stop{background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.5);color:#fff;border-radius:999px;padding:6px 16px;font-size:12.5px;font-weight:700;cursor:pointer}
.imp-stop:hover{background:rgba(255,255,255,.32)}
body.light .imp-banner{color:#fff}
body.light .oh-cell.on{color:#15803d;background:rgba(34,197,94,.22)}
.oh-div{padding:8px 14px;font-size:12px;font-weight:700;color:var(--muted);background:var(--panel2);border-top:1px solid var(--line)}
.btn-sm{padding:8px 14px;font-size:13px}

/* ---- Referrals ---- */
.ref-row{margin-bottom:12px}
.ref-row-top{display:flex;justify-content:space-between;font-size:14px;margin-bottom:5px}
.ref-row-top b{color:var(--cyan)}
.ref-bar{height:8px;background:var(--panel2);border-radius:4px;overflow:hidden}
.ref-bar-fill{height:100%;background:linear-gradient(90deg,var(--cyan),#7dd3fc);border-radius:4px;transition:width .4s}
.ref-bars{display:flex;align-items:flex-end;gap:8px;padding:12px 4px 0;min-height:170px}
.ref-mcol{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:4px;min-width:0}
.ref-mbar{width:100%;max-width:44px;background:linear-gradient(180deg,var(--cyan),rgba(34,211,238,.25));border-radius:4px 4px 0 0}
.ref-mlab{font-size:11px;color:var(--muted)}
.ref-mnum{font-size:12px;font-weight:700;color:var(--text)}
.kpis-5{grid-template-columns:repeat(5,1fr)}
.bmp-pill{border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:999px;padding:5px 14px;font-size:12px;cursor:pointer;white-space:nowrap}
.bmp-pill.on{border-color:rgba(34,197,94,.55);color:#22c55e;background:rgba(34,197,94,.12);font-weight:700}
.pref-check{width:16px;height:16px;accent-color:#f5b301;cursor:pointer;vertical-align:middle}
.prio-check{width:16px;height:16px;accent-color:#ff5e7a;cursor:pointer;vertical-align:middle}
.pref-star{color:#f5b301;font-size:14px}
.kpis-6{grid-template-columns:repeat(6,1fr)}
@media(max-width:1200px){.kpis-6{grid-template-columns:repeat(3,1fr)}}
@media(max-width:820px){.kpis-6{grid-template-columns:1fr 1fr}}
@media(max-width:1200px){.kpis-5{grid-template-columns:repeat(3,1fr)}}
@media(max-width:820px){.kpis-5{grid-template-columns:1fr 1fr}}

/* quick settings gear (jumps to the matching Settings section) */
.gear-btn{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:1px solid var(--line);border-radius:8px;background:none;color:var(--muted);cursor:pointer;flex-shrink:0}
.gear-btn:hover{color:var(--cyan);border-color:var(--cyan)}
.avatar.has-photo,.mini-avatar.has-photo{background-size:cover;background-position:center;color:transparent}

/* profile photo editor */
#pe-stage{position:relative;width:280px;height:280px;margin:6px auto 0;overflow:hidden;background:rgba(148,163,184,.08);border-radius:12px;touch-action:none;cursor:grab}
#pe-stage:active{cursor:grabbing}
#pe-img{position:absolute;left:0;top:0;max-width:none;user-select:none;-webkit-user-drag:none;pointer-events:none}
#pe-ring{position:absolute;inset:0;border-radius:50%;box-shadow:0 0 0 999px rgba(2,6,23,.55);border:2px solid rgba(255,255,255,.75);pointer-events:none}
.inp:disabled{opacity:.55;cursor:default}
#l-commission-row{display:flex;justify-content:space-between;align-items:center;gap:14px;border-top:1px solid var(--line);margin-top:14px;padding-top:12px}
.l-comm-lbl{font-weight:700;font-size:14px}
.l-comm-sub{color:var(--muted);font-size:12px}
.l-comm-amt{font-size:20px;font-weight:800;color:#fba401;white-space:nowrap}
.calc-step{margin-bottom:16px}
.calc-step-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.calc-step-head h3{margin:0}
.calc-step-num{width:26px;height:26px;border-radius:50%;background:#fba401;color:#241a02;font-weight:800;font-size:14px;display:inline-flex;align-items:center;justify-content:center;flex:none}
#calc-step2.locked .calc-grid{opacity:.4;pointer-events:none}
#calc-step1-summary{display:inline-flex;align-items:center;gap:8px;margin-left:6px}

/* Site legal footer (app shell + login) */
.site-legal{margin-top:36px;border-top:1px solid var(--line);padding:16px 4px 8px;color:var(--muted2);font-size:12px;display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;justify-content:space-between}
.site-legal nav{display:flex;gap:16px;flex-wrap:wrap}
.site-legal a{color:var(--muted);text-decoration:none}
.site-legal a:hover{color:var(--cyan);text-decoration:underline}
.site-legal a:visited{color:var(--muted)}
#login-view .login-legal{position:absolute;left:0;right:0;bottom:16px;text-align:center;color:var(--muted2);font-size:12px;line-height:1.9;padding:0 16px}
#login-view .login-legal a{color:var(--muted);text-decoration:none;margin:0 9px;white-space:nowrap}
#login-view .login-legal a:hover{color:var(--cyan);text-decoration:underline}
#login-view .login-legal a:visited{color:var(--muted)}

/* Brief monster alert (per Ryan 2026-10-14): pure slide up on a new brief,
   slide down on exit. Seated sunk so the claws tuck at the bottom edge. */
#monster-wrap{position:fixed;right:26px;bottom:0;width:232px;z-index:60;transform:translateY(115%);transition:transform .85s cubic-bezier(.25,1,.35,1);pointer-events:none}
#monster-wrap.show{transform:translateY(38px);pointer-events:auto}
#monster-wrap.leaving{transform:translateY(115%);transition:transform .8s cubic-bezier(.5,0,.75,0)}
#monster-btn{display:block;width:100%;background:none;border:none;cursor:pointer;padding:0}
#monster-btn img{width:100%;height:auto;display:block;filter:drop-shadow(0 -6px 18px rgba(0,0,0,.45));animation:monster-bob 4.5s ease-in-out 1.2s infinite alternate}
@keyframes monster-bob{from{transform:translateY(0)}to{transform:translateY(-5px)}}
#monster-x{position:absolute;top:-14px;right:2px;z-index:3;width:30px;height:30px;border-radius:50%;border:1px solid #334155;background:#0f172a;color:#e2e8f0;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 14px rgba(0,0,0,.5)}
#monster-x:hover{background:#1e293b;color:#fff}
#monster-x svg{width:14px;height:14px}
@media(max-width:760px){#monster-wrap{width:180px;right:12px}}

/* Live inbox alert toasts (v181): a new text pops in top right, click opens
   the thread, X dismisses, auto clears after 14s. */
.cf-toasts{position:fixed;top:16px;right:16px;z-index:9999;display:flex;flex-direction:column;gap:10px;max-width:min(360px,calc(100vw - 32px))}
.cf-toast{display:flex;gap:10px;align-items:flex-start;background:#0f172a;border:1px solid #fba401;border-left:4px solid #fba401;color:#e2e8f0;border-radius:12px;padding:12px 14px;box-shadow:0 12px 32px rgba(0,0,0,.45);cursor:pointer;animation:cf-toast-in .3s ease}
.cf-toast.out{opacity:0;transform:translateX(12px);transition:all .3s ease}
@keyframes cf-toast-in{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:none}}
.cf-toast-ico{font-size:18px;line-height:1.25}
.cf-toast-main{flex:1;min-width:0}
.cf-toast-title{font-weight:700;font-size:13.5px}
.cf-toast-body{font-size:12.5px;color:#94a3b8;margin-top:2px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cf-toast-x{background:none;border:none;color:#94a3b8;font-size:13px;cursor:pointer;padding:0 0 0 4px;line-height:1.25}

/* Recorded calls on the contact profile (v183): card, player, transcript */
.calls-head{font-weight:700;font-size:14px;margin:16px 0 8px}
.call-card{border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:12px;display:flex;gap:12px}
.call-main{flex:1;min-width:0}
.call-top{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.call-dir{font-weight:700;font-size:13px}
.call-meta{color:var(--muted);font-size:12.5px}
.call-norec{color:var(--muted);font-size:13px}
.call-player{margin-top:10px}
.call-ctls{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.call-block{margin-top:10px;border-top:1px solid var(--line);padding-top:8px}
.call-block-h{font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.call-block-b{font-size:13.5px;line-height:1.6;white-space:pre-wrap}

/* Dummy data: sidebar visibility switch + dedicated icon column */
.dummy-toggle{display:flex;align-items:center;gap:9px;padding:10px 14px;border-top:1px solid rgba(148,163,184,.14);margin:0 10px}
.dummy-toggle-label{font-size:12.5px;font-weight:600;color:var(--muted,#94a3b8)}
td.dummy-cell,.dummy-cell{width:30px;text-align:center;padding-right:0}
th.th-dummy{width:30px;text-align:center;cursor:pointer}

/* --- Email + Calendar tools (v213) --- */
.mb-row{display:flex;align-items:flex-start;gap:10px;padding:14px 12px;border-bottom:1px solid var(--line);cursor:pointer;border-left:4px solid var(--purple)}
.bar-text{border-left:4px solid var(--cyan);padding-left:12px}
.bar-group{border-left:4px solid #fba401;padding-left:12px}
.bar-email{border-left:4px solid var(--purple);padding-left:12px}
.bar-call{border-left:4px solid #34d399}
.log-item.bar-call{padding-left:12px}
.call-card.bar-call{border-left:4px solid #34d399}
.mb-row.mb-prov-google{border-left:3px solid #ea4335}
.mb-row.mb-prov-microsoft{border-left:3px solid #4f8ff7}
.mb-src{font-size:10px;font-weight:700;letter-spacing:.5px;padding:2px 7px;border-radius:999px;text-transform:uppercase;flex-shrink:0;white-space:nowrap}
.mb-src-google{background:rgba(234,67,53,.15);color:#ff9a8a}
.mb-src-microsoft{background:rgba(79,143,247,.15);color:#93bcff}
body.light .mb-src-google{color:#c5221f}
body.light .mb-src-microsoft{color:#1a5fd7}
.mb-row:hover{background:rgba(251,164,1,.06)}
.mb-row .mb-top{display:flex;align-items:baseline;gap:10px}
.mb-row .mb-from{font-weight:600;font-size:15px;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mb-row .mb-date{color:var(--muted);font-size:12px;white-space:nowrap;flex-shrink:0}
.mb-row .mb-subj{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:3px}
.mb-row .mb-prev{display:block;color:var(--muted);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.mb-row.mb-unread .mb-from,.mb-row.mb-unread .mb-subj{font-weight:800}
.mb-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#fba401;margin-right:8px;vertical-align:1px}
.chip.on{background:#fba401;border-color:#fba401;color:#141414;font-weight:700}
.cal2-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.cal2-cell{border:1px solid var(--line);border-radius:8px;min-height:92px;padding:6px;font-size:12px;overflow:hidden}
.cal2-cell.dim{opacity:.45}
.cal2-cell.today{border-color:#fba401;border-width:2px}
.cal2-ev{background:rgba(251,164,1,.16);border-radius:6px;padding:2px 6px;margin-top:4px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cal2-ev:hover{background:rgba(251,164,1,.32)}
.cal2-agenda-ev{display:flex;gap:12px;padding:9px 8px;border-bottom:1px solid var(--line);cursor:pointer;align-items:baseline}
.cal2-agenda-ev.cal2-prov-google{border-left:3px solid #ea4335}
.cal2-agenda-ev.cal2-prov-microsoft{border-left:3px solid #4f8ff7}
.cal2-ev.cal2-ev-google{box-shadow:inset 3px 0 0 #ea4335}
.cal2-ev.cal2-ev-microsoft{box-shadow:inset 3px 0 0 #4f8ff7}
.cal2-agenda-ev:hover{background:rgba(251,164,1,.06)}
.cal2-day-wrap{position:relative}
.cal2-hour{height:46px;border-bottom:1px solid var(--line);position:relative;cursor:pointer}
.cal2-hour:hover{background:rgba(251,164,1,.05)}
.cal2-hour-label{position:absolute;left:0;top:4px;width:56px;text-align:right;font-size:11px;color:var(--muted)}
.cal2-day-ev{position:absolute;background:rgba(251,164,1,.16);border:1px solid rgba(251,164,1,.45);border-radius:6px;padding:3px 7px;font-size:12px;cursor:pointer;overflow:hidden;z-index:2}
.cal2-day-ev:hover{background:rgba(251,164,1,.3)}
.cal2-day-ev b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cal2-day-ev span{display:block;font-size:11px;opacity:.75;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cal2-day-ev.cal2-ev-google{box-shadow:inset 3px 0 0 #ea4335}
.cal2-day-ev.cal2-ev-microsoft{box-shadow:inset 3px 0 0 #4f8ff7}
.cal2-nowline{position:absolute;left:60px;right:0;height:2px;background:#e5484d;z-index:3;pointer-events:none}
#cal2-range.cal2-range-day{font-size:20px;font-weight:700;color:var(--text)}
.cal2-wk-col{position:absolute;top:0;bottom:0;border-left:1px solid var(--line);cursor:pointer}
.cal2-wk-ev{font-size:11px;padding:2px 5px}
.cal2-cell{cursor:pointer}

/* Preferred partner toggle in the contact header: gold when on, matching the star */

/* Eye toggle beside the loan card commission (styles for app.js v226) */
.comm-eye{background:none;border:none;color:var(--muted);cursor:pointer;padding:2px;display:inline-flex;align-items:center;border-radius:6px}
.comm-eye:hover{color:var(--cyan)}

/* Priority contact flag + toggle tint (app.js v231) */
.prio-flag{color:#f5b301;font-size:13px}
#c-prio-wrap .switch input:checked + .sl{background:#ff5e7a}

/* Softphone panel (v83): a phone style call card, dark in both themes. */
.vp{position:fixed;right:18px;bottom:18px;z-index:335;width:320px;max-width:calc(100vw - 24px);background:#101623;color:#eef2f8;border:1px solid #2a3646;border-radius:20px;box-shadow:0 18px 44px rgba(0,0,0,.5);padding:16px;font-family:inherit}
.vp-head{display:flex;gap:12px;align-items:center}
.vp-avatar{width:52px;height:52px;flex:0 0 52px;border-radius:50%;background:linear-gradient(135deg,#fba401,#ed5e02);color:#171106;font-weight:800;font-size:19px;display:flex;align-items:center;justify-content:center}
.vp-ringing .vp-avatar{animation:vp-pulse 1.2s ease-in-out infinite}
@keyframes vp-pulse{0%,100%{box-shadow:0 0 0 0 rgba(251,164,1,.45)}50%{box-shadow:0 0 0 12px rgba(251,164,1,0)}}
.vp-id{flex:1;min-width:0}
.vp-name{font-weight:800;font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vp-number{font-size:14px;color:#c6d2e2;font-variant-numeric:tabular-nums}
.vp-status{font-size:12.5px;color:#8fa3bb;margin-top:2px;font-variant-numeric:tabular-nums}
.vp-contact-btn{display:block;width:100%;margin:10px 0 2px;padding:9px 12px;border-radius:10px;border:1px solid rgba(251,164,1,.55);background:rgba(251,164,1,.12);color:#fba401;font-size:13.5px;font-weight:600;cursor:pointer}
.vp-contact-btn:hover{background:rgba(251,164,1,.22)}
.vp-collapse{background:#1c2635;color:#c6d2e2;border:1px solid #2a3646;border-radius:8px;width:28px;height:28px;cursor:pointer;align-self:flex-start}
.vp-controls{display:flex;justify-content:space-between;margin:16px 0 6px;padding:0 2px}
.vp-btn{background:none;border:none;color:#dbe5f1;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:5px;font-family:inherit}
.vp-btn .vp-ico{width:48px;height:48px;border-radius:50%;background:#1c2635;border:1px solid #2a3646;display:flex;align-items:center;justify-content:center;font-size:22px;transition:background .15s}
.vp-btn .vp-lbl{font-size:11.5px;color:#9fb0c3}
.vp-btn.vp-on .vp-ico{background:#fba401;border-color:#fba401}
.vp-btn:active .vp-ico{background:#273349}
.vp-fwdrow{margin:10px 0 2px}
.vp-fwdrow .inp{background:#0b111d;color:#eef2f8;border-color:#2a3646}
.vp-msg{font-size:12px;color:#f5a3a3;margin-top:6px;min-height:14px}
.vp-actions{display:flex;gap:8px;margin-top:12px}
.vp-end{flex:1;background:#c62f24;color:#fff;border:none;border-radius:12px;padding:12px;font-size:15px;font-weight:700;cursor:pointer;font-family:inherit}
.vp-accept{flex:1;background:#1f9d55;color:#fff;border:none;border-radius:12px;padding:12px;font-size:15px;font-weight:700;cursor:pointer;font-family:inherit}
.vp-mini .vp-body{display:none}
@media(max-width:820px){.vp{left:12px;right:12px;width:auto}}

.mb-row .mb-sel{display:flex;align-items:flex-start;justify-content:center;width:44px;min-height:56px;margin:-14px -4px -14px -12px;padding-top:17px;cursor:pointer;flex:0 0 auto}
.mb-row .mb-sel input{width:19px;height:19px;accent-color:#fba401;cursor:pointer;flex:0 0 auto}
.mb-row .mb-main{flex:1;min-width:0;display:block}
.mb-row.mb-picked{background:rgba(251,164,1,.08)}
.mb-bulkbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 10px;margin-bottom:8px;border:1px solid rgba(251,164,1,.45);border-radius:10px;background:rgba(251,164,1,.07)}
.mb-bulkbar .mb-bulk-n{font-weight:700;font-size:13px}
.mb-bulkbar select{max-width:130px}
.mb-meta-ico{font-size:12px;margin-left:7px;white-space:nowrap}
.mb-att{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:10px;padding:9px 11px;margin-top:8px;max-width:520px}
.mb-att-name{font-weight:600;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mc-att{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:999px;padding:5px 10px;font-size:13px;background:rgba(251,164,1,.07)}
.mc-att button{border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:15px;line-height:1;padding:0}
.vp-btn .vp-ico svg{width:20px;height:20px;display:block;margin:0 auto}
.vp-aud-title{font-size:12px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;opacity:.75;margin-bottom:6px}
.vp-aud-opt{display:flex;align-items:center;gap:8px;width:100%;text-align:left;padding:9px 10px;margin-bottom:6px;border-radius:8px;border:1px solid var(--line);background:rgba(255,255,255,.05);color:inherit;font-size:14px;cursor:pointer}
.vp-aud-opt.on{border-color:#fba401;background:rgba(251,164,1,.12)}
.vp-aud-dot{color:#fba401;font-size:11px}

/* Video messages (v256) */
.vid-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.vid-thumb{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:10px;background:#0a1220;display:block}
.vid-pick{padding:8px 10px;border-radius:8px;cursor:pointer}
.vid-pick:hover{background:rgba(251,164,1,.13)}

.camp-step{border:1px solid var(--line);border-radius:12px;padding:12px;margin-bottom:10px}
.camp-delay{display:flex;align-items:center;gap:8px;flex-wrap:wrap;border:1px dashed var(--line);border-radius:12px;padding:8px 12px}
.camp-delay input[type="number"],.camp-delay select{background:var(--input-bg,rgba(255,255,255,.06));border:1px solid var(--line);border-radius:8px;color:var(--txt);padding:6px 8px}
.camp-item-btns{margin-left:auto;display:inline-flex;gap:4px}
.camp-step-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:8px}
.camp-chan{display:inline-flex;align-items:center;gap:6px;font-size:13px;cursor:pointer}
.camp-lbl{display:block;margin:8px 0 4px}
.camp-step textarea,.camp-step input[type="text"]{width:100%;background:rgba(148,163,184,.07);border:1px solid var(--line);border-radius:10px;color:var(--text);padding:9px 11px;font-family:inherit;font-size:14px;resize:vertical}
.camp-step input[type="number"]{background:rgba(148,163,184,.07);border:1px solid var(--line);border-radius:10px;color:var(--text);padding:9px 11px;font-family:inherit;font-size:14px}
.camp-pick-row{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;margin-bottom:6px;cursor:pointer}

/* Writing Voice done-for-me quiz */
.aivq-opt{display:block;width:100%;text-align:left;background:rgba(148,163,184,.07);border:1.5px solid rgba(148,163,184,.28);border-radius:12px;padding:12px 14px;margin:0 0 10px;font-size:14px;line-height:1.55;color:inherit;cursor:pointer}
.aivq-opt:hover{border-color:rgba(251,164,1,.65)}
.aivq-dots{display:flex;gap:6px;justify-content:center;margin:2px 0 14px}
.aivq-dot{width:8px;height:8px;border-radius:50%;background:rgba(148,163,184,.35)}
.aivq-dot.on{background:#fba401}

/* Recorder stage: the title and record controls sit in a left rail,
   vertically centered beside the preview (Ryan, Oct 21 2026), and the
   library's upload tile leads the pick grid. */
.vid-stage-row{display:flex;gap:14px;align-items:center}
.vid-left-rail{width:210px;flex:none;display:flex;flex-direction:column;gap:10px}
.vid-stage-box{flex:1;min-width:0}
@media (max-width:700px){.vid-stage-row{flex-direction:column;align-items:stretch}.vid-left-rail{width:100%}}
.vid-up-card{border-style:dashed;margin-right:36px;position:relative}
.vid-lib-head{display:flex;align-items:baseline;margin-bottom:8px;font-weight:700}
.vid-lib-h1{width:150px;flex:none;margin-right:46px}
.vid-up-card:has(+ .vid-pick-card)::after{content:'';position:absolute;top:8px;bottom:8px;right:-24px;width:1px;background:var(--line)}

/* Camera preview sizes to the feed's own aspect ratio (Ryan, Oct 21
   2026): fit inside the column and the height cap, centered, never
   stretched or cropped into a wide strip. In the stylesheet, not the
   inline style, because vidShowStage toggles the inline display. */
#vid-preview{display:block;width:auto;max-width:100%;height:auto;max-height:44vh;margin:0 auto;border-radius:10px;background:#0a1220;object-fit:contain}

/* video trim sliders: the part being cut paints red (set from JS per slider) */
.vid-trim-range{-webkit-appearance:none;appearance:none;height:18px;background-color:transparent;background-repeat:no-repeat;background-size:100% 6px;background-position:center;border-radius:3px;cursor:pointer}
.vid-trim-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid #fba401;cursor:pointer}
.vid-trim-range::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#fff;border:2px solid #fba401;cursor:pointer}
.vid-trim-range::-moz-range-track{background:transparent}

/* Video editor two column layout: media left, editing tools in a right rail (v93) */
.vid-stage-flex{display:flex;gap:18px;align-items:flex-start}
.vid-media-col{flex:1;min-width:0}
.vid-side{width:370px;flex:none;border-left:1px solid rgba(140,160,190,.18);padding-left:18px}
@media (max-width:980px){.vid-stage-flex{flex-direction:column}.vid-side{width:100%;border-left:none;padding-left:0;border-top:1px solid rgba(140,160,190,.18);padding-top:12px}}

/* Contact Info always-editable grid (2026-10-21): all fields visible, spread
   across the card, autosave on change — no Edit/Save mode. */
.ci-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px 18px;padding:4px 0 10px}
.ci-fld{display:flex;flex-direction:column;gap:5px;min-width:0}
.ci-fld.ci-span{grid-column:span 2}
@media (max-width:640px){.ci-fld.ci-span{grid-column:span 1}}
.ci-lbl{color:var(--muted);font-size:12px;font-weight:600}
.ci-inp{width:100%}
.ci-inp.ci-saved{outline:2px solid rgba(34,197,94,.65);outline-offset:1px}
.ci-seclbl{grid-column:1/-1;border-top:1px solid var(--line);padding-top:10px;margin-top:2px;color:var(--muted);font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase}
.chead-src{display:flex;flex-direction:column;gap:6px;align-items:flex-end;min-width:0;max-width:100%}
.chs-btn{display:flex;gap:6px;align-items:baseline;background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:999px;padding:5px 11px;font-size:12px;color:var(--text);cursor:pointer;font-family:inherit;min-width:0;max-width:100%}
.chs-btn:hover{border-color:var(--acc);background:rgba(255,255,255,.07)}
.chs-lbl{color:var(--muted)}
.chs-lbl{flex:none}
.chs-val{font-weight:600;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}

.cpanel-sec[data-sec="text"] .comp-text-wrap{position:relative;display:flex;flex:1;min-height:0;margin-bottom:10px}
.text-count{position:absolute;right:12px;bottom:10px;z-index:2;pointer-events:none;background:rgba(2,6,23,.85);border:1px solid rgba(148,163,184,.45);border-radius:999px;padding:2px 8px;font-size:12px;line-height:1.35;color:#e2e8f0}
.text-count.over{color:#fbbf24;border-color:rgba(251,191,36,.55);font-weight:700}
.text-over-note{position:absolute;left:12px;bottom:10px;right:108px;z-index:2;pointer-events:none;color:#fbbf24;font-size:12px;line-height:1.3;background:rgba(2,6,23,.72);border-radius:8px;padding:2px 8px}
.text-over-note[hidden]{display:none}
@media(max-width:700px){.text-over-note{right:12px;bottom:38px}.cpanel-sec[data-sec="text"] #comp-text{padding-bottom:64px}}

.vid-lib-top{border-bottom:1px solid var(--line);padding-bottom:12px;margin-bottom:12px}
.vid-pick-grid{display:flex;gap:10px;flex-wrap:wrap}
.vid-pick-card{width:150px;cursor:pointer;border:1px solid var(--line);border-radius:10px;padding:6px;background:rgba(148,163,184,.05)}
.vid-pick-card:hover{border-color:var(--acc);background:rgba(251,164,1,.08)}
.vid-pick-thumb{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:6px;background:#0a1220;display:block}
.vid-pick-ph{display:flex;align-items:center;justify-content:center;font-size:26px}
.vid-pick-title{font-weight:600;font-size:12.5px;margin-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dict-row{display:flex;gap:8px;align-items:center;margin-top:6px}
.dict-row .dict-note{flex:1;margin-top:0}
.mic-btn.sm{width:44px;height:38px;border-radius:10px}
.mic-btn.sm svg{width:18px;height:18px}