.api-top-button { height:34px; padding:0 11px; border:1px solid var(--line, #30303a); border-radius:10px; color:var(--text, #f4f2f7); background:transparent; font:700 11px/1 Manrope, sans-serif; letter-spacing:.3px; cursor:pointer; transition:.18s ease; }
.api-top-button:hover,.api-top-button:focus-visible { border-color:var(--accent, #8c58df); color:#fff; background:var(--accent, #7042c6); outline:0; }
.api-key-list { margin:16px 0 0; border:1px solid var(--line, #30303a); border-radius:12px; overflow:hidden; }
.api-key-row { display:grid; grid-template-columns:1fr auto auto auto; align-items:center; gap:6px; padding:11px 12px; border-bottom:1px solid var(--line, #30303a); }
.api-key-row:last-child { border-bottom:0; }
.api-key-row b,.api-key-row small { display:block; }
.api-key-row small { margin-top:3px; color:var(--muted, #94949f); font-size:11px; }
.api-key-history { margin-top:10px; }
.api-key-history summary { color:var(--muted, #94949f); font-size:12px; cursor:pointer; user-select:none; }
.api-key-history .api-key-list { margin-top:8px; opacity:.7; }
.api-key-row.revoked { grid-template-columns:1fr auto auto; }
.api-key-row code,.api-key-secret { font-family:ui-monospace, SFMono-Regular, Consolas, monospace; font-size:12px; }
.api-key-copy,.api-key-more { border:0; border-radius:7px; padding:6px 8px; color:var(--muted, #94949f); background:transparent; cursor:pointer; }
.api-key-copy:hover,.api-key-more:hover { color:var(--text, #fff); background:rgba(255,255,255,.08); }
.api-key-copy svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.api-key-watermark-option { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px; border:1px solid var(--line, #30303a); border-radius:11px; }
.api-key-watermark-option b,.api-key-watermark-option small { display:block; }
.api-key-watermark-option small { margin-top:4px; color:var(--muted, #94949f); font-size:11px; line-height:1.5; }
.api-key-switch { position:relative; flex:0 0 auto; width:42px; height:24px; cursor:pointer; }
.api-key-switch input { position:absolute; opacity:0; pointer-events:none; }
.api-key-switch i { position:absolute; inset:0; border-radius:999px; background:#6d6a73; transition:.18s ease; }
.api-key-switch i::after { content:''; position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:50%; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.3); transition:.18s ease; }
.api-key-switch input:checked+i { background:var(--accent, #7042c6); }
.api-key-switch input:checked+i::after { transform:translateX(18px); }
.api-key-switch input:focus-visible+i { outline:2px solid var(--accent, #7042c6); outline-offset:2px; }
.api-key-watermark-terms { display:flex; align-items:flex-start; gap:8px; padding:10px 12px; border-radius:10px; background:rgba(112,66,198,.08); color:var(--muted, #79717e); font-size:12px; line-height:1.6; }
.api-key-watermark-terms[hidden] { display:none; }
.api-key-watermark-terms input { margin-top:3px; }
.api-key-secret { overflow-wrap:anywhere; padding:12px; border:1px dashed var(--accent, #8c58df); border-radius:10px; background:rgba(112,66,198,.08); }
.api-docs-modal { width:min(880px,calc(100vw - 40px)); }
.api-docs section { padding:18px 0; border-top:1px solid var(--line, #30303a); }
.api-docs section:first-child { padding-top:0; border-top:0; }
.api-docs h3 { margin:0 0 10px; color:var(--text, #27232e); font-size:17px; }
.api-docs h4 { margin:18px 0 8px; color:var(--text, #27232e); font-size:14px; }
.api-docs-lead { font-size:15px; }
.api-doc-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:12px 0; }
.api-doc-grid>div { padding:11px 12px; border-radius:10px; background:rgba(112,66,198,.06); }
.api-doc-grid small,.api-key-secret small { display:block; margin-bottom:4px; color:var(--muted, #79717e); font-size:11px; }
.api-doc-table { overflow:hidden; border:1px solid var(--line, #30303a); border-radius:10px; }
.api-doc-table>div { display:grid; grid-template-columns:minmax(145px, .42fr) 1fr; gap:16px; padding:10px 12px; border-top:1px solid var(--line, #30303a); }
.api-doc-table>div:first-child { border-top:0; }
.api-doc-table b { color:var(--text, #27232e); font-size:12px; }
.api-doc-table span { color:var(--muted, #79717e); font-size:12px; }
.api-docs pre { margin:0; overflow:auto; white-space:pre-wrap; font-size:11px; line-height:1.6; }
@media (max-width:620px) { .api-docs-modal { width:100%; } .api-doc-grid { grid-template-columns:1fr; } .api-doc-table>div { grid-template-columns:1fr; gap:3px; } }