:root { --bg:#0A0A0B; --surface:#141417; --line:#26262b; --text:#F4F4F1; --muted:#A3A3AB; --lime:#C6FF3D; --red:#FF6B5E; --pad:clamp(16px,5vw,64px); }
* { box-sizing:border-box; } html,body { margin:0; }
body { background:var(--bg); color:var(--text); font-family:'Archivo',system-ui,sans-serif; font-size:17px; line-height:1.6; }
a { color:var(--lime); }
header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px var(--pad); border-bottom:1px solid var(--line); }
.logo { font-family:'Archivo Black',system-ui; font-size:19px; color:var(--text); text-decoration:none; }
.lang { background:var(--surface); color:var(--text); border:1px solid var(--line); border-radius:14px; padding:6px 12px; font-weight:700; cursor:pointer; font:inherit; font-size:13px; }
main { max-width:760px; margin:0 auto; padding:32px var(--pad) 64px; }
h1, .h1 { font-family:'Archivo Black',system-ui; font-size:clamp(28px,6vw,40px); line-height:1.05; margin:0 0 6px; text-transform:uppercase; }
h2 { font-size:20px; margin:32px 0 6px; }
.muted { color:var(--muted); font-size:14px; }
ul { padding-left:22px; } li { margin:4px 0; }
.card { background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:18px; margin:16px 0; }
label { display:block; font-weight:700; font-size:14px; margin:12px 0 6px; }
input { width:100%; padding:13px 14px; font:inherit; font-size:18px; color:var(--text); background:var(--bg); border:1.5px solid var(--line); border-radius:10px; }
button.btn { display:inline-block; margin-top:14px; padding:14px 22px; font:inherit; font-weight:800; border:0; border-radius:8px; cursor:pointer; background:var(--lime); color:#000; }
button.btn.danger { background:var(--red); color:#000; } button.btn.ghost { background:transparent; color:var(--text); border:1.5px solid var(--line); }
button.btn:disabled { opacity:.45; cursor:not-allowed; }
.err { color:var(--red); font-weight:700; } .ok { color:#3DDC84; font-weight:700; }
footer { padding:24px var(--pad) 40px; color:var(--muted); font-size:14px; border-top:1px solid var(--line); display:flex; gap:16px; flex-wrap:wrap; }
footer a { color:#d2d2d7; }
[hidden] { display:none !important; }
:focus-visible { outline:3px solid var(--lime); outline-offset:2px; }