:root,.dark{--background:#101b23;--foreground:#fff7df;--card:#192b33;--card-foreground:#fff7df;--popover:#192b33;--popover-foreground:#fff7df;--primary:#d9f36b;--primary-foreground:#152b29;--secondary:#263c42;--secondary-foreground:#fff7df;--muted:#263c42;--muted-foreground:#a7bbb7;--accent:#d9f36b;--accent-foreground:#152b29;--destructive:#f18b77;--border:#3b5154;--input:#3b5154;--ring:#d9f36b;--radius:1rem}*{box-sizing:border-box}body{color:#fff7df;background:#101b23;margin:0;font-family:Arial,Helvetica,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}:is(button:focus-visible,a:focus-visible){outline-offset:5px;outline:3px solid #d9f36b}button{touch-action:manipulation}.arcade{max-width:1500px;margin:auto;padding:0 40px}header{justify-content:space-between;align-items:center;height:104px;display:flex}.brand{color:#fff7df;letter-spacing:-1px;align-items:center;gap:12px;font-size:38px;font-weight:1000;line-height:.85;text-decoration:none;display:flex}.brand>span{font-size:24px}.brand-small{letter-spacing:2.3px;margin-top:7px;font-size:10px;display:block}.edition{letter-spacing:2.5px;color:#b9c9c4;font-size:12px;font-weight:700}.header-actions{gap:10px;display:flex}.header-actions button{color:#fff7df;background:#20313a;border:1px solid #3b4b50;border-radius:50%;place-items:center;width:44px;height:44px;display:grid}.game-frame{isolation:isolate;background:#1d4445;border:1px solid #567063;border-radius:22px;height:min(72vw,690px,100svh - 165px);min-height:430px;position:relative;overflow:hidden;box-shadow:0 24px 70px #0005}.garden{z-index:-2;background:url(/bob/garden.png) 50% 55%/cover;position:absolute;inset:0}.game-frame:before{content:"";z-index:-1;background:linear-gradient(90deg,#081e24ed 0%,#102a2377 48%,#0000 75%);position:absolute;inset:0}.start-screen{z-index:3;position:absolute;top:14%;left:6%}.eyebrow{letter-spacing:2.2px;color:#d9f36b;align-items:center;gap:9px;font-size:12px;font-weight:800;display:flex}.eyebrow>span{background:#d9f36b;border-radius:50%;width:7px;height:7px;box-shadow:0 0 12px #d9f36b}h1{letter-spacing:1px;color:#fff8de;text-shadow:4px 6px #102e2b;margin:24px 0;font-family:Impact,Arial Black,sans-serif;font-size:clamp(58px,7.5vw,105px);line-height:.9;transform:rotate(-3deg)}h1 em{color:#d9f36b;font-size:.79em;font-style:normal}.start-screen p{color:#d7e1d1;margin:28px 0;font-size:18px;line-height:1.6}.play{color:#20362a;background:#d9f36b;border:0;border-radius:12px;justify-content:center;align-items:center;gap:36px;padding:19px 27px;font-size:18px;font-weight:900;transition:transform .15s;display:flex;box-shadow:0 5px #7b9c36}.play:hover{transform:translateY(-2px)}.start-note{color:#abc0b0;letter-spacing:.5px;margin-top:22px;font-size:12px}.hero-snail{filter:drop-shadow(4px 14px 8px #13201388);font-size:clamp(130px,19vw,270px);animation:3s ease-in-out infinite bob;position:absolute;bottom:18%;right:13%;transform:rotate(-6deg)}.stage-label{align-items:center;gap:12px;font-size:18px;font-weight:800;display:flex;position:absolute;bottom:22px;right:24px}.stage-label span{letter-spacing:2px;font-size:11px}footer{color:#91a9a4;justify-content:space-between;align-items:center;padding:25px 3px;font-size:13px;display:flex}footer>div{align-items:center;gap:10px;display:flex}footer>span{font-size:12px}@keyframes bob{50%{transform:translateY(-10px)rotate(-4deg)}}@media (max-width:700px){.arcade{padding:0 12px}header{height:78px}.edition{display:none}.game-frame{height:75svh;min-height:510px}.start-screen{top:10%;left:7%}h1{font-size:66px}.start-screen p{font-size:16px}.hero-snail{opacity:1;font-size:150px;bottom:9%;right:4%}.stage-label{display:none}footer{font-size:12px}footer>span{display:none}}@media (max-height:600px) and (orientation:landscape){header{height:60px}.game-frame{height:calc(100svh - 78px);min-height:280px}.start-screen{top:9%}h1{margin:14px 0;font-size:54px}.start-screen p{margin:12px 0;font-size:14px}.start-note,footer,.eyebrow{display:none}.play{padding:12px 22px}.hero-snail{font-size:170px}}.how{color:#d5e4c3;text-underline-offset:4px;background:0 0;border:0;margin-top:19px;padding:0;font-size:13px;text-decoration:underline;display:block}.help{color:#e2eddb;background:#102a2ae8;border-radius:12px;max-width:380px;margin-top:14px;padding:12px;font-size:14px;line-height:1.7}.in-game:before{background:linear-gradient(#041e2470,#0000 40%,#0b1c2344)}.game-canvas{touch-action:none;width:100%;height:100%;position:absolute;inset:0}.hud{pointer-events:none;justify-content:space-between;align-items:flex-start;gap:20px;display:flex;position:absolute;top:25px;left:26px;right:26px}.energy-box{background:#102a2ce8;border:1px solid #68827266;border-radius:12px;width:240px;padding:13px 15px}.energy-title{justify-content:space-between;align-items:center;font-size:12px;font-weight:700;display:flex}.energy-title b{color:#d6e4cd;font-size:11px}.energy-meter{background:#071b23;border-radius:10px;height:11px;margin:8px 0;overflow:hidden}.energy-meter i{background:linear-gradient(90deg,#9ecf66,#ddf784);border-radius:10px;height:100%;transition:width .15s;display:block}.energy-caption{letter-spacing:1.2px;color:#a9beb0;font-size:8px}.stage-info{text-align:center;text-shadow:0 2px 5px #000}.stage-info span,.score span{color:#d9f36b;letter-spacing:2px;margin-bottom:8px;font-size:10px;font-weight:800;display:block}.stage-info strong{font-size:20px}.score{text-align:right;min-width:100px}.score strong{color:#fff3cf;letter-spacing:2px;text-shadow:0 2px 5px #000;font-family:monospace;font-size:28px}.notice{color:#edffc6;white-space:nowrap;pointer-events:none;background:#102a2bea;border:1px solid #bfd97480;border-radius:40px;padding:13px 25px;font-size:15px;font-weight:700;position:absolute;top:25%;left:50%;transform:translate(-50%)}.combo{color:#f5e590;text-shadow:3px 3px #183832;font-size:40px;font-style:italic;font-weight:1000;position:absolute;top:24%;right:35px}.combo small{font-size:12px;display:block}.touch-controls{pointer-events:none;justify-content:space-between;align-items:flex-end;display:flex;position:absolute;bottom:25px;left:32px;right:30px}.joystick{color:#e8f5d443;pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none;background:#102a2b80;border:2px solid #d5efcf50;border-radius:50%;place-items:center;width:124px;height:124px;display:grid;position:relative}.knob{background:radial-gradient(circle at 35% 25%,#edf6d4,#a0b797);border:3px solid #e6efd2;border-radius:50%;width:57px;height:57px;position:absolute;box-shadow:0 5px 10px #001a2866}.attack-buttons{align-items:flex-end;gap:14px;display:flex}.attack-btn{color:#ebf7dd;pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none;background:#304e51;border:3px solid #e5edc49c;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;gap:3px;width:86px;height:86px;display:flex;box-shadow:0 5px #0e252c}.attack-btn b{letter-spacing:.7px;font-size:11px}.attack-btn small{opacity:.6;font-size:9px}.attack-btn.spin{color:#294232;background:#d9f36b;border-color:#efffac;width:105px;height:105px;box-shadow:0 5px #769849}.attack-btn.boom{color:#513826;background:#f3b389;border-color:#ffe3b8}.attack-btn:disabled{filter:saturate(.5);opacity:.65}.attack-btn:active{transform:translateY(3px)}.boom-icon{font-size:29px;line-height:1}.end-overlay{-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);z-index:10;background:#091d2ac9;place-items:center;display:grid;position:absolute;inset:0}.end-card{text-align:center;max-width:440px;padding:25px}.end-emoji{font-size:65px}.end-card .eyebrow{margin-top:14px;display:block}.end-card h2{color:#ddf386;margin:15px 0;font-family:Impact,Arial Black,sans-serif;font-size:60px}.end-card p{color:#c3d6cd;font-size:16px;line-height:1.6}.end-card .play{margin:22px auto 0}.garden-1{filter:hue-rotate(20deg)saturate(.9)}.garden-2{filter:hue-rotate(-20deg)saturate(1.15)}@media (max-width:700px){.in-game{height:75svh;min-height:530px}.hud{gap:12px;top:14px;left:12px;right:12px}.energy-box{width:155px;padding:10px}.energy-title{font-size:10px}.energy-title b{font-size:9px}.energy-caption{letter-spacing:.3px;font-size:7px}.stage-info{text-align:left;position:absolute;top:83px;left:0}.stage-info strong{font-size:14px}.stage-info span{margin-bottom:4px;font-size:9px}.score strong{font-size:22px}.notice{white-space:normal;text-align:center;max-width:94%;padding:10px 14px;font-size:11px;top:30%}.touch-controls{bottom:25px;left:16px;right:16px}.joystick{width:100px;height:100px}.attack-buttons{gap:7px}.attack-btn{width:62px;height:62px}.attack-btn.spin{width:76px;height:76px}.attack-btn small{display:none}.attack-btn svg{width:23px}.attack-btn b{font-size:9px}.combo{font-size:30px;top:20%;right:16px}.end-card h2{font-size:44px}.hero-snail{pointer-events:none}.help{z-index:4;position:relative}}@media (max-height:600px) and (orientation:landscape){.in-game{height:calc(100svh - 76px);min-height:280px}.hud{top:12px;left:15px;right:15px}.energy-box{width:180px;padding:8px 12px}.energy-caption{display:none}.stage-info{text-align:center;position:static}.stage-info strong{font-size:16px}.stage-info span{margin-bottom:4px;font-size:9px}.touch-controls{bottom:15px;left:20px;right:20px}.joystick{width:88px;height:88px}.attack-btn{width:64px;height:64px}.attack-btn.spin{width:78px;height:78px}.attack-btn small{display:none}.notice{padding:9px 15px;font-size:12px;top:27%}.end-emoji{font-size:35px}.end-card h2{margin:9px;font-size:38px}.end-card p{margin:9px;font-size:14px}.end-card .play{margin-top:12px}.end-card .eyebrow{display:none}.help{font-size:12px;line-height:1.4}.how{margin-top:12px}}@media (prefers-reduced-motion:reduce){.hero-snail{animation:none}.play,.energy-meter i{transition:none}}.help-title{color:#d9f36b;margin:24px 0 18px;font-family:Impact,Arial Black,sans-serif;font-size:44px}.start-screen .help{margin:0 0 24px;line-height:1.8}.route-progress{background:#0a202ac9;border-radius:8px;width:150px;height:5px;margin:12px auto 0;overflow:hidden}.route-progress i{background:#d9f36b;height:100%;transition:width .12s;display:block}.weapon-status{pointer-events:none;background:#0d292de8;border:1px solid #d9f36b;border-radius:10px;align-items:center;gap:10px;padding:9px 13px;display:flex;position:absolute;top:128px;left:27px}.weapon-status>span{font-size:25px}.weapon-status b{font-size:13px;display:block}.weapon-status small{color:#c2d2be;margin-top:4px;font-size:10px;display:block}.go-arrow{color:#edff96;text-shadow:2px 3px #1d442b;pointer-events:none;align-items:center;gap:8px;font-family:Impact,sans-serif;font-size:31px;animation:1.5s ease-in-out infinite bob;display:flex;position:absolute;top:40%;right:28px}.attack-btn.grab{background:#628b88;border-color:#a5d4c0;width:72px;height:72px}.attack-btn.grab>span{font-size:24px}.weapon-icon{font-size:29px;line-height:1}.attack-buttons{gap:10px}.attack-btn.boom{width:76px;height:76px}.attack-btn:disabled{cursor:default}.notice{white-space:normal;text-align:center;max-width:62%;font-size:14px}@media (max-width:900px){.attack-buttons{gap:7px}.attack-btn.grab{width:62px;height:62px}.attack-btn.boom{width:66px;height:66px}.weapon-status{top:120px;left:16px}.weapon-status small{max-width:160px}.notice{max-width:78%;top:34%}}@media (max-width:700px){.attack-btn.grab{width:52px;height:52px}.attack-btn.boom{width:55px;height:55px}.attack-buttons{gap:5px}.attack-btn.spin{width:68px;height:68px}.attack-btn.jump{width:55px;height:55px}.touch-controls{left:10px;right:10px}.joystick{width:86px;height:86px}.knob{width:48px;height:48px}.weapon-status{padding:7px 9px;top:88px;left:auto;right:12px}.weapon-status small{max-width:132px;font-size:9px}.weapon-status b{font-size:11px}.weapon-status>span{font-size:20px}.route-progress{width:115px;margin-top:7px}.go-arrow{font-size:25px;top:43%;right:15px}.notice{max-width:92%;font-size:11px;top:33%}.attack-btn.grab>span{font-size:20px}.weapon-icon{font-size:23px}}@media (max-height:600px) and (orientation:landscape){.weapon-status{padding:5px 9px;top:77px;left:15px;right:auto}.weapon-status small{font-size:9px}.weapon-status>span{font-size:18px}.weapon-status b{font-size:11px}.notice{font-size:11px;top:35%}.route-progress{margin-top:6px}.attack-btn.grab,.attack-btn.boom{width:58px;height:58px}.go-arrow{top:39%}}@media (max-width:1000px){footer>span{display:none}}.hero-snail .bob-icon{object-fit:contain;width:1em;height:1em}.end-emoji .bob-icon{width:1em;height:1em}
