/* FF360 (ACI Pharmaceuticals) - white & purple design system */
:root{
  --bg:#f6f3ff; --card:#fff; --ink:#1d1235; --mute:#6a6286; --faint:#a39dbb; --line:#ebe6fa; --line2:#f3effc;
  --p50:#f6f2ff; --p100:#ede6ff; --p200:#ddd1ff; --p300:#c6b3fc; --p400:#a98cf8; --p500:#8b5cf6; --p600:#7c3aed; --p700:#6d28d9; --p800:#5b21b6; --p900:#3b1a7a;
  --good:#10a355; --goodbg:#e5f7ed; --warn:#d97706; --warnbg:#fff3df; --bad:#e11d48; --badbg:#ffe9ee; --blue:#2f6bf0; --bluebg:#e8f0ff;
  --sh:0 1px 2px rgba(59,26,122,.05),0 14px 34px rgba(109,40,217,.09); --sh2:0 2px 6px rgba(59,26,122,.08),0 22px 50px rgba(109,40,217,.18);
  --r:18px; --font:"Segoe UI Variable Display","Segoe UI",Inter,system-ui,-apple-system,Roboto,sans-serif;
  --c-JOIN:#10a355;--c-TRANSFER:#7c3aed;--c-PROMOTION:#2f6bf0;--c-RESIGN:#e11d48;--c-REJOIN:#0e9aa7;--c-BUFFER:#d97706;--c-LEAVE:#0284c7;--c-TERR_ADD:#c026d3;--c-TERR_SHIFT:#9333ea;--c-TERR_CLOSE:#64748b;--c-EMP_INFO:#0e7490;--c-VERIFY:#0f9d8a;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.5 var(--font);-webkit-font-smoothing:antialiased;min-height:100vh}
body:before{content:"";position:fixed;inset:0;z-index:-1;background:radial-gradient(900px 500px at 8% -10%,#e6dcff 0,transparent 60%),radial-gradient(800px 500px at 100% 0,#f3dcff 0,transparent 55%),var(--bg)}
a{color:var(--p700);text-decoration:none;cursor:pointer}a:hover{text-decoration:underline}
svg{width:18px;height:18px;flex:none}
h1,h2,h3{margin:0;font-weight:700;letter-spacing:-.01em}
button,input,select,textarea{font:inherit;color:inherit}
.mono{font-family:Consolas,"Cascadia Mono",monospace;font-size:.93em}
.mute{color:var(--mute)}.faint{color:var(--faint)}.xs{font-size:12px}.sm{font-size:13px}.b{font-weight:700}
.row{display:flex;align-items:center;gap:10px}.wrap{flex-wrap:wrap}.grow{flex:1;min-width:0}.right{margin-left:auto}.col{display:flex;flex-direction:column;gap:10px}
.ell{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hide{display:none!important}
.sp{height:14px}.sp2{height:26px}

/* ------------------------------------------------------------ top bar */
#top{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.82);backdrop-filter:blur(14px) saturate(1.4);border-bottom:1px solid var(--line);height:64px;display:flex;align-items:center;gap:22px;padding:0 28px}
.logo{display:flex;align-items:center;gap:11px;font-weight:800;font-size:17px;letter-spacing:-.02em;color:var(--p900);cursor:pointer;white-space:nowrap}
.logo i{width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,var(--p600),#c026d3);display:grid;place-items:center;color:#fff;box-shadow:0 6px 16px rgba(124,58,237,.4);font-style:normal;font-size:18px;position:relative;overflow:hidden}
.logo i:after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);transform:translateX(-120%);animation:shine 4.5s infinite}
.logo small{display:block;font-size:10.5px;font-weight:600;color:var(--faint);letter-spacing:.14em;text-transform:uppercase;margin-top:-2px}
@keyframes shine{40%,100%{transform:translateX(120%)}}
#nav{display:flex;gap:2px;position:relative;margin-left:8px}
#nav a{position:relative;padding:9px 15px;border-radius:11px;color:var(--mute);font-weight:600;display:flex;align-items:center;gap:8px;transition:color .2s,background .2s;z-index:1}
#nav a:hover{color:var(--p800);text-decoration:none;background:var(--p50)}
#nav a.on{color:var(--p800)}
#navpill{position:absolute;top:0;bottom:0;border-radius:11px;background:var(--p100);transition:left .35s cubic-bezier(.5,1.4,.5,1),width .35s cubic-bezier(.5,1.4,.5,1);z-index:0}
.nb{min-width:19px;height:19px;border-radius:10px;background:var(--bad);color:#fff;font-size:11px;display:grid;place-items:center;padding:0 5px;font-weight:700;animation:pulse 2.4s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(225,29,72,.45)}70%,100%{box-shadow:0 0 0 8px rgba(225,29,72,0)}}
.tright{margin-left:auto;display:flex;align-items:center;gap:12px}
.sbtn{display:flex;align-items:center;gap:9px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px 12px;color:var(--faint);cursor:pointer;min-width:200px;transition:.2s}
.sbtn:hover{border-color:var(--p300);box-shadow:0 0 0 4px var(--p50)}
.sbtn kbd{margin-left:auto;font:11px var(--font);background:var(--p50);color:var(--p700);border-radius:6px;padding:1px 6px}
.me{display:flex;align-items:center;gap:10px;cursor:pointer;padding:5px 10px 5px 5px;border-radius:30px;border:1px solid var(--line);background:#fff;position:relative}
.me:hover{border-color:var(--p300)}
.av{border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:700;flex:none;letter-spacing:.02em}
.role{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:2px 8px;border-radius:20px}
.role.Manager{background:linear-gradient(135deg,var(--p600),#c026d3);color:#fff}.role.Executive{background:var(--p100);color:var(--p800)}
.menu{position:absolute;right:0;top:48px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--sh2);padding:6px;min-width:210px;z-index:60;animation:pop .18s both}
.menu a,.menu div.it{display:flex;gap:10px;align-items:center;padding:9px 12px;border-radius:9px;color:var(--ink);cursor:pointer;font-weight:500}
.menu a:hover,.menu div.it:hover{background:var(--p50);text-decoration:none;color:var(--p800)}
@keyframes pop{from{opacity:0;transform:translateY(-6px) scale(.98)}}

/* ------------------------------------------------------------ page frame */
#view{max-width:1440px;margin:0 auto;padding:26px 28px 80px;min-height:calc(100vh - 64px)}
.page{animation:rise .5s both}
@keyframes rise{from{opacity:0;transform:translateY(14px)}}
.rv{opacity:0;transform:translateY(18px);transition:opacity .6s,transform .6s cubic-bezier(.2,.8,.2,1)}.rv.in{opacity:1;transform:none}
.phead{display:flex;align-items:flex-end;gap:16px;margin-bottom:20px;flex-wrap:wrap}
.phead h1{font-size:28px;font-weight:800;letter-spacing:-.025em;color:var(--p900)}
.phead p{margin:3px 0 0;color:var(--mute)}
.crumb{font-size:12px;color:var(--faint);margin-bottom:6px;display:flex;gap:6px;align-items:center}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:22px}
.card.flat{box-shadow:none}.card.tight{padding:14px 16px}.card.soft{background:var(--p50);box-shadow:none}
.ctitle{display:flex;align-items:center;gap:10px;font-weight:700;font-size:15px;margin-bottom:14px;color:var(--p900)}
.ctitle svg{color:var(--p600)}
.grid{display:grid;gap:18px}.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
.split{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:20px}
.split3{display:grid;grid-template-columns:minmax(300px,380px) minmax(0,1fr);gap:20px;align-items:start}
@media(max-width:1100px){.split,.split3,.g4,.g3{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.split,.split3,.g2,.g3,.g4{grid-template-columns:1fr}#nav a span{display:none}#top{padding:0 14px;gap:10px}.sbtn{min-width:0}.sbtn span,.sbtn kbd{display:none}}

/* ------------------------------------------------------------ buttons / inputs */
.btn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:#fff;border-radius:11px;padding:9px 15px;font-weight:600;cursor:pointer;color:var(--p800);transition:transform .15s,box-shadow .2s,background .2s,border-color .2s;white-space:nowrap}
.btn:hover{border-color:var(--p300);background:var(--p50);transform:translateY(-1px);text-decoration:none}
.btn:active{transform:none}
.btn.pri{background:linear-gradient(135deg,var(--p600),var(--p700) 55%,#a21caf);color:#fff;border-color:transparent;box-shadow:0 6px 18px rgba(124,58,237,.35)}
.btn.pri:hover{box-shadow:0 10px 26px rgba(124,58,237,.45);background:linear-gradient(135deg,var(--p500),var(--p700) 55%,#a21caf)}
.btn.good{color:var(--good);border-color:#bfe9d1}.btn.good:hover{background:var(--goodbg)}
.btn.bad{color:var(--bad);border-color:#fbc5d1}.btn.bad:hover{background:var(--badbg)}
.btn.sm{padding:5px 11px;font-size:12.5px;border-radius:9px}.btn.lg{padding:12px 22px;font-size:15px;border-radius:13px}
.btn[disabled]{opacity:.45;pointer-events:none;box-shadow:none}
.ibtn{width:34px;height:34px;border-radius:10px;border:1px solid var(--line);background:#fff;display:grid;place-items:center;cursor:pointer;color:var(--mute)}.ibtn:hover{background:var(--p50);color:var(--p700)}
.in,select.in,textarea.in{width:100%;border:1.5px solid var(--line);background:#fff;border-radius:11px;padding:9px 12px;outline:none;transition:border-color .2s,box-shadow .2s}
.in:focus{border-color:var(--p500);box-shadow:0 0 0 4px rgba(139,92,246,.15)}
.in.err{border-color:var(--bad)}
label.f{display:block;font-size:12px;font-weight:600;color:var(--mute);margin:0 0 5px;letter-spacing:.01em}
.field{margin-bottom:13px}
.chk{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:13px}.chk input{accent-color:var(--p600);width:16px;height:16px}
.seg{display:inline-flex;background:var(--p50);border:1px solid var(--line);border-radius:13px;padding:3px;gap:2px;flex-wrap:wrap}
.seg button{border:0;background:none;padding:7px 14px;border-radius:10px;font-weight:600;color:var(--mute);cursor:pointer;transition:.2s;display:flex;align-items:center;gap:7px}
.seg button:hover{color:var(--p800)}.seg button.on{background:#fff;color:var(--p800);box-shadow:0 2px 8px rgba(109,40,217,.15)}
.seg .n{font-size:11px;background:var(--p100);color:var(--p800);border-radius:9px;padding:0 7px}
.toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.pill{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;padding:3px 10px;border-radius:20px;background:var(--p50);color:var(--p800);white-space:nowrap}
.pill svg{width:12px;height:12px}
.pill.good{background:var(--goodbg);color:var(--good)}.pill.warn{background:var(--warnbg);color:var(--warn)}.pill.bad{background:var(--badbg);color:var(--bad)}.pill.blue{background:var(--bluebg);color:var(--blue)}.pill.gray{background:#f1eff6;color:#6b6585}
.vac{font-size:10.5px;font-weight:800;letter-spacing:.08em;color:var(--bad);background:var(--badbg);padding:2px 8px;border-radius:7px}
.tchip{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;padding:3px 10px 3px 8px;border-radius:9px;color:var(--tc);background:color-mix(in srgb,var(--tc) 11%,#fff);white-space:nowrap}
.tchip svg{width:14px;height:14px}
.lvl{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:7px;font-size:11px;font-weight:800;color:#fff;background:var(--p500)}
.lvl.l1{background:#a78bfa}.lvl.l2{background:#8b5cf6}.lvl.l3{background:#6d28d9}.lvl.l4{background:#3b1a7a}.lvl.l0{background:#cbc5de}
.sep{height:1px;background:var(--line);margin:18px 0}
.empty{display:grid;place-items:center;gap:8px;padding:44px 20px;color:var(--faint);text-align:center}.empty svg{width:40px;height:40px;opacity:.5}

/* ------------------------------------------------------------ tables */
.tscroll{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);overflow:auto;max-height:calc(100vh - 290px)}
.tbl{width:100%;border-collapse:separate;border-spacing:0}
.tbl th{position:sticky;top:0;background:var(--p50);color:var(--p800);font-size:11.5px;text-transform:uppercase;letter-spacing:.07em;text-align:left;padding:11px 14px;border-bottom:1px solid var(--line);white-space:nowrap;z-index:2}
.tbl td{padding:10px 14px;border-bottom:1px solid var(--line2);vertical-align:middle}
.tbl tbody tr{cursor:pointer;transition:background .15s;animation:rise .4s both}
.tbl tbody tr:hover{background:var(--p50)}
.tbl tbody tr:last-child td{border-bottom:0}
.tbl .num{text-align:right;font-variant-numeric:tabular-nums}
.ck{width:34px}

/* ------------------------------------------------------------ HOME hero */
.hero{position:relative;border-radius:28px;overflow:hidden;color:#fff;padding:34px 38px 92px;background:linear-gradient(115deg,#3b1a7a,#5b21b6 28%,#7c3aed 58%,#b02ee0 85%,#d946ef);background-size:240% 240%;animation:flow 16s ease-in-out infinite;box-shadow:0 24px 60px rgba(91,33,182,.35)}
@keyframes flow{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}
.hero canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.85}
.hero .orb{position:absolute;border-radius:50%;filter:blur(40px);opacity:.45;animation:float 11s ease-in-out infinite}
.hero .o1{width:340px;height:340px;background:#e879f9;right:-60px;top:-120px}.hero .o2{width:260px;height:260px;background:#60a5fa;left:35%;bottom:-150px;animation-delay:-4s}.hero .o3{width:180px;height:180px;background:#fff;left:-40px;top:20px;opacity:.18;animation-delay:-7s}
@keyframes float{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(24px,-22px) scale(1.12)}}
.hero-in{position:relative;z-index:2;display:flex;gap:30px;align-items:flex-end;flex-wrap:wrap}
.hello{font-size:13px;letter-spacing:.2em;text-transform:uppercase;font-weight:700;opacity:.8}
.hero h1{font-size:40px;font-weight:800;letter-spacing:-.03em;margin:6px 0 4px;line-height:1.1}
.hero h1 span{display:inline-block;opacity:0;transform:translateY(18px);animation:wordin .7s cubic-bezier(.2,.9,.2,1) forwards}
@keyframes wordin{to{opacity:1;transform:none}}
.hero p{margin:0;opacity:.85;max-width:560px}
.hstats{margin-left:auto;display:flex;gap:12px;flex-wrap:wrap}
.hstat{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(10px);border-radius:16px;padding:12px 18px;min-width:116px;cursor:pointer;transition:.25s}
.hstat:hover{background:rgba(255,255,255,.24);transform:translateY(-3px)}
.hstat b{display:block;font-size:28px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1.1}
.hstat span{font-size:11.5px;opacity:.85;letter-spacing:.05em;text-transform:uppercase;font-weight:600}
.wave{position:absolute;left:0;right:0;bottom:-1px;height:70px;z-index:1}
.wave path{animation:wv 9s ease-in-out infinite alternate}.wave path:nth-child(2){animation-duration:13s;opacity:.5}
@keyframes wv{to{transform:translateX(-60px)}}
.lift{margin-top:-62px;position:relative;z-index:5}

/* ------------------------------------------------------------ SBU matrix */
.mhead{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.mhead h2{font-size:20px;color:var(--p900);font-weight:800}
.pills{display:flex;gap:7px;overflow:auto;padding:2px 2px 6px;max-width:100%}
.mp{border:1.5px solid var(--line);background:#fff;border-radius:30px;padding:6px 14px;font-weight:600;color:var(--mute);cursor:pointer;white-space:nowrap;display:flex;gap:6px;align-items:center;transition:.2s}
.mp:hover{border-color:var(--p300);color:var(--p800)}.mp.on{background:linear-gradient(135deg,var(--p600),var(--p800));border-color:transparent;color:#fff;box-shadow:0 6px 16px rgba(124,58,237,.35)}
.mp svg{width:13px;height:13px}
.srcline{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:12.5px;color:var(--mute);padding:9px 14px;border-radius:12px;background:var(--p50);margin-bottom:16px}
.srcline.locked{background:linear-gradient(90deg,#fff3df,#fff8ec);color:#92580a}
.matrix{width:100%;border-collapse:separate;border-spacing:0;font-variant-numeric:tabular-nums;overflow:hidden;border-radius:16px;border:1px solid var(--line)}
.matrix th,.matrix td{padding:11px 10px;text-align:center;border-bottom:1px solid #fff;border-right:1px solid #fff}
.matrix thead th{font-size:12.5px;font-weight:800;letter-spacing:.02em;color:#2a1257}
.matrix .gT{background:#ede6ff}.matrix .gA{background:#dcf5e8}.matrix .gV{background:#ffe3ea}.matrix .gN{background:#e9e4f5}
.matrix thead .s2 th{font-size:11.5px;font-weight:700}
.matrix thead .sbh{background:linear-gradient(135deg,#7c3aed,#9333ea);color:#fff;text-align:left;padding-left:16px;font-size:13px}
.matrix tbody th{text-align:left;padding-left:16px;font-weight:700;background:#faf8ff;color:var(--p900);white-space:nowrap}
.matrix td.cT{background:#f6f1ff}.matrix td.cA{background:#ecfaf2}.matrix td.cV{background:#fff2f5}.matrix td.cN{background:#f3f0fa}
.matrix td{font-size:15px;font-weight:600;position:relative;transition:filter .2s,transform .2s}
.matrix td.hv{cursor:pointer}.matrix td.hv:hover{filter:brightness(.95);box-shadow:inset 0 0 0 2px var(--p400)}
.matrix td.z{color:#b3add0;font-weight:500}
.matrix td.merged{font-size:18px;font-weight:800;color:var(--p900)}
.matrix .vv{display:inline-block;min-width:34px;padding:2px 9px;border-radius:20px;background:#ffd1db;color:#b4143a;font-weight:800}
.matrix .vv.zero{background:transparent;color:#b3add0;font-weight:500}
.matrix .bar{position:absolute;left:12%;right:12%;bottom:5px;height:3px;border-radius:3px;background:rgba(16,163,85,.18);overflow:hidden}.matrix .bar i{display:block;height:100%;background:var(--good);width:0;transition:width 1.2s cubic-bezier(.2,.8,.2,1)}
.matrix tr.nat th,.matrix tr.nat td{background:linear-gradient(90deg,#5b21b6,#7c3aed);color:#fff;font-weight:800;font-size:15px;position:relative;overflow:hidden}
.matrix tr.nat td.vN{background:linear-gradient(90deg,#be185d,#e11d48)}
.matrix tr.nat:after{content:""}
.matrix tr.nat td:first-child,.matrix tr.nat th{background:linear-gradient(90deg,#3b1a7a,#5b21b6)}
.matrix tr.grand td{font-size:20px;font-weight:800;padding:13px}
.matrix tr.grand .a{background:#bde8d1;color:#0b6b38}.matrix tr.grand .t{background:#d9c9ff;color:#3b1a7a}.matrix tr.grand .v{background:#ffc4d1;color:#9d1236}
.nvbox{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:14px;background:var(--warnbg);color:var(--warn);font-size:22px;font-weight:800}
.matrix td.nvc{background:#faf7ff}
.mini{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.mini .chip{display:flex;align-items:center;gap:9px;background:#fff;border:1px solid var(--line);border-radius:13px;padding:8px 14px;font-size:12.5px;color:var(--mute);cursor:pointer;transition:.2s}
.mini .chip:hover{border-color:var(--p300);transform:translateY(-2px)}.mini .chip b{font-size:17px;color:var(--p900)}

/* action tiles */
.tiles{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
@media(max-width:1250px){.tiles{grid-template-columns:repeat(4,1fr)}}@media(max-width:800px){.tiles{grid-template-columns:repeat(2,1fr)}}
.tile{position:relative;background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px 16px 16px;cursor:pointer;display:flex;flex-direction:column;gap:12px;overflow:hidden;transition:transform .25s cubic-bezier(.2,.9,.3,1.2),box-shadow .25s,border-color .25s;animation:tilein .6s both;min-height:112px}
.tile:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,var(--tc1,#8b5cf6),var(--tc2,#c026d3));opacity:0;transition:opacity .3s}
.tile:hover{transform:translateY(-6px) rotate(-.4deg);box-shadow:0 18px 40px rgba(109,40,217,.28);border-color:transparent}.tile:hover:before{opacity:1}
.tile *{position:relative;transition:color .25s}
.tile:hover b,.tile:hover small{color:#fff}.tile:hover .ti{background:rgba(255,255,255,.22);color:#fff;transform:scale(1.08) rotate(-6deg)}
.ti{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,var(--tc1,#8b5cf6),var(--tc2,#c026d3));color:#fff;transition:.3s cubic-bezier(.3,1.5,.5,1);box-shadow:0 8px 18px color-mix(in srgb,var(--tc1,#8b5cf6) 40%,transparent)}.ti svg{width:22px;height:22px}
.tile b{font-size:14px;line-height:1.2;color:var(--ink)}.tile small{color:var(--faint);font-size:11.5px;line-height:1.3;display:block;margin-top:2px}
.tile .tb{position:absolute;right:12px;top:12px;min-width:24px;height:24px;border-radius:12px;background:var(--bad);color:#fff;font-size:12px;font-weight:800;display:grid;place-items:center;padding:0 7px;z-index:2}.tile .tb.y{background:var(--warn)}.tile .tb.p{background:var(--p600)}
@keyframes tilein{from{opacity:0;transform:translateY(22px) scale(.94)}}
.more{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.more .btn{background:var(--p50);border-color:transparent}

/* pulse cards */
.pcard{display:flex;gap:14px;align-items:flex-start;padding:14px;border-radius:14px;border:1px solid var(--line);background:#fff;cursor:pointer;transition:.2s}.pcard:hover{border-color:var(--p300);transform:translateX(3px)}
.pcard + .pcard{margin-top:10px}
.pi{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;flex:none}
.pi.a{background:var(--warnbg);color:var(--warn)}.pi.p{background:var(--p100);color:var(--p700)}.pi.g{background:var(--goodbg);color:var(--good)}.pi.r{background:var(--badbg);color:var(--bad)}.pi.b{background:var(--bluebg);color:var(--blue)}
.dbox{width:46px;border-radius:12px;background:var(--p50);text-align:center;padding:5px 0;flex:none}.dbox b{display:block;font-size:18px;line-height:1.1;color:var(--p800)}.dbox span{font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--mute);font-weight:700}

/* ------------------------------------------------------------ stat tiles in portals */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin-bottom:20px}
.stat{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px 18px;cursor:pointer;transition:.2s;position:relative;overflow:hidden}
.stat:hover{transform:translateY(-3px);box-shadow:var(--sh);border-color:var(--p300)}
.stat b{display:block;font-size:30px;font-weight:800;letter-spacing:-.02em;color:var(--p900);font-variant-numeric:tabular-nums}
.stat span{color:var(--mute);font-size:12.5px;font-weight:600}.stat:after{content:"";position:absolute;right:-18px;top:-18px;width:70px;height:70px;border-radius:50%;background:var(--sc,var(--p100));opacity:.7}
.prog{height:9px;border-radius:9px;background:var(--p100);overflow:hidden}.prog i{display:block;height:100%;border-radius:9px;background:linear-gradient(90deg,var(--p500),#c026d3);width:0;transition:width 1.2s cubic-bezier(.2,.8,.2,1)}

/* ------------------------------------------------------------ profile / detail */
.pcover{height:96px;border-radius:var(--r) var(--r) 0 0;background:linear-gradient(120deg,var(--p800),var(--p600) 55%,#c026d3);position:relative;overflow:hidden}
.pcover:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 20%,rgba(255,255,255,.35),transparent 40%)}
.profile{padding:0;overflow:hidden}.profile .pb{padding:0 22px 22px;margin-top:-34px;position:relative}
.profile .av{border:4px solid #fff;box-shadow:0 8px 20px rgba(109,40,217,.3)}
dl.kv{display:grid;grid-template-columns:120px 1fr;gap:9px 12px;margin:0}dl.kv dt{color:var(--faint);font-size:12.5px}dl.kv dd{margin:0;font-weight:500}
.tl{position:relative;padding-left:22px}.tl:before{content:"";position:absolute;left:6px;top:6px;bottom:6px;width:2px;background:var(--p100);border-radius:2px}
.tl .it{position:relative;padding:0 0 16px;cursor:pointer}.tl .it:before{content:"";position:absolute;left:-21px;top:5px;width:12px;height:12px;border-radius:50%;background:var(--tc,var(--p600));border:3px solid #fff;box-shadow:0 0 0 2px var(--tc,var(--p600))}
.tl .it.hollow:before{background:#fff}
.tabs{display:flex;gap:4px;border-bottom:2px solid var(--line);margin-bottom:18px;overflow:auto}
.tabs a{padding:10px 16px;font-weight:700;color:var(--mute);border-bottom:3px solid transparent;margin-bottom:-2px;white-space:nowrap;display:flex;gap:8px;align-items:center}.tabs a:hover{color:var(--p700);text-decoration:none}.tabs a.on{color:var(--p700);border-color:var(--p600)}
.imp{display:flex;gap:10px;align-items:flex-start;padding:10px 13px;border-radius:12px;background:var(--p50);margin-bottom:8px;animation:rise .4s both;font-size:13px}.imp svg{color:var(--p600);margin-top:1px}
.imp.warn{background:var(--warnbg)}.imp.warn svg{color:var(--warn)}.imp.err{background:var(--badbg)}.imp.err svg{color:var(--bad)}.imp.ok{background:var(--goodbg)}.imp.ok svg{color:var(--good)}
.banner{display:flex;gap:14px;align-items:flex-start;padding:14px 16px;border-radius:14px;margin-bottom:14px;background:var(--p50);border:1px solid var(--p200)}
.banner svg{width:22px;height:22px;color:var(--p600)}.banner.amber{background:var(--warnbg);border-color:#fcd9a0}.banner.amber svg{color:var(--warn)}.banner.red{background:var(--badbg);border-color:#fbc0cc}.banner.red svg{color:var(--bad)}.banner.green{background:var(--goodbg);border-color:#bfe9d1}.banner.green svg{color:var(--good)}
.route{display:flex;align-items:stretch;gap:10px}.route .node{flex:1;background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:12px 14px;min-width:0}.route .arrow{display:grid;place-items:center;color:var(--p500)}.route .arrow svg{width:24px;height:24px;animation:nudge 1.6s infinite}
@keyframes nudge{50%{transform:translateX(5px)}}
.step{display:flex;gap:12px;padding:10px 0;border-bottom:1px dashed var(--line)}.step:last-child{border:0}
.step .ci{width:24px;height:24px;border-radius:50%;border:2px solid var(--p200);display:grid;place-items:center;flex:none;color:#fff;margin-top:1px}.step .ci svg{width:13px;height:13px}
.step.done .ci{background:var(--good);border-color:var(--good)}.step.pend .ci{border-color:var(--warn);background:var(--warnbg)}.step.skip .ci{background:#eee;border-color:#ddd}
.notes .nt{background:var(--p50);border-radius:12px;padding:10px 13px;margin-bottom:8px;font-size:13px}

/* ------------------------------------------------------------ panel / sheet / toast / picker */
#shade{position:fixed;inset:0;background:rgba(32,14,70,.38);backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .25s;z-index:80}#shade.on{opacity:1;pointer-events:auto}
#panel{position:fixed;top:0;right:0;bottom:0;width:min(600px,100vw);background:#fff;z-index:90;transform:translateX(104%);transition:transform .38s cubic-bezier(.2,.9,.2,1);box-shadow:-30px 0 70px rgba(59,26,122,.25);display:flex;flex-direction:column}#panel.on{transform:none}
#panel .ph{padding:18px 22px;border-bottom:1px solid var(--line);display:flex;gap:12px;align-items:flex-start;background:linear-gradient(180deg,var(--p50),#fff)}
#panel .pbd{padding:20px 22px 40px;overflow:auto;flex:1}
#sheet{position:fixed;inset:0;z-index:95;display:none;place-items:center;padding:20px}#sheet.on{display:grid}
#sheet .box{background:#fff;border-radius:24px;box-shadow:var(--sh2);width:min(1060px,100%);max-height:calc(100vh - 40px);display:flex;flex-direction:column;animation:sheetin .42s cubic-bezier(.2,.9,.2,1.1) both;overflow:hidden}
#sheet .box.narrow{width:min(520px,100%)}
@keyframes sheetin{from{opacity:0;transform:translateY(40px) scale(.95)}}
.sh{padding:20px 26px;display:flex;align-items:center;gap:14px;border-bottom:1px solid var(--line);background:linear-gradient(120deg,var(--p50),#fff)}
.sb{overflow:auto;flex:1;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}.sb.one{display:block;padding:22px 26px}
.sl{padding:22px 26px;overflow:auto}.sr{padding:22px 26px;background:var(--p50);border-left:1px solid var(--line);overflow:auto}
.sf{padding:15px 26px;border-top:1px solid var(--line);display:flex;gap:10px;align-items:center;background:#fff}
@media(max-width:860px){.sb{grid-template-columns:1fr}.sr{border-left:0;border-top:1px solid var(--line)}}
.ttiles{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:16px}
.tt{border:1.5px solid var(--line);border-radius:13px;padding:10px 6px;text-align:center;font-size:12px;font-weight:700;color:var(--mute);cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:6px;transition:.2s;background:#fff}
.tt svg{width:21px;height:21px;color:var(--tc)}.tt:hover{border-color:var(--tc);transform:translateY(-2px)}
.tt.on{background:color-mix(in srgb,var(--tc) 11%,#fff);border-color:var(--tc);color:var(--tc);box-shadow:0 6px 16px color-mix(in srgb,var(--tc) 28%,transparent)}
.datebox{width:60px;border-radius:14px;background:linear-gradient(135deg,var(--p600),#a21caf);color:#fff;text-align:center;padding:7px 0;box-shadow:0 8px 18px rgba(124,58,237,.35)}.datebox b{display:block;font-size:24px;line-height:1}.datebox span{font-size:11px;text-transform:uppercase;letter-spacing:.1em;opacity:.9}
.flag{border:2px solid var(--bad);background:linear-gradient(135deg,#fff5f7,#ffe9ee);border-radius:14px;padding:13px 15px;margin-bottom:12px;animation:shake .5s}
@keyframes shake{20%{transform:translateX(-6px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(2px)}}
.flag b.t{color:var(--bad);display:flex;gap:8px;align-items:center}
.apbox{border-radius:14px;padding:13px 15px;margin-bottom:14px;border:1.5px dashed var(--p300);background:#fff}
.apbox.need{border-style:solid;border-color:#f3c274;background:var(--warnbg)}.apbox.lock{border-style:solid;border-color:#f19ab0;background:var(--badbg)}.apbox.now{border-style:solid;border-color:#bfe9d1;background:var(--goodbg)}
#toasts{position:fixed;right:22px;bottom:22px;z-index:200;display:flex;flex-direction:column;gap:10px;align-items:flex-end}
.toast{background:#fff;border-left:5px solid var(--p600);border-radius:12px;box-shadow:var(--sh2);padding:12px 18px;max-width:420px;animation:toastin .4s cubic-bezier(.2,.9,.3,1.3) both}.toast.err{border-color:var(--bad)}.toast.out{animation:toastout .3s forwards}
@keyframes toastin{from{opacity:0;transform:translateX(60px)}}@keyframes toastout{to{opacity:0;transform:translateX(60px)}}
.pk{position:relative}.pk .dd{position:absolute;left:0;right:0;top:calc(100% + 4px);background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--sh2);z-index:30;max-height:300px;overflow:auto;display:none;padding:4px}.pk.open .dd{display:block;animation:pop .15s both}
.opt{display:flex;gap:10px;align-items:center;padding:8px 10px;border-radius:10px;cursor:pointer}.opt:hover,.opt.hi{background:var(--p50)}
.picked{display:flex;gap:10px;align-items:center;border:1.5px solid var(--p200);background:var(--p50);border-radius:12px;padding:8px 10px}
.confetti{position:fixed;left:50%;top:40%;width:9px;height:14px;border-radius:2px;z-index:300;pointer-events:none;animation:cf 1.1s cubic-bezier(.2,.8,.3,1) forwards}
@keyframes cf{to{transform:translate(var(--dx),var(--dy)) rotate(var(--rot));opacity:0}}
.sk{background:linear-gradient(90deg,#eee9fb,#f7f4ff,#eee9fb);background-size:200% 100%;animation:skl 1.2s infinite;border-radius:10px;height:18px}@keyframes skl{to{background-position:-200% 0}}

/* ------------------------------------------------------------ login */
#login{position:fixed;inset:0;z-index:400;display:none;place-items:center;background:linear-gradient(120deg,#2b1065,#5b21b6 40%,#a21caf);background-size:200% 200%;animation:flow 14s ease-in-out infinite;overflow:hidden}#login.on{display:grid}
#login canvas{position:absolute;inset:0;width:100%;height:100%}
.lg-box{position:relative;z-index:2;width:min(900px,94vw);display:grid;grid-template-columns:1.05fr 1fr;background:#fff;border-radius:28px;overflow:hidden;box-shadow:0 40px 90px rgba(0,0,0,.35);animation:sheetin .7s cubic-bezier(.2,.9,.2,1.1) both}
.lg-side{padding:36px 34px;color:#fff;background:linear-gradient(160deg,#4c1d95,#7c3aed 55%,#a21caf);display:flex;flex-direction:column;gap:20px;position:relative;overflow:hidden}
.lg-side:before{content:"";position:absolute;width:320px;height:320px;border-radius:50%;right:-120px;bottom:-120px;background:rgba(255,255,255,.08)}
.lg-side h2{margin:6px 0 0;font-size:25px;line-height:1.22;font-weight:800;letter-spacing:-.02em}
.lg-side ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:13px;position:relative}
.lg-side li{display:flex;gap:11px;align-items:flex-start;font-size:13.5px;line-height:1.4;color:rgba(255,255,255,.92)}
.lg-side li svg{flex:none;width:18px;height:18px;margin-top:1px;color:#e9d5ff}
.lg-foot{margin-top:auto;font-size:12px;color:rgba(255,255,255,.7);position:relative}
.lg-form{padding:40px 38px;display:flex;flex-direction:column;justify-content:center}
.lg-form h1{margin:0 0 4px;font-size:28px;color:var(--p900);letter-spacing:-.02em}.lg-form p{margin:0 0 22px}
.lg-pw{position:relative}.lg-pw .in{padding-right:64px}
.lg-pw button{position:absolute;right:6px;top:50%;transform:translateY(-50%);border:0;background:none;color:var(--p700);font-weight:600;font-size:12.5px;cursor:pointer;padding:6px 10px;border-radius:8px}.lg-pw button:hover{background:var(--p50)}
.lg-note{display:flex;gap:9px;align-items:flex-start;margin-top:18px;font-size:12px;color:var(--mute);line-height:1.45}.lg-note svg{flex:none;width:16px;height:16px;color:var(--p600);margin-top:1px}
@media(max-width:760px){.lg-box{grid-template-columns:1fr}.lg-side{display:none}.lg-form{padding:30px 24px}}

/* ------------------------------------------------------------ territory hierarchy columns / match */
.miller{display:flex;gap:0;overflow:auto;border:1px solid var(--line);border-radius:var(--r);background:#fff;box-shadow:var(--sh);min-height:420px;max-height:calc(100vh - 300px)}
.mcol{min-width:290px;width:290px;border-right:1px solid var(--line);overflow:auto;animation:colin .35s both;flex:none}
@keyframes colin{from{opacity:0;transform:translateX(24px)}}
.mcol h4{margin:0;position:sticky;top:0;background:var(--p50);padding:10px 14px;font-size:11.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--p800);border-bottom:1px solid var(--line);z-index:2}
.mn{display:flex;gap:9px;align-items:center;padding:9px 12px;border-bottom:1px solid var(--line2);cursor:pointer;transition:.15s}.mn:hover{background:var(--p50)}.mn.on{background:linear-gradient(90deg,var(--p100),var(--p50));box-shadow:inset 3px 0 0 var(--p600)}
.mn .dot{width:9px;height:9px;border-radius:50%;background:var(--good);flex:none}.mn .dot.v{background:var(--bad);box-shadow:0 0 0 3px var(--badbg)}.mn .dot.l{background:var(--warn)}
.board{display:grid;grid-template-columns:340px minmax(0,1fr);gap:20px;align-items:start}
.pc{display:flex;gap:11px;align-items:center;padding:11px 13px;background:#fff;border:1.5px solid var(--line);border-radius:14px;margin-bottom:9px;cursor:grab;transition:.2s}.pc:hover{border-color:var(--p300);box-shadow:var(--sh);transform:translateX(3px)}.pc.dragging{opacity:.4}.pc.sel{border-color:var(--p600);background:var(--p50)}
.vgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:13px}
.vc{background:#fff;border:1.5px dashed #f19ab0;border-radius:16px;padding:14px;transition:.2s;animation:rise .4s both}.vc.over{border-style:solid;border-color:var(--p600);background:var(--p50);transform:scale(1.03);box-shadow:var(--sh2)}
.suggest{display:flex;gap:12px;align-items:center;padding:12px 16px;background:linear-gradient(90deg,var(--p100),#fff);border:1px solid var(--p200);border-radius:14px;margin-bottom:10px;animation:rise .5s both}
.bars .br{display:grid;grid-template-columns:120px 1fr 60px;gap:12px;align-items:center;margin-bottom:11px;font-size:13px}
.dots{display:flex;gap:4px}.dot2{width:9px;height:9px;border-radius:50%;background:#e4def4}.dot2.d{background:var(--good)}.dot2.p{background:var(--warn)}.dot2.s{background:#c9c3dd}
.pyear{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.pm{position:relative;border:1.5px solid var(--line);border-radius:18px;padding:16px;background:#fff;transition:.25s;overflow:hidden}.pm:hover{transform:translateY(-4px);box-shadow:var(--sh)}
.pm.cur{border-color:var(--p500);box-shadow:0 0 0 4px var(--p50)}.pm.locked{background:linear-gradient(160deg,#fff,#fbf8ff)}
.pm .lk{position:absolute;right:14px;top:14px}
.diff td,.diff th{font-size:13px}
.kbd{font:11px var(--font);background:var(--p50);border-radius:6px;padding:1px 6px;color:var(--p700)}


/* ============================================================ GLASS LAYER (loaded last: wins over the rules above) */
:root{--glass:rgba(255,255,255,.58);--glass2:rgba(255,255,255,.76);--gline:rgba(255,255,255,.8);--gsh:0 10px 34px rgba(76,29,149,.10),inset 0 1px 0 rgba(255,255,255,.9)}
body:before{background:
  radial-gradient(780px 540px at 4% -8%,rgba(167,139,250,.62),transparent 62%),
  radial-gradient(720px 520px at 99% 0%,rgba(244,114,182,.42),transparent 60%),
  radial-gradient(820px 620px at 82% 100%,rgba(56,189,248,.34),transparent 60%),
  radial-gradient(720px 540px at 0% 96%,rgba(192,132,252,.40),transparent 60%),#f6f3ff}
body:after{content:"";position:fixed;z-index:-1;width:46vmax;height:46vmax;border-radius:50%;left:28%;top:18%;background:radial-gradient(circle,rgba(124,58,237,.24),transparent 66%);filter:blur(34px);animation:bgfloat 24s ease-in-out infinite alternate;pointer-events:none}
@keyframes bgfloat{to{transform:translate(-16vw,12vh) scale(1.2)}}
#top{background:rgba(255,255,255,.46);backdrop-filter:blur(24px) saturate(1.9);-webkit-backdrop-filter:blur(24px) saturate(1.9);border-bottom:1px solid var(--gline);box-shadow:0 6px 30px rgba(76,29,149,.07)}
#view{padding-bottom:110px}
.card{background:var(--glass);backdrop-filter:blur(18px) saturate(1.7);-webkit-backdrop-filter:blur(18px) saturate(1.7);border:1px solid var(--gline);box-shadow:var(--gsh)}
.card.soft{background:rgba(246,242,255,.55)}
.tscroll{background:rgba(255,255,255,.8);border-color:var(--gline)}
.sbtn,.me{background:rgba(255,255,255,.6);border-color:var(--gline);backdrop-filter:blur(12px)}
.btn,.ibtn{background:rgba(255,255,255,.72)}.btn.pri{background:linear-gradient(135deg,var(--p600),var(--p700) 55%,#a21caf)}
.mp{background:rgba(255,255,255,.7)}.mp.on{background:linear-gradient(135deg,var(--p600),var(--p800))}
.pcard{background:rgba(255,255,255,.66);border-color:var(--gline)}
.stat{background:var(--glass);backdrop-filter:blur(14px);border-color:var(--gline);box-shadow:var(--gsh)}
.menu{background:rgba(255,255,255,.84);backdrop-filter:blur(22px) saturate(1.7);border-color:var(--gline)}
#panel{background:rgba(255,255,255,.84);backdrop-filter:blur(30px) saturate(1.7);-webkit-backdrop-filter:blur(30px) saturate(1.7)}
#panel .ph{background:linear-gradient(180deg,rgba(246,242,255,.8),rgba(255,255,255,.3))}
#sheet .box{background:rgba(255,255,255,.82);backdrop-filter:blur(30px) saturate(1.7);-webkit-backdrop-filter:blur(30px) saturate(1.7);border:1px solid var(--gline)}
.sh{background:linear-gradient(120deg,rgba(246,242,255,.8),rgba(255,255,255,.3))}.sf{background:rgba(255,255,255,.55)}
.in,select.in,textarea.in{background:rgba(255,255,255,.85)}
.hero{padding-bottom:42px;margin-bottom:22px}.hero .wave{display:none}.lift{margin-top:0}
.tiles{grid-template-columns:repeat(4,1fr)}
.tile{background:var(--glass);backdrop-filter:blur(14px) saturate(1.6);-webkit-backdrop-filter:blur(14px) saturate(1.6);border-color:var(--gline);box-shadow:var(--gsh);min-height:122px}
@media(max-width:900px){.tiles{grid-template-columns:repeat(2,1fr)}}
details.more-tools{margin-top:16px}details.more-tools summary{cursor:pointer;font-weight:700;color:var(--p800);display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:30px;background:var(--glass);border:1px solid var(--gline);list-style:none}
details.more-tools summary::-webkit-details-marker{display:none}details.more-tools summary svg{transition:transform .3s}details.more-tools[open] summary svg{transform:rotate(90deg)}

/* ------------------------------------------------------------ the dock: compact glass bar, sliding liquid blob, fan of operations */
#dockwrap{position:fixed;left:50%;bottom:14px;z-index:70;width:max-content;max-width:96vw;transform:translateX(-50%);transition:transform .6s cubic-bezier(.2,.9,.2,1),opacity .4s;animation:dkrise .9s cubic-bezier(.2,.9,.2,1) backwards}
@keyframes dkrise{from{transform:translate(-50%,140%)}}
#dockwrap.gone{transform:translate(-50%,190%);opacity:0;pointer-events:none;animation:none}
#top.hide~#dockwrap,#top.hide~#dkShow,#top.hide~#dkScrim{display:none}
/* two equal halves around the + button, so the button stays in the middle even when a label opens */
#dock{position:relative;display:grid;grid-template-columns:1fr 66px 1fr;align-items:center;height:50px;padding:0 9px;border-radius:25px}
.dk-side{display:flex;align-items:center;gap:2px}.dk-side.l{justify-content:flex-end}.dk-side.r{justify-content:flex-start}
.dk-gap{display:block;width:66px}
.dk-glass{position:absolute;inset:0;border-radius:25px;pointer-events:none;overflow:hidden;
  background:linear-gradient(135deg,rgba(59,26,122,.76),rgba(124,58,237,.64) 55%,rgba(192,38,211,.58));
  backdrop-filter:blur(26px) saturate(2);-webkit-backdrop-filter:blur(26px) saturate(2);
  border:1px solid rgba(255,255,255,.4);box-shadow:0 18px 40px rgba(59,26,122,.36),inset 0 1px 0 rgba(255,255,255,.5),inset 0 -1px 0 rgba(255,255,255,.08);
  -webkit-mask:radial-gradient(circle 33px at 50% 0,transparent 32px,#000 33px);mask:radial-gradient(circle 33px at 50% 0,transparent 32px,#000 33px)}
.dk-glass:after{content:"";position:absolute;inset:0;border-radius:25px;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.22) 50%,transparent 65%);transform:translateX(-120%);animation:shine 7s infinite 1.5s}
.dk-i{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;height:38px;min-width:40px;padding:0 11px;border-radius:19px;color:rgba(255,255,255,.86);white-space:nowrap;transition:color .3s,transform .25s cubic-bezier(.3,1.6,.5,1)}
.dk-i svg{width:18px;height:18px;transition:transform .3s}
.dk-i:hover{color:#fff;text-decoration:none;transform:translateY(-2px)}.dk-i:hover svg{transform:scale(1.12)}
.dk-i .lab{max-width:0;opacity:0;overflow:hidden;margin-left:0;font-weight:700;font-size:12.5px;letter-spacing:-.005em;transition:max-width .5s cubic-bezier(.2,.9,.2,1),opacity .3s,margin .45s}
.dk-i.on{color:var(--p800)}.dk-i.on:hover{color:var(--p800);transform:none}
.dk-i.on .lab{max-width:90px;opacity:1;margin-left:7px}
.dk-i.on svg{animation:dkpop .55s cubic-bezier(.3,1.6,.5,1)}
@keyframes dkpop{0%{transform:scale(.6) rotate(-14deg)}100%{transform:none}}
.dk-i:not(.on):hover:after{content:attr(data-tip);position:absolute;bottom:calc(100% + 12px);left:50%;transform:translateX(-50%);padding:4px 10px;border-radius:9px;background:rgba(30,12,70,.8);backdrop-filter:blur(10px);color:#fff;font-size:11.5px;font-weight:600;pointer-events:none;animation:tipin .2s both}
@keyframes tipin{from{opacity:0;margin-bottom:-6px}}
.dk-b{position:absolute;right:1px;top:0;min-width:16px;height:16px;border-radius:8px;background:var(--bad);color:#fff;font-size:10px;font-weight:800;display:grid;place-items:center;padding:0 4px;box-shadow:0 0 0 2px rgba(91,33,182,.9)}
#dkBlob{position:absolute;left:0;top:6px;height:38px;z-index:1;pointer-events:none;opacity:0;transition:opacity .4s;will-change:transform,width}
#dkBlob i{display:block;width:100%;height:100%;border-radius:19px;background:linear-gradient(135deg,rgba(255,255,255,.97),rgba(255,255,255,.76));box-shadow:0 8px 20px rgba(30,12,70,.32),inset 0 1px 0 #fff;position:relative;overflow:hidden}
#dkBlob i:after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(167,139,250,.35) 50%,transparent 70%);transform:translateX(-120%);animation:shine 5s infinite 1s}
.dk-hide{position:absolute;right:-38px;top:10px;width:30px;height:30px;border-radius:50%;border:1px solid rgba(255,255,255,.7);background:rgba(255,255,255,.55);backdrop-filter:blur(12px);color:var(--p800);cursor:pointer;z-index:2;display:grid;place-items:center;transition:.25s;box-shadow:0 6px 16px rgba(59,26,122,.18)}.dk-hide:hover{background:rgba(255,255,255,.9);transform:translateY(2px)}
.dk-hide svg{width:14px;height:14px}
.dk-fab{position:absolute;left:50%;top:0;width:50px;height:50px;margin:-25px 0 0 -25px;border-radius:50%;border:0;cursor:pointer;color:#fff;z-index:3;display:grid;place-items:center;
  background:linear-gradient(140deg,#c4b5fd,#7c3aed 48%,#d946ef);box-shadow:0 10px 24px rgba(124,58,237,.55),inset 0 1px 0 rgba(255,255,255,.6),inset 0 -3px 8px rgba(76,29,149,.35);transition:transform .5s cubic-bezier(.3,1.6,.5,1),box-shadow .3s}
.dk-fab svg{width:22px;height:22px;stroke-width:2.4}.dk-fab:hover{transform:scale(1.08);box-shadow:0 14px 30px rgba(124,58,237,.7),inset 0 1px 0 rgba(255,255,255,.6)}
.fan-open .dk-fab{transform:rotate(135deg) scale(1.04)}
.dk-ring{position:absolute;inset:-5px;border-radius:50%;border:2px solid rgba(196,181,253,.8);animation:dkring 2.8s ease-out infinite;pointer-events:none}.fan-open .dk-ring{animation:none;opacity:0}
@keyframes dkring{0%{transform:scale(.92);opacity:.9}100%{transform:scale(1.4);opacity:0}}
#dkFan{position:absolute;left:50%;top:0;width:0;height:0}
.fan-b{position:absolute;left:-24px;top:-24px;width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.85);background:rgba(255,255,255,.76);backdrop-filter:blur(18px) saturate(1.9);-webkit-backdrop-filter:blur(18px) saturate(1.9);color:var(--tc);cursor:pointer;display:grid;place-items:center;
  box-shadow:0 12px 28px rgba(59,26,122,.28),inset 0 1px 0 #fff;opacity:0;transform:translate(0,0) scale(.2);pointer-events:none;transition:transform .55s cubic-bezier(.3,1.5,.5,1),opacity .25s;transition-delay:calc(var(--k)*38ms)}
.go .fan-b{opacity:1;transform:translate(var(--x),var(--y)) scale(1);pointer-events:auto}
.fan-b:hover{background:color-mix(in srgb,var(--tc) 16%,#fff);box-shadow:0 16px 34px color-mix(in srgb,var(--tc) 40%,transparent),inset 0 1px 0 #fff}
.go .fan-b:hover{transform:translate(var(--x),var(--y)) scale(1.14)}
.fan-b svg{width:20px;height:20px}
.fan-b span{position:absolute;top:calc(100% + 5px);left:50%;transform:translateX(-50%);font-size:10.5px;font-weight:700;color:var(--p900);background:rgba(255,255,255,.84);backdrop-filter:blur(8px);padding:2px 8px;border-radius:9px;white-space:nowrap;box-shadow:0 2px 8px rgba(59,26,122,.14)}
#dkScrim{position:fixed;inset:0;z-index:65;background:rgba(32,14,70,.2);backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .35s}#dkScrim.on{opacity:1;pointer-events:auto}
#dkShow{position:fixed;left:50%;bottom:14px;z-index:70;transform:translate(-50%,220%);border:1px solid rgba(255,255,255,.5);background:linear-gradient(135deg,rgba(59,26,122,.74),rgba(124,58,237,.62));backdrop-filter:blur(20px) saturate(1.8);color:#fff;border-radius:22px;padding:8px 16px 8px 12px;display:flex;gap:6px;align-items:center;font-weight:700;font-size:12.5px;cursor:pointer;box-shadow:0 12px 28px rgba(59,26,122,.38),inset 0 1px 0 rgba(255,255,255,.4);transition:transform .6s cubic-bezier(.2,.9,.2,1) .12s}
#dkShow.on{transform:translate(-50%,0)}#dkShow svg{width:14px;height:14px}#dkShow:hover{box-shadow:0 16px 36px rgba(124,58,237,.55)}
@media(max-width:620px){#dock{height:46px;padding:0 6px;grid-template-columns:1fr 58px 1fr}.dk-gap{width:58px}.dk-i{min-width:36px;height:36px;padding:0 9px}#dkBlob{top:5px;height:36px}.dk-i.on .lab{max-width:0;margin:0;opacity:0}#dockwrap{bottom:10px}.fan-b span{display:none}.dk-hide{right:-34px;top:8px;width:28px;height:28px}}
@media(prefers-reduced-motion:reduce){.dk-glass:after,#dkBlob i:after,.dk-ring,body:after{animation:none}#dockwrap{animation:none}}

/* ------------------------------------------------------------ record-a-change sheet */
#sheet .box.ax{width:min(640px,100%)}
.ax-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.ax-chip{display:flex;align-items:center;gap:7px;border:1.5px solid rgba(255,255,255,.85);background:rgba(255,255,255,.6);backdrop-filter:blur(10px);border-radius:30px;padding:7px 13px 7px 10px;font-weight:700;font-size:12.5px;color:var(--mute);cursor:pointer;transition:.25s}
.ax-chip svg{width:16px;height:16px;color:var(--tc)}.ax-chip:hover{transform:translateY(-2px);border-color:var(--tc)}
.ax-chip.on{background:color-mix(in srgb,var(--tc) 14%,#fff);border-color:var(--tc);color:var(--tc);box-shadow:0 8px 20px color-mix(in srgb,var(--tc) 30%,transparent)}
.ax-req{color:var(--bad)}
.ax-more{margin:4px 0 12px;border-radius:14px;background:rgba(255,255,255,.45);border:1px dashed var(--p200)}
.ax-more summary{cursor:pointer;padding:10px 14px;font-weight:600;font-size:12.5px;color:var(--p800);list-style:none;display:flex;gap:8px;align-items:center}
.ax-more summary::-webkit-details-marker{display:none}
.ax-more summary:before{content:"+";font-weight:800;width:18px;height:18px;border-radius:50%;background:var(--p100);display:grid;place-items:center;line-height:1}
.ax-more[open] summary:before{content:"\2013"}
.ax-moreb{padding:4px 14px 6px}
.ax-switch{position:relative;display:flex;align-items:center;gap:11px;cursor:pointer;margin:2px 0 14px;font-weight:600}
.ax-switch input{position:absolute;opacity:0;width:0;height:0}
.ax-switch i{width:42px;height:24px;border-radius:14px;background:var(--p200);position:relative;transition:.3s;flex:none}
.ax-switch i:after{content:"";position:absolute;left:3px;top:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.2);transition:.3s cubic-bezier(.3,1.4,.5,1)}
.ax-switch input:checked+i{background:linear-gradient(135deg,var(--p600),#c026d3)}.ax-switch input:checked+i:after{transform:translateX(18px)}
.ax-switch small{color:var(--faint);font-weight:500}
.ax-seg{display:flex;gap:4px;background:rgba(246,242,255,.8);border-radius:12px;padding:3px;margin-bottom:14px}
.ax-seg button{flex:1;border:0;background:none;border-radius:9px;padding:8px;font-weight:700;color:var(--mute);cursor:pointer;transition:.2s}.ax-seg button.on{background:#fff;color:var(--p800);box-shadow:0 2px 8px rgba(109,40,217,.18)}
.ax-review{margin-top:6px}
.ax-when{display:flex;gap:11px;align-items:center;padding:11px 14px;border-radius:14px;margin-bottom:10px;animation:rise .4s both}
.ax-when svg{width:22px;height:22px}.ax-when b{display:block;font-size:13.5px}.ax-when span{font-size:12px;opacity:.85}
.ax-when.now{background:var(--goodbg);color:var(--good)}.ax-when.later{background:var(--bluebg);color:var(--blue)}

/* ============================================================ SBU table: simple, calm box (replaces the coloured version above) */
.matrix{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:rgba(255,255,255,.88)}
.matrix th,.matrix td{padding:0 10px;height:var(--mxh,38px);text-align:center;border:0;border-bottom:1px solid #f1edfb;background:transparent}
.matrix thead th{height:auto;padding:8px 10px;background:#faf8ff;color:var(--mute);font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;border-bottom:1px solid var(--line)}
.matrix thead .gT,.matrix thead .gA,.matrix thead .gV,.matrix thead .gN{background:#faf8ff;border-left:1px solid var(--line)}
.matrix thead .gT{color:var(--p700)}.matrix thead .gA{color:#0b7a42}.matrix thead .gV{color:#b4143a}.matrix thead .gN{color:#a35a06}
.matrix thead .s2 th{padding:5px 10px;font-size:10.5px;font-weight:700;color:var(--faint);border-left:0}
.matrix thead .sbh{background:#faf8ff;color:var(--p800);text-align:left;padding-left:18px;font-size:11px;border-left:0}
.matrix tbody th{text-align:left;padding-left:18px;font-weight:700;color:var(--ink);background:transparent;font-size:13.5px;white-space:nowrap}
.matrix td,.matrix td.cT,.matrix td.cA,.matrix td.cV,.matrix td.cN{font-size:14px;font-weight:600;color:var(--ink);background:transparent}
.matrix td.cA{color:#0b6b38}
.matrix td.merged{font-size:15px;font-weight:700;background:rgba(124,58,237,.045)}
.matrix td.hv{cursor:pointer}.matrix td.hv:hover{background:var(--p50);box-shadow:none;filter:none}
.matrix td.z{color:#cdc8e0;font-weight:500}
.matrix .vv,.matrix .vv.zero{display:inline;min-width:0;padding:0;background:none;border-radius:0;color:#c0204a;font-weight:700}.matrix .vv.zero{color:#cdc8e0;font-weight:500}
.matrix .bar{display:none}
.matrix tr.nat th,.matrix tr.nat td,.matrix tr.nat td.vN,.matrix tr.nat td:first-child{background:var(--p50);color:var(--p900);font-weight:800;font-size:14px;border-top:1px solid var(--p200);border-bottom:1px solid var(--p200)}
.matrix tr.nat td.vN{color:#c0204a}
.matrix tr.grand td{height:calc(var(--mxh,38px) + 2px);font-size:16px;font-weight:800;padding:0 10px;border-bottom:0;background:#fff}
.matrix tr.grand td.t,.matrix tr.grand td.a,.matrix tr.grand td.v{background:#fff;border-top:1px solid var(--line)}.matrix tr.grand td.t{color:var(--p800)}.matrix tr.grand td.a{color:#0b6b38}.matrix tr.grand td.v{color:#c0204a}
.matrix tr.grand td:first-child,.matrix tr.grand td:last-child{background:#fff}
.matrix td.nvc{background:transparent}
.nvbox{width:34px;height:34px;border-radius:10px;font-size:16px;background:var(--warnbg);color:var(--warn)}

/* ============================================================ HOME: one screen, no scrolling */
#view.hmv{padding-top:14px;padding-bottom:84px}
.hm{display:flex;flex-direction:column;gap:12px;--mxh:clamp(26px,calc((100vh - 432px) / 8),46px)}
.hm-top{display:flex;align-items:center;gap:20px;flex-wrap:wrap;padding:14px 22px;border-radius:20px;color:#fff;position:relative;overflow:hidden;
  background:linear-gradient(115deg,#3b1a7a,#5b21b6 30%,#7c3aed 62%,#b02ee0 90%);background-size:200% 200%;animation:flow 16s ease-in-out infinite;box-shadow:0 12px 30px rgba(91,33,182,.26)}
.hm-top:after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;right:-60px;top:-150px;background:rgba(232,121,249,.35);filter:blur(30px);pointer-events:none}
.hm-hello .hello{font-size:11px;letter-spacing:.14em;text-transform:uppercase;opacity:.8;font-weight:600}
.hm-hello h1{font-size:25px;font-weight:800;letter-spacing:-.02em;margin:2px 0 0}
.hm-kpis{margin-left:auto;display:flex;gap:10px;flex-wrap:wrap;position:relative;z-index:1}
.hm-k{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.3);backdrop-filter:blur(10px);border-radius:14px;padding:7px 16px;min-width:116px;cursor:pointer;transition:.25s}
.hm-k:hover{background:rgba(255,255,255,.25);transform:translateY(-2px)}
.hm-k b{display:block;font-size:23px;font-weight:800;letter-spacing:-.02em;line-height:1.15;font-variant-numeric:tabular-nums}
.hm-k span{font-size:10.5px;opacity:.88;letter-spacing:.06em;text-transform:uppercase;font-weight:600}
.hm-main{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:12px;align-items:start}
.hm-table{padding:14px 16px 14px}
.hm-th{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.hm-th h2{font-size:17px;font-weight:800;color:var(--p900);margin-right:4px}
.hm-th .pills{padding:0}.hm-th .mp{padding:4px 11px;font-size:12.5px}
.hm-src{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;color:var(--mute);background:var(--p50);padding:4px 10px;border-radius:20px}.hm-src svg{width:12px;height:12px}
.hm-src.locked{background:var(--warnbg);color:#92580a}
.hm-side{display:flex;flex-direction:column;gap:12px}
.hm-side .card{padding:14px 16px}.hm-side .ctitle{margin-bottom:10px;font-size:14px}
.hm-side .pcard{padding:9px 11px;gap:11px}.hm-side .pcard+.pcard{margin-top:7px}
.hm-ok{display:grid;gap:2px;padding:12px 4px;text-align:center;color:var(--faint)}.hm-ok svg{width:26px;height:26px;margin:0 auto 4px;color:var(--good)}.hm-ok b{color:var(--good)}.hm-ok span{font-size:12px}
.hm-chips{display:flex;gap:8px;flex-wrap:wrap}.hm-chips .chip{cursor:pointer}
@media(max-width:1100px){.hm-main{grid-template-columns:1fr}.hm{--mxh:36px}#view.hmv{padding-bottom:110px}}

.hm-chips .chip{display:inline-flex;gap:6px;align-items:baseline;background:rgba(255,255,255,.7);border:1px solid var(--gline);border-radius:20px;padding:5px 12px;font-size:12px;color:var(--mute);transition:.2s}.hm-chips .chip b{color:var(--p900);font-size:14px}.hm-chips .chip:hover{border-color:var(--p300);transform:translateY(-1px)}

/* table grid: fine lines around every cell, stronger dividers between the groups */
.matrix{--mxb:#e4def5;--mxg:#c4b3f2;border:1px solid var(--mxg);border-radius:14px;overflow:hidden}
.matrix th,.matrix td{border:1px solid var(--mxb)}
.matrix thead th{border-color:var(--mxb)}
.matrix thead .gT,.matrix thead .gA,.matrix thead .gV,.matrix thead .gN{border-left:2px solid var(--mxg)}
.matrix .gs{border-left:2px solid var(--mxg)}
.matrix td.nvc{border-left:2px solid var(--mxg)}
.matrix tr.grand td.a,.matrix tr.grand td.v{border-left:2px solid var(--mxg)}
.matrix tr.grand td{border-top:2px solid var(--mxg);border-bottom:0}
.matrix tr.nat th,.matrix tr.nat td,.matrix tr.nat td:first-child{border:1px solid var(--mxb);border-top:2px solid var(--mxg);border-bottom:2px solid var(--mxg)}
.matrix tr.nat td.gs{border-left:2px solid var(--mxg)}
.matrix tbody th{border-right:2px solid var(--mxg)}
.matrix thead .sbh{border-right:2px solid var(--mxg)}
.matrix tbody tr:not(.nat):not(.grand):hover th,.matrix tbody tr:not(.nat):not(.grand):hover td:not(.merged):not(.nvc){background:rgba(124,58,237,.05)}

/* ============================================================ table outline + month picker + collapsible search + Master (Excel-like grid) */
#mxWrap{border:1px solid var(--mxg,#c4b3f2);border-radius:14px;overflow:hidden;background:rgba(255,255,255,.88)}
#mxWrap .matrix{border:0;border-radius:0}
#mxWrap .matrix tr.grand td{border-bottom:0}

/* one filter for month + year */
.mpk{position:relative;display:inline-block}
.mpk-btn{display:flex;align-items:center;gap:9px;border:1px solid var(--gline);background:rgba(255,255,255,.75);backdrop-filter:blur(12px);border-radius:12px;padding:5px 12px 5px 10px;cursor:pointer;color:var(--p800);transition:.2s;text-align:left}
.mpk-btn:hover,.mpk.open .mpk-btn{border-color:var(--p300);box-shadow:0 0 0 4px var(--p50)}
.mpk-btn svg{width:16px;height:16px;color:var(--p600)}
.mpk-btn span{display:flex;flex-direction:column;line-height:1.15}.mpk-btn b{font-size:14px;color:var(--p900)}.mpk-btn small{font-size:10.5px;color:var(--mute);font-weight:600}
.mpk-pop{position:absolute;left:0;top:calc(100% + 8px);z-index:90;width:262px;padding:12px;border-radius:16px;background:rgba(255,255,255,.9);backdrop-filter:blur(26px) saturate(1.7);-webkit-backdrop-filter:blur(26px) saturate(1.7);border:1px solid var(--gline);box-shadow:0 24px 60px rgba(59,26,122,.28);opacity:0;transform:translateY(-6px) scale(.97);pointer-events:none;transition:.22s cubic-bezier(.2,.9,.2,1)}
.mpk.open .mpk-pop{opacity:1;transform:none;pointer-events:auto}
.mpk-y{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.mpk-y b{font-size:15px;color:var(--p900)}
.mpk-y button{width:28px;height:28px;border-radius:9px;border:1px solid var(--line);background:#fff;cursor:pointer;display:grid;place-items:center;color:var(--p700)}.mpk-y button:disabled{opacity:.3;cursor:default}.mpk-y svg{width:14px;height:14px}
.mpk-g{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.mpk-g button{position:relative;border:1px solid var(--line);background:#fff;border-radius:10px;padding:9px 0;font-weight:700;color:var(--ink);cursor:pointer;transition:.18s}
.mpk-g button svg{position:absolute;right:5px;top:5px;width:10px;height:10px;color:var(--faint)}
.mpk-g button:hover:not(:disabled){border-color:var(--p400);background:var(--p50)}
.mpk-g button.on{background:linear-gradient(135deg,var(--p600),var(--p800));color:#fff;border-color:transparent;box-shadow:0 6px 16px rgba(124,58,237,.35)}.mpk-g button.on svg{color:#fff}
.mpk-g button.off{background:transparent;color:#cfc9e2;border-style:dashed;cursor:default}
.mpk-n{margin-top:10px;color:var(--faint);display:flex;gap:4px;align-items:center}

/* collapsible search */
.sbtn{position:relative;width:176px;min-width:0;transition:width .38s cubic-bezier(.2,.9,.2,1),border-color .2s,box-shadow .2s,background .2s}
.sbtn input{border:0;outline:0;background:none;width:0;padding:0;opacity:0;font-size:14px;transition:width .38s cubic-bezier(.2,.9,.2,1),opacity .2s}
.sbtn .gs-ph{color:var(--faint);white-space:nowrap}
.gs-x{display:none;border:0;background:var(--p50);color:var(--p700);width:24px;height:24px;border-radius:8px;cursor:pointer;place-items:center;margin-left:auto}.gs-x svg{width:13px;height:13px}.gs-x:hover{background:var(--p100)}
.sbtn.open{width:min(440px,44vw);background:#fff;border-color:var(--p300);box-shadow:0 0 0 4px var(--p50),0 16px 38px rgba(76,29,149,.2)}
.sbtn.open input{width:100%;opacity:1;flex:1;min-width:0}.sbtn.open .gs-ph,.sbtn.open kbd{display:none}.sbtn.open .gs-x{display:grid}
#gsDrop{position:absolute;left:0;right:0;top:calc(100% + 8px);z-index:90;border-radius:16px;background:rgba(255,255,255,.92);backdrop-filter:blur(26px) saturate(1.7);-webkit-backdrop-filter:blur(26px) saturate(1.7);border:1px solid var(--gline);box-shadow:0 26px 60px rgba(59,26,122,.28);padding:6px;max-height:min(460px,70vh);overflow:auto;opacity:0;transform:translateY(-6px);pointer-events:none;transition:.22s cubic-bezier(.2,.9,.2,1);cursor:default}
.sbtn.open #gsDrop{opacity:1;transform:none;pointer-events:auto}
.gs-hint{display:flex;gap:9px;align-items:center;padding:14px 12px;color:var(--mute);font-size:13px}.gs-hint svg{color:var(--p400)}
.gs-g{padding:8px 10px 4px;font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}
.gs-i{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:11px;color:var(--ink);cursor:pointer}.gs-i:hover,.gs-i.hi{background:var(--p50);text-decoration:none}
.gs-all{display:flex;align-items:center;justify-content:center;gap:6px;padding:10px;margin-top:4px;border-top:1px solid var(--line);font-weight:700;font-size:13px;color:var(--p700);cursor:pointer;border-radius:0 0 11px 11px}.gs-all:hover{background:var(--p50);text-decoration:none}.gs-all svg{width:14px;height:14px}

/* the Master dock button: warm highlight, always shows its name */
.dk-star{margin-right:2px}
.dk-star:before{content:"";position:absolute;inset:2px;border-radius:19px;background:linear-gradient(135deg,rgba(251,191,36,.42),rgba(244,114,182,.36));box-shadow:0 0 0 1px rgba(255,255,255,.35),0 0 18px rgba(251,191,36,.5);animation:starglow 2.8s ease-in-out infinite;z-index:-1}
@keyframes starglow{50%{box-shadow:0 0 0 1px rgba(255,255,255,.5),0 0 26px rgba(251,191,36,.8)}}
.dk-star svg{color:#fff4c2}
.dk-star .lab{max-width:60px;opacity:1;margin-left:6px;color:#fff}
.dk-star.on:before{display:none}.dk-star.on .lab,.dk-star.on svg{color:var(--p800)}
.dk-star.on .lab{max-width:60px}

/* ------------------------------------------------------------ Master page */
#view.mstv{padding-top:14px;padding-bottom:84px;max-width:none}
.mst{display:flex;flex-direction:column;gap:10px}
.mst-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.mst-title h1{font-size:22px;font-weight:800;color:var(--p900);line-height:1.1}.mst-title span{font-size:11.5px;color:var(--mute)}
.mst-find{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.75);border:1px solid var(--gline);border-radius:12px;padding:6px 11px;min-width:230px;backdrop-filter:blur(12px)}
.mst-find svg{width:15px;height:15px;color:var(--faint)}.mst-find input{border:0;outline:0;background:none;flex:1;min-width:0}
.mst-find:focus-within{border-color:var(--p300);box-shadow:0 0 0 4px var(--p50)}
.mst-chip{display:inline-flex;align-items:center;gap:6px;border:0;background:var(--p100);color:var(--p800);font-weight:700;font-size:12px;border-radius:20px;padding:5px 11px;cursor:pointer}.mst-chip:hover{background:var(--p200)}
.mst-card{padding:0;overflow:hidden;border-radius:16px}
.xg{height:max(300px,calc(100vh - 280px));outline:0;position:relative}
.xg-s{position:absolute;inset:0;overflow:auto;background:#fff}
.xg-h{position:sticky;top:0;z-index:5;display:flex;height:36px}
.xg-hc{position:relative;flex:none;display:flex;align-items:center;gap:4px;padding:0 6px 0 10px;height:36px;background:linear-gradient(#f7f5fd,#efebfa);border-right:1px solid #ddd6f0;border-bottom:2px solid #cbbff0;font-size:12px;font-weight:700;color:#3b2a6b;cursor:pointer;user-select:none;overflow:hidden}
.xg-hc:first-child{position:sticky;left:0;z-index:6}
.xg-hc:hover{background:#ebe5fb}.xg-hc.cs{background:#e4dbfb}.xg-hc.f{background:#e9defc;color:var(--p800)}
.xg-ht{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.xg-sort{font-style:normal;font-size:9px;color:var(--p600)}
.xg-fb{flex:none;width:22px;height:22px;border:0;background:none;border-radius:6px;cursor:pointer;color:#9a8fc4;display:grid;place-items:center;padding:0}.xg-fb svg{width:13px;height:13px}.xg-fb:hover{background:#d9cff6;color:var(--p800)}
.xg-hc.f .xg-fb{background:var(--p600);color:#fff}
.xg-rs{position:absolute;right:0;top:0;bottom:0;width:7px;cursor:col-resize}.xg-rs:hover{background:rgba(124,58,237,.35)}
.xg-b{position:relative}
.xg-w{position:absolute;left:0;top:0;width:0;height:0}
.xg-r{position:absolute;left:0;display:flex;height:28px;width:max-content;background:#fff;border-bottom:1px solid #ebe7f6}
.xg-r.z{background:#fbfaff}
.xg-r.vac{background:#fff8ef}.xg-r.vac.z{background:#fff5e8}
.xg-r:hover{background:#f3eefe}
.xg-r.sel{background:#ece4fe}
.xg-c{flex:none;height:28px;line-height:27px;padding:0 10px;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-right:1px solid #ebe7f6;cursor:cell;color:var(--ink)}
.xg-c:first-child{position:sticky;left:0;z-index:2;background:inherit;color:var(--mute);text-align:right;border-right:1px solid #d5ccee;font-variant-numeric:tabular-nums}
.xg-c.m{font-family:Consolas,"Cascadia Mono",monospace;font-size:12px}.xg-c.n{font-variant-numeric:tabular-nums}
.xg-c.vt{color:#b7791f;font-weight:700;font-size:11px;letter-spacing:.08em}
.xg-c.ac{outline:2px solid var(--p600);outline-offset:-2px;background:#fff!important}
.xg-foot{display:flex;align-items:center;gap:14px;padding:7px 14px;border-top:1px solid var(--line);background:rgba(246,242,255,.8);font-size:12px;color:var(--mute)}
.xg-foot b{color:var(--p900)}.xg-ff{display:inline-flex;align-items:center;gap:5px;color:var(--p700);font-weight:600;background:var(--p100);padding:2px 10px;border-radius:12px}
/* Excel-style filter list */
.xf{position:fixed;z-index:95;width:282px;border-radius:14px;background:rgba(255,255,255,.96);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);border:1px solid #d7cdf2;box-shadow:0 24px 60px rgba(59,26,122,.32);padding:8px;animation:pop .16s both}
.xf-t{padding:4px 8px 6px;font-weight:800;font-size:12.5px;color:var(--p900)}
.xf-o{display:flex;align-items:center;gap:9px;width:100%;border:0;background:none;padding:7px 8px;border-radius:8px;font-size:13px;color:var(--ink);cursor:pointer;text-align:left}.xf-o:hover:not(:disabled){background:var(--p50)}.xf-o:disabled{opacity:.4;cursor:default}.xf-o svg{width:14px;height:14px;color:var(--p600)}
.xf-sep{height:1px;background:var(--line);margin:6px 0}
.xf-sr{display:flex;align-items:center;gap:8px;border:1.5px solid var(--line);border-radius:9px;padding:5px 9px;margin-bottom:6px}.xf-sr:focus-within{border-color:var(--p400)}.xf-sr svg{width:14px;height:14px;color:var(--faint)}.xf-sr input{border:0;outline:0;flex:1;min-width:0;background:none}
.xf-l{height:224px;overflow:auto;border:1px solid var(--line);border-radius:9px;padding:3px;background:#fff}
.xf-i{display:flex;align-items:center;gap:8px;padding:4px 8px;border-radius:6px;cursor:pointer;font-size:13px}.xf-i:hover{background:var(--p50)}.xf-i input{accent-color:var(--p600);width:15px;height:15px;flex:none}
.xf-i span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.xf-i em{font-style:normal;font-size:11px;color:var(--faint);font-variant-numeric:tabular-nums}.xf-i.all{font-weight:700;border-bottom:1px solid var(--line);border-radius:6px 6px 0 0;margin-bottom:2px}
.xf-f{display:flex;align-items:center;gap:8px;margin-top:8px}

/* ============================================================ table borders (every cell, header rows included) */
.matrix{--mxb:#d8cff0;--mxg:#bba8f0}
.matrix thead th{border:1px solid var(--mxb)}
.matrix thead .s2 th{border-left:1px solid var(--mxb);border-right:1px solid var(--mxb);border-top:1px solid var(--mxb)}
.matrix thead .s2 th.gs{border-left:2px solid var(--mxg)}
.matrix thead .sbh{border-left:1px solid var(--mxb);border-right:2px solid var(--mxg)}
.matrix tr.grand td{border-bottom:1px solid var(--mxb)}
.matrix tr.grand td:first-child,.matrix tr.grand td:last-child{border-left:1px solid var(--mxb);border-right:1px solid var(--mxb)}
.matrix td.nvc{border:1px solid var(--mxb);border-left:2px solid var(--mxg)}

/* ============================================================ Master: zoom, levels, call buttons, updates */
.mst-zoom{display:inline-flex;align-items:center;gap:2px;background:rgba(255,255,255,.75);border:1px solid var(--gline);border-radius:12px;padding:3px;backdrop-filter:blur(12px)}
.mst-zoom button{border:0;background:none;border-radius:9px;min-width:28px;height:28px;font-weight:800;font-size:15px;color:var(--p800);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:0 6px}.mst-zoom button:hover{background:var(--p50)}
.mst-zoom .fit{font-size:12.5px;font-weight:700;padding:0 10px;background:var(--p100)}.mst-zoom .fit svg{width:14px;height:14px}.mst-zoom .fit:hover{background:var(--p200)}
.mst-zoom span{min-width:46px;text-align:center;font-weight:700;font-size:12.5px;color:var(--p900);cursor:pointer}
.xg-hc{font-size:calc(12px * var(--xz,1))}
.xg-c{font-size:calc(12.5px * var(--xz,1))}
.xg-c.vt{font-size:calc(11px * var(--xz,1))}
.xg-r.vac{background:inherit}
/* bold + highlighted Level 4, 3 and 2 rows */
.xg-r.xg-l4{background:#d9cbfc;font-weight:800}.xg-r.xg-l4 .xg-c{color:#2e1065;border-color:#c3b0f4}
.xg-r.xg-l3{background:#e6dcfe;font-weight:800}.xg-r.xg-l3 .xg-c{color:#3b1a7a;border-color:#d0c0f6}
.xg-r.xg-l2{background:#f2ebff;font-weight:700}.xg-r.xg-l2 .xg-c{color:#4c1d95;border-color:#e0d4fa}
.xg-r.xg-l4 .xg-c:first-child{background:#c8b3fa;color:#2e1065}.xg-r.xg-l3 .xg-c:first-child{background:#d8c9fc;color:#3b1a7a}.xg-r.xg-l2 .xg-c:first-child{background:#e8dcfd;color:#4c1d95}
.xg-r.xg-l4:hover,.xg-r.xg-l3:hover,.xg-r.xg-l2:hover{filter:brightness(.97)}
.xg-r.xg-res .xg-c{color:#b3add0}
.xg-r.sel,.xg-r.sel.xg-l2,.xg-r.sel.xg-l3,.xg-r.sel.xg-l4{background:#e2d6fd}
.xg-r.sel .xg-c:first-child{background:#d6c6fb}
.xg-lg{display:inline-flex;align-items:center;gap:6px;margin-left:6px;font-size:11.5px;color:var(--mute)}
.xg-lg i{width:13px;height:13px;border-radius:4px;display:inline-block;border:1px solid rgba(76,29,149,.25)}
.xg-lg i.l4{background:#d9cbfc}.xg-lg i.l3{background:#e6dcfe}.xg-lg i.l2{background:#f2ebff}
/* phone: call + WhatsApp */
.xg-c.p{display:flex;align-items:center;gap:6px}
.xg-pn{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
.xg-pa{flex:none;width:calc(20px * var(--xz,1));height:calc(20px * var(--xz,1));border-radius:6px;display:grid;place-items:center;background:#e8f0ff;color:#2f6bf0;transition:.18s}
.xg-pa svg{width:calc(12px * var(--xz,1));height:calc(12px * var(--xz,1))}
.xg-pa.wa{background:#dcf8e7;color:#12a150}.xg-pa:hover{transform:scale(1.18);box-shadow:0 4px 10px rgba(59,26,122,.25);text-decoration:none}
/* in-place update */
.xg-c.ed{position:relative}
.xg-ed{display:none;position:absolute;right:3px;top:50%;transform:translateY(-50%);width:calc(20px * var(--xz,1));height:calc(20px * var(--xz,1));border:0;border-radius:6px;background:var(--p600);color:#fff;cursor:pointer;place-items:center;padding:0;box-shadow:0 4px 10px rgba(124,58,237,.4)}
.xg-ed svg{width:calc(11px * var(--xz,1));height:calc(11px * var(--xz,1))}
.xg-c.ed:hover .xg-ed,.xg-c.ed.ac .xg-ed{display:grid}
.xg-c.p.ed:hover .xg-ed,.xg-c.p.ed.ac .xg-ed{right:calc(48px * var(--xz,1))}
.xg-pe{flex:none;color:var(--p500);display:inline-flex}.xg-pe svg{width:11px;height:11px}
.xe{position:fixed;z-index:96;width:352px;border-radius:16px;background:rgba(255,255,255,.97);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid #d7cdf2;box-shadow:0 26px 64px rgba(59,26,122,.34);animation:pop .16s both}
.xe-t{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line);background:linear-gradient(120deg,var(--p50),#fff);border-radius:16px 16px 0 0}
.xe-t>svg{color:var(--p600);width:18px;height:18px}.xe-t b{display:block;color:var(--p900);font-size:14px}.xe-t span{font-size:11.5px;color:var(--mute)}.xe-t>div{flex:1;min-width:0}
.xe-x{border:0;background:none;width:26px;height:26px;border-radius:8px;cursor:pointer;color:var(--mute);display:grid;place-items:center}.xe-x:hover{background:var(--p50);color:var(--p700)}
.xe-b{padding:14px}.xe-f{display:flex;align-items:center;gap:8px;padding:10px 14px 14px}

/* ============================================================ Master v3: deep header, separable level colours, column chooser */
.xg-hc{background:linear-gradient(#5d33b5,#47199b);color:#fff;border-right:1px solid rgba(255,255,255,.22);border-bottom:2px solid #2b0f66;align-items:center;padding:0 4px 0 9px;overflow:hidden}
.xg-hc:hover{background:linear-gradient(#6a3fc4,#521fb0)}.xg-hc.cs{background:linear-gradient(#7547d1,#5a26bd)}
.xg-hc.f{background:linear-gradient(#7a2fc7,#5b1fa8)}
.xg-ht{white-space:normal;line-height:1.15;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word;font-size:inherit}
.xg-sort{color:#fde68a;font-size:10px}
.xg-fb{color:rgba(255,255,255,.75)}.xg-fb:hover{background:rgba(255,255,255,.22);color:#fff}
.xg-hc.f .xg-fb{background:#fff;color:#5b1fa8}
.xg-pe{color:#e9d5ff}
.xg-rs:hover{background:rgba(255,255,255,.45)}
/* three clearly different level colours: Level 4 violet, Level 3 pink, Level 2 sky blue */
.xg-r.xg-l4{background:#c7b6fb;font-weight:800}.xg-r.xg-l4 .xg-c{color:#2a0f63;border-color:#aa94ee}
.xg-r.xg-l3{background:#f8c9e9;font-weight:800}.xg-r.xg-l3 .xg-c{color:#7a0f55;border-color:#eeaad6}
.xg-r.xg-l2{background:#cfe6ff;font-weight:700}.xg-r.xg-l2 .xg-c{color:#0c3d7a;border-color:#a9cdf5}
.xg-r.xg-l4 .xg-c:first-child{background:#b4a0f6;color:#2a0f63}
.xg-r.xg-l3 .xg-c:first-child{background:#f2b3dc;color:#7a0f55}
.xg-r.xg-l2 .xg-c:first-child{background:#b9d8fb;color:#0c3d7a}
.xg-r.sel,.xg-r.sel.xg-l2,.xg-r.sel.xg-l3,.xg-r.sel.xg-l4{background:#fff1b8}
.xg-r.sel .xg-c:first-child{background:#ffe58a}
.xg-lg i.l4{background:#c7b6fb}.xg-lg i.l3{background:#f8c9e9}.xg-lg i.l2{background:#cfe6ff}
.xg-c:first-child{text-align:left;color:inherit;font-variant-numeric:normal}
.xg-c.sl{text-align:right;color:var(--mute);font-variant-numeric:tabular-nums}
.xg-r.xg-l4 .xg-c.sl,.xg-r.xg-l3 .xg-c.sl,.xg-r.xg-l2 .xg-c.sl{color:inherit}
/* column chooser */
.mst-cols b{font-size:10.5px;background:var(--p100);color:var(--p800);border-radius:9px;padding:0 6px;margin-left:2px}.mst-cols b:empty{display:none}
.xc{position:fixed;z-index:95;width:330px;border-radius:16px;background:rgba(255,255,255,.97);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid #d7cdf2;box-shadow:0 26px 64px rgba(59,26,122,.32);padding:12px;animation:pop .16s both}
.xc-t{font-weight:800;color:var(--p900);margin-bottom:8px}
.xc-p{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.xc-p button{border:1.5px solid var(--line);background:#fff;border-radius:10px;padding:8px 6px;font-weight:700;font-size:12.5px;color:var(--mute);cursor:pointer;transition:.18s}.xc-p button:hover{border-color:var(--p300)}
.xc-p button.on{background:linear-gradient(135deg,var(--p600),var(--p800));color:#fff;border-color:transparent;box-shadow:0 6px 16px rgba(124,58,237,.3)}
.xc-n{margin:9px 2px 4px;font-size:11.5px;color:var(--mute);line-height:1.35}
.xc-g{margin:10px 2px 4px;font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}
.xc-l{display:grid;grid-template-columns:1fr 1fr;gap:1px 8px}
.xc-i{display:flex;align-items:center;gap:7px;padding:4px 6px;border-radius:7px;cursor:pointer;font-size:12.5px}.xc-i:hover{background:var(--p50)}.xc-i input{accent-color:var(--p600);width:15px;height:15px}

.mst-find{min-width:170px;flex:0 1 230px}.mst-bar{row-gap:8px}
.mst-title span{display:none}
@media(min-width:1500px){.mst-title span{display:block}}

/* ============================================================ W/Ins tick */
.wi-tick{display:inline-flex;align-items:center;gap:8px;cursor:pointer;user-select:none;background:rgba(255,255,255,.75);border:1px solid var(--gline);border-radius:20px;padding:5px 12px 5px 8px;font-size:12.5px;font-weight:600;color:var(--mute);backdrop-filter:blur(12px);transition:.2s;white-space:nowrap}
.wi-tick:hover{border-color:var(--p300)}
.wi-tick input{position:absolute;opacity:0;width:0;height:0}
.wi-tick i{position:relative;width:30px;height:18px;border-radius:10px;background:var(--p200);flex:none;transition:.25s}
.wi-tick i:after{content:"";position:absolute;left:2px;top:2px;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.25);transition:.25s cubic-bezier(.3,1.4,.5,1)}
.wi-tick input:checked+i{background:linear-gradient(135deg,var(--p600),#c026d3)}.wi-tick input:checked+i:after{transform:translateX(12px)}
.wi-tick input:checked~span{color:var(--p800)}
.wi-tick b{font-size:10.5px;background:var(--p100);color:var(--p800);border-radius:8px;padding:1px 7px;margin-left:2px}
.wi-tick input:focus-visible+i{outline:2px solid var(--p400);outline-offset:2px}
.hm.wi{--mxh:clamp(24px,calc((100vh - 446px) / 9),46px)}
.matrix tr.wir th,.matrix tr.wir td{background:#fbf6ff;font-style:italic;color:var(--p800);height:var(--mxh,38px)}
.matrix tr.wir th small{display:block;font-size:10px;font-style:normal;color:var(--faint);font-weight:600;letter-spacing:.02em}
.matrix tr.wir td.hv:hover{background:var(--p100)}

/* compact side column so the home page stays on one screen */
.hm-side{gap:10px}
.hm-side .card{padding:10px 14px}.hm-side .ctitle{margin-bottom:7px;font-size:13.5px}
.hm-side .pcard{padding:6px 10px;gap:9px;font-size:12.5px;border-radius:12px}.hm-side .pcard+.pcard{margin-top:6px}
.hm-side .pcard .pi{width:26px;height:26px;border-radius:8px}.hm-side .pcard .pi svg{width:14px;height:14px}
.hm-side .dbox{transform:scale(.82);transform-origin:left center;margin-right:-8px}
.hm-ok{padding:4px;gap:0}.hm-ok svg{width:18px;height:18px;margin-bottom:2px}.hm-ok span{font-size:11.5px}
.hm-chips{gap:6px}.hm-chips .chip{padding:3px 10px}

/* ============================================================ related colours: violet / indigo / aqua (no red) */
.xg-r.xg-l4{background:#cfc0fb}.xg-r.xg-l4 .xg-c{color:#2a0f63;border-color:#b4a0f0}
.xg-r.xg-l3{background:#bccbfb}.xg-r.xg-l3 .xg-c{color:#14307e;border-color:#9fb4ee}
.xg-r.xg-l2{background:#c4ecf4}.xg-r.xg-l2 .xg-c{color:#0b4a5c;border-color:#98d2e0}
.xg-r.xg-l4 .xg-c:first-child{background:#bba7f7;color:#2a0f63}
.xg-r.xg-l3 .xg-c:first-child{background:#a5b9f6;color:#14307e}
.xg-r.xg-l2 .xg-c:first-child{background:#a8e0ec;color:#0b4a5c}
.xg-lg i.l4{background:#cfc0fb}.xg-lg i.l3{background:#bccbfb}.xg-lg i.l2{background:#c4ecf4}
/* vacant numbers: fuchsia instead of red */
.matrix .vv,.matrix tr.nat td.vN,.matrix tr.grand td.v,.matrix tr.grand td.v{color:#a21caf}
.matrix .vv.zero{color:#cdc8e0}
.matrix thead .gV{color:#a21caf}
.matrix tr.nat td.vN{color:#a21caf}
.xc-p{grid-template-columns:1fr 1fr 1fr}.xc-p button{padding:8px 4px;font-size:12px}
.xc{width:360px}

/* table borders v3: same lines on every cell (also National / total rows), slightly stronger */
.matrix{--mxb:#cdc1ee;--mxg:#b3a0ec}
.matrix th,.matrix td{border:1px solid var(--mxb)}
.matrix .gs{border-left:2px solid var(--mxg)}
.matrix tr.nat th,.matrix tr.nat td,.matrix tr.nat td.vN,.matrix tr.nat td.gs{border-top:2px solid var(--mxg)!important;border-bottom:2px solid var(--mxg)!important;border-right:1px solid var(--mxb)!important;border-left:1px solid var(--mxb)!important;background:var(--p50)}
.matrix tr.nat td.gs{border-left:2px solid var(--mxg)!important}
.matrix tr.nat th{border-right:2px solid var(--mxg)!important}
.matrix tr.wir th,.matrix tr.wir td{border:1px solid var(--mxb)}
.matrix tr.wir td.gs{border-left:2px solid var(--mxg)}
.matrix tr.grand td{border-top:2px solid var(--mxg)!important;border-right:1px solid var(--mxb);border-left:1px solid var(--mxb)}
.matrix tr.grand td.a,.matrix tr.grand td.v{border-left:2px solid var(--mxg)!important}
.matrix td.nvc{border-left:2px solid var(--mxg)}
#mxWrap{border:2px solid var(--mxg)}

/* proof box */
.ax-proofon{margin:-2px 0 10px}
.ax-proof{border:2px dashed var(--p300);border-radius:14px;background:rgba(246,242,255,.7);padding:12px;margin-bottom:12px;outline:0;transition:.2s}
.ax-proof:focus,.ax-proof.over{border-color:var(--p600);background:#fff;box-shadow:0 0 0 4px var(--p50)}
.ax-pz{display:flex;gap:12px;align-items:center;color:var(--p800)}.ax-pz>svg{width:26px;height:26px;color:var(--p500);flex:none}
.ax-pz small{display:block;color:var(--mute);font-size:11.5px;line-height:1.4;margin-top:2px}
#proofList:empty{display:none}
.ax-pf{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:6px 10px;margin-top:8px;font-size:12.5px}
.ax-pf svg{width:15px;height:15px;color:var(--p600);flex:none}.ax-pf a{flex:1;min-width:0;font-weight:600}.ax-pf em{font-style:normal;color:var(--faint);font-size:11px}
.ax-pf button{border:0;background:none;font-size:18px;line-height:1;color:var(--mute);cursor:pointer;border-radius:6px;width:22px;height:22px}.ax-pf button:hover{background:var(--badbg);color:var(--bad)}
#pnProofs .ax-pf:first-child{margin-top:0}

/* bulk upload */
.bk-seg{margin-bottom:16px}
.bk-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:start}
@media(max-width:1000px){.bk-grid{grid-template-columns:1fr}}
.bk-n{width:24px;height:24px;border-radius:50%;background:linear-gradient(135deg,var(--p600),#c026d3);color:#fff;display:inline-grid;place-items:center;font-size:12px;font-weight:800}
.bk-cols{display:flex;flex-wrap:wrap;gap:8px}
.bk-col{display:flex;flex-direction:column;gap:1px;background:rgba(255,255,255,.7);border:1px solid var(--line);border-radius:12px;padding:7px 11px;min-width:120px}
.bk-col b{font-size:12.5px;color:var(--p900)}.bk-col i{font-style:normal;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}
.bk-col small{font-size:11px;color:var(--mute);font-family:Consolas,monospace;min-height:14px}
.bk-col.req{border-color:var(--p300);background:var(--p50)}.bk-col.req i{color:#c026d3}.bk-col.req b:after{content:" *";color:#c026d3}
.bk-ta{min-height:150px;font-family:Consolas,"Cascadia Mono",monospace;font-size:12.5px;white-space:pre;overflow:auto}
.bk-sum{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.bk-t td{vertical-align:top}.bk-bad td{background:rgba(162,28,175,.05)}.bk-err{color:#a21caf}

/* reports page */
.rp-bar{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-end;padding:14px 18px;margin-bottom:6px}
.rp-f{display:flex;flex-direction:column;gap:4px}.rp-f .in{width:auto}
.rp-sec{margin:22px 0 10px}
.rp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(400px,1fr));gap:12px}
.rp-r{display:flex;gap:12px;align-items:flex-start;padding:14px 16px}
.rp-r .pi{width:38px;height:38px;border-radius:12px;background:var(--p100);color:var(--p700);display:grid;place-items:center;flex:none}.rp-r .pi svg{width:19px;height:19px}
.rp-r b{font-size:14px;color:var(--p900)}
.rp-b{display:flex;gap:6px;flex:none}
.rp-t td,.rp-t th{white-space:nowrap}

.ax-proofrow{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:-2px 0 10px}
.ax-proofrow .ax-proofon{margin:0}

/* upload progress */
.ax-up{margin-top:8px;display:flex;flex-direction:column;gap:6px}.ax-up:empty{display:none}
.ax-upr{background:#fff;border:1px solid var(--line);border-radius:10px;padding:7px 10px}
.ax-upt{display:flex;gap:8px;align-items:center;font-size:12.5px}.ax-upt span{flex:1;min-width:0;font-weight:600}.ax-upt em{font-style:normal;color:var(--faint);font-size:11px}.ax-upt b{font-size:11.5px;color:var(--p700);min-width:92px;text-align:right}
.ax-bar{height:6px;border-radius:4px;background:var(--p100);margin-top:6px;overflow:hidden}
.ax-bar i{display:block;height:100%;width:0;border-radius:4px;background:linear-gradient(90deg,var(--p500),#c026d3);transition:width .25s ease;background-size:200% 100%;animation:barflow 1.2s linear infinite}
.ax-upr.ok .ax-bar i{background:var(--good);animation:none}.ax-upr.ok .ax-upt b{color:var(--good)}
.ax-upr.bad .ax-bar i{background:var(--bad);animation:none}.ax-upr.bad .ax-upt b{color:var(--bad)}
@keyframes barflow{to{background-position:-200% 0}}
/* quick-look window */
.pv{position:fixed;inset:0;z-index:130;display:grid;place-items:center;background:rgba(32,14,70,.38);backdrop-filter:blur(4px);opacity:0;transition:opacity .2s;padding:20px}
.pv.on{opacity:1}
.pv-box{width:min(920px,100%);max-height:calc(100vh - 40px);display:flex;flex-direction:column;border-radius:20px;background:rgba(255,255,255,.94);backdrop-filter:blur(28px);border:1px solid var(--gline);box-shadow:0 30px 80px rgba(0,0,0,.35);overflow:hidden;transform:translateY(10px) scale(.98);transition:transform .25s cubic-bezier(.2,.9,.2,1)}
.pv.on .pv-box{transform:none}
.pv-top{display:flex;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid var(--line);background:linear-gradient(120deg,var(--p50),#fff)}
.pv-t{min-width:0;display:flex;flex-direction:column;line-height:1.2}.pv-t b{font-size:14.5px;color:var(--p900)}.pv-t span{font-size:11.5px;color:var(--mute)}
.pv-body{padding:16px;overflow:auto;flex:1;min-height:200px}
.pv-body img{display:block;max-width:100%;max-height:70vh;margin:0 auto;border-radius:10px;box-shadow:0 8px 24px rgba(59,26,122,.18)}
.pv-body iframe{width:100%;height:70vh;border:1px solid var(--line);border-radius:10px;background:#fff}
.pv-h{display:grid;grid-template-columns:70px 1fr;gap:4px 12px;margin:0 0 10px;font-size:13px}.pv-h dt{color:var(--faint);font-weight:700;font-size:11.5px;text-transform:uppercase;letter-spacing:.06em}.pv-h dd{margin:0;word-break:break-word}
.pv-at{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}.pv-at span{display:inline-flex;gap:5px;align-items:center;background:var(--p50);border:1px solid var(--p200);border-radius:20px;padding:3px 10px;font-size:12px;font-weight:600;color:var(--p800)}.pv-at svg{width:13px;height:13px}
.pv-pre{white-space:pre-wrap;word-break:break-word;font:13px/1.55 "Segoe UI",system-ui,sans-serif;background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px;margin:0;max-height:52vh;overflow:auto}
.pv-tb td{white-space:nowrap;font-size:12.5px}

.up-l{margin-top:2px}.up{display:inline-block;color:var(--p700);font-size:11px;margin-right:4px}.up b{font-family:Consolas,monospace;color:var(--p900)}
.pk .opt .up-l{white-space:normal}

/* buffer people sit under the supervisor they report to */
.xg-r.xg-buf{background:#fff3df}.xg-r.xg-buf .xg-c{color:#8a4b08;font-style:italic;border-color:#f3dcb4}.xg-r.xg-buf .xg-c:first-child{background:#fbe3b8;color:#8a4b08}
.xg-lg i.lb{background:#fff3df}

/* the paste icon in the proof box */
.ax-pzb{flex:none;width:44px;height:44px;border-radius:13px;border:1px solid var(--p300);background:#fff;color:var(--p600);display:grid;place-items:center;cursor:pointer;transition:.18s;box-shadow:0 2px 6px rgba(106,76,200,.12)}
.ax-pzb svg{width:22px;height:22px}
.ax-pzb:hover{background:var(--p600);color:#fff;transform:translateY(-1px);box-shadow:0 6px 14px rgba(106,76,200,.28)}
.ax-pzb:active{transform:scale(.94)}

/* the divider in front of "Not verified" runs unbroken through the National, W/Ins and total rows */
.matrix td.nvn,.matrix tr.nat td.nvn,.matrix tr.wir td.nvn,.matrix tr.grand td.nvn{border-left:2px solid var(--mxg)!important}
.matrix tr.nat td.nvn{background:var(--p50);border-top:2px solid var(--mxg)!important;border-bottom:2px solid var(--mxg)!important}
.matrix tr.grand td.nvn{border-top:2px solid var(--mxg)!important}

/* which Outlook opens */
.olm{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:12px}
.olm-b{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border-radius:999px;border:1px solid var(--p200);background:rgba(255,255,255,.8);color:var(--p800);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;transition:.18s}
.olm-b svg{width:15px;height:15px}.olm-b i{font-style:normal;font-weight:500;color:var(--mute);font-size:11px}
.olm-b:hover{border-color:var(--p400);background:#fff}
.olm-b.on{background:linear-gradient(135deg,var(--p600),var(--p500));border-color:transparent;color:#fff;box-shadow:0 4px 12px rgba(106,76,200,.28)}.olm-b.on i{color:rgba(255,255,255,.8)}

/* verify an existing, not yet verified employee */
.ax-vf{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;margin-bottom:14px;border-radius:14px;background:linear-gradient(135deg,#ecfdf5,#f6f2ff);border:1px solid #bfe9d6;color:var(--p900)}
.ax-vf>svg{width:24px;height:24px;color:#0f9d8a;flex:none;margin-top:1px}
.ax-vf b{font-size:13.5px}.ax-vf small{display:block;margin-top:3px;color:var(--mute);font-size:12px;line-height:1.45}
.in.ro,.in:disabled{background:#f3f0fb;color:var(--p900);opacity:1;cursor:not-allowed;border-color:var(--p100)}
.in.ro{display:flex;align-items:center;gap:8px;min-height:40px}
.ax-vfok{display:flex;align-items:center;gap:8px;margin:2px 0 10px;padding:10px 12px;border-radius:12px;background:#fff;border:1px dashed var(--p300)}
.ax-vfbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 14px}

/* mail log preview + rows */
.mlrow:hover td{background:var(--p50)}
.mlv-h{grid-template-columns:96px 1fr}
.pv-body iframe.mlv-f{height:52vh;margin-top:6px}

/* "Opens in ..." – hidden until asked for */
.olm-d{margin-top:12px}
.olm-d summary{cursor:pointer;list-style:none;display:inline-flex;align-items:center;gap:8px;font-size:12.5px;color:var(--mute)}
.olm-d summary::-webkit-details-marker{display:none}
.olm-d summary b{color:var(--p800)}
.olm-d summary span{color:var(--p600);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.olm-d[open] summary span{display:none}

/* bulk entry: the draft grid */
.bkd-card{overflow:visible}
.bkd-scroll{max-height:none;overflow:auto;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.7)}
.bkd-t{min-width:1080px;border-collapse:separate;border-spacing:0}
.bkd-t th{position:sticky;top:0;background:var(--p50);z-index:1;white-space:nowrap}
.bkd-t td{vertical-align:top;padding:8px 8px;border-bottom:1px solid var(--line)}
.bkd-t .bk-in{padding:7px 9px;font-size:13px;min-width:80px}
.bkd-t .bk-up{text-transform:uppercase;font-family:Consolas,monospace}
.bkd-t tr.bkd-ok td:first-child{box-shadow:inset 4px 0 0 var(--good,#10a355)}
.bkd-t tr.bk-bad td:first-child{box-shadow:inset 4px 0 0 #b4506e}
.bkd-t tr.bkd-wait td:first-child{box-shadow:inset 4px 0 0 #e2a23b}
.bkd-t tr.bk-bad{background:rgba(180,80,110,.06)}
.bkd-t tr.bkd-wait{background:rgba(226,162,59,.07)}
.bkd-wmsg{color:#9a6410}
.bkd-to{margin-top:3px;line-height:1.3}
.bkd-emp b{font-size:13px}
.bkd-paste{margin-bottom:12px;padding:12px;border:1px dashed var(--p300);border-radius:14px;background:var(--p50)}
.bkd-n{padding-top:14px!important}

.ax-multi{display:flex;gap:10px;align-items:center;padding:10px 12px;margin-bottom:12px;border-radius:12px;background:var(--p50);border:1px dashed var(--p300);color:var(--p800);font-size:12.5px;text-decoration:none}
.ax-multi svg{width:20px;height:20px;color:var(--p600);flex:none}.ax-multi:hover{background:#fff;border-color:var(--p500)}

.bkd-promo select{min-width:110px}
.bkd-pl .pill{white-space:nowrap}

/* quick filters inside a column's filter menu */
.xf-q{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:6px 10px 2px}
.xf-q span{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.xf-qb{border:1px solid var(--p200);background:#fff;color:var(--p800);border-radius:999px;padding:4px 10px;font:inherit;font-size:12px;font-weight:600;cursor:pointer;transition:.15s}
.xf-qb:hover{border-color:var(--p400)}
.xf-qb.on{background:var(--p600);border-color:var(--p600);color:#fff}

/* "Vacant only" in the Show columns panel */
.xc-vac{grid-column:1/-1}
.xc-vac.on{background:var(--p600)!important;border-color:var(--p600)!important;color:#fff!important}