*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;font-family:Arial,sans-serif;background:#173930;color:#fff8e6}button{font:600 14px Arial;color:#fff8e6;background:#203c36e8;border:1px solid #f4e6bb65;border-radius:18px;min-height:48px;padding:10px 16px;touch-action:manipulation}button:active,button[aria-pressed=true]{background:#e9bf77;color:#193b32}button:focus-visible{outline:3px solid #fff}#game{height:100dvh;position:relative;isolation:isolate;overflow:hidden}#scene{width:100%;height:100%;display:block;touch-action:none}header{position:absolute;top:max(12px,env(safe-area-inset-top));left:16px;right:16px;display:flex;justify-content:space-between;align-items:flex-start;gap:8px;pointer-events:none}.brand{font-size:26px;font-weight:bold;text-shadow:0 2px 7px #122d28}.brand small{font-size:13px;display:block;margin-top:5px}.topbuttons{display:flex;gap:6px;pointer-events:auto}.topbuttons button{padding:8px 12px}#objective{position:absolute;top:82px;right:16px;background:#183f35dd;border-radius:12px;padding:9px 12px;font-size:14px;max-width:calc(100% - 32px)}#rivka{position:absolute;top:128px;right:16px;width:140px;background:#1b3b32;border:1px solid #efdaab80;border-radius:13px;overflow:hidden}#castleView{width:140px;height:80px;display:block}#rivka span{display:block;font-size:12px;text-align:center;padding:5px}#message{position:absolute;bottom:170px;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 32px);padding:10px 16px;border-radius:14px;background:#193e36ec;font-size:15px;text-align:center;pointer-events:none;margin:0}#stick{position:absolute;left:max(22px,env(safe-area-inset-left));bottom:60px;width:102px;height:102px;border:2px solid #fff8d988;border-radius:50%;display:grid;place-items:center;background:#153a3060;touch-action:none}#knob{background:#f8d998dd;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;color:#203e34;font-size:13px;pointer-events:none}#run{position:absolute;bottom:170px;left:44px;min-height:44px;padding:8px 16px}#actions{position:absolute;right:max(18px,env(safe-area-inset-right));bottom:60px;display:grid;grid-template-columns:70px 70px;gap:8px}#actions button{height:54px;padding:5px}#jump{background:#edc77c;color:#234333}#bottom{position:absolute;bottom:max(10px,env(safe-area-inset-bottom));left:20px;right:20px;display:flex;justify-content:space-between;align-items:center;font-size:14px}#bottom button{min-height:40px;padding:6px 12px}#score{text-shadow:0 1px 4px #16352f}#crosshair{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:28px;color:white;text-shadow:0 1px 3px #16352f;pointer-events:none}.overlay{position:absolute;inset:0;z-index:10;background:#123b30e8;display:grid;place-items:center;padding:22px}.overlay section{max-width:440px;text-align:center;line-height:1.6}.overlay button{margin:6px}.overlay h1{font-size:38px}.overlay p{font-size:16px}[hidden]{display:none!important}@media(max-width:550px){.brand{font-size:20px}.brand small{font-size:12px}.topbuttons button{padding:7px 9px;min-height:44px}#rivka{width:110px}#castleView{width:110px;height:65px}#rivka span{font-size:11px}#objective{font-size:13px}#message{bottom:218px;font-size:14px}#run{bottom:170px}#actions{grid-template-columns:64px 64px;right:12px}#stick{left:15px;width:92px;height:92px}}@media(max-height:500px) and (min-width:550px){header{top:8px}.brand small{display:none}#objective{top:52px;max-width:65%}#rivka{top:94px;width:110px}#castleView{width:110px;height:60px}#message{bottom:65px;max-width:40%;font-size:13px}#actions{bottom:45px}#stick{bottom:45px}#run{bottom:151px}#bottom{bottom:3px}}

#run{bottom:170px;left:42px}@media(max-height:500px) and (min-width:550px){#run{bottom:151px}}
/* Right thumb moves; left thumb uses the paint tools. */
#stick{left:auto;right:max(22px,env(safe-area-inset-right))}
#run{left:auto;right:42px}
#actions{right:auto;left:max(18px,env(safe-area-inset-left));grid-template-columns:64px 64px;gap:9px}
#actions button{height:64px;padding:0;border-radius:20px;background:linear-gradient(145deg,#244c43ed,#102f28ed);box-shadow:0 3px 0 #09231ce6,inset 0 1px 0 #ffffff40;display:grid;place-items:center}
#actions button:active{transform:translateY(2px);box-shadow:0 1px 0 #09231ce6;background:#427162}
#actions .action-icon{display:block;width:60px;height:60px;background-image:url('./assets/action-icons.png');background-size:200% 200%;background-repeat:no-repeat;pointer-events:none}
#brush .action-icon{background-position:0 0}#shoot .action-icon{background-position:100% 0}#bridge .action-icon{background-position:0 100%}#jump .action-icon{background-position:100% 100%}
@media(max-width:550px){#stick{left:auto;right:15px}#actions{left:12px;right:auto;grid-template-columns:58px 58px}#actions button{height:58px}#actions .action-icon{width:54px;height:54px}#run{left:auto;right:36px}}
.back{color:#fff5dc;background:#183e36e8;text-decoration:none;border-radius:12px;padding:10px 12px;font-size:13px;min-height:44px;display:inline-flex;align-items:center}

#progress{position:absolute;top:128px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:7px;background:#173e35dc;border:1px solid #f4e6bb55;border-radius:18px;padding:7px 12px;font-size:12px;white-space:nowrap}#progress i{width:10px;height:10px;border:1px solid #ffe5a8;border-radius:50%;background:#294e43}#progress i.active{background:#ffcc74;box-shadow:0 0 9px #ffd989}.win-leaf{font-size:40px;letter-spacing:10px}#earthWin{background:#16372ff2}#earthWin h1{font-size:31px;margin-bottom:4px}@media(max-width:550px){#progress{top:119px;left:16px;transform:none;padding:6px 9px}#bottom{gap:5px;left:8px;right:8px}.back{padding:7px 8px;font-size:11px}}@media(max-height:500px) and (min-width:550px){#progress{top:52px;left:50%;font-size:11px;padding:5px 9px}}

#magic{font-size:21px;min-width:48px;padding:6px;background:linear-gradient(145deg,#8462a6,#3a315d);box-shadow:0 0 12px #dfb9ff88}#magic:active{background:#f4cb77}