:root{font-family:Inter,PingFang SC,Microsoft YaHei,system-ui,sans-serif;color:#dce8f7;background:#07101d;font-synthesis:none;--bg: #07101d;--surface: #0d1929;--surface-2: #111f32;--line: #203149;--text: #edf5ff;--muted: #8294ab;--cyan: #54e6c0;--cyan-dark: #133f39;--danger: #ff7185}*{box-sizing:border-box}html{min-height:100%;background:var(--bg)}body{min-width:320px;min-height:100vh;margin:0;background:radial-gradient(circle at 15% -10%,#12334b 0,transparent 32rem),var(--bg)}button,input,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}code{font-family:SFMono-Regular,Consolas,Liberation Mono,monospace}.app-shell{min-height:100vh}.topbar{height:72px;padding:0 max(24px,calc((100vw - 1180px)/2));display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(97,125,157,.2);background:#07101dc7;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);position:sticky;top:0;z-index:20}.brand{display:inline-flex;align-items:center;gap:12px}.brand span:last-child{display:flex;flex-direction:column;gap:2px}.brand strong{font-size:14px;letter-spacing:.01em}.brand small{color:var(--muted);font-size:11px}.brand-mark{width:36px;height:36px;display:grid;place-items:center;border:1px solid #347c70;border-radius:10px;color:#071a18;background:var(--cyan);font-weight:800;box-shadow:0 0 28px #54e6c02e}.container{width:min(1180px,calc(100% - 48px));margin:0 auto}.page{padding-top:56px;padding-bottom:80px}.page-heading,.detail-heading,.panel-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:24px}.page-heading{margin-bottom:34px}h1,h2,h3,p{margin-top:0}h1{margin-bottom:10px;color:var(--text);font-size:clamp(30px,4vw,46px);line-height:1.1;letter-spacing:-.045em}h2{margin-bottom:8px;color:var(--text);font-size:20px;letter-spacing:-.025em}.eyebrow{margin-bottom:10px;color:var(--cyan);font-family:SFMono-Regular,Consolas,monospace;font-size:11px;font-weight:500;letter-spacing:.16em}.muted{margin-bottom:0;color:var(--muted);font-size:14px}.button{min-height:42px;padding:0 18px;border:1px solid transparent;border-radius:10px;color:var(--text);background:transparent;cursor:pointer;font-weight:700;transition:.18s ease}.button:hover:not(:disabled){transform:translateY(-1px)}.button:disabled{opacity:.55;cursor:wait}.button.primary{color:#061411;background:var(--cyan);box-shadow:0 10px 30px #54e6c01f}.button.primary:hover:not(:disabled){background:#77efd0}.button.secondary{color:var(--cyan);border-color:#2c6a61;background:var(--cyan-dark)}.button.ghost{border-color:var(--line);background:#111f328c}.button.danger-outline{color:#ff9ba9;border-color:#5a2b38}.button.compact{min-height:34px;padding:0 12px;font-size:12px}.button.wide{width:100%}.notice{margin:16px 0;padding:12px 14px;border:1px solid;border-radius:10px;font-size:13px;line-height:1.5}.notice.error{color:#ffacb8;border-color:#5d2c39;background:#2b1720}.notice.warning{color:#f8d98a;border-color:#604f25;background:#282415}.login-page{min-height:100vh;display:grid;place-items:center;padding:28px}.login-card{width:min(430px,100%);padding:42px;border:1px solid var(--line);border-radius:20px;background:#0d1929e6;box-shadow:0 30px 100px #00000052}.login-card h1{font-size:32px}.login-mark{width:48px;height:48px;margin-bottom:30px;font-size:21px}.form-stack{display:grid;gap:18px;margin-top:30px}label{display:grid;gap:8px;color:#b8c8da;font-size:13px;font-weight:600}input,textarea{width:100%;padding:12px 13px;border:1px solid var(--line);border-radius:9px;outline:none;color:var(--text);background:#091524;resize:vertical;transition:border-color .15s,box-shadow .15s}input:focus,textarea:focus{border-color:#3e8d80;box-shadow:0 0 0 3px #54e6c014}.key-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.key-card{min-height:240px;padding:24px;border:1px solid var(--line);border-radius:15px;background:linear-gradient(145deg,#111f32ed,#0a1523e6);transition:transform .18s,border-color .18s,box-shadow .18s}.key-card:hover{transform:translateY(-3px);border-color:#35506f;box-shadow:0 18px 38px #0003}.card-topline{display:flex;align-items:center;color:var(--muted);font-size:12px}.status-dot{width:8px;height:8px;margin-right:7px;border-radius:50%}.status-dot.active{background:var(--cyan);box-shadow:0 0 12px #54e6c080}.status-dot.disabled{background:#738095}.arrow{margin-left:auto;color:#617891;font-size:16px}.key-card h2{margin-top:27px;font-size:20px}.card-remark{height:42px;margin-bottom:14px;overflow:hidden;color:var(--muted);font-size:13px;line-height:1.55}.key-card code,.detail-heading code{color:#9aadc3;font-size:12px}.card-meta{display:flex;justify-content:space-between;margin-top:26px;padding-top:15px;border-top:1px solid rgba(63,84,110,.45);color:#70849b;font-size:11px}.empty-state{padding:80px 24px;border:1px dashed #29405b;border-radius:15px;color:var(--muted);text-align:center;background:#0d192966}.empty-state h2,.empty-state h3{margin-top:10px}.empty-icon{color:var(--cyan);font-size:42px}.empty-state .button{margin-top:14px}.modal-backdrop{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:24px;background:#020810bf;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.modal{width:min(520px,100%);display:grid;gap:20px;padding:28px;border:1px solid #2b4059;border-radius:16px;background:#0d1929;box-shadow:0 28px 90px #00000073}.modal-heading{display:flex;justify-content:space-between;align-items:flex-start}.modal-heading h2{margin:0;font-size:24px}.icon-button{width:34px;height:34px;border:0;border-radius:8px;color:var(--muted);background:#132238;cursor:pointer;font-size:22px}.modal-actions{display:flex;justify-content:flex-end;gap:10px;padding-top:4px}.key-created-modal{text-align:left}.secret-box{display:flex;align-items:center;gap:12px;padding:13px;border:1px solid #31524e;border-radius:10px;background:#091713}.secret-box code{flex:1;overflow-wrap:anywhere;color:#9ff5de;font-size:12px}.back-link,.text-button{padding:0;border:0;color:#8da2b9;background:none;cursor:pointer}.back-link{margin-bottom:32px;font-size:13px}.back-link:hover,.text-button:hover{color:var(--cyan)}.detail-heading{margin-bottom:28px;align-items:center}.detail-heading h1{margin:8px 0 7px;font-size:34px}.status-line{display:flex;align-items:center;color:var(--muted);font-size:12px}.panel{margin-top:20px;padding:28px;border:1px solid var(--line);border-radius:15px;background:#0d1929d1}.panel-heading{margin-bottom:24px;align-items:center}.panel-heading h2{margin:0}.count{display:inline-grid;min-width:24px;height:24px;place-items:center;margin-left:5px;border-radius:7px;color:var(--cyan);background:#12312f;font-size:12px;vertical-align:2px}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.span-two{grid-column:1 / -1}.align-right{text-align:right}.switch-row{display:flex;align-items:center;justify-content:space-between;padding:15px;border:1px solid var(--line);border-radius:10px;background:#0a1726}.switch-row span{display:flex;flex-direction:column;gap:4px}.switch-row small{color:var(--muted);font-weight:400}.switch{width:42px;height:22px;accent-color:var(--cyan)}.compact-empty{padding:38px 18px}.config-list{border-top:1px solid var(--line)}.config-row{display:grid;grid-template-columns:minmax(180px,1fr) minmax(180px,1.1fr) auto;align-items:center;gap:24px;padding:20px 4px;border-bottom:1px solid var(--line)}.config-main p{margin:7px 0 0;color:var(--muted);font-size:12px}.config-name{color:#b8f5e6;font-size:13px}.config-value{min-width:0;overflow:hidden;color:#91a5bb;font-size:12px;text-overflow:ellipsis;white-space:nowrap}.row-actions{display:flex;gap:12px}.text-button{font-size:12px}.danger-text{color:#c87986}.toast{position:fixed;top:88px;left:50%;z-index:40;padding:10px 16px;transform:translate(-50%);border:1px solid #31665e;border-radius:9px;color:#baf7e7;background:#102c29;box-shadow:0 12px 30px #0000004d;font-size:13px}@media(max-width:900px){.key-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.config-row{grid-template-columns:1fr;gap:10px}}@media(max-width:620px){.container{width:min(100% - 28px,1180px)}.topbar{height:64px;padding:0 14px}.brand small{display:none}.page{padding-top:34px}.page-heading,.detail-heading{align-items:flex-start;flex-direction:column}.page-heading .button,.detail-heading .button{width:100%}.key-grid{grid-template-columns:1fr}.login-card{padding:28px 22px}.panel{padding:20px 16px}.settings-grid{grid-template-columns:1fr}.span-two{grid-column:auto}.panel-heading{align-items:flex-start}.modal{padding:22px 18px}.secret-box{align-items:stretch;flex-direction:column}}