:root { color-scheme: dark; font-family: Inter, "PingFang SC", sans-serif; --line:#303744; --panel:#151a22; --accent:#ff7438; }
* { box-sizing: border-box; }
body { margin:0; color:#f4f6f8; background:#090c11; }
main { width:min(1100px, calc(100% - 32px)); margin:0 auto; padding:42px 0 80px; }
header,.section-head,.row { display:flex; justify-content:space-between; gap:20px; align-items:center; }
header { align-items:flex-start; margin-bottom:24px; }
h1 { margin:8px 0; font-size:46px; }
h2 { margin-top:0; }
p,small { color:#98a2b1; }
.eyebrow { color:#ff9d63; letter-spacing:.18em; }
.grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.card { margin-bottom:16px; padding:24px; border:1px solid var(--line); border-radius:16px; background:var(--panel); }
label { display:grid; gap:7px; margin-bottom:13px; color:#c9d0da; font-size:13px; }
.admin-key { min-width:300px; }
input,select { width:100%; padding:11px 13px; border:1px solid var(--line); border-radius:9px; color:#fff; background:#0b0f15; }
button { padding:10px 15px; border:0; border-radius:9px; color:#111; background:var(--accent); cursor:pointer; font-weight:700; }
.row { padding:13px 0; border-bottom:1px solid #252c36; }
.row span { display:grid; gap:5px; }
.created-key code { display:block; padding:14px; margin:12px 0; border-radius:9px; overflow-wrap:anywhere; background:#090d13; color:#9ed0ff; }
pre { min-height:80px; padding:15px; border:1px solid var(--line); border-radius:12px; white-space:pre-wrap; background:#080b10; color:#a8e7bb; }
@media(max-width:760px){ header,.grid { display:block; } .admin-key { min-width:0; margin-top:18px; } }