:root{--navy:#071926;--cyan:#27cbe5;--ink:#102b39;--muted:#6f8691;--line:#dce7eb;--bg:#f3f7f8;--green:#1d9a6c;--red:#c85854;--amber:#d68b20}*{box-sizing:border-box}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg)}button,input,select{font:inherit}.login{min-height:100vh;display:grid;place-items:center;padding:20px;background:radial-gradient(circle at 75% 15%,#0e5268,#071926 45%,#041018)}.login[hidden],.shell[hidden],.modal-bg[hidden]{display:none}.login-card{width:min(420px,100%);background:#fff;padding:30px;border-radius:25px;display:grid;gap:14px;box-shadow:0 30px 90px #0006}.brand{display:flex;align-items:center;gap:10px}.brand>span{width:39px;height:39px;display:grid;place-items:center;border-radius:12px;background:var(--cyan);color:var(--navy);font-weight:900}.brand div{display:grid}.brand strong{letter-spacing:.12em}.brand small{letter-spacing:.2em;color:var(--muted);font-size:.63rem}.eyebrow{font-size:.68rem;letter-spacing:.14em;font-weight:850;color:#1595ac;margin:0}.login-card h1{margin:0}.login-card>p:not(.eyebrow){color:var(--muted);font-size:.85rem;line-height:1.5}.login-card label,.modal label{display:grid;gap:7px;font-size:.75rem;color:var(--muted);font-weight:750}.login-card input,.modal input,.modal select{height:47px;border:1px solid var(--line);border-radius:11px;padding:0 12px;background:#fff}.login-card button,.primary{border:0;background:var(--cyan);color:var(--navy);height:46px;border-radius:11px;font-weight:850;padding:0 16px}.login-card output,.modal output{color:var(--red);font-size:.76rem}.shell{display:grid;grid-template-columns:230px 1fr;min-height:100vh}aside{background:var(--navy);color:#fff;padding:25px 18px;display:flex;flex-direction:column;gap:32px}aside .brand small{color:#85a7b6}nav{display:grid;gap:7px}nav button,.logout{border:0;background:transparent;color:#9db3bd;text-align:left;padding:12px;border-radius:10px;font-weight:700}nav button.active,nav button:hover{background:#103244;color:#fff}.logout{margin-top:auto}main{padding:32px;min-width:0}header,.panel-head{display:flex;justify-content:space-between;align-items:center}header h1{margin:4px 0 0}.metrics{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin:25px 0}.metric,.panel{background:#fff;border:1px solid var(--line);border-radius:18px}.metric{padding:18px}.metric span{display:block;color:var(--muted);font-size:.72rem}.metric strong{display:block;font-size:1.8rem;margin-top:7px}.panel{padding:22px}.panel h2{margin:4px 0}.panel-head>span{font-size:.7rem;color:var(--muted)}.table-wrap{overflow:auto;margin-top:15px}table{border-collapse:collapse;width:100%;min-width:850px}th,td{text-align:left;padding:13px 10px;border-bottom:1px solid #edf2f4;font-size:.78rem}th{color:var(--muted);font-size:.68rem}.pill{display:inline-flex;border-radius:99px;padding:5px 8px;font-size:.68rem;font-weight:800}.active{background:#e4f7ef;color:var(--green)}.suspended,.overdue{background:#fff0ef;color:var(--red)}.trial{background:#fff4df;color:var(--amber)}.tiny{border:1px solid var(--line);background:#fff;border-radius:8px;padding:6px 8px}.modal-bg{position:fixed;inset:0;background:#031019aa;display:grid;place-items:center;padding:18px}.modal{background:#fff;border-radius:22px;padding:25px;width:min(500px,100%);position:relative}.modal h2{margin-top:5px}.modal form{display:grid;gap:14px}.cols{display:grid;grid-template-columns:1fr 1fr;gap:10px}.close{position:absolute;right:18px;top:14px;border:0;background:none;font-size:1.5rem}@media(max-width:900px){.metrics{grid-template-columns:1fr 1fr}.shell{display:block}aside{display:none}main{padding:20px}.metrics .metric:last-child{grid-column:span 2}}@media(max-width:520px){header{align-items:flex-end}.cols{grid-template-columns:1fr}.metrics{gap:8px}.metric{padding:14px}.metric strong{font-size:1.35rem}}
.logs{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}.log-list{display:grid;max-height:360px;overflow:auto}.log-row{padding:10px 0;border-bottom:1px solid #edf2f4;font-size:.76rem}.log-row strong,.log-row span{display:block}.log-row small{color:var(--muted)}
@media(max-width:900px){.logs{grid-template-columns:1fr}}