.qz{position:relative;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;overflow:hidden;padding-bottom:env(safe-area-inset-bottom)}
.qz-top{display:flex;align-items:center;gap:14px;padding:16px 18px 0;position:relative;z-index:2;max-width:640px;width:100%;margin:0 auto}
.qz-bar{flex:1;height:8px;border-radius:8px;background:var(--tint2);overflow:hidden}
.qz-bar i{display:block;height:100%;width:0;border-radius:8px;background:linear-gradient(90deg,var(--accent),var(--deep));transition:width .5s cubic-bezier(.2,.8,.2,1)}
.qz-snd{width:44px;height:44px;border-radius:50%;border:0;background:var(--tint2);color:var(--ink);display:flex;align-items:center;justify-content:center;cursor:pointer}
.qz-snd[aria-pressed=false] .w{display:none}
.qz-snd:focus-visible,.qz-opt:focus-visible,.btn:focus-visible{outline:3px solid var(--deep);outline-offset:3px}
.qz-body{flex:1;display:flex;align-items:center;justify-content:center;width:100%;max-width:640px;position:relative;z-index:1;padding-top:18px;padding-bottom:28px}
.qz-card{width:100%;text-align:center;animation:qzIn .45s cubic-bezier(.2,.8,.2,1)}
@keyframes qzIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.qz-card h1,.qz-card h2{font-size:clamp(26px,7vw,38px);margin-bottom:10px}
.qz-card .lead{margin:0 auto 22px}
.qz-hint{display:block;margin-top:14px;opacity:.7;font-size:13px}
.qz-sub{opacity:.75;margin:0 0 20px}
.qz-opts{display:grid;gap:12px;grid-template-columns:1fr}
.qz-opts.chars{grid-template-columns:1fr 1fr}
.qz-opts.chars.three{grid-template-columns:1fr}
.qz-opt{font:inherit;color:inherit;text-align:left;background:#fff;border:2px solid var(--line);border-radius:20px;padding:16px;cursor:pointer;display:flex;align-items:center;gap:14px;min-height:64px;transition:transform .15s,border-color .15s,box-shadow .15s}
.qz-opt:active{transform:scale(.97)}
.qz-opt.sel{border-color:var(--deep);background:var(--tint);box-shadow:0 8px 22px rgba(124,92,224,.25)}
.qz-opt b{display:block;font-size:16px;line-height:1.25}.qz-opt small{display:block;font-size:13px;opacity:.75;line-height:1.35;margin-top:2px}
.qz-opt .ch{flex:none;width:76px;height:76px}
.chars:not(.three) .qz-opt{flex-direction:column;text-align:center;padding:18px 10px}.chars:not(.three) .qz-opt .ch{width:104px;height:104px}
.qz-opt .ic{flex:none;width:42px;height:42px;border-radius:13px;background:var(--tint2);display:flex;align-items:center;justify-content:center;font-size:21px}
.qz-eq{display:flex;gap:6px;justify-content:center;align-items:flex-end;height:46px;margin-bottom:18px}
.qz-eq i{width:8px;border-radius:6px;background:var(--accent);height:30%}
.anim .qz-eq i{animation:eq 1.1s ease-in-out infinite}
.qz-eq i:nth-child(2){animation-delay:.15s}.qz-eq i:nth-child(3){animation-delay:.3s}.qz-eq i:nth-child(4){animation-delay:.45s}.qz-eq i:nth-child(5){animation-delay:.6s}
@keyframes eq{50%{height:100%}}
.qz-res .ch{width:140px;height:140px;margin:0 auto 10px}
.qz-list{list-style:none;padding:0;margin:0 0 24px;display:grid;gap:10px;text-align:left}
.qz-list li{background:#fff;border:1px solid var(--line);border-radius:16px;padding:12px 14px;display:flex;gap:12px;align-items:flex-start}
.qz-list li:before{content:"✓";flex:none;width:24px;height:24px;border-radius:50%;background:var(--accent);color:var(--ink);font-weight:800;display:flex;align-items:center;justify-content:center;font-size:14px}
.qz-back{background:none;border:0;font:inherit;color:inherit;opacity:.65;margin-top:16px;cursor:pointer;text-decoration:underline;padding:10px}
@media(min-width:700px){.qz-opts.chars.three{grid-template-columns:repeat(3,1fr)}.qz-opts.chars.three .qz-opt{flex-direction:column;text-align:center}.qz-opts.chars.three .qz-opt .ch{width:96px;height:96px}.qz-body{max-width:760px}}