*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}html,body{width:100%;height:100%;overflow:hidden;background:#152b25;color:#fff;font-family:"Arial Rounded MT Bold","PingFang SC","Microsoft YaHei",sans-serif}button{border:0;font:inherit;color:inherit;cursor:pointer}body{position:relative;display:block}.viewport-backdrop{position:fixed;z-index:0;inset:-32px;width:calc(100% + 64px);height:calc(100% + 64px);object-fit:cover;object-position:center;filter:blur(24px) brightness(.56) saturate(1.12);transform:scale(1.08);pointer-events:none}.phone{position:absolute;z-index:1;left:50%;top:50%;width:100vw;height:177.7778vw;aspect-ratio:9/16;transform:translate(-50%,-50%);overflow:hidden;isolation:isolate;background:linear-gradient(#78cdf4 0 44%,#bde578 44% 100%);border:0;border-radius:0;box-shadow:0 0 42px #061a15aa;user-select:none}.phone>canvas,.phone>.intro,.phone>.result{position:absolute;inset:0;width:100%;height:100%}canvas{touch-action:manipulation;z-index:1}@media (min-aspect-ratio:9/16){.phone{width:56.25vh;height:100vh}@supports(height:100dvh){.phone{width:56.25dvh;height:100dvh}}}.sky-glow{position:absolute;z-index:2;inset:0;pointer-events:none;background:radial-gradient(circle at 78% 14%,#fffbd888 0 5%,transparent 19%),linear-gradient(180deg,transparent 60%,#5d9c3822);mix-blend-mode:screen}.hud{position:absolute;z-index:20;top:calc(10px + env(safe-area-inset-top));left:13px;right:13px;height:48px;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.brand{display:flex;align-items:center}.brand-fishing{width:min(37%,168px);min-width:132px;height:72px;justify-content:flex-start;transform:none;pointer-events:none}.brand-logo{display:block;width:100%;height:100%;object-fit:contain;object-position:left center;filter:drop-shadow(0 3px 1px #102d3c99) drop-shadow(0 5px 7px #143f3570);user-select:none;-webkit-user-drag:none}.round-btn{pointer-events:auto;width:40px;height:40px;border-radius:50%;background:#fff8d9e8;color:#775332;border:2px solid #9a6a39;box-shadow:0 4px 0 #664321,0 6px 14px #254d3144;font-size:19px;font-weight:900}.round-btn:active{transform:translateY(3px);box-shadow:0 1px 0 #664321}.score-card{position:absolute;z-index:18;top:calc(66px + env(safe-area-inset-top));left:50%;transform:translateX(-50%);min-width:168px;height:60px;padding:7px 14px 7px 9px;display:flex;align-items:center;gap:9px;border-radius:22px;background:linear-gradient(#fffdf4ee,#f5e9c7e8);border:2px solid #8a6535;color:#6d4628;box-shadow:0 5px 0 #75502a,0 8px 20px #173f2f44}.coin-icon{width:39px;height:39px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(145deg,#fff272,#f6a817);border:3px solid #fff0a0;box-shadow:0 0 0 2px #bb6b13;color:#fff7b7;text-shadow:0 2px #ad6611;animation:coinTurn 2.8s linear infinite}@keyframes coinTurn{50%{transform:rotateY(180deg)}}.score-card small{display:block;font-size:9px;font-weight:800;color:#9b795b}.score-card strong{display:block;font-size:24px;line-height:1;font-variant-numeric:tabular-nums}.score-card.coin-arrival{animation:coinCounterArrival .24s cubic-bezier(.2,1.65,.35,1);box-shadow:0 5px 0 #75502a,0 0 0 5px #ffe35f88,0 8px 26px #ffd33aaa}@keyframes coinCounterArrival{0%{transform:translateX(-50%) scale(1)}50%{transform:translateX(-50%) scale(1.12) rotate(-1deg)}100%{transform:translateX(-50%) scale(1)}}.combo{align-self:flex-start;margin-left:4px;padding:4px 7px;border-radius:8px;background:#ff7b38;color:white;font-size:8px;font-weight:1000;opacity:0;transform:scale(.5);transition:.2s;white-space:nowrap}.combo.on{opacity:1;transform:scale(1)}.mission{position:absolute;z-index:17;top:calc(136px + env(safe-area-inset-top));left:50%;transform:translateX(-50%);width:min(360px,88%);padding:9px 13px 12px;border-radius:16px;background:#274f35df;border:1.5px solid #e5f3b888;box-shadow:0 5px 15px #173c2a55;backdrop-filter:blur(6px)}.mission-copy{display:flex;align-items:center;gap:6px;font-size:10px;color:#f4ffcf}.mission-copy span{font-size:14px}.mission-copy b{flex:1}.mission-copy em{font-style:normal;color:#ffe270;font-weight:900}.bar{position:relative;margin-top:7px;height:10px;border-radius:10px;background:#173420;border:2px solid #587e42;box-shadow:inset 0 2px 3px #0b2419;overflow:visible}.bar>i{display:block;height:100%;width:0;border-radius:8px;background:linear-gradient(90deg,#ffd83f,#ff9f24);box-shadow:0 0 8px #ffcb3d;transition:width .25s ease}.milestone{position:absolute;top:50%;width:17px;height:17px;transform:translate(-50%,-50%);display:grid;place-items:center;border-radius:50%;background:#fff3c2;color:#7d4a24;border:2px solid #bc7a26;font-size:6px;font-weight:1000}.m1{left:25%}.m2{left:58.33%}.m3{left:100%}.timer{position:absolute;z-index:12;top:calc(194px + env(safe-area-inset-top));right:18px;width:48px;height:48px;display:grid;place-items:center;border-radius:50%;background:#fff9ddee;color:#775335;border:3px solid #996c3f;box-shadow:0 4px #614627;font-size:20px;font-weight:1000;font-variant-numeric:tabular-nums}.timer::after{content:'s';font-size:8px;position:absolute;right:6px;bottom:6px}.timer.urgent{background:#ff6b45;color:white;animation:urgent .5s infinite alternate}@keyframes urgent{to{transform:scale(1.08)}}.tip{position:absolute;z-index:12;left:50%;bottom:calc(25px + env(safe-area-inset-bottom));transform:translateX(-50%);padding:10px 22px;border-radius:999px;background:#244d32e8;border:2px solid #efffc2;color:#fff8cf;box-shadow:0 5px #15351f,0 7px 16px #15351f66;font-size:13px;font-weight:900;white-space:nowrap;animation:tip 1.2s ease-in-out infinite alternate}@keyframes tip{to{transform:translateX(-50%) translateY(-3px)}}.guide{position:absolute;z-index:16;left:50%;top:56%;width:58px;height:76px;pointer-events:none;transition:.25s}.guide span{font-size:45px;display:block;filter:drop-shadow(0 4px 3px #273a25aa);animation:tap 1s ease-in-out infinite}@keyframes tap{50%{transform:translateY(-11px) scale(.92)}}.guide i{position:absolute;top:-8px;left:4px;width:34px;height:34px;border:3px solid #fff68d;border-radius:50%;animation:ring 1s ease-out infinite}@keyframes ring{to{transform:scale(1.8);opacity:0}}.guide.hide{opacity:0}.toast{position:absolute;z-index:31;top:28%;left:50%;transform:translate(-50%,-15px) scale(.85);padding:10px 19px;border-radius:999px;background:#fff7dff2;color:#774827;border:2px solid #ae7431;box-shadow:0 5px #69431e;opacity:0;transition:.25s;font-size:12px;font-weight:900;white-space:nowrap}.toast.show{opacity:1;transform:translate(-50%,0) scale(1)}.fx-layer{position:absolute;inset:0;z-index:71;pointer-events:none;overflow:hidden}.flying-coin{position:absolute;z-index:54;width:43px;height:43px;margin:0;display:block;will-change:transform,opacity;filter:drop-shadow(0 3px 2px #5f350788) drop-shadow(0 0 7px #fff183)}.flying-coin.rare{width:50px;height:50px;filter:drop-shadow(0 4px 3px #5f350799) drop-shadow(0 0 12px #fff7a2)}.coin-spin{display:block;width:100%;height:100%;overflow:hidden;background-image:url('assets/coin-spin-sheet.png');background-repeat:no-repeat;background-size:600% 200%;background-position:0 0;animation:coinSheetSpin .58s steps(1,end) infinite}@keyframes coinSheetSpin{0%{background-position:0 0}8.333%{background-position:20% 0}16.666%{background-position:40% 0}25%{background-position:60% 0}33.333%{background-position:80% 0}41.666%{background-position:100% 0}50%{background-position:0 100%}58.333%{background-position:20% 100%}66.666%{background-position:40% 100%}75%{background-position:60% 100%}83.333%{background-position:80% 100%}91.666%,100%{background-position:100% 100%}}.coin-value-pop{position:absolute;z-index:56;color:#fff06c;font-size:16px;font-weight:1000;line-height:1;text-shadow:0 2px 0 #a95c0b,0 0 8px #fff7a1;animation:coinValuePop .48s cubic-bezier(.12,.7,.2,1) forwards}@keyframes coinValuePop{0%{opacity:0;transform:translate(-50%,12px) scale(.5)}28%{opacity:1;transform:translate(-50%,-4px) scale(1.25)}100%{opacity:0;transform:translate(-50%,-28px) scale(.88)}}.float-coin{position:absolute;font-size:22px;font-weight:1000;color:#ffd52f;text-shadow:0 2px #9c5318,0 0 8px #fff7a7;animation:floatCoin .9s ease-out forwards}@keyframes floatCoin{to{opacity:0;transform:translateY(-95px) scale(1.25)}}.spark{position:absolute;width:8px;height:8px;border-radius:50%;background:#ffe86a;box-shadow:0 0 7px #fff6a0;animation:spark .65s ease-out forwards}@keyframes spark{to{transform:translate(var(--x),var(--y)) scale(0);opacity:0}}.intro,.result{position:absolute;z-index:50;inset:0;display:flex;align-items:flex-end;justify-content:center;text-align:center;transition:.5s}.intro{background:linear-gradient(180deg,#78d2f2 0%,#a8e17c 58%,#467e3a 100%);overflow:hidden}.intro::before{content:'';position:absolute;top:8%;right:-8%;width:180px;height:180px;border-radius:50%;background:#fff4a8;box-shadow:0 0 90px #fffbc5}.intro::after{content:'';position:absolute;left:-20%;right:-20%;bottom:25%;height:30%;background:radial-gradient(ellipse at 50% 100%,#91c854 0 45%,transparent 46%),radial-gradient(ellipse at 15% 90%,#568c42 0 42%,transparent 43%),radial-gradient(ellipse at 85% 100%,#477f3b 0 46%,transparent 47%)}.intro.hide{opacity:0;visibility:hidden;transform:none}.hero-capy{position:absolute;z-index:2;top:4.5%;left:50%;width:245px;height:300px;transform:translateX(-50%);display:grid;place-items:center;animation:heroBob 2s ease-in-out infinite;filter:drop-shadow(0 16px 14px #32672f55)}.hero-capy img{display:block;width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none}.hero-capy::after{content:'';position:absolute;z-index:-1;left:18%;right:18%;bottom:3%;height:18px;border-radius:50%;background:#244f2b40;filter:blur(5px)}@keyframes heroBob{50%{transform:translateX(-50%) translateY(-6px)}}.intro-card{position:relative;z-index:4;width:100%;min-height:49%;padding:24px 22px calc(22px + env(safe-area-inset-bottom));border-radius:35px 35px 0 0;background:linear-gradient(#fffbe9,#f4e7bd);color:#744b2a;box-shadow:0 -9px 0 #8e6336,0 -20px 50px #315f3433}.eyebrow{display:inline-block;padding:5px 13px;border-radius:12px;background:#e7f2b5;color:#47702f;font-size:10px;font-weight:900;letter-spacing:2px}.intro h1{margin:9px 0 4px;font-size:36px;line-height:1;color:#7d4d29;text-shadow:0 3px #e2c99b}.intro p{font-size:14px;line-height:1.6;color:#806449}.intro p b{color:#e47722}.how{margin:14px auto;display:flex;justify-content:center;align-items:center;gap:7px;color:#6d563e;font-size:10px;font-weight:900}.how span{padding:7px 8px;border-radius:10px;background:#fffdf2;border:1px solid #ddc99e}.how i{font-style:normal;color:#c89650}.primary{position:relative;width:100%;padding:16px 18px;border-radius:18px;background:linear-gradient(180deg,#ffdf48,#f39a1f);border:3px solid #fff19c;color:#704019;box-shadow:0 6px 0 #a95714,0 10px 20px #713c1733;font-size:17px;font-weight:1000;text-shadow:0 1px #fff3a0}.primary:disabled{cursor:wait;filter:saturate(.45);opacity:.72}.primary:not(:disabled):active{transform:translateY(5px);box-shadow:0 1px 0 #a95714}.primary span{font-size:11px;padding-left:8px}.subline{display:block;margin-top:12px;color:#a68a68;font-size:9px}.result{z-index:60;align-items:center;background:radial-gradient(circle at 50% 35%,#fff1a455,#133d2bf2 64%);backdrop-filter:blur(8px);opacity:0;visibility:hidden}.result.show{opacity:1;visibility:visible}.result-card{position:relative;width:min(390px,92%);padding:53px 18px 18px;border-radius:30px;background:linear-gradient(#fff9e8,#f2dfae);border:5px solid #95612c;color:#694525;box-shadow:0 12px 0 #57361d,0 25px 65px #081a13aa;transform:translateY(25px) scale(.85);transition:.5s cubic-bezier(.2,1.4,.3,1)}.result.show .result-card{transform:none}.ribbon{position:absolute;top:-22px;left:50%;transform:translateX(-50%);min-width:190px;padding:12px 25px;background:linear-gradient(#ffcf3e,#f08420);border:3px solid #fff095;border-radius:8px 8px 18px 18px;color:#fff9ce;font-size:22px;font-weight:1000;text-shadow:0 2px #9d4517;box-shadow:0 5px #a44c17}.chest{display:block;width:142px;height:132px;margin:-17px auto -6px;object-fit:contain;filter:drop-shadow(0 8px 6px #76441f66);animation:chest 1s ease-in-out infinite alternate}@keyframes chest{to{transform:translateY(-5px) scale(1.025)}}.result h2{font-size:25px;color:#704621}.result p{margin:4px 0 10px;font-size:12px;color:#977455}.rewards{display:flex;gap:7px;margin-bottom:12px}.rewards span{flex:1;padding:9px 3px;border-radius:13px;background:#fffdf2;border:2px solid #e5c681;box-shadow:0 3px #caa35d}.rewards i{display:block;font-style:normal;font-size:25px}.rewards i.gold-reward{width:30px;height:30px;margin:0 auto 2px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(145deg,#fff173,#f3a318);border:2px solid #bd6a17;color:#fff6ad;font-size:17px;text-shadow:0 2px #a65e12}.rewards b{display:block;color:#a94712;font-size:14px}.rewards small{font-size:8px;color:#70543b}.code{height:40px;display:flex;align-items:center;gap:8px;margin:10px 0;padding:5px 6px 5px 12px;border-radius:10px;background:#ead9ac;color:#95714e;font-size:9px}.code b{flex:1;letter-spacing:2px;color:#6d4325;font-size:16px}.code button{padding:7px 12px;border-radius:8px;background:#6f9f43;font-size:10px}.download{padding:18px 16px;font-size:22px;line-height:1.1;font-weight:1000;letter-spacing:.04em}.result-note{display:block;margin-top:8px;color:#aa8a69;font-size:8px}.again{margin-top:10px;background:transparent;color:#8b6c50;font-size:11px;text-decoration:underline}.confetti{position:absolute;inset:0;overflow:hidden;pointer-events:none}.confetti i{position:absolute;top:-20px;width:9px;height:15px;background:var(--c);animation:fall var(--d) linear var(--delay) infinite}@keyframes fall{to{transform:translate(var(--x),105vh) rotate(720deg)}}@media(max-height:720px){.hero-capy{top:1.5%;width:205px;height:250px;transform:translateX(-50%);transform-origin:top}.intro-card{min-height:52%;padding-top:15px}.intro h1{font-size:30px}.how{margin:9px auto}.mission{top:128px}.timer{top:184px}.result-card{transform:scale(.85)}.result.show .result-card{transform:scale(.85)}}

/* ===== 卡皮巴拉 COME：参考首图的冒险开场构图 ===== */
.intro{display:block;background:linear-gradient(180deg,#57b8ed 0%,#8edcf0 41%,#d3f2bb 62%,#82c553 100%);isolation:isolate}
.intro::before{top:17%;right:-13%;width:170px;height:170px;background:#fff2a2;box-shadow:0 0 70px #fff8bb99;opacity:.88}
.intro::after{content:none}
.splash-cloud{position:absolute;z-index:0;width:132px;height:34px;border-radius:50%;background:#f3fdffcc;filter:drop-shadow(0 8px 0 #d5f4f488)}
.splash-cloud::before,.splash-cloud::after{content:'';position:absolute;bottom:4px;border-radius:50%;background:inherit}
.splash-cloud::before{left:18px;width:54px;height:54px}.splash-cloud::after{right:16px;width:67px;height:46px}
.cloud-a{left:-34px;top:30%}.cloud-b{right:-48px;top:37%;transform:scale(.72)}
.splash-logo{position:absolute;z-index:5;top:calc(35px + env(safe-area-inset-top));left:50%;width:94%;transform:translateX(-50%) rotate(-1.5deg);text-align:center;filter:drop-shadow(0 8px 0 #142a33aa)}
.logo-cn{font-size:54px;line-height:.9;font-weight:1000;letter-spacing:-5px;color:#fff9e7;-webkit-text-stroke:7px #202632;paint-order:stroke fill;text-shadow:0 4px 0 #e7dbc2}
.logo-come{margin-top:1px;font-size:64px;line-height:.9;font-family:Impact,"Arial Black",sans-serif;font-style:italic;letter-spacing:2px;color:#ffc447;-webkit-text-stroke:8px #222631;paint-order:stroke fill;text-shadow:0 5px 0 #d78625}
.logo-come span{display:inline-block;margin-left:1px;color:#ffdd54;transform:rotate(8deg)}
.splash-logo small{display:inline-block;margin-top:8px;padding:3px 12px;border-radius:999px;background:#244552cc;color:#dff8e5;font-size:8px;font-weight:900;letter-spacing:3px}
.splash-hills{position:absolute;z-index:1;left:-10%;right:-10%;bottom:39%;height:27%;border-radius:50% 50% 0 0/26% 26% 0 0;background:linear-gradient(180deg,#a8d07d,#6fa945);border-top:5px solid #385e43;box-shadow:inset 0 16px 0 #c3df92}
.splash-hills::before,.splash-hills::after{content:'';position:absolute;bottom:55%;width:105px;height:118px;background:radial-gradient(ellipse at 50% 70%,#4b8353 0 47%,transparent 48%)}
.splash-hills::before{left:4%}.splash-hills::after{right:3%;transform:scale(.8)}
.intro-hole{position:absolute;z-index:3;left:50%;bottom:40.5%;width:230px;height:190px;transform:translateX(-50%);pointer-events:none;overflow:hidden}
.hole-back{position:absolute;z-index:1;left:50%;bottom:9px;width:190px;height:57px;transform:translateX(-50%);border-radius:50%;background:#2b2119;box-shadow:0 13px 0 #5d7e35,0 18px 18px #31542b66}
.hole-back::after{content:'';position:absolute;inset:-10px -9px;border-radius:50%;border:10px solid #8e5b34;border-bottom-color:#5a3624;box-shadow:inset 0 5px #c38b4d}
.intro-capy{position:absolute;z-index:2;left:50%;bottom:-29px;width:150px;height:225px;transform:translate(-50%,112px) scale(.96);transform-origin:50% 100%;animation:introPeek 3s cubic-bezier(.55,.02,.25,1) infinite}
.intro-capy img{display:block;width:100%;height:100%;object-fit:contain;clip-path:inset(0 0 48% 0);filter:drop-shadow(0 6px 4px #35251a44);user-select:none;-webkit-user-drag:none}
.hole-front{position:absolute;z-index:4;left:50%;bottom:-1px;width:210px;height:66px;transform:translateX(-50%);overflow:hidden}
.hole-front::before{content:'';position:absolute;left:6px;right:6px;bottom:33px;height:72px;border-radius:50%;border:13px solid #965e35;border-top-color:#bd8247;box-shadow:0 9px 0 #4d2d20}
.peek-spark{position:absolute;z-index:5;width:10px;height:10px;border-radius:50%;background:#fff37e;box-shadow:0 0 10px #ffe64e;opacity:0;animation:peekSpark 3s ease-out infinite}
.s1{left:15px;bottom:87px;--dx:-18px;animation-delay:.14s}.s2{right:18px;bottom:102px;--dx:22px;animation-delay:.28s}.s3{right:42px;bottom:164px;--dx:12px;animation-delay:.42s}
@keyframes introPeek{0%,14%{transform:translate(-50%,96px) scale(.94)}34%,68%{transform:translate(-50%,24px) scale(1)}75%{transform:translate(-50%,28px) rotate(-2deg)}82%{transform:translate(-50%,24px) rotate(2deg)}100%{transform:translate(-50%,96px) scale(.94)}}
@keyframes peekSpark{0%,18%,100%{opacity:0;transform:translate(0,12px) scale(.4)}32%{opacity:1}55%{opacity:0;transform:translate(var(--dx),-28px) scale(1.15)}}
.intro-panel{position:absolute;z-index:6;left:0;right:0;bottom:0;min-height:42%;padding:18px 21px calc(18px + env(safe-area-inset-bottom));border-radius:32px 32px 0 0;background:linear-gradient(#fffbed,#f4e3b5);color:#744b2a;border-top:6px solid #9a6636;box-shadow:0 -16px 38px #2e673755;text-align:center}
.intro-panel .eyebrow{padding:4px 13px}.intro-panel h1{margin:7px 0 3px;font-size:28px;color:#72441e;text-shadow:0 3px #e6c78e}.intro-panel p{font-size:12px;line-height:1.45;color:#806449}.intro-panel p b{color:#e56f1d}.intro-panel .how{margin:10px auto}.intro-panel .primary{padding:14px 16px}.intro-panel .subline{margin-top:9px}
@media(max-height:720px){.splash-logo{top:16px;transform:translateX(-50%) scale(.8)}.intro-hole{bottom:42%;transform:translateX(-50%) scale(.82);transform-origin:bottom}.intro-panel{min-height:44%;padding-top:10px}.intro-panel h1{font-size:24px}.intro-panel .how{margin:6px auto}.intro-panel .primary{padding:11px}.intro-panel .subline{margin-top:6px}}

/* ===== Uploaded full-art opening screen ===== */
.intro.intro-art{display:block;background:#70c8ee;overflow:hidden;text-align:initial}
.intro.intro-art::before,.intro.intro-art::after{content:none}
.intro-scene,.intro-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center;user-select:none;-webkit-user-drag:none}
.intro-video{z-index:1;background:#70c8ee;pointer-events:none}
/* Opaque 3D challenge button covers the flat button baked into the video. */
.intro-start-hotspot{position:absolute;z-index:5;left:50%;right:auto;top:87.1%;width:min(89.6%,390px);height:9.35%;min-height:0;display:flex;align-items:center;justify-content:center;gap:clamp(13px,4vw,28px);padding:0 clamp(18px,6vw,36px);box-sizing:border-box;-webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;border:3px solid #ffe09a;border-radius:clamp(18px,4.5vw,28px);background:linear-gradient(180deg,#ffc94a 0%,#ffad20 44%,#f1870d 100%);color:#71330d;box-shadow:inset 0 3px 1px #fff2b7,inset 0 -4px 0 #dc6b08,0 5px 0 #a84908,0 8px 11px #7130064d;text-shadow:0 2px 0 #ffe19a;outline:0;transform:translateX(-50%);transform-origin:50% 100%;transition:transform .13s ease,box-shadow .13s ease,filter .13s ease;overflow:hidden}
.intro-start-hotspot::before{content:'';position:absolute;left:7%;right:7%;top:5px;height:42%;border-radius:999px;background:linear-gradient(180deg,#fff8c999,transparent);pointer-events:none}
.intro-start-hotspot::after{content:'✦';position:absolute;left:7%;top:17%;color:#fff7c7;font-size:clamp(13px,3.7vw,23px);text-shadow:0 0 9px #fff;animation:challengeSpark 1.45s ease-in-out infinite}
.challenge-label,.challenge-reward{position:relative;z-index:1;white-space:nowrap;font-weight:1000;line-height:1}
.challenge-label{font-size:clamp(20px,6vw,32px);letter-spacing:.03em}
.challenge-reward{padding-left:clamp(12px,3vw,22px);border-left:2px solid #bc5a1366;font-size:clamp(14px,4.2vw,23px)}
.intro-start-hotspot:not(:disabled):hover{filter:saturate(1.08) brightness(1.04);transform:translate(-50%,-2px);box-shadow:inset 0 3px 1px #fff2b7,inset 0 -5px 0 #dc6b08,0 7px 0 #a84908,0 11px 13px #71300659}
.intro-start-hotspot:not(:disabled):active{transform:translate(-50%,3px);box-shadow:inset 0 2px 1px #fff2b7,inset 0 -2px 0 #d66708,0 2px 0 #a84908,0 4px 7px #71300644}
.intro-start-hotspot:focus-visible{outline:3px solid #fff7bb;outline-offset:4px}
.intro-start-hotspot:disabled{cursor:wait;filter:saturate(.7);opacity:.9}
@keyframes challengeSpark{0%,100%{opacity:.45;transform:scale(.75) rotate(0)}50%{opacity:1;transform:scale(1.22) rotate(22deg)}}

/* Hammer replaces the old finger cue and appears again at every strike. */
.guide{width:82px;height:88px;transform-origin:72% 78%}
.guide img{display:block;width:82px;height:86px;object-fit:contain;filter:drop-shadow(0 5px 4px #273a2588);transform-origin:78% 82%;animation:hammerGuide .85s cubic-bezier(.3,.05,.25,1) infinite}
.guide i{top:42px;left:5px;width:35px;height:20px;border-color:#fff68d}
@keyframes hammerGuide{0%,100%{transform:rotate(-24deg) translate(8px,-12px)}52%,64%{transform:rotate(12deg) translate(-4px,5px) scale(.94)}}
.hammer-strike{position:absolute;width:92px;height:96px;object-fit:contain;transform-origin:80% 82%;filter:drop-shadow(0 6px 4px #1a251c77);animation:hammerStrike .34s cubic-bezier(.2,.75,.25,1) forwards}
@keyframes hammerStrike{0%{opacity:0;transform:translate(18px,-45px) rotate(-38deg) scale(.9)}35%{opacity:1}78%{transform:translate(-9px,-8px) rotate(12deg) scale(1.04)}100%{opacity:0;transform:translate(-7px,-5px) rotate(9deg) scale(.94)}}

/* Desktop hammer cursor and click-impact feedback. */
.hammer-cursor{position:absolute;z-index:72;left:0;top:0;width:82px;height:87px;object-fit:contain;pointer-events:none;opacity:0;visibility:hidden;transform:translate(-23px,-70px) rotate(-24deg);transform-origin:76% 82%;filter:drop-shadow(0 6px 4px #17241888);will-change:left,top,transform;transition:opacity .08s}
.hammer-cursor.visible{opacity:1;visibility:visible}
.hammer-cursor.striking{animation:cursorHammerStrike .34s cubic-bezier(.18,.72,.28,1)}
@keyframes cursorHammerStrike{0%{transform:translate(-10px,-91px) rotate(-43deg) scale(.96)}58%{transform:translate(-34px,-58px) rotate(15deg) scale(1.06)}76%{transform:translate(-32px,-57px) rotate(10deg) scale(.98)}100%{transform:translate(-23px,-70px) rotate(-24deg)}}
.impact-star{position:absolute;z-index:45;width:18px;height:18px;margin:-9px 0 0 -9px;display:grid;place-items:center;color:#ffe24a;font-style:normal;font-size:17px;line-height:1;text-shadow:0 1px 0 #b96512,0 0 8px #fff8a6;animation:impactStar .62s cubic-bezier(.12,.7,.3,1) var(--delay) forwards}
@keyframes impactStar{0%{opacity:0;transform:translate(0,0) rotate(0) scale(.2)}22%{opacity:1;transform:translate(calc(var(--sx)*.25),calc(var(--sy)*.25)) rotate(calc(var(--sr)*.25)) scale(1.25)}100%{opacity:0;transform:translate(var(--sx),var(--sy)) rotate(var(--sr)) scale(.35)}}
.impact-flash{position:absolute;z-index:44;width:44px;height:44px;margin:-22px 0 0 -22px;border:4px solid #fff07a;border-radius:50%;box-shadow:0 0 0 3px #f6a51a99,0 0 18px #fff6a7;animation:impactFlash .45s ease-out forwards}
.impact-flash::before,.impact-flash::after{content:'';position:absolute;left:50%;top:50%;width:74px;height:4px;border-radius:4px;background:#ffe85e;transform:translate(-50%,-50%)}
.impact-flash::after{transform:translate(-50%,-50%) rotate(90deg)}
.impact-flash.strong{width:56px;height:56px;margin:-28px 0 0 -28px;border-width:5px}
@keyframes impactFlash{0%{opacity:1;transform:scale(.25) rotate(-18deg)}100%{opacity:0;transform:scale(1.45) rotate(18deg)}}
@media (hover:hover) and (pointer:fine){.hammer-mode,.hammer-mode *{cursor:none!important}.hammer-mode .tip{pointer-events:none}.hammer-mode .guide{display:none}}
@media (pointer:coarse){.hammer-cursor{display:none}}
@media (pointer:fine){.hammer-cursor{display:block}}