:root{font-family:Tahoma,"Noto Sans Thai",sans-serif;color:#fff;background:#123c35;--dark:#123c35;--gold:#ffd84e;--teal:#17b7a0}*{box-sizing:border-box}body{margin:0;min-height:100dvh;overflow:hidden}button{font:inherit}.start,.game,.win{width:100vw;height:100dvh;background:linear-gradient(90deg,#092f2dcc 0 35%,transparent 68%),url('assets/jungle-ladder.png') center/cover;position:relative}.start{display:flex;align-items:center;justify-content:center;gap:clamp(25px,5vw,80px);padding:5vw}.start img{width:min(32vw,390px);border-radius:50%;border:7px solid var(--gold);box-shadow:0 13px 0 #092821}.start>div{max-width:690px;background:#123c35ed;border:5px solid #fff;border-radius:36px;padding:clamp(24px,4vw,50px);box-shadow:0 15px 0 #092821}.start b{color:var(--gold);font-size:clamp(18px,2vw,27px)}h1{font-size:clamp(48px,6vw,90px);line-height:1;margin:.16em 0;text-shadow:0 7px #a04d20}.start p{font-size:clamp(19px,2vw,28px)}button{border:0;border-radius:18px;padding:13px 26px;background:linear-gradient(#ffec75,#ffb92c);color:#153a34;font-weight:900;box-shadow:0 7px 0 #9b6200;cursor:pointer}button:active{transform:translateY(4px);box-shadow:0 3px 0 #9b6200}.sound{position:fixed;z-index:30;right:18px;bottom:18px;width:58px;height:58px;padding:0;border:3px solid #fff;border-radius:50%;background:#123c35;color:#fff;box-shadow:0 6px 0 #071e1b;font-size:25px}.game{display:grid;grid-template-rows:auto 1fr auto;padding:clamp(8px,1.3vw,20px);gap:10px}.hud{display:flex;align-items:center;justify-content:space-between;gap:15px;background:#123c35ed;border:3px solid #fff;border-radius:22px;padding:9px 18px}.bar{height:18px;flex:1;max-width:580px;border:2px solid #fff;border-radius:20px;background:#2e5a50;overflow:hidden}.bar i{display:block;height:100%;background:linear-gradient(90deg,#3fe6c8,#ffd84e);transition:.4s}.play{display:grid;grid-template-columns:minmax(330px,42%) 1fr;gap:20px;min-height:0}.panel{align-self:center;background:#123c35ed;border:5px solid #fff;border-radius:34px;padding:clamp(18px,3vw,38px);text-align:center;box-shadow:0 14px 0 #08241f}.panel .label{display:inline-block;background:#ff7658;border-radius:18px;padding:6px 18px;font-weight:900}.equation{font-size:clamp(55px,7vw,105px);font-weight:900;color:#fff;margin:15px;text-shadow:0 6px #08241f}.levelnow{font-size:clamp(20px,2.2vw,32px);color:#9ff5e3}.levelnow strong{display:inline-grid;place-items:center;width:68px;height:68px;border-radius:50%;background:var(--gold);color:#123c35;font-size:40px;border:4px solid #fff}.controls{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:420px;margin:18px auto}.controls .confirm{grid-column:1/-1;background:linear-gradient(#6effb1,#22c785);box-shadow:0 7px 0 #08784b}.arrow{font-size:30px}.hint{min-height:30px;font-weight:900;color:#9ff5e3}.climb{position:relative;height:100%;min-height:500px;max-width:520px;margin:auto;width:100%}.track{position:absolute;right:29%;top:4%;bottom:4%;width:170px;border-left:9px solid #4a7b35;border-right:9px solid #4a7b35}.rung{position:absolute;left:-58px;width:270px;height:8px;background:#8c5526;border:3px solid #f2bc65;border-radius:8px;transform:translateY(50%)}.rung span{position:absolute;right:-49px;top:-23px;width:45px;height:45px;display:grid;place-items:center;border-radius:50%;background:#123c35;border:3px solid #fff;color:#fff;font-size:23px;font-weight:900}.monkey{position:absolute;z-index:5;right:calc(29% + 30px);width:clamp(78px,8vw,120px);aspect-ratio:1;border-radius:50%;background:url('assets/monkey-token.png') center/cover;border:5px solid var(--gold);box-shadow:0 8px 0 #08241f,0 0 18px #fff;transition:bottom .32s cubic-bezier(.2,.8,.3,1.2)}.monkey.jump{animation:hop .3s}.bananas{display:flex;justify-content:center;gap:8px;background:#123c35ed;border:3px solid #fff;border-radius:22px;padding:8px 75px 8px 15px}.banana{width:clamp(34px,4vw,55px);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;background:#294f46;border:3px dashed #9cbeb7}.banana.got{background:#ffd84e;border-style:solid;box-shadow:0 0 13px #fff;color:#694400}.win{display:grid;place-items:center;text-align:center}.win>div{background:#123c35ed;border:5px solid #fff;border-radius:38px;padding:45px;box-shadow:0 16px 0 #071e1b}.win h1{margin:.15em}.trophy{font-size:90px}.wrong{animation:shake .35s}@keyframes hop{50%{transform:scale(1.15)}}@keyframes shake{25%{transform:translateX(-9px)}75%{transform:translateX(9px)}}@media(max-aspect-ratio:4/3){body{overflow:auto}.game{height:auto;min-height:100dvh}.play{grid-template-columns:1fr}.climb{min-height:650px}.panel{z-index:10}}@media(max-height:650px) and (orientation:landscape){.game{padding:6px;gap:4px}.panel{padding:10px}.equation{margin:4px;font-size:55px}.controls{margin:7px auto}.climb{min-height:430px}.monkey{width:70px}.bananas{padding-top:3px;padding-bottom:3px}.sound{width:48px;height:48px}}