:root{--ink:#111426;--purple:#7257ff;--cyan:#2ad4d9;--line:#e2e3ea;--soft:#f5f4fa;--green:#15966a;--red:#c63d4f}*{box-sizing:border-box}body{margin:0;background:var(--soft);color:#27293a;font:14px/1.45 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}a{color:var(--purple);text-decoration:none}.top{display:flex;align-items:center;justify-content:space-between;padding:22px max(24px,calc((100% - 1220px)/2));background:var(--ink);color:#fff}.top span,.brand span{color:var(--cyan);font-size:10px;font-weight:800;letter-spacing:1.7px}.top h1,.brand h1{margin:2px 0 0;color:#fff;letter-spacing:-1px}.top h1 b,.brand h1 b{color:var(--cyan)}.top>a{padding:8px 13px;border:1px solid #44485e;border-radius:8px;color:#fff}.dashboard{max-width:1220px;margin:28px auto;padding:0 20px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-bottom:20px}.metrics article{padding:21px;border:1px solid var(--line);border-radius:13px;background:#fff;box-shadow:0 6px 20px rgba(17,20,38,.04)}.metrics strong{display:block;color:var(--ink);font-size:30px}.metrics span{color:#757786}.grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.panel{margin-bottom:17px;padding:22px;border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:0 6px 22px rgba(17,20,38,.04)}.panel h2{margin:0 0 17px;color:var(--ink);font-size:18px}label{display:block;margin:0 0 13px;color:#4f5160;font-size:12px;font-weight:650}input,textarea,select{display:block;width:100%;margin-top:5px;padding:10px;border:1px solid #d9dae3;border-radius:8px;background:#fff;font:inherit}textarea{resize:vertical}.columns{display:grid;grid-template-columns:1fr 1fr;gap:10px}button{padding:10px 14px;border:0;border-radius:8px;background:var(--purple);color:#fff;font-weight:750;cursor:pointer}button.secondary{background:#eeecfa;color:#5540c2}label small,td small{display:block;margin-top:4px;color:#858795;font-weight:400}.table-panel{padding:0;overflow:hidden}.table-panel h2{padding:20px 22px 0}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{padding:12px 16px;border-top:1px solid #ececf2;text-align:left;white-space:nowrap}th{color:#737584;background:#fafafd;font-size:11px;text-transform:uppercase;letter-spacing:.5px}td strong{display:block}.inline{display:flex;gap:6px;align-items:center}.inline select{width:auto;min-width:110px;margin:0;padding:7px}.inline button{padding:8px 10px}.status{display:inline-block;padding:4px 8px;border-radius:999px;background:#ececf1;font-size:11px}.status.active{background:#ddf5ea;color:#0d7350}.status.suspended{background:#fff1cf;color:#8e6410}.status.revoked,.status.expired{background:#ffe2e6;color:#9c2938}.alert,.new-key{margin:0 0 17px;padding:13px 15px;border-left:4px solid var(--green);background:#eaf8f2}.alert.error{border-color:var(--red);background:#fff0f2}.new-key{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;border-radius:8px}.new-key span{font-size:10px;font-weight:800;letter-spacing:1px}.new-key code{font-size:17px;font-weight:800}.login{display:grid;max-width:430px;min-height:calc(100vh - 80px);margin:auto;padding:80px 22px;align-content:center}.login .brand{margin-bottom:22px;padding:28px;border-radius:16px;background:radial-gradient(circle at 88% 12%,rgba(42,212,217,.3),transparent 28%),linear-gradient(135deg,#111426,#4e3bb8)}.brand p{margin:5px 0 0;color:#cccbd8}.login form{padding:25px;border:1px solid var(--line);border-radius:14px;background:#fff}.login button{width:100%}footer{padding:20px;text-align:center;color:#7e808e}footer strong{color:#444656}@media(max-width:800px){.metrics{grid-template-columns:1fr 1fr}.grid{grid-template-columns:1fr}.new-key{grid-template-columns:1fr}.top{padding:18px 20px}}@media(max-width:500px){.metrics{grid-template-columns:1fr}}