/* ── Valhjulet (js/widgets/choicewheel.js): candy colours, big emoji, a round GO button, a ticket for the answer ── */
.cwh{position:relative;width:100%;height:100%;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;gap:.6rem;padding:.9rem 1rem 1rem;overflow:hidden;font-family:"Poppins",sans-serif;color:var(--font);background:linear-gradient(170deg,#fff7fb 0%,#f2f6ff 55%,#eafaf6 100%)}
.cwh-h{font-size:clamp(1.15rem,6cqw,1.7rem);font-weight:800;text-align:center;line-height:1.2}
.cwh-h--sm{font-size:clamp(1rem,4.6cqw,1.25rem);align-self:stretch;text-align:left}
.cwh-cta{margin-top:auto;align-self:stretch;height:3rem;border:none;border-radius:999px;background:linear-gradient(180deg,#8b7bff,#6a58f0);color:#fff;font:800 1rem "Poppins",sans-serif;cursor:pointer;box-shadow:0 .25rem 0 #4a39c4,0 .6rem 1rem rgba(106,88,240,.3);transition:transform .08s,box-shadow .08s}
.cwh-cta:hover:not(:disabled){transform:translateY(-1px)}
.cwh-cta:active:not(:disabled){transform:translateY(.2rem);box-shadow:0 .05rem 0 #4a39c4}
.cwh-cta:disabled{opacity:.55;cursor:default;box-shadow:none}
/* guide */
.cwh--guide{justify-content:center}
.cwh-badge{font-size:clamp(3rem,22cqw,5.5rem);line-height:1;animation:cwh-bob 2.6s ease-in-out infinite}
.cwh-steps{list-style:none;margin:.2rem 0 .4rem;padding:0;display:flex;flex-direction:column;gap:.55rem;width:100%}
.cwh-steps li{display:flex;gap:.8rem;align-items:center;background:#fff;border-radius:1.25rem;padding:.65rem .9rem;box-shadow:0 .1rem .5rem rgba(60,60,120,.1)}
.cwh-steps b{display:block;font-size:clamp(.9rem,4.2cqw,1.05rem)}
.cwh-steps small{display:block;font-size:clamp(.72rem,3.2cqw,.85rem);color:var(--font-sub);line-height:1.35}
.cwh-n{flex:0 0 auto;width:2.1rem;height:2.1rem;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;background:#6c8cff}
.cwh-steps li:nth-child(2) .cwh-n{background:#ffb347}.cwh-steps li:nth-child(3) .cwh-n{background:#6bd49a}
/* editor */
.cwh--edit{align-items:stretch;overflow-y:auto}
.cwh-lbl{display:flex;flex-direction:column;gap:.25rem;font-size:.78rem;font-weight:700;color:var(--font-sub)}
.cwh-count{margin-left:.3rem;font-weight:600;opacity:.7}
.cwh-in,.cwh-txt,.cwh-emo{font:600 .95rem "Poppins",sans-serif;color:var(--font);border:1px solid #d9deea;border-radius:.9rem;background:#fff;padding:0 .8rem;height:2.5rem;outline:none;min-width:0}
.cwh-in:focus,.cwh-txt:focus,.cwh-emo:focus{border-color:#6c8cff;box-shadow:0 0 0 .18rem rgba(108,140,255,.22)}
.cwh-list{display:flex;flex-direction:column;gap:.4rem;max-height:14rem;overflow-y:auto;padding:.1rem}
.cwh-row{display:flex;gap:.4rem;align-items:center;border-left:.35rem solid var(--c);border-radius:.9rem}
.cwh-emo{width:3rem;text-align:center;padding:0;font-size:1.2rem;flex:0 0 auto}
.cwh-txt{flex:1}
.cwh-x{width:2.2rem;height:2.2rem;border:none;border-radius:50%;background:transparent;color:var(--font-sub);cursor:pointer;display:grid;place-items:center;flex:0 0 auto}
.cwh-x:hover{background:#fdecea;color:#d6322a}
.cwh-add{display:flex;gap:.4rem}.cwh-add .cwh-in{flex:1}
.cwh-plus{width:2.5rem;height:2.5rem;border:none;border-radius:50%;background:#6c8cff;color:#fff;cursor:pointer;display:grid;place-items:center;flex:0 0 auto}
.cwh-sug-h{font-size:.72rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--font-sub)}
.cwh-sug{display:flex;flex-wrap:wrap;gap:.35rem}
.cwh-chip{border:1px solid #d9deea;background:#fff;border-radius:999px;height:2.1rem;padding:0 .8rem;font:600 .8rem "Poppins",sans-serif;color:var(--font);cursor:pointer}
.cwh-chip:hover{background:#eef2ff;border-color:#6c8cff}
.cwh-opt{display:flex;gap:.55rem;align-items:center;font-size:.85rem;font-weight:600;cursor:pointer}
.cwh-opt input{width:1.1rem;height:1.1rem;accent-color:#6a58f0}
/* wheel */
.cwh--wheel{justify-content:flex-start;gap:.7rem;container-type:size}
.cwh-ticket{position:relative;width:100%;min-height:clamp(3.2rem,16cqh,5rem);display:flex;align-items:center;justify-content:center;gap:.7rem;padding:.4rem 1.2rem;border-radius:1.4rem;background:#fff;color:#4a39c4;box-shadow:0 .15rem .8rem rgba(60,60,120,.14);flex:0 0 auto;text-align:center}
.cwh-ticket::before,.cwh-ticket::after{content:'';position:absolute;top:50%;width:1.1rem;height:1.1rem;margin-top:-.55rem;border-radius:50%;background:#f4f4ff}
.cwh-ticket::before{left:-.55rem}.cwh-ticket::after{right:-.55rem}
.cwh-ticket-q{font-weight:800;font-size:clamp(1rem,6cqw,1.6rem);line-height:1.2}
.cwh-ticket--on{background:linear-gradient(135deg,#6a58f0,#8b7bff);color:#fff;animation:cwh-pop .6s cubic-bezier(.2,1.5,.4,1) both}
.cwh-ticket--on::before,.cwh-ticket--on::after{background:#f4f4ff}
.cwh-ticket-e{font-size:clamp(1.8rem,10cqw,3rem);line-height:1}
.cwh-ticket-t{font-weight:800;font-size:clamp(1.1rem,6.6cqw,2rem);line-height:1.15;overflow-wrap:anywhere}
.cwh-wbox{position:relative;flex:1 1 0;min-height:0;width:100%;display:grid;place-items:center;container-type:size}
.cwh-svg{width:min(100cqw,100cqh);height:min(100cqw,100cqh);overflow:visible;cursor:pointer;-webkit-tap-highlight-color:transparent}
.cwh-slice.won path:first-child{stroke:#2f2f5a;stroke-width:5}
.cwh-pin.cwh-flick{animation:cwh-flick .09s ease-out}
.cwh-go{position:absolute;left:50%;top:50%;width:clamp(3.6rem,24cqmin,6.2rem);height:clamp(3.6rem,24cqmin,6.2rem);transform:translate(-50%,-50%);border-radius:50%;border:.28rem solid #fff;background:radial-gradient(circle at 35% 28%,#9d8fff,#6a58f0 60%,#4a39c4);color:#fff;font:900 clamp(1rem,6cqmin,1.7rem) "Poppins",sans-serif;letter-spacing:.04em;cursor:pointer;box-shadow:0 .3rem .9rem rgba(42,30,120,.45)}
.cwh-go:hover:not(:disabled){filter:brightness(1.08)}
.cwh-go:disabled{cursor:default;animation:none}
.cwh--wheel:not(.is-spinning) .cwh-go{animation:cwh-throb 1.8s ease-in-out infinite}
.cwh-bar{display:flex;justify-content:center;gap:.5rem;flex:0 0 auto}
.cwh-mini{height:2.4rem;padding:0 .9rem;border:none;border-radius:999px;background:#fff;color:var(--font);font:700 .82rem "Poppins",sans-serif;cursor:pointer;display:inline-flex;align-items:center;gap:.35rem;box-shadow:0 .05rem .3rem rgba(0,0,0,.12)}
.cwh-mini:hover{background:#eef2ff}.cwh-mini .material-icons-outlined{font-size:1.15rem}
.cwh-conf{position:absolute;inset:0;pointer-events:none;overflow:hidden;container-type:size}
.cwh-conf i{position:absolute;top:30%;width:.55rem;height:.9rem;border-radius:.12rem;opacity:0;animation:cwh-conf 1.9s cubic-bezier(.15,.7,.3,1) forwards}
@keyframes cwh-bob{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-.4rem) rotate(3deg)}}
@keyframes cwh-pop{0%{transform:scale(.4) rotate(-3deg);opacity:0}60%{transform:scale(1.1) rotate(1.5deg);opacity:1}100%{transform:none}}
@keyframes cwh-flick{0%{transform:rotate(-16deg)}100%{transform:rotate(0)}}
@keyframes cwh-throb{0%,100%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.07)}}
@keyframes cwh-conf{0%{opacity:1;transform:translate(0,0) rotate(0)}70%{opacity:1}100%{opacity:0;transform:translate(var(--dx),calc(var(--dy) * -1 + 60cqh)) rotate(var(--r))}}
@media (prefers-reduced-motion:reduce){.cwh-badge,.cwh-ticket--on,.cwh--wheel:not(.is-spinning) .cwh-go,.cwh-pin.cwh-flick{animation:none}}
.cwh-lbl:not(:has(input)){flex-direction:row;align-items:baseline}
.cwh-spin b{color:#6a58f0;margin-left:.3rem}.cwh-range{width:100%;accent-color:#6a58f0}
.cwh-eye{width:2.2rem;height:2.2rem;border:none;border-radius:50%;background:transparent;color:#6a58f0;cursor:pointer;display:grid;place-items:center;flex:0 0 auto}.cwh-eye:hover{background:#eef2ff}.cwh-eye.is-off{color:#9aa4b2}.cwh-row.is-off .cwh-txt,.cwh-row.is-off .cwh-emo{opacity:.45;text-decoration:line-through}
