:root{--bg:#fff;--surf:#F3F5F8;--surf2:#E7EBF0;--fg:#0D1016;--muted:#596270;--line:#DCE1E8;--acc:#E0007A;--accfg:#fff;--ok:#14A44D;--glow:none}
@media (prefers-color-scheme:dark){:root{--bg:#000;--surf:#111317;--surf2:#1C1F25;--fg:#F2F4F7;--muted:#9AA3B0;--line:#262A31;--acc:#FF3DA5;--accfg:#000;--ok:#3EF07A;--glow:0 0 18px rgba(255,61,165,.35)}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font-family:Figtree,system-ui,sans-serif;font-size:18px;line-height:1.45}
h1,h2,.brand{font-family:"Bricolage Grotesque",Figtree,sans-serif;letter-spacing:-.02em}
h1{font-size:34px;line-height:1.1;font-weight:800;margin:0}
h2{font-size:22px;margin:0}
.wrap{max-width:460px;margin:0 auto;padding:24px 24px 40px;display:flex;flex-direction:column;gap:16px;min-height:100vh}
.brand{font-size:22px;display:flex;align-items:center;gap:10px}.brand b{font-weight:800}.brand span{font-weight:500}
p{margin:0}.muted{color:var(--muted)}
label{font-weight:700;font-size:15px}
input,select,textarea{width:100%;min-height:56px;border-radius:12px;border:1.5px solid var(--fg);background:var(--bg);color:var(--fg);font:inherit;padding:0 16px}
input:focus-visible,select:focus-visible,button:focus-visible{outline:3px solid var(--acc);outline-offset:2px}
button{min-height:56px;border-radius:14px;border:0;background:var(--acc);color:var(--accfg);font:inherit;font-weight:800;cursor:pointer;box-shadow:var(--glow)}
button.ghost{background:transparent;color:var(--fg);border:1.5px solid var(--line);box-shadow:none}
button.link{background:none;color:var(--muted);min-height:44px;box-shadow:none;font-weight:700}
.card{background:var(--surf);border:1.5px solid var(--line);border-radius:16px;padding:14px 16px}
.row{display:flex;align-items:center;gap:12px}.grow{flex:1}
.dot{width:14px;height:14px;border-radius:50%;flex:none}
.kid{display:grid;grid-template-columns:1fr 120px;gap:10px}
.msg{padding:12px 14px;border-radius:12px;background:var(--surf2);font-size:16px}
.code{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:56px;letter-spacing:.25em;padding:24px 0 24px .25em;text-align:center;border-radius:20px;background:var(--surf);border:2px solid var(--acc);box-shadow:var(--glow)}
[hidden]{display:none!important}

textarea{padding:12px 16px;min-height:120px;resize:vertical}
.wrap.wide{max-width:780px}
.stack{display:flex;flex-direction:column;gap:12px}
.tabs{display:flex;gap:6px;flex-wrap:wrap}
.tabs button{min-height:44px;padding:0 16px;border-radius:999px;background:var(--surf);color:var(--fg);border:1.5px solid var(--line);box-shadow:none;font-weight:700}
.tabs button[aria-selected=true]{background:var(--acc);color:var(--accfg);border-color:var(--acc)}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chips button{min-height:44px;min-width:44px;padding:0 10px;border-radius:12px;background:var(--surf);color:var(--fg);border:1.5px solid var(--line);box-shadow:none;font-weight:700}
.chips button[aria-pressed=true]{background:var(--acc);color:var(--accfg);border-color:var(--acc)}
button.small{min-height:40px;padding:0 14px;border-radius:10px;font-size:15px}
