:root{--i1:#676ff8;--i2:#a06be2;--p1:#e867cc;--grad:linear-gradient(100deg,#676ff8 0%,#a06be2 52%,#e867cc 100%);--teal:#006580;--blue:#226e93;--sky:#49aad4;--ink:#212121;--muted:#5f6475;--line:#e7e5f5;--bg:#f6f5fc;--card:#fff;--ok:#178a4c;--okbg:#e8f7ee;--okline:#9fdcb8;--bad:#cf2f45;--badbg:#fdeef0;--badline:#f3b3bd;--r:18px;--sh:0 1px 2px rgba(33,33,60,.06),0 8px 28px rgba(80,70,160,.10);
--a0:#7357ee;--a1:#d9409f;--a2:#00809e;--a3:#e08a00}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Lato,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:17px;line-height:1.5;-webkit-tap-highlight-color:transparent}
[hidden]{display:none!important}
h1,h2,h3{font-family:"Playpen Sans","Playpen Sans Hebrew",Lato,system-ui,sans-serif;font-weight:700;color:var(--teal);line-height:1.15;margin:0 0 12px}
.he{direction:rtl;font-family:Arial,"Segoe UI",sans-serif}
.eyebrow{margin:0 0 8px;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--blue)}
.muted{color:var(--muted)}
.btn{appearance:none;border:0;cursor:pointer;font:inherit;font-weight:900;font-size:18px;letter-spacing:.01em;color:#fff;background:var(--grad);background-size:140% 100%;border-radius:14px;padding:14px 22px;min-height:54px;box-shadow:0 6px 18px rgba(120,100,230,.32);transition:transform .15s,box-shadow .2s,background-position .4s,opacity .2s}
.btn:hover{background-position:100% 0;box-shadow:0 8px 24px rgba(120,100,230,.42)}
.btn:active{transform:scale(.98)}
.btn:disabled{opacity:.45;cursor:default;box-shadow:none}
.btn.ghost{background:#fff;color:var(--teal);border:2px solid var(--line);box-shadow:none}
.btn.ghost:hover{border-color:#b9b3f2}
.btn.wide{width:100%}
.btn small{display:block;font-weight:700;font-size:13px;opacity:.92;font-family:Arial,sans-serif}
.btn:focus-visible,.opt:focus-visible,.seg button:focus-visible,input:focus-visible{outline:3px solid var(--sky);outline-offset:3px}
.screen{display:none}
.screen.active{display:block;animation:rise .38s cubic-bezier(.2,.8,.2,1)}
@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes pop{from{transform:scale(.85);opacity:.3}to{transform:none;opacity:1}}
@keyframes shake{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
.gap{display:inline-block;min-width:3.2em;padding:0 .35em;border-bottom:3px solid #bdb8ef;color:#9a95c9;text-align:center;line-height:1.2}
.gap.filled{color:var(--ok);border-bottom-color:var(--ok);font-weight:700;animation:pop .3s}
.verb{color:var(--muted);white-space:nowrap}
/* answer tiles */
.shape{display:inline-flex;flex:none;width:1.25em;height:1.25em}
.shape svg{width:100%;height:100%;fill:#fff}
.opt{appearance:none;font:inherit;font-weight:900;color:#fff;border:0;border-radius:14px;display:flex;align-items:center;gap:.55em;text-align:left;cursor:pointer;box-shadow:0 4px 0 rgba(0,0,0,.18);transition:transform .12s,opacity .25s,filter .25s;position:relative}
.opt.c0{background:var(--a0)}.opt.c1{background:var(--a1)}.opt.c2{background:var(--a2)}.opt.c3{background:var(--a3)}
.opt:active:not(:disabled){transform:translateY(2px);box-shadow:0 2px 0 rgba(0,0,0,.18)}
.opt:disabled{cursor:default}
.opt.dim{opacity:.28;filter:saturate(.4)}
.opt .count{margin-left:auto;background:rgba(255,255,255,.25);border-radius:999px;padding:.05em .55em;font-size:.85em}
.opt.isright{outline:5px solid var(--ok);outline-offset:3px;animation:pop .35s}
.opt .tick{display:none;margin-left:auto;background:#fff;color:var(--ok);border-radius:50%;width:1.5em;height:1.5em;align-items:center;justify-content:center;font-size:.9em}
.opt.isright .tick{display:inline-flex}
.opt.isright .count{margin-left:.4em}
#confetti{position:fixed;inset:0;pointer-events:none;width:100%;height:100%;z-index:50}
.toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);background:#2b2840;color:#fff;padding:10px 18px;border-radius:12px;font-weight:700;font-size:15px;z-index:60;box-shadow:var(--sh);max-width:92vw;text-align:center}
.net{position:fixed;top:8px;left:50%;transform:translateX(-50%);background:#fff6ea;color:#9a5a12;border:1px solid #f6d9b3;border-radius:999px;padding:4px 14px;font-size:13px;font-weight:700;z-index:60}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}