@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@500;600;700;800&family=Nunito:wght@500;600;700;800;900;1000&family=Press+Start+2P&display=swap');
:root{font-family:'Nunito',sans-serif;color:#123957;background:#2298ef;font-synthesis:none;--cream:#fff4d7;--yellow:#ffe16c;--ink:#123957;--pixel:'Press Start 2P',monospace}
*{box-sizing:border-box}body{margin:0;min-width:320px;overflow-x:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}button:disabled{cursor:default;opacity:.5}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:4px solid #ffb323;outline-offset:5px}button{touch-action:manipulation}a{color:inherit;text-decoration:none}[hidden]{display:none!important}.sky-art{position:absolute;inset:0 0 auto;height:100%;min-height:900px;background:linear-gradient(180deg,#2196ef 0%,#2196ef30 50%,#e9f6fc88 100%),url('assets/sky.png') center bottom/cover;image-rendering:pixelated;z-index:-1;opacity:.65}.site-header{height:126px;max-width:1440px;padding:20px 60px;display:flex;align-items:center;justify-content:space-between;margin:auto;gap:32px}.wordmark,.toy-brand{font-family:'Baloo 2',sans-serif;font-weight:800;letter-spacing:-4px;font-size:64px;line-height:1;color:var(--cream);-webkit-text-stroke:6px #092c4e;paint-order:stroke fill;text-shadow:2px 6px 0 #092c4e;transform:rotate(-5deg);position:relative}.wordmark>span{font-size:32px;position:absolute;right:-20px;top:-5px;color:var(--yellow);letter-spacing:0}.site-header nav{display:flex;gap:28px;align-items:center;color:white;font-weight:900;font-size:18px}.site-header nav button{background:none;border:0;padding:12px}.current{background:#fff3c9;padding:12px 25px;border-radius:32px;color:var(--ink)}.nav-play{background:var(--yellow);padding:15px 25px;border:0;border-radius:30px;font-weight:900;font-size:18px;box-shadow:0 3px 0 #e5b846}.nav-play span{margin-right:9px}.hero{max-width:1340px;margin:auto;min-height:735px;padding:28px 52px 44px;display:grid;grid-template-columns:1fr 1.04fr;align-items:center;gap:44px}.hero-copy{padding-bottom:30px}.eyebrow{color:#e8f7ff;font-size:13px;letter-spacing:2.4px;font-weight:1000;margin-bottom:24px;display:flex;align-items:center;gap:12px}.eyebrow span{color:var(--yellow);font-size:24px}h1{font-family:'Baloo 2',sans-serif;color:#fff4d7;font-size:clamp(64px,6.2vw,92px);letter-spacing:-3px;line-height:.98;margin:0 0 28px;font-weight:800;text-shadow:0 5px 0 #d7c99c,0 10px 25px #0757a34a}.title-heart{font-family:Arial,sans-serif;font-size:.54em;color:var(--yellow);display:inline-block;vertical-align:middle;transform:rotate(-8deg);margin-left:13px}.intro{font-size:25px;line-height:1.45;color:white;font-weight:800;margin:0 0 28px;text-shadow:0 2px 6px #125c9855}.primary-button{display:inline-flex;align-items:center;justify-content:center;gap:18px;border:2px solid #fff1a0;border-radius:38px;background:linear-gradient(#ffeb88,#ffdb54);box-shadow:0 6px 0 #d7aa35,0 12px 22px #056bbf33;padding:19px 32px;font-weight:1000;font-size:22px;transition:transform .15s,box-shadow .15s}.primary-button:hover{transform:translateY(-2px);box-shadow:0 8px 0 #d7aa35,0 14px 24px #056bbf33}.primary-button:active{transform:translateY(4px);box-shadow:0 2px 0 #d7aa35}.play-note{font-size:13px;font-weight:800;color:#e5f5ff;margin:18px 0 30px}.little-promises{display:flex;gap:36px;color:white}.little-promises>div{display:flex;align-items:center;gap:10px}.little-promises span{font-family:Arial,sans-serif;font-size:39px;line-height:1}.little-promises p{font-size:14px;line-height:1.4;margin:0;font-weight:900}.little-promises strong{font-weight:600}.pet-area{position:relative;max-width:540px;width:100%;justify-self:center}.toy-top{height:20px;position:relative}.keyring{position:absolute;width:60px;height:78px;border:12px solid #e6b84c;border-radius:50%;left:50%;top:-32px;transform:rotate(25deg);box-shadow:inset 3px 3px 0 #fff7b2,3px 2px 0 #956e22,0 5px 10px #134e7244;background:transparent}.tiny-star{position:absolute;right:6px;top:20px;color:#ffe379;font-size:40px;transform:rotate(12deg)}.toy{position:relative;isolation:isolate;background:linear-gradient(125deg,#fffef4 2%,#fff5dc 30%,#f2dfb7 80%,#ffefc5);border:5px solid #fff9e7;border-radius:44% 44% 39% 39% / 33% 33% 36% 36%;padding:39px 46px 27px;box-shadow:inset 8px 6px 8px white,inset -10px -14px 12px #c2a97d88,0 12px 0 #c6b28e,0 22px 0 #d7e9f34d,0 25px 38px #12538b55}.toy-brand{text-align:center;font-size:62px;letter-spacing:-3px;-webkit-text-stroke:5px #163b57;text-shadow:1px 4px 0 #163b57;transform:rotate(-4deg);margin:0 auto 5px;width:fit-content}.toy-brand span{font-size:27px;color:#ffe16c;position:absolute;right:-20px;top:0}.toy-subtitle{text-align:center;font-size:9px;letter-spacing:2.4px;font-weight:1000;margin:12px 0 23px;color:#7796aa}.shell-star{position:absolute;font-size:35px;color:#edbd38;text-shadow:1px 2px 0 #fff9ca;z-index:-1}.star-left{left:11px;top:43%}.star-right{right:11px;top:30%}.screen-bezel{padding:13px;background:linear-gradient(140deg,#72c9fb,#258de0 45%,#0c62a6);border:3px solid #528db3;border-radius:32px;box-shadow:inset 2px 3px 2px #e0f5ff,0 3px 0 #fff,0 -2px 3px #b3a385}.screen{background:#d4eefb;border:4px solid #163e59;border-radius:18px;overflow:hidden;box-shadow:0 0 0 2px #a5defb,inset 3px 4px 8px #12395755}.screen-top{height:31px;padding:0 10px;background:#dbf2ff;display:flex;align-items:center;justify-content:space-between;gap:4px;font:7px var(--pixel);color:#25516d}.screen-top button{font-family:Arial,sans-serif;font-size:20px;position:relative;background:transparent;border:0;padding:0 6px;height:28px}.sound-off{font-size:12px}.playfield{position:relative;background:#6bc4f9;aspect-ratio:4/3;overflow:hidden}canvas{display:block;width:100%;height:100%;image-rendering:pixelated;touch-action:none}.bubble{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);font-size:12px;font-weight:1000;background:#fff9e7;border:2px solid #21405a;box-shadow:2px 2px 0 #21405a;padding:7px 9px;white-space:nowrap;pointer-events:none}.meters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:12px 10px 14px;background:#def0f8;border-top:3px solid #b7dfec}.meters label{font-weight:1000;font-size:12px;display:block;margin-bottom:7px}meter{appearance:none;display:block;width:100%;height:16px;border:2px solid #234b67;padding:2px;background:#f4fbfc;box-shadow:2px 2px 0 #6898b1;border-radius:0}meter::-webkit-meter-bar{background:#b7d4e1;border-radius:0;border:0;height:8px}meter::-webkit-meter-optimum-value{background:#87bf63;border-radius:0}#joy::-webkit-meter-optimum-value{background:#f487a6}#energy::-webkit-meter-optimum-value{background:#9491dd}meter::-moz-meter-bar{background:#87bf63}#joy::-moz-meter-bar{background:#f487a6}#energy::-moz-meter-bar{background:#9491dd}.screen-caption{font-size:8px;letter-spacing:1.8px;text-align:center;font-weight:1000;color:#7796aa;margin:16px 0}.toy-controls{display:flex;justify-content:center;gap:29px}.toy-controls>div{display:flex;flex-direction:column;align-items:center;gap:8px}.toy-controls>div>span{font-size:14px;font-weight:1000}.toy-button{display:grid;place-items:center;width:66px;height:66px;border:3px solid #ae8125;border-radius:50%;background:radial-gradient(circle at 35% 25%,#fff1ab,#ffdc5e 65%,#edb735);box-shadow:inset 2px 3px 1px #fff8ca,inset -3px -4px 2px #d6a32f,0 4px 0 #c8af80,0 0 0 4px #deceaa;transition:transform .1s}.toy-button>span{font-family:Arial,sans-serif;color:#9a741e;font-size:23px;filter:drop-shadow(0 1px 0 #fff4af)}.toy-button:active,.toy-button.pressed{transform:translateY(3px);box-shadow:inset 0 2px 5px #bd912a,0 0 0 4px #deceaa}.toy-bottom{font-size:8px;letter-spacing:1.2px;text-align:center;color:#9a997f;font-weight:1000;margin-top:21px}.under-toy{font-size:13px;text-align:center;color:#1a537f;font-weight:900;margin:27px 0 0}.under-toy span{font-size:20px;vertical-align:middle;margin-right:7px}.game-hud{position:absolute;inset:0 0 auto;display:flex;justify-content:space-between;align-items:center;padding:7px 9px;background:#153b5ada;color:#fff4d7;font:10px var(--pixel)}.game-hud button{border:0;background:transparent;color:#fff4d7;font-weight:1000;padding:3px 7px}.game-overlay{position:absolute;inset:0;background:#dff5ffeF;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:14px;text-align:center}.overlay-kicker{font:7px var(--pixel);color:#356a87;line-height:1.8}.game-overlay h2{font-family:'Baloo 2',sans-serif;font-size:29px;line-height:1;margin:10px 0}.game-overlay p{font-size:13px;font-weight:800;margin:0 0 12px;max-width:240px}.game-overlay>button:not(.text-button){background:#ffe16c;border:2px solid #21415b;box-shadow:3px 3px 0 #21415b;font-weight:1000;font-size:14px;padding:8px 16px}.text-button{border:0;background:transparent;text-decoration:underline;font-size:12px;padding:10px 4px 0}.loading{position:absolute;inset:0;display:grid;place-items:center;color:#14364d;background:#b7e4ff;font-size:14px;font-weight:900}.touch-controls{display:flex;justify-content:center;align-items:center;gap:22px;margin-top:24px}.touch-controls button{width:60px;height:46px;border:2px solid #183e5f;background:#fff0ba;box-shadow:3px 3px 0 #183e5f;font-size:18px;touch-action:none}.touch-controls span{font:8px var(--pixel);color:#17436b}footer{background:#fff6df;border-top:3px solid #fffdf2;display:flex;align-items:center;justify-content:space-between;padding:25px 60px;color:#557694;gap:16px;font-size:13px;font-weight:800}footer>span:first-child{font-weight:1000;letter-spacing:1px}footer .footer-tag{font-weight:700;letter-spacing:0;margin-left:13px}footer>span>span:last-child{margin-left:8px}dialog{border:4px solid #25577a;border-radius:24px;background:#fff6df;color:#173d5d;padding:36px;max-width:480px;width:calc(100% - 32px);box-shadow:8px 8px 0 #14334d55}dialog::backdrop{background:#0a355a99;backdrop-filter:blur(5px)}dialog h2{font:800 32px/1.1 'Baloo 2',sans-serif;margin:16px 0}dialog p{font-size:16px;line-height:1.65}dialog .primary-button{font-size:17px;padding:12px 24px;margin-top:8px}.dialog-star{font-size:35px;color:#d4a21c}.close-help{position:absolute;top:8px;right:12px;font-size:30px;border:0;background:transparent}kbd{border:1px solid #adc0c9;padding:2px 5px;border-radius:3px;background:white;font:inherit}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(min-width:1500px){.hero{min-height:calc(100vh - 202px)}.sky-art{background-position:center 70%}}
@media(max-width:1100px){.site-header{padding:22px 30px}.hero{padding:25px 30px 40px;gap:24px}h1{font-size:70px}.toy{padding:35px 32px 25px}.little-promises{gap:20px}.little-promises>div{gap:7px}.little-promises span{font-size:31px}.intro{font-size:22px}.toy-controls{gap:24px}.eyebrow{font-size:11px;letter-spacing:1.4px}}
@media(max-width:800px){.site-header{height:96px;padding:18px 24px}.wordmark{font-size:49px;-webkit-text-stroke:4px #092c4e}.wordmark>span{font-size:24px}.site-header nav{margin-left:auto;font-size:16px}.site-header nav .current,.nav-play{display:none}.hero{grid-template-columns:1fr;padding:16px 22px 32px;gap:20px}.hero-copy{text-align:center;padding:0}.eyebrow{justify-content:center;margin-bottom:13px;font-size:10px}h1{font-size:64px;line-height:1;letter-spacing:-2px;margin-bottom:18px}h1 br{display:none}.intro{font-size:18px;margin-bottom:20px}.intro br{display:none}.hero-copy .primary-button{font-size:19px;padding:14px 28px}.play-note{margin:16px 0 0;font-size:12px}.little-promises{display:none}.pet-area{max-width:450px;margin-top:30px}.toy{padding:31px 37px 24px}.toy-brand{font-size:55px}.toy-subtitle{margin:10px 0 18px}.keyring{height:62px;width:49px;border-width:9px;top:-20px}.toy-top{height:18px}.sky-art{min-height:1150px;max-height:1700px}.under-toy{color:#174774}.screen-top{font-size:6px}.toy-button{height:62px;width:62px}.toy-controls{gap:30px}footer{padding:21px 22px;flex-direction:column;text-align:center;font-size:12px;gap:10px}.tiny-star{right:0;font-size:32px}}
@media(max-width:380px){.hero{padding-left:12px;padding-right:12px}h1{font-size:55px}.toy{padding-left:25px;padding-right:25px}.toy-controls{gap:22px}.screen-bezel{padding:9px}.bubble{font-size:10px}.toy-controls>div>span{font-size:13px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}
@media(max-width:800px){.game-overlay{padding:8px}.game-overlay .overlay-kicker{display:none}.game-overlay h2{font-size:24px;margin:4px 0 6px}.game-overlay p{font-size:12px;line-height:1.25;margin-bottom:8px}.game-overlay>button:not(.text-button){padding:6px 12px;font-size:13px}.game-overlay .text-button{padding-top:8px;font-size:12px}}