:root{
  --bg:#eef0f4; --panel:#ffffff; --panel-2:#f6f8fb; --track:#e7ebf2;
  --line:#e3e6ec; --line-soft:#edf0f4;
  --txt:#1c2530; --txt-2:#5b6675; --txt-3:#98a0ad;
  --accent:#1763b8; --accent-2:#0f4e91; --accent-soft:#1763b815;
  --amber:#f59e0b; --amber-soft:#f59e0b1c;
  --usdt:#1f9d57; --usdt-soft:#1f9d5714;
  --neg:#e23b4e; --neg-soft:#e23b4e12;
  --violet:#7c5cff; --violet-soft:#7c5cff14;
  --hov:#0b132a08; --scroll:#d2d8e2;
  --side:#0b2447; --side-2:#0a1d3b;
  --side-txt:#c7d3e6; --side-muted:#7e93b6; --side-label:#5e7398; --side-active:#1763b8;
  --radius:14px; --mono:'JetBrains Mono',monospace;
  --shadow:0 1px 2px rgba(16,30,54,.05),0 1px 3px rgba(16,30,54,.04);
  --sb-width:240px;
}
html[data-theme="dark"]{
  --bg:#0d0f14; --panel:#161a22; --panel-2:#111520; --track:#1e2330;
  --line:#252c3a; --line-soft:#1a2030;
  --txt:#e8ecf4; --txt-2:#8d99b0; --txt-3:#4e5a70;
  --accent:#3b82f6; --accent-2:#2563eb; --accent-soft:#3b82f620;
  --amber:#f59e0b; --amber-soft:#f59e0b20;
  --usdt:#22c55e; --usdt-soft:#22c55e1a;
  --neg:#ef4444; --neg-soft:#ef444418;
  --violet:#a78bfa; --violet-soft:#a78bfa18;
  --hov:#3b82f610; --scroll:#252c3a;
  --side:#0a0c12; --side-2:#08090f;
  --side-txt:#c5d0e8; --side-muted:#4e5a70; --side-label:#3a4560; --side-active:#3b82f6;
  --shadow:0 1px 3px rgba(0,0,0,.4);
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Inter',sans-serif;background:var(--bg);color:var(--txt);min-height:100vh;line-height:1.5;-webkit-font-smoothing:antialiased;padding-left:var(--sb-width)}
*::-webkit-scrollbar{width:9px;height:9px}
*::-webkit-scrollbar-thumb{background:var(--scroll);border-radius:6px}

/* ── Sidebar ── */
.sidebar{position:fixed;left:0;top:0;bottom:0;width:var(--sb-width);background:var(--side);display:flex;flex-direction:column;z-index:60;overflow-y:auto}
.sb-brand{display:flex;align-items:center;gap:12px;padding:20px 18px 16px}
.brand-logo{width:42px;height:42px;border-radius:12px;background:linear-gradient(145deg,#1d4ed8,#3b82f6);display:grid;place-items:center;color:#fff;font-weight:900;font-size:13px;font-family:'JetBrains Mono',monospace;letter-spacing:-1px;flex-shrink:0}
.sb-brand h1{font-size:18px;font-weight:800;letter-spacing:-.3px;color:var(--side-txt)}
.sb-nav{display:flex;flex-direction:column;padding:0 10px;flex:1}
.sb-label{font-size:11px;font-weight:700;color:var(--side-label);text-transform:uppercase;letter-spacing:.6px;padding:6px 8px 8px}
.sb-item{display:flex;align-items:center;gap:10px;background:transparent;border:none;color:var(--side-muted);font-family:'Inter';font-weight:600;font-size:13.5px;padding:10px 12px;border-radius:10px;cursor:pointer;transition:.13s;text-align:left;width:100%}
.sb-item:hover{background:rgba(255,255,255,.07);color:var(--side-txt)}
.sb-item.active{background:var(--side-active);color:#fff}
.sb-ico{width:20px;text-align:center;font-size:15px;flex-shrink:0}
.sb-item-bottom{margin-top:auto}
.sb-bottom{padding:12px 10px;display:flex;flex-direction:column;gap:4px;border-top:1px solid rgba(255,255,255,.06);margin-top:auto}

/* ── Content ── */
.content{min-height:100vh}
.pages-wrap{padding:24px 26px 40px}
.page{display:none}
.page.active{display:block;animation:pageIn .18s ease-out}
@keyframes pageIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}

/* ── Cards / panel ── */
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.money-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:1100px){.money-grid{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.money-grid{grid-template-columns:1fr}}
.stile{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow)}
.stile .l{font-size:11.5px;color:var(--txt-2);display:flex;align-items:center;gap:6px;margin-bottom:10px;font-weight:600}
.stile .v{font-size:19px;font-weight:800;letter-spacing:-.5px}
.stile .v small{font-size:11px;color:var(--txt-3);font-weight:600;font-family:var(--mono)}
.sm-sub{font-size:10.5px;color:var(--txt-3);font-family:var(--mono);margin-top:8px}
.up{color:var(--usdt)} .down{color:var(--neg)}

/* flow bars */
.flowbars{margin-top:9px}
.flowbars .fb{display:flex;align-items:center;gap:6px;font-size:10px;font-family:var(--mono);margin-bottom:6px;color:var(--txt-2)}
.flowbars .fb .lab{width:42px;flex-shrink:0}
.flowbars .fb .bar{flex:1;height:6px;border-radius:5px;background:var(--track);overflow:hidden}
.flowbars .fb .bar i{display:block;height:100%;border-radius:5px}

/* pulse dot */
.pulse-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#ff5470;margin-left:6px;vertical-align:middle;cursor:help;animation:pulseDot 1.6s infinite}
@keyframes pulseDot{0%{box-shadow:0 0 0 0 rgba(255,84,112,.55)}70%{box-shadow:0 0 0 8px rgba(255,84,112,0)}100%{box-shadow:0 0 0 0 rgba(255,84,112,0)}}

/* ── Wallets grid ── */
.wbox{display:grid;grid-template-columns:repeat(auto-fill,minmax(244px,1fr));gap:14px;max-height:312px;overflow-y:auto}
.wtile{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px;cursor:pointer;transition:.15s}
.wtile:hover{border-color:var(--accent);box-shadow:0 4px 14px -6px var(--accent)}
.wtile.copied{border-color:var(--usdt);box-shadow:inset 0 0 0 1px var(--usdt)}
.wtile.off{opacity:.66}
.wt-top{display:flex;align-items:center;gap:9px;margin-bottom:11px;min-width:0}
.wt-ic{width:26px;height:26px;border-radius:8px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;font-size:12px;flex-shrink:0}
.wtile.off .wt-ic{background:var(--line);color:var(--txt-3)}
.wt-nm{font-weight:700;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}
.wt-row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.wt-bal{font-size:18px;font-weight:800;letter-spacing:-.5px}
.wt-bal small{font-size:11px;color:var(--txt-3);font-weight:600;font-family:var(--mono)}
.wt-bal.muted{font-family:var(--mono);font-size:11px;color:var(--txt-3);font-weight:500}
.wt-addr{font-family:var(--mono);font-size:10.5px;color:var(--txt-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:10px;padding-top:9px;border-top:1px solid var(--line-soft)}
.ws{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;padding:4px 9px;border-radius:100px}
.ws-active{background:var(--usdt-soft);color:var(--usdt)}
.ws-inactive{background:var(--track);color:var(--txt-3)}
.ws-click{cursor:pointer}
.wallets-sum{font-size:13px;color:var(--txt-2);font-weight:600}

/* ── Tx table ── */
.hv4{max-height:520px;display:flex;flex-direction:column}
.hv4 .table-scroll{flex:1;overflow-y:auto;overflow-x:auto}
.table-scroll{overflow-y:auto;overflow-x:auto}
table{width:100%;border-collapse:separate;border-spacing:0;font-size:13px}
.title-row th{padding:10px 12px;text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--txt-3);font-weight:700;background:var(--panel-2);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:3;white-space:nowrap}
.filt-row th{padding:6px 8px;background:var(--panel-2);border-bottom:1px solid var(--line);position:sticky;top:37px;z-index:3}
tbody tr{border-bottom:1px solid var(--line-soft)}
tbody tr:hover td{background:var(--hov)}
tbody td{padding:9px 12px;border-bottom:1px solid var(--line-soft);vertical-align:middle}
.texport-bar{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid var(--line-soft);flex-wrap:wrap}
.freset,.refresh-btn{background:var(--panel-2);border:1px solid var(--line);border-radius:8px;color:var(--txt-2);font-family:'Inter';font-size:12px;font-weight:600;padding:6px 11px;cursor:pointer;transition:.13s;white-space:nowrap}
.freset:hover,.refresh-btn:hover{border-color:var(--accent);color:var(--txt)}
.fexport{background:var(--accent);border:none;border-radius:8px;color:#fff;font-family:'Inter';font-size:12px;font-weight:700;padding:6px 11px;cursor:pointer}
.hfbtn{background:transparent;border:none;color:var(--txt-2);font-family:'Inter';font-size:12px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:4px;white-space:nowrap;padding:4px 6px;border-radius:6px;width:100%}
.hfbtn:hover{background:var(--hov)}
.hfin{background:var(--panel);border:1px solid var(--line);border-radius:6px;color:var(--txt);font-family:'Inter';font-size:12px;padding:5px 8px;outline:none;width:100%}
.hfin:focus{border-color:var(--accent)}
.cv{opacity:.5;font-size:10px}
.nocat-badge{font-size:12px;color:var(--txt-3)}
.nocat-badge.zero{}
/* tx badges */
.badge{font-size:11px;font-weight:700;padding:3px 8px;border-radius:6px;font-family:var(--mono);display:inline-flex;align-items:center;gap:5px}
.b-ok{background:var(--usdt-soft);color:var(--usdt)}
.b-pend{background:var(--amber-soft);color:var(--amber)}
.in-amt{color:var(--usdt);font-weight:700;font-family:var(--mono)}
.out-amt{color:var(--neg);font-weight:700;font-family:var(--mono)}
.ptag{font-size:11px;font-weight:700;padding:3px 8px;border-radius:6px;display:inline-flex;align-items:center;gap:5px}
.ptag .d{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.ptag-click{cursor:pointer;border:1px solid transparent}
.ptag-click:hover{filter:brightness(.94)}
.ptag-empty{background:var(--neg-soft);color:var(--neg)}

/* ── Category menu ── */
.cat-menu{position:fixed;z-index:200;background:var(--panel);border:1px solid var(--line);border-radius:11px;box-shadow:0 14px 40px -10px rgba(16,30,54,.3);padding:6px;min-width:170px;max-height:340px;overflow-y:auto;display:none}
.cat-menu.open{display:block}
.cat-opt{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:7px;cursor:pointer;font-size:13px;color:var(--txt-2);transition:.1s}
.cat-opt:hover{background:var(--hov);color:var(--txt)}
.cat-opt.clear{color:var(--neg)}
.cat-opt.cat-back{color:var(--txt-3);font-weight:600}
.cat-opt.cat-sub{padding-left:22px}
.cd{width:9px;height:9px;border-radius:50%;flex-shrink:0}
.chev{font-size:10px;margin-left:auto;opacity:.5}
/* multi-select menu */
.multi-menu{position:fixed;z-index:200;background:var(--panel);border:1px solid var(--line);border-radius:11px;box-shadow:0 14px 40px -10px rgba(16,30,54,.3);padding:6px;min-width:180px;max-height:300px;overflow-y:auto;display:none}
.multi-menu.open{display:block}
.mo{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:7px;cursor:pointer;font-size:12.5px;color:var(--txt-2);transition:.1s}
.mo:hover{background:var(--hov);color:var(--txt)}
.mo.on{color:var(--txt)}
.chk{width:14px;font-size:11px;color:transparent;flex-shrink:0}
.mo.on .chk{color:var(--accent)}
.mo.all.on .chk{color:var(--accent)}
/* period menu */
.period-menu{position:fixed;z-index:200;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:11px;min-width:240px;box-shadow:0 18px 40px -14px rgba(16,30,54,.28);display:none}
.period-menu.open{display:block}
.pm-title{font-size:11px;color:var(--txt-3);font-weight:700;margin:11px 0 8px;text-transform:uppercase;letter-spacing:.4px}
.pm-row{display:flex;gap:8px}
.pm-in{flex:1;width:100%;background:var(--panel-2);border:1px solid var(--line);border-radius:8px;color:var(--txt);font-family:'Inter';font-size:12px;padding:9px;outline:none}
.pm-in:focus{border-color:var(--accent)}
.pm-apply{width:100%;margin-top:9px;background:var(--accent);color:#fff;border:none;border-radius:8px;font-family:'Inter';font-weight:700;font-size:12px;padding:10px;cursor:pointer}
.pm-reset2{width:100%;margin-top:7px;background:transparent;color:var(--txt-3);border:none;font-family:'Inter';font-weight:600;font-size:11.5px;padding:4px;cursor:pointer}
/* ws menu */
.ws-menu-wrap{position:fixed;z-index:200;background:var(--panel);border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 30px -8px rgba(16,30,54,.3);padding:5px;min-width:150px;display:none}
.ws-menu-wrap.open{display:block}

/* ── Modal base ── */
.overlay{position:fixed;inset:0;background:rgba(11,18,32,.5);backdrop-filter:blur(4px);z-index:300;display:none;align-items:center;justify-content:center;padding:20px}
.overlay.on{display:flex}
.modal{background:var(--panel);border:1px solid var(--line);border-radius:16px;box-shadow:0 30px 80px -20px rgba(11,18,32,.5);max-width:480px;width:100%;padding:24px}
.modal h3{font-size:16px;font-weight:700;margin-bottom:6px}
.modal .sub{font-size:12.5px;color:var(--txt-3);margin-bottom:18px}
.field{margin-bottom:14px}
.field label{display:block;font-size:11px;color:var(--txt-3);text-transform:uppercase;letter-spacing:.5px;font-weight:700;margin-bottom:6px}
.inp{display:flex;align-items:center;background:var(--panel-2);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.inp input{flex:1;background:transparent;border:none;color:var(--txt);font-family:'Inter';font-size:15px;padding:11px 13px;outline:none}
.inp:focus-within{border-color:var(--accent)}
.cur{padding:0 13px;color:var(--txt-3);font-family:var(--mono);font-size:13px}
.modal-select{width:100%;background:var(--panel-2);border:1px solid var(--line);border-radius:9px;color:var(--txt);font-family:'Inter';font-weight:500;font-size:14px;padding:10px 12px;outline:none;cursor:pointer}
.modal-actions{display:flex;gap:10px;margin-top:20px;justify-content:flex-end}
.btn{border:none;border-radius:9px;font-family:'Inter';font-weight:700;font-size:13.5px;padding:10px 18px;cursor:pointer;transition:.13s}
.btn-primary{background:var(--accent);color:#fff}
.btn-primary:hover{background:var(--accent-2)}
.btn-ghost{background:var(--panel-2);border:1px solid var(--line);color:var(--txt-2)}
.btn-ghost:hover{background:var(--hov)}
/* cat manager */
.cm-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--line-soft)}
.cm-add{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.cm-newin{flex:1;background:var(--panel-2);border:1px solid var(--line);border-radius:10px;color:var(--txt);font-family:'Inter';font-size:14px;padding:10px 12px;outline:none}
.cm-newin:focus{border-color:var(--accent)}
.cm-addbtn{flex:0 0 auto}
.tx-comment{width:100%;border:1px solid transparent;background:transparent;color:var(--txt);font-size:12.5px;padding:5px 7px;border-radius:7px;font-family:inherit}
.tx-comment:hover{border-color:var(--line)}
.tx-comment:focus{border-color:var(--accent);background:var(--panel);outline:none}
.tx-comment::placeholder{color:var(--txt-3)}

/* ── API page ── */
.api-wrap{max-height:56vh;overflow-y:auto;margin-top:10px;border:1px solid var(--line-soft);border-radius:10px}
.api-table{width:100%;border-collapse:collapse;font-size:13px}
.api-table th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--txt-3);font-weight:700;padding:10px 14px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--panel-2)}
.api-table td{padding:11px 14px;border-bottom:1px solid var(--line-soft);color:var(--txt);vertical-align:middle}
.api-table tr:last-child td{border-bottom:none}
.api-code{font-family:var(--mono);font-size:12px;color:var(--txt-2)}
.api-st{font-family:'Inter';font-size:12px;font-weight:600;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.api-st.ok{color:var(--usdt)}
.api-st.warn{color:var(--amber)}

/* ── Security page ── */
.secfilter{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.sec-menu{position:absolute;z-index:200;background:var(--panel);border:1px solid var(--line);border-radius:11px;box-shadow:0 14px 40px -10px rgba(16,30,54,.3);padding:6px;min-width:220px;max-height:300px;overflow-y:auto;display:none;top:calc(100% + 6px);left:0}
.sec-menu.open{display:block}
.pp-btn{display:inline-flex;align-items:center;gap:8px;background:var(--panel-2);border:1px solid var(--line);color:var(--txt);font-family:'Inter';font-weight:600;font-size:12.5px;padding:8px 13px;border-radius:9px;cursor:pointer;transition:.15s}
.pp-btn:hover{border-color:var(--accent)}
.sec-help{position:relative;width:24px;height:24px;border-radius:50%;background:var(--panel-2);border:1px solid var(--line);display:grid;place-items:center;cursor:help;font-size:12px;color:var(--txt-3);flex-shrink:0}
.sec-help-tip{position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);background:var(--side);color:#fff;font-size:11px;padding:6px 10px;border-radius:8px;white-space:nowrap;opacity:0;pointer-events:none;transition:.15s;z-index:10}
.sec-help:hover .sec-help-tip{opacity:1}
.audit-h{font-size:12.5px;font-weight:700;color:var(--txt-2);margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--line-soft)}
.audit-row{display:flex;align-items:flex-start;gap:11px;padding:10px 0;border-bottom:1px solid var(--line-soft)}
.audit-row:last-child{border-bottom:none}
.aav{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;color:#fff;font-size:11px;font-weight:700;flex-shrink:0}
.ainfo{flex:1;min-width:0}
.au{font-size:13px;font-weight:600;color:var(--txt)}
.adept{font-size:11px;color:var(--txt-3);font-weight:400;margin-left:6px}
.aact{font-size:12px;color:var(--txt-2);margin-top:3px;line-height:1.4}
.asrc{font-size:10.5px;font-weight:700;background:var(--panel-2);border:1px solid var(--line);border-radius:5px;padding:2px 6px;margin-right:5px;color:var(--txt-3);font-family:var(--mono)}
.asec{background:var(--accent-soft);color:var(--accent);border-color:var(--accent-soft)}
.at{font-size:11px;color:var(--txt-3);font-family:var(--mono);white-space:nowrap;flex-shrink:0}
.op-empty{padding:20px;text-align:center;color:var(--txt-3);font-size:13px}

/* ── Clients page ── */
.clients-layout{display:flex;flex-direction:column;gap:16px}
.cal-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:10px}
@media(max-width:1100px){.cal-grid{grid-template-columns:repeat(6,1fr)}}
@media(max-width:680px){.cal-grid{grid-template-columns:repeat(3,1fr)}}
.cal-month{font-size:11px;color:var(--txt-2);font-weight:700;text-align:center;margin-bottom:6px;text-transform:uppercase;letter-spacing:.4px}
.cal-days-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:1px}
.cal-wday{font-size:9px;color:var(--txt-3);text-align:center;padding:2px 0;font-weight:600}
.cal-day{width:100%;aspect-ratio:1;border-radius:4px;display:grid;place-items:center;font-size:10px;font-family:var(--mono);position:relative}
.cal-day.has-deal{background:var(--usdt-soft);color:var(--usdt);font-weight:700;cursor:pointer;transition:.12s}
.cal-day.has-deal:hover{background:var(--usdt);color:#fff;transform:scale(1.15);z-index:5}
.cal-day.empty{opacity:0}
.cal-day.today{outline:2px solid var(--accent);outline-offset:-2px}
.cal-tip{position:fixed;background:var(--txt);color:var(--panel);border-radius:9px;padding:7px 11px;font-size:11.5px;font-family:var(--mono);pointer-events:none;z-index:999;opacity:0;transition:opacity .12s;white-space:nowrap;box-shadow:0 8px 24px -8px rgba(0,0,0,.4)}
.cal-tip.on{opacity:1}
.exch-type{font-size:11px;font-weight:700;padding:3px 8px;border-radius:6px;display:inline-flex;align-items:center;font-family:var(--mono)}
.exch-type.buy{background:#22c55e18;color:#22c55e;border:1px solid #22c55e33}
.exch-type.sell{background:#ef444418;color:#ef4444;border:1px solid #ef444433}
.exch-type.swap{background:#3b82f618;color:#3b82f6;border:1px solid #3b82f633}
.exch-st{font-size:11px;font-weight:600;padding:3px 8px;border-radius:6px;font-family:var(--mono)}
.exch-st.done{background:var(--usdt-soft);color:var(--usdt)}
.exch-st.pend{background:var(--amber-soft);color:var(--amber)}

/* ── Toast ── */
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--side);color:#fff;font-size:13px;font-weight:600;padding:10px 18px;border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.3);opacity:0;pointer-events:none;transition:opacity .2s;z-index:9999;white-space:nowrap}
.toast.on{opacity:1}

/* ── Color pick ── */
.color-pick{display:flex;flex-wrap:wrap;gap:9px}
.color-pick .sw{width:30px;height:30px;border-radius:9px;cursor:pointer;border:2px solid transparent;transition:.13px;position:relative}
.color-pick .sw.on{border-color:var(--txt)}
.color-pick .sw.on::after{content:"✓";position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:13px;font-weight:800}

/* ── Placeholder for not-yet-built sections ── */
.wip{padding:60px 20px;text-align:center;color:var(--txt-3)}
.wip .big{font-size:32px;margin-bottom:10px}

/* ── Login page ── */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}
.login-card{width:100%;max-width:360px;background:var(--panel);border:1px solid var(--line);border-radius:16px;box-shadow:0 30px 80px -20px rgba(11,18,32,.5);padding:28px}
.login-card h1{font-size:18px;font-weight:800;margin-bottom:4px}
.login-card .sub{font-size:12.5px;color:var(--txt-3);margin-bottom:20px}
.login-error{font-size:12.5px;color:var(--neg);margin-top:10px;display:none}
.login-error.on{display:block}

@media(max-width:880px){
  :root{--sb-width:0px}
  body{padding-left:0;padding-top:60px}
  .sidebar{transform:translateX(-100%);transition:transform .25s;width:280px;box-shadow:0 0 40px rgba(0,0,0,.3)}
  .sidebar.open{transform:translateX(0)}
  .sb-mobile-toggle{position:fixed;top:14px;left:14px;z-index:100;width:40px;height:40px;border-radius:10px;background:var(--panel);border:1px solid var(--line);color:var(--txt);font-size:18px;cursor:pointer;display:grid;place-items:center}
}
@media(min-width:881px){.sb-mobile-toggle{display:none}}