.keys-page{grid-template-columns:1fr;gap:18px;margin-top:18px;display:grid}.page-lede{max-width:62ch;margin:10px 0 0;line-height:1.6}.page-lede a{color:var(--color-accent);text-underline-offset:3px;text-decoration:underline}.keys-page .card{gap:18px;padding:24px}.keys-page .card-header h3{font-size:1.15rem}.keys-page .card-actions{justify-content:flex-start;margin-top:0}.form-grid{gap:22px;display:grid}.field-hint{color:#fff9;font-size:.85rem;font-weight:500}.field-title{font-weight:600}.keys-page .auth-label input,.keys-page .auth-label select{color:#ffffffeb;background:#ffffff0f;border:1px solid #ffffff1f;border-radius:12px;width:100%;padding:12px 14px;font-family:inherit;font-size:15px}.keys-page .auth-label select{appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-position:right 14px center;background-repeat:no-repeat;padding-right:40px}.keys-page .auth-label select option{color:#fff;background:#0e1113}.keys-page .auth-label select:focus{border-color:#6ff3b080;outline:none;box-shadow:0 0 0 4px #1fbf751f}.keys-page .auth-label input[type=text]{font-weight:500}@media (width>=720px){.expiry-field{max-width:320px}}.secret-card{background:linear-gradient(135deg,#1fbf7524 0%,#0e1113cc 70%);border-color:#6ff3b059}.secret-card .auth-info{margin:0}.secret-row{flex-wrap:wrap;align-items:stretch;gap:10px;display:flex}.keys-page .secret-input{color:#fff;background:#0006;border:1px solid #6ff3b04d;border-radius:12px;flex:260px;min-width:0;padding:12px 14px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.9rem}.scope-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;display:grid}.scope-option{cursor:pointer;display:block;position:relative}.scope-option input{opacity:0;cursor:pointer;width:100%;height:100%;margin:0;position:absolute;inset:0}.scope-body{background:#ffffff0a;border:1px solid #ffffff1a;border-radius:14px;align-items:flex-start;gap:12px;height:100%;padding:14px;transition:border-color .15s,background .15s,box-shadow .15s;display:flex}.scope-option:hover .scope-body{background:#ffffff12}.scope-check{border:1.5px solid #ffffff4d;border-radius:6px;flex-shrink:0;place-items:center;width:20px;height:20px;margin-top:1px;transition:background .15s,border-color .15s;display:grid}.scope-check:after{content:"";opacity:0;border:2px solid #0b2e1f;border-width:0 2px 2px 0;width:5px;height:10px;transform:rotate(45deg)translate(-1px,-1px)}.scope-option input:checked+.scope-body{background:#1fbf751a;border-color:#6ff3b08c}.scope-option input:checked+.scope-body .scope-check{background:var(--color-accent);border-color:var(--color-accent)}.scope-option input:checked+.scope-body .scope-check:after{opacity:1}.scope-option input:focus-visible+.scope-body{box-shadow:0 0 0 4px #1fbf7533}.scope-text{gap:4px;min-width:0;display:grid}.scope-name{color:#fff;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.9rem;font-weight:700}.scope-desc{color:#ffffff9e;font-size:.85rem;line-height:1.4}.scope-option.is-admin .scope-name{color:#fbbf24}.key-list{gap:12px;display:grid}.key-item{background:#ffffff08;border:1px solid #ffffff14;border-radius:16px;gap:12px;padding:18px;display:grid}.key-item.inactive{opacity:.55}.key-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.key-title{flex-wrap:wrap;align-items:center;gap:10px;min-width:0;display:flex}.key-name{color:#fff;word-break:break-word;font-size:1.05rem;font-weight:700}.key-prefix{color:#ffffffbf;overflow-wrap:anywhere;background:#00000059;border:1px solid #ffffff0f;border-radius:8px;justify-self:start;max-width:100%;padding:6px 10px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.85rem}.key-meta{flex-wrap:wrap;gap:8px;display:flex}.key-dates{border-top:1px solid #ffffff0f;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px 20px;padding-top:12px;display:grid}.key-date{color:#ffffffd9;gap:2px;font-size:.88rem;display:grid}.key-date-label{letter-spacing:.1em;text-transform:uppercase;color:#ffffff80;font-size:.7rem;font-weight:800}.status-badge{border-radius:999px;align-items:center;gap:6px;padding:5px 10px;font-size:.75rem;font-weight:700;line-height:1;display:inline-flex}.status-badge:before{content:"";background:currentColor;border-radius:50%;width:6px;height:6px}.status-badge.active{color:var(--color-accent);background:#1fbf7524}.status-badge.revoked,.status-badge.expired{color:#fda4af;background:#f43f5e24}.small-btn{border-radius:10px;padding:8px 14px;font-size:.85rem}.danger-btn{color:#fda4af;background:#f43f5e1f;border:1px solid #f43f5e47}.danger-btn:hover{color:#fecdd3;background:#f43f5e38}.empty-state{text-align:center;color:#fff9;padding:32px 16px}.empty-state p{margin:0 0 6px}.loading-state{text-align:center;padding:20px}