.fox-bounce{animation:1.4s ease-in-out infinite fox-bounce}.fox-talk-mouth{transform-box:fill-box;transform-origin:50% 0;animation:.32s ease-in-out infinite alternate fox-talk}@keyframes fox-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes fox-talk{0%{transform:scaleY(.3)}to{transform:scaleY(1)}}@media (prefers-reduced-motion:reduce){.fox-bounce{animation:none}.fox-talk-mouth{animation:none;transform:scaleY(.6)}}.bubble{box-sizing:border-box;color:#3b2f2a;text-align:center;overflow-wrap:anywhere;background:#fff;border:4px solid #3b2f2a;border-radius:1em;max-width:min(84vw,22em);padding:.5em .9em;font-family:inherit;font-size:clamp(20px,3.4vmin,34px);font-weight:800;line-height:1.35;display:inline-block;position:relative}.bubble-tail{pointer-events:none;position:absolute;overflow:visible}.bubble--bottom .bubble-tail{width:30px;height:30px;top:100%;left:1em}.bubble--left .bubble-tail{width:30px;height:30px;top:calc(50% - 15px);right:100%}.bubble--right .bubble-tail{width:30px;height:30px;top:calc(50% - 15px);left:100%}.bg-game{--grass:clamp(36px, 10dvh, 100px);--top:96px;--guide-w:clamp(170px, 28vw, 340px);--fox:clamp(80px, 22vmin, 190px);grid-template-columns:var(--guide-w) minmax(0, 1fr);grid-template-rows:var(--top) minmax(0, 1fr) calc(var(--grass) * .4);padding:0 max(12px, env(safe-area-inset-right)) 0 max(12px, env(safe-area-inset-left));touch-action:manipulation;background:linear-gradient(#bfe7ff,#eaf7ff);column-gap:12px;display:grid;position:fixed;inset:0;overflow:hidden}.bg-scenery{pointer-events:none;position:absolute;inset:0}.bg-cloud{width:clamp(100px,18vw,230px);height:auto;position:absolute}.bg-cloud-1{top:14%;left:20%}.bg-cloud-2{width:clamp(80px,13vw,170px);top:30%;right:6%}.bg-grass{width:100%;height:var(--grass);display:block;position:absolute;bottom:0;left:0}.bg-stars{top:max(14px, env(safe-area-inset-top));right:max(14px, env(safe-area-inset-right));gap:4px;display:flex;position:absolute}.bg-star .icon{width:clamp(36px,7vmin,60px);height:clamp(36px,7vmin,60px);display:block}.bg-star:not(.on){opacity:.3;filter:grayscale()}.bg-star.on{animation:.4s ease-out bg-star-in}@keyframes bg-star-in{0%{transform:scale(.3)}70%{transform:scale(1.3)}to{transform:scale(1)}}.bg-guide{flex-direction:column;grid-area:2/1;place-self:end center;align-items:center;gap:26px;display:flex;position:relative}.bg-bubble{white-space:nowrap;max-width:none;font-size:clamp(22px,4vmin,40px)}.bg-guide-row{align-items:flex-end;gap:8px;display:flex}.bg-fox{width:var(--fox);height:var(--fox);flex-shrink:0}.bg-fox svg{display:block}.bg-speak{background:var(--c-yellow);flex-shrink:0}.bg-field{grid-area:2/2;justify-content:space-evenly;align-items:flex-start;min-height:0;display:flex;position:relative;container-type:size}.bg-slot{--bw:max(110px, min(29cqw, 64cqh, 210px));--bh:calc(var(--bw) * 1.5);width:var(--bw);height:var(--bh);margin-top:calc(var(--stagger) * max(0px, 100cqh - var(--bh)));animation:bg-rise 2.4s cubic-bezier(.2, .7, .3, 1) var(--delay) both;flex-shrink:0;position:relative}.bg-sway{transform-origin:50% 100%;width:100%;height:100%;animation:bg-sway 3.2s ease-in-out var(--sway-delay) infinite alternate}.bg-balloon{cursor:pointer;touch-action:manipulation;-webkit-touch-callout:none;background:0 0;border:0;width:100%;height:100%;padding:0;display:block}.bg-balloon svg{pointer-events:none;width:100%;height:100%;display:block;overflow:visible}.bg-body{fill:var(--bc);transition:fill .25s}.bg-label{text-anchor:middle;fill:#fff;stroke:#3b2f2a;stroke-width:7px;stroke-linejoin:round;paint-order:stroke;font-family:"M PLUS Rounded 1c",Hiragino Maru Gothic ProN,system-ui,sans-serif;font-size:54px;font-weight:800}.bg-balloon.is-wrong{cursor:default;animation:.45s bg-shake}.bg-balloon.is-wrong .bg-body{fill:#cfc8c2}.bg-balloon.is-wrong .bg-label{fill:#eeeae6}.bg-balloon.is-popping{pointer-events:none;animation:.28s ease-in forwards bg-pop}.bg-burst{pointer-events:none;width:0;height:0;position:absolute;top:37%;left:50%}.bg-spark{left:calc(var(--bw) * -.14);top:calc(var(--bw) * -.14);width:calc(var(--bw) * .28);height:calc(var(--bw) * .28);animation:.8s ease-out forwards bg-spark;position:absolute;overflow:visible}@keyframes bg-rise{0%{transform:translateY(110vh)}to{transform:translateY(0)}}@keyframes bg-sway{0%{transform:rotate(-3deg)translate(-4px)}to{transform:rotate(3deg)translate(4px)}}@keyframes bg-shake{0%,to{transform:translate(0)}20%{transform:translate(-10px)rotate(-4deg)}40%{transform:translate(10px)rotate(4deg)}60%{transform:translate(-6px)rotate(-2deg)}80%{transform:translate(6px)rotate(2deg)}}@keyframes bg-pop{0%{opacity:1;transform:scale(1)}45%{opacity:1;transform:scale(1.25)}to{opacity:0;transform:scale(1.5)}}@keyframes bg-spark{0%{transform:rotate(var(--a)) translateY(0) scale(.3);opacity:1}70%{opacity:1}to{transform:rotate(var(--a)) translateY(calc(var(--bw) * -.75)) scale(1);opacity:0}}@media (orientation:portrait){.bg-game{grid-template-columns:minmax(0,1fr);grid-template-rows:var(--top) minmax(0, 1fr) auto calc(var(--grass) * .4);row-gap:8px;padding:0 8px}.bg-field{grid-area:2/1}.bg-guide{grid-area:3/1}}@media (height<=520px){.bg-game{--top:52px}.bg-guide{gap:22px}.bg-bubble{padding:.3em .7em;font-size:20px}}@media (prefers-reduced-motion:reduce){.bg-slot,.bg-sway,.bg-star.on,.bg-balloon.is-wrong{animation:none}.bg-body{transition:none}.bg-balloon.is-popping{opacity:0;animation:none}.bg-spark{transform:rotate(var(--a)) translateY(calc(var(--bw) * -.5));animation:none}}.cp-game{--top:96px;--bottom:max(14px, env(safe-area-inset-bottom));--guide-w:clamp(150px, 20vw, 260px);--fox:clamp(72px, 20vmin, 180px);--gap:clamp(12px, 2.4vw, 28px);grid-template-columns:var(--guide-w) minmax(0, 1fr);grid-template-rows:var(--top) minmax(0, 1fr) var(--bottom);padding:0 max(12px, env(safe-area-inset-right)) 0 max(12px, env(safe-area-inset-left));touch-action:manipulation;background:radial-gradient(circle at 50% 120%,#c8ea9e 0 38%,#0000 38.2%),linear-gradient(#bfe7ff,#eaf7ff 70%);column-gap:12px;display:grid;position:fixed;inset:0;overflow:hidden}.cp-stars{top:max(14px, env(safe-area-inset-top));right:max(14px, env(safe-area-inset-right));gap:4px;display:flex;position:absolute}.cp-star .icon{width:clamp(36px,7vmin,60px);height:clamp(36px,7vmin,60px);display:block}.cp-star:not(.on){opacity:.3;filter:grayscale()}.cp-star.on{animation:.4s ease-out cp-star-in}.cp-guide{flex-direction:column;grid-area:2/1;place-self:end center;align-items:center;gap:26px;min-width:0;display:flex}.cp-bubble{max-width:var(--guide-w);text-wrap:balance;overflow-wrap:normal;word-break:keep-all;font-size:clamp(20px,3.6vmin,36px)}.cp-guide-row{align-items:flex-end;gap:8px;display:flex}.cp-fox{width:var(--fox);height:var(--fox);flex-shrink:0}.cp-fox svg{display:block}.cp-speak{background:var(--c-yellow);flex-shrink:0}.cp-field{gap:var(--gap);grid-area:2/2;grid-template-rows:minmax(0,1fr);grid-template-columns:repeat(2,minmax(0,1fr));min-width:0;min-height:0;display:grid}.cp-tray{--rim:#ffc2d1;border:5px solid var(--c-ink);background:var(--c-cream);min-width:0;min-height:0;box-shadow:inset 0 0 0 clamp(6px, 1.4vmin, 12px) var(--rim), 0 8px 0 #3b2f2a33;color:var(--c-ink);font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;border-radius:clamp(22px,5vmin,44px);padding:clamp(12px,3vmin,28px);transition:transform .1s,filter .25s,opacity .25s,background-color .25s;display:flex;position:relative}.cp-tray-right{--rim:#b5e2ff}.cp-tray:active:not(.is-wrong){transform:translateY(4px)scale(.99)}.cp-items{contain:size;grid-template-columns:repeat(var(--cols), var(--cell));grid-template-rows:repeat(var(--rows), var(--cell));pointer-events:none;flex:1;place-content:center;min-width:0;min-height:0;display:grid}.cp-item{box-sizing:border-box;width:var(--cell);height:var(--cell);padding:calc(var(--cell) * .06);animation:cp-item-in .35s cubic-bezier(.3, 1.5, .5, 1) calc(var(--i) * 50ms) both}.cp-item svg{width:100%;height:100%;display:block}.cp-tray.is-correct{z-index:1;box-shadow:inset 0 0 0 clamp(6px, 1.4vmin, 12px) var(--c-yellow), 0 0 0 6px var(--c-yellow), 0 0 40px 16px #ffd23fcc;background:#fffbe0;animation:.5s ease-out cp-glow}.cp-tray.is-correct .cp-item{animation:cp-hop .5s ease-out calc(var(--i) * 60ms) both}.cp-burst{pointer-events:none;width:0;height:0;position:absolute;top:50%;left:50%}.cp-spark{--s:clamp(28px, 7vmin, 56px);left:calc(var(--s) * -.5);top:calc(var(--s) * -.5);width:var(--s);height:var(--s);animation:.9s ease-out forwards cp-spark;position:absolute;overflow:visible}.cp-tray.is-wrong{cursor:default;filter:grayscale();opacity:.5;animation:.45s cp-shake}@keyframes cp-star-in{0%{transform:scale(.3)}70%{transform:scale(1.3)}to{transform:scale(1)}}@keyframes cp-item-in{0%{transform:scale(0)}to{transform:scale(1)}}@keyframes cp-hop{0%,to{transform:translateY(0)}40%{transform:translateY(-14%)scale(1.08)}}@keyframes cp-glow{0%{transform:scale(1)}50%{transform:scale(1.03)}to{transform:scale(1)}}@keyframes cp-spark{0%{transform:rotate(var(--a)) translateY(0) scale(.3);opacity:1}70%{opacity:1}to{transform:rotate(var(--a)) translateY(calc(var(--s) * -3)) scale(1);opacity:0}}@keyframes cp-shake{0%,to{transform:translate(0)}20%{transform:translate(-12px)rotate(-2deg)}40%{transform:translate(12px)rotate(2deg)}60%{transform:translate(-7px)rotate(-1deg)}80%{transform:translate(7px)rotate(1deg)}}@media (orientation:portrait){.cp-game{grid-template-columns:minmax(0,1fr);grid-template-rows:var(--top) minmax(0, 1fr) auto var(--bottom);padding:0 max(8px, env(safe-area-inset-right)) 0 max(8px, env(safe-area-inset-left));row-gap:12px}.cp-field{grid-area:2/1}.cp-guide{grid-area:3/1}.cp-bubble{white-space:nowrap;max-width:84vw}}@media (height<=520px){.cp-game{--top:52px;--bottom:10px}.cp-guide{gap:22px}.cp-bubble{padding:.3em .7em;font-size:20px}.cp-tray{border-width:4px}}@media (prefers-reduced-motion:reduce){.cp-star.on,.cp-item,.cp-tray.is-correct,.cp-tray.is-correct .cp-item,.cp-tray.is-wrong{animation:none}.cp-tray{transition:none}.cp-spark{transform:rotate(var(--a)) translateY(calc(var(--s) * -2));animation:none}}.ct-game{--grass:clamp(36px, 10dvh, 100px);--top:96px;--guide-w:clamp(170px, 26vw, 320px);--fox:clamp(80px, 20vmin, 180px);--nb:clamp(96px, 15vmin, 140px);grid-template-columns:var(--guide-w) minmax(0, 1fr);grid-template-rows:var(--top) minmax(0, 1fr) auto calc(var(--grass) * .3);padding:0 max(12px, env(safe-area-inset-right)) 0 max(12px, env(safe-area-inset-left));touch-action:manipulation;background:linear-gradient(#bfe7ff,#eaf7ff 60%);gap:10px 12px;display:grid;position:fixed;inset:0;overflow:hidden}.ct-scenery{pointer-events:none;position:absolute;inset:0}.ct-grass{width:100%;height:calc(var(--grass) + var(--nb) * .7);display:block;position:absolute;bottom:0;left:0}.ct-stars{top:max(14px, env(safe-area-inset-top));right:max(14px, env(safe-area-inset-right));gap:4px;display:flex;position:absolute}.ct-star .icon{width:clamp(30px,6.5vmin,56px);height:clamp(30px,6.5vmin,56px);display:block}.ct-star:not(.on){opacity:.3;filter:grayscale()}.ct-star.on{animation:.4s ease-out ct-star-in}@keyframes ct-star-in{0%{transform:scale(.3)}70%{transform:scale(1.3)}to{transform:scale(1)}}.ct-cloth{grid-area:2/2;justify-content:center;align-items:center;min-height:0;display:flex;position:relative;container-type:size}.ct-grid{--gap:clamp(4px, 1.5cqmin, 14px);--pad:clamp(8px, 3cqmin, 26px);--s:min(calc((100cqw - 2 * var(--pad) - (var(--cols) - 1) * var(--gap)) / var(--cols)), calc((100cqh - 2 * var(--pad) - (var(--rows) - 1) * var(--gap)) / var(--rows)), 150px);grid-template-columns:repeat(var(--cols), var(--s));grid-auto-rows:var(--s);gap:var(--gap);padding:var(--pad);box-sizing:border-box;border:4px solid var(--c-ink);background-color:#fff6ec;background-image:linear-gradient(90deg,#ff6b6b40 50%,#0000 50%),linear-gradient(#ff6b6b40 50%,#0000 50%);background-size:48px 48px;border-radius:26px;display:grid;box-shadow:0 6px #3b2f2a33}.ct-obj{width:var(--s);height:var(--s);cursor:pointer;touch-action:manipulation;-webkit-touch-callout:none;animation:ct-in .35s cubic-bezier(.3, 1.4, .5, 1) calc(var(--i) * 60ms) both;background:0 0;border:0;padding:0;position:relative}.ct-hop{pointer-events:none;transform-origin:50% 90%;width:100%;height:100%;display:block}.ct-hop svg{display:block}.ct-hop.hop-a{animation:.4s ease-out ct-hop-a}.ct-hop.hop-b{animation:.4s ease-out ct-hop-b}.ct-badge{--b:max(26px, calc(var(--s) * .36));width:var(--b);height:var(--b);background:var(--c-yellow);border:3px solid var(--c-ink);box-sizing:border-box;font-weight:800;font-size:calc(var(--b) * .58);color:var(--c-ink);pointer-events:none;border-radius:50%;justify-content:center;align-items:center;line-height:1;animation:.3s ease-out ct-badge;display:flex;position:absolute;top:-4px;right:-4px}.ct-choices{grid-area:3/2;justify-content:center;gap:clamp(12px,4vw,40px);display:flex;position:relative}.ct-num{--btn:var(--nb);width:var(--nb);height:var(--nb);font-family:inherit;font-weight:800;font-size:calc(var(--nb) * .6);color:var(--c-ink);-webkit-touch-callout:none;background:#fff;border-radius:28%;line-height:1;transition:background-color .2s,color .2s,transform 80ms}.ct-num.is-wrong{color:#8c847e;cursor:default;background:#cfc8c2;animation:.45s ct-shake}.ct-num.is-right{background:var(--c-green);color:#fff;animation:.4s ease-out ct-right}.ct-guide{flex-direction:column;grid-area:2/1/4;place-self:end center;align-items:center;gap:26px;display:flex;position:relative}.ct-bubble{white-space:nowrap;max-width:none;font-size:clamp(22px,4vmin,40px)}.ct-guide-row{align-items:flex-end;gap:8px;display:flex}.ct-fox{width:var(--fox);height:var(--fox);flex-shrink:0}.ct-fox svg{display:block}.ct-speak{background:var(--c-yellow);flex-shrink:0}@keyframes ct-in{0%{transform:scale(0)}to{transform:scale(1)}}@keyframes ct-hop-a{0%,to{transform:translateY(0)scale(1)}15%{transform:translateY(0)scale(1.08,.9)}50%{transform:translateY(-22%)scale(.96,1.06)}80%{transform:translateY(0)scale(1.05,.95)}}@keyframes ct-hop-b{0%,to{transform:translateY(0)scale(1)}15%{transform:translateY(0)scale(1.08,.9)}50%{transform:translateY(-22%)scale(.96,1.06)}80%{transform:translateY(0)scale(1.05,.95)}}@keyframes ct-badge{0%{transform:scale(0)}70%{transform:scale(1.25)}to{transform:scale(1)}}@keyframes ct-shake{0%,to{transform:translate(0)}20%{transform:translate(-10px)rotate(-4deg)}40%{transform:translate(10px)rotate(4deg)}60%{transform:translate(-6px)rotate(-2deg)}80%{transform:translate(6px)rotate(2deg)}}@keyframes ct-right{0%{transform:scale(1)}50%{transform:scale(1.15)}to{transform:scale(1)}}@media (orientation:portrait){.ct-game{grid-template-columns:minmax(0,1fr);grid-template-rows:var(--top) minmax(0, 1fr) auto auto calc(var(--grass) * .3);--fox:clamp(90px, 26vmin, 210px);padding:0 8px}.ct-cloth{grid-area:2/1}.ct-choices{grid-area:3/1}.ct-guide{grid-area:4/1}.ct-grass{height:calc(var(--grass) + var(--fox) * .5)}}@media (height<=520px){.ct-game{--top:44px;row-gap:6px}.ct-guide{gap:22px}.ct-bubble{padding:.3em .7em;font-size:20px}}@media (prefers-reduced-motion:reduce){.ct-obj,.ct-hop.hop-a,.ct-hop.hop-b,.ct-badge,.ct-star.on,.ct-num.is-wrong,.ct-num.is-right{animation:none}.ct-num{transition:none}}.sp-game{--top:96px;--guide-w:clamp(170px, 28vw, 340px);--fox:clamp(80px, 22vmin, 190px);--star:clamp(26px, 6vmin, 52px);--stars-w:calc(var(--star) * 5 + 40px);grid-template-columns:var(--guide-w) minmax(0, 1fr);padding:max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));touch-action:manipulation;background:linear-gradient(#bfe7ff,#eaf7ff);grid-template-rows:minmax(0,1fr);column-gap:12px;display:grid;position:fixed;inset:0;overflow:hidden}.sp-ground{background:var(--c-leaf);border-top:5px solid var(--c-ink);pointer-events:none;border-radius:50% 50% 0 0/70px 70px 0 0;height:46%;position:absolute;bottom:-6px;left:-10%;right:-10%}.sp-stars{top:max(14px, env(safe-area-inset-top));right:max(14px, env(safe-area-inset-right));z-index:1;gap:4px;display:flex;position:absolute}.sp-star .icon{width:var(--star);height:var(--star);display:block}.sp-star:not(.on){opacity:.3;filter:grayscale()}.sp-star.on{animation:.4s ease-out sp-star-in}.sp-main{grid-area:1/2;grid-template-rows:auto minmax(0,1fr) auto;row-gap:clamp(6px,2cqh,18px);min-height:0;display:grid;position:relative;container-type:size}.sp-top{height:clamp(60px,22cqh,210px);padding-right:var(--stars-w);justify-content:center;min-width:0;display:flex}.sp-total{cursor:pointer;-webkit-touch-callout:none;background:0 0;border:0;justify-content:center;max-width:100%;height:100%;padding:0;animation:.4s ease-out both sp-in;display:flex}.sp-total-art{width:auto;max-width:100%;height:100%;display:block;overflow:visible}.sp-total-num{text-anchor:middle;fill:var(--c-ink);font-family:"M PLUS Rounded 1c",Hiragino Maru Gothic ProN,system-ui,sans-serif;font-size:86px;font-weight:800}.sp-baskets{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(12px,5cqw,64px);min-height:0;animation:.4s ease-out .1s both sp-in;display:grid}.sp-basket{justify-content:center;align-items:flex-end;min-width:0;min-height:0;display:flex}.sp-basket-art{width:100%;max-width:420px;height:100%;display:block;overflow:visible}.sp-cloth{transform-box:view-box;transform-origin:100px 110px;transition:transform .7s cubic-bezier(.3,.7,.3,1),opacity .45s ease-in .35s}.sp-cloth.is-lifted{opacity:0;transform:translate(30px,-120px)rotate(16deg)}.sp-cloth-q{text-anchor:middle;fill:#fff;stroke:var(--c-ink);stroke-width:8px;stroke-linejoin:round;paint-order:stroke;font-family:"M PLUS Rounded 1c",Hiragino Maru Gothic ProN,system-ui,sans-serif;font-size:84px;font-weight:800}.sp-basket-right.is-revealed .sp-pile{transform-box:fill-box;transform-origin:50% 100%;animation:.5s ease-out .35s sp-hop}.sp-answers{justify-content:center;gap:clamp(12px,5cqw,48px);display:flex}.sp-num{--nb:clamp(96px, min(15cqh, 26cqw), 132px);min-width:var(--nb);min-height:var(--nb);width:var(--nb);height:var(--nb);font-family:inherit;font-weight:800;font-size:calc(var(--nb) * .6);-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;border-radius:30%;line-height:1;transition:transform 80ms,background-color .2s,color .2s}.sp-num.is-wrong{color:#9a908a;cursor:default;background:#cfc8c2;animation:.45s sp-shake}.sp-num.is-right{background:var(--c-green);color:#fff;animation:.45s ease-out sp-pop}.sp-guide{flex-direction:column;grid-area:1/1;place-self:end center;align-items:center;gap:26px;max-width:100%;display:flex;position:relative}.sp-bubble{max-width:var(--guide-w);word-break:keep-all;overflow-wrap:normal;font-size:clamp(20px,3.6vmin,38px)}.sp-guide-row{align-items:flex-end;gap:8px;display:flex}.sp-fox{width:var(--fox);height:var(--fox);flex-shrink:0}.sp-fox svg{display:block}.sp-speak{background:var(--c-yellow);flex-shrink:0}@keyframes sp-in{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}@keyframes sp-star-in{0%{transform:scale(.3)}70%{transform:scale(1.3)}to{transform:scale(1)}}@keyframes sp-hop{0%,to{transform:none}40%{transform:translateY(-8px)scale(1.04,.97)}}@keyframes sp-pop{0%{transform:scale(1)}45%{transform:scale(1.18)}to{transform:scale(1)}}@keyframes sp-shake{0%,to{transform:translate(0)}20%{transform:translate(-10px)rotate(-5deg)}40%{transform:translate(10px)rotate(5deg)}60%{transform:translate(-6px)rotate(-2deg)}80%{transform:translate(6px)rotate(2deg)}}@media (orientation:portrait){.sp-game{padding-top:var(--top);padding-left:max(8px, env(safe-area-inset-left));padding-right:max(8px, env(safe-area-inset-right));grid-template-rows:minmax(0,1fr) auto;grid-template-columns:minmax(0,1fr);row-gap:10px}.sp-main{grid-area:1/1}.sp-guide{grid-area:2/1}.sp-top{padding-right:0}.sp-bubble{max-width:100%}.sp-ground{height:52%}}@media (height<=520px){.sp-game{--top:52px}.sp-guide{gap:22px}.sp-bubble{padding:.3em .7em;font-size:20px}}@media (prefers-reduced-motion:reduce){.sp-total,.sp-baskets,.sp-star.on,.sp-num.is-wrong,.sp-num.is-right,.sp-basket-right.is-revealed .sp-pile{animation:none}.sp-num,.sp-cloth{transition:none}}@font-face{font-family:"M PLUS Rounded 1c";font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/mplus-rounded-bold.woff2)format("woff2")}@font-face{font-family:"M PLUS Rounded 1c";font-style:normal;font-weight:800;font-display:swap;src:url(/fonts/mplus-rounded-extrabold.woff2)format("woff2")}:root{--c-ink:#3b2f2a;--c-red:#ff6b6b;--c-orange:#f08a3c;--c-yellow:#ffd23f;--c-green:#5cb85c;--c-leaf:#9bd36a;--c-blue:#4fb0ff;--c-sky:#8fd8f2;--c-purple:#c9a6f0;--c-pink:#ff9fb8;--c-brown:#a0694a;--c-cream:#fff6ec;--btn:84px}body{font-family:"M PLUS Rounded 1c",Hiragino Maru Gothic ProN,system-ui,sans-serif;font-weight:700}.toy-btn{min-width:var(--btn);min-height:var(--btn);border:4px solid var(--c-ink);border-radius:calc(var(--btn) / 2);color:var(--c-ink);cursor:pointer;background:#fff;justify-content:center;align-items:center;padding:0;transition:transform 80ms;display:inline-flex;box-shadow:0 6px #3b2f2a33}.toy-btn:active:not(:disabled){box-shadow:none;transform:translateY(4px)}.toy-btn:disabled{opacity:.4;cursor:default}.toy-btn.primary{background:var(--c-yellow);padding:0 calc(var(--btn) / 2)}.toy-btn .icon{width:calc(var(--btn) * .7);height:calc(var(--btn) * .7);pointer-events:none;flex-shrink:0;display:block}@media (height<=520px){:root{--btn:64px}}@media (prefers-reduced-motion:reduce){.toy-btn{transition:none}}:root{--bg:#fff8e7;--ink:#333;--accent:#ffb84d;--good:#7bc96f;--bad:#ff6b6b;--card:#fff;font-family:Hiragino Maru Gothic ProN,Hiragino Sans,Yu Gothic,system-ui,sans-serif}html,body,button{touch-action:manipulation}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--ink);-webkit-user-select:none;user-select:none;overscroll-behavior:none}.screen{flex-direction:column;justify-content:center;align-items:center;gap:16px;min-height:100dvh;padding:20px;display:flex}.row{flex-wrap:wrap;justify-content:center;align-items:center;gap:16px;display:flex}.icon-btn{min-width:var(--btn);min-height:var(--btn);margin:8px}.parent-corner .icon{pointer-events:none;width:28px;height:28px}.parent-corner{opacity:.35;-webkit-touch-callout:none;touch-action:none;-webkit-user-select:none;user-select:none;background:0 0;border:0;border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;padding:0;display:flex;position:fixed;bottom:12px;right:12px}.big-pic{flex-shrink:0;width:120px;height:120px}.big-pic>svg{width:100%;height:100%;display:block}.glyph-svg{width:min(70dvh,80vw);max-width:420px;height:min(70dvh,80vw);max-height:420px}.glyph-svg,.writing-canvas{background:var(--paper);border-radius:22px}.glyph-svg,.writing-surface{box-shadow:0 0 0 5px var(--c-ink), 0 10px 0 5px #3b2f2a33;border-radius:22px}.writing-surface{aspect-ratio:1;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;flex-shrink:0;width:min(62dvh,86vw);max-width:520px;height:min(62dvh,86vw);max-height:520px}.writing-canvas{touch-action:none;width:100%;height:100%;display:block}.writing-canvas>*{pointer-events:none}.grid-lines line{fill:none;stroke:var(--c-red);stroke-opacity:.55;stroke-width:.9px;stroke-dasharray:3 2.4;stroke-linecap:round}.guide-faint{fill:none;stroke:#ddd;stroke-width:4px;stroke-linecap:round;stroke-linejoin:round}.guide-outline{fill:none;stroke:#ececec;stroke-width:4px;stroke-linecap:round;stroke-linejoin:round}.guide-current{fill:none;stroke:var(--accent);stroke-width:5px;stroke-linecap:round;stroke-linejoin:round;opacity:.8}.start-dot{fill:var(--accent)}.ink{fill:none;stroke:#333;stroke-width:4.5px;stroke-linecap:round;stroke-linejoin:round}.ink.bad{stroke:var(--bad)}.ref-stroke{fill:none;stroke:#2e7d32;stroke-width:4px;stroke-linecap:round;stroke-linejoin:round}.badge circle{fill:var(--bad)}.badge text{fill:#fff;text-anchor:middle;dominant-baseline:central;font-size:7px}.badge-anim{opacity:0;animation:10ms forwards appear}.anim-stroke{fill:none;stroke:#333;stroke-width:4.5px;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1px;visibility:hidden;animation-name:draw,reveal;animation-timing-function:linear;animation-fill-mode:forwards}@keyframes draw{to{stroke-dashoffset:0}}@keyframes reveal{0%,to{visibility:visible}}.anim-stroke.demo-stroke{stroke:#1e88e5;stroke-width:5px;opacity:.9}@keyframes appear{to{opacity:1}}.anim-stroke.answer-stroke{stroke:#1e88e5;stroke-width:5px;opacity:.55}.answer{animation-name:answer-fade;animation-timing-function:ease-out;animation-fill-mode:forwards}@keyframes answer-fade{to{opacity:0}}.trace-screen{touch-action:none}html.lesson-active,html.lesson-active body{overscroll-behavior:none;overflow:hidden}.trace-top{justify-content:center;align-items:center;gap:20px;display:flex}.level-stars{gap:4px;display:flex}.level-star .icon{width:34px;height:34px;display:block}.level-star:not(.on){opacity:.25;filter:grayscale()}.repeat-dots{width:72px;height:20px;display:block}.repeat-dot{fill:#fff;stroke:var(--c-ink);stroke-width:3px}.repeat-dot.filled{fill:var(--c-yellow)}.side-by-side{flex-wrap:wrap;justify-content:center;align-items:center;gap:24px;display:flex}.side-by-side .glyph-svg{flex-shrink:0;width:min(30dvh,22vw);height:min(30dvh,22vw)}.parent{-webkit-user-select:text;user-select:text;justify-content:flex-start;align-items:stretch;max-width:720px;margin:0 auto;font-size:16px}.parent table{border-collapse:collapse;width:100%}.parent th,.parent td{text-align:left;border-bottom:1px solid #e5dcc3;padding:6px 8px}.parent .warn{background:#fff0c2;border-radius:8px;padding:8px 12px}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.parent .error{color:var(--bad)}.parent p{overflow-wrap:anywhere}.parent button{background:var(--accent);cursor:pointer;border:0;border-radius:10px;align-items:center;min-height:44px;padding:0 16px;font-size:16px;display:inline-flex}@media (prefers-reduced-motion:reduce){.anim-stroke{stroke-dashoffset:0;visibility:visible;animation:none}.badge-anim{opacity:1;animation:none}.answer{animation:none}}:root{--paper:#fffaf0}.step-screen{height:100dvh;min-height:0;overflow:hidden}.step-bar{flex-wrap:nowrap;flex-shrink:0;justify-content:center;align-items:center;gap:16px;display:flex}.step-bar .icon-btn{flex-shrink:0}.step-fox{pointer-events:none;flex-shrink:0;width:112px;height:112px}.step-fox>svg{width:100%;height:100%;display:block;overflow:visible}.word-card{background:var(--c-cream);width:min(88vw,520px);min-height:0;color:var(--c-ink);border:5px solid var(--c-ink);border-radius:36px;flex-direction:column;flex:0 auto;justify-content:center;align-items:center;gap:4px;padding:12px 24px 16px;display:flex;box-shadow:0 8px #3b2f2a33}.card-kana{flex-shrink:0;font-size:min(140px,16dvh);font-weight:800;line-height:1}.card-pic{flex:0 auto;width:min(40dvh,70vw,420px);height:min(40dvh,70vw,420px);min-height:48px}.card-pic>svg{width:100%;height:100%;display:block}.card-word{letter-spacing:.08em;flex-shrink:0;font-size:min(48px,6dvh);font-weight:800;line-height:1.2}.card-word .hl{color:var(--c-red)}.card-pics{--pic-box:min(40dvh, 70vw, 420px);--pics-max-w:min(88vw - 48px, 470px);grid-template-columns:repeat(var(--cols), 1fr);width:min(var(--pics-max-w), var(--pic-box) * var(--cols) / var(--rows));flex:0 auto;gap:4px;min-height:0;display:grid}.card-pics-cell{aspect-ratio:1;min-width:0}.card-pics-cell>svg{width:100%;height:100%;display:block}.card-hop{width:100%;height:100%}.card-hop>svg{width:100%;height:100%;display:block}.card-hop.is-hopping{animation:card-hop .5s cubic-bezier(.3, 1.4, .5, 1) var(--hop-delay,0s) both;transform-origin:50% 100%}@keyframes card-hop{0%,to{transform:translateY(0)scale(1)}45%{transform:translateY(-22%)scale(1.08)}}@media (prefers-reduced-motion:reduce){.card-hop.is-hopping{animation:none}}.reward-screen{position:relative}.reward-screen>:not(.confetti){z-index:1;position:relative}.reward-star{flex-shrink:0;width:min(220px,30dvh);height:min(220px,30dvh);animation:.9s cubic-bezier(.2,1.4,.4,1) both star-rise}.reward-star .icon{width:100%;height:100%;display:block}@keyframes star-rise{0%{opacity:0;transform:translateY(50dvh)scale(.3)}40%{opacity:1}to{opacity:1;transform:none}}.reward-cast{flex-shrink:0;align-items:center;gap:min(28px,3vw);display:flex}.reward-fox{flex-shrink:0;width:min(180px,26dvh,30vw);height:min(180px,26dvh,30vw)}.reward-fox>svg{width:100%;height:100%;display:block;overflow:visible}.reward-bubble{white-space:nowrap;font-size:min(48px,9dvh,7.5vw)}.confetti{z-index:0;pointer-events:none;position:absolute;inset:0;overflow:hidden}.confetti-bit{border:3px solid var(--c-ink);border-radius:4px;width:14px;height:22px;animation-name:confetti-fall;animation-timing-function:linear;animation-iteration-count:infinite;position:absolute;top:-40px}.confetti-bit.round{border-radius:50%;width:18px;height:18px}.c-red{background:var(--c-red)}.c-yellow{background:var(--c-yellow)}.c-blue{background:var(--c-blue)}.c-green{background:var(--c-green)}.c-pink{background:var(--c-pink)}.c-purple{background:var(--c-purple)}.c-orange{background:var(--c-orange)}.c-sky{background:var(--c-sky)}@keyframes confetti-fall{0%{transform:translateY(0)rotate(0)}to{transform:translateY(calc(100dvh + 80px))rotate(540deg)}}@media (prefers-reduced-motion:reduce){.reward-star{animation:none}.confetti-bit{top:var(--y);transform:rotate(var(--r));animation:none}}.home-corner{top:max(12px, env(safe-area-inset-top));left:max(12px, env(safe-area-inset-left));--btn:72px;width:var(--btn);height:var(--btn);-webkit-touch-callout:none;touch-action:manipulation;-webkit-user-select:none;user-select:none;background:#ffffffd9;position:fixed}@media (width<=480px) and (height>=521px){html.lesson-active .screen{padding-top:92px}.icon-btn{margin:4px}.row{gap:8px}.trace-screen{position:relative}.trace-screen .trace-top{top:max(12px, env(safe-area-inset-top));height:72px;position:absolute;left:96px;right:96px}.level-star .icon{width:26px;height:26px}.step-screen,.trace-screen{position:relative}.trace-bar .step-fox{top:max(12px, env(safe-area-inset-top));width:72px;height:72px;position:absolute;right:12px}.step-fox{width:96px;height:96px}.card-kana{font-size:min(120px,14dvh)}.trace-screen .side-by-side{gap:12px}}@media (width<=480px) and (height>=521px) and (height<=759px){.step-bar .step-fox{top:max(12px, env(safe-area-inset-top));width:72px;height:72px;position:absolute;right:12px}}@media (height<=520px){.screen{gap:6px;min-height:100dvh;padding:8px}.icon-btn{margin:2px}.big-pic{width:min(120px,18dvh);height:min(120px,18dvh)}.glyph-svg{width:min(100dvh - 90px,80vw);height:min(100dvh - 90px,80vw)}.writing-surface{width:min(100dvh - 60px,86vw);height:min(100dvh - 60px,86vw)}.trace-screen{flex-direction:row;padding-left:84px;position:relative}.trace-screen .row{flex-direction:column}.trace-screen .trace-top{flex-direction:column;gap:8px;width:64px;position:absolute;top:80px;left:6px}.trace-screen .level-stars{flex-direction:column;align-items:center}.trace-screen .step-bar{gap:4px}.level-star .icon{width:18px;height:18px}.level-stars{gap:2px}.listen-screen{flex-direction:row;gap:16px;padding-left:84px}.listen-screen .step-bar{flex-direction:column;gap:4px}.word-card{border-radius:26px;gap:2px;width:auto;padding:6px 18px 8px}.card-kana{font-size:min(140px,25dvh)}.card-pic{width:min(46dvh,40vw);height:min(46dvh,40vw)}.card-pics{--pic-box:min(46dvh, 40vw);--pics-max-w:40vw}.card-word{font-size:min(40px,9dvh)}.step-fox{width:64px;height:64px}.reward-star{width:min(200px,28dvh);height:min(200px,28dvh)}.reward-fox{width:min(160px,26dvh,30vw);height:min(160px,26dvh,30vw)}.trace-screen .repeat-dots{width:54px;height:15px}.side-by-side{flex-wrap:nowrap;gap:12px}.side-by-side .glyph-svg{width:min(30dvh,30vw);height:min(30dvh,30vw)}.home-corner{top:max(6px, env(safe-area-inset-top));left:max(6px, env(safe-area-inset-left));--btn:64px}}.debug-overlay{z-index:1000;pointer-events:none;color:#fff;white-space:nowrap;background:#0009;border-radius:6px;padding:4px 6px;font:11px/1.35 ui-monospace,Menlo,monospace;position:fixed;top:4px;right:4px}.map-screen{background:linear-gradient(#8fd8f2,#5bb8e0);justify-content:center;align-items:center;min-height:100dvh;display:flex}.map-svg{width:100%;height:100dvh;display:block}.map-label{font-family:"M PLUS Rounded 1c",Hiragino Maru Gothic ProN,sans-serif;font-weight:800}.map-island,.path-stop,.path-go{cursor:pointer;-webkit-touch-callout:none;touch-action:manipulation;transform-box:fill-box;transform-origin:50%;outline:none;transition:transform .1s}.map-island:active,.path-stop:not(.locked):active,.path-go:active{transform:scale(.95)}.path-stop.locked{cursor:default}.map-island:focus-visible .map-hit,.path-stop:focus-visible .path-hit,.path-go:focus-visible .path-hit{stroke:#fff;stroke-width:6px;stroke-dasharray:14 10}.island-screen{-webkit-overflow-scrolling:touch;background:#bfe8a2;flex-direction:column;height:100dvh;display:flex;overflow:hidden auto}.path-svg{flex-shrink:0;margin:auto;display:block}.path-pulse{transform-box:fill-box;transform-origin:50%;animation:1.6s ease-in-out infinite path-pulse}@keyframes path-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.06)}}@media (prefers-reduced-motion:reduce){.path-pulse{animation:none}.map-island,.path-stop,.path-go{transition:none}}