:root{--ink:#26334f;--ink-soft:#43506d;--cream:#fff5d9;--cream-hi:#fffdf2;--gold:#ffc842;--gold-dark:#b96e16;--blue:#3478f6;--blue-dark:#2251b8;--green:#56c95f;--green-dark:#238848;--coral:#f05c57;--shadow:#26334f38}*{box-sizing:border-box;margin:0;padding:0}html,body{background:#75c8f8;width:100%;height:100%;overflow:hidden}body{touch-action:none;overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;color:var(--ink);font-family:Arial Rounded MT Bold,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Arial,sans-serif;font-weight:800;position:fixed;inset:0}#app,#app canvas{touch-action:none;width:100%;height:100%;display:block;position:fixed;inset:0}#ui{z-index:10;pointer-events:none;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);position:fixed;inset:0}#hud{transition:opacity .25s,transform .25s;position:absolute;inset:0}body[data-screen=start] #hud,body[data-screen=over] #hud,body[data-screen=win] #hud{opacity:0;transform:translateY(-10px)}.hud-chip{background:linear-gradient(180deg, var(--cream-hi), var(--cream));border:clamp(2px, .7vw, 3px) solid var(--ink);box-shadow:0 clamp(4px,1.1vw,6px) #26334f38,0 clamp(8px,2vw,14px) clamp(18px,4vw,28px) #26334f26,inset 0 2px #ffffffe6}#coin-wrap{left:max(16px,4vw);top:max(calc(env(safe-area-inset-top) + 14px), 4.8vh);transform-origin:25%;border-radius:18px;align-items:center;min-width:clamp(96px,25vw,124px);height:clamp(42px,11vw,52px);padding:0 clamp(12px,3vw,16px) 0 clamp(43px,10vw,51px);display:flex;position:absolute}#coin-wrap.bump{animation:.35s cubic-bezier(.2,1.4,.45,1) coinBump}#coin-icon{filter:drop-shadow(0 5px 4px #7b480d33);width:clamp(50px,13vw,62px);height:clamp(50px,13vw,62px);position:absolute;left:clamp(-8px,-1.6vw,-4px);transform:rotate(-8deg)}#coin-pill{min-width:42px;color:var(--ink);letter-spacing:-.03em;text-shadow:0 2px #fff;align-items:center;font-size:clamp(20px,5.2vw,26px);line-height:1;display:flex}#progress-stack{top:max(calc(env(safe-area-inset-top) + 15px), 4.9vh);flex-direction:column;align-items:center;gap:clamp(5px,1.2vw,7px);width:clamp(156px,39vw,198px);display:flex;position:absolute;left:50%;transform:translate(-50%)}#progress{border:clamp(2px, .55vw, 3px) solid var(--ink);background:#dce4e9;border-radius:999px;width:100%;height:clamp(15px,3.8vw,19px);padding:3px;position:relative;overflow:hidden;box-shadow:0 3px #26334f33,inset 0 3px 4px #26334f2e}#progress-fill{background:linear-gradient(90deg,#5adf6d 0%,#8be765 48%,#ffd95a 100%);border-radius:999px;width:0%;height:100%;transition:width .23s cubic-bezier(.2,.8,.3,1);position:relative;overflow:hidden;box-shadow:inset 0 2px #ffffffa6,0 0 8px #5bd36566}#progress-fill:after{content:"";background:linear-gradient(110deg,#0000 25%,#ffffffa6 50%,#0000 72%);animation:2.2s ease-in-out infinite progressSheen;position:absolute;inset:0;transform:translate(-110%)}.progress-pin{z-index:3;background:#26334f73;border-radius:50%;width:4px;height:4px;position:absolute;top:50%;transform:translate(-50%,-50%)}.pin-25{left:25%}.pin-50{left:50%}.pin-75{left:75%}#lives{right:max(15px,4vw);top:max(calc(env(safe-area-inset-top) + 14px), 4.8vh);border-radius:18px;align-items:center;gap:clamp(2px,.6vw,4px);height:clamp(42px,11vw,52px);padding:0 clamp(7px,1.7vw,10px);display:flex;position:absolute}#lives img{filter:drop-shadow(0 3px 2px #18549638);width:clamp(27px,7vw,34px);height:clamp(27px,7vw,34px);transition:transform .25s cubic-bezier(.2,1.4,.4,1),opacity .25s,filter .25s}#lives img.off{opacity:.28;filter:grayscale(.7);transform:scale(.78)}#combo-chip{right:max(18px,4.6vw);top:max(calc(env(safe-area-inset-top) + 78px), 13vh);border:3px solid var(--ink);color:#fff;background:linear-gradient(180deg, #ff9362, var(--coral));text-shadow:0 2px #7f222e8c;transform-origin:100%;border-radius:16px;align-items:baseline;gap:7px;padding:7px 13px 8px;animation:.28s cubic-bezier(.2,1.45,.45,1) comboPop;display:flex;position:absolute;box-shadow:0 5px #a9323f,0 10px 22px #842d3938,inset 0 2px #fff6}#combo-chip.hidden{display:none}.combo-small{letter-spacing:.05em;font-size:clamp(11px,2.8vw,13px)}#combo-num{font-size:clamp(22px,5.5vw,28px);line-height:.9}#input-hint{left:50%;bottom:max(calc(env(safe-area-inset-bottom) + 20px), 3.6vh);border:3px solid var(--ink);width:max-content;max-width:88vw;color:var(--ink);background:#fff9e0f0;border-radius:18px;align-items:center;gap:10px;padding:10px 16px 10px 11px;font-size:clamp(13px,3.4vw,16px);transition:opacity .28s,transform .28s;display:flex;position:absolute;transform:translate(-50%);box-shadow:0 5px #26334f33,0 12px 28px #26334f2b,inset 0 2px #fffffff2}#input-hint b{color:var(--blue-dark)}body[data-screen=start] #input-hint,body[data-screen=over] #input-hint,body[data-screen=win] #input-hint,#input-hint.dismissed{opacity:0;transform:translate(-50%,12px)}.finger-icon{border:2px solid var(--ink);background:#dff3ff;border-radius:50%;flex:0 0 32px;width:32px;height:32px;position:relative}.finger-icon:before,.finger-icon:after{content:"";border:2px solid #3478f673;border-radius:50%;animation:1.45s ease-out infinite tapPulse;position:absolute;inset:5px}.finger-icon:after{animation-delay:.28s;inset:1px}.finger-icon i{border:2px solid var(--ink);z-index:2;background:#fff;border-radius:6px 6px 4px 4px;width:6px;height:14px;position:absolute;top:9px;left:13px}#toast{border:3px solid var(--ink);color:#fff;text-align:center;text-shadow:0 2px #7c460d6b;background:linear-gradient(#ffdf63,#f6a638);border-radius:18px;min-width:190px;padding:11px 18px;font-size:clamp(20px,5vw,26px);animation:.95s cubic-bezier(.2,1.2,.35,1) forwards toastPop;position:absolute;top:22%;left:50%;transform:translate(-50%);box-shadow:0 6px #b96e16,0 14px 30px #6b431133,inset 0 2px #ffffff80}#toast.hidden{display:none}#floats{position:absolute;inset:0;overflow:hidden}.float{z-index:20;white-space:nowrap;-webkit-text-stroke:2px var(--ink);paint-order:stroke fill;filter:drop-shadow(0 5px #26334f2e);font-weight:900;position:absolute}.float.plus{color:#ffe46f;font-size:clamp(28px,8vw,42px);animation:1.05s cubic-bezier(.15,.8,.3,1) forwards floatReward}.float.crit{color:#fff;font-size:clamp(34px,9.5vw,50px);animation:1.15s cubic-bezier(.15,.9,.28,1) forwards floatCrit}#hit-flash{opacity:0;mix-blend-mode:screen;background:radial-gradient(circle at 66% 48%,#ffffffd6,#f05c5759 28%,#f05c5700 68%);position:absolute;inset:0}#hit-flash.flash{animation:.38s ease-out hitFlash}#ui.pressed:after{content:"";left:50%;bottom:max(calc(env(safe-area-inset-bottom) + 8px), 1vh);background:#ffffffad;border-radius:999px;width:44vw;max-width:210px;height:7px;animation:.42s ease-in-out infinite alternate pressGlow;position:absolute;transform:translate(-50%);box-shadow:0 0 12px #ffffffb3}.screen{pointer-events:auto;flex-direction:column;align-items:center;display:flex;position:absolute;inset:0}.screen.hidden{display:none}#screen-start{padding:max(calc(env(safe-area-inset-top) + 26px), 5vh) 20px max(calc(env(safe-area-inset-bottom) + 20px), 3vh)}.brand-kicker{color:#fff;letter-spacing:.18em;text-shadow:0 1px #183d828c;background:#3478f6eb;border:2px solid #26334feb;border-radius:999px;padding:6px 15px 5px;font-size:clamp(10px,2.7vw,13px);animation:.55s cubic-bezier(.2,1.25,.4,1) both titleDrop;box-shadow:0 4px #2251b8e6,0 9px 20px #26334f26}.logo-wrap{text-align:center;filter:drop-shadow(0 12px 8px #22427030);width:min(86vw,420px);margin-top:clamp(10px,2.8vh,22px);animation:.62s cubic-bezier(.18,1.25,.35,1) 50ms both logoIn;position:relative;transform:rotate(-2deg)}.logo-line{z-index:2;letter-spacing:.02em;-webkit-text-stroke:clamp(3px, .9vw, 5px) var(--ink);paint-order:stroke fill;text-shadow:0 clamp(7px, 1.9vw, 10px) 0 #2251b8f2, 0 clamp(12px, 3vw, 18px) clamp(18px, 4vw, 26px) #26334f33, inset 0 2px 0 #fff;line-height:.86;display:block;position:relative}.logo-top{color:#fff8d0;font-size:clamp(42px,11.5vw,66px);transform:translate(-3.5%)}.logo-bottom{color:#5acbff;text-shadow:0 clamp(7px,1.9vw,10px) #2251b8,0 clamp(12px,3vw,18px) clamp(18px,4vw,26px) #26334f38;font-size:clamp(48px,13vw,76px);transform:translate(3%)rotate(1deg)}.logo-star{z-index:4;color:var(--gold);-webkit-text-stroke:2px var(--ink);paint-order:stroke fill;text-shadow:0 4px 0 var(--gold-dark);animation:1.3s ease-in-out infinite alternate starTwinkle;position:absolute}.star-a{font-size:clamp(24px,7vw,34px);top:48%;left:4%;transform:rotate(-18deg)}.star-b{font-size:clamp(18px,5vw,26px);animation-delay:.32s;top:12%;right:3%}.start-spacer{flex:1;min-height:22vh}.action-card{border:clamp(3px, .85vw, 4px) solid var(--ink);background:linear-gradient(#fffdf1f7,#fff3d2fa);border-radius:clamp(24px,6vw,30px);width:min(91vw,430px);padding:clamp(14px,4vw,20px);animation:.6s cubic-bezier(.2,1.2,.35,1) .12s both cardUp;box-shadow:0 clamp(8px,2.2vw,11px) #26334f38,0 22px 44px #26334f33,inset 0 3px #ffffffeb}.howto-row{align-items:center;gap:13px;padding:2px 5px 13px;display:flex}.howto-icon{border:3px solid var(--ink);background:linear-gradient(#dcf5ff,#a8e2ff);border-radius:18px;flex:0 0 clamp(48px,13vw,58px);width:clamp(48px,13vw,58px);height:clamp(48px,13vw,58px);position:relative;box-shadow:0 4px #2251b83d,inset 0 2px #fff}.howto-icon:before,.howto-icon:after{content:"";border:3px solid #3478f68c;border-radius:50%;animation:1.45s ease-out infinite tapPulse;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.howto-icon:before{width:19px;height:19px}.howto-icon:after{width:35px;height:35px;animation-delay:.28s}.howto-icon span{z-index:2;border:3px solid var(--ink);background:#fff;border-radius:7px 7px 4px 4px;width:8px;height:24px;position:absolute;top:50%;left:50%;transform:translate(-50%,-28%)}.howto-copy{flex-direction:column;gap:4px;min-width:0;display:flex}.howto-copy strong{color:var(--ink);font-size:clamp(15px,4vw,19px);line-height:1.2}.howto-copy span{color:var(--ink-soft);font-size:clamp(12px,3.1vw,15px);line-height:1.25}.btn{border:clamp(3px, .85vw, 4px) solid var(--ink);color:#fff;width:100%;min-height:clamp(60px,15vw,72px);font:inherit;letter-spacing:.03em;text-shadow:0 3px #17673685;cursor:pointer;border-radius:clamp(19px,5vw,24px);justify-content:center;align-items:center;gap:14px;padding:0 clamp(24px,7vw,36px);font-size:clamp(22px,5.8vw,29px);font-weight:900;transition:transform 80ms,box-shadow 80ms,filter 80ms;display:flex;position:relative}.btn span{transform:translateY(-1px)}.btn b{font-size:1.45em;line-height:1;position:absolute;top:50%;right:clamp(19px,5vw,26px);transform:translateY(-55%)}.btn-primary{background:linear-gradient(180deg, #7ee76e 0%, var(--green) 58%, #39aa54 100%);box-shadow:0 clamp(7px, 1.8vw, 9px) 0 var(--green-dark), 0 16px 28px #2388483b, inset 0 3px 0 #ffffff7a}.btn:active{box-shadow:0 2px 0 var(--green-dark), 0 8px 16px #23884833, inset 0 2px 0 #ffffff59;filter:saturate(.95);transform:translateY(clamp(5px,1.3vw,7px))}#screen-over,#screen-win{padding:18px 18px max(calc(env(safe-area-inset-bottom) + 26px), 4vh);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:linear-gradient(#2e5c8a14,#26334f47);justify-content:flex-end}.result-card{border:clamp(3px, .85vw, 4px) solid var(--ink);background:linear-gradient(180deg, var(--cream-hi), var(--cream));text-align:center;border-radius:clamp(28px,7vw,34px);width:min(91vw,420px);padding:clamp(56px,13vw,68px) clamp(20px,5vw,28px) clamp(22px,5vw,28px);animation:.58s cubic-bezier(.2,1.22,.35,1) both resultUp;position:relative;box-shadow:0 clamp(10px,2.5vw,13px) #26334f40,0 24px 50px #26334f4d,inset 0 3px #ffffffe6}.result-icon{border:4px solid var(--ink);color:#fff;text-shadow:0 4px #712d3259;border-radius:34%;justify-content:center;align-items:center;width:clamp(92px,24vw,116px);height:clamp(92px,24vw,116px);font-size:clamp(48px,13vw,64px);line-height:1;display:flex;position:absolute;top:0;left:50%;transform:translate(-50%,-50%)rotate(-5deg);box-shadow:0 8px #26334f38,0 18px 30px #26334f38,inset 0 3px #fff6}.result-over .result-icon{background:linear-gradient(180deg, #ff8c7e, var(--coral))}.result-win .result-icon{color:#fff8c7;text-shadow:0 4px #9a570f6b;background:linear-gradient(#ffdf63,#f5a436)}.result-kicker{color:var(--blue-dark);letter-spacing:.12em;font-size:clamp(13px,3.3vw,16px)}.result-card .title{color:var(--ink);letter-spacing:-.03em;margin-top:5px;font-size:clamp(30px,8vw,42px);line-height:1.05}.result-card .subtitle{color:var(--ink-soft);margin:13px auto 20px;font-size:clamp(16px,4.2vw,20px)}.reward-line{background:#fff8df;border:2px solid #26334f59;border-radius:999px;justify-content:center;align-items:center;gap:8px;width:max-content;max-width:100%;padding:7px 15px 7px 9px;display:flex}.coin-mini{width:clamp(34px,9vw,42px);height:clamp(34px,9vw,42px)}.win-stars{justify-content:center;gap:clamp(6px,1.6vw,10px);margin:clamp(2px,.6vh,6px) 0 6px;display:flex}.win-star{opacity:0;width:clamp(46px,12vw,58px);height:clamp(46px,12vw,58px)}.win-star.on{filter:drop-shadow(0 4px 3px #9a570f59);animation:starPop .5s var(--d,0s) cubic-bezier(.2, 1.5, .4, 1) both}.win-star.dim{filter:grayscale(.4);animation:starDimIn .4s var(--d,0s) ease-out both}.stats-grid{background:#fff8dfbf;border:2px solid #26334f4d;border-radius:18px;justify-content:center;margin:12px auto 18px;padding:9px 6px;display:flex}.stat{flex-direction:column;gap:3px;padding:0 clamp(12px,3.4vw,20px);display:flex}.stat+.stat{border-left:2px solid #26334f29}.stat-label{color:var(--ink-soft);letter-spacing:.06em;text-transform:uppercase;font-size:clamp(10px,2.7vw,12px)}.stat-value{color:var(--ink);letter-spacing:-.02em;font-size:clamp(18px,5vw,24px)}@keyframes coinBump{0%{transform:scale(1)rotate(0)}42%{transform:scale(1.14)rotate(-3deg)}to{transform:scale(1)rotate(0)}}@keyframes progressSheen{0%,35%{transform:translate(-110%)}75%,to{transform:translate(110%)}}@keyframes comboPop{0%{opacity:0;transform:translate(18px)scale(.65)}70%{opacity:1;transform:translate(0)scale(1.08)}to{opacity:1;transform:translate(0)scale(1)}}@keyframes tapPulse{0%{opacity:.72;transform:translate(-50%,-50%)scale(.45)}75%,to{opacity:0;transform:translate(-50%,-50%)scale(1.25)}}@keyframes toastPop{0%{opacity:0;transform:translate(-50%,-18px)scale(.65)}30%{opacity:1;transform:translate(-50%)scale(1.08)}72%{opacity:1;transform:translate(-50%)scale(1)}to{opacity:0;transform:translate(-50%,-28px)scale(.96)}}@keyframes floatReward{0%{opacity:0;transform:translate(-50%)scale(.55)rotate(-5deg)}24%{opacity:1;transform:translate(-50%,-18px)scale(1.15)rotate(2deg)}62%{opacity:1;transform:translate(-50%,-48px)scale(1)}to{opacity:0;transform:translate(-50%,-96px)scale(.92)}}@keyframes floatCrit{0%{opacity:0;transform:translate(-50%,10px)scale(.45)rotate(-7deg)}22%{opacity:1;transform:translate(-50%,-18px)scale(1.2)rotate(3deg)}55%{opacity:1;transform:translate(-50%,-35px)scale(1)}to{opacity:0;transform:translate(-50%,-95px)scale(.93)}}@keyframes hitFlash{0%{opacity:0}18%{opacity:1}to{opacity:0}}@keyframes pressGlow{0%{opacity:.45;transform:translate(-50%)scaleX(.86)}to{opacity:.82;transform:translate(-50%)scaleX(1)}}@keyframes titleDrop{0%{opacity:0;transform:translateY(-22px)scale(.8)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes logoIn{0%{opacity:0;transform:translateY(-15px)scale(.72)rotate(-7deg)}to{opacity:1;transform:translateY(0)scale(1)rotate(-2deg)}}@keyframes starTwinkle{0%{filter:brightness(.95);transform:scale(.82)rotate(-18deg)}to{filter:brightness(1.18);transform:scale(1.14)rotate(-8deg)}}@keyframes cardUp{0%{opacity:0;transform:translateY(36px)scale(.92)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes resultUp{0%{opacity:0;transform:translateY(60px)scale(.84)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes starPop{0%{opacity:0;transform:scale(.2)rotate(-30deg)}60%{opacity:1;transform:scale(1.28)rotate(7deg)}to{opacity:1;transform:scale(1)rotate(0)}}@keyframes starDimIn{0%{opacity:0;transform:scale(.6)}to{opacity:.55;transform:scale(.92)}}@media (height<=720px){#screen-start{padding-top:max(calc(env(safe-area-inset-top) + 16px), 2.5vh)}.brand-kicker{transform:scale(.9)}.logo-wrap{margin-top:8px}.logo-top{font-size:clamp(36px,10vw,56px)}.logo-bottom{font-size:clamp(42px,11.5vw,64px)}.start-spacer{min-height:12vh}.action-card{padding:13px}.howto-row{padding-bottom:10px}.btn{min-height:58px}}@media (width>=620px){#ui{width:560px;max-width:560px;left:50%;right:auto;transform:translate(-50%)}}
