:root{font-family:"Trebuchet MS",ui-rounded,system-ui,sans-serif;color:#294246;background:#eaf3ef;font-synthesis:none}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;padding:clamp(10px,3vw,30px);min-height:100vh}
.embedded body{min-height:0}
button,a{font:inherit}
button{cursor:pointer}
button:disabled{cursor:default}
button:focus-visible,a:focus-visible{outline:4px solid #dc873c;outline-offset:3px}
[hidden]{display:none!important}
.app{width:min(100%,1020px);margin:auto;background:#fffaf1;border-radius:28px;overflow:hidden;box-shadow:0 18px 60px #24413d18}
.topbar{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:18px clamp(18px,3vw,32px);border-bottom:1px solid #e7e1d4}
.brand{border:0;background:transparent;color:#30464a;font-size:13px;font-weight:900;letter-spacing:1.5px;padding:8px 0;text-align:left}
.brand-spark{color:#b95b38;font-size:22px;vertical-align:-2px;margin-right:5px}
.stars{font-size:19px;font-weight:900;color:#b96638;white-space:nowrap}
.eyebrow{display:inline-block;color:#49716b;font-size:12px;font-weight:900;letter-spacing:1.5px}
.hero{display:grid;grid-template-columns:1fr .94fr;align-items:center;gap:16px;padding:44px clamp(22px,4vw,52px) 24px}
.hero-copy{position:relative;z-index:1}
h1,h2,p{margin-top:0}
h1{font-size:clamp(42px,6vw,69px);line-height:1.02;letter-spacing:-2px;margin:17px 0 24px;color:#263e42}
h1 em{font-style:normal;color:#b65b3b}
.hero-copy p{max-width:390px;font-size:18px;line-height:1.55;color:#536567;margin-bottom:28px}
.hero-link,.primary-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:#1d6b66;color:#fff;text-decoration:none;border:0;border-radius:15px;min-height:53px;padding:13px 22px;font-size:14px;font-weight:900;box-shadow:0 5px 0 #164f4b}
.hero-link:hover,.primary-button:hover{background:#145955}
.hero-art{position:relative;display:grid;place-items:center;min-width:0;min-height:305px;border-radius:30px;background:radial-gradient(circle at 50% 55%,#fff3db 0 44%,transparent 73%)}
.hero-pip{display:block;width:100%;max-width:440px;max-height:310px;object-fit:contain;mix-blend-mode:multiply}
.math-bubble{position:absolute;z-index:1;display:grid;place-items:center;min-width:80px;min-height:54px;padding:8px 13px;border:2px solid #e6d8b7;border-radius:18px;background:#fffefd;color:#266965;font-size:21px;font-weight:900;box-shadow:0 7px 15px #4e655421}
.bubble-left{top:17px;left:-8px;transform:rotate(-8deg)}
.bubble-right{top:52px;right:-8px;transform:rotate(8deg)}
.section-heading{display:flex;align-items:end;justify-content:space-between;gap:15px;padding:20px clamp(22px,4vw,52px) 12px}
.section-heading h2{font-size:25px;line-height:1.15;margin:8px 0 0}
.section-heading p{color:#62706c;font-size:13px;margin:0 0 3px}
.levels{display:flex;flex-wrap:wrap;gap:9px;padding:5px clamp(22px,4vw,52px) 25px}
.level{border:2px solid #d4e2d8;border-radius:999px;background:#fffefd;color:#395b56;min-height:47px;padding:9px 17px;font-size:13px;font-weight:900;letter-spacing:.5px}
.level.is-selected{background:#1d6b66;color:white;border-color:#1d6b66}
.game-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;padding:0 clamp(18px,4vw,44px)}
.game-card{--card-bg:#e0f2e8;--card-ink:#145f5b;--card-border:#a9d8c8;position:relative;display:flex;flex-direction:column;align-items:stretch;text-align:left;min-height:288px;min-width:0;padding:11px 13px 13px;background:var(--card-bg);border:2px solid var(--card-border);border-radius:22px;color:#324749;transition:transform .15s ease,box-shadow .15s ease}
.game-card:hover{transform:translateY(-3px);box-shadow:0 8px 16px #2f4d4021}
.game-card strong{font-size:18px;line-height:1.15;margin:12px 0 7px}
.game-card>span:not(.card-art):not(.card-number):not(.card-cta){font-size:13px;line-height:1.35;color:#526260}
.game-card .card-cta{display:flex;align-items:center;justify-content:center;min-height:44px;padding:8px 10px;margin-top:auto;border-radius:11px;background:var(--card-ink);color:white;text-align:center;font-size:11px;line-height:1.3;font-weight:900;letter-spacing:.2px}
.card-art{height:92px;border-radius:13px;background:#fffaf2;display:flex;align-items:center;justify-content:center;gap:10px;overflow:hidden}
.card-number{position:absolute;top:19px;left:22px;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--card-ink);color:white;font-size:13px;font-weight:900}
.game-order{--card-bg:#fff0c9;--card-ink:#815810;--card-border:#ebd28d}
.game-line{--card-bg:#fae5d9;--card-ink:#9b4934;--card-border:#e8bda7}
.game-frame{--card-bg:#e7e7fa;--card-ink:#55549b;--card-border:#c4c5e5}
.game-bonds{--card-bg:#e2f0f7;--card-ink:#285e7c;--card-border:#adcede}
.art-apple{position:relative;display:inline-block;color:#dd7953;font-size:39px;line-height:1;filter:drop-shadow(0 3px 0 #a94e36)}
.art-apple:before{content:"";position:absolute;left:51%;top:-2px;width:9px;height:6px;background:#6e9d52;border-radius:10px 0;transform:rotate(-27deg)}
.art-train span{display:grid;place-items:center;width:47px;height:52px;border:3px solid #a87b34;background:#ffe29b;border-radius:12px 12px 8px 8px;color:#674512;font-size:24px;font-weight:900;box-shadow:0 7px 0 -2px #6c7270}
.art-line{gap:0;align-items:flex-end;padding-bottom:26px;position:relative}
.art-line:before{content:"";position:absolute;left:12%;right:12%;bottom:25px;height:4px;background:#c67555}
.art-line span{position:relative;display:grid;place-items:center;width:34px;font-size:14px;font-weight:900;color:#8a513c}
.art-line span:after{content:"";position:absolute;top:100%;height:13px;width:3px;background:#c67555}
.art-line img{position:absolute;z-index:2;top:0;left:28%;width:56px;height:65px;object-fit:contain}
.art-frame{display:grid;grid-template-columns:repeat(5,27px);grid-template-rows:repeat(2,27px);gap:3px;align-content:center}
.art-frame i{border:2px solid #4c93c7;border-radius:6px;background:#fff}
.art-frame i:nth-child(-n+7):after{content:"";display:block;width:16px;height:16px;margin:3px;border-radius:50%;background:#c83b35}
.art-bonds{position:relative;display:block;padding:0}
.art-bonds img{position:absolute;left:12px;top:0;width:79px;height:89px;object-fit:contain}
.art-bonds:before,.art-bonds:after{content:"";position:absolute;z-index:0;top:46px;width:41px;height:2px;background:#5689a0}
.art-bonds:before{right:93px;transform:rotate(-34deg)}
.art-bonds:after{right:45px;transform:rotate(34deg)}
.art-bonds span{position:absolute;z-index:1;display:grid;place-items:center;width:36px;height:36px;border:2px solid #75a6b8;border-radius:50%;background:#e1f3f9;color:#2d6277;font-size:17px;font-weight:900}
.art-bonds span:nth-of-type(1){top:8px;right:72px;background:#f9d999;border-color:#d2a65f;color:#795a22}
.art-bonds span:nth-of-type(2){bottom:5px;right:104px}
.art-bonds span:nth-of-type(3){bottom:5px;right:40px}
.bond-mode-panel{margin:22px clamp(18px,4vw,44px) 0;padding:22px;border:2px solid #bed9e4;border-radius:22px;background:#f3f9fb;box-shadow:0 7px 18px #274f6120}
.bond-mode-head{display:flex;align-items:center;gap:15px;margin-bottom:18px}
.bond-mode-head img{width:74px;height:74px;object-fit:contain;flex:none}
.bond-mode-head h3{margin:4px 0 3px;color:#294b58;font-size:25px;line-height:1.15}
.bond-mode-head p{margin:0;color:#607279;font-size:14px}
.bond-mode-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.bond-mode-button{display:flex;flex-direction:column;align-items:flex-start;gap:5px;min-height:108px;padding:13px 15px;border:2px solid #bad5df;border-radius:16px;background:#fffefd;color:#27566a;text-align:left;box-shadow:0 4px 0 #d5e5ea}
.bond-mode-button:hover,.bond-mode-button:focus-visible{border-color:#3e8298;background:#e9f6fa}
.bond-mode-button strong{font-size:17px}
.bond-mode-button small{font-size:12px;color:#627579}
.mode-sign{display:grid;place-items:center;width:29px;height:29px;border-radius:9px;background:#d7edf2;color:#23677c;font-size:22px;font-weight:900;line-height:1}
.bond-mode-button:nth-child(2) .mode-sign{background:#f8e4cf;color:#a15d3a}
.bond-mode-button:nth-child(3) .mode-sign{background:#e8e4f6;color:#695a9c}
.bond-mode-close{margin-top:14px;padding:8px 2px;border:0;background:transparent;color:#52707a;font-size:13px;font-weight:800}
.bond-mode-close:hover{text-decoration:underline}
.teacher-note{margin:0;padding:28px 24px 32px;text-align:center;color:#6c766d;font-size:13px}
.play-screen{padding:27px clamp(16px,4vw,43px) 28px}
.play-meta{display:flex;justify-content:space-between;gap:12px;font-size:13px;font-weight:900;color:#536564}
.progress-dots{display:flex;gap:8px;margin:15px 0 27px}
.progress-dots i{height:8px;flex:1;border-radius:99px;background:#e7e1d4}
.progress-dots i.is-done{background:#4b9b83}
.progress-dots i.is-current{background:#c47a4f}
.prompt{margin-bottom:21px}
.prompt h2{font-size:clamp(25px,3vw,34px);line-height:1.14;margin:0 0 8px}
.prompt p{font-size:16px;line-height:1.4;color:#60716b;margin:0}
.game-board{min-height:275px;background:#fffefd;border:2px solid #e4e5dc;border-radius:23px;padding:24px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:18px}
.answer-area{min-height:73px;margin-top:18px}
.choice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}
.choice-button{min-height:62px;border:2px solid #d5dfd5;border-radius:16px;background:#fffefd;color:#2e4947;font-size:23px;font-weight:900;box-shadow:0 4px 0 #dce1d8}
.choice-button:hover:not(:disabled){border-color:#2a8176;background:#eff9f2}
.choice-button.is-correct{background:#d9f0e2;border-color:#368a72}
.choice-button.is-clue,.order-tile.is-clue{outline:3px dashed #c27c42;outline-offset:3px}
.action-row{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.action-button{min-height:50px;padding:10px 17px;border:2px solid #96c7b6;background:#e6f5eb;border-radius:12px;color:#245d57;font-size:15px;font-weight:900}
.action-button:hover{background:#d4eddf}
.action-button.primary{border-color:#1d6b66;background:#1d6b66;color:#fff}
.action-button.primary:hover{background:#145955}
.feedback{min-height:48px;margin:12px 0 8px;text-align:center;font-size:17px;font-weight:900;color:#20685e}
.feedback.is-hint{color:#a35b35}
.back-button{border:0;background:transparent;color:#5b716c;font-size:13px;font-weight:800;padding:9px 4px}
.back-button:hover{text-decoration:underline}
.fruit-trays{display:flex;flex-wrap:wrap;justify-content:center;gap:13px;max-width:650px}
.fruit-group{display:grid;grid-template-columns:repeat(5,51px);gap:7px;padding:11px;background:#fff7e8;border:2px dashed #e5d5b8;border-radius:15px}
.fruit-token{position:relative;width:51px;height:51px;padding:4px;border:2px solid transparent;background:transparent;border-radius:12px;transition:transform .12s ease}
.fruit-token svg{width:100%;height:100%}
.fruit-token.is-marked{background:#e3f2e7;border-color:#39977e;transform:scale(.93)}
.fruit-token.is-marked:after{content:"✓";position:absolute;right:1px;top:0;color:#1c715d;font-size:16px;font-weight:900}
.empty-basket{font-size:57px;line-height:1}
.tally-display{padding:6px 16px;border-radius:99px;background:#eaf4ec;color:#315f56;font-size:15px;font-weight:900}
.order-track{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;width:100%}
.order-slot{position:relative;display:grid;place-items:center;min-width:64px;height:74px;border:3px dashed #d0b77e;border-radius:15px;background:#fff8e7;color:#76531e;font-size:29px;font-weight:900}
.order-slot:after{content:"";position:absolute;bottom:-11px;left:7px;width:13px;height:13px;border-radius:50%;background:#716c61;box-shadow:36px 0 #716c61}
.order-slot.is-filled{border-style:solid;border-color:#c89e55;background:#ffe7aa}
.order-tiles{display:flex;justify-content:center;flex-wrap:wrap;gap:9px}
.order-tile{display:grid;place-items:center;min-width:64px;min-height:61px;border:2px solid #c79748;border-radius:13px;background:#ffe29e;color:#694716;font-size:25px;font-weight:900}
.order-tile:disabled{visibility:hidden}
.order-tip{margin:0;color:#6b6c62;font-size:14px;text-align:center}
.numberline-scroll{max-width:100%;width:100%;overflow-x:auto;padding:4px 4px 18px;scrollbar-color:#b8d2c7 #f1f7f3}
.numberline-track{position:relative;display:grid;grid-template-columns:repeat(var(--ticks),minmax(47px,1fr));min-width:calc(var(--ticks) * 47px);padding:95px 0 0}
.numberline-track:before{content:"";position:absolute;left:24px;right:24px;top:105px;height:4px;background:#86b5a8;border-radius:8px}
.hop-arcs{position:absolute;z-index:1;left:0;top:0;width:100%;height:120px;overflow:visible;pointer-events:none}
.hop-arc{fill:none;stroke:#d0b27f;stroke-width:3;stroke-dasharray:6 5;stroke-linecap:round;vector-effect:non-scaling-stroke}
.hop-arc.is-upcoming{opacity:.22}
.hop-arc.is-next{opacity:.62}
.hop-arc.is-done{stroke:#237667;opacity:1}
.frog-marker{position:absolute;z-index:3;top:45px;width:53px;height:59px;object-fit:contain;pointer-events:none;transform:translateX(-50%);transition:left .42s ease;filter:drop-shadow(0 4px 2px #416b4d40)}
.frog-marker.is-hopping{animation:frog-hop .42s ease}
@keyframes frog-hop{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,-26px)}}
.number-tick{position:relative;display:flex;flex-direction:column;align-items:center;gap:10px;min-width:47px;font-size:17px;font-weight:900;color:#62746c}
.number-tick:before{content:"";z-index:1;width:20px;height:20px;border-radius:50%;background:#fff;border:4px solid #86b5a8}
.number-tick.is-visited:before{background:#d7a75b;border-color:#b8793e}
.number-tick.is-current:before{background:#ca6948;border-color:#9a4935;box-shadow:0 0 0 6px #f7dccb}
.number-tick.is-start{color:#9b4934}
.line-equation{font-size:29px;font-weight:900;color:#335e59;text-align:center}
.line-bubble{padding:7px 14px;border-radius:99px;background:#fae7d8;color:#995238;font-size:15px;font-weight:900}
.frame-layout{display:flex;align-items:center;justify-content:center;gap:18px;width:100%}
.frame-target{display:flex;flex:none;flex-direction:column;align-items:center;justify-content:center;width:118px;min-height:135px;padding:12px 8px;border:3px solid #b83232;border-radius:19px;background:#fff1ed;color:#912626;text-align:center;box-shadow:0 5px 0 #f4ccc5}
.frame-target-label{font-size:11px;line-height:1.25;font-weight:900;letter-spacing:.07em}
.frame-target-number{font-size:72px;line-height:1;font-weight:900;font-variant-numeric:tabular-nums}
.ten-frame-wrap{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;min-width:0;max-width:100%}
.ten-frame{display:grid;grid-template-columns:repeat(5,minmax(46px,54px));grid-template-rows:repeat(2,minmax(47px,60px));gap:5px;padding:9px;border:3px solid #2878b9;border-radius:15px;background:#edf6ff}
.ten-frame.is-half{grid-template-rows:repeat(1,minmax(47px,60px))}
.frame-cell{display:grid;place-items:center;min-width:46px;min-height:47px;border:2px solid #4c93c7;border-radius:9px;background:#fff;color:#912626;font-size:25px;font-weight:900}
.frame-cell.is-filled:before{content:"";width:30px;height:30px;border-radius:50%;background:#c83b35;box-shadow:inset 0 -4px 0 #9f2625}
.frame-cell.is-prefilled{background:#fff2ed}
.frame-caption{margin:0;color:#615d85;font-size:15px;font-weight:900;text-align:center}
.bond-diagram{display:flex;flex-direction:column;align-items:center;gap:7px;width:100%}
.bond-bunny{position:relative;display:flex;justify-content:center;align-items:flex-end;width:160px;height:187px}
.bond-bunny img{position:absolute;left:0;top:0;width:160px;height:126px;object-fit:contain}
.bond-circle{position:relative;z-index:1;display:grid;place-items:center;width:88px;height:88px;padding:8px;border:3px solid #8fb3be;border-radius:50%;background:#e6f2f6;color:#245d6f;font-size:34px;font-weight:900;box-shadow:0 4px 0 #d0e1e4}
.bond-bunny .bond-circle{border-color:#d4ac70;background:#fff2d4;color:#795724}
.bond-circle.is-missing{border-style:dashed;background:#fffefd;color:#8b5d42}
.bond-branches{display:block;width:min(100%,320px);height:57px;margin-top:-7px;overflow:visible}
.bond-branches path{fill:none;stroke:#8faeb4;stroke-width:3;stroke-linecap:round}
.bond-parts{display:flex;justify-content:space-between;gap:35px;width:min(100%,320px);margin-top:-9px}
.bond-part-wrap{display:flex;flex-direction:column;align-items:center;gap:5px}
.bond-part-wrap>span{color:#61767a;font-size:11px;font-weight:900;letter-spacing:1px}
.bond-dot-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;width:min(100%,450px);margin-top:15px}
.bond-dot-group{min-height:70px;padding:10px 11px;border:1px solid #dce8e6;border-radius:13px;background:#f4faf6}
.bond-dot-group:nth-child(2){background:#fff8ee;border-color:#eadbcb}
.bond-dot-label{display:block;margin-bottom:7px;color:#54716e;font-size:10px;font-weight:900;letter-spacing:.7px}
.bond-counter-row{display:flex;justify-content:flex-start;flex-wrap:wrap;gap:4px;max-width:100%;min-height:16px}
.counter{width:15px;height:15px;border-radius:50%;background:#6aafbd;box-shadow:inset 0 -3px 0 #4c8490}
.bond-dot-group:nth-child(2) .counter{background:#e8a56f;box-shadow:inset 0 -3px 0 #c5824e}
.bond-equation{margin:11px 0 0;font-size:23px;font-weight:900;color:#405e61;text-align:center}
.finish-screen{text-align:center;min-height:460px;padding:95px 24px 70px}
.finish-art{width:min(100%,250px);margin:0 auto 15px}
.finish-art img{display:block;width:100%;height:auto;mix-blend-mode:multiply}
.finish-screen h2{font-size:38px;margin:10px 0 12px}
.finish-screen p{font-size:17px;line-height:1.5;color:#60716b;max-width:440px;margin:0 auto 25px}
.finish-actions{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:12px}
@media(max-width:760px){.game-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{grid-template-columns:1.1fr .9fr}}
@media(max-width:980px){.frame-layout.is-twenty{flex-direction:column;gap:16px}.frame-layout.is-twenty .frame-target{order:-1}}
@media(max-width:600px){.frame-layout{flex-direction:column;gap:16px}.frame-target{order:-1;flex-direction:row;gap:12px;width:auto;min-height:84px;padding:9px 18px}.frame-target-label{max-width:105px;text-align:left}.frame-target-number{font-size:64px}.ten-frame-wrap{width:100%}}
@media(max-width:560px){body{padding:0;background:#fffaf1}.app{border-radius:0;box-shadow:none}.topbar{padding:12px 17px}.brand{font-size:11px;letter-spacing:1px}.hero{display:flex;flex-direction:column;padding:29px 21px 20px;text-align:center;gap:7px}.hero-copy p{font-size:15px;margin:0 auto 20px}.hero-art{width:min(90%,310px)}.hero-art svg{max-height:205px}.section-heading{display:block;text-align:center;padding:10px 20px}.section-heading h2{font-size:21px}.section-heading p{margin-top:8px}.levels{justify-content:center;padding:8px 14px 20px}.level{font-size:11px;padding:8px 12px}.game-grid{grid-template-columns:1fr;padding:0 16px;gap:10px}.game-card{min-height:130px;padding:12px 12px 12px 117px}.game-card .card-art{position:absolute;top:11px;left:10px;width:94px;height:91px}.game-card .card-number{left:14px;top:14px;width:21px;height:21px;font-size:11px}.game-card strong{font-size:17px;margin:3px 0 4px}.game-card .card-cta{margin-top:9px;font-size:10px;min-height:36px}.art-apple{font-size:18px}.art-train span{width:23px;height:32px;font-size:15px}.art-line span{width:16px;font-size:10px}.art-frame{grid-template-columns:repeat(5,14px);grid-template-rows:repeat(2,14px);gap:2px}.art-frame i{border-width:1px;border-radius:3px}.art-frame i:nth-child(-n+7):after{width:8px;height:8px;margin:2px}.art-bonds{gap:17px}.art-bonds span{width:25px;height:25px;font-size:13px;border-width:2px}.art-bonds:before{top:19px;height:20px;border-width:2px}.play-screen{padding:20px 15px}.prompt h2{font-size:23px}.prompt p{font-size:14px}.game-board{padding:14px;min-height:250px}.fruit-trays{gap:7px}.fruit-group{grid-template-columns:repeat(5,42px);gap:2px;padding:6px}.fruit-token{width:42px;height:42px}.order-slot,.order-tile{min-width:49px}.order-slot{height:61px}.order-slot:after{box-shadow:22px 0 #716c61}.choice-button{min-height:56px}.ten-frame{grid-template-columns:repeat(5,minmax(42px,1fr));grid-template-rows:repeat(2,45px);width:min(100%,270px)}.frame-cell{min-width:0;min-height:45px}.bond-whole{min-width:81px;min-height:81px;font-size:30px}.bond-part{min-width:70px;min-height:70px;font-size:27px}.bond-parts{gap:40px}}
@media(max-width:560px){.fruit-group{grid-template-columns:repeat(5,44px)}.fruit-token{width:44px;height:44px}.ten-frame{grid-template-columns:repeat(5,minmax(44px,1fr));grid-template-rows:repeat(2,44px)}.frame-cell{min-height:44px}}
@media(max-width:560px){.hero-art{min-height:225px}.hero-pip{max-height:220px}.math-bubble{min-width:56px;min-height:39px;padding:5px 8px;font-size:15px;border-radius:12px}.bubble-left{left:0;top:5px}.bubble-right{right:0;top:24px}.art-line img{top:4px;left:24%;width:35px;height:43px}.art-bonds img{left:1px;top:8px;width:48px;height:72px}.art-bonds span{width:22px;height:22px;font-size:11px;border-width:1px}.art-bonds span:nth-of-type(1){right:16px;top:10px}.art-bonds span:nth-of-type(2){right:39px;bottom:9px}.art-bonds span:nth-of-type(3){right:3px;bottom:9px}.art-bonds:before,.art-bonds:after{top:49px;width:20px;height:1px}.art-bonds:before{right:36px}.art-bonds:after{right:13px}.frog-marker{top:52px;width:44px;height:52px}.bond-bunny{width:130px;height:155px}.bond-bunny img{width:130px;height:105px}.bond-bunny .bond-circle{width:75px;height:75px;font-size:28px}.bond-branches{height:48px}.bond-parts{width:min(100%,260px)}.bond-parts .bond-circle{width:72px;height:72px;font-size:27px}.bond-dot-groups{grid-template-columns:1fr;width:min(100%,270px)}}
@media(max-width:560px){.bond-branches{width:min(100%,260px)}}
@media(max-width:560px){.bond-mode-panel{margin:14px 16px 0;padding:16px}.bond-mode-head{gap:9px}.bond-mode-head img{width:54px;height:62px}.bond-mode-head h3{font-size:21px}.bond-mode-head p{font-size:12px}.bond-mode-grid{grid-template-columns:1fr}.bond-mode-button{display:grid;grid-template-columns:36px 1fr;grid-template-rows:auto auto;align-items:center;column-gap:9px;row-gap:0;min-height:64px;padding:9px 12px}.mode-sign{grid-row:1/3}.bond-mode-button strong{font-size:15px}.bond-mode-button small{font-size:11px}}
@media(max-width:560px){.ten-frame{grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:repeat(2,50px);width:min(100%,300px)}.ten-frame.is-half{grid-template-rows:repeat(1,50px)}.frame-cell{min-height:50px}}
@media(max-width:350px){.fruit-group{grid-template-columns:repeat(5,37px)}.fruit-token{width:37px;height:37px}.ten-frame{grid-template-columns:repeat(5,minmax(37px,1fr));grid-template-rows:repeat(2,40px)}.frame-cell{min-height:40px}.order-slot,.order-tile{min-width:45px}}
@media(max-width:350px){.ten-frame{grid-template-columns:repeat(5,minmax(0,1fr))}.ten-frame.is-half{grid-template-rows:repeat(1,40px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}