:root{color-scheme:dark;--gold:#ffc63b;--border:#182214;--bright:#ffe06c;font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Arial Black",sans-serif}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
/* All visible game copy, including HUD overlays, must be non-selectable on iOS Safari. */
#game,#game *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-user-drag:none;}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#111d15;overscroll-behavior:none}
body{display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,#375c38 0%,#101d15 75%)}
button{font:inherit;cursor:pointer}
#game{position:relative;width:100%;max-width:520px;height:100%;height:100dvh;overflow:hidden;background:linear-gradient(#b9dce5 0%,#c9e8d6 62%,#6aa53c 100%);touch-action:none;isolation:isolate;box-shadow:0 0 70px #050b07}
#scene{position:absolute;inset:0;z-index:0}
#scene canvas{display:block;width:100%;height:100%;touch-action:none}
#vignette{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(10,37,25,.12),transparent 24%,transparent 72%,rgba(14,24,9,.16))}
#holdZone{position:absolute;inset:0;z-index:2;touch-action:none;user-select:none;outline:0;cursor:crosshair}
#hud{position:absolute;inset:0;z-index:3;pointer-events:none;user-select:none}
#topControls{display:flex;justify-content:flex-end;position:absolute;left:0;right:0;top:max(20px,env(safe-area-inset-top));padding:0 14px;z-index:7;pointer-events:none}
#pauseBtn{position:absolute;left:50%;transform:translateX(-50%)}
#pauseBtn:active{transform:translateX(-50%) translateY(2px)}
.roundBtn{border-radius:50%;border:2px solid #5b685d;background:rgba(19,28,21,.72);color:white;font-size:17px;font-weight:900;box-shadow:0 2px 0 rgba(0,0,0,.4),inset 0 1px 2px rgba(255,255,255,.24);width:39px;height:39px;display:grid;place-items:center;pointer-events:auto;line-height:1}
.roundBtn:active,.primaryBtn:active,.secondaryBtn:active{transform:translateY(2px)}
.growth{position:absolute;left:2%;right:2%;top:26%;text-align:center;opacity:0;transform:translateY(-8px) scale(.97);transition:opacity .25s ease,transform .25s ease;filter:drop-shadow(2px 3px 1px rgba(0,0,0,.42))}
.growth.show{opacity:1;transform:none}
.growthTitle{font-size:clamp(18px,5.2vw,28px);font-weight:900;color:#ffd74f;-webkit-text-stroke:1.2px #694418;text-shadow:1px 2px 0 #582c0b,2px 3px 0 #251607}
.growthSize{font-size:clamp(23px,6.4vw,37px);font-weight:900;letter-spacing:-.06em;color:#fff;-webkit-text-stroke:1px #14261d;text-shadow:2px 3px 0 #172014}
.growthFoot{font-size:13px;font-weight:900;color:#fff6a6;text-shadow:1px 2px 2px #172514}
.counter{position:absolute;left:0;right:0;top:22%;text-align:center;opacity:0;transform:scale(.65) translateY(8px);transition:opacity .15s,transform .18s;filter:drop-shadow(2px 3px 1px rgba(0,0,0,.3))}
.counter.show{opacity:1;transform:scale(1) translateY(0)}
.counterValue{font-family:"Arial Black","Noto Sans JP",sans-serif;font-size:clamp(64px,20vw,108px);font-weight:900;letter-spacing:-.09em;line-height:1;color:#ffc22c;-webkit-text-stroke:2.8px #42300c;text-shadow:0 3px 0 #7e4810,4px 6px 0 rgba(0,0,0,.3)}
.counterLabel{font-size:clamp(12px,3.1vw,17px);font-weight:900;color:white;-webkit-text-stroke:.45px #182417;text-shadow:0 2px 3px #1a240d,0 -1px 2px #1a240d}
.nextTag{position:absolute;top:-17px;left:50%;transform:translateX(-50%) translateY(8px);white-space:nowrap;font-size:12px;font-weight:900;padding:5px 12px;border-radius:15px 15px 3px 3px;background:#ffbd25;color:#241600;border:2px solid #7e4c0c;opacity:0;transition:opacity .2s,transform .25s}
.nextTag.show{opacity:1;transform:translateX(-50%)}
#impactWord{position:absolute;top:60%;left:50%;font-size:clamp(42px,12vw,68px);font-weight:900;color:#fff;-webkit-text-stroke:2px #ae2521;text-shadow:2px 4px 0 #cf3933,4px 6px 0 #671e18;white-space:nowrap;opacity:0;transform:translate(-50%,-50%) rotate(-10deg) scale(.3)}
#impactWord.boom{animation:impactPop .76s cubic-bezier(.2,1.5,.2,1) both}
@keyframes impactPop{0%{opacity:0;transform:translate(-50%,-50%) rotate(-15deg) scale(.2)}18%{opacity:1;transform:translate(-50%,-50%) rotate(-9deg) scale(1.2)}54%{opacity:1;transform:translate(-50%,-50%) rotate(-8deg) scale(1)}100%{opacity:0;transform:translate(-50%,-63%) rotate(-8deg) scale(1.1)}}
#bottomHUD{position:absolute;bottom:calc(max(env(safe-area-inset-bottom),0px) + 18px);left:7px;right:7px;text-shadow:0 2px 2px rgba(0,0,0,.5);transition:opacity .2s}
#bottomHUD.hide{opacity:0}
#powerHead{display:flex;align-items:baseline;justify-content:space-between;color:white;font-size:12px;font-weight:900;line-height:1}
#powerHead strong{font-family:"Arial Black",sans-serif;font-size:35px;letter-spacing:-.09em;-webkit-text-stroke:.7px #101909}
#powerHead b{font-size:13px}
#chargeLevel{color:#fff66b}
#powerTrack{position:relative;margin-top:2px;height:19px;border-radius:10px;background:#233b23;border:2px solid #ecf7cd;box-shadow:0 0 0 2px #263a1f,0 3px 2px #17260c;overflow:hidden}
#powerFill{height:100%;width:0%;border-radius:10px;background:linear-gradient(90deg,#94de62 0%,#ffe56d 60%,#ed683d 100%);transition:width .035s linear}
#powerGlint{position:absolute;right:2px;top:1px;bottom:1px;width:10px;opacity:.9;background:repeating-linear-gradient(115deg,white 0px,white 2px,transparent 2px,transparent 5px)}
#controlHint{margin-top:6px;text-align:center;color:#fff;font-size:clamp(12px,3.6vw,17px);font-weight:900;-webkit-text-stroke:.5px #1b3013;text-shadow:1px 2px 0 #182712}
#cutin{position:absolute;inset:0;z-index:10;pointer-events:none;opacity:0;overflow:hidden}
#cutin.active{opacity:1}
@keyframes cutInOut{0%{opacity:0;transform:translateX(-50px) scale(1.05)}10%{opacity:1;transform:translateX(0)}72%{opacity:1}100%{opacity:0;transform:translateX(42px)}}
.comicPanel{position:absolute;left:-18%;top:22%;width:136%;height:52%;transform:rotate(-12deg);background:radial-gradient(circle at 38% 40%,#fff5bd 0%,#ffc444 18%,#f15a36 57%,#b51c21 100%);border:9px solid #1a1715;box-shadow:0 0 0 5px #fbbc3c,0 20px 50px #140d0b;display:flex;align-items:center;justify-content:center;overflow:hidden}
.comicSlashes{position:absolute;inset:-150%;background:repeating-conic-gradient(from 15deg,#fff6db 0deg 2deg,transparent 2deg 14deg);opacity:.5;animation:spin .8s ease-out}
@keyframes spin{to{transform:rotate(30deg)}}
.comicCharacter{position:absolute;left:17%;bottom:-12%;font-size:180px;font-weight:900;color:#b32729;text-shadow:6px 6px 0 #4a141a;transform:rotate(8deg)}
.comicHead{font-size:140px;color:#f4cb42}
.comicArm{position:absolute;left:80px;bottom:0;color:#333;font-size:260px}
.cutinText{position:relative;margin-left:15%;text-align:center;transform:rotate(5deg);filter:drop-shadow(2px 6px 0 #831e1d)}
.cutinText strong{display:block;color:white;-webkit-text-stroke:2px #c12921;text-shadow:3px 3px 0 #6e181a;font-size:clamp(26px,8vw,53px);white-space:nowrap}
.cutinText em{display:block;color:#ffe629;-webkit-text-stroke:1px #432209;font-family:Arial Black,sans-serif;font-size:clamp(18px,6vw,40px);font-style:normal;letter-spacing:.07em}
#flash{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 72%,#ffe779,#ffe6a5 42%,#fff7db 100%);z-index:11;pointer-events:none;opacity:0}
#flash.active{animation:none}
@keyframes flash{0%{opacity:0}10%{opacity:.94}23%{opacity:.75}100%{opacity:0}}
.panel{position:absolute;inset:0;z-index:20;display:flex;flex-direction:column;justify-content:flex-end;padding:0 10px calc(24px + env(safe-area-inset-bottom));pointer-events:auto;background:linear-gradient(to bottom,transparent 14%,rgba(5,13,8,.05) 42%,rgba(5,13,8,.45) 100%)}
.panel[hidden]{display:none}
.resultInner{background:rgba(18,27,20,.94);border-top:4px solid #e5bc54;border-radius:12px 12px 18px 18px;padding:15px 13px 13px;color:#f7f3df;box-shadow:0 -12px 38px #07140c66,0 5px 0 #090e0b;animation:panelRise .4s cubic-bezier(.14,.85,.18,1.1) both}
@keyframes panelRise{from{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}
.resultTitle{font-size:clamp(15px,4.5vw,20px);font-weight:900;letter-spacing:.01em}
.resultTitle b{color:#ffce2d}
.resultCaption{font-size:11px;color:#99ad98;font-weight:900;margin-top:9px}
.resultCaption.accent{margin-top:1px;color:#ffe24d}
.resultCaption.accent span{float:right;color:#b9d5a1}
.growthEquation{display:flex;align-items:center;justify-content:space-between;color:#ffcb3a}
.growthEquation>span:first-child{font-family:"Arial Black",sans-serif;font-size:clamp(41px,13vw,64px);font-weight:900;letter-spacing:-.06em;line-height:1}
.growthEquation>span:nth-child(2){display:flex;flex-direction:column;gap:1px;align-items:flex-end}
.growthEquation small{color:#a8bda2;font-size:12px}
.growthEquation strong{font-size:clamp(21px,6.7vw,32px);color:#fff;font-weight:900;line-height:1}
.earthRow{display:flex;justify-content:space-between;margin-top:17px;font-size:11px;font-weight:900}
.earthRow b{font-size:14px}
#earthTrack{height:12px;border:2px solid #556245;border-radius:12px;background:#273628;overflow:hidden;position:relative}
#earthFill{height:100%;width:10%;background:linear-gradient(90deg,#a0d857,#ffcb3c);border-radius:8px;transition:width .4s}
.progressLabels{display:flex;justify-content:space-between;color:#8da384;font-size:9px;margin:5px 0}
#remainingText{font-size:11px;color:#bac8a7;margin:7px 0 10px;font-weight:800}
.resultStats{border-top:1px solid #3e4b3b;display:flex;justify-content:space-between;align-items:center;gap:6px;font-size:11px;font-weight:800;padding:9px 0}
.resultStats strong{color:white}
#bestFlag{background:#e84a47;color:#fff;font-size:9px;font-style:normal;padding:2px 5px;border-radius:12px;margin-left:3px}
.primaryBtn{display:block;width:100%;border:2px solid #eeb22d;background:linear-gradient(180deg,#ffdb5c,#edb32a);border-radius:10px;padding:12px 5px;color:#211909;font-size:clamp(17px,5.2vw,23px);font-weight:900;box-shadow:0 4px 0 #976317,0 8px 15px #050a05aa}
.smallActions{display:flex;gap:9px;margin-top:9px}
.secondaryBtn{flex:1;color:#f2f1d7;border:1.5px solid #b9a253;background:#1c2720;border-radius:8px;font-size:12px;font-weight:800;padding:9px}
.stageFoot{display:block;text-align:center;color:#9bad8f;font-size:9px;margin-top:10px}
.overlayPanel{justify-content:center;align-items:center;gap:15px;background:#09170bdc;color:white;text-align:center}
.overlayPanel h2{font-size:30px;color:#ffcc39;margin:0}
.overlayPanel p{font-size:14px;color:#dde9d2}
.overlayPanel .primaryBtn,.overlayPanel .secondaryBtn{width:85%;flex:none}
#toast{position:absolute;z-index:40;bottom:15%;left:50%;transform:translateX(-50%) translateY(10px);border-radius:20px;background:#1b2a20;color:white;font-size:13px;font-weight:900;padding:8px 15px;opacity:0;pointer-events:none;white-space:nowrap;transition:opacity .3s,transform .3s}
#toast.show{opacity:1;transform:translateX(-50%)}
@media(min-width:521px){#topControls{padding-left:14px;padding-right:14px}#game{border-left:1px solid #395b3f;border-right:1px solid #395b3f}}
@media(max-height:710px){.panel{padding-bottom:10px}.resultInner{padding:10px}.resultTitle{font-size:16px}.resultCaption{margin-top:4px}.earthRow{margin-top:8px}.resultStats{padding:5px 0}#remainingText{margin:4px 0}.primaryBtn{padding:8px}.stageFoot{margin-top:4px}}
@media(prefers-reduced-motion:reduce){.counter,.growth,.resultInner{transition-duration:.05s;animation-duration:.15s}#cutin.active{animation-duration:.5s}}
/* The environment changes with axe length: forest, mountains, sea, continent, Earth. */
.stageBanner{position:absolute;top:calc(max(68px,env(safe-area-inset-top) + 62px));left:0;right:0;z-index:4;text-align:center;font-size:12px;font-weight:900;letter-spacing:.11em;color:#ffeb81;text-shadow:0 2px 2px #151c14,-1px -1px 0 #3c4815;opacity:0;transform:translateY(-5px);transition:opacity .25s,transform .25s}
.stageBanner.show{opacity:1;transform:none}
.endingPanel{justify-content:flex-end;align-items:stretch;background:radial-gradient(ellipse at 50% 33%,transparent 8%,rgba(2,5,18,.20) 55%,rgba(2,5,18,.92) 100%);padding-bottom:calc(18px + env(safe-area-inset-bottom));color:#fff}
.endingInner{border:2px solid #dea938;border-radius:14px;background:linear-gradient(140deg,rgba(20,27,30,.95),rgba(10,16,32,.97));padding:17px 17px 19px;box-shadow:0 4px 30px #030c16;max-width:510px;width:100%;margin:0 auto;animation:panelRise .5s ease-out both}
.endEyebrow{color:#e1c064;letter-spacing:.3em;font-size:12px;font-family:Arial,sans-serif;font-weight:900;text-align:center}
.endingInner h2{font-size:clamp(28px,9vw,43px);color:#ffdf6c;text-align:center;-webkit-text-stroke:1px #432307;text-shadow:2px 3px 0 #6a3418;margin:4px 0 8px;font-weight:900}
.endScore{display:flex;align-items:baseline;justify-content:center;gap:11px}.endScore strong{font-family:Arial Black,Arial,sans-serif;color:#ffbf32;font-size:clamp(60px,19vw,90px);line-height:1}.endScore span{font-size:16px;font-weight:900}
.endRecord{text-align:center;color:#ffe086;font-size:12px;font-weight:800}.endBody{text-align:center;font-size:12px;line-height:1.8;color:#d1e4db;margin:12px 0}
.endStats{display:grid;grid-template-columns:1fr auto;gap:6px 10px;font-size:12px;padding:13px 2px;margin:10px 0 15px;border-block:1px solid #41544b}.endStats span{color:#b9c7b9}.endStats strong{text-align:right;color:white}
@media(max-height:720px){.endingInner{padding:8px 13px}.endingInner h2{margin:2px 0}.endScore strong{font-size:50px}.endBody{margin:3px 0}.endStats{padding:4px;margin:3px 0 7px}.endRecord{margin:4px}}

.primaryBtn:disabled{filter:grayscale(.25);opacity:.82;cursor:wait}

#secondChop{position:absolute;left:0;right:0;top:39%;text-align:center;font-size:clamp(30px,8vw,48px);font-weight:900;color:#fff8c4;-webkit-text-stroke:1.5px #7d3911;text-shadow:3px 4px 0 #9a301d,4px 5px 6px #161709;opacity:0;transform:translateY(30px) scale(.8) rotate(-7deg);filter:drop-shadow(0 2px 1px #000);pointer-events:none}
#secondChop.active{animation:secondChop .8s cubic-bezier(.1,.9,.2,1) forwards}
@keyframes secondChop{0%{opacity:0;transform:translateY(30px) scale(.75) rotate(-8deg)}25%{opacity:1;transform:translateY(-6px) scale(1.15) rotate(-6deg)}75%{opacity:1;transform:translateY(0) scale(1) rotate(-6deg)}100%{opacity:0;transform:translateY(-25px) scale(1) rotate(-5deg)}}
