/* FullView Sales Portal — modern 2026 UI. Light + dark theming via CSS vars. */
:root{
  --bg:#f4f5f8; --bg-2:#eceef2; --surface:#ffffff; --surface-2:#fafbfc;
  --border:#e7e9ee; --border-strong:#d7dae1;
  --ink:#13161c; --muted:#616875; --faint:#98a0ad;
  --accent:#e07b1a; --accent-2:#f0932e; --accent-ink:#ffffff; --accent-soft:#fcf0e2;
  --ok:#16a34a; --ok-soft:#e7f6ed; --blue:#2563eb; --blue-soft:#e8effe;
  --amber:#d98a15; --amber-soft:#fbf1dc; --slate:#64748b; --slate-soft:#eef1f5;
  --violet:#6d54e6; --rose:#e11d48;
  --shadow:0 1px 2px rgba(16,18,24,.05),0 8px 24px rgba(16,18,24,.06);
  --shadow-lg:0 18px 50px rgba(16,18,24,.12);
  --radius:16px; --radius-sm:10px; --r-pill:999px;
  --ring:0 0 0 3px rgba(224,123,26,.25);
  color-scheme:light;
}
[data-theme="dark"]{
  --bg:#0a0c11; --bg-2:#0e1117; --surface:#151922; --surface-2:#1b202b;
  --border:rgba(255,255,255,.08); --border-strong:rgba(255,255,255,.15);
  --ink:#e8ebf1; --muted:#98a1ae; --faint:#6b7382;
  --accent:#f0983f; --accent-2:#f5a95c; --accent-ink:#171208; --accent-soft:rgba(240,152,63,.13);
  --ok:#3ddc84; --ok-soft:rgba(61,220,132,.13); --blue:#5b8bff; --blue-soft:rgba(91,139,255,.14);
  --amber:#f0b03c; --amber-soft:rgba(240,176,60,.14); --slate:#93a0b4; --slate-soft:rgba(147,160,180,.13);
  --violet:#9b86ff; --rose:#ff6b8a;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 10px 30px rgba(0,0,0,.4);
  --shadow-lg:0 24px 60px rgba(0,0,0,.55);
  --ring:0 0 0 3px rgba(240,152,63,.3);
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  background:var(--bg);color:var(--ink);font-size:14px;line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{margin:0;font-weight:700;letter-spacing:-.01em}
.num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}

/* ---------- layout ---------- */
.app{display:grid;grid-template-columns:244px 1fr;min-height:100vh}
.sidebar{
  position:sticky;top:0;height:100vh;background:var(--surface);
  border-right:1px solid var(--border);display:flex;flex-direction:column;
  padding:18px 14px;gap:6px;z-index:20;
}
.brand{display:flex;align-items:center;gap:11px;padding:8px 10px 16px}
.brand .mark{
  width:30px;height:30px;border-radius:9px;flex:none;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  box-shadow:0 4px 14px rgba(224,123,26,.35);position:relative;
}
.brand .mark::after{content:"";position:absolute;inset:9px 8px;border-radius:3px;
  background:var(--accent-ink);opacity:.9;clip-path:polygon(0 0,100% 0,100% 55%,50% 100%,0 55%)}
.brand .word{font-weight:800;font-size:15px;letter-spacing:-.02em}
.brand .word b{color:var(--accent)}
.brand .sub{display:block;font-size:10.5px;font-weight:600;color:var(--faint);letter-spacing:.08em;text-transform:uppercase;margin-top:1px}
.nav{display:flex;flex-direction:column;gap:3px;margin-top:4px}
.navlink{
  display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:11px;
  color:var(--muted);font-weight:600;font-size:13.5px;transition:.15s;
}
.navlink svg{width:18px;height:18px;flex:none;opacity:.85}
.navlink:hover{background:var(--surface-2);color:var(--ink)}
.navlink.active{background:var(--accent-soft);color:var(--accent)}
.navlink.active svg{opacity:1}
.side-foot{margin-top:auto;border-top:1px solid var(--border);padding-top:12px;display:flex;flex-direction:column;gap:8px}
.who{display:flex;align-items:center;gap:10px;padding:2px 8px}
.avatar{width:32px;height:32px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));color:var(--accent-ink);font-weight:800;font-size:13px}
.who>span:last-child{display:flex;flex-direction:column;justify-content:center}
.who .nm{display:block;font-weight:700;font-size:13px;line-height:1.35}
.who .rl{display:block;font-size:11px;color:var(--faint);line-height:1.25}

.main{min-width:0;display:flex;flex-direction:column}
.topbar{
  position:sticky;top:0;z-index:15;display:flex;align-items:center;justify-content:space-between;
  padding:16px 26px;background:color-mix(in srgb,var(--bg) 78%,transparent);
  backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--border);
}
.topbar h1{font-size:20px;letter-spacing:-.02em}
.topbar .sub{color:var(--muted);font-size:12.5px;margin-top:2px}
.top-actions{display:flex;align-items:center;gap:9px}
.content{padding:22px 26px 60px;max-width:1220px;width:100%;margin:0 auto}
.section-t{font-size:12px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--faint);margin:26px 2px 12px}

/* ---------- cards ---------- */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}
.pad{padding:18px 20px}
.grid{display:grid;gap:16px}
.cols-2{grid-template-columns:1fr 1fr}
.cols-3{grid-template-columns:repeat(3,1fr)}
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(178px,1fr));gap:14px}
.stat{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px 18px;box-shadow:var(--shadow);transition:.18s}
.stat:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.stat .lab{font-size:12px;font-weight:600;color:var(--muted);display:flex;align-items:center;gap:6px}
.stat .val{font-size:29px;font-weight:800;letter-spacing:-.025em;margin-top:7px;line-height:1}
.stat .hint{font-size:11.5px;color:var(--faint);margin-top:6px}
.stat.hero{background:linear-gradient(135deg,var(--accent),var(--accent-2));border:none;color:var(--accent-ink);box-shadow:0 12px 34px rgba(224,123,26,.34)}
.stat.hero .lab,.stat.hero .hint{color:rgba(255,255,255,.85)}
.stat .dot{width:8px;height:8px;border-radius:50%;background:var(--accent)}

/* ---------- badges / pills ---------- */
.badge{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:var(--r-pill);
  font-size:11px;font-weight:700;letter-spacing:.01em;white-space:nowrap;line-height:1.5}
.b-prime{background:var(--ok-soft);color:var(--ok)}
.b-strong{background:var(--blue-soft);color:var(--blue)}
.b-possible{background:var(--amber-soft);color:var(--amber)}
.b-longer_shot,.b-none{background:var(--slate-soft);color:var(--slate)}
.b-founding{background:var(--accent-soft);color:var(--accent)}
.b-tool_likely_no{background:var(--ok-soft);color:var(--ok)}
.b-tool_possibly{background:var(--amber-soft);color:var(--amber)}
.b-tool_likely_yes{background:rgba(225,29,72,.12);color:var(--rose)}
.b-tool_unknown{background:var(--slate-soft);color:var(--slate)}
.stg{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:12px}
.stg::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--slate)}
.stg.s-researching::before,.stg.s-contacted::before{background:var(--blue)}
.stg.s-demo_booked::before,.stg.s-demo_done::before{background:var(--violet)}
.stg.s-pilot_signed::before{background:var(--amber)}
.stg.s-paying::before,.stg.s-expanded::before{background:var(--ok)}
.stg.s-passed::before{background:var(--rose)}

/* ---------- buttons / inputs ---------- */
.btn{display:inline-flex;align-items:center;gap:7px;padding:9px 15px;border-radius:11px;border:1px solid var(--border-strong);
  background:var(--surface);color:var(--ink);font-weight:650;font-size:13px;cursor:pointer;transition:.15s;font-family:inherit}
.btn:hover{background:var(--surface-2);border-color:var(--faint)}
.btn svg{width:16px;height:16px}
.btn-primary{background:var(--accent);border-color:transparent;color:var(--accent-ink)}
.btn-primary:hover{background:var(--accent-2);filter:brightness(1.02)}
.btn-sm{padding:6px 11px;font-size:12px;border-radius:9px;gap:5px}
.btn-ghost{background:transparent;border-color:transparent;color:var(--muted)}
.btn-ghost:hover{background:var(--surface-2);color:var(--ink)}
.icon-btn{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:10px;border:1px solid var(--border);background:var(--surface);cursor:pointer;color:var(--muted);transition:.15s}
.icon-btn:hover{color:var(--ink);border-color:var(--faint)}
.icon-btn svg{width:18px;height:18px}
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}
.field label{font-size:12px;font-weight:600;color:var(--muted)}
.input,select,textarea{
  width:100%;padding:9px 12px;border-radius:10px;border:1px solid var(--border-strong);
  background:var(--surface);color:var(--ink);font-family:inherit;font-size:13.5px;transition:.15s}
.input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:var(--ring)}
textarea{resize:vertical;min-height:70px}
.stage-select{appearance:none;font-weight:700;padding:7px 30px 7px 12px;border-radius:var(--r-pill);cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='3'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 10px center}
.row-actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap}

/* ---------- pipeline list ---------- */
.filters{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
.filters .search{position:relative;flex:1;min-width:220px}
.filters .search svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--faint)}
.filters .search input{padding-left:36px}
.filters select{width:auto;min-width:130px}
.count-chip{font-size:12.5px;color:var(--muted);font-weight:600}
.plist{display:flex;flex-direction:column;gap:0;border-radius:var(--radius);overflow:hidden;border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow)}
.prow{display:grid;grid-template-columns:1.7fr 1fr 1.1fr auto;gap:14px;align-items:center;padding:14px 18px;border-bottom:1px solid var(--border);transition:.12s}
.prow:last-child{border-bottom:none}
.prow:hover{background:var(--surface-2)}
.prow .co{min-width:0}
.prow .co .nm{font-weight:700;font-size:14.5px;letter-spacing:-.01em;display:flex;align-items:center;gap:8px}
.prow .co .nm a:hover{color:var(--accent)}
.prow .co .meta{font-size:12px;color:var(--muted);margin-top:3px;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.prow .price{font-weight:750;font-size:13.5px}
.prow .price small{display:block;color:var(--faint);font-weight:600;font-size:11px}
.badges-inline{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.maplink{display:inline-flex;align-items:center;gap:5px;color:var(--blue);font-weight:600;font-size:12px}
.maplink:hover{text-decoration:underline}
.calllink{color:var(--muted);font-weight:600;font-size:12px}
.calllink:hover{color:var(--ink)}

/* ---------- prospect detail ---------- */
.detail-grid{display:grid;grid-template-columns:1.55fr 1fr;gap:18px;align-items:start}
.kv{display:grid;grid-template-columns:130px 1fr;gap:8px 14px;font-size:13px}
.kv dt{color:var(--muted);font-weight:600}
.kv dd{margin:0;font-weight:600}
.timeline{position:relative;margin-top:6px;padding-left:22px}
.timeline::before{content:"";position:absolute;left:6px;top:4px;bottom:4px;width:2px;background:var(--border)}
.tl-item{position:relative;padding:0 0 16px}
.tl-item::before{content:"";position:absolute;left:-19px;top:3px;width:11px;height:11px;border-radius:50%;background:var(--surface);border:2.5px solid var(--slate)}
.tl-item.k-conversation::before,.tl-item.k-call::before{border-color:var(--blue)}
.tl-item.k-demo_done::before,.tl-item.k-demo_booked::before{border-color:var(--violet)}
.tl-item.k-pilot_signed::before{border-color:var(--amber)}
.tl-head{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.tl-head .k{font-weight:700;font-size:13px}
.tl-head .d{font-size:11.5px;color:var(--faint)}
.tl-head .pay{margin-left:auto;font-weight:750;font-size:12.5px;color:var(--ok)}
.tl-item .body{font-size:13px;color:var(--muted);margin-top:3px}
.quick-log{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:14px}
.deal-card{border:1px solid var(--border);border-radius:12px;padding:13px 15px;margin-bottom:10px;background:var(--surface-2)}
.deal-card .top{display:flex;justify-content:space-between;align-items:center}
.deal-card .v{font-weight:800;font-size:16px}

/* ---------- earnings ---------- */
.ledger{width:100%;border-collapse:collapse;font-size:13px}
.ledger th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--faint);font-weight:700;padding:8px 12px;border-bottom:1px solid var(--border)}
.ledger td{padding:10px 12px;border-bottom:1px solid var(--border)}
.ledger tr:last-child td{border-bottom:none}
.ledger .amt{text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
.breakdown-row{display:flex;justify-content:space-between;padding:11px 0;border-bottom:1px solid var(--border);font-size:14px}
.breakdown-row:last-child{border-bottom:none}
.breakdown-row .lab{color:var(--muted);font-weight:600;display:flex;align-items:center;gap:9px}
.breakdown-row .lab .sw{width:11px;height:11px;border-radius:3px}
.breakdown-row .amt{font-weight:750;font-variant-numeric:tabular-nums}
.tot{display:flex;justify-content:space-between;padding:14px 0 2px;font-weight:800;font-size:16px}

/* ---------- charts ---------- */
.chart-wrap{position:relative;height:230px}
.chart-wrap.tall{height:280px}
.legend{display:flex;gap:14px;flex-wrap:wrap;margin-top:10px;font-size:12px;color:var(--muted)}
.legend span{display:inline-flex;align-items:center;gap:6px}
.legend i{width:10px;height:10px;border-radius:3px;display:inline-block}
.empty{color:var(--faint);font-size:13px;text-align:center;padding:26px}

/* ---------- login ---------- */
.auth{min-height:100vh;display:grid;place-items:center;padding:20px;
  background:radial-gradient(1000px 600px at 20% -10%,var(--accent-soft),transparent),var(--bg)}
.auth .box{width:100%;max-width:390px;background:var(--surface);border:1px solid var(--border);border-radius:20px;padding:30px 28px;box-shadow:var(--shadow-lg)}
.auth .brand{justify-content:center;padding-bottom:20px}
.auth h2{font-size:19px;text-align:center;margin-bottom:4px}
.auth .lede{text-align:center;color:var(--muted);font-size:13px;margin-bottom:22px}
.auth .btn-primary{width:100%;justify-content:center;padding:11px;margin-top:6px}
.auth .err{background:rgba(225,29,72,.1);color:var(--rose);border-radius:10px;padding:10px 12px;font-size:12.5px;font-weight:600;margin-bottom:14px;text-align:center}

.mono{font-variant-numeric:tabular-nums}
.muted{color:var(--muted)}
.flex{display:flex;align-items:center;gap:10px}
.between{display:flex;align-items:center;justify-content:space-between;gap:10px}
.wrap-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.mt{margin-top:16px}.mt-s{margin-top:8px}

/* ---------- responsive ---------- */
@media(max-width:900px){
  .app{grid-template-columns:1fr}
  .sidebar{position:sticky;top:0;height:auto;flex-direction:row;align-items:center;overflow-x:auto;
    padding:10px 12px;border-right:none;border-bottom:1px solid var(--border);gap:4px}
  .brand{padding:4px 8px 4px 2px}.brand .sub{display:none}
  .nav{flex-direction:row;margin-top:0}
  .navlink{padding:8px 12px;white-space:nowrap}.navlink span{display:none}
  .side-foot{margin-top:0;margin-left:auto;border-top:none;padding-top:0;flex-direction:row}
  .who .nm,.who .rl{display:none}
  .detail-grid,.cols-2,.cols-3{grid-template-columns:1fr}
  .content{padding:18px 16px 60px}.topbar{padding:14px 16px}
  .prow{grid-template-columns:1fr;gap:10px}
}


/* ==================== Liquid glass ==================== */
:root{
  --glass:rgba(255,255,255,.56); --glass-2:rgba(255,255,255,.42);
  --glass-brd:rgba(255,255,255,.66); --glass-shadow:0 10px 34px rgba(16,18,24,.13);
  --glass-blur:18px;
}
[data-theme="dark"]{
  --glass:rgba(24,28,38,.52); --glass-2:rgba(24,28,38,.4);
  --glass-brd:rgba(255,255,255,.10); --glass-shadow:0 16px 42px rgba(0,0,0,.52);
}
body{position:relative}
body::before{
  content:"";position:fixed;inset:-15%;z-index:-2;pointer-events:none;
  background:
    radial-gradient(38% 44% at 12% 8%, rgba(224,123,26,.30), transparent 60%),
    radial-gradient(34% 40% at 88% 12%, rgba(47,111,176,.26), transparent 60%),
    radial-gradient(42% 50% at 82% 92%, rgba(46,125,50,.22), transparent 62%),
    radial-gradient(38% 46% at 8% 88%, rgba(155,109,255,.24), transparent 60%);
  filter:blur(48px) saturate(135%);
  animation:gdrift 26s ease-in-out infinite alternate;
}
[data-theme="dark"] body::before{filter:blur(56px) saturate(120%) brightness(.85);opacity:.9}
@keyframes gdrift{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(0,-2.5%,0) scale(1.07)}}

.sidebar,.topbar,.card,.stat,.plist,.auth .box{
  background:var(--glass)!important;
  -webkit-backdrop-filter:blur(var(--glass-blur)) saturate(180%);
  backdrop-filter:blur(var(--glass-blur)) saturate(180%);
  border:1px solid var(--glass-brd)!important;
  box-shadow:var(--glass-shadow), inset 0 1px 0 rgba(255,255,255,.5)!important;
}
[data-theme="dark"] .sidebar,[data-theme="dark"] .topbar,[data-theme="dark"] .card,
[data-theme="dark"] .stat,[data-theme="dark"] .plist,[data-theme="dark"] .auth .box{
  box-shadow:var(--glass-shadow), inset 0 1px 0 rgba(255,255,255,.06)!important;
}
.topbar{background:var(--glass-2)!important;border-left:none!important;border-right:none!important;border-top:none!important}
.stat{transition:transform .18s, box-shadow .18s, background .18s}
.stat:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg), inset 0 1px 0 rgba(255,255,255,.6)!important}
.stat.hero{
  background:linear-gradient(135deg, rgba(224,123,26,.94), rgba(240,147,46,.92))!important;
  border:1px solid rgba(255,255,255,.34)!important;
  box-shadow:0 16px 42px rgba(224,123,26,.4), inset 0 1px 0 rgba(255,255,255,.42)!important;
}
.prow:hover{background:rgba(255,255,255,.34)}
[data-theme="dark"] .prow:hover{background:rgba(255,255,255,.05)}
.stage-select,.filters select,.filters .search input{background:var(--glass-2)}
.permo{font-size:14px;font-weight:600;opacity:.55;margin-left:2px}

/* ---------- mobile polish ---------- */
@media(max-width:900px){
  :root{--glass-blur:13px}
  body::before{filter:blur(42px) saturate(128%)}
  .sidebar{background:var(--glass-2)!important;border-bottom:1px solid var(--glass-brd)!important}
}
@media(max-width:560px){
  .content{padding:16px 12px 64px}
  .topbar{padding:12px 14px}
  .topbar h1{font-size:18px}
  .stat{padding:14px 15px}
  .stat .val{font-size:24px}
  .stat-grid{gap:11px}
  .prow{padding:13px 14px}
  .section-t{margin:20px 2px 10px}
  .navlink span{font-size:12.5px}
}


/* ---- mobile top-nav: wrap instead of clipping the account / avatar ---- */
@media(max-width:900px){
  .sidebar{flex-wrap:wrap;overflow:visible;row-gap:6px}
  .nav{flex-wrap:wrap}
  .side-foot{margin-left:auto}
  .who{padding-right:2px}
}
@media(max-width:560px){
  .brand .word{display:none}
  .navlink{padding:6px 9px}
  .avatar{width:28px;height:28px;font-size:12px}
}

/* ===== 90-day countdown (CSO dashboard) ===== */
.cd-card{margin-bottom:18px}
.cd-clock{display:flex;align-items:baseline;gap:10px;margin:14px 0 6px;flex-wrap:wrap}
.cd-seg{display:flex;flex-direction:column;align-items:center;min-width:74px;padding:10px 12px;
  border-radius:14px;background:rgba(127,127,127,.08);border:1px solid var(--border)}
.cd-seg b{font-size:36px;font-weight:800;letter-spacing:-.02em;line-height:1;
  font-variant-numeric:tabular-nums;
  background:linear-gradient(120deg,var(--accent),var(--accent-2));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.cd-seg small{margin-top:5px;font-size:10px;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:var(--slate)}
.cd-ms{min-width:86px}
.cd-colon,.cd-dot{font-size:30px;font-weight:800;color:var(--slate);opacity:.5}
#cd-clock[data-idle="1"] .cd-seg b{background:none;-webkit-text-fill-color:currentColor;color:var(--slate);opacity:.5}
.cd-form{display:flex;align-items:center;gap:12px;margin-top:12px;flex-wrap:wrap}
.cd-btn[disabled]{opacity:.45;cursor:not-allowed;filter:saturate(.4)}
.cd-note{font-size:12px}
@media(max-width:560px){
  .cd-seg{min-width:56px;padding:8px 8px}
  .cd-seg b{font-size:25px}
  .cd-ms{min-width:66px}
  .cd-colon,.cd-dot{font-size:20px}
}

/* ===== v6 — unified brand mark (the admin "full-view lens", scaled) ===== */
.brand .mark{background:linear-gradient(140deg,#FFAE63 0%,#F26A1B 52%,#C44D0C 100%);
  box-shadow:0 6px 16px -5px rgba(242,106,27,.65), inset 0 1px 0 rgba(255,255,255,.4)}
.brand .mark::before{content:"";position:absolute;inset:0;margin:auto;width:16.5px;height:10px;
  background:#fff;border-radius:0 0 11px 11px / 0 0 10px 10px;
  -webkit-mask:radial-gradient(8.5px 10px at 50% 0, transparent 98%, #000 100%);
          mask:radial-gradient(8.5px 10px at 50% 0, transparent 98%, #000 100%)}
.brand .mark::after{content:"";position:absolute;inset:auto;left:50%;top:50%;width:6.5px;height:6.5px;
  border-radius:50%;background:#C44D0C;transform:translate(-50%,-30%);clip-path:none;opacity:1;
  box-shadow:0 0 0 2.4px rgba(255,255,255,.92)}

/* ==================== v7 — HUD mode (matches the admin command center) ==================== */
.sp-orbs{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.sp-orbs i{position:absolute;border-radius:50%;filter:blur(64px);opacity:.38;
  animation:spFloat 16s ease-in-out infinite alternate}
.sp-orbs i:nth-child(1){width:420px;height:420px;left:-6%;top:2%;background:#FF7A1A}
.sp-orbs i:nth-child(2){width:340px;height:340px;right:-5%;top:14%;background:#7C4DFF;animation-delay:-4s}
.sp-orbs i:nth-child(3){width:300px;height:300px;left:20%;bottom:4%;background:#00C2A8;animation-delay:-8s}
.sp-orbs i:nth-child(4){width:260px;height:260px;right:24%;bottom:-6%;background:#3D8BFF;animation-delay:-11s}
.sp-orbs i:nth-child(5){width:200px;height:200px;left:48%;top:30%;background:#FF5D8F;animation-delay:-13s;opacity:.22}
@keyframes spFloat{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(4%,6%,0) scale(1.15)}}
[data-theme="dark"] .sp-orbs i{opacity:.26}

.card,.stat,.plist{
  border:1px solid transparent!important;
  background:
    linear-gradient(var(--glass),var(--glass)) padding-box,
    linear-gradient(135deg, rgba(255,122,26,.6), rgba(255,209,102,.3) 30%, rgba(124,77,255,.42) 65%, rgba(0,194,168,.45)) border-box!important;
  box-shadow:0 14px 44px -14px rgba(242,106,27,.28), 0 0 30px -12px rgba(124,77,255,.25),
             inset 0 1px 0 rgba(255,255,255,.4)!important;
  transition:transform .18s ease, box-shadow .25s ease;
}
[data-theme="dark"] .card,[data-theme="dark"] .stat,[data-theme="dark"] .plist{
  background:
    linear-gradient(rgba(20,24,32,.82),rgba(20,24,32,.82)) padding-box,
    linear-gradient(135deg, rgba(255,122,26,.65), rgba(255,209,102,.22) 30%, rgba(124,77,255,.5) 65%, rgba(0,194,168,.5)) border-box!important;
  box-shadow:0 18px 52px -14px rgba(0,0,0,.6), 0 0 34px -10px rgba(255,122,26,.22), 0 0 44px -14px rgba(124,77,255,.28),
             inset 0 1px 0 rgba(255,255,255,.06)!important;
}
.stat:hover,.card:hover{box-shadow:0 20px 56px -14px rgba(242,106,27,.42), 0 0 44px -10px rgba(124,77,255,.38),
  inset 0 1px 0 rgba(255,255,255,.5)!important}

.stat.hero{
  background:linear-gradient(120deg,#FF7A1A,#FF5D8F 35%,#7C4DFF 70%,#FF7A1A)!important;
  background-size:280% 280%!important;animation:spHue 9s ease-in-out infinite;
  border:1px solid rgba(255,255,255,.35)!important;
  box-shadow:0 22px 60px -16px rgba(255,93,143,.5), 0 0 46px -10px rgba(124,77,255,.45)!important;
  overflow:hidden;position:relative;
}
@keyframes spHue{0%{background-position:0% 40%}50%{background-position:100% 60%}100%{background-position:0% 40%}}
.stat.hero::after{content:"";position:absolute;inset:0;
  background:linear-gradient(105deg, transparent 38%, rgba(255,255,255,.26) 50%, transparent 62%);
  background-size:240% 100%;animation:spSheen 5.5s ease-in-out infinite;pointer-events:none}
@keyframes spSheen{0%{background-position:180% 0}60%,100%{background-position:-80% 0}}

.stat .val{font-size:30px;background:linear-gradient(120deg,var(--accent),#FFD166);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 0 12px rgba(255,122,26,.3))}
.stat.hero .val{background:none;-webkit-text-fill-color:#fff;filter:none;text-shadow:0 2px 18px rgba(0,0,0,.25)}
.stat .dot{animation:spPulse 2.2s infinite}
@keyframes spPulse{0%{box-shadow:0 0 0 0 rgba(255,122,26,.5)}70%{box-shadow:0 0 0 8px rgba(255,122,26,0)}100%{box-shadow:0 0 0 0 rgba(255,122,26,0)}}
.section-t{background:linear-gradient(90deg,#FF7A1A,#7C4DFF);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

@keyframes spIn{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.stat,.card,.plist{animation:spIn .55s cubic-bezier(.2,.7,.3,1) both}
.stat-grid>*:nth-child(1){animation-delay:.02s}.stat-grid>*:nth-child(2){animation-delay:.09s}
.stat-grid>*:nth-child(3){animation-delay:.16s}.stat-grid>*:nth-child(4){animation-delay:.23s}
.grid>*:nth-child(1){animation-delay:.1s}.grid>*:nth-child(2){animation-delay:.18s}

/* countdown clock digits keep their gradient treatment */
.cd-seg b{filter:drop-shadow(0 0 10px rgba(255,122,26,.3))}

@media (max-width:900px){.sp-orbs i{filter:blur(48px)}.sp-orbs i:nth-child(n+4){display:none}}
@media (prefers-reduced-motion: reduce){
  .sp-orbs,.stat.hero::after{display:none}
  .stat.hero{animation:none}
  .stat,.card,.plist{animation:none}
  .stat .dot{animation:none}
}

/* ==================== v8 — EGYPTIAN TREASURY PALETTE ====================
   Pristine precious materials: burnished gold, lapis lazuli, faience
   turquoise, carnelian — on alabaster (light) and obsidian (dark). */
:root{
  --bg:#F6F1E4; --bg-2:#EFE8D6; --surface:#FFFDF6; --surface-2:#FBF7EC;
  --border:#E5DCC3; --border-strong:#D2C49E;
  --ink:#241E12; --muted:#6E6248; --faint:#9C8F6F;
  --accent:#E06E15; --accent-2:#F0932E; --accent-ink:#FFFFFF; --accent-soft:#FBEEDC;
  --ok:#1E8E63; --ok-soft:#E4F3EB; --blue:#2B4C9B; --blue-soft:#E7ECF8;
  --amber:#C6A02F; --amber-soft:#F7EDD2; --slate:#7A6F57; --slate-soft:#EFE9DA;
  --violet:#1F8F86; --rose:#B33A2B;
  --ring:0 0 0 3px rgba(224,110,21,.28);
  --glass:rgba(255,252,242,.6); --glass-2:rgba(255,252,242,.44);
  --glass-brd:rgba(226,201,130,.5);
}
[data-theme="dark"]{
  --bg:#0B0A07; --bg-2:#121009; --surface:#181510; --surface-2:#201B12;
  --border:rgba(230,200,120,.15); --border-strong:rgba(230,200,120,.28);
  --ink:#F1E9D6; --muted:#B3A57F; --faint:#8A7D5C;
  --accent:#F0983F; --accent-2:#F5B269; --accent-ink:#241708; --accent-soft:rgba(240,152,63,.14);
  --ok:#4CC38A; --ok-soft:rgba(76,195,138,.14); --blue:#7C9BE8; --blue-soft:rgba(124,155,232,.14);
  --amber:#E8C766; --amber-soft:rgba(232,199,102,.14); --slate:#A99F82; --slate-soft:rgba(169,159,130,.13);
  --violet:#4FC1B4; --rose:#E8705C;
  --glass:rgba(26,22,14,.60); --glass-2:rgba(26,22,14,.44);
  --glass-brd:rgba(230,200,120,.16);
}

/* aurora: gold dust, lapis, faience, carnelian */
body::before{
  background:
    radial-gradient(38% 44% at 12% 8%, rgba(242,106,27,.26), transparent 60%),
    radial-gradient(30% 36% at 42% 4%, rgba(212,175,55,.22), transparent 60%),
    radial-gradient(34% 40% at 88% 12%, rgba(43,76,155,.22), transparent 60%),
    radial-gradient(42% 50% at 82% 92%, rgba(42,161,152,.18), transparent 62%),
    radial-gradient(38% 46% at 8% 88%, rgba(179,58,43,.14), transparent 60%);
}

/* orbs: the treasure room */
.sp-orbs i:nth-child(1){background:#F26A1B}
.sp-orbs i:nth-child(2){background:#D4AF37}
.sp-orbs i:nth-child(3){background:#2B4C9B}
.sp-orbs i:nth-child(4){background:#2AA198;opacity:.28}
.sp-orbs i:nth-child(5){background:#F2D98A}

/* gilded borders + warm bloom */
.card,.stat,.plist{
  background:
    linear-gradient(var(--glass),var(--glass)) padding-box,
    linear-gradient(135deg, rgba(242,106,27,.7), rgba(212,175,55,.5) 35%, rgba(242,217,138,.35) 55%, rgba(43,76,155,.42) 85%) border-box!important;
  box-shadow:0 14px 44px -14px rgba(226,110,21,.32), 0 0 30px -12px rgba(212,175,55,.28),
             inset 0 1px 0 rgba(255,250,230,.55)!important;
}
[data-theme="dark"] .card,[data-theme="dark"] .stat,[data-theme="dark"] .plist{
  background:
    linear-gradient(rgba(26,22,14,.85),rgba(26,22,14,.85)) padding-box,
    linear-gradient(135deg, rgba(240,152,63,.75), rgba(227,192,92,.55) 35%, rgba(242,217,138,.28) 55%, rgba(88,116,196,.45) 85%) border-box!important;
  box-shadow:0 18px 52px -14px rgba(0,0,0,.65), 0 0 34px -10px rgba(240,152,63,.3), 0 0 44px -14px rgba(212,175,55,.25),
             inset 0 1px 0 rgba(242,217,138,.1)!important;
}
.stat:hover,.card:hover{box-shadow:0 20px 56px -14px rgba(226,110,21,.45), 0 0 44px -10px rgba(212,175,55,.4),
  inset 0 1px 0 rgba(255,250,230,.6)!important}

/* hero: molten gold into lapis */
.stat.hero{
  background:linear-gradient(120deg,#F2D98A,#F0932E 28%,#F26A1B 52%,#C44D0C 74%,#2B4C9B 100%)!important;
  background-size:280% 280%!important;
  border:1px solid rgba(255,246,214,.5)!important;
  box-shadow:0 22px 60px -16px rgba(226,110,21,.55), 0 0 46px -10px rgba(212,175,55,.45)!important;
}
.stat.hero .lab,.stat.hero .hint{color:rgba(255,252,240,.9)}

/* numbers: burnished gold leaf */
.stat .val{background:linear-gradient(120deg,var(--accent) 20%,#D4AF37 85%);
  -webkit-background-clip:text;background-clip:text;
  filter:drop-shadow(0 0 12px rgba(226,140,40,.35))}
.section-t{background:linear-gradient(90deg,#E06E15,#C6A02F 45%,#2B4C9B);
  -webkit-background-clip:text;background-clip:text}
[data-theme="dark"] .section-t{background:linear-gradient(90deg,#F5B269,#F2D98A 45%,#7C9BE8);
  -webkit-background-clip:text;background-clip:text}
@keyframes spPulse{0%{box-shadow:0 0 0 0 rgba(242,106,27,.55)}70%{box-shadow:0 0 0 8px rgba(242,106,27,0)}100%{box-shadow:0 0 0 0 rgba(242,106,27,0)}}
.cd-seg b{filter:drop-shadow(0 0 10px rgba(226,140,40,.35))}
.btn-primary{background:linear-gradient(120deg,#F0932E,#F26A1B 60%,#D4AF37 130%)!important;color:#fff!important;
  box-shadow:0 8px 20px -8px rgba(226,110,21,.65), 0 0 18px -6px rgba(212,175,55,.5)!important}
.brand .mark{background:linear-gradient(140deg,#FFAE63 0%,#F26A1B 52%,#C44D0C 100%)!important;
  box-shadow:0 6px 16px -5px rgba(226,110,21,.7), 0 0 0 1px rgba(212,175,55,.45), inset 0 1px 0 rgba(255,250,230,.45)!important}
.brand .mark::after{background:#C44D0C!important}

/* ===== v10 — mark renders the EXACT app-icon artwork ===== */
.brand .mark{background:url("/static/brand/viritium-mark.png?v=18") center/cover no-repeat!important}
.brand .mark::before,.brand .mark::after{display:none!important}

/* ===== v11 — deeper dark: true obsidian vault ===== */
[data-theme="dark"]{
  --bg:#070604; --bg-2:#0B0906; --surface:#12100B; --surface-2:#17130D;
  --border:rgba(230,200,120,.12); --border-strong:rgba(230,200,120,.22);
  --glass:rgba(15,12,8,.78); --glass-2:rgba(15,12,8,.6);
  --glass-brd:rgba(230,200,120,.13);
  --accent-soft:rgba(240,152,63,.11);
}
[data-theme="dark"] body::before{opacity:.55;filter:blur(60px) saturate(105%) brightness(.7)}
[data-theme="dark"] .sp-orbs i{opacity:.16}
[data-theme="dark"] .card,[data-theme="dark"] .stat,[data-theme="dark"] .plist{
  background:
    linear-gradient(rgba(15,12,8,.94),rgba(15,12,8,.94)) padding-box,
    linear-gradient(135deg, rgba(240,152,63,.6), rgba(227,192,92,.42) 35%, rgba(242,217,138,.2) 55%, rgba(88,116,196,.34) 85%) border-box!important;
  box-shadow:0 18px 52px -14px rgba(0,0,0,.75), 0 0 30px -12px rgba(240,152,63,.22), 0 0 40px -16px rgba(212,175,55,.18),
             inset 0 1px 0 rgba(242,217,138,.07)!important;
}
[data-theme="dark"] .stat:hover,[data-theme="dark"] .card:hover{
  box-shadow:0 20px 56px -14px rgba(0,0,0,.8), 0 0 40px -10px rgba(240,152,63,.3), 0 0 44px -14px rgba(212,175,55,.24),
             inset 0 1px 0 rgba(242,217,138,.09)!important}
[data-theme="dark"] .sidebar,[data-theme="dark"] .topbar{
  background:rgba(13,11,7,.72)!important;border-color:rgba(230,200,120,.12)!important;
  box-shadow:0 16px 42px rgba(0,0,0,.6), inset 0 1px 0 rgba(242,217,138,.05)!important}
[data-theme="dark"] .prow:hover{background:rgba(242,217,138,.04)}

/* ===== v12 — hero number: pale gold leaf, glowing, with a living shine ===== */
.stat.hero .val{
  background:linear-gradient(115deg,#FFF7E0 5%,#F2D98A 35%,#FFFFFF 55%,#F5DFA0 75%,#FFF3D0 95%)!important;
  background-size:230% 100%!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  -webkit-text-fill-color:transparent!important;color:transparent!important;
  text-shadow:none!important;
  filter:drop-shadow(0 0 16px rgba(255,236,170,.55)) drop-shadow(0 2px 8px rgba(90,40,5,.35));
  animation:heroShine 5s ease-in-out infinite;
}
@keyframes heroShine{0%,100%{background-position:0% 0}50%{background-position:100% 0}}
.stat.hero .val .permo{-webkit-text-fill-color:transparent}
@media (prefers-reduced-motion: reduce){.stat.hero .val{animation:none}}

/* ===== kill page-level horizontal scroll (inner scrollers like tables keep theirs) ===== */
html,body{overflow-x:hidden;overflow-x:clip;max-width:100vw}

/* ===== v14 — warmer: orange leads by a full stride, gold follows ===== */
:root{
  --bg:#F8EEDD; --bg-2:#F3E5CC; --surface:#FFFCF4;
  --border:#EAD9BC; --amber:#CB9022; --accent-soft:#FCEBD6;
}
[data-theme="dark"]{
  --surface:#14100A; --accent-soft:rgba(240,152,63,.13);
}
body::before{
  background:
    radial-gradient(40% 46% at 12% 8%, rgba(242,106,27,.34), transparent 60%),
    radial-gradient(28% 34% at 44% 4%, rgba(212,175,55,.16), transparent 60%),
    radial-gradient(34% 40% at 88% 12%, rgba(43,76,155,.18), transparent 60%),
    radial-gradient(42% 50% at 82% 92%, rgba(42,161,152,.14), transparent 62%),
    radial-gradient(38% 46% at 8% 88%, rgba(255,140,60,.18), transparent 60%);
}
.sp-orbs i:nth-child(5){background:#FFAE63}
.sp-orbs i:nth-child(2){background:#E8B84A}
.card,.stat,.plist{
  background:
    linear-gradient(var(--glass),var(--glass)) padding-box,
    linear-gradient(135deg, rgba(242,106,27,.78), rgba(255,160,80,.5) 30%, rgba(212,175,55,.4) 55%, rgba(43,76,155,.36) 90%) border-box!important;
  box-shadow:0 14px 44px -14px rgba(230,105,20,.36), 0 0 30px -12px rgba(212,175,55,.24),
             inset 0 1px 0 rgba(255,246,228,.55)!important;
}
[data-theme="dark"] .card,[data-theme="dark"] .stat,[data-theme="dark"] .plist{
  background:
    linear-gradient(rgba(15,12,8,.94),rgba(15,12,8,.94)) padding-box,
    linear-gradient(135deg, rgba(242,120,40,.68), rgba(255,160,80,.4) 30%, rgba(227,192,92,.34) 58%, rgba(88,116,196,.3) 90%) border-box!important;
  box-shadow:0 18px 52px -14px rgba(0,0,0,.75), 0 0 30px -12px rgba(242,120,40,.26), 0 0 40px -16px rgba(212,175,55,.15),
             inset 0 1px 0 rgba(255,220,170,.07)!important;
}
.stat .val{background:linear-gradient(120deg,var(--accent) 45%,#D8A930 110%);
  -webkit-background-clip:text;background-clip:text;
  filter:drop-shadow(0 0 12px rgba(240,130,40,.4))}
.stat.hero{background:linear-gradient(120deg,#F5C86B,#F0932E 22%,#F26A1B 52%,#D0500D 80%,#2B4C9B 112%)!important;
  background-size:280% 280%!important}
.section-t{background:linear-gradient(90deg,#E06E15 30%,#C6A02F 75%,#2B4C9B 130%);
  -webkit-background-clip:text;background-clip:text}
[data-theme="dark"] .section-t{background:linear-gradient(90deg,#F5A95C 30%,#EDCB6E 75%,#7C9BE8 130%);
  -webkit-background-clip:text;background-clip:text}

/* ===== v16 — dark mode: kill the warm wash; portal-grade darkness, same jewels ===== */
[data-theme="dark"]{--bg:#080706;--bg-2:#0B0906}
[data-theme="dark"] body::before{opacity:.28;filter:blur(66px) saturate(95%) brightness(.5)}
[data-theme="dark"] .sp-orbs i{opacity:.10;filter:blur(72px)}
[data-theme="dark"] .sidebar,[data-theme="dark"] .topbar{
  background:rgba(10,8,5,.85)!important;border-color:rgba(230,200,120,.10)!important}
[data-theme="dark"] .card,[data-theme="dark"] .stat,[data-theme="dark"] .plist{
  background:
    linear-gradient(rgba(12,10,7,.96),rgba(12,10,7,.96)) padding-box,
    linear-gradient(135deg, rgba(242,120,40,.55), rgba(255,160,80,.32) 30%, rgba(227,192,92,.28) 58%, rgba(88,116,196,.24) 90%) border-box!important;
}

/* ===== v17 — EMERALD REBRAND: match the product (ink #0D1117 + emerald #10A37F).
   Final layer on purpose — it must out-cascade v14's warm !important rules. ===== */
:root{
  --bg:#F4F6F8; --bg-2:#ECEEF2; --surface:#FFFFFF; --surface-2:#FAFBFC;
  --border:#E5E8EC; --border-strong:#D7DAE1;
  --accent:#0B7A5F; --accent-2:#10A37F; --accent-ink:#FFFFFF; --accent-soft:#E9F7F2;
  --ring:0 0 0 3px rgba(16,163,127,.28);
}
[data-theme="dark"]{
  --bg:#0D1014; --bg-2:#0B0E12; --surface:#151922; --surface-2:#1B202B;
  --accent:#2BC79B; --accent-2:#4ADDB8; --accent-ink:#06251C;
  --accent-soft:rgba(16,163,127,.14);
}
body::before{
  background:
    radial-gradient(40% 46% at 12% 8%, rgba(16,163,127,.30), transparent 60%),
    radial-gradient(28% 34% at 44% 4%, rgba(74,221,184,.14), transparent 60%),
    radial-gradient(34% 40% at 88% 12%, rgba(43,76,155,.18), transparent 60%),
    radial-gradient(42% 50% at 82% 92%, rgba(42,161,152,.14), transparent 62%),
    radial-gradient(38% 46% at 8% 88%, rgba(16,163,127,.16), transparent 60%);
}
.sp-orbs i:nth-child(1){background:#10A37F}
.sp-orbs i:nth-child(2){background:#7C4DFF}
.sp-orbs i:nth-child(3){background:#00C2A8}
.sp-orbs i:nth-child(4){background:#3D8BFF}
.sp-orbs i:nth-child(5){background:#4ADDB8}
.card,.stat,.plist{
  background:
    linear-gradient(var(--glass),var(--glass)) padding-box,
    linear-gradient(135deg, rgba(16,163,127,.72), rgba(74,221,184,.48) 30%, rgba(43,199,155,.38) 55%, rgba(43,76,155,.36) 90%) border-box!important;
  box-shadow:0 14px 44px -14px rgba(12,130,102,.34), 0 0 30px -12px rgba(74,221,184,.22),
             inset 0 1px 0 rgba(240,252,248,.55)!important;
}
.stat:hover,.card:hover{box-shadow:0 20px 56px -14px rgba(16,163,127,.42), 0 0 44px -10px rgba(124,77,255,.30),
  inset 0 1px 0 rgba(255,255,255,.5)!important}
[data-theme="dark"] .card,[data-theme="dark"] .stat,[data-theme="dark"] .plist{
  background:
    linear-gradient(rgba(10,13,12,.96),rgba(10,13,12,.96)) padding-box,
    linear-gradient(135deg, rgba(16,163,127,.60), rgba(74,221,184,.34) 30%, rgba(43,199,155,.30) 58%, rgba(88,116,196,.26) 90%) border-box!important;
  box-shadow:0 18px 52px -14px rgba(0,0,0,.75), 0 0 30px -12px rgba(16,163,127,.28), 0 0 40px -16px rgba(74,221,184,.14),
             inset 0 1px 0 rgba(190,240,225,.07)!important;
}
[data-theme="dark"] .sidebar,[data-theme="dark"] .topbar{
  background:rgba(8,11,10,.85)!important;border-color:rgba(74,221,184,.10)!important}
.stat.hero{background:linear-gradient(120deg,#7FE0C6,#2BC79B 22%,#10A37F 52%,#0B7A5F 80%,#2B4C9B 112%)!important;
  background-size:280% 280%!important;
  border:1px solid rgba(230,250,244,.5)!important;
  box-shadow:0 22px 60px -16px rgba(12,130,102,.55), 0 0 46px -10px rgba(74,221,184,.40)!important}
.stat .val{background:linear-gradient(120deg,var(--accent) 45%,#2BC79B 110%);
  -webkit-background-clip:text;background-clip:text;
  filter:drop-shadow(0 0 12px rgba(16,163,127,.35))}
.stat.hero .val{background:none;-webkit-text-fill-color:#fff;filter:none}
.section-t{background:linear-gradient(90deg,#0B7A5F 30%,#10A37F 75%,#2B4C9B 130%);
  -webkit-background-clip:text;background-clip:text}
[data-theme="dark"] .section-t{background:linear-gradient(90deg,#4ADDB8 30%,#7FE0C6 75%,#7C9BE8 130%);
  -webkit-background-clip:text;background-clip:text}
.btn-primary{background:linear-gradient(120deg,#2BC79B,#10A37F 60%,#0B7A5F 130%)!important;color:#fff!important;
  box-shadow:0 8px 20px -8px rgba(12,130,102,.65), 0 0 18px -6px rgba(74,221,184,.45)!important}
@keyframes spPulse{0%{box-shadow:0 0 0 0 rgba(16,163,127,.55)}70%{box-shadow:0 0 0 8px rgba(16,163,127,0)}100%{box-shadow:0 0 0 0 rgba(16,163,127,0)}}
.cd-seg b{filter:drop-shadow(0 0 10px rgba(16,163,127,.35))}
/* the mark IS the app icon — ink tile, white V, emerald i; no legacy lens layers */
.brand .mark{background:url("/static/brand/apple-touch-icon.png") center/cover no-repeat!important;
  box-shadow:0 6px 16px -5px rgba(13,17,23,.6), 0 0 0 1px rgba(16,163,127,.35)!important}
.brand .mark::before,.brand .mark::after{content:none!important}

/* v17 (cont.) — reclaim the neutrals + glass + status hues from the v8 warm
   treasury block, and the v12 gold-leaf hero number. Cool ink everywhere. */
:root{
  --ink:#13161C; --muted:#616875; --faint:#98A0AD;
  --ok:#16A34A; --ok-soft:#E7F6ED; --blue:#2563EB; --blue-soft:#E8EFFE;
  --amber:#D98A15; --amber-soft:#FBF1DC; --slate:#64748B; --slate-soft:#EEF1F5;
  --violet:#6D54E6; --rose:#E11D48;
  --glass:rgba(255,255,255,.62); --glass-2:rgba(255,255,255,.46);
  --glass-brd:rgba(150,220,200,.45);
}
[data-theme="dark"]{
  --ink:#E8EBF1; --muted:#98A1AE; --faint:#6B7382;
  --border:rgba(255,255,255,.08); --border-strong:rgba(255,255,255,.15);
  --ok:#3DDC84; --ok-soft:rgba(61,220,132,.13); --blue:#5B8BFF; --blue-soft:rgba(91,139,255,.14);
  --amber:#F0B03C; --amber-soft:rgba(240,176,60,.14); --slate:#93A0B4; --slate-soft:rgba(147,160,180,.13);
  --violet:#9B86FF; --rose:#FF6B8A;
  --glass:rgba(14,19,17,.60); --glass-2:rgba(14,19,17,.44);
  --glass-brd:rgba(74,221,184,.16);
}
[data-theme="dark"] .prow:hover{background:rgba(74,221,184,.05)}
.stat.hero .val{
  background:linear-gradient(115deg,#EFFFF9 5%,#9FF0D8 35%,#FFFFFF 55%,#7FE0C6 75%,#E9FFF7 95%)!important;
  background-size:230% 100%!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  -webkit-text-fill-color:transparent!important;color:transparent!important;
  filter:drop-shadow(0 0 16px rgba(153,240,214,.55)) drop-shadow(0 2px 8px rgba(5,60,45,.35));
}

/* ===== v18 — mobile fixes ================================================
   1. Topbar action buttons (Dossier / Route / Call) used to sit on one
      non-wrapping row and get pushed off-screen right on phones — the topbar
      now wraps and the actions flow onto their own full-width row.
   2. Stat tiles: the auto-fit minmax(178px,…) grid could not shrink below
      178px/column, so two columns overflowed narrow phones and the big $
      values were clipped by the body overflow guard. Tiles can now shrink
      (minmax(0,1fr)), values scale with the viewport, and the hero tile
      takes the full row so the biggest number always fits.
   3. Key/value + deal rows get min-width:0 / wrapping so long values
      (target price, addresses, payment lines) never push the layout. */
@media(max-width:900px){
  .topbar{flex-wrap:wrap;gap:10px 12px}
  .topbar>div:first-child{min-width:0}
  .topbar h1{overflow-wrap:anywhere}
  .top-actions{flex-wrap:wrap;width:100%;justify-content:flex-start;gap:8px}
}
@media(max-width:560px){
  .top-actions .btn{padding:8px 12px;font-size:12.5px}
  .top-actions .btn svg{width:14px;height:14px}
  .stat-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .stat{min-width:0;padding:13px 13px}
  .stat .val{font-size:clamp(17px,5.8vw,24px);letter-spacing:-.03em}
  .stat .permo{font-size:11px}
  .stat .hint{font-size:10.5px}
  .stat.hero{grid-column:1/-1}
  .stat.hero .val{font-size:clamp(22px,8vw,30px)}
  .kv{grid-template-columns:96px minmax(0,1fr)}
  .kv dd{min-width:0;overflow-wrap:anywhere}
  .between{min-width:0}
  .deal-card .between{flex-wrap:wrap}
  .deal-card .muted{overflow-wrap:anywhere}
  .prow .price,.prow .num{overflow-wrap:anywhere}
  .wrap-actions select,.wrap-actions .input{max-width:100%!important;flex:1 1 140px}
}
/* ledger tables scroll inside their card instead of clipping */
.ledger-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
@media(max-width:560px){
  .ledger{min-width:520px}
}

/* Unhighlightable UI (Cole, 2026-07-12): no text selection anywhere; form
   fields stay editable/selectable so typing + cursor placement still work. */
*{-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-touch-callout:none}
input,textarea,select,[contenteditable="true"]{-webkit-user-select:text;-moz-user-select:text;user-select:text}

/* ---- cold-call difficulty color coding + rep assignment ---- */
.prow{border-left:4px solid transparent}
.prow.d-easy{border-left-color:#10A37F;background:linear-gradient(90deg,rgba(16,163,127,.07),transparent 40%)}
.prow.d-medium{border-left-color:#3D8BFF;background:linear-gradient(90deg,rgba(61,139,255,.07),transparent 40%)}
.prow.d-hard{border-left-color:#E0A44A;background:linear-gradient(90deg,rgba(224,164,74,.09),transparent 40%)}
.prow.d-expert{border-left-color:#E5484D;background:linear-gradient(90deg,rgba(229,72,77,.09),transparent 40%)}
.diff-chip{font-size:9px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  padding:2px 8px;border-radius:999px;margin-left:8px;white-space:nowrap;vertical-align:1px}
.dc-easy{color:#10A37F;background:rgba(16,163,127,.14);border:1px solid rgba(16,163,127,.35)}
.dc-medium{color:#3D8BFF;background:rgba(61,139,255,.12);border:1px solid rgba(61,139,255,.35)}
.dc-hard{color:#E0A44A;background:rgba(224,164,74,.14);border:1px solid rgba(224,164,74,.4)}
.dc-expert{color:#E5484D;background:rgba(229,72,77,.12);border:1px solid rgba(229,72,77,.4)}
.rep-chip{display:inline-flex;align-items:center;gap:6px;font-size:10.5px;font-weight:800;
  padding:2px 9px 2px 3px;border-radius:999px;margin-left:8px;white-space:nowrap;vertical-align:1px;
  border:1px solid rgba(124,77,255,.4);color:#9b7bff;background:rgba(124,77,255,.10)}
.rep-chip i{width:16px;height:16px;border-radius:50%;background:#7C4DFF;color:#fff;font-style:normal;
  display:inline-flex;align-items:center;justify-content:center;font-size:9px}
.rep-chip.rc-carl-gallagher{border-color:rgba(61,139,255,.4);color:#5ea3ff;background:rgba(61,139,255,.10)}
.rep-chip.rc-carl-gallagher i{background:#3D8BFF}
.assign-btn{font:inherit;font-size:10.5px;font-weight:800;padding:3px 10px;border-radius:999px;
  margin-left:6px;cursor:pointer;border:1px dashed rgba(16,163,127,.5);
  background:transparent;color:#10A37F;transition:all .12s;vertical-align:1px}
.assign-btn:hover{background:#10A37F;color:#fff;border-style:solid}
.diff-legend{display:flex;gap:16px;align-items:center;font-size:11.5px;margin:2px 0 10px;
  color:var(--muted,#8A94A2)}
.diff-legend b{font-size:10px;text-transform:uppercase;letter-spacing:.07em}
.diff-legend span{display:inline-flex;align-items:center;gap:6px}
.diff-legend i{width:10px;height:10px;border-radius:3px;display:inline-block;border:0!important}
.diff-legend i.dc-easy{background:#10A37F}.diff-legend i.dc-medium{background:#3D8BFF}
.diff-legend i.dc-hard{background:#E0A44A}.diff-legend i.dc-expert{background:#E5484D}

/* next-best-call queue */
.nbq{margin:0 0 14px;border:1px solid var(--sl-border,#E5E8EC);border-radius:16px;padding:12px 14px;background:var(--sl-surface,#fff)}
.nbq-hd{display:flex;align-items:baseline;gap:10px;margin:0 0 9px;font-size:13px}
.nbq-hd span{font-size:11px;color:#8A8F98}
.nbq-row{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px}
.nbq-card{flex:none;width:172px;border:1px solid var(--sl-border,#E5E8EC);border-left-width:4px;border-radius:12px;
  padding:9px 11px;text-decoration:none;color:inherit;background:var(--sl-bg,#fff)}
.nbq-card b{display:block;font-size:12px;margin-bottom:3px}
.nbq-card span{font-size:10.5px;color:#8A8F98;line-height:1.4;display:block}
.nbq-card:hover{border-color:#10A37F}