@font-face{font-family:Fredoka;src:url('assets/fredoka.woff2') format('woff2');font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:Nunito;src:url('assets/nunito.woff2') format('woff2');font-style:normal;font-weight:600;font-display:swap}
:root{--ink:#153e52;--muted:#547b90;--sky:#ddf3fa;--sky-light:#f2fafd;--coral:#ff7063;--white:#fff;color-scheme:light;font-family:Nunito,system-ui,sans-serif;color:var(--ink);background:#e7f5fa;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;min-height:100dvh;display:grid;place-items:center;overscroll-behavior:none;background:#e7f5fa;-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}button{font-family:inherit;font-weight:600;cursor:pointer;color:inherit}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:3px solid #2e91bf;outline-offset:4px}svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}button svg,a svg{pointer-events:none}.icon-definitions{position:absolute;width:0;height:0;overflow:hidden}
.stage{position:relative;width:100%;height:100dvh;max-width:460px;overflow:hidden;isolation:isolate;background:var(--sky)}#game{position:absolute;inset:0;width:100%;height:100%;touch-action:none;outline:none}.screen{position:absolute;inset:0}[hidden]{display:none!important}h1,h2,p{margin:0}h1,h2,.score,.result-score strong{font-family:Fredoka,system-ui,sans-serif;font-weight:600}
.menu{z-index:2;display:grid;grid-template-rows:auto minmax(120px,1fr) auto;padding:clamp(40px,9dvh,78px) 36px max(28px,env(safe-area-inset-bottom))}h1{text-align:center;font-size:clamp(58px,18vw,76px);line-height:.94;letter-spacing:-1.5px}.menu-art{position:relative;display:grid;place-items:center;min-height:0;pointer-events:none}.hero-balloon{width:112px;height:125px;object-fit:contain;margin-top:22px}.preview-shield{position:absolute;top:calc(50% - 112px);left:calc(50% - 25px);width:50px;height:50px;border-radius:50%;background:var(--white);border:2px solid #7bc9e6}.balloon-string{position:absolute;width:27px;height:54px;top:calc(50% + 72px);stroke:#7899a8;stroke-width:1.5}.menu-actions{display:grid;gap:10px}.best{display:flex;align-items:baseline;justify-content:center;gap:9px;font-size:13px;color:var(--muted);margin-bottom:9px}.best strong{font-family:Fredoka,system-ui,sans-serif;font-size:26px;color:var(--ink)}
.button{width:100%;min-height:58px;border-radius:12px;display:flex;align-items:center;justify-content:center;gap:10px;border:0;text-decoration:none;font-size:22px;font-weight:600;cursor:pointer}.button:active{transform:translateY(1px)}.primary{background:var(--coral);color:var(--white);font-family:Fredoka,system-ui,sans-serif}.primary:hover{background:#f76759}.text-button{min-height:44px;padding:10px 14px;background:none;border:0;display:flex;align-items:center;justify-content:center;font-size:14px}.text-button:hover{color:#2d7796}.download{min-height:56px;background:transparent;border:1px solid #8db0c0;font-size:13px;color:var(--ink);gap:11px}.download:hover{background:#ffffff50}.download>svg{width:21px;height:25px}.download>span{display:flex;flex-direction:column;text-align:left;gap:2px}.download small{font-size:10px;color:var(--muted)}
.hud{position:absolute;inset:0;z-index:1;pointer-events:none}.hud-top{height:84px;padding:max(25px,env(safe-area-inset-top)) 25px 0;display:flex;align-items:flex-start;justify-content:space-between}.hud-best{display:flex;align-items:baseline;gap:8px;font-size:10px;letter-spacing:.5px}.hud-best>span{font-family:Fredoka,system-ui,sans-serif;font-size:19px;letter-spacing:0}.level{text-align:right;padding-top:3px;font-size:11px;letter-spacing:.5px}.progress{height:4px;border-radius:2px;margin-top:9px;background:#97c6d84d;width:85px;overflow:hidden}.progress>i{display:block;height:100%;width:0;background:#589fbc;border-radius:2px}.score{font-size:62px;line-height:1;text-align:center;letter-spacing:-1px;font-variant-numeric:tabular-nums}
.overlay{z-index:5;background:#e3f4faed;display:grid;place-items:center;padding:36px}.overlay-content{width:100%;max-width:300px;display:flex;align-items:center;flex-direction:column;text-align:center}.overlay h2{font-size:34px;line-height:1.1}.result-score{display:flex;flex-direction:column;margin:30px 0 18px;gap:8px}.result-score>span{font-size:12px;color:var(--muted)}.result-score strong{font-size:90px;line-height:1}.result-best{display:flex;align-items:baseline;gap:8px;font-size:14px;margin-bottom:32px;color:var(--muted)}.result-best strong{font-size:20px;color:var(--ink)}.result-best>span{font-size:11px;color:#b7463d;margin-left:4px}.overlay .text-button{width:100%;margin-top:10px}
dialog{position:absolute;inset:0;width:calc(100% - 40px);max-width:350px;max-height:calc(100% - 40px);margin:auto;border:0;border-radius:14px;padding:38px 26px 26px;background:var(--sky-light);color:var(--ink);box-shadow:0 12px 60px #153e5220;z-index:9}dialog::backdrop{background:#153e5240}dialog h2{font-size:26px;margin:0 30px 24px 0}dialog p{font-size:15px;line-height:1.6}dialog .desktop-tip{font-size:12px;color:var(--muted);margin:18px 0 26px}.icon-button{width:44px;height:44px;border:0;background:transparent;display:grid;place-items:center;border-radius:8px}.close-button{position:absolute;right:10px;top:10px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(min-width:600px){body{padding:16px}.stage{height:calc(100dvh - 32px);max-height:940px;width:auto;aspect-ratio:390/800;border-radius:18px}h1{font-size:70px}}
@media(max-height:700px){.menu{padding-top:32px;padding-bottom:22px}h1{font-size:60px}.hero-balloon{width:94px;height:106px;margin-top:16px}.preview-shield{width:44px;height:44px;left:calc(50% - 22px);top:calc(50% - 87px)}.balloon-string{top:calc(50% + 59px);height:39px}.best{margin-bottom:3px}.best strong{font-size:23px}.button{min-height:52px}.download{min-height:52px}.menu-actions{gap:7px}.overlay h2{font-size:30px}.result-score strong{font-size:78px}}
@media(max-height:580px){.menu{padding:24px 30px 18px;grid-template-rows:auto minmax(110px,1fr) auto}h1{font-size:52px}.hero-balloon{width:79px;height:89px}.preview-shield{width:40px;height:40px;left:calc(50% - 20px);top:calc(50% - 73px)}.balloon-string{top:calc(50% + 51px);height:28px}.best{margin-bottom:0}.menu-actions{gap:5px}.button{min-height:48px}.download{min-height:48px}.hud-top{height:70px}.score{font-size:54px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}