:root{--background: #ffffff;--foreground: #09090b;--card: #ffffff;--card-foreground: #09090b;--popover: #ffffff;--popover-foreground: #09090b;--primary: #18181b;--primary-foreground: #fafafa;--secondary: #f4f4f5;--secondary-foreground: #18181b;--muted: #f4f4f5;--muted-foreground: #71717a;--accent: #7c6fff;--accent-dim: rgba(124, 111, 255, .15);--accent-foreground: #fafafa;--destructive: #ef4444;--destructive-foreground: #fafafa;--success: #22c55e;--success-dim: rgba(34, 197, 94, .12);--warning: #f59e0b;--border: #e4e4e7;--input: #e4e4e7;--ring: #a1a1aa;--radius: 10px;--font-mono: "JetBrains Mono", "Fira Code", "Cascadia Code", monospace}.dark{--background: #09090b;--foreground: #fafafa;--card: #18181b;--card-foreground: #fafafa;--popover: #18181b;--popover-foreground: #fafafa;--primary: #fafafa;--primary-foreground: #18181b;--secondary: #27272a;--secondary-foreground: #fafafa;--muted: #27272a;--muted-foreground: #a1a1aa;--accent: #7c6fff;--accent-dim: rgba(124, 111, 255, .15);--accent-foreground: #fafafa;--destructive: #ef4444;--destructive-foreground: #fafafa;--success: #4ade80;--success-dim: rgba(74, 222, 128, .12);--border: #27272a;--input: #27272a;--ring: #a1a1aa}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:-apple-system,PingFang SC,Helvetica Neue,sans-serif;background:var(--background);color:var(--foreground);line-height:1.6;min-height:100vh;transition:background-color .2s ease,color .2s ease}.theme-toggle{background:transparent;border:1px solid var(--border);color:var(--muted-foreground);border-radius:6px;padding:6px 10px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:border-color .2s,color .2s}.theme-toggle:hover{border-color:var(--accent);color:var(--accent)}.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse 60% 40% at 50% 0%,rgba(124,111,255,.12) 0%,transparent 70%),var(--background);transition:background .2s ease}.login-card{width:100%;max-width:400px;background:var(--card);border:1px solid var(--border);border-radius:16px;padding:40px;transition:background-color .2s ease,border-color .2s ease}.login-logo{display:flex;align-items:center;gap:10px;margin-bottom:28px}.logo-mark{background:var(--accent);color:var(--accent-foreground);font-weight:800;font-size:13px;letter-spacing:1px;padding:5px 8px;border-radius:6px}.logo-text{font-size:14px;color:var(--muted-foreground);font-weight:500}.login-title{font-size:24px;font-weight:700;color:var(--foreground);margin-bottom:8px}.login-sub{font-size:14px;color:var(--muted-foreground);margin-bottom:28px}.form-group{margin-bottom:16px}.form-group label{display:block;font-size:13px;color:var(--muted-foreground);margin-bottom:6px;font-weight:500}.form-group input{width:100%;background:var(--secondary);border:1px solid var(--border);border-radius:var(--radius);padding:10px 14px;color:var(--foreground);font-size:15px;outline:none;transition:border-color .2s,background-color .2s}.form-group input:focus{border-color:var(--accent)}.code-row{display:flex;gap:10px}.code-row input{flex:1}.send-btn{background:var(--accent-dim);border:1px solid var(--accent);color:var(--accent);border-radius:var(--radius);padding:10px 16px;font-size:13px;cursor:pointer;white-space:nowrap;transition:background .2s}.send-btn:hover:not(:disabled){background:#7c6fff40}.send-btn:disabled{opacity:.5;cursor:not-allowed}.error-msg{font-size:13px;color:var(--destructive);margin:8px 0}.login-btn{width:100%;background:var(--accent);border:none;border-radius:var(--radius);padding:12px;color:var(--accent-foreground);font-size:15px;font-weight:600;cursor:pointer;margin-top:8px;transition:opacity .2s,transform .1s}.login-btn:hover:not(:disabled){opacity:.9;transform:translateY(-1px)}.login-btn:active{transform:translateY(0)}.login-btn:disabled{opacity:.6;cursor:not-allowed}.dashboard{min-height:100vh;display:flex;flex-direction:column}.dash-header{display:flex;align-items:center;gap:32px;padding:0 40px;height:60px;border-bottom:1px solid var(--border);background:var(--card);position:sticky;top:0;z-index:10;transition:background-color .2s ease,border-color .2s ease}.dash-header-actions{display:flex;align-items:center;gap:12px}.dash-logo{display:flex;align-items:center;gap:10px;flex-shrink:0}.dash-nav{display:flex;gap:4px;flex:1}.nav-link{font-size:14px;color:var(--muted-foreground);text-decoration:none;padding:6px 12px;border-radius:6px;transition:background .2s,color .2s}.nav-link:hover,.nav-link.active{background:var(--accent-dim);color:var(--accent)}.logout-btn{background:none;border:1px solid var(--border);color:var(--muted-foreground);border-radius:6px;padding:6px 14px;font-size:13px;cursor:pointer;transition:border-color .2s,color .2s}.logout-btn:hover{border-color:var(--destructive);color:var(--destructive)}.dash-main{flex:1;max-width:1000px;width:100%;margin:0 auto;padding:40px 40px 80px}.section-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:24px}.section-header h2{font-size:22px;font-weight:700;color:var(--foreground)}.section-desc{font-size:14px;color:var(--muted-foreground);margin-top:4px}.create-btn{background:var(--accent);border:none;color:var(--accent-foreground);border-radius:var(--radius);padding:9px 18px;font-size:14px;font-weight:600;cursor:pointer;flex-shrink:0;transition:opacity .2s}.create-btn:hover{opacity:.88}.key-reveal{background:#000000b3;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:100}.key-reveal-inner{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:36px;max-width:520px;width:90%;text-align:center;transition:background-color .2s ease,border-color .2s ease}.reveal-icon{font-size:36px;margin-bottom:16px}.key-reveal-inner h3{font-size:20px;font-weight:700;margin-bottom:10px;color:var(--foreground)}.reveal-warning{font-size:13px;color:var(--destructive);margin-bottom:20px;background:#ef44441a;border:1px solid rgba(239,68,68,.2);border-radius:8px;padding:10px 14px}.key-value-row{display:flex;align-items:center;gap:10px;background:var(--secondary);border:1px solid var(--border);border-radius:var(--radius);padding:12px 14px;margin-bottom:20px;transition:background-color .2s ease}.key-value{font-family:var(--font-mono);font-size:13px;color:var(--accent);flex:1;text-align:left;word-break:break-all}.copy-btn{background:var(--accent-dim);border:1px solid var(--accent);color:var(--accent);border-radius:6px;padding:6px 14px;font-size:13px;cursor:pointer;white-space:nowrap;flex-shrink:0;transition:background .2s}.close-reveal-btn{background:var(--secondary);border:1px solid var(--border);color:var(--foreground);border-radius:var(--radius);padding:10px 24px;font-size:14px;cursor:pointer;transition:border-color .2s,background-color .2s}.close-reveal-btn:hover{border-color:var(--accent)}.create-form{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:20px;margin-bottom:20px;transition:background-color .2s ease,border-color .2s ease}.create-form input{width:100%;background:var(--secondary);border:1px solid var(--border);border-radius:8px;padding:10px 14px;color:var(--foreground);font-size:15px;outline:none;margin-bottom:12px;transition:border-color .2s,background-color .2s}.create-form input:focus{border-color:var(--accent)}.form-actions{display:flex;gap:10px;justify-content:flex-end}.cancel-btn{background:none;border:1px solid var(--border);color:var(--muted-foreground);border-radius:8px;padding:8px 18px;font-size:14px;cursor:pointer;transition:border-color .2s,color .2s}.cancel-btn:hover{border-color:var(--foreground);color:var(--foreground)}.confirm-btn{background:var(--accent);border:none;color:var(--accent-foreground);border-radius:8px;padding:8px 18px;font-size:14px;font-weight:600;cursor:pointer;transition:opacity .2s}.confirm-btn:hover{opacity:.9}.confirm-btn:disabled{opacity:.6;cursor:not-allowed}.keys-table{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;margin-bottom:40px;transition:background-color .2s ease,border-color .2s ease}.keys-head{display:grid;grid-template-columns:1.5fr 1.5fr 80px 1.5fr 1.5fr 80px;gap:16px;padding:12px 20px;font-size:12px;font-weight:600;color:var(--muted-foreground);text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid var(--border);background:var(--secondary);transition:background-color .2s ease,border-color .2s ease}.key-row{display:grid;grid-template-columns:1.5fr 1.5fr 80px 1.5fr 1.5fr 80px;gap:16px;padding:14px 20px;font-size:14px;border-bottom:1px solid var(--border);align-items:center;transition:background .15s;color:var(--foreground)}.key-row:last-child{border-bottom:none}.key-row:hover{background:var(--secondary)}.key-row.revoked{opacity:.5}.key-name{font-weight:500}.key-prefix code{font-family:var(--font-mono);font-size:12px;color:var(--muted-foreground);background:var(--secondary);padding:2px 6px;border-radius:4px}.status-badge{display:inline-block;font-size:12px;font-weight:600;padding:3px 8px;border-radius:20px}.status-badge.active{background:var(--success-dim);color:var(--success);border:1px solid rgba(34,197,94,.2)}.status-badge.revoked{background:#ef44441a;color:var(--destructive);border:1px solid rgba(239,68,68,.15)}.key-date{font-size:13px;color:var(--muted-foreground)}.revoke-btn{background:none;border:1px solid var(--border);color:var(--muted-foreground);border-radius:6px;padding:5px 12px;font-size:12px;cursor:pointer;transition:border-color .2s,color .2s}.revoke-btn:hover{border-color:var(--destructive);color:var(--destructive)}.empty-state{text-align:center;padding:60px 20px;color:var(--muted-foreground);border:1px dashed var(--border);border-radius:var(--radius);margin-bottom:40px}.empty-sub{font-size:13px;margin-top:4px}.usage-section{margin-top:40px}.usage-section h3{font-size:12px;font-weight:600;margin-bottom:16px;color:var(--muted-foreground);text-transform:uppercase;letter-spacing:.5px}.code-block{background:#0d0d15;border:1px solid var(--border);border-radius:var(--radius);padding:20px 24px;overflow-x:auto;margin-bottom:12px}.dark .code-block{background:#0d0d15}.code-block pre{font-family:var(--font-mono);font-size:13px;color:#b8b8d0;line-height:1.7;white-space:pre}.docs-link{font-size:13px;color:var(--muted-foreground)}.docs-link a{color:var(--accent);text-decoration:none}.docs-link a:hover{text-decoration:underline}