*{box-sizing:border-box}body{margin:0;background:#f3f6fa;color:#18364a;font:15px/1.5 system-ui,sans-serif}header{background:#143748;color:white;display:flex;justify-content:space-between;align-items:center;padding:32px max(24px,5vw)}h1{margin:4px 0}header small{color:#8fdbcc;letter-spacing:.1em}main{max-width:1500px;margin:32px auto;padding:0 24px}section{background:#fff;border:1px solid #dbe5ea;border-radius:16px;padding:24px;margin-bottom:24px}label{display:flex;flex-direction:column;gap:6px}input,button{font:inherit;border:1px solid #bed0db;border-radius:8px;padding:10px 14px}button{cursor:pointer;background:white;color:#18364a}.primary{background:#087c70;color:white;border-color:#087c70}.login{max-width:470px;margin:40px auto}.login form{display:grid;gap:18px}.create{display:flex;gap:18px;align-items:end;flex-wrap:wrap}.create input[type=number]{width:150px}small{display:block;color:#647d8b;font-size:12px}h2{font-size:21px}.new-key{background:#e7fff3;border-color:#11aa7a}code{font-size:21px;overflow-wrap:anywhere}.error{background:#ffe8e8;color:#a02020;padding:16px;border-radius:8px}.table{overflow:auto}table{border-collapse:collapse;width:100%;white-space:nowrap}th,td{text-align:left;border-bottom:1px solid #e3ebef;padding:13px 10px;vertical-align:top}th{font-size:12px;text-transform:uppercase;color:#647d8b}.row-actions{display:flex;gap:6px}.row-actions input{width:80px}footer{padding:24px;text-align:center;color:#647d8b;font-size:12px}