:root { --bg:#f5f7fb; --card:#fff; --line:#e3e8f0; --text:#1d2433; --muted:#6b7588; --brand:#2459d6; --ok:#1f8a4c; --warn:#b26a00; --bad:#c0392b; }
* { box-sizing: border-box; }
body { margin:0; font:14px/1.6 -apple-system,BlinkMacSystemFont,"PingFang SC","Helvetica Neue",Arial,sans-serif; background:var(--bg); color:var(--text); }
header { display:flex; align-items:center; gap:16px; padding:12px 24px; background:#16213e; color:#fff; }
header .brand { font-weight:600; font-size:16px; }
header .env { font-size:12px; padding:2px 8px; border-radius:10px; background:#f0b429; color:#16213e; }
header .spacer { flex:1; }
header a, header button.link { color:#cfd8ef; }
main { max-width:1180px; margin:0 auto; padding:20px 24px 60px; }
nav.tabs { display:flex; flex-wrap:wrap; gap:4px; margin-bottom:16px; border-bottom:1px solid var(--line); }
nav.tabs button { border:0; background:none; padding:8px 14px; cursor:pointer; color:var(--muted); border-bottom:2px solid transparent; font-size:14px; }
nav.tabs button.active { color:var(--brand); border-bottom-color:var(--brand); font-weight:600; }
.card { background:var(--card); border:1px solid var(--line); border-radius:8px; padding:16px 18px; margin-bottom:16px; }
.card h2, .card h3 { margin:0 0 12px; font-size:16px; }
.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:16px; }
.row { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-bottom:8px; }
label { display:flex; flex-direction:column; gap:4px; font-size:13px; color:var(--muted); }
label.inline { flex-direction:row; align-items:center; gap:6px; color:var(--text); }
input, select { font:inherit; padding:6px 8px; border:1px solid var(--line); border-radius:6px; min-width:0; }
button { font:inherit; padding:6px 12px; border-radius:6px; border:1px solid var(--brand); background:var(--brand); color:#fff; cursor:pointer; }
button.secondary { background:#fff; color:var(--brand); }
button.danger { background:#fff; color:var(--bad); border-color:var(--bad); }
button.link { background:none; border:0; padding:0; color:var(--brand); text-decoration:underline; }
button:disabled { opacity:.5; cursor:not-allowed; }
table { width:100%; border-collapse:collapse; font-size:13px; }
th, td { text-align:left; padding:6px 8px; border-bottom:1px solid var(--line); vertical-align:top; }
th { color:var(--muted); font-weight:500; background:#fafbfd; }
code, pre { font-family:SFMono-Regular,Menlo,Consolas,monospace; font-size:12.5px; }
pre { background:#0f172a; color:#e2e8f0; padding:12px 14px; border-radius:6px; overflow:auto; }
.muted { color:var(--muted); }
.badge { display:inline-block; padding:0 8px; border-radius:10px; font-size:12px; background:#eef2f9; color:var(--muted); }
.badge.ok { background:#e6f4ec; color:var(--ok); } .badge.warn { background:#fdf3e1; color:var(--warn); } .badge.bad { background:#fbeaea; color:var(--bad); }
#status { position:fixed; right:20px; bottom:20px; max-width:420px; padding:10px 14px; border-radius:6px; background:#16213e; color:#fff; display:none; }
#status.show { display:block; } #status.error { background:var(--bad); }
.secret { border:2px solid var(--warn); background:#fffaf0; }
.secret code { display:block; word-break:break-all; padding:8px; background:#fff; border:1px dashed var(--warn); margin:8px 0; font-size:13px; }
.docs { display:grid; grid-template-columns:220px 1fr; gap:24px; }
.docs aside { position:sticky; top:16px; align-self:start; }
.docs aside a { display:block; padding:3px 0; color:var(--text); text-decoration:none; }
.docs aside a.sub { padding-left:12px; color:var(--muted); font-size:13px; }
.op { border:1px solid var(--line); border-radius:8px; margin-bottom:14px; background:#fff; }
.op > .head { display:flex; gap:10px; align-items:center; padding:10px 14px; border-bottom:1px solid var(--line); }
.op > .body { padding:10px 14px; }
.method { font-weight:700; font-family:Menlo,monospace; padding:1px 8px; border-radius:4px; color:#fff; background:#2f855a; font-size:12px; }
.method.post { background:#2459d6; } .method.patch, .method.put { background:#b26a00; }
input.narrow { width:90px; }
.grid.compact { grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:10px; }
details { margin:8px 0; } summary { cursor:pointer; color:var(--brand); }
header label.inline { color:#cfd8ef; }
.docs > article { min-width:0; }
