:root{--bg:#171135;--navy:#24204d;--dark:#171433;--pink:#ff69a6;--yellow:#ffdf73;--mint:#a2f5c8;--ink:#211949;--cream:#fff8e9;--muted:#c8c3e2}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{font-family:Trebuchet MS,Arial,sans-serif;background:#171135;color:var(--cream)}button{font-family:inherit;cursor:pointer;touch-action:manipulation}button:disabled{opacity:.42;cursor:default}button:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}[hidden]{display:none!important}.app{width:100%;height:100vh;height:100dvh;min-height:0;overflow:hidden;background:radial-gradient(ellipse at 76% 26%,#4b2e7b 0,transparent 39%),radial-gradient(ellipse at 6% 74%,#193d58 0,transparent 37%),var(--bg);display:flex;flex-direction:column;position:relative}.app:before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.3;background-image:radial-gradient(circle,#f9f2e6 1px,transparent 1px);background-size:51px 67px;background-position:9px 17px;mask-image:linear-gradient(90deg,transparent,#000)}.topbar,.footer,.view{position:relative;z-index:1}.topbar{min-height:50px;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:7px clamp(12px,2vw,30px);border-bottom:2px solid #ffffff18}.brand{font-size:clamp(15px,2vw,20px);font-weight:1000;letter-spacing:-.07em}.brand-mark{color:var(--yellow);font-size:1.3em}.brand-small{color:var(--pink)}.top-actions{display:flex;gap:10px;align-items:center}.chip,.small-button{border:1px solid #ffffff29;color:#fff8ec;background:#ffffff13;border-radius:13px;padding:8px 13px;font-weight:900;font-size:13px}.small-button{min-width:40px;min-height:38px}.small-button:hover,.chip:hover{background:#ffffff27}.view{flex:1;min-height:0;display:flex;align-items:stretch;justify-content:center;padding:clamp(6px,1.5vh,16px) clamp(8px,1.5vw,25px)}.screen{width:100%;max-width:1200px;min-height:0}.menu-screen{display:grid;grid-template-columns:1fr .9fr;align-items:center;gap:clamp(7px,3vw,50px);border:1px solid #ffffff22;background:linear-gradient(118deg,#35265fbe,#1d17385f);border-radius:clamp(14px,2vw,28px);padding:clamp(14px,3vw,44px);box-shadow:0 19px 80px #07041b66;overflow:hidden}.menu-content{min-width:0;position:relative;z-index:2}.eyebrow{color:var(--mint);font-size:clamp(10px,1.2vw,14px);font-weight:900;letter-spacing:.15em;margin-bottom:clamp(7px,1.5vh,14px)}.menu-content h1{font-family:Impact,'Arial Black',Arial,sans-serif;margin:0;font-stretch:condensed;font-size:clamp(48px,min(7.4vw,11vh),112px);line-height:.91;letter-spacing:.015em;color:var(--cream);text-shadow:5px 6px 0 #16112e}.menu-content h1 em{font-style:normal;color:var(--pink);white-space:nowrap}.menu-lede{font-size:clamp(12px,1.5vw,19px);font-weight:700;line-height:1.45;color:#e7e2f4;margin:clamp(9px,2vh,21px) 0}.menu-badges{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:clamp(9px,2vh,23px)}.menu-badges span{background:#ffffff12;border:1px solid #ffffff2a;border-radius:100px;padding:6px 9px;font-size:clamp(10px,1vw,12px);font-weight:900;white-space:nowrap}.primary{border:0;background:linear-gradient(135deg,#eaff8c,#89efb8);color:#22204c;font-weight:1000;border-radius:16px;box-shadow:0 6px 0 #2e5865,0 14px 23px #0005;transition:transform .1s}.primary:hover{filter:brightness(1.06);transform:translateY(-2px)}.primary:active{transform:translateY(3px);box-shadow:0 3px 0 #2e5865}.primary.large{min-height:clamp(46px,7vh,67px);padding:11px 21px;max-width:100%;font-size:clamp(13px,1.6vw,18px);display:flex;gap:12px;align-items:center;justify-content:space-between;width:min(100%,460px)}.primary.large span{font-size:24px}.menu-subactions{display:flex;flex-wrap:wrap;gap:7px 18px;margin:clamp(8px,2vh,20px) 0 0}.linklike,.back-button{background:none;border:0;border-bottom:1px solid #ffffff91;color:#fff8e9;padding:4px 1px;font-weight:800;font-size:clamp(11px,1vw,14px)}.small-progress{color:#bdb2da;font-size:11px;display:flex;gap:12px;margin-top:clamp(5px,1vh,16px)}.hero-art{position:relative;width:100%;height:min(100%,590px);min-height:190px;display:flex;align-items:center;justify-content:center}.hero-orbit{position:absolute;border:2px dashed #d5d3ff43;border-radius:50%;width:98%;aspect-ratio:1;transform:rotate(18deg)}.orbit2{width:72%;transform:rotate(-26deg)}.hero-jar{position:relative;width:min(70%,320px);height:min(75%,390px);border:7px solid #d9f5ff;border-top:15px solid #e2fcff;border-radius:28px 28px 90px 90px;background:linear-gradient(105deg,#98e4ff22,#a69cff13 36%,#ffffff0a 78%,#ffffff33);box-shadow:inset 13px 0 0 #ffffff22,inset -9px 0 0 #9ae4fa1c,0 20px 45px #0d0a2e;transform:rotate(-7deg);overflow:hidden;min-height:172px}.hero-glow{position:absolute;inset:auto 0 0;height:55%;background:linear-gradient(0deg,#d0a2f72c,transparent)}.hero-planet{position:absolute;border:4px solid #262250;border-radius:50%;box-shadow:inset -10px -14px #0002,0 8px 0 #0002}.hero-planet i{display:block;position:absolute;top:38%;left:25%;width:10%;height:10%;border-radius:50%;background:#2a1d52;box-shadow:15px 0 #2a1d52}.hp1{background:#ffdd71;width:43%;aspect-ratio:1;bottom:8%;left:6%}.hp2{background:#ff74a4;width:36%;aspect-ratio:1;bottom:3%;right:4%}.hp3{background:#90e7cf;width:36%;aspect-ratio:1;bottom:37%;right:2%}.hp4{background:#b6a5ff;width:28%;aspect-ratio:1;bottom:47%;left:18%}.hp5{background:#89c5fc;width:21%;aspect-ratio:1;top:11%;right:14%}.hero-star{position:absolute;color:var(--yellow);font-size:44px;animation:glimmer 3s ease-in-out infinite}.hs1{top:8%;left:11%}.hs2{right:8%;top:18%;animation-delay:.8s}.hs3{bottom:16%;left:4%;animation-delay:1.3s}.hero-text{position:absolute;right:0;bottom:4%;transform:rotate(8deg);font-size:clamp(10px,1.2vw,17px);font-weight:900;text-align:center;background:var(--yellow);color:var(--ink);border:3px solid #30265e;box-shadow:4px 5px 0 var(--pink);padding:10px 16px;border-radius:11px}.footer{height:25px;min-height:25px;display:flex;justify-content:space-between;align-items:center;padding:0 clamp(12px,2vw,30px);color:#c7c3df80;font-size:10px;font-weight:800;letter-spacing:.1em;border-top:1px solid #ffffff0d}
@keyframes glimmer{50%{transform:scale(1.2);opacity:.5}}
.game-screen{display:flex;flex-direction:column;gap:8px;max-width:1000px}.game-hud{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:44px}.level-label{display:flex;flex-direction:column;gap:2px}.level-label strong{color:var(--mint);font-size:clamp(12px,1.6vw,17px);letter-spacing:.04em}.level-label small{color:#c9c0e3;font-size:10px}.game-score{display:flex;align-items:center;gap:clamp(7px,2vw,23px);font-size:clamp(10px,1.4vw,14px);color:#cdc5e8;font-weight:800}.game-score b{color:#fff;font-size:1.2em}.combo{border:1px solid #ffffff21;padding:5px 7px;border-radius:8px;color:#ffd976}.game-area{flex:1;min-height:0;display:flex;align-items:stretch;justify-content:center;gap:clamp(9px,2vw,27px)}.canvas-column{flex:0 1 445px;min-height:0;display:flex;align-items:center;justify-content:center}.jar-wrap{width:min(100%,calc((100dvh - 166px)*0.777),450px);height:auto;max-height:100%;aspect-ratio:420/540;position:relative;border:3px solid #7d73b0;border-radius:22px;background:#1e183c;overflow:hidden;box-shadow:0 13px 0 #100d2c,0 20px 30px #07061d77}.jar-wrap canvas{display:block;width:100%;height:100%;touch-action:none;cursor:crosshair}.game-toast{position:absolute;top:14%;left:50%;transform:translateX(-50%);pointer-events:none;color:var(--yellow);text-shadow:0 2px 3px #251744;font-weight:1000;font-size:clamp(15px,3vh,25px);white-space:nowrap;opacity:0;transition:opacity .1s}.game-toast.show{opacity:1}.game-side{width:min(30%,235px);min-width:160px;display:flex;flex-direction:column;gap:10px;justify-content:center}.next-box,.side-stat,.side-tools,.game-tip{background:#ffffff12;border:1px solid #ffffff24;border-radius:16px}.next-box{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px;padding:13px}.micro-label,.side-stat>span{font-size:10px;color:#cec5e6;font-weight:900;letter-spacing:.07em}.next-orb{font-size:42px;grid-column:2;grid-row:1 / 3;color:var(--mint);line-height:1;text-shadow:0 4px 0 #0005}.next-box>span:last-child{font-size:13px;font-weight:900;grid-column:1}.side-stat{padding:12px}.meter{margin:8px 0;background:#100d2e;border-radius:50px;border:1px solid #fff3;height:11px;overflow:hidden}.meter>div{width:0;height:100%;background:linear-gradient(90deg,#a6ffbd,#ffe472,#ff608c);border-radius:50px;transition:width .18s}.side-stat small{font-size:11px;color:#c9bfe2}.side-tools{padding:8px;display:grid;grid-template-columns:1fr;gap:8px}.tool-button{background:#ede5ff;border:0;border-radius:11px;display:grid;grid-template-columns:30px 1fr;align-items:center;column-gap:6px;text-align:left;color:#242051;padding:7px 8px;box-shadow:0 3px 0 #9f91c5;min-height:49px}.tool-button>span{font-size:22px;grid-row:1 / 3}.tool-button strong{font-size:11px}.tool-button small{font-size:10px}.game-tip{padding:10px;font-size:11px;color:#d4cce9;line-height:1.45;margin:0}.bottom-hint{height:27px;display:flex;align-items:center;justify-content:space-between;gap:6px;color:#d4cae9;font-size:clamp(10px,1.2vw,12px);font-weight:800}.bottom-hint>span:first-child{color:var(--yellow)}
.overlay{position:absolute;z-index:20;inset:0;background:#0c0927c9;display:flex;align-items:center;justify-content:center;padding:9px}.dialog{width:min(95vw,450px);max-height:96%;overflow:auto;text-align:center;border:3px solid #fbdf91;background:radial-gradient(circle at 10% 15%,#413b82,#241a50 65%);padding:clamp(12px,3vh,28px);border-radius:24px;box-shadow:8px 8px 0 #17112d}.dialog-icon{font-size:clamp(34px,8vh,64px);display:block}.dialog h2{font-family:Impact,'Arial Black',Arial,sans-serif;font-size:clamp(26px,5vh,44px);margin:4px 0;color:#fff9d9;line-height:1}.dialog p{font-size:clamp(12px,2.5vh,17px);color:#e6def3;line-height:1.35;margin:9px 0}.dialog-reward{color:var(--yellow);font-size:clamp(15px,3vh,21px);font-weight:1000;padding:7px}.dialog-actions{display:grid;grid-template-columns:1fr;gap:8px;margin:12px auto 0;max-width:350px}.dialog-actions button{border-radius:12px;border:1px solid #ffffff42;min-height:40px;padding:8px 12px;background:#ffffff16;color:#fff8eb;font-weight:900;font-size:clamp(12px,2.3vh,15px)}.dialog-actions button.primary{background:linear-gradient(125deg,#dafa7a,#8ee6bb);color:#1d2147;border:0}.sub-screen{overflow:auto;background:#342763a8;border:1px solid #ffffff2b;border-radius:20px;padding:clamp(12px,2vw,25px)}.sub-head{display:flex;justify-content:space-between;align-items:center;gap:8px}.sub-head h2{font-size:clamp(22px,3vw,40px);margin:0;color:#fff1c5}.sub-screen>p{font-size:13px;color:#cbc1e1}.levels-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(68px,1fr));gap:7px;margin:10px 0}.level-button{min-height:54px;border:1px solid #ffffff32;border-radius:10px;background:#ffffff16;color:white;font-weight:900}.level-button.open{background:#e3fbb0;color:#231e45}.level-button.done{background:#9ae9d0;color:#241f44}.level-button small{display:block;font-size:10px}.shop-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin:14px 0}.upgrade-card{border:1px solid #fff3;background:#ffffff14;border-radius:15px;padding:15px}.upgrade-card h3{margin:2px 0 6px}.upgrade-card p{font-size:12px;line-height:1.5;color:#e0d7ef}.upgrade-card button{background:var(--mint);border:0;border-radius:9px;padding:9px 13px;color:var(--ink);font-weight:900}
@media(max-width:700px){.topbar{min-height:43px;padding:5px 9px}.view{padding:5px}.footer{height:18px;min-height:18px;padding:0 8px;font-size:8px}.footer span:last-child{display:none}.menu-screen{grid-template-columns:1fr .74fr;padding:clamp(10px,2.4vw,20px);gap:0}.menu-content h1{font-size:clamp(34px,8.7vw,62px)}.hero-art{min-height:170px}.hero-text{font-size:9px;padding:6px}.menu-lede br{display:none}.menu-badges{gap:4px}.menu-badges span{padding:4px 6px}.game-hud{min-height:40px}.game-side{width:160px;min-width:160px;gap:6px}.game-tip{display:none}.next-box,.side-stat{padding:7px}.side-tools{padding:5px;gap:6px}.tool-button{min-height:43px;padding:5px}.jar-wrap{width:min(100%,calc((100dvh - 130px)*.778))}.bottom-hint{height:21px}}
@media(max-width:530px){.menu-screen{grid-template-columns:1fr;align-content:space-between;padding:14px;position:relative}.menu-content{display:flex;flex-direction:column;justify-content:center;max-width:100%}.menu-content h1{font-size:clamp(44px,14vw,78px);line-height:.9;max-width:350px}.menu-lede{max-width:280px;font-size:13px;margin:12px 0}.menu-badges{max-width:280px}.hero-art{position:absolute;width:40%;height:50%;right:-6%;bottom:13%;min-height:0;pointer-events:none;opacity:.85}.hero-jar{width:100%;height:80%;min-height:0;border-width:4px;border-top-width:8px}.hero-text{display:none}.menu-content>.primary{margin-top:4px}.menu-subactions{gap:10px;margin-top:12px}.small-progress{flex-direction:column;gap:2px;margin-top:14px}.game-hud{gap:3px;min-height:39px}.level-label strong{font-size:12px}.level-label small{font-size:9px}.game-score{gap:5px;font-size:10px}.combo{display:none}.game-area{display:flex;flex-direction:column;gap:5px;align-items:center}.canvas-column{min-height:0;flex:1 1 auto;width:100%}.jar-wrap{width:auto;height:min(100%,calc((100vw - 20px)*1.285),calc(100dvh - 205px));max-width:100%;aspect-ratio:420/540;flex:none}.game-side{width:100%;min-width:0;flex:none;display:grid;grid-template-columns:1fr 1fr;gap:5px}.next-box{display:none}.side-stat{padding:6px 8px;display:flex;flex-direction:column;justify-content:center;gap:2px}.side-stat>span{font-size:9px}.side-stat small{font-size:9px}.meter{margin:3px 0;height:8px}.side-tools{padding:4px;display:grid;grid-template-columns:1fr 1fr;gap:4px}.tool-button{grid-template-columns:17px 1fr;min-height:47px;padding:4px 5px;column-gap:3px}.tool-button>span{font-size:17px}.tool-button strong{font-size:9px;letter-spacing:-.05em}.tool-button small{font-size:9px}.bottom-hint{height:16px;font-size:10px}.bottom-hint>span:last-child{display:none}.hero-orbit{display:none}}
@media(max-height:600px) and (min-width:531px){.topbar{min-height:39px;padding-top:3px;padding-bottom:3px}.footer{height:17px;min-height:17px}.view{padding:5px}.menu-screen{padding:12px 22px}.menu-content h1{font-size:clamp(39px,9vh,67px);line-height:.9}.eyebrow{font-size:10px;margin-bottom:5px}.menu-lede{font-size:12px;margin:8px 0}.menu-badges{margin-bottom:8px}.menu-badges span{font-size:10px;padding:4px 6px}.menu-subactions{margin-top:7px}.small-progress{margin-top:5px}.primary.large{min-height:40px;padding:7px 12px;font-size:13px}.hero-art{height:100%;min-height:110px}.hero-text{font-size:9px;padding:6px}.game-screen{gap:4px}.game-hud{min-height:32px}.jar-wrap{width:min(100%,calc((100dvh - 109px)*.778))}.game-side{gap:5px}.next-box,.side-stat{padding:7px}.next-orb{font-size:23px}.tool-button{min-height:40px}.bottom-hint{height:16px}}
@media(max-height:470px){.topbar{min-height:32px}.view{padding:3px}.footer{height:12px;min-height:12px;font-size:7px}.menu-screen{padding:8px 16px}.menu-content h1{font-size:clamp(30px,10vh,46px)}.eyebrow{margin:0 0 3px}.menu-lede{margin:5px 0;font-size:11px}.menu-badges{margin-bottom:5px}.primary.large{min-height:36px;padding:4px 10px}.small-progress{display:none}.game-hud{min-height:28px}.game-screen{gap:2px}.bottom-hint{height:13px}.jar-wrap{width:min(100%,calc((100dvh - 92px)*.778))}}
@media(max-width:530px) and (max-height:620px){.menu-content h1{font-size:clamp(38px,12vw,58px)}.eyebrow{font-size:9px;margin-bottom:4px}.menu-lede{margin:7px 0;font-size:11px}.menu-badges{margin-bottom:5px}.menu-badges span{font-size:9px}.menu-subactions{margin-top:8px}.small-progress{margin-top:7px}.jar-wrap{height:min(100%,calc(100dvh - 184px))}.game-side{gap:3px}.tool-button{min-height:40px}}