:root{
  --blue:#258dd6;--blue-d:#1a6faa;--blue-dd:#0f4d7a;--blue-l:#4aa8e8;--blue-xl:#e8f4fc;
  --bg:#f0f5fa;--surf:#fff;--surf2:#f7fafd;
  --brd:rgba(37,141,214,.13);--brd2:rgba(37,141,214,.28);
  --txt:#0a1628;--txt2:#2d4a6b;--dim:#7a96b4;
  --grn:#1db87a;--grn-bg:rgba(29,184,122,.1);
  --red:#e05252;--red-bg:rgba(224,82,82,.1);
  --ora:#e8892a;--ora-bg:rgba(232,137,42,.1);
  --pur:#7c5ce8;--pur-bg:rgba(124,92,232,.1);
  --yel:#f0b429;--yel-bg:rgba(240,180,41,.1);
  --sb-bg:#0f4d7a;
  --r:14px;--r-sm:9px;--r-xs:6px;
  --sh:0 1px 3px rgba(37,141,214,.07),0 4px 16px rgba(37,141,214,.05);
  --sh-md:0 4px 24px rgba(37,141,214,.13);--sh-lg:0 8px 48px rgba(15,77,122,.2);
}
[data-theme="dark"]{
  --bg:#0a0a0a;--surf:#141414;--surf2:#1a1a1a;
  --brd:rgba(255,255,255,.08);--brd2:rgba(255,255,255,.14);
  --txt:#f0f0f0;--txt2:#a0a0a0;--dim:#555;
  --sb-bg:#000;
  --blue-xl:rgba(37,141,214,.1);
  --sh:0 1px 3px rgba(0,0,0,.5),0 4px 16px rgba(0,0,0,.4);
  --sh-md:0 4px 24px rgba(0,0,0,.55);--sh-lg:0 8px 48px rgba(0,0,0,.7);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:15px}body{font-family:'Poppins',sans-serif;background:var(--bg);color:var(--txt);overflow-x:hidden;transition:background .25s,color .25s}
::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:rgba(37,141,214,.2);border-radius:4px}
/* LOGIN */
#ls{position:fixed;inset:0;background:linear-gradient(135deg,var(--blue-dd) 0%,#1558a0 60%,var(--blue) 100%);display:flex;align-items:center;justify-content:center;z-index:999}
.lc{background:#fff;border-radius:20px;padding:44px 40px;width:min(420px,94vw);box-shadow:0 20px 60px rgba(0,0,0,.35)}
.ll{text-align:center;margin-bottom:28px}.ll .n{font-family:'Bricolage Grotesque',sans-serif;font-size:32px;font-weight:800;color:var(--blue-dd);letter-spacing:4px}.ll .s{font-size:10px;color:var(--dim);letter-spacing:3px;text-transform:uppercase;margin-top:3px}
.lt{font-family:'Bricolage Grotesque',sans-serif;font-size:20px;font-weight:700;color:#0a1628;margin-bottom:20px;text-align:center}
.lf{margin-bottom:14px}.lf label{font-size:10px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:#7a96b4;display:block;margin-bottom:5px}
.li{width:100%;border:2px solid rgba(37,141,214,.2);border-radius:9px;padding:11px 14px;font-size:13.5px;color:#0a1628;font-family:'Poppins',sans-serif;outline:none;transition:border-color .2s,box-shadow .2s;background:#f7fafd}
.li:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(37,141,214,.1);background:#fff}
.lb{width:100%;background:var(--blue);color:#fff;border:none;border-radius:9px;padding:12px;font-size:14px;font-weight:600;cursor:pointer;font-family:'Poppins',sans-serif;margin-top:8px;transition:all .2s;box-shadow:0 3px 12px rgba(37,141,214,.4)}
.lb:hover{background:var(--blue-d);transform:translateY(-1px)}
.le{background:rgba(224,82,82,.1);color:#e05252;border:1px solid rgba(224,82,82,.25);border-radius:8px;padding:10px 14px;font-size:12.5px;margin-bottom:12px;display:none}
/* LAYOUT */
.app{display:flex;height:100vh;overflow:hidden}
/* SIDEBAR */
.sb{width:248px;min-width:248px;background:linear-gradient(180deg,#0d4a72 0%,#0f587f 48%,#0b3f62 100%);display:flex;flex-direction:column;overflow-y:auto;transition:background .25s;box-shadow:inset -1px 0 0 rgba(255,255,255,.08),0 14px 36px rgba(2,16,30,.28)}
.sb-h{padding:26px 22px 20px;border-bottom:1px solid rgba(255,255,255,.12)}
.sb-lo{display:flex;align-items:center;gap:12px}
.sb-ic{width:42px;height:42px;background:linear-gradient(135deg,var(--blue-l),var(--blue));border-radius:11px;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 4px 16px rgba(37,141,214,.45)}
.sb-ic svg{width:20px;height:20px;color:#fff}
.sb-n{font-family:'Bricolage Grotesque',sans-serif;font-size:21px;font-weight:800;color:#fff;letter-spacing:3px;line-height:1}
.sb-s{font-size:8.5px;color:rgba(255,255,255,.6);letter-spacing:3px;text-transform:uppercase;margin-top:3px}
.sb-sep{height:1px;background:rgba(255,255,255,.12);margin:6px 0}
.sb-lbl{font-size:9px;font-weight:700;letter-spacing:2.8px;text-transform:uppercase;color:rgba(255,255,255,.72);padding:16px 22px 6px}
.nb{display:flex;align-items:center;gap:12px;padding:12px 24px;cursor:pointer;border:none;border-left:3px solid transparent;color:rgba(255,255,255,.94);font-size:13px;font-weight:500;transition:all .15s;background:none;width:100%;text-align:left;font-family:'Poppins',sans-serif;letter-spacing:.1px}
.nb:hover{color:#fff;background:rgba(255,255,255,.16);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}.nb.on{color:#fff;border-left-color:#6cc7ff;background:linear-gradient(90deg,rgba(108,199,255,.24),rgba(255,255,255,.12));font-weight:700;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.nb svg{width:15px;height:15px;flex-shrink:0;opacity:.95;transition:opacity .15s}.nb:hover svg,.nb.on svg{opacity:1}
.sb-ft{margin-top:auto;padding:16px 22px;border-top:1px solid rgba(255,255,255,.12)}
.su{display:flex;align-items:center;gap:10px;cursor:pointer}
.sa{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--blue-l),var(--blue));display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:#fff;flex-shrink:0;border:2px solid rgba(255,255,255,.22)}
.sn{font-size:12.5px;font-weight:700;color:#fff}.sr{font-size:10px;color:rgba(255,255,255,.72)}
.sfb{display:flex;gap:6px;margin-top:12px}
.sbb{flex:1;padding:7px;border:1px solid rgba(255,255,255,.18);border-radius:7px;background:rgba(255,255,255,.12);color:rgba(255,255,255,.9);font-size:11px;cursor:pointer;text-align:center;transition:all .15s;font-family:'Poppins',sans-serif;display:flex;align-items:center;justify-content:center;gap:5px}
.sbb:hover{background:rgba(255,255,255,.2);color:#fff}.sbb svg{width:13px;height:13px}
/* MAIN */
.main{flex:1;display:flex;flex-direction:column;overflow:hidden}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:0 36px;height:66px;background:linear-gradient(90deg,var(--surf) 0%,#f8fbff 100%);border-bottom:1px solid var(--brd);flex-shrink:0;box-shadow:0 10px 32px rgba(15,77,122,.08);z-index:10;backdrop-filter:blur(12px)}
.tl h1{font-family:'Bricolage Grotesque',sans-serif;font-size:19px;font-weight:700;color:var(--blue-dd);line-height:1}
.tl p{font-size:11px;color:var(--txt2);margin-top:2px}
.tr{display:flex;align-items:center;gap:8px;flex-shrink:0}
.page{flex:1;overflow-y:auto;padding:28px 36px}
/* BUTTONS */
.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:var(--r-sm);font-size:12.5px;font-weight:500;cursor:pointer;border:none;transition:all .15s;font-family:'Poppins',sans-serif;white-space:nowrap}
.btn svg{width:13px;height:13px;flex-shrink:0}
.bp{background:linear-gradient(135deg,var(--blue-l),var(--blue));color:#fff;box-shadow:0 3px 12px rgba(37,141,214,.35)}.bp:hover{background:linear-gradient(135deg,var(--blue),var(--blue-d));transform:translateY(-2px);box-shadow:0 5px 18px rgba(37,141,214,.45)}
.bg{background:var(--blue-xl);color:var(--blue);border:1.5px solid rgba(37,141,214,.22)}.bg:hover{background:rgba(37,141,214,.15)}
.bw{background:var(--surf);color:var(--txt2);border:1.5px solid var(--brd);box-shadow:var(--sh)}.bw:hover{border-color:var(--blue-l);color:var(--blue)}
.bd{background:var(--red-bg);color:var(--red);border:1px solid rgba(224,82,82,.2)}.bd:hover{background:rgba(224,82,82,.18)}
.bsm{padding:6px 12px;font-size:11.5px}.bxs{padding:4px 9px;font-size:11px}
.bic{width:32px;height:32px;padding:0;justify-content:center}
/* CARDS */
.card{background:linear-gradient(180deg,var(--surf) 0%,var(--surf2) 100%);border:1px solid var(--brd);border-radius:var(--r);box-shadow:var(--sh);transition:box-shadow .2s,border-color .2s,transform .2s;overflow:hidden;position:relative}
.card:hover{box-shadow:var(--sh-md);border-color:var(--brd2);transform:translateY(-2px)}
.card::before{content:'';position:absolute;inset:0 0 auto 0;height:3px;background:linear-gradient(90deg,var(--blue-d),var(--blue-l));opacity:.95}
.ch{display:flex;align-items:center;justify-content:space-between;padding:17px 22px;border-bottom:1px solid var(--brd)}
.ct{font-family:'Bricolage Grotesque',sans-serif;font-size:15.5px;font-weight:700;color:var(--txt)}
.cb{padding:20px}
/* BADGES */
.badge{display:inline-flex;align-items:center;gap:4px;font-size:10.5px;font-weight:600;padding:3px 9px;border-radius:20px;white-space:nowrap}
.bb{background:rgba(37,141,214,.12);color:var(--blue)}.bg2{background:var(--grn-bg);color:var(--grn)}.br{background:var(--red-bg);color:var(--red)}.bp2{background:var(--pur-bg);color:var(--pur)}.bo{background:var(--ora-bg);color:var(--ora)}.bd2{background:rgba(122,150,180,.1);color:var(--dim)}.by{background:var(--yel-bg);color:#9a7200}
/* CONNECTION */
.cbn{display:flex;align-items:center;gap:7px;padding:5px 12px;border-radius:20px;font-size:11.5px;font-weight:500}
.cbn-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.cok{background:var(--grn-bg);color:var(--grn);border:1px solid rgba(29,184,122,.25)}.cok .cbn-dot{background:var(--grn)}
.cerr{background:var(--red-bg);color:var(--red);border:1px solid rgba(224,82,82,.25)}.cerr .cbn-dot{background:var(--red)}
.cload{background:var(--blue-xl);color:var(--blue);border:1px solid var(--brd2)}.cload .cbn-dot{background:var(--blue);animation:bl 1s infinite}
@keyframes bl{0%,100%{opacity:1}50%{opacity:.3}}
/* KPIs */
.kg{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:22px}
.kpi{background:var(--surf);border:1px solid var(--brd);border-radius:var(--r);padding:20px 18px 17px;position:relative;overflow:hidden;box-shadow:var(--sh);transition:all .18s;cursor:default}
.kpi:hover{transform:translateY(-2px);box-shadow:var(--sh-md);border-color:var(--brd2)}
.kpi::before{content:'';position:absolute;top:0;left:0;right:0;height:3px}
.kc1::before{background:linear-gradient(90deg,var(--blue-d),var(--blue-l))}
.kc2::before{background:linear-gradient(90deg,#14a06a,var(--grn))}
.kc3::before{background:linear-gradient(90deg,#5a3ec0,var(--pur))}
.kc4::before{background:linear-gradient(90deg,#c06a14,var(--ora))}
.kpi-top{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:10px}
.kpi-ic{width:36px;height:36px;border-radius:9px;display:flex;align-items:center;justify-content:center}
.kpi-ic svg{width:16px;height:16px}
.kpi-v{font-family:'Bricolage Grotesque',sans-serif;font-size:40px;font-weight:800;line-height:1;margin-bottom:6px;letter-spacing:-1px}
.kpi-l{font-size:10px;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--dim);margin-bottom:2px}
.kpi-s{font-size:11px;color:var(--dim)}
/* CALENDAR */
.calw{background:var(--surf);border:1px solid var(--brd);border-radius:var(--r);box-shadow:var(--sh);margin-bottom:22px;overflow:hidden}
.calh{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid var(--brd)}
.cal-t{font-family:'Bricolage Grotesque',sans-serif;font-size:16px;font-weight:700;color:var(--txt)}
.cal-nav{display:flex;gap:6px}
.cal-nav button{width:30px;height:30px;border:1.5px solid var(--brd);border-radius:7px;background:var(--surf);cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--txt2);transition:all .15s;font-size:14px}
.cal-nav button:hover{border-color:var(--blue);color:var(--blue)}
.cal-nav .ctbtn{width:auto;padding:0 10px;font-size:11px;font-family:'Poppins',sans-serif}
.caldn{display:grid;grid-template-columns:repeat(7,1fr);border-bottom:1px solid var(--brd)}
.caldn div{text-align:center;font-size:10px;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--dim);padding:8px 0}
.calg{display:grid;grid-template-columns:repeat(7,1fr)}
.calc{min-height:70px;border-right:1px solid var(--brd);border-bottom:1px solid var(--brd);padding:6px;cursor:pointer;transition:background .13s;position:relative}
.calc:nth-child(7n){border-right:none}
.calc:hover{background:var(--blue-xl)}
.calc.om .cdn{color:var(--dim);opacity:.4}
.calc.td{background:rgba(37,141,214,.06)}
.calc.td .cdn{background:var(--blue);color:#fff;border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;font-weight:700}
.calc.ha{border-bottom:3px solid var(--blue)}
.cdn{font-size:12px;font-weight:500;color:var(--txt2);width:24px;height:24px;display:flex;align-items:center;justify-content:center}
.cpill{font-size:9.5px;font-weight:500;background:rgba(37,141,214,.1);color:var(--blue);border-radius:4px;padding:1px 5px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;cursor:pointer;line-height:1.5}
.cpill:hover{background:rgba(37,141,214,.22)}
.cmore{font-size:9px;color:var(--dim);margin-top:1px;padding-left:2px}
/* TIMER */
.timer{background:linear-gradient(135deg,var(--blue-dd),#1558a0);border-radius:var(--r);padding:20px 26px;margin-bottom:22px;display:flex;align-items:center;gap:22px;flex-wrap:wrap;box-shadow:0 4px 24px rgba(15,77,122,.28)}
.tc{font-family:'Bricolage Grotesque',sans-serif;font-size:46px;font-weight:300;color:#fff;letter-spacing:5px;line-height:1;min-width:185px;transition:text-shadow .3s}
.tc.run{text-shadow:0 0 30px rgba(74,168,232,.5)}
.ti{flex:1;min-width:160px}
.ts2{font-size:9px;font-weight:600;letter-spacing:2.5px;text-transform:uppercase;color:rgba(255,255,255,.4);margin-bottom:5px;display:flex;align-items:center;gap:6px}
.pdot{width:7px;height:7px;border-radius:50%;background:#4ae88a;animation:blink 1.2s infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.2}}
.tn{font-family:'Bricolage Grotesque',sans-serif;font-size:14px;font-weight:700;color:#fff;margin-bottom:3px;max-width:320px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tn.em{color:rgba(255,255,255,.38);font-weight:400;font-family:'Poppins',sans-serif;font-style:italic;font-size:12.5px}
.tp2{font-size:11px;color:rgba(255,255,255,.44)}
.tel{font-size:11px;color:rgba(255,255,255,.5);margin-top:4px}
.tcs{display:flex;gap:8px;align-items:center}
.tbtn{width:40px;height:40px;border-radius:50%;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .17s}
.tbtn svg{width:16px;height:16px}
.tplay{background:#fff;color:var(--blue)}.tplay:hover{transform:scale(1.1);box-shadow:0 0 20px rgba(255,255,255,.3)}
.tpause{background:rgba(255,255,255,.15);color:#fff;border:1.5px solid rgba(255,255,255,.28)}.tpause:hover{background:rgba(255,255,255,.25)}
.tstop{background:rgba(224,82,82,.22);color:#ff9090;border:1.5px solid rgba(224,82,82,.4)}.tstop:hover{background:rgba(224,82,82,.38)}
/* TABLE */
.tbl{width:100%;border-collapse:collapse}
.tbl th{font-size:10px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim);padding:11px 15px;text-align:left;border-bottom:2px solid var(--brd);background:var(--surf2)}
.tbl td{padding:12px 15px;border-bottom:1px solid rgba(37,141,214,.06);font-size:13px;vertical-align:middle;color:var(--txt)}
.tbl tr:last-child td{border-bottom:none}
.tbl tbody tr{transition:background .13s}.tbl tbody tr:hover{background:rgba(37,141,214,.055)}
.at{font-weight:600;color:var(--txt)}.an{font-size:11px;color:var(--dim);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:240px}
.ah{font-family:'Bricolage Grotesque',sans-serif;font-size:18px;font-weight:700;color:var(--blue)}
.rbs{display:flex;gap:4px;opacity:0;transition:opacity .13s}.tbl tbody tr:hover .rbs{opacity:1}
/* FILTERS */
.fbar{display:flex;flex-direction:column;gap:10px;margin-bottom:16px}
.frow{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sbox{background:var(--surf);border:1.5px solid var(--brd);border-radius:var(--r-sm);padding:7px 13px 7px 33px;font-size:12.5px;color:var(--txt);font-family:'Poppins',sans-serif;outline:none;width:220px;transition:border-color .2s;box-shadow:var(--sh)}
.sbox:focus{border-color:var(--blue)}
.sw{position:relative;flex-shrink:0}.sw svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);width:13px;height:13px;color:var(--dim);pointer-events:none}
.dr{display:flex;gap:5px;align-items:center;background:var(--surf);border:1.5px solid var(--brd);border-radius:var(--r-sm);padding:5px 11px;box-shadow:var(--sh)}
.dr input{border:none;outline:none;font-size:12px;color:var(--txt2);font-family:'Poppins',sans-serif;background:transparent;width:110px}
.dr span{color:var(--dim);font-size:12px}.dr button{border:none;background:none;cursor:pointer;color:var(--dim);font-size:16px;line-height:1;padding:0 2px}.dr button:hover{color:var(--red)}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{padding:5px 12px;border-radius:20px;font-size:12px;font-weight:500;cursor:pointer;border:1.5px solid var(--brd);color:var(--dim);background:var(--surf);transition:all .14s;font-family:'Poppins',sans-serif}
.chip.on{background:var(--blue);color:#fff;border-color:var(--blue);box-shadow:0 2px 8px rgba(37,141,214,.28)}
.chip:hover:not(.on){border-color:var(--blue-l);color:var(--blue)}
/* PROJECTS */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(305px,1fr));gap:16px}
.pc{background:var(--surf);border:1px solid var(--brd);border-radius:var(--r);padding:20px;transition:all .18s;position:relative;overflow:hidden;box-shadow:var(--sh)}
.pc:hover{box-shadow:var(--sh-md);border-color:var(--brd2);transform:translateY(-2px)}
.pc::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--blue-d),var(--blue-l))}
.pcn{font-family:'Bricolage Grotesque',sans-serif;font-size:17px;font-weight:700;color:var(--txt);margin-bottom:3px}
.pcm{font-size:11.5px;color:var(--dim);margin-bottom:14px}
.pb{height:5px;background:var(--brd);border-radius:3px;margin-bottom:8px}
.pbf{height:100%;border-radius:3px;transition:width .5s}
.pst{display:flex;gap:14px}.psv{font-family:'Bricolage Grotesque',sans-serif;font-size:20px;font-weight:700;color:var(--blue);line-height:1}.psl{font-size:9.5px;color:var(--dim);letter-spacing:1px;text-transform:uppercase;margin-top:2px}
.pca{position:absolute;top:14px;right:14px;display:flex;gap:4px;opacity:0;transition:opacity .14s}.pc:hover .pca{opacity:1}
/* HvP */
.hvp{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--brd)}
.hvp:last-child{border-bottom:none}
.hvp-n{flex:1;font-size:13px;font-weight:500;color:var(--txt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hvp-bg{width:110px;height:5px;background:var(--brd);border-radius:3px;overflow:hidden}
.hvp-f{height:100%;border-radius:3px;transition:width .5s}
.hvp-p{font-size:11px;font-weight:700;min-width:38px;text-align:right}
.hvp-nm{display:flex;gap:14px;align-items:center;flex-shrink:0}
.hvp-v{font-family:'Bricolage Grotesque',sans-serif;font-size:15px;font-weight:700;line-height:1}
.hvp-l{font-size:9px;color:var(--dim);text-transform:uppercase;letter-spacing:1px}
/* CHARTS */
.cg{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
.cgf{grid-column:span 2}.cw{position:relative;height:255px}
.ptabs{display:flex;gap:3px;background:var(--blue-xl);border-radius:var(--r-sm);padding:3px;margin-bottom:18px;width:fit-content}
.ptab{padding:6px 17px;border-radius:var(--r-xs);font-size:12px;font-weight:500;cursor:pointer;color:var(--dim);transition:all .15s;border:none;background:none;font-family:'Poppins',sans-serif}
.ptab.on{background:var(--blue);color:#fff;font-weight:600;box-shadow:0 2px 8px rgba(37,141,214,.3)}
.sr{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:16px}
.sb2{background:var(--surf);border:1px solid var(--brd);border-radius:var(--r);padding:15px 18px;box-shadow:var(--sh)}
.sb2-l{font-size:9.5px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim);margin-bottom:6px}
.sb2-v{font-family:'Bricolage Grotesque',sans-serif;font-size:28px;font-weight:800;color:var(--blue);line-height:1}
.sb2-s{font-size:11px;color:var(--dim);margin-top:3px}
/* REPORT */
.rc{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin-bottom:22px;padding:16px 20px;background:var(--surf);border:1px solid var(--brd);border-radius:var(--r);box-shadow:var(--sh)}
.rp{background:#fff;color:#1a2a3a;border-radius:var(--r);padding:52px 48px;box-shadow:var(--sh-lg);max-width:850px;margin:0 auto}
.rph{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:32px;padding-bottom:22px;border-bottom:3px solid #258dd6}
.rpl{font-family:'Bricolage Grotesque',sans-serif;font-size:30px;font-weight:800;color:#258dd6;letter-spacing:3px}
.rpl-s{font-size:9px;color:#7a96b4;letter-spacing:3px;text-transform:uppercase;margin-top:2px}
.rpm{text-align:right;font-size:11.5px;color:#7a96b4;line-height:1.9}
.rpm strong{display:block;font-size:16px;color:#1a2a3a;font-weight:700;font-family:'Bricolage Grotesque',sans-serif}
.rps{font-family:'Bricolage Grotesque',sans-serif;font-size:17px;font-weight:700;color:#1a2a3a;margin:26px 0 13px;padding-bottom:7px;border-bottom:2px solid rgba(37,141,214,.12)}
.rpk{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-bottom:22px}
.rpki{background:rgba(37,141,214,.05);border:1px solid rgba(37,141,214,.12);border-radius:9px;padding:14px 12px;text-align:center}
.rpkv{font-family:'Bricolage Grotesque',sans-serif;font-size:26px;font-weight:800;color:#258dd6}
.rpkl{font-size:9px;color:#7a96b4;letter-spacing:1.5px;text-transform:uppercase;margin-top:3px}
.rtbl{width:100%;border-collapse:collapse;font-size:12.5px;margin-bottom:20px}
.rtbl th{background:#0f4d7a;color:#fff;padding:9px 12px;text-align:left;font-size:9.5px;letter-spacing:1.5px;text-transform:uppercase}
.rtbl td{padding:9px 12px;border-bottom:1px solid rgba(37,141,214,.09);color:#2d4a6b;vertical-align:middle}
.rtbl tr:nth-child(even) td{background:rgba(37,141,214,.03)}
.rtag{display:inline-block;padding:2px 8px;border-radius:12px;font-size:9.5px;font-weight:600;text-transform:uppercase}
.rpft{margin-top:28px;padding-top:14px;border-top:1px solid rgba(37,141,214,.12);display:flex;justify-content:space-between;font-size:10.5px;color:#7a96b4}
.rmini{display:inline-block;height:6px;border-radius:3px;background:#eaeef4;vertical-align:middle;width:70px;overflow:hidden}
.rminif{height:100%;border-radius:3px}
/* ADMIN */
.ag{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;margin-bottom:20px}
.ac{background:linear-gradient(135deg,var(--surf) 0%,var(--surf2) 100%);border:1px solid var(--brd);border-radius:var(--r);padding:18px;box-shadow:var(--sh);transition:all .18s;position:relative;overflow:hidden;border-left:4px solid var(--blue)}
.ac:hover{box-shadow:var(--sh-md);border-color:var(--brd2);transform:translateY(-2px)}
.ac::after{content:'';position:absolute;right:-24px;top:-24px;width:88px;height:88px;border-radius:50%;background:radial-gradient(circle,rgba(37,141,214,.16) 0%,rgba(37,141,214,0) 70%)}
.uav{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--blue-l),var(--blue));display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:#fff;flex-shrink:0;box-shadow:0 4px 12px rgba(37,141,214,.25)}
/* MODAL */
.ov{position:fixed;inset:0;background:rgba(10,22,40,.52);backdrop-filter:blur(5px);z-index:4000;display:none;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s ease}
.ov.on{display:flex!important;opacity:1;visibility:visible}
.modal{background:var(--surf);border:1px solid var(--brd);border-radius:16px;width:min(640px,95vw);max-height:90vh;overflow-y:auto;box-shadow:var(--sh-lg);animation:modalIn .2s ease}
@keyframes modalIn{from{transform:translateY(6px) scale(.98);opacity:.8}to{transform:translateY(0) scale(1);opacity:1}}
.msm{max-width:440px}
.mh{display:flex;align-items:center;justify-content:space-between;padding:18px 24px;border-bottom:1px solid var(--brd);background:linear-gradient(135deg,var(--blue-dd),var(--blue-d))}
.mtt{font-family:'Bricolage Grotesque',sans-serif;font-size:18px;font-weight:700;color:#fff}
.mb{padding:24px}.mf{display:flex;gap:8px;justify-content:flex-end;padding:14px 24px;border-top:1px solid var(--brd);background:var(--surf2)}
.fg{display:flex;flex-direction:column;gap:5px;margin-bottom:13px}
.fl{font-size:9.5px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--dim)}
.fi,.fs,.fta{background:var(--surf2);border:1.5px solid var(--brd);border-radius:var(--r-sm);padding:9px 12px;font-size:13px;color:var(--txt);font-family:'Poppins',sans-serif;transition:border-color .2s,box-shadow .2s;outline:none;width:100%}
.fi:focus,.fs:focus,.fta:focus{border-color:var(--blue);background:var(--surf);box-shadow:0 0 0 3px rgba(37,141,214,.08)}
.fs option{background:var(--surf);color:var(--txt)}.fta{resize:vertical;min-height:74px}
.fg2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fg3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
.fdiv{font-size:9.5px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--blue);margin:16px 0 12px;display:flex;align-items:center;gap:11px}
.fdiv::before,.fdiv::after{content:'';flex:1;height:1px;background:var(--brd)}
.tip{background:var(--blue-xl);border:1px solid rgba(37,141,214,.2);border-radius:8px;padding:10px 14px;font-size:12px;color:var(--blue-d);margin-bottom:14px}
/* ALERT BARS */
.alb{display:flex;align-items:flex-start;gap:10px;padding:11px 16px;border-radius:9px;margin-bottom:10px;font-size:12.5px}
.alb.info{background:var(--blue-xl);color:var(--blue-d);border:1px solid rgba(37,141,214,.2)}
.alb.warning{background:var(--ora-bg);color:#7a4010;border:1px solid rgba(232,137,42,.2)}
.alb.error{background:var(--red-bg);color:#7a1010;border:1px solid rgba(224,82,82,.2)}
.alb svg{width:15px;height:15px;flex-shrink:0;margin-top:1px}
.alb-c{margin-left:auto;cursor:pointer;opacity:.5;background:none;border:none;color:inherit;font-size:16px;line-height:1;padding:0 3px}
.alb-c:hover{opacity:1}
/* EMPTY/LOADING */
.empty{padding:52px 20px;text-align:center;color:var(--dim)}
.empty svg{opacity:.15;margin:0 auto 13px;display:block}
.empty p{font-size:13.5px;line-height:1.7}.empty strong{color:var(--blue)}
.ldr{display:flex;align-items:center;justify-content:center;gap:12px;padding:44px;color:var(--dim);font-size:13px}
.spin{width:19px;height:19px;border:2.5px solid var(--brd);border-top-color:var(--blue);border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
/* TOAST */
#toast{position:fixed;bottom:28px;right:28px;background:var(--blue);color:#fff;padding:12px 20px;border-radius:12px;font-size:13px;font-weight:600;opacity:0;transform:translateY(10px);transition:all .25s;pointer-events:none;z-index:9999;display:flex;align-items:center;gap:8px;box-shadow:0 4px 22px rgba(37,141,214,.4);font-family:'Poppins',sans-serif}
#toast.on{opacity:1;transform:translateY(0)}#toast.err{background:var(--red);box-shadow:0 4px 22px rgba(224,82,82,.4)}#toast.ok2{background:var(--grn);box-shadow:0 4px 22px rgba(29,184,122,.4)}
/* PROFILE */
.prfav{width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,var(--blue-l),var(--blue));display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:700;color:#fff;margin:0 auto 10px}
.type-btn{padding:7px 13px;border:1.5px solid var(--brd);border-radius:20px;background:var(--surf);color:var(--txt2);font-size:12px;cursor:pointer;font-family:'Poppins',sans-serif;transition:all .15s;white-space:nowrap}
.type-btn:hover{border-color:var(--blue-l);color:var(--blue)}
.type-btn.active{background:var(--blue);color:#fff;border-color:var(--blue);box-shadow:0 2px 8px rgba(37,141,214,.28)}
@media print{.sb,.topbar,.rc,.no-print{display:none!important}.app,.main{display:block;overflow:visible}.page{padding:0}.rp{box-shadow:none;padding:28px}body{background:#fff}}
@media(max-width:1100px){.kg{grid-template-columns:repeat(2,1fr)}.cg{grid-template-columns:1fr}.cgf{grid-column:span 1}}
@media(max-width:900px){.ag{grid-template-columns:1fr}.ac{padding:16px}.modal{width:min(720px,98vw)}.fg2,.fg3{grid-template-columns:1fr}.mf{flex-wrap:wrap}.mf .btn{flex:1 1 calc(50% - 8px);justify-content:center}}
@media(max-width:700px){.sb{display:none}.page{padding:16px}.topbar{padding:0 16px}.card{border-radius:12px}.mb{padding:18px}.mf{padding:12px 16px}.mf .btn{flex:1 1 100%}#uf-areas-wrap{grid-template-columns:1fr}.ac{padding:14px}.ac>div[style*="justify-content:space-between"]{align-items:flex-start}.ac>div[style*="display:flex;gap:5px"]{justify-content:flex-start;width:100%}}

/* ── FILTRO MULTI-CLIENTE (casillas) ──────────────────────── */
.rpcli-btn.on{border-color:var(--blue,#1668b8)}
.rpcli-menu{
  display:none;position:absolute;top:100%;left:0;right:0;margin-top:4px;
  background:#fff;border:1px solid var(--brd,#e4e2de);border-radius:8px;
  box-shadow:0 8px 28px rgba(20,20,18,.16);z-index:50;
  max-height:280px;overflow-y:auto;padding:6px
}
.rpcli-menu.on{display:block}
.rpcli-actions{display:flex;gap:6px;padding:4px 4px 8px;border-bottom:1px solid var(--brd,#e4e2de);margin-bottom:4px}
.rpcli-actions button{
  flex:1;font-size:11px;font-weight:600;padding:5px;border-radius:5px;
  border:1px solid var(--brd,#e4e2de);background:#fff;cursor:pointer;
  color:var(--txt2,#4a4845);font-family:inherit
}
.rpcli-actions button:hover{border-color:var(--blue,#1668b8);color:var(--blue,#1668b8)}
.rpcli-item{
  display:flex;align-items:center;gap:8px;padding:7px 9px;border-radius:6px;
  cursor:pointer;font-size:12.5px;color:var(--txt,#1a1a18)
}
.rpcli-item:hover{background:var(--surf2,#faf9f7)}
.rpcli-item input{width:15px;height:15px;cursor:pointer;accent-color:var(--blue,#1668b8);flex-shrink:0}
.rpcli-item span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rpcli-empty{padding:12px;text-align:center;color:var(--dim,#6e6b66);font-size:12px}
[data-theme="dark"] .rpcli-menu{background:#1c1c1a}
[data-theme="dark"] .rpcli-actions button{background:#1c1c1a}

/* ── SEPARADOR DE INACTIVOS EN EL SELECTOR DE INTEGRANTE ──── */
.rpu-sep{
  font-size:10px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;
  color:var(--ora,#b45f06);padding:9px 9px 5px;margin-top:5px;
  border-top:1px solid var(--brd,#e4e2de)
}
.rpu-inactivo span{color:var(--dim,#6e6b66)}
.rpu-badge{
  display:inline-block;font-size:9px;font-weight:700;text-transform:uppercase;
  letter-spacing:.4px;background:var(--ora-bg,#fdf0e3);color:var(--ora,#b45f06);
  padding:1px 6px;border-radius:4px;margin-left:4px
}

/* ── SEPARACIÓN DE PERSONAL INACTIVO EN GESTIÓN DE USUARIOS ── */
.user-sep{
  grid-column:1/-1;display:flex;flex-direction:column;gap:2px;
  margin:22px 0 6px;padding:10px 14px;border-radius:8px;
  background:var(--ora-bg,#fdf0e3);border:1px solid rgba(180,95,6,.22)
}
.user-sep>span:first-child{
  font-size:12px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;
  color:var(--ora,#b45f06)
}
.user-sep-hint{font-size:11.5px;color:var(--dim,#6e6b66);font-weight:400}
.ac-inactivo{opacity:.72}
.ac-inactivo:hover{opacity:1}
