@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Space+Grotesk:wght@500;600;700&display=swap');
:root{color-scheme:dark;--bg:#0b1220;--card:#111c2d;--line:#25344a;--muted:#91a2b9;--green:#a3e635;--cyan:#38bdf8}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 50% -25%,#20334b 0%,var(--bg) 58%);color:#f2f6fc;font-family:'DM Sans',system-ui,sans-serif;padding:0 18px env(safe-area-inset-bottom)}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--green);outline-offset:3px}.app{width:min(100%,760px);margin:auto;padding:24px 0 22px}.topbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:23px}.brand{color:inherit;text-decoration:none;display:flex;align-items:center;gap:11px}.brand-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:#1d2b3e;font-size:23px}.brand strong{display:block;font:700 18px 'Space Grotesk',sans-serif}.eyebrow{display:block;font-size:9px;letter-spacing:2px;color:var(--green);font-weight:800;margin:0 0 3px}.header-actions{display:flex;gap:8px}.share-button,.install-button,.orientation-button,.guide-button,.secondary-button,.back-button{border:1px solid var(--line);border-radius:11px;background:#162337;color:#e0e9f4;padding:9px 12px;font-weight:700;font-size:12px}.hero{display:flex;align-items:center;justify-content:space-between;padding:24px 27px;border:1px solid #30415a;border-radius:22px;background:linear-gradient(115deg,#182b44,#203c46 68%,#244c47);overflow:hidden}.hero h1{font:700 clamp(25px,6vw,37px) 'Space Grotesk',sans-serif;margin:6px 0}.hero p:not(.eyebrow){font-size:13px;color:#c1cede;margin:0;max-width:390px}.hero-art{font-size:64px;filter:drop-shadow(0 10px 20px #0006);transform:rotate(-12deg)}.section-heading{display:flex;align-items:center;justify-content:space-between;margin:25px 2px 12px}.section-heading h2{font:700 19px 'Space Grotesk',sans-serif;margin:0 0 3px}.section-heading p{font-size:11px;color:var(--muted);margin:0}.count-pill{font-size:10px;color:#d4e3f4;background:#1b2a3e;border-radius:99px;padding:6px 10px}.filters{display:flex;gap:7px;margin:0 0 13px}.filter{border:1px solid var(--line);border-radius:30px;background:#111c2d;color:#aebdd0;padding:7px 13px;font-size:11px;font-weight:700}.filter.active{background:var(--green);border-color:var(--green);color:#17200c}.game-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}.game-card{border:1px solid #25364d;border-radius:16px;background:linear-gradient(145deg,#142238,#101a2a);min-height:128px;padding:13px;text-align:left;transition:transform .15s,border-color .15s;display:flex;flex-direction:column;align-items:flex-start}.game-card:hover{transform:translateY(-2px);border-color:#8ca0b7}.card-top{width:100%;display:flex;align-items:center;justify-content:space-between}.card-emoji{font-size:28px}.tag{font-size:8px;text-transform:uppercase;letter-spacing:.8px;color:#b9d6a0;background:#283d31;padding:4px 6px;border-radius:20px}.game-card h3{font:700 13px 'Space Grotesk',sans-serif;margin:8px 0 3px}.game-card p{font-size:10px;line-height:1.45;color:#96a7bc;margin:0}.install-card{display:flex;gap:13px;margin-top:17px;padding:14px 16px;border:1px solid #25344a;background:#101a29;border-radius:15px}.install-symbol{font-size:20px;width:38px;height:38px;flex:none;display:grid;place-items:center;border-radius:12px;background:#1b2a3e}.install-card h3{font:600 13px 'Space Grotesk',sans-serif;margin:1px 0 4px}.install-card p{font-size:11px;line-height:1.55;color:#9babc0;margin:0}.install-card strong{color:#e2eaf4}footer{text-align:center;color:#65778d;font-size:10px;padding:20px 0 0}.play-view{position:relative}.play-view[hidden],.home-view[hidden]{display:none}.play-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:17px}.back-button{font-size:11px}.orientation-tools{display:flex;gap:7px;align-items:center}.orientation-label{font-size:10px;color:#9babc0}.orientation-button{font-size:10px;padding:8px}.play-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}.play-heading>div{display:grid;grid-template-columns:42px auto;grid-template-rows:auto auto;column-gap:10px;align-items:center}.play-emoji{grid-row:1/3;font-size:31px}.play-heading h1{font:700 21px 'Space Grotesk',sans-serif;margin:0}.play-heading p{font-size:11px;color:var(--muted);margin:2px 0 0}.guide-button{font-size:10px}.game-stage{width:min(100%,510px);margin:auto;position:relative;overflow:hidden;border-radius:20px;border:1px solid #2a3d54;background:#09101b;box-shadow:0 18px 55px #0005;touch-action:none;transition:width .22s,height .22s}.game-stage.vertical{height:min(65vh,630px);min-height:360px}.game-stage.horizontal{width:100%;height:min(52vh,430px);min-height:250px}.game-stage canvas{display:block;width:100%;height:100%;touch-action:none}.game-overlay{position:absolute;inset:0;display:grid;place-items:center;background:#07101ad9;padding:14px;transition:opacity .2s}.game-overlay.hidden{opacity:0;pointer-events:none}.overlay-card{text-align:center;width:min(100%,320px);padding:19px;border:1px solid #364962;border-radius:17px;background:#111d2fef;box-shadow:0 15px 35px #0006}.overlay-emoji{font-size:35px}.overlay-card h2{font:700 21px 'Space Grotesk',sans-serif;margin:7px 0}.overlay-card p{white-space:pre-line;color:#b1bfd1;font-size:12px;line-height:1.55;margin:0 0 15px}.primary-button{border:0;border-radius:11px;background:var(--green);color:#17200c;padding:11px 16px;font-weight:800;font-size:12px}.play-controls{display:flex;justify-content:space-between;align-items:center;gap:8px;width:min(100%,510px);margin:10px auto}.play-controls p{font-size:10px;color:#91a2b9;margin:0;flex:1}.secondary-button{padding:8px 10px;font-size:10px}.fire-button{border:0;border-radius:50%;width:56px;height:56px;background:linear-gradient(145deg,#fb7185,#be123c);box-shadow:0 0 22px #fb718577;color:#fff;font-weight:900;font-size:20px;touch-action:none;display:flex;flex-direction:column;align-items:center;justify-content:center;flex:none}.fire-button span{font-size:8px}.fire-button[hidden]{display:none}.guide-panel{position:absolute;z-index:3;top:155px;left:50%;transform:translateX(-50%);width:min(calc(100% - 20px),390px);padding:18px;border-radius:17px;border:1px solid #41536c;background:#111d2ff5;box-shadow:0 15px 50px #000a}.guide-panel[hidden]{display:none}.guide-panel>div{display:flex;justify-content:space-between}.guide-kicker{font-size:9px;letter-spacing:1.4px;font-weight:800;color:var(--green)}.close-guide{border:0;background:none;color:#b1bfd1;font-size:22px;line-height:1}.guide-panel h2{font:700 19px 'Space Grotesk',sans-serif;margin:5px 0 9px}.guide-panel ol{padding-left:20px;margin:0 0 13px}.guide-panel li{font-size:12px;line-height:1.6;color:#c2cede;padding:3px 0}.guide-panel .primary-button{width:100%}.no-scroll{overflow:hidden}@media(max-width:520px){body{padding-left:13px;padding-right:13px}.app{padding-top:17px}.hero{padding:19px}.hero-art{font-size:47px}.game-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.game-card{min-height:120px;padding:11px}.play-top{align-items:flex-start}.orientation-tools{flex-direction:column;align-items:flex-end;gap:4px}.game-stage.vertical{height:min(64svh,620px);min-height:340px}.game-stage.horizontal{height:min(44svh,390px);min-height:220px}.play-heading h1{font-size:18px}.guide-button{padding:8px}.orientation-label{font-size:9px}.game-stage.orientation-lock{max-width:430px}.play-controls p{max-width:45%}.play-view.portrait-mode{position:fixed;z-index:10;inset:0;padding:10px 14px;background:#0b1220;display:flex;flex-direction:column;justify-content:center}.portrait-mode .play-top{width:100%;margin-bottom:6px}.portrait-mode .play-heading{margin:0 auto 5px;width:min(100%,430px)}.portrait-mode .game-stage{width:min(100%,430px);height:min(68svh,650px);min-height:240px}.portrait-mode .play-controls{width:min(100%,430px)}.play-view.landscape-mode{position:fixed;z-index:10;inset:0;padding:10px 14px;background:#0b1220;display:flex;flex-direction:column;justify-content:center}.landscape-mode .play-top{width:100%;margin-bottom:6px}.landscape-mode .play-heading{margin:0 auto 5px;width:min(100%,760px)}.landscape-mode .game-stage{width:min(100%,850px);height:min(68svh,550px);min-height:180px}.landscape-mode .play-controls{width:min(100%,850px)}.landscape-mode .guide-panel,.portrait-mode .guide-panel{position:fixed;top:50%;transform:translate(-50%,-50%)}.no-scroll{overflow:hidden}}