.keys-panel { padding: clamp(22px, 4vw, 38px); border-radius: var(--r-md); }
.keys-panel__head { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 18px; }
.keys-panel__head h2 { font-size: clamp(23px, 4vw, 32px); }
.keys-panel__count { color: var(--muted); font-size: 14px; }
.keys-panel__notice { margin: 12px 0; color: var(--muted); line-height: 1.6; }
.keys-panel__notice[data-error="true"] { color: #ff8897; }
.keys-panel__notice[data-success="true"] { color: #86e8ab; }
.keys-panel__list { display: grid; gap: 12px; }
.key-row { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 18px; background: rgba(0,0,0,.24); border: 1px solid rgba(255,255,255,.1); border-radius: 14px; }
.key-row__code { display: block; overflow-wrap: anywhere; font: 14px/1.6 monospace; letter-spacing: .04em; }
.key-row__meta { margin-top: 5px; color: var(--muted); font-size: 13px; }
.key-row .btn { flex-shrink: 0; }
[data-key-provider][aria-disabled="true"] { opacity: .55; cursor: not-allowed; }
@media(max-width: 560px) { .keys-panel__head, .key-row { align-items: flex-start; flex-direction: column; } .key-row .btn { width: 100%; } }