:root{--bg:#0b0f14;--ice:#f3f5f7;--red:#c8102e;--red2:#e0243f;--blue:#1f4e9c;--blue2:#6f9be0;--card:#141b24;--line:#27323f;--mute:#a3afbc;--r:16px}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;background:var(--bg);color:var(--ice);font-family:Barlow,system-ui,sans-serif;font-size:17px;line-height:1.4}
body{min-height:100dvh;background:radial-gradient(900px 500px at 80% -10%,rgba(31,78,156,.28),transparent 60%),radial-gradient(700px 400px at -10% 110%,rgba(200,16,46,.18),transparent 60%),var(--bg);background-attachment:fixed}
.app{max-width:560px;margin:0 auto;min-height:100dvh;display:flex;flex-direction:column;padding:0 16px env(safe-area-inset-bottom)}
h1,h2,.btn-big,.chip-t{font-family:"Barlow Condensed",Impact,sans-serif;text-transform:uppercase;letter-spacing:.02em}
h1{font-size:44px;line-height:.98;margin:.3em 0 .25em;font-weight:800}
h2{font-size:30px;line-height:1.05;margin:.2em 0 .3em;font-weight:700}
p{margin:.3em 0}
.sub{color:var(--mute);margin:0 0 14px}
.top{display:flex;align-items:center;gap:10px;padding:12px 0 6px;position:sticky;top:0;background:linear-gradient(var(--bg) 75%,transparent);z-index:5}
.top[hidden]{display:none}
.back{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--card);color:var(--ice);display:grid;place-items:center;cursor:pointer;flex:none}
.back[hidden]{visibility:hidden;display:grid}
.bar{flex:1;display:flex;gap:4px;align-items:center;justify-content:center}
.bar i{width:9px;height:9px;border-radius:50%;background:var(--line);transition:background .2s,transform .2s}
.bar i.on{background:var(--red)}
.bar span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--blue),var(--red));border-radius:8px;transition:width .35s ease}
.count{font-size:13px;color:var(--mute);min-width:34px;text-align:right}
.screen{flex:1;display:flex;flex-direction:column;padding:6px 0 120px;outline:none}
.screen.enter{animation:in .28s ease both}
@keyframes in{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:none}}
button{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--blue2);outline-offset:2px}
.opts{display:grid;gap:10px;margin-top:6px}
.opt{display:flex;align-items:center;gap:12px;min-height:56px;padding:12px 16px;text-align:left;background:var(--card);border:2px solid var(--line);border-radius:var(--r);cursor:pointer;font-weight:500;transition:border-color .15s,background .15s,transform .1s}
.opt:active{transform:scale(.985)}
.opt .tick{width:24px;height:24px;border-radius:7px;border:2px solid var(--mute);flex:none;display:grid;place-items:center;font-size:15px;font-weight:700}
.opt.radio .tick{border-radius:50%}
.opt[aria-pressed=true],.opt[aria-checked=true]{border-color:var(--red);background:rgba(200,16,46,.16)}
.opt[aria-pressed=true] .tick,.opt[aria-checked=true] .tick{background:var(--red);border-color:var(--red)}
.opt[aria-pressed=true] .tick::after,.opt[aria-checked=true] .tick::after{content:"\2713";color:#fff}
.opt small{display:block;color:var(--mute);font-weight:400;font-size:14px}
.steps{display:grid;gap:10px}
.step{display:flex;align-items:center;gap:14px;min-height:60px}
.step .n{font-family:"Barlow Condensed";font-size:26px;font-weight:700;width:30px;text-align:center;color:var(--blue2)}
.big{min-height:76px;font-size:21px;justify-content:center;text-align:center}
.big .tick{display:none}
.search{width:100%;min-height:52px;padding:0 16px;border-radius:var(--r);border:2px solid var(--line);background:var(--card);color:var(--ice);font:inherit;margin:4px 0 10px}
.search:focus{border-color:var(--blue2);outline:none}
.list{max-height:46dvh;overflow:auto;display:grid;gap:8px;padding-right:2px}
.list .opt{min-height:50px;padding:8px 14px}
.media{border-radius:var(--r);overflow:hidden;background:var(--card);border:1px solid var(--line);margin:4px 0 12px;position:relative}
.media img,.media video{display:block;width:100%;height:auto;max-height:30dvh;object-fit:cover}
.media.two{display:grid;grid-template-columns:1fr 1fr;gap:2px}
.media.two img{height:100%;max-height:30dvh}
.hero{border-radius:20px;overflow:hidden;margin:6px 0 14px;border:1px solid var(--line)}
.hero img{display:block;width:100%;height:auto;max-height:36dvh;object-fit:cover}
.tag{display:inline-block;align-self:flex-start;font-size:13px;font-weight:600;color:#fff;background:var(--blue);padding:2px 10px;border-radius:99px;letter-spacing:.04em}
.react{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:8px 0 14px}
.rx{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:78px;padding:6px 2px;border:2px solid var(--line);background:var(--card);border-radius:14px;cursor:pointer;font-size:12px;font-weight:600;line-height:1.1;text-align:center}
.rx span{font-size:26px;line-height:1}
.rx[aria-pressed=true]{border-color:var(--red);background:rgba(200,16,46,.2)}
.q{font-weight:600;margin:6px 0 6px;color:var(--mute);font-size:15px}
.freq{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.freq .opt{min-height:50px;padding:8px 12px;justify-content:center;text-align:center;font-size:15px}
.freq .opt .tick{display:none}
.rank{position:absolute;top:8px;right:8px;width:30px;height:30px;border-radius:50%;background:var(--red);color:#fff;display:grid;place-items:center;font-family:"Barlow Condensed";font-weight:800;font-size:19px}
.rk{display:flex;gap:12px;align-items:center;padding:8px;min-height:72px}
.rk img{width:84px;height:60px;object-fit:cover;border-radius:10px;flex:none}
.rk .rkn{margin-left:auto;width:32px;height:32px;border-radius:50%;border:2px solid var(--mute);display:grid;place-items:center;font-family:"Barlow Condensed";font-weight:800;font-size:19px;flex:none}
.rk[aria-pressed=true] .rkn{background:var(--red);border-color:var(--red);color:#fff}
textarea,input[type=email],.line{width:100%;padding:14px 16px;border-radius:var(--r);border:2px solid var(--line);background:var(--card);color:var(--ice);font:inherit;min-height:56px}
textarea{min-height:150px;resize:vertical}
textarea:focus,input:focus{border-color:var(--blue2);outline:none}
.hint{color:var(--mute);font-size:14px;margin:8px 0 14px}
.next{position:fixed;left:0;right:0;bottom:0;padding:12px 16px calc(14px + env(safe-area-inset-bottom));background:linear-gradient(transparent,var(--bg) 35%);display:flex;justify-content:center;pointer-events:none;z-index:6}
.next>*{pointer-events:auto}
.btn-big{width:100%;max-width:528px;min-height:58px;border:0;border-radius:var(--r);background:var(--red);color:#fff;font-size:24px;font-weight:700;cursor:pointer;box-shadow:0 8px 24px rgba(200,16,46,.35)}
.btn-big:hover{background:var(--red2)}
.btn-big:disabled{background:#3a4552;color:#9aa7b4;box-shadow:none;cursor:not-allowed}
.btn-alt{background:transparent;border:2px solid var(--line);box-shadow:none;margin-top:10px}
.linkbtn{background:none;border:0;color:var(--blue2);text-decoration:underline;padding:12px;cursor:pointer}
.foot{padding:14px 0 22px;color:var(--mute);font-size:12.5px;text-align:center}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.err{color:#ff8a9a;margin:8px 0}
.check{display:flex;gap:12px;align-items:center;margin:14px 0;min-height:48px;cursor:pointer}
.check input{width:26px;height:26px;accent-color:var(--red)}
.pick{background:linear-gradient(135deg,rgba(31,78,156,.35),rgba(200,16,46,.25));border:1px solid var(--line);border-radius:var(--r);padding:16px;margin:12px 0}
.pick b{font-family:"Barlow Condensed";font-size:26px;text-transform:uppercase;display:block}
@media (min-width:600px){h1{font-size:56px}.screen{padding-top:16px}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.react{grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0 4px}
.rx{min-height:96px;font-size:14px;gap:6px}.rx span{font-size:36px}
.card{position:relative;background:var(--card);border:1px solid var(--line);border-radius:20px;overflow:hidden;padding-bottom:14px;touch-action:pan-y;transition:transform .15s}
.card .media{border:0;border-radius:0;margin:0}
.card .media img,.card .media video{max-height:38dvh;width:100%;object-fit:cover}
.card h2{font-size:30px;margin:12px 14px 4px;line-height:1.05}
.cardsub{margin:0 14px;color:var(--mute);font-size:16px}
.stamp{position:absolute;top:16px;left:50%;transform:translateX(-50%);padding:6px 16px;border-radius:12px;font-family:"Barlow Condensed";font-size:26px;font-weight:800;text-transform:uppercase;opacity:0;background:rgba(11,15,20,.85);border:3px solid var(--ice);pointer-events:none}
.stamp.yes{border-color:#4cc38a}.stamp.no{border-color:var(--red)}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}
.tile{min-height:64px;padding:8px;border:2px solid var(--line);background:var(--card);border-radius:14px;cursor:pointer;font-family:"Barlow Condensed";text-transform:uppercase;font-weight:700;font-size:22px;line-height:1.05;display:grid;place-items:center;text-align:center}
.tile[aria-pressed=true]{border-color:var(--red);background:rgba(200,16,46,.22)}
.frames{display:grid;gap:12px;margin-top:8px}
.frame{display:flex;gap:12px;align-items:center;text-align:left;padding:8px;border:2px solid var(--line);background:var(--card);border-radius:16px;cursor:pointer;min-height:104px}
.frame img{width:110px;height:88px;object-fit:cover;border-radius:10px;flex:none}
.frame b{display:block;font-family:"Barlow Condensed";text-transform:uppercase;font-size:21px;line-height:1.05}
.frame small{display:block;color:var(--mute);font-size:14px;margin-top:3px}
.frame[aria-pressed=true]{border-color:var(--red);background:rgba(200,16,46,.2)}
.tag{font-weight:500;background:none;color:var(--mute);padding:0;font-size:13px;margin-bottom:8px}