:root { color-scheme: light; --bg:#f9f9f7; --text:#1a1a1a; --muted:#777; --line:#dcdcd7; --red:#a52a2a; --green:#226b3a; }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--text); font:15px/1.45 ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
main { width:min(680px,calc(100% - 40px)); margin:72px auto 120px; }
h1 { margin:4px 0 6px; font-size:28px; letter-spacing:-.04em; }
h2 { margin:0; font-size:16px; letter-spacing:-.01em; }
p { margin:8px 0; }
.eyebrow { margin:0; color:var(--muted); font-size:11px; letter-spacing:.14em; }
.muted { color:var(--muted); }
.small { font-size:13px; }
header,.section-head,.endpoint,.row,.provider,.stat { display:flex; justify-content:space-between; align-items:center; gap:16px; }
header { margin-bottom:36px; }
.block { display:block; padding:25px 0; border-top:1px solid var(--line); }
.endpoint { padding:15px 0; border-top:1px solid var(--line); }
.endpoint div { min-width:0; }
code { display:block; margin-top:3px; font:13px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace; overflow-wrap:anywhere; }
button,input { font:inherit; }
button { border:0; border-radius:0; background:var(--text); color:var(--bg); padding:9px 13px; cursor:pointer; }
button:hover { opacity:.82; }
button:disabled { cursor:wait; opacity:.45; }
button.quiet { padding:4px 0; background:transparent; color:var(--text); border-bottom:1px solid var(--text); }
input[type="password"],input[type="text"],input:not([type]) { width:100%; border:1px solid var(--line); border-radius:0; background:transparent; color:var(--text); padding:10px; outline:none; }
input:focus { border-color:var(--text); }
label { display:block; margin:22px 0 7px; font-size:13px; }
#login form button { width:100%; margin-top:12px; }
.error,.notice { min-height:22px; color:var(--red); }
.notice { position:fixed; right:24px; bottom:18px; padding:8px 11px; background:var(--text); color:var(--bg); opacity:0; transition:opacity .15s; }
.notice.show { opacity:1; }
.stats { display:grid; grid-template-columns:repeat(3,1fr); gap:0; border-top:1px solid var(--line); }
.stat { display:block; padding:17px 0; }
.stat strong { display:block; font-size:21px; font-weight:500; }
.provider,.row { padding:13px 0; border-bottom:1px solid var(--line); }
.provider-main,.row-main { min-width:0; }
.provider strong,.row strong { font-weight:500; }
.provider-meta,.row-meta { color:var(--muted); font-size:13px; text-align:right; }
.dot { display:inline-block; width:7px; height:7px; border-radius:50%; margin-right:8px; background:var(--red); }
.dot.ok { background:var(--green); }
.key-form { display:grid; grid-template-columns:minmax(160px,1fr) auto auto auto; align-items:center; gap:12px; margin:16px 0; }
.key-form label { margin:0; white-space:nowrap; }
.check input { vertical-align:-1px; }
.secret { padding:14px 0 17px; color:var(--green); border-top:1px solid var(--line); }
.secret code { color:var(--text); user-select:all; }
.secret button { margin-top:8px; }
.model-list { margin-top:10px; }
.pill { display:inline-block; margin:4px 5px 4px 0; padding:4px 7px; border:1px solid var(--line); font:12px ui-monospace,SFMono-Regular,Menlo,monospace; }
summary { cursor:pointer; font-weight:600; }
.credential-form { margin:15px 0; padding-bottom:15px; border-bottom:1px solid var(--line); }
.credential-form label { margin:9px 0 5px; }
.credential-form button { margin-top:8px; }
.empty { color:var(--muted); padding:13px 0; }
@media(max-width:620px) { main{margin-top:36px}.key-form{grid-template-columns:1fr auto auto}.key-form button{grid-column:1/-1}.stats{grid-template-columns:1fr}.row,.provider{align-items:flex-start}.provider-meta,.row-meta{text-align:left}.endpoint{align-items:flex-end} }