:root{--bg:#0a0f1e;--surface:#0f172a;--card:#1a2540;--border:#1e3a5f;--accent:#38bdf8;--green:#34d399;--orange:#fb923c;--red:#f87171;--text:#e0f0ff;--muted:#64829e}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:Plus Jakarta Sans,system-ui,-apple-system,sans-serif;min-height:100vh}a{color:var(--accent);text-decoration:none}.nav{display:flex;gap:4px;align-items:center;padding:14px 28px;border-bottom:1px solid var(--border);background:var(--surface);flex-wrap:wrap}.nav .brand{font-weight:700;margin-right:20px;font-size:16px}.nav .brand em{color:var(--accent);font-style:normal}.nav a{padding:8px 14px;border-radius:4px;color:var(--muted);font-size:14px}.nav a.active,.nav a:hover{color:var(--text);background:var(--card)}.container{max-width:1200px;margin:0 auto;padding:28px}h1{font-size:24px;margin-bottom:4px}h2{font-size:16px;margin:24px 0 12px}.sub{color:var(--muted);font-size:13px;margin-bottom:20px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));grid-gap:14px;gap:14px}.card{background:var(--card);border:1px solid var(--border);border-radius:8px;padding:18px}.stat .label{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--muted)}.stat .value{font-size:26px;font-weight:700;margin-top:6px}table{width:100%;border-collapse:collapse;font-size:13px;margin-top:8px}td,th{text-align:left;padding:10px 12px;border-bottom:1px solid var(--border)}th{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:1px}tr:hover td{background:rgba(56,189,248,.04)}.badge{font-size:11px;padding:3px 9px;border-radius:99px;border:1px solid var(--border)}.badge.active,.badge.paid,.badge.success,.badge.used{color:var(--green);border-color:var(--green)}.badge.failed,.badge.overdue,.badge.suspended{color:var(--red);border-color:var(--red)}.badge.open,.badge.pending,.badge.unused{color:var(--orange);border-color:var(--orange)}.btn,button{background:var(--accent);color:#04121f;border:none;cursor:pointer;padding:9px 16px;border-radius:6px;font-weight:600;font-size:13px}button.ghost{background:transparent;color:var(--text);border:1px solid var(--border)}button:disabled{opacity:.5;cursor:not-allowed}input,select{background:var(--surface);border:1px solid var(--border);color:var(--text);padding:9px 12px;border-radius:6px;font-size:13px;width:100%}label{display:block;font-size:12px;color:var(--muted);margin:10px 0 4px}.row{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end}.row>div{flex:1 1;min-width:140px}.toast{padding:10px 14px;border-radius:6px;margin:12px 0;font-size:13px}.toast.ok{background:rgba(52,211,153,.12);color:var(--green)}.toast.err{background:hsla(0,91%,71%,.12);color:var(--red)}code{font-family:ui-monospace,monospace;padding:2px 6px;border-radius:4px}.vpn-pill,code{background:var(--surface)}.vpn-pill{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:99px;font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase;min-width:110px;justify-content:center;border:1px solid var(--border)}.vpn-pill:before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}.vpn-pill.online{color:var(--green);border-color:var(--green);background:rgba(52,211,153,.1)}.vpn-pill.online:before{box-shadow:0 0 0 0 currentColor;animation:vpn-pulse 1.8s infinite}.vpn-pill.offline{color:var(--red);border-color:var(--red);background:hsla(0,91%,71%,.1)}.vpn-pill.pending{color:var(--muted);background:rgba(100,130,158,.1)}@keyframes vpn-pulse{0%{box-shadow:0 0 0 0 rgba(52,211,153,.55)}70%{box-shadow:0 0 0 8px rgba(52,211,153,0)}to{box-shadow:0 0 0 0 rgba(52,211,153,0)}}