:root{--ink:#0B0B0B;--paper:#FFFDF2;--lime:#C7FF2F;--canvas:#F4F1E6;--muted:rgba(11,11,11,.62)}
*{box-sizing:border-box}
html,body{margin:0;background:var(--paper);color:var(--ink)}
body{font:700 16px/1.5 Nunito,system-ui,sans-serif;min-height:100vh;display:flex;flex-direction:column}
[dir=rtl] body,[dir=rtl] .d{font-family:Rubik,system-ui,sans-serif}
.band{background:var(--lime);border-bottom:4px solid var(--ink);border-radius:0 0 34px 34px;padding:22px 16px 34px}
.wrap{width:100%;max-width:440px;margin:0 auto;padding:0 16px}
.top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.brand img{width:40px;height:40px;border-radius:11px;border:3px solid var(--ink)}
.d{font-family:'Bricolage Grotesque',system-ui,sans-serif;font-weight:800;letter-spacing:-.02em}
[dir=rtl] .d{letter-spacing:0}
.brand span{font-size:20px}
.lang{border:3px solid var(--ink);border-radius:999px;background:#fff;box-shadow:3px 3px 0 var(--ink);padding:6px 12px;font:900 13px Nunito,Rubik,sans-serif;color:var(--ink);text-decoration:none;cursor:pointer}
h1{font-size:40px;line-height:1.05;margin:26px 0 8px}
.sub{font-size:15px;color:var(--muted);margin:0}
main{flex:1;padding:24px 0 32px}
.card{border:4px solid var(--ink);border-radius:22px;background:#fff;box-shadow:6px 6px 0 var(--ink);padding:18px;margin-bottom:16px}
.code{font:900 44px/1 Nunito,sans-serif;letter-spacing:.14em;text-align:center;background:var(--lime);border:3px solid var(--ink);border-radius:16px;padding:14px 0;margin:6px 0 14px;direction:ltr}
.btn{display:block;width:100%;text-align:center;border:4px solid var(--ink);border-radius:22px;background:var(--ink);color:var(--lime);box-shadow:6px 6px 0 rgba(11,11,11,.25);padding:16px;font-size:19px;text-decoration:none}
.note{font-size:14px;color:var(--muted);margin:14px 0 0}
.quiet{border:3px dashed rgba(11,11,11,.35);border-radius:18px;background:var(--canvas);padding:14px;font-size:14px;color:var(--muted)}
footer{padding:20px 16px 28px;text-align:center;font-size:13px;color:var(--muted)}
.btn:focus-visible,.lang:focus-visible{outline:3px solid var(--ink);outline-offset:3px}