:root{color-scheme:dark;--bg:#090a0c;--panel:#111318;--line:#2a2d34;--text:#f1f2f4;--muted:#989da7;--silver:#d8dbe1}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(circle at 50% -20%,#252831 0,#0b0c0f 42%,#08090b 100%);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;min-height:100vh}
.wrap{width:min(1080px,calc(100% - 32px));margin:auto}
header{display:flex;align-items:center;justify-content:space-between;padding:28px 0}
.brand{font-weight:750;letter-spacing:.17em;font-size:15px}.badge{border:1px solid var(--line);border-radius:999px;padding:7px 10px;color:var(--muted);font-size:12px}
main{display:grid;grid-template-columns:1.15fr .85fr;gap:34px;align-items:center;min-height:calc(100vh - 100px);padding-bottom:50px}
.hero h1{font-size:clamp(42px,7vw,76px);line-height:.97;margin:0 0 22px;letter-spacing:-.055em;max-width:720px}
.hero p{font-size:18px;line-height:1.6;color:var(--muted);max-width:600px}
.features{display:flex;flex-wrap:wrap;gap:9px;margin-top:28px}.chip{padding:8px 11px;border:1px solid var(--line);border-radius:999px;color:#c4c7ce;font-size:12px}
.card{background:rgba(17,19,24,.93);border:1px solid var(--line);border-radius:24px;padding:26px;box-shadow:0 30px 80px rgba(0,0,0,.28)}
.tabs{display:grid;grid-template-columns:1fr 1fr;background:#0b0d10;border-radius:13px;padding:4px;margin-bottom:22px}.tabs button{border:0;background:transparent;color:var(--muted);padding:11px;border-radius:10px;font:inherit;cursor:pointer}.tabs button.active{background:#20232a;color:white}
label{display:block;color:#c8cbd1;font-size:13px;margin:15px 0 7px}input{width:100%;border:1px solid #343840;background:#0b0d10;color:white;border-radius:12px;padding:13px 14px;font:inherit;outline:none}input:focus{border-color:#777d88;box-shadow:0 0 0 3px rgba(255,255,255,.06)}
.primary{width:100%;margin-top:18px;border:0;border-radius:12px;background:var(--silver);color:#0b0c0f;padding:13px 15px;font-weight:750;cursor:pointer}.primary:disabled{opacity:.45;cursor:not-allowed}
.note,.status{font-size:12px;line-height:1.5;color:var(--muted);margin-top:14px}.status{min-height:36px}.status.error{color:#ffb3b3}.status.ok{color:#b9e8c7}
.hidden{display:none!important}
.code{font-variant-numeric:tabular-nums;letter-spacing:.22em;text-align:center;font-size:22px}
footer{padding:0 0 25px;color:#666c76;font-size:11px}
@media(max-width:820px){main{grid-template-columns:1fr;padding-top:24px}.hero h1{font-size:48px}.card{padding:20px}}