/* =====================================================================
   99EVs — shared design system
   Navy #0D1B2E · emerald #00E676 · amber · Syne + DM Sans · dot-grid
   ===================================================================== */
:root{
  --navy:#0D1B2E; --navy2:#132540; --navy3:#1C3456; --navy4:#253F68;
  --emerald:#00E676; --emerald2:#00C853; --emerald-l:rgba(0,230,118,.12);
  --amber:#F59E0B; --border:rgba(255,255,255,.08); --border2:rgba(255,255,255,.14);
  --text:#F1F5F9; --muted:#94A3B8; --red:#F87171;
  --ff:'Syne',sans-serif; --fb:'DM Sans',sans-serif;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{background:var(--navy);color:var(--text);font-family:var(--fb);min-height:100vh;overflow-x:hidden;-webkit-tap-highlight-color:transparent;}
body::before{content:'';position:fixed;inset:0;pointer-events:none;z-index:0;background-image:linear-gradient(rgba(0,230,118,0.035) 1px,transparent 1px),linear-gradient(90deg,rgba(0,230,118,0.035) 1px,transparent 1px);background-size:40px 40px;}
.glow{position:fixed;top:-200px;right:-120px;width:620px;height:620px;background:radial-gradient(circle,rgba(0,230,118,0.06) 0%,transparent 70%);pointer-events:none;z-index:0;}
a{color:inherit;text-decoration:none}

/* topbar */
.topbar{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 20px;border-bottom:1px solid var(--border);backdrop-filter:blur(14px);background:rgba(13,27,46,0.88);}
.tb-left{display:flex;align-items:center;gap:14px;}
.burger{display:none;background:none;border:1px solid var(--border);border-radius:9px;width:38px;height:38px;color:var(--text);font-size:1.1rem;cursor:pointer;}
.logo{font-family:var(--ff);font-weight:800;font-size:1.32rem;color:var(--amber);cursor:pointer;line-height:1;}
.logo sup{font-size:0.62em;font-style:italic;color:var(--text);}
.role-pill{display:flex;align-items:center;gap:6px;font-family:var(--ff);font-size:0.64rem;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--emerald);background:var(--emerald-l);border:1px solid rgba(0,230,118,.25);padding:4px 11px;border-radius:20px;}
.tb-right{display:flex;align-items:center;gap:10px;}
.avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--navy3),var(--navy4));border:1px solid var(--border2);display:flex;align-items:center;justify-content:center;font-family:var(--ff);font-weight:700;font-size:0.82rem;color:var(--emerald);cursor:pointer;flex-shrink:0;}
.tb-link{font-family:var(--ff);font-size:.72rem;font-weight:700;color:var(--muted);border:1px solid var(--border);padding:6px 13px;border-radius:18px;cursor:pointer;transition:.16s;}
.tb-link:hover{border-color:var(--emerald);color:var(--emerald);}

/* shell + sidebar */
.shell{display:flex;position:relative;z-index:1;min-height:calc(100vh - 59px);}
.sidebar{width:236px;flex-shrink:0;border-right:1px solid var(--border);padding:18px 12px;background:rgba(19,37,64,0.4);position:sticky;top:59px;height:calc(100vh - 59px);overflow-y:auto;}
.side-label{font-family:var(--ff);font-size:0.58rem;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--muted);padding:0 10px 8px;}
.navitem{display:flex;align-items:center;gap:11px;width:100%;text-align:left;background:none;border:none;color:var(--muted);font-family:var(--fb);font-size:0.86rem;font-weight:500;padding:9px 11px;border-radius:10px;cursor:pointer;transition:.14s;margin-bottom:2px;touch-action:manipulation;}
.navitem:hover{background:var(--navy2);color:var(--text);}
.navitem.active{background:var(--emerald-l);color:var(--emerald);font-weight:600;}
.navitem .ic{width:18px;text-align:center;font-size:1rem;flex-shrink:0;}
.side-foot{margin-top:14px;padding:11px 12px;border-top:1px solid var(--border);font-size:0.66rem;color:var(--muted);line-height:1.6;}
.main{flex:1;padding:26px 30px 60px;max-width:100%;min-width:0;}

/* headings */
.page-head{margin-bottom:22px;}
.page-head h1{font-family:var(--ff);font-size:1.55rem;font-weight:800;margin-bottom:4px;}
.page-head h1 em{color:var(--emerald);font-style:normal;}
.page-head p{font-size:0.84rem;color:var(--muted);}

/* grid + cards */
.grid{display:grid;gap:14px;}
.g3{grid-template-columns:repeat(3,1fr);} .g4{grid-template-columns:repeat(4,1fr);} .g2{grid-template-columns:repeat(2,1fr);}
.card{background:var(--navy2);border:1px solid var(--border);border-radius:15px;padding:18px;transition:.18s;}
.card:hover{border-color:var(--border2);}
.card.lift:hover{transform:translateY(-2px);border-color:rgba(0,230,118,.3);}
.card-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;}
.card-t{font-family:var(--ff);font-size:0.74rem;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--muted);}
.card-ic{font-size:1.15rem;}
.stat{font-family:var(--ff);font-size:2rem;font-weight:800;line-height:1;}
.stat.em{color:var(--emerald);} .stat.am{color:var(--amber);}
.stat-sub{font-size:0.72rem;color:var(--muted);margin-top:7px;display:flex;align-items:center;gap:5px;}

/* rows / tags */
.pill-list{display:flex;flex-direction:column;gap:9px;}
.row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;background:var(--navy);border:1px solid var(--border);border-radius:10px;font-size:0.82rem;}
.row .meta{color:var(--muted);font-size:0.72rem;}
.tag{font-family:var(--ff);font-size:0.6rem;font-weight:700;letter-spacing:.4px;text-transform:uppercase;padding:3px 9px;border-radius:14px;white-space:nowrap;}
.tag.green{color:var(--emerald);background:var(--emerald-l);border:1px solid rgba(0,230,118,.22);}
.tag.amber{color:var(--amber);background:rgba(245,158,11,.12);border:1px solid rgba(245,158,11,.25);}
.tag.muted{color:var(--muted);background:var(--navy3);border:1px solid var(--border);}
.tag.red{color:var(--red);background:rgba(248,113,113,.1);border:1px solid rgba(248,113,113,.25);}

/* buttons */
.btn{font-family:var(--ff);font-weight:700;font-size:0.74rem;border-radius:9px;padding:7px 15px;cursor:pointer;border:none;transition:.16s;touch-action:manipulation;}
.btn-p{background:var(--emerald);color:#000;} .btn-p:hover{background:var(--emerald2);}
.btn-g{background:transparent;border:1px solid var(--border);color:var(--muted);} .btn-g:hover{border-color:var(--emerald);color:var(--emerald);}
.btn-r{background:transparent;border:1px solid rgba(248,113,113,.3);color:var(--red);} .btn-r:hover{background:rgba(248,113,113,.1);}
.btn-sm{padding:5px 11px;font-size:0.68rem;}
.btn-block{display:block;width:100%;text-align:center;padding:11px;font-size:.84rem;}

/* tables */
table{width:100%;border-collapse:collapse;font-size:0.82rem;}
th{font-family:var(--ff);font-size:0.62rem;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--muted);text-align:left;padding:10px 12px;border-bottom:1px solid var(--border);}
td{padding:11px 12px;border-bottom:1px solid var(--border);color:var(--text);}
tr:last-child td{border-bottom:none;}
.table-wrap{background:var(--navy2);border:1px solid var(--border);border-radius:15px;overflow:hidden;overflow-x:auto;}

/* service grid */
.svc{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:20px 12px;background:var(--navy2);border:1px solid var(--border);border-radius:14px;cursor:pointer;transition:.18s;}
.svc:hover{border-color:rgba(0,230,118,.35);transform:translateY(-2px);}
.svc-ic{font-size:1.7rem;} .svc-n{font-family:var(--ff);font-size:0.8rem;font-weight:700;} .svc-d{font-size:0.66rem;color:var(--muted);}

/* toggle */
.toggle{position:relative;width:42px;height:23px;border-radius:14px;background:var(--navy3);border:1px solid var(--border);cursor:pointer;transition:.18s;flex-shrink:0;}
.toggle.on{background:var(--emerald);}
.toggle::after{content:'';position:absolute;top:2px;left:2px;width:17px;height:17px;border-radius:50%;background:#fff;transition:.18s;}
.toggle.on::after{left:21px;background:#000;}

/* inputs */
.field{margin-bottom:14px;}
.field label{display:block;font-family:var(--ff);font-size:.66rem;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--muted);margin-bottom:6px;}
.input{width:100%;background:var(--navy);border:1px solid var(--border);border-radius:11px;color:var(--text);font-family:var(--fb);font-size:.9rem;padding:11px 13px;outline:none;transition:.16s;}
.input:focus{border-color:rgba(0,230,118,.45);}
.input::placeholder{color:var(--muted);}

/* matrix */
.matrix td:not(:first-child),.matrix th:not(:first-child){text-align:center;}
.yes{color:var(--emerald);font-weight:700;} .no{color:var(--muted);} .lim{color:var(--amber);font-weight:700;}

/* bars */
.bars{display:flex;align-items:flex-end;gap:7px;height:90px;margin-top:6px;}
.bar{flex:1;background:linear-gradient(to top,var(--emerald2),var(--emerald));border-radius:5px 5px 0 0;min-height:6px;opacity:.85;}

/* states */
.skel{background:linear-gradient(90deg,var(--navy2) 25%,var(--navy3) 37%,var(--navy2) 63%);background-size:400% 100%;animation:shimmer 1.4s infinite;border-radius:15px;}
@keyframes shimmer{0%{background-position:100% 0}100%{background-position:-100% 0}}
.skel-card{height:118px;}
.err{text-align:center;padding:34px 20px;background:var(--navy2);border:1px solid var(--border);border-radius:15px;}
.err .x{font-size:1.6rem;} .err p{color:var(--muted);margin:8px 0 14px;font-size:.84rem;}
.empty{color:var(--muted);font-size:.82rem;padding:14px 12px;background:var(--navy);border:1px dashed var(--border2);border-radius:11px;text-align:center;}
.forbidden{text-align:center;padding:60px 20px;}
.forbidden .code{font-family:var(--ff);font-size:4rem;font-weight:800;color:var(--red);}
.forbidden p{color:var(--muted);margin-top:8px;}

/* toast */
.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%) translateY(18px);opacity:0;background:var(--navy3);border:1px solid var(--border2);color:var(--text);font-size:.82rem;padding:11px 18px;border-radius:11px;z-index:60;transition:.25s;pointer-events:none;max-width:90vw;}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}
.toast.bad{border-color:rgba(248,113,113,.4);}

.scrim{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:35;}
.statusbar{position:relative;z-index:1;border-top:1px solid var(--border);padding:10px 24px;display:flex;justify-content:space-between;background:rgba(13,27,46,0.7);font-size:0.68rem;color:var(--muted);}

@media(max-width:980px){.g4{grid-template-columns:repeat(2,1fr);}.g3{grid-template-columns:repeat(2,1fr);}}
@media(max-width:760px){
  .burger{display:flex;align-items:center;justify-content:center;}
  .sidebar{position:fixed;left:0;top:59px;z-index:38;transform:translateX(-100%);transition:.22s;box-shadow:8px 0 30px rgba(0,0,0,.4);background:var(--navy);}
  .sidebar.open{transform:translateX(0);}
  .scrim.open{display:block;}
  .main{padding:20px 16px 50px;}
  .g4,.g3,.g2{grid-template-columns:1fr;}
}