@font-face{font-family:"Fredoka";src:url(../fonts/fredoka-heb.woff2) format("woff2");font-weight:300 700;unicode-range:U+0590-05FF,U+FB1D-FB4F,U+200C-2010,U+20AA,U+25CC;font-display:swap}
@font-face{font-family:"Fredoka";src:url(../fonts/fredoka-lat.woff2) format("woff2");font-weight:300 700;unicode-range:U+0000-024F,U+2000-206F,U+2190-21FF,U+2212,U+00D7,U+00F7;font-display:swap}
@font-face{font-family:"Rubik";src:url(../fonts/rubik-heb.woff2) format("woff2");font-weight:300 900;unicode-range:U+0590-05FF,U+FB1D-FB4F,U+200C-2010,U+20AA,U+25CC;font-display:swap}
@font-face{font-family:"Rubik";src:url(../fonts/rubik-lat.woff2) format("woff2");font-weight:300 900;unicode-range:U+0000-024F,U+2000-206F,U+2190-21FF,U+2212,U+00D7,U+00F7;font-display:swap}
:root{
 --bg:#FFF7EE;--card:#FFFFFF;--ink:#3A3456;--ink2:#6E6789;--line:#EADFD3;
 --coral:#F07A68;--coral-l:#FFE1DA;--amber:#F4B43C;--amber-l:#FFF0C9;--mint:#3DB494;--mint-l:#D5F3E8;
 --sky:#4C9FE0;--sky-l:#DCEEFC;--lav:#8E70D8;--lav-l:#ECE4FB;--rose:#E86FA0;--rose-l:#FCE0EC;
 --u:#F4B43C;--t:#4C9FE0;--h:#F07A68;--th:#8E70D8;
 --r:18px;--shadow:0 6px 18px rgba(80,60,120,.10),0 1px 3px rgba(80,60,120,.08);
 --font:"Rubik","Fredoka",system-ui,sans-serif;--fround:"Fredoka","Rubik",system-ui,sans-serif;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);font-family:var(--font);}
body{overscroll-behavior:none}
button{font-family:inherit;color:inherit;cursor:pointer}
.num{direction:ltr;unicode-bidi:isolate;font-family:var(--fround);font-variant-numeric:tabular-nums}
#app{min-height:100%;display:flex;flex-direction:column}
footer.copy{text-align:center;font-size:12.5px;color:var(--ink2);padding:6px 10px 8px;flex:none}
/* ---------- home ---------- */
.home{max-width:1180px;margin:0 auto;padding:18px 16px 10px;width:100%;flex:1}
.hero{display:flex;align-items:center;gap:16px;background:linear-gradient(135deg,#FFE7D6,#EDE3FF 60%,#DDF1FF);border-radius:28px;padding:22px 22px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.hero h1{font-family:var(--fround);font-weight:700;font-size:clamp(28px,6vw,46px);margin:0;letter-spacing:.5px}
.hero p{margin:6px 0 0;font-size:clamp(15px,2.6vw,19px);color:var(--ink2)}
.hero .art{flex:none;width:clamp(96px,22vw,190px)}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin:18px 2px 4px}
.chip{border:2px solid var(--line);background:#fff;border-radius:999px;padding:8px 16px;font-size:16px;font-weight:500}
.chip.on{background:var(--ink);border-color:var(--ink);color:#fff}
.group h2{font-family:var(--fround);font-size:22px;margin:22px 4px 10px;display:flex;align-items:center;gap:8px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.card{display:flex;gap:14px;align-items:center;text-align:start;background:var(--card);border:none;border-radius:22px;padding:14px;box-shadow:var(--shadow);text-decoration:none;color:inherit;transition:transform .18s,box-shadow .18s;min-height:108px}
.card:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(80,60,120,.16)}
.card:active{transform:scale(.98)}
.card .ic{flex:none;width:84px;height:84px;border-radius:18px;display:grid;place-items:center}
.card .ic svg{width:66px;height:66px}
.card h3{margin:0;font-family:var(--fround);font-size:20px}
.card p{margin:4px 0 6px;font-size:14.5px;color:var(--ink2);line-height:1.35}
.grades{display:flex;gap:5px;flex-wrap:wrap}
.gr{font-size:12.5px;font-weight:600;padding:2px 9px;border-radius:999px;background:var(--bg);color:var(--ink2)}
.soon .card{background:rgba(255,255,255,.55);box-shadow:none;border:2px dashed var(--line);cursor:default;min-height:84px}
.soon .card:hover{transform:none}
.soon .card .ic{width:56px;height:56px;font-size:28px;background:#fff}
.soonbadge{font-size:13px;background:var(--lav-l);color:var(--lav);padding:3px 10px;border-radius:999px;font-weight:600}
.hidden{display:none!important}
/* ---------- widget shell ---------- */
.wshell{height:100dvh;display:flex;flex-direction:column;overflow:hidden}
.topbar{flex:none;display:flex;align-items:center;gap:8px;padding:8px 10px;background:#fff;box-shadow:0 2px 10px rgba(80,60,120,.07);z-index:5}
.topbar h1{flex:1;margin:0;font-family:var(--fround);font-size:clamp(19px,3.4vw,26px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;gap:8px}
.topbar h1 .tic{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;flex:none}
.topbar h1 .tic svg{width:28px;height:28px}
.ibtn{text-decoration:none;color:var(--ink);flex:none;min-width:46px;height:46px;border-radius:14px;border:none;background:var(--bg);display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:16px;font-weight:600;padding:0 12px}
.ibtn svg{width:22px;height:22px}
.ibtn:active{transform:scale(.95)}
.ibtn .lbl{display:none}
@media (min-width:700px){.ibtn .lbl{display:inline}}
.wbody{flex:1;min-height:0;display:grid;grid-template-rows:1fr auto;}
.stage{position:relative;min-height:0;min-width:0;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:10px}
.panel{background:#fff;border-radius:22px 22px 0 0;box-shadow:0 -4px 16px rgba(80,60,120,.08);padding:10px 12px 4px;display:flex;flex-wrap:wrap;gap:8px 10px;align-items:center;justify-content:center;max-height:44vh;overflow:auto}
.panel .copy{width:100%;padding:4px 0 2px;font-size:11.5px}
@media (min-width:900px) and (orientation:landscape){
 .wbody{grid-template-rows:1fr;grid-template-columns:1fr 310px}
 .panel{border-radius:22px 0 0 22px;flex-direction:column;flex-wrap:nowrap;align-items:stretch;justify-content:flex-start;max-height:none;padding:16px 14px 6px;box-shadow:4px 0 16px rgba(80,60,120,.08)}
 .panel .copy{margin-top:auto}
}
.ctl{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:center}
.ctl .cl{font-size:15px;color:var(--ink2);font-weight:500}
.seg{display:inline-flex;background:var(--bg);border-radius:14px;padding:3px;gap:2px;flex-wrap:wrap;justify-content:center}
.seg button{border:none;background:transparent;border-radius:11px;min-height:40px;padding:0 12px;font-size:15.5px;font-weight:500}
.seg button.on{background:#fff;box-shadow:0 2px 6px rgba(80,60,120,.15);color:var(--ink);font-weight:700}
.btn{border:none;border-radius:14px;min-height:44px;padding:0 16px;font-size:16px;font-weight:600;background:var(--sky-l);color:#1f5f93;display:inline-flex;align-items:center;justify-content:center;gap:6px}
.btn:active{transform:scale(.96)}
.btn.pri{background:var(--ink);color:#fff}
.btn.coral{background:var(--coral-l);color:#a8402f}.btn.mint{background:var(--mint-l);color:#1d7a61}.btn.lav{background:var(--lav-l);color:#5a3fa8}.btn.amber{background:var(--amber-l);color:#8a5d00}
.btn[disabled]{opacity:.4}
.stepper{display:inline-flex;align-items:center;background:var(--bg);border-radius:14px;padding:3px}
.stepper button{width:40px;height:40px;border:none;border-radius:11px;background:#fff;font-size:22px;font-weight:700;box-shadow:0 1px 3px rgba(80,60,120,.12)}
.stepper .v{min-width:42px;text-align:center;font-size:19px;font-weight:700}
.tgl{display:inline-flex;align-items:center;gap:8px;border:none;background:var(--bg);border-radius:14px;min-height:44px;padding:0 12px;font-size:15.5px;font-weight:500}
.tgl i{width:38px;height:22px;border-radius:99px;background:#d9d0e6;position:relative;transition:.2s;flex:none}
.tgl i:after{content:"";position:absolute;top:3px;right:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:.2s}
.tgl.on i{background:var(--mint)}
.tgl.on i:after{right:19px}
.sep{width:100%;height:0}
@media (min-width:900px) and (orientation:landscape){.ctl{justify-content:flex-start}.sep{display:none}}
.ptitle{font-family:var(--fround);font-weight:600;font-size:15px;color:var(--ink2);width:100%;text-align:center;margin-top:2px}
@media (min-width:900px) and (orientation:landscape){.ptitle{text-align:start;margin-top:8px}}
/* modal + toast */
.modal{position:fixed;inset:0;background:rgba(40,30,70,.35);display:grid;place-items:center;z-index:50;padding:18px;animation:fade .2s}
.modal .box{background:#fff;border-radius:24px;max-width:520px;width:100%;padding:22px 22px 18px;box-shadow:0 20px 50px rgba(40,30,70,.3);animation:pop .25s}
.modal h2{margin:0 0 10px;font-family:var(--fround)}
.modal ul{margin:0;padding-inline-start:22px;line-height:1.6;font-size:17px}
.modal .tchr{margin-top:12px;background:var(--amber-l);border-radius:14px;padding:10px 12px;font-size:15px;line-height:1.45}
.modal .btn{margin-top:14px;width:100%}
.toast{position:fixed;top:72px;left:50%;transform:translateX(-50%);background:var(--ink);color:#fff;padding:10px 18px;border-radius:14px;font-size:16px;z-index:60;animation:pop .25s;pointer-events:none;max-width:90vw;text-align:center}
@keyframes fade{from{opacity:0}}
@keyframes pop{from{opacity:0;transform:scale(.85)}}
@keyframes popin{0%{transform:scale(.3);opacity:0}70%{transform:scale(1.12)}100%{transform:scale(1);opacity:1}}
@keyframes wob{0%,100%{transform:rotate(0)}25%{transform:rotate(-6deg)}75%{transform:rotate(6deg)}}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(240,122,104,.55)}50%{box-shadow:0 0 0 10px rgba(240,122,104,0)}}
.popin{animation:popin .35s ease-out both}
.big-eq{font-family:var(--fround);font-weight:600;direction:ltr;unicode-bidi:isolate}
.frac{display:inline-flex;flex-direction:column;align-items:center;vertical-align:middle;line-height:1;font-family:var(--fround);font-weight:600;direction:ltr}
.frac b{display:block;padding:0 .12em}
.frac b:first-child{border-bottom:.07em solid currentColor;padding-bottom:.08em;margin-bottom:.08em}

.pv{width:100%;height:100%;display:flex;flex-direction:column;gap:8px}
.pv-info{flex:none;display:flex;flex-direction:column;align-items:center;gap:2px;text-align:center}
.pv-num{font-family:var(--fround);font-weight:700;font-size:clamp(38px,8vh,64px);line-height:1.05;letter-spacing:2px;cursor:pointer}
.pv-exp{font-size:clamp(17px,3vh,24px);color:var(--ink2);cursor:pointer;font-weight:500}
.pv-words{font-size:clamp(17px,3vh,24px);font-weight:500;cursor:pointer;min-height:1.3em}
.veil{color:transparent!important;background:repeating-linear-gradient(45deg,#EFE6F9,#EFE6F9 8px,#F6F0FC 8px,#F6F0FC 16px);border-radius:12px;min-width:120px}
.veil *{color:transparent!important}
.pv-target{font-size:17px;background:var(--lav-l);color:#5a3fa8;padding:4px 14px;border-radius:99px;margin-bottom:4px}
.pv-target.hit{background:var(--mint-l);color:#1d7a61;animation:popin .4s}
.pv-board{flex:1;min-height:0;display:grid;grid-template-columns:repeat(4,1fr);gap:8px;border-radius:20px;transition:background .2s;padding:2px}
.pv-board.hot{background:rgba(76,159,224,.10)}
.pv-col{display:flex;flex-direction:column;background:#fff;border-radius:18px;box-shadow:var(--shadow);overflow:hidden;min-width:0;position:relative}
.pv-col.over{box-shadow:0 0 0 3px var(--coral),var(--shadow)}
.pv-head{text-align:center;padding:6px 2px 4px}
.pv-name{font-size:clamp(13px,2.4vw,18px);font-weight:600;color:var(--ink2)}
.pv-digit{font-size:clamp(30px,6vh,48px);font-weight:700;line-height:1}
.pv-digit.zero{opacity:.35}.pv-digit.bad{color:var(--coral)!important}
.pv-area{flex:1;min-height:0;position:relative;padding:8px 5px;display:flex;justify-content:center;align-items:flex-start;gap:calc(var(--cu)*.12)}
.pv-u{display:grid;grid-template-rows:repeat(10,var(--cu));grid-auto-flow:column;grid-auto-columns:var(--cu);gap:calc(var(--cu)*.12);align-content:start}
.pv-t{align-items:flex-start}
.pv-h .blk,.pv-th .blk{position:absolute;left:50%;transform:translateX(-50%)}
.pv-h .blk.popin,.pv-th .blk.popin{animation:popin2 .35s ease-out both}
@keyframes popin2{0%{transform:translateX(-50%) scale(.3);opacity:0}70%{transform:translateX(-50%) scale(1.08)}100%{transform:translateX(-50%) scale(1)}}
.blk{touch-action:none;cursor:grab;flex:none}
.blk-u{background:#F4B43C;border-radius:calc(var(--cu)*.22);box-shadow:inset 0 -3px 0 rgba(0,0,0,.12),inset 0 2px 0 rgba(255,255,255,.4)}
.blk-t{display:flex;flex-direction:column;gap:calc(var(--cu)*.12);background:transparent}
.blk-t i{flex:1;background:#4C9FE0;border-radius:calc(var(--cu)*.18);box-shadow:inset 0 -2px 0 rgba(0,0,0,.12);display:block}
.blk-h svg,.blk-th svg{width:100%;height:100%;display:block;filter:drop-shadow(0 2px 3px rgba(80,60,120,.25))}
.blk.merging{transition:transform .35s,opacity .35s;transform:translateX(-40px) scale(.4)!important;opacity:0}
.pv-group{margin:6px auto;border:none;background:var(--coral);color:#fff;font-weight:700;font-size:15px;border-radius:99px;padding:8px 12px;white-space:nowrap;animation:pulse 1.4s infinite;z-index:2}
.pv-pms{display:flex;justify-content:center;gap:6px;padding:6px}
.pv-pm{width:40px;height:38px;border-radius:12px;border:none;background:var(--l);color:var(--ink);font-size:22px;font-weight:700}
.pv-tray{display:flex;gap:8px;justify-content:center;align-items:flex-end;width:100%;--cu:16px}
.tray-item{display:flex;flex-direction:column;align-items:center;gap:4px;background:var(--bg);border-radius:16px;padding:8px 6px 6px;min-width:66px;touch-action:none;cursor:grab;font-size:13px;font-weight:600;color:var(--ink2)}
.tray-item .blk-u{width:22px;height:22px}.tray-item .blk-t{width:12px;height:56px;gap:1px}.tray-item .blk-t i{border-radius:2px}
.tray-item .blk-h{width:56px;height:56px}.tray-item .blk-th{width:58px;height:58px}
.tray-item:active{transform:scale(.95)}
.ghost{position:fixed;z-index:80;pointer-events:none;transform:translate(-50%,-50%) scale(1.05);opacity:.9;filter:drop-shadow(0 8px 12px rgba(0,0,0,.25))}
.conf{position:fixed;width:10px;height:10px;border-radius:3px;z-index:90;pointer-events:none;animation:conf .9s ease-out forwards}
@keyframes conf{to{transform:translate(var(--dx),calc(var(--dy) + 160px)) rotate(400deg);opacity:0}}

.tf{display:flex;flex-direction:column;align-items:center;gap:10px;width:100%}
.tf-eq{font-size:clamp(30px,6.5vh,52px);min-height:1.2em;padding:0 14px;text-align:center}
.tf-eq b{color:var(--mint)}
.tf-sub{font-size:clamp(17px,3vh,23px);color:var(--ink2);min-height:1.4em;text-align:center}
.tf-frames{display:flex;flex-direction:column;gap:18px;align-items:center;width:100%}
.tf-frame{display:grid;grid-template-columns:repeat(5,1fr);background:#fff;border:4px solid #3DB494;border-radius:18px;overflow:hidden;width:300px;box-shadow:var(--shadow)}
.tf-cell{aspect-ratio:1;border:none;border-left:2px solid #A9DEC9;border-bottom:2px solid #A9DEC9;background:#fff;display:grid;place-items:center;padding:0}
.tf-cell:nth-child(5n+1){border-left:none}.tf-cell:nth-child(n+6){border-bottom:none}
.tf-dot{width:72%;height:72%;border-radius:50%;display:block;box-shadow:inset 0 -5px 0 rgba(0,0,0,.13),inset 0 4px 0 rgba(255,255,255,.35)}
.sw{display:inline-block;width:14px;height:14px;border-radius:50%;vertical-align:middle}
.flashhide .tf-dot{opacity:0;transition:opacity .2s}

.hc{display:flex;flex-direction:column;align-items:center;gap:6px;width:100%;height:100%}
.hc-status{font-size:clamp(20px,4vh,32px);min-height:1.3em;text-align:center}
.hc-grid{display:grid;grid-template-columns:repeat(10,1fr);gap:4px;width:min(100%,calc(100dvh - 210px));aspect-ratio:1;max-height:100%}
@media (max-width:899px),(orientation:portrait){.hc-grid{width:min(100%,calc(100dvh - 400px),640px)}}
.hc-cell{border:none;border-radius:8px;background:#fff;box-shadow:0 1px 3px rgba(80,60,120,.13);font-size:clamp(13px,3.7vmin,25px);font-weight:600;padding:0;transition:background .2s,transform .2s;color:var(--ink)}
.hc-cell.painted{color:#fff;text-shadow:0 1px 1px rgba(0,0,0,.2)}
.hc-cell.covered{background:repeating-linear-gradient(45deg,#C9B6F2,#C9B6F2 5px,#D8CAF6 5px,#D8CAF6 10px)!important;color:transparent!important;text-shadow:none}
.hc-cell.onjump{outline:4px solid var(--mint);outline-offset:-2px;transform:scale(1.12);z-index:2;background:var(--mint-l)}
.hc-cell.trail{box-shadow:inset 0 0 0 3px var(--mint)}
.hc-cell.hop{animation:popin .35s}
.hc-pal{display:flex;gap:8px}
.hc-sw{width:42px;height:42px;border-radius:50%;border:3px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.2);font-size:18px;background:#fff}
.hc-sw.on{outline:3px solid var(--ink);outline-offset:2px}

.nl{display:flex;flex-direction:column;align-items:center;width:100%;gap:6px}
.nl-eq{font-size:clamp(26px,5.5vh,46px);min-height:1.5em;text-align:center;display:flex;align-items:center;justify-content:center;gap:.15em}
.nl-eq b{color:var(--mint)}
.nl-eq .hint{font-family:var(--font);font-size:clamp(16px,2.8vh,21px);color:var(--ink2);font-weight:400;direction:rtl}
.nl-svg{touch-action:none;display:block;user-select:none}
.nl-svg text{user-select:none;pointer-events:none}
.frog2{filter:drop-shadow(0 3px 3px rgba(46,94,58,.22))}
.arcnew{stroke-dasharray:2400;stroke-dashoffset:2400;animation:draw .55s ease-out forwards}
@keyframes draw{to{stroke-dashoffset:0}}

.fr{display:flex;flex-direction:column;align-items:center;gap:10px;width:100%;height:100%;justify-content:center}
.fr-row{display:flex;align-items:center;justify-content:center;gap:14px}
.fr-row.col{flex-direction:column;gap:6px}
.fr-card{background:#fff;border-radius:22px;box-shadow:var(--shadow);padding:10px 12px;display:flex;flex-direction:column;align-items:center;gap:8px}
.fr-top,.fr-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:center}
.fr-tools .btn{min-height:38px;padding:0 10px;font-size:14.5px}
.fr-seg button{font-size:20px;min-height:36px;padding:0 10px}
.fr-body{display:flex;align-items:center;gap:16px}
.fr-shape{touch-action:none;overflow:visible}
.fr-shape .part{cursor:pointer;transition:fill .2s}
.fr-val{font-size:clamp(40px,8vh,72px)}
.fr-sign{font-family:var(--fround);font-weight:700;font-size:clamp(44px,8vh,72px);color:var(--ink);background:#fff;border-radius:50%;width:1.5em;height:1.5em;display:grid;place-items:center;box-shadow:var(--shadow);line-height:1}
.fr-sign.eq{background:var(--mint-l);color:var(--mint)}
.fr-note{font-size:22px;font-weight:600;color:var(--mint)}

.ar{display:flex;flex-direction:column;align-items:center;gap:4px;width:100%}
.ar-eq{font-size:clamp(20px,4.4vh,38px);text-align:center;min-height:2.2em}
.ar-eq b{color:var(--ink);background:var(--amber-l);padding:0 .25em;border-radius:.3em}
.ar-words{font-family:var(--font);font-size:.55em;color:var(--ink2);font-weight:500}
.ar-svg{touch-action:none;display:block;user-select:none}
.ar-svg text{pointer-events:none}
.ar-handle{pointer-events:none;filter:drop-shadow(0 2px 4px rgba(0,0,0,.25))}
.splitln{cursor:pointer}

.an{display:flex;flex-direction:column;align-items:center;width:100%;height:100%}
.an-read{text-align:center;min-height:90px;display:flex;flex-direction:column;justify-content:center}
.an-big{font-family:var(--fround);font-size:clamp(36px,7.5vh,60px);font-weight:700;line-height:1.1}
.an-big small{font-size:.42em;font-weight:500;color:var(--ink2)}
.an-type{font-size:clamp(20px,3.8vh,30px);font-weight:700;min-height:1.3em;border-radius:12px;padding:0 10px}
.an-svg{touch-action:none;user-select:none;display:block}
.an-svg text{pointer-events:none}
.an-handle{cursor:grab;filter:drop-shadow(0 3px 5px rgba(232,111,160,.5))}
.an-range{width:min(240px,60vw);accent-color:var(--rose);height:30px}
.an-gv{font-size:22px;font-weight:700;min-width:56px;text-align:center}

.ck{display:flex;flex-direction:column;align-items:center;gap:6px;width:100%;height:100%}
.ck-read{text-align:center}
.ck-dig{font-size:clamp(40px,8.5vh,70px);font-weight:700;line-height:1.05;background:#3A3456;color:#FFE29A;border-radius:18px;padding:2px 22px;display:inline-block;letter-spacing:2px}
.ck-words{font-size:clamp(22px,4vh,34px);font-weight:700;margin-top:4px;min-height:1.3em;border-radius:12px;padding:0 10px}
.ck-svg{flex:1;min-height:0;width:100%;max-width:min(100%,560px);touch-action:none;user-select:none}
.ck-svg text{pointer-events:none}
.hand{cursor:grab}
.hand.anim{transition:transform .4s ease}

@media (min-width:1000px){.groups{display:grid;grid-template-columns:1fr 1fr;column-gap:22px}.groups .group.g2{grid-column:span 2}}

.tf-steps{font-size:clamp(20px,3.6vh,30px);color:var(--ink2)}
@media (max-width:899px),(orientation:portrait){.panel .ptitle{display:none}.panel{gap:7px 8px;padding-top:12px}}

.ar-line{white-space:nowrap;width:calc(100vw - 30px);max-width:100%}
@media (min-width:900px) and (orientation:landscape){.ar-line{width:calc(100vw - 360px)}}
.ar-eq{width:100%}

.nl-eq{width:100%}.nl-line{white-space:nowrap;display:flex;align-items:center;justify-content:center;gap:.15em;width:calc(100vw - 30px);max-width:100%}
@media (min-width:900px) and (orientation:landscape){.nl-line{width:calc(100vw - 360px)}}

/* ===== wave 2 ===== */
.w2svg{direction:ltr}
.mn,.me,.ap,.bl,.mm{display:flex;flex-direction:column;align-items:center;width:100%;height:100%;gap:4px}
.mn-svg,.me-svg,.ap-svg,.bl-svg,.mm-svg{direction:ltr;touch-action:none;user-select:none;-webkit-user-select:none;display:block;flex:none}
.mn-svg text,.me-svg text,.ap-svg text,.bl-svg text,.mm-svg text,.ch-svg text,.qd-svg text{pointer-events:none}
.mn-info,.me-info,.ap-info,.bl-info,.mm-info{flex:none;text-align:center;width:100%;min-height:76px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:2px}
/* money */
.mn-tot{font-family:var(--fround);font-weight:700;font-size:clamp(34px,7vh,58px);line-height:1.05}
.mn-q{display:inline-block;background:var(--lav-l);color:var(--lav);border-radius:12px;padding:0 14px}
.mn-w{font-size:clamp(16px,2.8vh,22px);color:var(--ink2);font-weight:500}
.mn-tag{font-size:clamp(20px,3.8vh,30px);font-weight:700;background:var(--amber-l);border-radius:14px;padding:2px 14px;white-space:nowrap;max-width:100%}
.mn-row{font-size:clamp(17px,3vh,24px);font-weight:500;white-space:nowrap;max-width:100%;display:flex;gap:10px;align-items:center;justify-content:center}
.mn-eq{font-size:1.15em}.mn-eq b{background:var(--lav-l);color:var(--lav);border-radius:8px;padding:0 .25em}
.mn-st{font-weight:700;border-radius:10px;padding:0 8px}.mn-st.ok{background:var(--mint-l);color:#1d7a61}.mn-st.lo{background:var(--sky-l);color:#1f5f93}.mn-st.hi{background:var(--coral-l);color:#a8402f}
.mn-t,.mn-i{cursor:grab}.mn-i{filter:drop-shadow(0 2px 3px rgba(60,40,90,.22))}.mn-ghost{opacity:.85;pointer-events:none;filter:drop-shadow(0 6px 8px rgba(60,40,90,.3))}
.mn-pop{animation:popin .3s ease-out both;transform-box:fill-box;transform-origin:center}
/* measure */
.me-big{font-family:var(--fround);font-weight:700;font-size:clamp(24px,5vh,40px);white-space:nowrap;max-width:100%}
.me-sub{font-size:clamp(17px,3vh,24px);color:var(--ink2);font-weight:600;white-space:nowrap;max-width:100%}
.me-q{font-size:clamp(20px,3.8vh,30px);font-weight:600;color:var(--ink2);white-space:nowrap;max-width:100%}
.me-obj{cursor:grab;filter:drop-shadow(0 3px 4px rgba(60,40,90,.22))}
/* area */
.ap-l{font-size:clamp(19px,3.6vh,30px);font-weight:500;white-space:nowrap;max-width:100%}
.ap-l small{font-size:.6em;color:var(--ink2)}
.ap-a{color:#2F7CC0}.ap-p{color:#E0604E}.ap-hint{color:var(--ink2)}
.ap-task{font-size:clamp(16px,2.8vh,22px);font-weight:600;background:var(--amber-l);border-radius:12px;padding:2px 12px;white-space:nowrap;max-width:100%}
.ap-task.ok{background:var(--mint-l);color:#1d7a61}
/* quads */
.qd{display:flex;flex-direction:row-reverse;width:100%;height:100%;gap:10px;align-items:stretch}
.qd-svg{flex:1;min-width:0;min-height:0;touch-action:none;user-select:none;display:block}
.qd-v{cursor:grab;filter:drop-shadow(0 2px 4px rgba(232,111,160,.5))}
.qd-side{flex:none;width:300px;align-self:center;background:#fff;border-radius:20px;box-shadow:var(--shadow);padding:14px 16px}
.qd-name{font-family:var(--fround);font-weight:700;font-size:clamp(28px,5.5vh,42px);color:#5a3fa8;line-height:1.1}
.qd-name small{font-size:.55em;color:var(--ink2)}.qd-name.bad{font-size:20px;color:#E0604E}
.qd-also{font-size:15px;color:var(--ink2);min-height:1.3em;margin-top:2px}
.qd-props{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:5px;font-size:16.5px}
.qd-props li{border-radius:10px;padding:4px 10px}.qd-props li.y{background:var(--mint-l);color:#1d7a61;font-weight:600}.qd-props li.n{background:#F5F1F8;color:#9a93ad}
.qd-pre .btn{min-height:40px;padding:0 12px}
.qd-sort{width:100%;height:100%;display:flex;flex-direction:column;gap:8px;overflow:auto}
.qd-fh{text-align:center;font-size:17px;color:var(--ink2);min-height:1.5em}
.qd-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;flex:1;min-height:0}
.qd-card{border:3px solid transparent;background:#fff;border-radius:18px;box-shadow:var(--shadow);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:6px;transition:.2s;min-height:0}
.qd-card svg{width:100%;flex:1;min-height:0;max-height:140px}
.qd-card.on{border-color:var(--mint);background:var(--mint-l)}.qd-card.off{opacity:.35}
.qd-cn{font-weight:700;font-size:16px;min-height:1.3em}
.qd-fl{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}.qd-fl .chip{padding:6px 12px;font-size:14.5px}
@media (max-width:899px),(orientation:portrait){.qd{flex-direction:column-reverse;gap:6px}.qd-side{width:100%;padding:8px 12px;display:grid;grid-template-columns:auto 1fr;column-gap:12px;align-items:center}.qd-name{font-size:26px;grid-row:span 2}.qd-props{grid-column:1/-1;flex-direction:row;flex-wrap:wrap;font-size:13.5px;gap:4px;margin-top:4px}.qd-props li{padding:2px 7px}.qd-also{font-size:13.5px}.qd-grid{grid-template-columns:repeat(4,1fr);gap:6px}.qd-cn{font-size:13px}}
/* balance */
.bl-l{font-size:clamp(26px,5.4vh,44px);white-space:nowrap;max-width:100%}
.bl-q{display:inline-block;background:#8E70D8;color:#fff;border-radius:.25em;padding:0 .25em;min-width:1em}
.bl-s{display:inline-block;min-width:1.2em;border-radius:.3em;background:var(--coral-l);color:#a8402f;padding:0 .15em}.bl-s.ok{background:var(--mint-l);color:#1d7a61}
.bl-sub{font-size:clamp(16px,2.8vh,22px);color:var(--ink2);font-weight:600}
.bl-ok{color:#1d7a61}.bl-no{color:#a8402f}
.bl-t,.bl-w,.bl-pan{cursor:pointer}.bl-ghost{pointer-events:none;opacity:.85}
/* charts */
.ch{display:flex;flex-direction:column;width:100%;height:100%;gap:6px}
.ch-title{text-align:center;font-family:var(--fround);font-weight:700;font-size:clamp(20px,3.6vh,28px)}
.ch-q{display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap;background:var(--amber-l);border-radius:14px;padding:4px 12px;font-size:clamp(16px,2.8vh,21px);font-weight:600}
.ch-qa{background:#fff;border-radius:10px;padding:2px 10px;color:#1d7a61}
.ch-body{flex:1;min-height:0;display:flex;gap:12px;align-items:stretch}
.ch-table{flex:none;width:250px;align-self:center;background:#fff;border-radius:18px;box-shadow:var(--shadow);padding:8px 10px;display:flex;flex-direction:column;gap:4px}
.ch-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:2px 2px;border-bottom:1px solid #F1EAF5}
.ch-h{font-size:13.5px;color:var(--ink2);font-weight:600}.ch-tot{border:none;font-weight:700}
.ch-c{display:flex;align-items:center;gap:6px;font-weight:600;font-size:16px}
.ch-ic{width:26px;height:26px;flex:none}
.ch-tv{font-size:19px;font-weight:700;min-width:42px;text-align:center}
.stepper.sm button{width:34px;height:34px;font-size:19px}.stepper.sm .v{min-width:30px;font-size:17px}
.ch-svg{flex:1;min-width:0;min-height:0;touch-action:none;user-select:none;display:block}
.ch-bar{cursor:ns-resize}
@media (max-width:899px),(orientation:portrait){.ch-body{flex-direction:column;gap:6px}.ch-table{width:100%;flex-direction:row;justify-content:space-around;padding:4px;align-self:stretch}.ch-row{flex-direction:column;border:none;gap:2px;padding:0}.ch-h{display:none}.ch-c{flex-direction:column;gap:0;font-size:12.5px;text-align:center}.ch-ic{width:22px;height:22px}.stepper.sm{flex-direction:column;padding:2px}.stepper.sm button{width:32px;height:28px;font-size:17px}.stepper.sm .v{font-size:15px;min-width:0}.ch-tot{justify-content:center}}
/* mean */
.mm-l{font-size:clamp(22px,4.6vh,38px);white-space:nowrap;max-width:100%}
.mm-l b{background:var(--amber-l);border-radius:.3em;padding:0 .25em}
.mm-sub{font-size:clamp(16px,2.8vh,22px);color:var(--ink2);font-weight:600}
.mm-ok{color:#1d7a61}
.mm-top,.mm-col{cursor:grab}.mm-b{cursor:pointer}.mm-ghost{pointer-events:none;opacity:.9;filter:drop-shadow(0 6px 8px rgba(60,40,90,.3))}
.ch-pop{animation:popin .3s ease-out both;transform-box:fill-box;transform-origin:center}

/* ===== polish pass (wave 2) ===== */
body{background:radial-gradient(1200px 600px at 100% -10%,#FFEBDD 0,rgba(255,235,221,0) 60%),radial-gradient(900px 500px at -10% 110%,#E8E0FF 0,rgba(232,224,255,0) 60%),var(--bg);background-attachment:fixed}
.card{background:linear-gradient(180deg,#fff 0%,#FFFCF8 100%);box-shadow:0 10px 24px -8px rgba(80,60,120,.18),0 2px 6px rgba(80,60,120,.06);border:1px solid rgba(234,223,211,.6)}
.card:hover{box-shadow:0 18px 34px -10px rgba(80,60,120,.26),0 3px 8px rgba(80,60,120,.08)}
.card .ic{position:relative;overflow:hidden;box-shadow:inset 0 -6px 12px rgba(0,0,0,.05),inset 0 3px 0 rgba(255,255,255,.7);transition:transform .25s}
.card .ic:before{content:"";position:absolute;inset:0;background:radial-gradient(120% 80% at 30% 0%,rgba(255,255,255,.75),rgba(255,255,255,0) 55%);pointer-events:none}
.card .ic svg{position:relative;filter:drop-shadow(0 3px 3px rgba(60,40,90,.16))}
.card:hover .ic{transform:rotate(-4deg) scale(1.05)}
.card .gr{background:linear-gradient(180deg,#FFF7EE,#FBEFE3)}
.soon .card{background:rgba(255,255,255,.55)}
.hero{background:linear-gradient(135deg,#FFE3CF 0%,#F1E4FF 55%,#D9EEFF 100%)}
.hero:before,.hero:after{content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.35);pointer-events:none}
.hero:before{width:180px;height:180px;top:-60px;inset-inline-start:30%;animation:floaty 9s ease-in-out infinite}
.hero:after{width:110px;height:110px;bottom:-40px;inset-inline-start:8%;animation:floaty 7s ease-in-out infinite reverse}
.hero .art svg{filter:drop-shadow(0 8px 10px rgba(80,60,120,.18));animation:floaty 6s ease-in-out infinite}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.btn{background-image:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,0));box-shadow:inset 0 -3px 0 rgba(0,0,0,.07),0 2px 5px rgba(80,60,120,.08);transition:transform .12s,box-shadow .12s}
.btn:active{transform:translateY(2px) scale(.97);box-shadow:inset 0 -1px 0 rgba(0,0,0,.07)}
.btn.pri{background-image:linear-gradient(180deg,#58507A,#3A3456)}
.seg{box-shadow:inset 0 2px 4px rgba(80,60,120,.07)}
.seg button{transition:background .15s,box-shadow .15s}
.seg button.on{box-shadow:0 3px 8px rgba(80,60,120,.16),inset 0 -2px 0 rgba(0,0,0,.04)}
.stepper button{background-image:linear-gradient(180deg,#fff,#F8F3FB);transition:transform .1s}
.stepper button:active{transform:scale(.9)}
.tgl i{box-shadow:inset 0 2px 3px rgba(0,0,0,.12)}.tgl i:after{box-shadow:0 2px 4px rgba(0,0,0,.18)}
.ibtn{background-image:linear-gradient(180deg,#FFFDFB,#FFF3E8);box-shadow:inset 0 -2px 0 rgba(0,0,0,.05)}
.topbar{background:linear-gradient(180deg,#fff,#FFFCF8)}
.topbar h1 .tic{box-shadow:inset 0 2px 0 rgba(255,255,255,.7),0 2px 6px rgba(80,60,120,.12)}
.panel{background:linear-gradient(180deg,#fff,#FFFCF9)}
.tf-dot{background-image:radial-gradient(circle at 35% 30%,rgba(255,255,255,.55),rgba(255,255,255,0) 45%)}
.tf-dot{animation:popin .32s ease-out both}
.blk-u{background-image:linear-gradient(145deg,rgba(255,255,255,.35),rgba(255,255,255,0) 55%)}
.blk-t i{background-image:linear-gradient(90deg,rgba(255,255,255,.35),rgba(255,255,255,0) 60%)}
.modal .box{background:linear-gradient(180deg,#fff,#FFFBF6)}
.toast{box-shadow:0 10px 24px rgba(40,30,70,.3)}
.frog{filter:drop-shadow(0 4px 4px rgba(46,94,58,.25))}
/* cheer burst */
.cheer{position:fixed;pointer-events:none;z-index:70;width:0;height:0}
.cheer i{position:absolute;width:11px;height:11px;border-radius:3px;left:-5px;top:-5px;animation:burst .9s cubic-bezier(.2,.7,.3,1) forwards}
@keyframes burst{0%{transform:translate(0,0) rotate(0) scale(.6);opacity:1}100%{transform:translate(var(--dx),var(--dy)) rotate(var(--r)) scale(1);opacity:0}}
@media (prefers-reduced-motion:reduce){.hero:before,.hero:after,.hero .art svg{animation:none}.cheer{display:none}}
.mm-l,.bl-l,.ap-l,.ap-task,.me-big,.me-sub,.me-q,.mn-row,.mn-tag{align-self:stretch;text-align:center;overflow:hidden}
.mn-row{justify-content:center}

/* rounding */
.rd{display:flex;flex-direction:column;align-items:center;width:100%;height:100%;justify-content:center;gap:4px}
.rd-head{text-align:center;width:100%}
.rd-l1{font-size:clamp(34px,7vh,60px);display:flex;justify-content:center;align-items:center;gap:.25em;white-space:nowrap;line-height:1.15}
.rd-l1 .rd-ap{color:var(--ink2);font-weight:500}
.rd-l1 b{font-weight:700}.rd-l1 b.up{color:#d9604c}.rd-l1 b.dn{color:#2f86cf}
.rd-l1 .rd-q{display:inline-flex;width:1.3em;height:1.1em;align-items:center;justify-content:center;border-radius:.3em;background:var(--lav-l);color:var(--lav)}
.rd-n i{font-style:normal;display:inline-block;padding:0 .04em}
.rd-n i.rp{color:#2f86cf;border-bottom:.09em solid #4C9FE0;line-height:1}
.rd-n i.dd{background:var(--amber-l);color:#a06d00;border-radius:.22em;box-shadow:inset 0 0 0 .06em #F4B43C;padding:0 .1em;margin:0 .03em}
.rd-l2{font-size:clamp(16px,2.8vh,22px);color:var(--ink);font-weight:500;min-height:1.4em}
.rd-l3{min-height:1.9em;margin-top:2px}
.rd-rule{display:inline-block;background:var(--amber-l);color:#7a5300;border-radius:99px;padding:3px 14px;font-size:clamp(14px,2.3vh,18px)}
.rd-rule b{font-weight:700}
.rd-svg{touch-action:none;display:block;user-select:none;cursor:grab}
.rd-svg text{user-select:none;pointer-events:none;font-family:var(--fround);font-weight:600}
.rd-svg .rd-slope,.rd-svg text.rd-sub[fill]{font-family:var(--font);font-weight:500}
.rd-sub{fill:#3A3456}
.rd-pill rect{fill:#fff;stroke:#4C9FE0;stroke-width:2.5}
.rd-pill text{fill:#3A3456;font-weight:700}
.rd-pill.lo rect{fill:#DCEEFC;stroke:#4C9FE0}.rd-pill.hi rect{fill:#FFE1DA;stroke:#F07A68}
.rd-pill.lead rect{stroke-width:4}
.rd-pill.lo.win rect{fill:#4C9FE0}.rd-pill.hi.win rect{fill:#F07A68}.rd-pill.win text{fill:#fff}
.rd-pill.pick{cursor:pointer}.rd-pill.pick rect{fill:#fff;stroke:#8E70D8;stroke-dasharray:6 5;stroke-width:3}
.rd-pill.pick.sel rect{fill:#8E70D8;stroke-dasharray:none}.rd-pill.pick.sel text{fill:#fff}
.rd-pill.wrong rect{stroke:#8E70D8;stroke-dasharray:6 5;stroke-width:3;fill:#fff}
.rd-pill.mid rect{fill:#FFF0C9;stroke:#F4B43C}.rd-pill.mid text{fill:#8a5d00}
.rd-pill.nb rect{fill:#fff;stroke:#8E70D8;stroke-width:3;filter:drop-shadow(0 3px 4px rgba(80,60,120,.18))}
.rd-pill.nb.fly{transition:opacity .4s}
.rd-pill.pop{transform-box:fill-box;transform-origin:center;animation:popin .5s}
.rd-ball{filter:drop-shadow(0 4px 4px rgba(80,60,120,.22))}
.rd-dist{font-weight:700}
.rd-inp{width:4.4ch;border:none;background:transparent;text-align:center;font-size:24px;font-weight:700;color:var(--ink);padding:0 4px;outline:none}
.rd-step{background:var(--lav-l)}
.rd-fb.ok{color:#1d7a61}.rd-fb.no{color:#8E70D8}

/* ===== middle-school wave ===== */
.ms{width:100%;height:100%;display:flex;flex-direction:column;gap:6px;min-width:0}
.ms-info{flex:none;text-align:center;width:100%;min-height:74px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:3px}
.ms-l{font-size:clamp(24px,4.6vh,38px);font-weight:600;align-self:stretch;text-align:center;overflow:hidden;white-space:nowrap;line-height:1.15}
.ms-l b{color:#2f7fc0}
.ms-sub{font-size:clamp(15px,2.5vh,19px);color:var(--ink2);font-weight:500;line-height:1.4;max-width:46em}
.ms-ok{color:#1d7a61;font-weight:700}.ms-no{color:#8E70D8;font-weight:600}
.ms-svg{flex:1;min-height:0;width:100%;display:block;touch-action:none;user-select:none;-webkit-user-select:none}
.ms-svg text{font-family:var(--fround);font-weight:600;pointer-events:none;user-select:none}
.ms-svg text.he{font-family:var(--font);font-weight:500}
.ms-pane{flex-direction:row}
@media (min-width:900px) and (orientation:landscape){.ms-pane{flex-direction:column;align-items:stretch}.ms-pane>.ctl{justify-content:center}}
.ig-tile{cursor:pointer;transition:transform .4s,opacity .4s}
.ig-tile.ig-gone{transform:scale(0);opacity:0}
.ig-tk{cursor:pointer}
.ms-tag{display:inline-block;background:var(--lav-l);color:#5a3fa8;border-radius:99px;padding:2px 12px;font-size:.9em}
.ms-fade{transition:opacity .35s}

.at-tile{cursor:pointer;transition:transform .45s cubic-bezier(.3,.8,.3,1),opacity .3s}
.at-tile.at-born{animation:atin .35s ease-out}
@keyframes atin{0%{opacity:0}100%{opacity:1}}
.at-tile.at-gone{opacity:0}
.at-fill{animation:atin .3s ease-out both}
.btn.at-add{background:var(--bg);padding:0 8px;min-width:54px}
.at-sw{display:inline-grid;place-items:center;color:#fff;font-family:var(--fround);font-weight:700;border-radius:7px;direction:ltr}
.at-sw.at-p2{width:40px;height:34px;font-size:16px}.at-sw.at-p1{width:22px;height:38px;font-size:15px}.at-sw.at-p0{width:24px;height:24px;font-size:14px}
.eq-it{cursor:pointer}
.ms-sub .big-eq{white-space:nowrap}

.rt-card{flex:1;min-height:0;overflow:auto;background:#fff;border-radius:22px;box-shadow:var(--shadow);padding:12px 14px;display:flex;flex-direction:column;gap:6px;width:100%;max-width:640px;align-self:center}
.rt-head{font-family:var(--fround);font-weight:700;font-size:clamp(19px,3vh,24px);text-align:center;padding:4px 0 6px}
.rt-row{display:grid;grid-template-columns:44px 1fr auto auto;align-items:center;gap:10px;padding:8px 10px;border-radius:14px;background:var(--bg);font-size:clamp(16px,2.6vh,20px);cursor:pointer}
.rt-e{font-size:26px;text-align:center}.rt-n{font-weight:600}
.rt-orig{color:#9a93ad;font-size:.8em}
.rt-v{font-weight:700;color:#1d7a61;min-width:7.5em;text-align:center;border-radius:10px;padding:2px 6px}
.rt-mx{display:inline-flex;align-items:center;gap:2px}.rt-mx .frac{font-size:.72em}
.rt-col{cursor:pointer}.rt-mk{cursor:ew-resize}
.ms-rtl{font-family:var(--fround);font-weight:600}
.co-x{color:#2f7fc0}.co-y{color:#C25543}
.pc-hide .v{color:transparent!important;background:repeating-linear-gradient(45deg,#EFE6F9,#EFE6F9 6px,#F6F0FC 6px,#F6F0FC 12px);border-radius:8px}
.pc-lock{pointer-events:none;opacity:.55}
.ms-rule{font-size:.95em;color:var(--ink)}

/* ---- wave 4 ---- */
.ms-sub .num{white-space:nowrap}
.hs-ans .btn{min-width:52px}
.w-quadratic .ms-sub,.w-system .ms-sub{font-size:clamp(13.5px,2.2vh,17px);line-height:1.45}
.sy-eqs{display:flex;justify-content:center;gap:.9em;flex-wrap:nowrap}
.sy-dot{width:14px;height:14px;border-radius:50%;flex:none;align-self:center}
.w-pythag .ms-info,.w-circle .ms-info,.w-polyarea .ms-info,.w-parallel .ms-info,.w-box .ms-info,.w-powers .ms-info,.w-quadratic .ms-info,.w-system .ms-info,.w-stats .ms-info{-webkit-user-select:none;user-select:none}

/* ---------- game engine ---------- */
.wbody{position:relative}
.ibtn.gbtn{background:var(--lav-l);background-image:linear-gradient(180deg,#F3EEFF,#E6DCFB);color:#5a3fa8}
.ibtn.gbtn .ge{font-size:20px;line-height:1}
.glayer{position:absolute;inset:0;z-index:20;background:var(--bg);overflow:auto;display:flex;justify-content:center;animation:fade .2s}
.gbox{width:100%;max-width:860px;padding:14px 14px 18px;display:flex;flex-direction:column;gap:10px;min-height:100%}
.ghead{display:flex;align-items:center;justify-content:space-between;gap:10px}
.ghead h2{margin:0;font-family:var(--fround);font-size:clamp(22px,4vw,30px)}
.gtot{background:#fff;border-radius:999px;padding:6px 14px;font-weight:700;box-shadow:var(--shadow);font-size:17px}
.gsub{margin:0;color:var(--ink2);font-size:16px;text-align:center}
.ghead+.gsub{text-align:start}
.glevels{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.glv{border:none;background:#fff;border-radius:20px;box-shadow:var(--shadow);padding:14px 10px 12px;display:flex;flex-direction:column;align-items:center;gap:6px;min-height:128px;transition:transform .15s}
.glv:active{transform:scale(.96)}
.glv b{font-family:var(--fround);font-size:21px}
.glv .gld{font-size:14.5px;color:var(--ink2);text-align:center;line-height:1.3;flex:1}
.glv.done{background:linear-gradient(180deg,#fff,#FFF6DD)}
.gstars{display:inline-flex;gap:2px;direction:ltr}
.gstars i{font-style:normal;font-size:24px;color:#E3D9EE;line-height:1}
.gstars i.on{color:#F4B43C;text-shadow:0 2px 4px rgba(200,140,0,.3)}
.gstars.big i{font-size:clamp(54px,12vw,80px)}
.gstars.big i.on{animation:popin .45s ease-out both}.gstars.big i:nth-child(2){animation-delay:.18s}.gstars.big i:nth-child(3){animation-delay:.36s}
.grow{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;align-items:center;margin-top:6px}
.gtop{display:flex;align-items:center;gap:10px;background:#fff;border-radius:18px;padding:6px 10px;box-shadow:var(--shadow)}
.gback{border:none;background:var(--bg);width:38px;height:38px;border-radius:12px;font-size:17px;flex:none}
.glvl{font-family:var(--fround);font-size:17px;white-space:nowrap}
.gdots{flex:1;display:flex;gap:7px;justify-content:center}
.gdots i{width:16px;height:16px;border-radius:50%;background:#E9E1F1;transition:.2s}
.gdots i.now{box-shadow:0 0 0 3px var(--lav-l),inset 0 0 0 3px var(--lav)}
.gdots i.g2{background:var(--mint)}.gdots i.g1{background:var(--amber)}.gdots i.g0{background:#E6A6A0}
.gpts{min-width:40px;text-align:center;background:var(--amber-l);color:#8a5d00;font-weight:700;border-radius:999px;padding:3px 10px;font-size:17px}
.gpts:before{content:"★ ";color:#F4B43C}
.gclock{font-size:15px;color:var(--ink2);font-weight:600}
.gplay{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:#fff;border-radius:24px;box-shadow:var(--shadow);padding:16px 12px}
.gq{font-size:clamp(19px,3.4vw,26px);font-weight:600;text-align:center;line-height:1.35;max-width:100%}
.gq .big{font-size:1.5em;font-family:var(--fround)}
.gvis{display:flex;justify-content:center;align-items:center;max-width:100%;width:100%}
.gsvg{width:100%;max-width:560px;max-height:min(40vh,340px);display:block}
.gvis.wide .gsvg{max-width:760px}
.gvis.tall .gsvg{max-height:min(46vh,380px)}
.gpk,.gtg{cursor:pointer}
svg .gpk:hover{opacity:.85}
.gpk.sel{outline:none}
svg .gpk.sel>*:first-child,svg .gpk.sel{stroke:#3A3456;stroke-width:3.5}
.gpk.right{animation:popin .4s}
svg .gpk.right>*:first-child,svg .gpk.right{stroke:#3DB494;stroke-width:5}
.gopts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;width:100%;max-width:560px}
.gopts.many{grid-template-columns:repeat(3,minmax(0,1fr))}
.gopt{border:2.5px solid var(--line);background:#fff;border-radius:16px;min-height:56px;padding:8px;font-size:clamp(17px,3vw,22px);font-weight:600;display:flex;align-items:center;justify-content:center;gap:6px;line-height:1.25}
.gopt svg{max-width:100%;max-height:110px}
.gopt.sel{border-color:var(--ink);background:var(--lav-l)}
.gopt.right{border-color:var(--mint);background:var(--mint-l)}
.gfields{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap;justify-content:center;padding:4px;border-radius:18px;transition:background .2s}
.gfields.right{background:var(--mint-l)}
.gfield{display:flex;flex-direction:column;align-items:center;gap:4px}
.gfl{font-size:14.5px;color:var(--ink2);font-weight:600}
.gfrow{display:flex;align-items:center;gap:6px}
.gpre,.gpost,.gsep{font-size:24px;font-weight:700;font-family:var(--fround)}
.gsep{padding-bottom:12px}
.gstep .v{min-width:56px;font-size:24px}
.gstep button{width:46px;height:46px}
.gdig{display:inline-flex;align-items:center;gap:5px;background:var(--bg);border-radius:16px;padding:5px}
.gdcol{display:flex;flex-direction:column;align-items:center;gap:3px;background:#fff;border-radius:12px;padding:3px;box-shadow:inset 0 -3px 0 var(--pc)}
.gdcol button{width:44px;height:36px;border:none;border-radius:10px;background:var(--bg);font-size:21px;font-weight:700}
.gdcol button:active{transform:scale(.9)}
.gdv{font-size:28px;font-weight:700;min-height:34px;line-height:34px;color:var(--ink)}
.gsign{width:40px;height:48px;border:none;border-radius:12px;background:#fff;font-size:26px;font-weight:700}
.gdot{font-size:30px;font-weight:700}
.gfb{min-height:30px;font-size:18px;font-weight:600;text-align:center;border-radius:14px;padding:4px 14px}
.gfb.good{background:var(--mint-l);color:#1d7a61}.gfb.try{background:var(--amber-l);color:#8a5d00}.gfb.miss{background:var(--coral-l);color:#a8402f}.gfb.show{background:var(--sky-l);color:#1f5f93}
.gexp{font-size:17px;font-weight:500;margin-top:3px;color:var(--ink)}
.gacts{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.gacts .btn{min-width:130px;min-height:50px;font-size:18px}
.shake{animation:gshake .4s}
@keyframes gshake{20%{transform:translateX(-8px)}40%{transform:translateX(8px)}60%{transform:translateX(-5px)}80%{transform:translateX(5px)}}
.gend{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:#fff;border-radius:24px;box-shadow:var(--shadow);padding:24px 14px}
.gend-t{font-family:var(--fround);font-size:clamp(28px,6vw,42px);font-weight:700}
.gend .btn{min-height:52px;font-size:18px;min-width:140px}
.gconf{position:fixed;inset:0;pointer-events:none;z-index:95;overflow:hidden}
.gconf i{position:absolute;top:-20px;width:10px;height:14px;animation:gfall linear forwards}
@keyframes gfall{to{transform:translateY(110vh) rotate(var(--r))}}
@media (prefers-reduced-motion:reduce){.gconf{display:none}}
.card .gcs{display:inline-block;margin-top:5px;font-size:13px;font-weight:700;background:var(--amber-l);color:#8a5d00;border-radius:999px;padding:2px 9px}
.hset{max-width:1180px;margin:8px auto 0;padding:0 16px;width:100%;display:flex;justify-content:center}
.hset button{border:none;background:transparent;color:var(--ink2);font-size:13.5px;text-decoration:underline;padding:6px}
/* visuals used by the game generators */
.gtf{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;background:#3A3456;padding:6px;border-radius:12px;width:min(92%,360px)}
.gtf>i{aspect-ratio:1;background:#fff;border-radius:7px;display:grid;place-items:center}
.gtf>i.on:after{content:"";width:72%;height:72%;border-radius:50%;background:var(--coral)}
.gtf>i.on.b:after{background:var(--sky)}
.gtf>i.gtg.on:after{background:var(--mint)}
.ghc{display:grid;grid-template-columns:repeat(10,1fr);gap:3px;width:min(100%,460px)}
.ghc>b{aspect-ratio:1;background:#fff;border-radius:6px;box-shadow:0 1px 2px rgba(80,60,120,.15);display:grid;place-items:center;font-size:clamp(11px,2.6vw,17px);font-weight:600;font-family:var(--fround)}
.ghc>b.hid{background:var(--lav-l);color:transparent}
.ghc>b.q{background:var(--amber);color:#fff}
.ghc>b.sel{background:var(--ink);color:#fff}.ghc>b.right{background:var(--mint)!important;color:#fff}
.gac{display:flex;gap:4px;direction:ltr;align-items:flex-start;flex-wrap:wrap;justify-content:center}
.gac span{font-family:var(--fround);font-weight:700;font-size:clamp(30px,8vw,52px);padding:4px 10px;border-radius:12px}
.gpvb{display:flex;gap:12px;align-items:flex-end;direction:ltr;flex-wrap:wrap;justify-content:center}
.gpvb .g{display:flex;gap:3px;flex-wrap:wrap;align-items:flex-end;max-width:180px}
.gcoin{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;max-width:520px}

.gfields.gfrac{flex-direction:column;align-items:center;gap:4px}
.gfrac .gbar{display:block;width:120px;height:4px;border-radius:2px;background:var(--ink)}
.gfrac .gfl{display:none}

@media (max-width:480px){.topbar [aria-label="מסך מלא"]{display:none}.topbar{gap:6px}}

svg .gtg{transition:fill .15s}
svg .gtg.on{fill:#4C9FE0}
svg path.gtg.on{fill:#E86FA0}
.gvis.revealed svg .gtg.on{fill:#3DB494}

/* celebration + motion */
.celeb{position:fixed;inset:0;display:grid;place-items:center;pointer-events:none;z-index:96}
.celeb-card{display:flex;flex-direction:column;align-items:center;gap:2px;background:rgba(255,255,255,.96);border-radius:30px;padding:14px 28px 16px;box-shadow:0 18px 40px rgba(40,30,70,.22);animation:celin .5s cubic-bezier(.2,1.5,.4,1) both;position:relative}
.celeb-frog{width:96px;height:auto;margin-top:-60px;animation:celfrog .7s cubic-bezier(.3,1.6,.5,1) both}
.celeb-ok{position:absolute;top:-14px;inset-inline-end:-14px;width:46px;height:46px;border-radius:50%;background:var(--mint);color:#fff;font-size:28px;font-weight:700;display:grid;place-items:center;box-shadow:0 4px 10px rgba(61,180,148,.4);animation:popin .45s .15s both}
.celeb-t{font-family:var(--fround);font-weight:700;font-size:clamp(26px,6vw,40px);color:#1d7a61}
.celeb.small .celeb-card{padding:8px 20px 10px}.celeb.small .celeb-frog{width:70px;margin-top:-44px}.celeb.small .celeb-t{font-size:26px}.celeb.small .celeb-ok{width:36px;height:36px;font-size:22px}
.celeb.out{animation:celout .35s forwards}
@keyframes celin{from{transform:scale(.4) translateY(40px);opacity:0}}
@keyframes celfrog{0%{transform:translateY(60px) scale(.6);opacity:0}60%{transform:translateY(-14px) scale(1.05);opacity:1}100%{transform:none}}
@keyframes celout{to{opacity:0;transform:scale(.9) translateY(-12px)}}
.gpulse{animation:gpulse .9s ease-out}
@keyframes gpulse{0%{box-shadow:inset 0 0 0 0 rgba(61,180,148,0)}35%{box-shadow:inset 0 0 0 10px rgba(61,180,148,.28)}100%{box-shadow:inset 0 0 0 0 rgba(61,180,148,0)}}
.slidein{animation:gslide .38s cubic-bezier(.2,.9,.3,1)}
@keyframes gslide{from{transform:translateX(-40px);opacity:0}}
.gfly{position:fixed;z-index:97;font-size:34px;color:#F4B43C;margin:-20px 0 0 -14px;pointer-events:none;transition:transform .6s cubic-bezier(.5,-.3,.6,1),opacity .6s;text-shadow:0 2px 6px rgba(200,140,0,.4)}
.gdots i.pop{animation:popin .35s}
.gpts.bump{animation:popin .35s}
.gend{animation:celin .5s cubic-bezier(.2,1.4,.4,1) both}
.gfb{animation:fade .25s}
.gfb.miss{background:var(--lav-l);color:#5a3fa8}
.gdots i.g0{background:#C9BCE8}
@media (prefers-reduced-motion:reduce){.celeb-card,.celeb-frog,.slidein,.gend,.gpulse{animation:none}.gfly{display:none}}

.mn-seller{display:flex;align-items:flex-end;gap:8px;justify-content:center;width:100%;direction:rtl}
.mn-seller img{height:clamp(64px,11vh,120px);width:auto;flex:none;filter:drop-shadow(0 4px 6px rgba(80,60,120,.15))}
.mn-bubble{position:relative;background:#fff;border:2.5px solid var(--amber);border-radius:18px;padding:8px 14px;font-size:clamp(16px,2.6vh,21px);font-weight:600;line-height:1.35;box-shadow:var(--shadow);margin-bottom:18px;max-width:min(70vw,420px)}
.mn-bubble:after{content:"";position:absolute;bottom:10px;right:-11px;width:16px;height:16px;background:#fff;border-right:2.5px solid var(--amber);border-bottom:2.5px solid var(--amber);transform:rotate(-45deg)}
.mn-wallet{filter:drop-shadow(0 -2px 4px rgba(80,60,120,.12))}

.celeb-card{flex-direction:row;gap:12px;padding:14px 26px}
.celeb-ok{position:static;width:64px;height:64px;font-size:40px}
.celeb.small .celeb-ok{width:44px;height:44px;font-size:28px}
.bl-pan.on image{filter:drop-shadow(0 0 7px rgba(244,180,60,.9))}

.stepper.gvert{flex-direction:column;padding:4px;gap:2px}
.stepper.gvert button{width:52px;height:40px}
.stepper.gvert .v{min-height:36px;line-height:36px}
.gfields .gfrow{align-items:center}