:root{
  --bg:#08090a; --panel:#0e0f11; --line:rgba(255,255,255,0.09); --line2:rgba(255,255,255,0.07);
  --ink:#e6e4de; --ink2:#c9c6bd; --mut:#8a8880; --mut2:#7c7a72;
  --amber:#e0a63f; --green:#4fca8b; --red:#e0665f;
  --mono:'IBM Plex Mono',ui-monospace,monospace; --sans:'IBM Plex Sans',system-ui,sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}
@keyframes pulseDot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.85)}}
@keyframes riseIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.hide{display:none !important}

.gate{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}
.card{width:100%;max-width:380px;border:1px solid var(--line);background:var(--panel);padding:30px 26px;animation:riseIn .3s ease}
.kicker{font-family:var(--mono);font-size:11px;letter-spacing:.28em;color:var(--mut2);text-transform:uppercase}
.card h1{margin:10px 0 22px;font-family:var(--mono);font-size:24px;font-weight:600;letter-spacing:-.01em}
.lbl{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--mut);margin-bottom:8px;display:block}
.inp{width:100%;background:#0b0c0e;border:1px solid var(--line);color:var(--ink);font-family:var(--mono);font-size:15px;padding:12px 14px;outline:none}
.inp:focus{border-color:var(--amber)}
.btn{width:100%;margin-top:16px;background:var(--amber);border:1px solid var(--amber);color:#1a1206;font-family:var(--mono);font-size:13px;font-weight:600;letter-spacing:.08em;padding:12px;cursor:pointer;text-transform:uppercase}
.btn:hover{filter:brightness(1.07)}
.btn:disabled{opacity:.5;cursor:default}
.msg{font-family:var(--mono);font-size:12px;line-height:1.5;margin-top:14px;min-height:16px}
.msg.err{color:var(--red)} .msg.ok{color:var(--green)}

.wrap{max-width:1200px;margin:0 auto;padding:28px 20px 72px}
.head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-bottom:18px;border-bottom:1px solid var(--line)}
.head .t1{font-family:var(--mono);font-size:11px;letter-spacing:.28em;color:var(--mut2);text-transform:uppercase}
.head h1{margin:6px 0 0;font-family:var(--mono);font-size:26px;font-weight:600;letter-spacing:-.01em;display:inline-flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.tag{font-family:var(--mono);font-size:11px;color:var(--green);border:1px solid rgba(79,202,139,.35);background:rgba(79,202,139,.08);padding:3px 8px;letter-spacing:.12em}
.who{font-family:var(--mono);font-size:12px;color:var(--mut2);text-align:right}
.signout{background:none;border:1px solid var(--line);color:var(--mut);font-family:var(--mono);font-size:11px;letter-spacing:.08em;padding:7px 12px;cursor:pointer;text-transform:uppercase;margin-top:6px}
.signout:hover{color:var(--ink);border-color:var(--amber)}
.statusbar{display:flex;flex-wrap:wrap;align-items:center;gap:0;margin-top:18px;border:1px solid var(--line);background:var(--panel);font-family:var(--mono);font-size:12.5px}
.statusbar > div{display:flex;align-items:center;gap:10px;padding:13px 18px;border-right:1px solid var(--line2)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 10px rgba(79,202,139,.8);animation:pulseDot 2.4s ease-in-out infinite}
.tabs{display:flex;gap:0;margin-top:26px;border-bottom:1px solid var(--line)}
.tab{background:none;border:none;border-bottom:2px solid transparent;color:var(--mut);font-family:var(--mono);font-size:13px;letter-spacing:.06em;padding:12px 18px;cursor:pointer;text-transform:uppercase}
.tab[aria-selected="true"]{color:var(--amber);border-bottom-color:var(--amber)}
.tab .n{color:var(--mut2);margin-left:6px}
.list{margin-top:6px}
.row{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:16px 4px;border-bottom:1px solid var(--line2)}
.row .nm{font-family:var(--mono);font-size:15px}
.row .em{color:var(--mut);font-size:13px;margin-top:3px}
.row .meta{font-family:var(--mono);font-size:12px;color:var(--mut2);text-align:right}
.pill{display:inline-block;font-family:var(--mono);font-size:11px;padding:3px 9px;border:1px solid var(--line);color:var(--ink2);letter-spacing:.08em;text-transform:uppercase}
.empty{font-family:var(--mono);font-size:13px;color:var(--mut2);padding:26px 4px}
.right{text-align:right}
.act{display:flex;gap:8px;justify-content:flex-end;align-items:center;margin-top:8px;flex-wrap:wrap}
.sel{background:#0b0c0e;border:1px solid var(--line);color:var(--ink);font-family:var(--mono);font-size:12px;padding:7px 9px}
.sel:focus{outline:none;border-color:var(--amber)}
.act button{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;padding:7px 12px;cursor:pointer;text-transform:uppercase;border:1px solid}
.act .ok{background:var(--amber);border-color:var(--amber);color:#1a1206;font-weight:600}
.act .ok:hover{filter:brightness(1.08)}
.act .no{background:transparent;border-color:var(--line);color:var(--mut)}
.act .no:hover{color:var(--red);border-color:var(--red)}
.act button:disabled{opacity:.5;cursor:default}
.out{margin-top:8px;font-family:var(--mono);font-size:12px;line-height:1.6}
.out .good{color:var(--green)}
.out .bad{color:var(--red)}
.out .pw{color:var(--amber);border:1px solid var(--line);padding:3px 8px;display:inline-block;margin-top:4px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:0;margin-top:18px;border:1px solid var(--line);background:var(--panel)}
.stats .tile{padding:16px 18px;border-right:1px solid var(--line2)}
.stats .tile:last-child{border-right:none}
.stats .tl{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--mut2)}
.stats .tv{font-family:var(--mono);font-size:24px;font-weight:600;color:var(--amber);margin-top:6px}
.stats .tv.sm{font-size:13px;color:var(--ink2);font-weight:400}
.badge-off{font-family:var(--mono);font-size:10px;letter-spacing:.12em;color:var(--red);border:1px solid var(--red);padding:2px 6px;margin-left:6px}
.panelBox{margin-top:18px}
.panelBox:empty{display:none}
.secTitle{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--mut2);margin-bottom:10px}
.sRow{display:flex;align-items:center;gap:12px;padding:7px 0;font-family:var(--mono);font-size:12.5px}
.sName{flex:0 0 130px;color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sBar{flex:1;height:8px;background:rgba(255,255,255,.06);border:1px solid var(--line2);position:relative;min-width:60px}
.sFill{position:absolute;left:0;top:0;bottom:0;background:var(--amber);opacity:.75}
.sFill.stale{background:var(--red);opacity:.85}
.sNum{flex:0 0 42px;text-align:right;color:var(--amber);font-weight:600}
.sAge{flex:0 0 96px;text-align:right;color:var(--mut2);font-size:11px}
.sAge.quiet{color:var(--red)}
.stats .tv.warn{color:var(--red)}
.tgt{color:var(--amber);font-weight:600}
.newAcct{margin-top:18px}
.naToggle{background:var(--amber);border:1px solid var(--amber);color:#1a1206;font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.08em;padding:10px 15px;cursor:pointer;text-transform:uppercase}
.naToggle:hover{filter:brightness(1.07)}
.naForm{border:1px solid var(--line);background:var(--panel);padding:18px;margin-top:12px}
.naGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}
.naField{display:grid;gap:6px}
.naField span{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--mut)}
.naInput{background:#0b0c0e;border:1px solid var(--line);color:var(--ink);font-family:var(--mono);font-size:14px;padding:10px 12px;outline:none;width:100%}
.naInput:focus{border-color:var(--amber)}
.naActions{display:flex;gap:9px;margin-top:14px;flex-wrap:wrap}
.naActions button{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;padding:9px 14px;cursor:pointer;text-transform:uppercase;border:1px solid}
