/* Экран 5 — Колесо синхронистичности (ТЗ 27.10.2026): два вопроса → колесо → программа */
.wb{overflow:clip;--g:#d9b46c;--g2:#f4dea6;--gd:#a98445;--ink:#eef0f7;--mut:#b9c0d4;background:radial-gradient(1200px 700px at 72% 45%,#16244f 0%,#0b1430 45%,#060a18 100%);color:var(--ink);padding:96px max(5%,16px,env(safe-area-inset-left)) 96px max(5%,16px,env(safe-area-inset-right))}
.wb-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:start;max-width:1240px;margin:0 auto}
.wb .eyebrow{color:var(--g);font-size:12px;letter-spacing:.2em}
.wb h2{color:#f3efe4;font-size:clamp(36px,4vw,54px);letter-spacing:-1px;line-height:1.08}
.wb h2 em{font-style:italic;color:var(--g2)}
.wb-steps{display:flex;flex-wrap:wrap;gap:10px;list-style:none;margin:26px 0 0;padding:0}
.wb-steps li{display:flex;align-items:center;gap:10px;padding:8px 16px 8px 8px;border:1px solid rgba(217,180,108,.28);border-radius:999px;font-size:14px;color:var(--mut);background:rgba(10,16,36,.5);transition:border-color .4s,color .4s,background .4s}
.wb-steps li i{font-style:normal;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;border:1px solid rgba(217,180,108,.4);font-size:12px;color:var(--g)}
.wb-steps li.on{border-color:var(--g);color:#fff;background:rgba(217,180,108,.1);box-shadow:0 0 18px rgba(217,180,108,.18)}
.wb-steps li.on i{background:linear-gradient(135deg,var(--g2),var(--gd));color:#14182a;border-color:transparent}
.wb-quiz{position:relative;margin-top:26px;min-height:150px}
.wb.ran .wb-quiz{min-height:0}.wb.ran .wb-hint:empty{display:none}
.wb-q{border:0;margin:0;padding:0;min-width:0}
.wb-q legend{padding:0;margin-bottom:14px}
.wb-step{display:block;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--g);margin-bottom:10px}
.wb-qt{display:block;font:normal 19px/1.3 Editorial,Georgia,serif;color:#f3efe4}
.wb-opts{display:flex;flex-wrap:wrap;gap:10px}
.wb-opt{min-height:44px;padding:10px 16px;border:1px solid rgba(217,180,108,.4);border-radius:999px;background:rgba(10,16,36,.55);color:#e8eaf2;font:14px/1.3 Inter,Arial,sans-serif;transition:border-color .2s,background .2s,box-shadow .2s}
.wb-opt:hover{border-color:var(--g)}
.wb-opt[aria-pressed=true]{background:linear-gradient(135deg,var(--g2),var(--g) 55%,var(--gd));color:#14182a;font-weight:500;border-color:transparent;box-shadow:0 0 22px rgba(217,180,108,.35)}
.wb-opt:focus-visible,.wb a:focus-visible,.wb button:focus-visible{outline:3px solid var(--g2);outline-offset:3px}
.wb-q.fly{animation:wbFly .55s cubic-bezier(.5,0,.75,0) forwards;pointer-events:none}
.wb-q.enter{animation:wbIn .55s cubic-bezier(.2,.7,.2,1)}
@keyframes wbFly{to{transform:translate(-90px,-40px) rotate(-5deg) scale(.88);opacity:0}}
@keyframes wbIn{from{transform:translateX(50px);opacity:0}}
.wb-hint{margin:14px 0 0;font-size:14px;color:var(--mut);min-height:1.4em}
.wb-done{font:normal 19px Editorial,Georgia,serif;color:var(--g2)}
.wb-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.wb-chips span,.wb-chips button{min-height:36px;padding:8px 14px;border:1px solid rgba(217,180,108,.3);border-radius:999px;font:13px Inter,Arial,sans-serif;color:#e8eaf2;background:rgba(10,16,36,.5)}
.wb-chips button{color:var(--g2);text-decoration:underline;text-underline-offset:3px}
.wb-card{margin-top:22px;padding:22px 26px;border:1px dashed rgba(217,180,108,.4);border-radius:18px;background:rgba(10,16,36,.4);transition:border-color .6s,box-shadow .6s}
.wb-card.locked{display:flex;align-items:center;gap:14px;color:var(--mut);font-size:15px}
.wb-card.locked svg{flex:none;color:var(--g)}
.wb-card.won{border-style:solid;border-color:var(--g);box-shadow:0 0 34px rgba(217,180,108,.18);background:linear-gradient(160deg,rgba(32,44,86,.6),rgba(10,16,36,.6));animation:wbPop .7s cubic-bezier(.2,.8,.2,1)}
.wb-card .lbl,.wb-offer .lbl{display:flex;align-items:center;gap:8px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--g);margin:0 0 8px}
.wb .wb-card h3{font:normal clamp(30px,3vw,40px)/1.05 Editorial,Georgia,serif;color:#f6f1e3;margin:0 0 10px;min-height:0;letter-spacing:-.5px}
.wb-card p.d{margin:0;font-size:15px;line-height:1.55;color:#d6dbe8}
.wb-offer{margin-top:18px;padding:26px;border:1px solid rgba(217,180,108,.55);border-radius:20px;background:linear-gradient(165deg,#15214a,#0b1330 70%);box-shadow:0 0 40px rgba(217,180,108,.12);animation:wbPop .8s cubic-bezier(.2,.8,.2,1)}
.wb-offer .lbl i{width:8px;height:8px;border-radius:50%;background:var(--g);box-shadow:0 0 10px var(--g);animation:wbBlink 1.6s infinite}
.wb .wb-offer h3{font:normal clamp(24px,2.4vw,32px)/1.15 Editorial,Georgia,serif;color:#f6f1e3;margin:0 0 12px;min-height:0;letter-spacing:-.3px}
.wb-offer h3 em{font-style:italic;color:var(--g2)}
.wb-offer p.t{margin:0 0 14px;font-size:15.5px;line-height:1.55;color:#d6dbe8}
.wb-offer ul{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:8px;font-size:15px;color:#e8eaf2}
.wb-offer li::before{content:"✦";color:var(--g);margin-right:10px}
.wb-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:12px;margin:0 0 18px}
.wb-price b{font:normal clamp(30px,3.2vw,40px) Editorial,Georgia,serif;color:var(--g2)}
.wb-price s{font-size:16px;color:#aab2c8}
.wb-price span{padding:5px 12px;border-radius:999px;background:rgba(217,180,108,.16);color:var(--g2);font-size:13px}
.wb-cta{display:flex;justify-content:center;align-items:center;gap:10px;width:100%;min-height:56px;padding:14px 22px;border-radius:999px;background:linear-gradient(135deg,var(--g2),var(--g) 50%,var(--gd));color:#14182a;font:500 16px/1.3 Inter,Arial,sans-serif;text-align:center;text-decoration:none;box-shadow:0 10px 30px rgba(217,180,108,.25)}
.wb-term{margin:14px 0 0;font-size:13px;color:var(--mut)}
.wb-redir{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-top:14px;font-size:13px;color:#c3c9da}
.wb-bar{flex-basis:100%;height:3px;border-radius:3px;background:rgba(255,255,255,.12);overflow:hidden}
.wb-bar i{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--gd),var(--g2));transform-origin:left;transition:transform 1s linear}
.wb-redir button{min-height:44px;padding:0 4px;border:0;background:none;color:var(--g2);font:13px Inter,Arial,sans-serif;text-decoration:underline;text-underline-offset:3px}
@keyframes wbPop{from{transform:scale(.94);opacity:0}}
@keyframes wbBlink{50%{opacity:.35}}
/* колесо */
.wb-stage{display:flex;justify-content:center;position:sticky;top:110px}
.wb-wheel{position:relative;width:min(100%,480px);aspect-ratio:1}
.wb-wheel::before{content:"";position:absolute;inset:-8%;border-radius:50%;background:radial-gradient(circle,rgba(217,180,108,.18),transparent 65%);pointer-events:none}
.wb-wheel svg{position:relative;display:block;width:100%;height:100%;overflow:visible}
.wb-wheel svg.wb-top{position:absolute;inset:0;pointer-events:none;filter:drop-shadow(0 2px 6px rgba(0,0,0,.5))}
.wb-disc{transition:filter .9s}
.wb.closed .wb-disc{filter:blur(5px) saturate(.6) brightness(.7)}
.wb-lab{font-family:Editorial,Georgia,serif;font-size:15px;fill:#f3efe4}
.wb-tag{font:600 10.5px Inter,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;fill:#d9b46c}
.wb-qm{font:600 34px Editorial,Georgia,serif;fill:rgba(244,222,166,.75)}
.wb-real{transform-box:fill-box;transform-origin:center;transform:scale(.4);opacity:0;transition:transform .8s cubic-bezier(.2,.8,.2,1),opacity .5s}
.wb-sec.open .wb-real{transform:scale(1);opacity:1}
.wb-sec.open .wb-qm{opacity:0}
.wb-qm{transition:opacity .3s}
.wb-sec path{transition:fill .25s}
.wb-hub{position:absolute;left:50%;top:50%;width:24%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;border:1.5px solid var(--g);background:radial-gradient(circle at 50% 40%,#1b2752,#070b17 75%);display:grid;place-items:center;text-align:center;font:500 13px/1.2 Inter,Arial,sans-serif;color:var(--g2);padding:6px;transition:opacity .5s}
.wb.closed .wb-hub{opacity:0}
.wb-hub.spin{animation:wbPulse .9s ease-in-out infinite}
@keyframes wbPulse{50%{box-shadow:0 0 28px rgba(217,180,108,.55)}}
.wb-veil{position:absolute;inset:2%;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;padding:16%;background:radial-gradient(circle,rgba(6,10,24,.45) 30%,rgba(6,10,24,.8) 72%);transition:opacity .7s,visibility .7s}
.wb-veil svg{width:46px;height:46px;color:var(--g)}
.wb-veil b{font:italic normal clamp(17px,2.2vw,21px)/1.25 Editorial,Georgia,serif;color:#f3efe4}
.wb-veil small{font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--g);line-height:1.5}
.wb:not(.closed) .wb-veil{opacity:0;visibility:hidden}
.wb-flash{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle,rgba(255,236,190,.85),rgba(217,180,108,.25) 45%,transparent 70%);pointer-events:none;animation:wbFlash 1.1s ease-out forwards}
@keyframes wbFlash{from{transform:scale(.7);opacity:0}30%{opacity:1}to{transform:scale(1.25);opacity:0}}
.wb-spark{position:absolute;left:50%;top:50%;border-radius:50%;background:radial-gradient(circle,#fff6d8,#d9b46c 60%,transparent);pointer-events:none;animation:wbSpark var(--d) cubic-bezier(.1,.7,.3,1) forwards}
@keyframes wbSpark{from{transform:translate(-50%,-50%);opacity:1}to{transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) scale(.4);opacity:0}}
.wb-nojs{display:grid;gap:10px;margin-top:22px}
.wb-nojs a{color:var(--g2)}
.wb-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media(max-width:860px){.wb-grid{grid-template-columns:1fr;gap:32px}.wb-stage{order:-1;position:static}.wb-wheel{width:min(100%,420px)}}
@media(max-width:620px){.wb{padding-top:64px;padding-bottom:64px}.wb-offer,.wb-card{padding:20px 18px}.wb-opt{min-height:48px}.wb-steps li{font-size:13px}.wb-hub{font-size:11px}}
@media(prefers-reduced-motion:reduce){.wb *{animation:none!important;transition:none!important}}