@font-face{font-family:Pixel;src:url('./pixel.woff2') format('woff2');font-display:swap}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#102e29}body{color:#b5c9ae;font-family:Arial,sans-serif;display:grid;place-items:center;min-height:100svh;background-image:linear-gradient(90deg,transparent 49.8%,#ffffff03 50%,transparent 50.2%)}main{width:min(440px,calc((100svh - 100px)*.5625),calc(100vw - 32px));padding:0}.arcade-label{display:flex;justify-content:space-between;align-items:center;font-size:8px;font-weight:700;letter-spacing:1.5px;padding-bottom:13px;color:#89a59a}.arcade-label span:nth-child(2){font-size:7px}#cabinet{position:relative;width:100%;aspect-ratio:9/16;container-type:inline-size;isolation:isolate;overflow:hidden;background:#8edbd4;outline:5px solid #244c3e;box-shadow:0 0 0 7px #091f1c,0 20px 60px #0005;touch-action:manipulation;user-select:none}#game,#game canvas{position:absolute;inset:0;width:100%!important;height:100%!important;image-rendering:pixelated}button{cursor:pointer;font-family:Pixel,monospace;touch-action:manipulation}button:focus-visible{outline:3px solid #fff;outline-offset:5px}button:active{transform:translateY(3px);box-shadow:none}.topbar{position:absolute;top:calc(var(--ui) * 4);left:calc(var(--ui) * 5);right:calc(var(--ui) * 4);display:flex;align-items:center;justify-content:space-between;z-index:5}.edition{font-family:Pixel,monospace;font-size:calc(var(--ui) * 2.1);color:#285b4e}.topbar>div{display:flex;gap:calc(var(--ui) * 2)}.icon-button{position:relative;width:calc(var(--ui) * 9);height:calc(var(--ui) * 9);background:#e9f4bcad;color:#315b44;border:2px solid #386d54;font-size:calc(var(--ui) * 4.6);line-height:1}.icon-button span{position:absolute;font-family:Arial;font-size:calc(var(--ui) * 3.5);bottom:0;right:calc(var(--ui) * 1);color:#af4930}#score{position:absolute;top:calc(var(--ui) * 16);left:0;right:0;text-align:center;font-family:Pixel;font-size:calc(var(--ui) * 13);color:#fffde1;text-shadow:3px 0 #344b3a,-3px 0 #344b3a,0 3px #344b3a,0 -3px #344b3a,3px 5px #344b3a}.overlay{position:absolute;inset:0;text-align:center;font-family:Pixel,monospace;color:#fff3c0}.title{position:absolute;top:calc(var(--ui) * 29);left:0;right:0;text-shadow:3px 0 #344630,-3px 0 #344630,0 -3px #344630,0 3px #344630,4px 6px #344630}.title span{display:block;font-size:calc(var(--ui) * 13.8);color:#fff4bd;letter-spacing:calc(var(--ui) * -.7)}.title strong{display:block;font-size:calc(var(--ui) * 18.5);color:#ffc958;line-height:1.3;letter-spacing:calc(var(--ui) * -1)}.title small{display:block;color:#365c43;font-size:calc(var(--ui) * 2.5);letter-spacing:calc(var(--ui) * .3);text-shadow:none;margin-top:calc(var(--ui) * 4)}.start-controls{position:absolute;top:calc(var(--ui) * 109);left:0;right:0}.pixel-button{display:block;margin:auto;background:#e9943c;border:3px solid #4e3d2c;color:#fff7d4;text-shadow:2px 2px #a65b2c;box-shadow:inset 0 3px #ffcf73,inset 0 -4px #bf612f,0 4px #fff2b4,0 7px #4e3d2c;font-size:calc(var(--ui) * 4.6);min-width:calc(var(--ui) * 52);padding:calc(var(--ui) * 5.4) calc(var(--ui) * 5);line-height:1.1}.pixel-button span{font-size:calc(var(--ui) * 4);margin-left:calc(var(--ui) * 3)}p{font-size:calc(var(--ui) * 2.3);line-height:1.8}.start-controls p{color:#335844;margin-top:calc(var(--ui) * 7)}.snake-tip{margin:calc(var(--ui) * 7) auto 0;font-size:calc(var(--ui) * 2.1);color:#335844;display:flex;align-items:center;justify-content:center;gap:calc(var(--ui) * 2)}.snake-tip b{background:#406849;color:#fff6af;padding:calc(var(--ui) * 1.8);font-size:calc(var(--ui) * 2.8)}.snake-icon{font-family:Arial;font-size:calc(var(--ui) * 9);color:#548032;font-weight:900;line-height:.3}.bottom-stamp{position:absolute;bottom:calc(var(--ui) * 4.6);left:0;right:0;text-align:center;font-family:Pixel;font-size:calc(var(--ui) * 1.7);letter-spacing:calc(var(--ui) * .25);color:#97704a}#over{background:#385c3e18;padding-top:calc(var(--ui) * 36)}h1{font-size:calc(var(--ui) * 7.5);text-shadow:3px 3px #67402c,-2px -2px #67402c;color:#fff0af;margin:0 0 calc(var(--ui) * 4)}.over-sub{font-size:calc(var(--ui) * 1.9);color:#335844}.result{width:calc(var(--ui) * 78);margin:calc(var(--ui) * 9) auto calc(var(--ui) * 8);display:flex;align-items:center;justify-content:space-between;border:3px solid #705137;background:#efe0a5;box-shadow:inset 0 3px #fff7cc,0 4px #fff0b1,0 7px #705137;padding:calc(var(--ui) * 6);color:#795339}.medal{display:grid;place-items:center;width:calc(var(--ui) * 24);height:calc(var(--ui) * 24);background:#ddaa53;border:4px solid #a87a38;box-shadow:inset 0 0 0 3px #f8d27b;color:#fff0a6;font-size:calc(var(--ui) * 14)}.stats{text-align:right;display:flex;flex-direction:column;gap:calc(var(--ui) * 3)}.stats span{font-size:calc(var(--ui) * 2.5)}.stats strong{font-size:calc(var(--ui) * 7);color:#fffbe0;text-shadow:2px 2px #6c5639,-1px -1px #6c5639}.stats b{color:#bc592c;font-size:calc(var(--ui) * 1.6)}.text-button{display:block;margin:calc(var(--ui) * 8) auto;background:none;border:0;color:#355740;font-size:calc(var(--ui) * 2.5);padding:calc(var(--ui) * 4)}#paused{background:#153e37d9;z-index:4;padding-top:calc(var(--ui) * 61)}#paused .pixel-button{margin-top:calc(var(--ui) * 11)}#paused p{margin-top:calc(var(--ui) * 9)}#bonus{position:absolute;pointer-events:none;left:35%;top:42%;font-family:Pixel;color:#fff6a6;font-size:calc(var(--ui) * 7);text-shadow:2px 2px #406d32;animation:bonus .8s forwards}@keyframes bonus{to{transform:translateY(-45px);opacity:0}}[hidden]{display:none!important}footer{display:flex;justify-content:space-between;font-size:10px;gap:10px;padding-top:19px;color:#91ada0}kbd{border:1px solid #486a5a;padding:3px 5px;font-size:9px;border-radius:2px;color:#c4d5bc}footer span:last-child{color:#748f80}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}@media(max-width:500px){main{width:min(100vw,calc(100svh*.5625))}.arcade-label,footer{display:none}#cabinet{outline:0;box-shadow:none}}@media(prefers-reduced-motion:reduce){#bonus{animation:none}}

/* Reference artwork: sky blue, jungle green, parchment and dark pixel outlines. */
html,body{background:#20271b}body{background-image:none}.arcade-label{color:#a7af92}#cabinet{background:#c6e9f2;outline-color:#475638;box-shadow:0 0 0 7px #11180f,0 20px 60px #0005}.edition{color:#4c593d}.icon-button{background:#eff1d5b8;border-color:#515a36;color:#475638}#score{top:calc(var(--ui) * 27);color:#fffef1;font-size:calc(var(--ui) * 12);text-shadow:3px 0 #28231b,-3px 0 #28231b,0 3px #28231b,0 -3px #28231b,3px 5px #28231b;pointer-events:none}.title{top:calc(var(--ui) * 28);text-shadow:3px 0 #3f2c1c,-3px 0 #3f2c1c,0 -3px #3f2c1c,0 3px #3f2c1c,4px 6px #3f2c1c}.title span{color:#fff5cb}.title strong{color:#e8c271}.title small{color:#465537}.pixel-button{background:#789b3e;border-color:#3a4327;box-shadow:inset 0 3px #b7ce72,inset 0 -4px #526f2b,0 4px #f5eabe,0 7px #3a4327;text-shadow:2px 2px #4a632b}.start-controls p,.snake-tip{color:#283d28;text-shadow:0 1px #eef7de,1px 0 #eef7de,-1px 0 #eef7de,0 -1px #eef7de}.snake-tip b{background:#506d2c;text-shadow:none}.bottom-stamp{display:none}.result{background:#ede2bf;border-color:#6e604a}.text-button,.over-sub{color:#283d28;text-shadow:0 1px #f2f4d9,1px 0 #f2f4d9,-1px 0 #f2f4d9,0 -1px #f2f4d9}#over{background:#e5ebcf25}#paused{background:#202e23d9}footer{color:#acb397}footer span:last-child{color:#8e9c7c}

/* Fill the viewport; size game UI by the shorter portrait dimension. */
html,body{width:100%;height:100%;min-height:0;overflow:hidden;overscroll-behavior:none}
body{display:block}main{position:fixed;inset:0;width:100%;height:100%;padding:0}
.arcade-label,footer{display:none}
#cabinet{--ui:min(1vw,0.5625dvh);width:100%;height:100%;aspect-ratio:auto;outline:0;box-shadow:none;container-type:normal}
.topbar{top:max(12px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right))}
.icon-button{min-width:36px;min-height:36px}.edition{font-size:clamp(8px,calc(var(--ui)*2.1),14px)}
#bonus{left:var(--player-screen-x,27.4%)}
@media(max-height:450px){.snake-tip{margin-top:calc(var(--ui)*4)}.icon-button{min-width:30px;min-height:30px}}

/* Pixel controls match the supplied beveled beige buttons. */
.topbar>div{gap:clamp(10px,calc(var(--ui)*3),18px)}
.icon-button{display:grid;place-items:center;flex:none;width:clamp(40px,calc(var(--ui)*9),68px);height:clamp(40px,calc(var(--ui)*9),68px);padding:4px;background:#d8d7b1;border:clamp(5px,calc(var(--ui)*1.2),8px) solid;border-color:#f0f3d7 #899272 #64704d #a6ae87;outline:2px solid #303719;box-shadow:3px 4px 0 #405440,inset 0 0 0 1px #edf0d2;color:#303719;border-radius:0}
.icon-button:active{transform:translate(1px,2px);border-color:#65704d #a6ae87 #e8eccb #899272;box-shadow:1px 2px #405440}
.pixel-icon{display:block;width:100%;height:100%;overflow:visible;image-rendering:pixelated;flex:none}
#sound-off[hidden]{display:none}
.start-controls{top:65%;bottom:auto}
#play{min-width:calc(var(--ui)*52)}
#over{padding-top:max(14dvh,80px)}
#defeat-title{max-width:calc(var(--ui)*96);margin:0 auto calc(var(--ui)*3);font-size:clamp(14px,calc(var(--ui)*4.4),35px);line-height:1.38;text-wrap:balance}
.over-sub{max-width:calc(var(--ui)*90);margin:0 auto;font-size:clamp(10px,calc(var(--ui)*2.35),16px);line-height:1.7}
#retry,#home{display:flex;align-items:center;justify-content:center;gap:calc(var(--ui)*4);width:calc(var(--ui)*76);min-width:0}
#retry .pixel-icon,#home .pixel-icon{width:calc(var(--ui)*6);height:calc(var(--ui)*6);filter:drop-shadow(2px 2px 0 #35502c)}
#retry{font-size:calc(var(--ui)*4);padding:calc(var(--ui)*4.4) calc(var(--ui)*4)}
#home{margin:calc(var(--ui)*7) auto 0;background:#4383b5;border-color:#243f5d;color:#f2f7db;box-shadow:inset 0 3px #92cbe3,inset 0 -4px #285787,0 4px #dce9c8,0 7px #243f5d;text-shadow:2px 2px #294e75;font-size:calc(var(--ui)*2.65);padding:calc(var(--ui)*3.7) calc(var(--ui)*3)}
#home .pixel-icon{filter:drop-shadow(2px 2px 0 #294e75)}
@media(max-height:450px){#over{padding-top:17dvh}.result{margin:calc(var(--ui)*5) auto calc(var(--ui)*6)}#home{margin-top:calc(var(--ui)*5)}}

/* Defeat screen: compact pixel UI and a dedicated PIXCOMP banner. */
.topbar{justify-content:flex-end}.topbar>div{margin-left:auto}
.ad-banner-slot{width:calc(var(--ui)*82);min-height:calc(var(--ui)*17);margin:0 auto calc(var(--ui)*5);pointer-events:auto}.ad-banner-slot .pixcomp-banner{width:100%;min-height:calc(var(--ui)*17);margin:0}.ad-banner-slot--disabled{display:block;background:#fffaf0;border:calc(var(--ui)*.8) solid #21180f;box-shadow:0 calc(var(--ui)*1.2) 0 #21180f,inset 0 0 0 calc(var(--ui)*.8) #f1c954;overflow:hidden}.legacy-display-slot{width:100%;min-height:calc(var(--ui)*17);background:#fffaf0}.pixcomp-banner{display:grid;grid-template-columns:calc(var(--ui)*16) 1fr calc(var(--ui)*16);align-items:center;gap:calc(var(--ui)*2);width:calc(var(--ui)*82);min-height:calc(var(--ui)*17);margin:0 auto calc(var(--ui)*5);padding:calc(var(--ui)*2) calc(var(--ui)*3);color:#21180f;text-decoration:none;background:#fffaf0;border:calc(var(--ui)*.8) solid #21180f;box-shadow:0 calc(var(--ui)*1.2) 0 #21180f,inset 0 0 0 calc(var(--ui)*.8) #f1c954;clip-path:polygon(calc(var(--ui)*2) 0,calc(100% - calc(var(--ui)*2)) 0,calc(100% - calc(var(--ui)*2)) calc(var(--ui)*1),100% calc(var(--ui)*1),100% calc(100% - calc(var(--ui)*2)),calc(100% - calc(var(--ui)*2)) calc(100% - calc(var(--ui)*2)),calc(100% - calc(var(--ui)*2)) 100%,calc(var(--ui)*2) 100%,calc(var(--ui)*2) calc(100% - calc(var(--ui)*1)),0 calc(100% - calc(var(--ui)*1)),0 calc(var(--ui)*2),calc(var(--ui)*2) calc(var(--ui)*2));pointer-events:auto}
.pixcomp-banner:focus-visible{outline:calc(var(--ui)*1.1) solid #e7272e;outline-offset:calc(var(--ui)*1.2)}
.pixcomp-banner:hover{transform:translateY(calc(var(--ui)*-.5));box-shadow:0 calc(var(--ui)*1.7) 0 #21180f,inset 0 0 0 calc(var(--ui)*.8) #f1c954}
.banner-creature,.banner-mark{display:block;width:100%;height:auto;image-rendering:pixelated}
.banner-copy{display:flex;min-width:0;flex-direction:column;align-items:center;line-height:1.05}.banner-copy small{font-family:Pixel,monospace;font-size:calc(var(--ui)*1.6);letter-spacing:calc(var(--ui)*.15)}.banner-copy strong{margin:calc(var(--ui)*.8) 0;font-family:Pixel,monospace;font-size:calc(var(--ui)*4.1);color:#fffaf0;background:#2b1b25;padding:calc(var(--ui)*1.3) calc(var(--ui)*2.1);text-shadow:calc(var(--ui)*.4) calc(var(--ui)*.4) 0 #8e6077}.banner-copy em{font:normal calc(var(--ui)*1.05)/1.2 Pixel,monospace;color:#795339;white-space:nowrap}
#over{padding-top:max(6dvh,38px);overflow-y:auto;overscroll-behavior:contain}
#over h1{font-size:calc(var(--ui)*4.8)}#over .over-sub{margin-top:calc(var(--ui)*3)}
#over .result{margin:calc(var(--ui)*5) auto calc(var(--ui)*6);padding:calc(var(--ui)*4.5)}
#over #retry,#over #home{width:calc(var(--ui)*76);min-height:calc(var(--ui)*13);padding:calc(var(--ui)*3.7) calc(var(--ui)*3);font-size:calc(var(--ui)*3.1)}
#over #home{margin-top:calc(var(--ui)*5)}
#sound[aria-pressed="false"]{border-color:#ffd7c8 #a91f25 #691318 #f05a52;background:#f2dfc0}
@media(max-width:520px){.ad-banner-slot{width:calc(var(--ui)*88)}.pixcomp-banner{grid-template-columns:calc(var(--ui)*14) 1fr calc(var(--ui)*14);width:100%}.banner-copy strong{font-size:calc(var(--ui)*3.6)}.banner-copy em{font-size:calc(var(--ui)*.9)}}
@media(max-height:620px){#over{padding-top:max(10px,2dvh)}.ad-banner-slot{min-height:calc(var(--ui)*13);margin-bottom:calc(var(--ui)*2)}.ad-banner-slot .pixcomp-banner,.legacy-display-slot{min-height:calc(var(--ui)*13)}.pixcomp-banner{min-height:calc(var(--ui)*13);margin-bottom:0;grid-template-columns:calc(var(--ui)*12) 1fr calc(var(--ui)*12)}.banner-copy em{display:none}#over h1{font-size:calc(var(--ui)*4.2)}#over .over-sub{margin-top:calc(var(--ui)*1.5)}#over .result{margin:calc(var(--ui)*3) auto calc(var(--ui)*4);padding:calc(var(--ui)*3)}#over #retry,#over #home{min-height:calc(var(--ui)*10);padding:calc(var(--ui)*2.4);font-size:calc(var(--ui)*2.7)}#over #home{margin-top:calc(var(--ui)*4)}}

.achievement-line{font-family:Pixel,monospace;font-size:calc(var(--ui)*1.65);line-height:1.45;letter-spacing:calc(var(--ui)*.1);color:#8a4e2c;text-shadow:1px 1px #fff6ca;margin:calc(var(--ui)*1.8) auto calc(var(--ui)*4);text-transform:uppercase}
#over .achievement-line{max-width:calc(var(--ui)*80)}
@media(max-height:620px){.achievement-line{font-size:calc(var(--ui)*1.35);margin:calc(var(--ui)*1) auto calc(var(--ui)*2.5)}}
/* Medal ladder: exact crops from the approved reference sheet. */
.medal-card{display:flex;flex-direction:column;align-items:center;gap:calc(var(--ui)*1.1);width:calc(var(--ui)*27)}
.medal-label{display:block;max-width:120%;font-family:Pixel,monospace;font-size:calc(var(--ui)*1.65);line-height:1.25;color:#5c442f;text-shadow:1px 1px #fff6ca;text-align:center;white-space:normal}
.medal{display:grid;place-items:center;width:calc(var(--ui)*24);height:calc(var(--ui)*24);border:0;background:transparent;box-shadow:none;color:inherit;text-shadow:none;clip-path:none;overflow:visible}
.medal::before,.medal::after{content:none;display:none}
.medal-art{display:block;width:100%;height:100%;overflow:hidden;image-rendering:pixelated;image-rendering:crisp-edges;}
.medal-source{image-rendering:pixelated;image-rendering:crisp-edges}
.medal.space-metal .medal-art{width:106%;height:106%}
@media(max-height:620px){.medal-card{width:calc(var(--ui)*24);gap:calc(var(--ui)*.7)}.medal{width:calc(var(--ui)*21);height:calc(var(--ui)*21)}.medal-label{font-size:calc(var(--ui)*1.4)}}

/* Game over mockup layout v2 */
#over{padding-top:max(3dvh,18px);overflow-y:auto;overscroll-behavior:contain;background:linear-gradient(#e6f6ff1f,#e6f6ff05)}
#over .ad-banner-slot{width:min(86vw,max(calc(var(--ui)*82),520px));min-height:calc(var(--ui)*23);margin:0 auto calc(var(--ui)*5)}
#over .ad-banner-slot--disabled{min-height:calc(var(--ui)*22);background:#fffaf0;border:calc(var(--ui)*.9) solid #111;box-shadow:0 calc(var(--ui)*1.2) 0 #111,inset 0 0 0 calc(var(--ui)*.8) #f0b53c;overflow:hidden}
#over .legacy-display-slot{width:100%;min-height:calc(var(--ui)*22);background:#fffaf0}
#over .pixcomp-banner{grid-template-columns:1fr;width:100%;min-height:calc(var(--ui)*23);margin:0;padding:calc(var(--ui)*4) calc(var(--ui)*5);border:calc(var(--ui)*.9) solid #111;box-shadow:0 calc(var(--ui)*1.2) 0 #111,inset 0 0 0 calc(var(--ui)*.8) #f0b53c;background:linear-gradient(135deg,#fffdfa,#fff7dc);clip-path:none}
#over .banner-creature,#over .banner-mark{display:none}
#over .banner-copy small{font-size:calc(var(--ui)*2.6);letter-spacing:calc(var(--ui)*.22);color:#5a2118;text-shadow:none}
#over .banner-copy strong{font-size:calc(var(--ui)*7.6);margin:calc(var(--ui)*1.7) 0 calc(var(--ui)*1);padding:calc(var(--ui)*1.8) calc(var(--ui)*3.4);border-radius:calc(var(--ui)*.8);background:#2d0d25;color:#fff4ff;text-shadow:calc(var(--ui)*.7) 0 #e2248b,0 calc(var(--ui)*.7) #e2248b,calc(var(--ui)*.7) calc(var(--ui)*.7) #e2248b,calc(var(--ui)*1.2) calc(var(--ui)*1.2) #5b2d55}
#over .banner-copy em{font:900 calc(var(--ui)*5.1)/.9 Arial,sans-serif;color:#050505;letter-spacing:0;text-shadow:none;white-space:nowrap}
.gameover-card{position:relative;width:min(86vw,max(calc(var(--ui)*82),520px));margin:0 auto calc(var(--ui)*5.2);padding:calc(var(--ui)*5.6) calc(var(--ui)*6) calc(var(--ui)*5);color:#7c3a20;background:linear-gradient(135deg,#fff4cf,#ffefba 55%,#ffe59c);border:calc(var(--ui)*.8) solid #5a260f;box-shadow:0 calc(var(--ui)*1.3) 0 #5a260f,inset 0 0 0 calc(var(--ui)*.8) #fff9dc,inset 0 0 0 calc(var(--ui)*1.7) #9a5025;clip-path:polygon(calc(var(--ui)*4) 0,calc(50% - calc(var(--ui)*7)) 0,calc(50% - calc(var(--ui)*5)) calc(var(--ui)*-1.2),calc(50% + calc(var(--ui)*5)) calc(var(--ui)*-1.2),calc(50% + calc(var(--ui)*7)) 0,calc(100% - calc(var(--ui)*4)) 0,calc(100% - calc(var(--ui)*4)) calc(var(--ui)*2),100% calc(var(--ui)*2),100% calc(100% - calc(var(--ui)*4)),calc(100% - calc(var(--ui)*2)) calc(100% - calc(var(--ui)*4)),calc(100% - calc(var(--ui)*2)) 100%,calc(var(--ui)*2) 100%,calc(var(--ui)*2) calc(100% - calc(var(--ui)*4)),0 calc(100% - calc(var(--ui)*4)),0 calc(var(--ui)*2),calc(var(--ui)*4) calc(var(--ui)*2))}
.gameover-card::before{content:"";position:absolute;inset:calc(var(--ui)*2.2);border:calc(var(--ui)*.55) solid #733317;pointer-events:none;box-shadow:inset calc(var(--ui)*1.2) calc(var(--ui)*1.2) 0 #fff6d5,inset calc(var(--ui)*-1.2) calc(var(--ui)*-1.2) 0 #c77731}
.gameover-card::after{content:"";position:absolute;top:calc(var(--ui)*1.35);left:50%;width:calc(var(--ui)*2.2);height:calc(var(--ui)*2.2);transform:translateX(-50%) rotate(45deg);background:#7b3217;box-shadow:calc(var(--ui)*1.5) calc(var(--ui)*-1.5) 0 #7b3217,calc(var(--ui)*-1.5) calc(var(--ui)*1.5) 0 #7b3217}
#over .gameover-card h1,#over #defeat-title{position:relative;z-index:1;max-width:100%;margin:0 auto calc(var(--ui)*2.2);font-size:calc(var(--ui)*4.95);line-height:1.18;color:#fffef2;text-shadow:calc(var(--ui)*.55) 0 #6a2c15,calc(var(--ui)*-.55) 0 #6a2c15,0 calc(var(--ui)*.55) #6a2c15,0 calc(var(--ui)*-.55) #6a2c15,calc(var(--ui)*1) calc(var(--ui)*1) #6a2c15;text-wrap:balance}
#over .over-sub{position:relative;z-index:1;max-width:calc(var(--ui)*66);margin:0 auto calc(var(--ui)*2.6);padding:calc(var(--ui)*1.5) calc(var(--ui)*3);font-size:calc(var(--ui)*2.4);line-height:1.25;color:#6a2c15;background:#fff5cfbd;border-radius:calc(var(--ui)*3.5);text-shadow:none;letter-spacing:calc(var(--ui)*.12)}
.card-divider{position:relative;z-index:1;height:calc(var(--ui)*3);margin:0 calc(var(--ui)*1) calc(var(--ui)*1.5)}
.card-divider::before{content:"";position:absolute;left:0;right:0;top:50%;height:calc(var(--ui)*.45);background:#8a4521;transform:translateY(-50%)}
.card-divider span{position:absolute;left:50%;top:50%;width:calc(var(--ui)*3.4);height:calc(var(--ui)*3.4);background:#ffefba;border:calc(var(--ui)*.5) solid #8a4521;transform:translate(-50%,-50%) rotate(45deg);box-shadow:0 0 0 calc(var(--ui)*.8) #ffefba}
#over .result{position:relative;z-index:1;width:100%;min-height:0;margin:0;background:transparent;border:0;box-shadow:none;display:grid;grid-template-columns:1fr .82fr;align-items:center;padding:0;color:#7c3a20}
#over .result::after{content:"";position:absolute;top:calc(var(--ui)*5);bottom:calc(var(--ui)*5);left:55%;width:calc(var(--ui)*.5);background:#9b572d;box-shadow:none}
#over .medal-card{width:auto;gap:calc(var(--ui)*1.2);align-items:center;justify-content:center;padding-right:calc(var(--ui)*4)}
#over .achievement-line{order:0;margin:0 0 calc(var(--ui)*.5);font-size:calc(var(--ui)*2.25);line-height:1.2;color:#9a5025;text-shadow:1px 1px #fff3c8;letter-spacing:calc(var(--ui)*.15)}
#over .medal{width:calc(var(--ui)*23);height:calc(var(--ui)*23)}
#over .medal-label{font-size:calc(var(--ui)*1.95);line-height:1.25;color:#8a4521;text-shadow:1px 1px #fff3c8;letter-spacing:calc(var(--ui)*.05)}
#over .stats{align-items:center;text-align:center;gap:calc(var(--ui)*1.3);padding-left:calc(var(--ui)*4)}
#over .stats span{font-size:calc(var(--ui)*2.75);line-height:1.2;color:#9a5025;text-shadow:1px 1px #fff3c8}
#over .stats strong{font-size:calc(var(--ui)*8.9);line-height:.9;color:#fffef0;text-shadow:calc(var(--ui)*.45) 0 #9a5025,calc(var(--ui)*-.45) 0 #9a5025,0 calc(var(--ui)*.45) #9a5025,0 calc(var(--ui)*-.45) #9a5025,calc(var(--ui)*.8) calc(var(--ui)*.8) #9a5025}
#over .stats b{font-size:calc(var(--ui)*1.45);color:#d4532d;text-shadow:none}
#over #retry,#over #home{width:min(58vw,max(calc(var(--ui)*56),360px));min-height:calc(var(--ui)*13);font-size:calc(var(--ui)*3.45);padding:calc(var(--ui)*3.4) calc(var(--ui)*3);letter-spacing:calc(var(--ui)*.1)}
#over #home{margin-top:calc(var(--ui)*5);font-size:calc(var(--ui)*3.2)}
@media(max-height:620px){#over{padding-top:max(2dvh,8px)}#over .ad-banner-slot{min-height:calc(var(--ui)*16);margin-bottom:calc(var(--ui)*2.6)}#over .ad-banner-slot--disabled,#over .legacy-display-slot{min-height:calc(var(--ui)*16)}#over .pixcomp-banner{min-height:calc(var(--ui)*16);padding:calc(var(--ui)*2) calc(var(--ui)*4)}#over .banner-copy small{font-size:calc(var(--ui)*1.7)}#over .banner-copy strong{font-size:calc(var(--ui)*4.6);margin:calc(var(--ui)*.7) 0;padding:calc(var(--ui)*1) calc(var(--ui)*2.4)}#over .banner-copy em{font-size:calc(var(--ui)*3.2)}.gameover-card{padding:calc(var(--ui)*4.2) calc(var(--ui)*5) calc(var(--ui)*4);margin-bottom:calc(var(--ui)*4)}#over .gameover-card h1,#over #defeat-title{font-size:calc(var(--ui)*4.4);margin-bottom:calc(var(--ui)*1.5)}#over .over-sub{font-size:calc(var(--ui)*1.85);padding:calc(var(--ui)*1) calc(var(--ui)*2);margin-bottom:calc(var(--ui)*1.5)}.card-divider{height:calc(var(--ui)*2.1);margin-bottom:calc(var(--ui)*.8)}#over .medal{width:calc(var(--ui)*18);height:calc(var(--ui)*18)}#over .achievement-line{font-size:calc(var(--ui)*1.65)}#over .medal-label{font-size:calc(var(--ui)*1.45)}#over .stats span{font-size:calc(var(--ui)*2)}#over .stats strong{font-size:calc(var(--ui)*6.4)}#over #retry,#over #home{width:calc(var(--ui)*55);min-height:calc(var(--ui)*10.5);font-size:calc(var(--ui)*2.75);padding:calc(var(--ui)*2.3)}#over #home{margin-top:calc(var(--ui)*3.4)}}
@media(max-width:520px){#over .ad-banner-slot,.gameover-card{width:86vw}#over .result{grid-template-columns:1fr .78fr}#over .result::after{left:56%}#over #retry,#over #home{width:58vw}}



/* Pause screen mockup layout */
#paused{z-index:4;display:flex;flex-direction:column;align-items:center;padding:max(10dvh,64px) 0 calc(var(--ui)*8);overflow:hidden;background:radial-gradient(circle at 50% 28%,#43615073,#18372fd6 58%,#122b25e8);backdrop-filter:blur(1.5px) saturate(.78)}
#paused[hidden]{display:none!important}
#paused .ad-banner-slot{width:min(88vw,max(calc(var(--ui)*86),540px));min-height:calc(var(--ui)*30);margin:0 auto calc(var(--ui)*17);pointer-events:auto}
#paused .ad-banner-slot--disabled{min-height:calc(var(--ui)*30);background:#fffaf0;border:calc(var(--ui)*.9) solid #111;box-shadow:0 calc(var(--ui)*1.3) 0 #111,inset 0 0 0 calc(var(--ui)*.85) #f0b53c;overflow:hidden}
#paused .pause-adsense{width:100%;min-height:calc(var(--ui)*30);background:#fffaf0}
#paused .pixcomp-banner{grid-template-columns:1fr;width:100%;min-height:calc(var(--ui)*30);margin:0;padding:calc(var(--ui)*5) calc(var(--ui)*5);border:calc(var(--ui)*.9) solid #111;box-shadow:0 calc(var(--ui)*1.3) 0 #111,inset 0 0 0 calc(var(--ui)*.85) #f0b53c;background:linear-gradient(135deg,#fffdfa,#fff7dc);clip-path:none}
#paused .banner-creature,#paused .banner-mark{display:none}
#paused .banner-copy small{font-size:calc(var(--ui)*3);letter-spacing:calc(var(--ui)*.22);color:#5a2118;text-shadow:none}
#paused .banner-copy strong{font-size:calc(var(--ui)*8.4);margin:calc(var(--ui)*2.2) 0 calc(var(--ui)*1.3);padding:calc(var(--ui)*2) calc(var(--ui)*3.8);border-radius:calc(var(--ui)*.9);background:#2d0d25;color:#fff4ff;text-shadow:calc(var(--ui)*.75) 0 #e2248b,0 calc(var(--ui)*.75) #e2248b,calc(var(--ui)*.75) calc(var(--ui)*.75) #e2248b,calc(var(--ui)*1.25) calc(var(--ui)*1.25) #5b2d55}
#paused .banner-copy em{font:900 calc(var(--ui)*5.8)/.9 Arial,sans-serif;color:#050505;letter-spacing:0;text-shadow:none;white-space:nowrap}
#paused h1{margin:0 auto calc(var(--ui)*15);font-size:calc(var(--ui)*8.2);line-height:1;color:#ffe39b;text-shadow:calc(var(--ui)*.55) 0 #9b5634,calc(var(--ui)*-.55) 0 #9b5634,0 calc(var(--ui)*.55) #9b5634,0 calc(var(--ui)*-.55) #9b5634,calc(var(--ui)*1) calc(var(--ui)*1) #9b5634;letter-spacing:calc(var(--ui)*.25)}
#paused #resume{display:flex;align-items:center;justify-content:center;gap:calc(var(--ui)*5);width:min(62vw,max(calc(var(--ui)*58),385px));min-width:0;min-height:calc(var(--ui)*14.5);margin:0 auto;padding:calc(var(--ui)*3.7) calc(var(--ui)*4);font-size:calc(var(--ui)*3.9);letter-spacing:calc(var(--ui)*.12);background:#ef4c49;border-color:#712c29;color:#fff7e4;text-shadow:2px 2px #7e2e2d;box-shadow:inset 0 3px #ff8a7e,inset 0 -4px #b73532,0 4px #ffe8b0,0 7px #572624}
#paused #resume span{font-size:calc(var(--ui)*4.6);margin-left:calc(var(--ui)*1);text-shadow:2px 2px #7e2e2d}
#paused #resume:active{transform:translateY(3px);box-shadow:inset 0 2px #ff8a7e}
#paused .pause-credit{margin:auto 0 0;font-size:calc(var(--ui)*2.2);line-height:1.4;color:#ffe79a;text-shadow:2px 2px #3c3f24;letter-spacing:calc(var(--ui)*.05)}
#paused .pause-credit span{color:#ff3c35;text-shadow:2px 2px #5a201f}
@media(max-height:620px){#paused{padding-top:max(7dvh,42px);padding-bottom:calc(var(--ui)*5)}#paused .ad-banner-slot{min-height:calc(var(--ui)*22);margin-bottom:calc(var(--ui)*9)}#paused .ad-banner-slot--disabled,#paused .pause-adsense{min-height:calc(var(--ui)*22)}#paused .pixcomp-banner{min-height:calc(var(--ui)*22);padding:calc(var(--ui)*3) calc(var(--ui)*4)}#paused .banner-copy small{font-size:calc(var(--ui)*2.2)}#paused .banner-copy strong{font-size:calc(var(--ui)*6);margin:calc(var(--ui)*1.2) 0 calc(var(--ui)*.8);padding:calc(var(--ui)*1.4) calc(var(--ui)*2.8)}#paused .banner-copy em{font-size:calc(var(--ui)*4)}#paused h1{font-size:calc(var(--ui)*6.8);margin-bottom:calc(var(--ui)*9)}#paused #resume{min-height:calc(var(--ui)*11.5);font-size:calc(var(--ui)*3.2);padding:calc(var(--ui)*2.8) calc(var(--ui)*3)}#paused .pause-credit{font-size:calc(var(--ui)*1.8)}}
@media(max-width:520px){#paused .ad-banner-slot{width:88vw}#paused #resume{width:62vw}}



/* App install icon, settings button, and options screen */
.settings-button{background:#303234;color:#f5efd8;border-color:#797b78 #171918 #0b0d0c #555856;box-shadow:3px 4px 0 #111,inset 0 0 0 1px #9a9d98}
.settings-button:hover{filter:brightness(1.12)}
#menu .start-controls{display:flex;flex-direction:column;align-items:center;gap:calc(var(--ui)*4)}
#play{text-transform:none}
#options-screen{z-index:6;display:flex;align-items:center;justify-content:center;padding:calc(var(--ui)*8) calc(var(--ui)*5);background:radial-gradient(circle at 50% 28%,#0ed0a277,#063c35e8 58%,#031f1ce8);backdrop-filter:blur(1px) saturate(.85);overflow-y:auto;overscroll-behavior:contain}
#options-screen[hidden]{display:none!important}
.options-card{position:relative;width:min(86vw,max(calc(var(--ui)*78),480px));padding:calc(var(--ui)*6) calc(var(--ui)*6) calc(var(--ui)*7);color:#ffeec0;background:linear-gradient(135deg,#27302d,#1b211f);border:calc(var(--ui)*.9) solid #0b0d0c;box-shadow:0 calc(var(--ui)*1.5) 0 #080908,inset 0 0 0 calc(var(--ui)*.8) #575b54,inset 0 0 0 calc(var(--ui)*1.7) #2fd0a2;text-align:center;clip-path:polygon(calc(var(--ui)*3) 0,calc(100% - calc(var(--ui)*3)) 0,calc(100% - calc(var(--ui)*3)) calc(var(--ui)*1),100% calc(var(--ui)*1),100% calc(100% - calc(var(--ui)*3)),calc(100% - calc(var(--ui)*1)) calc(100% - calc(var(--ui)*3)),calc(100% - calc(var(--ui)*1)) 100%,calc(var(--ui)*1) 100%,calc(var(--ui)*1) calc(100% - calc(var(--ui)*3)),0 calc(100% - calc(var(--ui)*3)),0 calc(var(--ui)*1),calc(var(--ui)*3) calc(var(--ui)*1))}
.options-emblem{display:grid;place-items:center;width:calc(var(--ui)*23);height:calc(var(--ui)*23);margin:0 auto calc(var(--ui)*3);background:#008d7c;border:calc(var(--ui)*.55) solid #c7fff0;box-shadow:0 calc(var(--ui)*.8) 0 #081f1b,inset 0 0 0 calc(var(--ui)*.7) #00c8a8;overflow:hidden}
.options-emblem img{display:block;width:100%;height:100%;object-fit:cover;image-rendering:auto}
.options-card h1{margin:0 auto calc(var(--ui)*2);font-size:calc(var(--ui)*5.9);line-height:1.15;color:#fff3c5;text-shadow:calc(var(--ui)*.55) 0 #5d2d1c,calc(var(--ui)*-.55) 0 #5d2d1c,0 calc(var(--ui)*.55) #5d2d1c,0 calc(var(--ui)*-.55) #5d2d1c,calc(var(--ui)*.95) calc(var(--ui)*.95) #5d2d1c}
.options-version,.options-by{margin:0 auto calc(var(--ui)*2);font-size:calc(var(--ui)*2.1);line-height:1.55;color:#e8ffd1;text-shadow:2px 2px #16201c;letter-spacing:calc(var(--ui)*.08)}
.options-by strong{color:#ff6db3;text-shadow:2px 2px #391126}
.options-card h2{margin:calc(var(--ui)*5) auto calc(var(--ui)*3);font-size:calc(var(--ui)*2.6);line-height:1.3;color:#fff3c5;text-shadow:2px 2px #5d2d1c}
.social-grid{display:grid;grid-template-columns:1fr 1fr;gap:calc(var(--ui)*2.6);width:min(100%,calc(var(--ui)*62));margin:0 auto calc(var(--ui)*6)}
.social-button{display:flex;align-items:center;justify-content:center;gap:calc(var(--ui)*1.5);min-height:calc(var(--ui)*10.5);padding:calc(var(--ui)*2.2) calc(var(--ui)*2);font-family:Pixel,monospace;font-size:calc(var(--ui)*1.7);line-height:1;color:#fff7dc;text-decoration:none;background:#3b3d40;border:calc(var(--ui)*.45) solid #141517;box-shadow:inset 0 calc(var(--ui)*.6) #707276,inset 0 calc(var(--ui)*-.8) #202124,0 calc(var(--ui)*.8) #08090a;text-shadow:2px 2px #111}
.social-button span{display:grid;place-items:center;width:calc(var(--ui)*4.2);height:calc(var(--ui)*4.2);background:#111;border:calc(var(--ui)*.35) solid #fff7dc;font-size:calc(var(--ui)*2.2);font-family:Arial,sans-serif;font-weight:900;line-height:1;color:#fff}
.social-button em{font-style:normal;white-space:nowrap}.social-button:hover{transform:translateY(calc(var(--ui)*-.3));filter:brightness(1.12)}
.social-facebook span{background:#3559a8}.social-instagram span{background:#c53b87}.social-threads span{background:#111}.social-x span{background:#080808}
.options-back{width:min(52vw,max(calc(var(--ui)*48),300px));min-width:0;min-height:calc(var(--ui)*11);padding:calc(var(--ui)*2.7) calc(var(--ui)*3);font-size:calc(var(--ui)*2.85);background:#789b3e}
@media(max-height:620px){#options-screen{padding-top:calc(var(--ui)*5);padding-bottom:calc(var(--ui)*5)}.options-card{padding:calc(var(--ui)*4) calc(var(--ui)*5)}.options-emblem{width:calc(var(--ui)*17);height:calc(var(--ui)*17);margin-bottom:calc(var(--ui)*2)}.options-card h1{font-size:calc(var(--ui)*4.8)}.options-card h2{margin:calc(var(--ui)*3) auto calc(var(--ui)*2)}.social-grid{gap:calc(var(--ui)*2);margin-bottom:calc(var(--ui)*4)}.social-button{min-height:calc(var(--ui)*8.5);font-size:calc(var(--ui)*1.45)}.options-back{min-height:calc(var(--ui)*9.5)}}
@media(max-width:520px){.options-card{width:86vw}.social-grid{width:100%}.social-button{font-size:calc(var(--ui)*1.45);padding-left:calc(var(--ui)*1.5);padding-right:calc(var(--ui)*1.5)}}

/* Config button moved into the title screen; promo banners use supplied SVG art. */
#menu .start-controls{top:65%;gap:calc(var(--ui)*4.2)}
.config-button{display:flex;align-items:center;justify-content:center;gap:calc(var(--ui)*3);min-width:calc(var(--ui)*52);padding:calc(var(--ui)*3.3) calc(var(--ui)*4);font-family:Arial,sans-serif;font-size:clamp(26px,calc(var(--ui)*4.2),38px);font-weight:500;letter-spacing:0;background:#262829;border-color:#424548 #0e0f10 #070808 #343739;color:#fff;text-shadow:none;box-shadow:inset 0 2px #606368,inset 0 -4px #161718,0 4px #111,0 7px #050606}
.config-button .config-gear{width:calc(var(--ui)*5.3);height:calc(var(--ui)*5.3);margin:0;color:#dfe5da;filter:drop-shadow(1px 1px 0 #111)}
.config-button:hover{filter:brightness(1.12)}
.ad-banner-slot .promo-banner{display:block;width:100%;margin:0;text-decoration:none;pointer-events:auto;background:transparent;border:0;box-shadow:none;overflow:visible}
.ad-banner-slot .promo-banner img{display:block;width:100%;height:auto;border:0;image-rendering:auto}
.promo-banner[hidden]{display:none!important}
#over .ad-banner-slot,#paused .ad-banner-slot{height:auto}
#options-screen{background:radial-gradient(circle at 50% 22%,#0fd7a565,#122720ef 58%,#0c1916f2)}
.options-card{background:linear-gradient(135deg,#202a26,#141c19);box-shadow:0 calc(var(--ui)*1.5) 0 #050706,inset 0 0 0 calc(var(--ui)*.8) #3f4742,inset 0 0 0 calc(var(--ui)*1.7) #2fd0a2}
.options-card h1{font-size:calc(var(--ui)*7.2)}
.options-version{color:#e8ffd1}
.options-by{display:flex;align-items:baseline;justify-content:center;gap:calc(var(--ui)*2.3);margin-bottom:calc(var(--ui)*4);font-size:calc(var(--ui)*2.9);text-transform:none}
.options-by strong{color:#ff73b4;text-transform:uppercase;text-shadow:2px 2px #361322}
.options-by span{color:#ff3047;font-family:Arial,sans-serif;font-size:calc(var(--ui)*3.3);font-weight:700;text-shadow:none}
.options-card h2{margin:calc(var(--ui)*3.2) auto calc(var(--ui)*3.8);color:#ff3047;font-size:calc(var(--ui)*3.1);letter-spacing:calc(var(--ui)*.12);text-shadow:none}
.social-grid{grid-template-columns:repeat(4,1fr);gap:calc(var(--ui)*3.2);width:min(100%,calc(var(--ui)*68));margin-bottom:calc(var(--ui)*7)}
.social-button{aspect-ratio:1/1;min-height:0;height:calc(var(--ui)*14);padding:0;background:#3b3d40;border:calc(var(--ui)*.55) solid #111;box-shadow:inset 0 calc(var(--ui)*.9) #75777b,inset 0 calc(var(--ui)*-.9) #1f2022,0 calc(var(--ui)*.9) #08090a;color:#fff;line-height:1}
.social-icon{display:block;width:calc(var(--ui)*7.5);height:calc(var(--ui)*7.5);filter:drop-shadow(2px 2px 0 #111)}
.social-facebook .social-icon{color:#4168bd}.social-instagram .social-icon{color:#ffcf4b}.social-threads .social-icon,.social-x .social-icon{color:#fff}
@media(max-height:620px){#menu .start-controls{top:64%;gap:calc(var(--ui)*3)}.config-button{padding:calc(var(--ui)*2.6) calc(var(--ui)*4);font-size:clamp(22px,calc(var(--ui)*3.7),32px)}.options-card h1{font-size:calc(var(--ui)*5.1)}.options-by{font-size:calc(var(--ui)*2.15);margin-bottom:calc(var(--ui)*2.6)}.options-by span{font-size:calc(var(--ui)*2.5)}.options-card h2{font-size:calc(var(--ui)*2.5);margin:calc(var(--ui)*2.4) auto}.social-grid{gap:calc(var(--ui)*2);margin-bottom:calc(var(--ui)*4.5)}.social-button{height:calc(var(--ui)*10)}.social-icon{width:calc(var(--ui)*5.8);height:calc(var(--ui)*5.8)}}
@media(max-width:520px){.config-button{width:calc(var(--ui)*52)}.social-grid{grid-template-columns:repeat(4,1fr);gap:calc(var(--ui)*2.3)}.social-button{height:calc(var(--ui)*12)}.social-icon{width:calc(var(--ui)*6.2);height:calc(var(--ui)*6.2)}}

/* Config polish pass: pixel text, sharper gear, social codes and PIXCOMP wordmark. */
.config-button{font-family:Pixel,monospace;font-size:calc(var(--ui)*3.35);font-weight:400;letter-spacing:calc(var(--ui)*.08);text-shadow:2px 2px #111}
.config-button .config-gear{width:calc(var(--ui)*7.2);height:calc(var(--ui)*7.2);filter:drop-shadow(2px 2px 0 #050606)}
.pixcomp-word{display:inline-flex;gap:calc(var(--ui)*.25);align-items:baseline;color:#fff;text-shadow:2px 2px #2a0f1f}
.pixcomp-word span{font-family:Pixel,monospace;font-size:inherit;color:#fff}
.pixcomp-word .pixcomp-x{background:linear-gradient(135deg,#f1d900 0 24%,#ef3d92 24% 50%,#8d4dd0 50% 74%,#9dde12 74%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none;filter:drop-shadow(2px 2px 0 #2a0f1f)}
.options-by .options-year{font-family:Pixel,monospace;color:#ff3047;font-size:calc(var(--ui)*2.9);font-weight:400;text-shadow:2px 2px #2a0f1f}
.social-button{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:calc(var(--ui)*1.1);height:calc(var(--ui)*12.4);aspect-ratio:auto}
.social-icon{width:calc(var(--ui)*5.8);height:calc(var(--ui)*5.8);flex:none}
.social-code{font-family:Pixel,monospace;font-size:calc(var(--ui)*1.9);line-height:1;color:#fff7d8;text-shadow:2px 2px #111;letter-spacing:calc(var(--ui)*.05)}
@media(max-height:620px){.config-button{font-size:calc(var(--ui)*2.95)}.config-button .config-gear{width:calc(var(--ui)*6);height:calc(var(--ui)*6)}.options-by .options-year{font-size:calc(var(--ui)*2.3)}.social-button{height:calc(var(--ui)*9.8);gap:calc(var(--ui)*.7)}.social-icon{width:calc(var(--ui)*4.6);height:calc(var(--ui)*4.6)}.social-code{font-size:calc(var(--ui)*1.45)}}
@media(max-width:520px){.social-button{height:calc(var(--ui)*11.2);gap:calc(var(--ui)*.8)}.social-icon{width:calc(var(--ui)*5.1);height:calc(var(--ui)*5.1)}.social-code{font-size:calc(var(--ui)*1.5)}}

/* PWA/share pass: image-based pixel buttons from supplied artwork. */
.sprite-top-button{background:transparent!important;border:0!important;outline:0!important;box-shadow:none!important;padding:0!important;min-width:clamp(40px,calc(var(--ui)*9),68px);min-height:clamp(40px,calc(var(--ui)*9),68px)}
.sprite-top-button:active{transform:translate(1px,2px);box-shadow:none!important}
.sprite-top-button img{display:block;width:100%;height:100%;object-fit:contain;image-rendering:auto;filter:drop-shadow(2px 2px 0 #263518)}
.edge-button{position:absolute;z-index:8;display:grid;place-items:center;width:clamp(42px,calc(var(--ui)*9.5),70px);height:clamp(42px,calc(var(--ui)*9.5),70px);padding:0;border:0;background:transparent;box-shadow:none;outline:0;filter:drop-shadow(2px 3px 0 #1b230f)}
.edge-button img{display:block;width:100%;height:100%;object-fit:contain;image-rendering:auto;pointer-events:none}.edge-button:hover{filter:drop-shadow(2px 3px 0 #1b230f) brightness(1.08)}.edge-button:active{transform:translate(1px,2px);box-shadow:none}.edge-button:focus-visible{outline:3px solid #fff;outline-offset:2px}.edge-button[hidden]{display:none!important}
.menu-info{left:max(6px,env(safe-area-inset-left));bottom:max(6px,env(safe-area-inset-bottom))}.menu-install{left:calc(max(6px,env(safe-area-inset-left)) + clamp(46px,calc(var(--ui)*10),74px));bottom:max(6px,env(safe-area-inset-bottom))}.menu-share{right:max(6px,env(safe-area-inset-right));bottom:max(6px,env(safe-area-inset-bottom))}
.lose-home{left:max(6px,env(safe-area-inset-left));bottom:max(6px,env(safe-area-inset-bottom))}.lose-share{right:max(6px,env(safe-area-inset-right));bottom:max(6px,env(safe-area-inset-bottom))}
#over #home.edge-button,#over #share-over.edge-button{display:grid!important;width:clamp(44px,calc(var(--ui)*10),74px)!important;height:clamp(44px,calc(var(--ui)*10),74px)!important;min-width:0!important;min-height:0!important;margin:0!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;text-shadow:none!important;color:inherit!important}
#over #retry{margin-bottom:calc(var(--ui)*6)}
.install-tip{position:absolute;left:50%;bottom:calc(var(--ui)*15);width:min(78vw,calc(var(--ui)*72));transform:translateX(-50%);z-index:12;padding:calc(var(--ui)*4) calc(var(--ui)*5);background:#fff6d7;color:#5d2d1c;border:calc(var(--ui)*.8) solid #21180f;box-shadow:0 calc(var(--ui)*1.2) 0 #21180f,inset 0 0 0 calc(var(--ui)*.8) #f0b53c;text-align:center;pointer-events:auto}.install-tip strong{display:block;font-family:Pixel,monospace;font-size:calc(var(--ui)*3);margin-bottom:calc(var(--ui)*2);color:#7c3a20}.install-tip p{margin:0 auto calc(var(--ui)*3);font:700 calc(var(--ui)*2.1)/1.55 Arial,sans-serif;color:#4a321f}.install-tip-close{width:calc(var(--ui)*34);min-width:0;min-height:calc(var(--ui)*8);padding:calc(var(--ui)*2);font-size:calc(var(--ui)*2.2)}
.social-grid.social-grid--icons{grid-template-columns:repeat(6,1fr);gap:calc(var(--ui)*2.1);width:min(100%,calc(var(--ui)*76));margin-bottom:calc(var(--ui)*7)}
.social-grid--icons .social-button{display:grid;place-items:center;aspect-ratio:1/1;height:calc(var(--ui)*10.5);min-height:0;padding:0;background:transparent;border:0;box-shadow:none;filter:drop-shadow(2px 3px 0 #08090a)}
.social-grid--icons .social-button img{display:block;width:100%;height:100%;object-fit:contain;image-rendering:auto;filter:none}.social-grid--icons .social-button:hover{transform:translateY(calc(var(--ui)*-.35));filter:drop-shadow(2px 4px 0 #08090a) brightness(1.08)}
@media(max-height:620px){.edge-button{width:clamp(38px,calc(var(--ui)*8.6),58px);height:clamp(38px,calc(var(--ui)*8.6),58px)}.menu-install{left:calc(max(6px,env(safe-area-inset-left)) + clamp(42px,calc(var(--ui)*9.2),62px))}.install-tip{bottom:calc(var(--ui)*12);padding:calc(var(--ui)*3)}.social-grid.social-grid--icons{gap:calc(var(--ui)*1.5);margin-bottom:calc(var(--ui)*4.5)}.social-grid--icons .social-button{height:calc(var(--ui)*8.4)}}
@media(max-width:520px){.social-grid.social-grid--icons{grid-template-columns:repeat(6,1fr);gap:calc(var(--ui)*1.5)}.social-grid--icons .social-button{height:calc(var(--ui)*9.4)}}

/* SEO/context content for crawlers and AdSense review, kept outside the Phaser canvas. */
.game-info{position:absolute;left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom));z-index:1;max-width:min(420px,calc(100% - 24px));margin:auto;padding:10px 12px;color:#dbe9c1;background:#11251ee0;border:2px solid #3d6d54;font:700 11px/1.45 Arial,sans-serif;text-align:left;pointer-events:none;opacity:.78}.game-info h2{margin:0 0 5px;font:400 13px/1 Pixel,monospace;color:#fff3c5;text-shadow:2px 2px #5d2d1c}.game-info p{margin:0 0 5px;font:700 11px/1.45 Arial,sans-serif}.game-info p:last-child{margin-bottom:0}@media(max-width:760px),(max-height:760px){.game-info{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);opacity:0}}

/* AdSense hardening: keep display ad slots measurable before disabled-ad-client.push(). */
.ad-banner-slot--disabled{display:block!important;min-width:min(320px,88vw);min-height:100px;overflow:visible!important;contain:layout style}.ad-banner-slot--disabled .disabled-ad-client{display:block!important;width:100%!important;min-width:min(300px,88vw);min-height:100px!important;height:100px!important;margin:0 auto;background:#fffaf0}#paused .ad-banner-slot--disabled{min-height:120px}#paused .ad-banner-slot--disabled .disabled-ad-client{min-height:120px!important;height:120px!important}@media(max-width:360px){.ad-banner-slot--disabled,.ad-banner-slot--disabled .disabled-ad-client{min-width:300px}}
/* Rich crawlable page context for review without covering normal mobile play. */
.game-info{max-height:30vh;overflow:auto}.game-info strong{color:#fff3c5}@media(min-width:900px) and (min-height:640px){.game-info{left:auto;right:18px;bottom:18px;width:330px;max-width:330px;max-height:42vh;opacity:.86;z-index:2}}


/* Pixcomp animated startup splash. */
.brand-splash{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;background:#fff;color:#0d1728;font-family:Pixel,monospace;pointer-events:auto;animation:brandSplashShell 4.65s steps(1,end) forwards;overflow:hidden}
.brand-splash::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 45%,#fff 0 42%,#f7f8f6 72%,#eef0ec 100%);opacity:.92}
.brand-splash__stage{position:relative;display:grid;place-items:center;width:min(74vw,360px);height:min(60vh,360px);image-rendering:pixelated;transform:translateY(2vh)}
.pixcomp-logo{position:relative;display:flex;align-items:center;justify-content:center;gap:.08em;font:400 clamp(22px,7vw,44px)/1 Pixel,monospace;letter-spacing:-.12em;filter:drop-shadow(0 2px 0 #d9dde2);opacity:0;transform:scale(.9);animation:pixcompLogoBuild 4.65s steps(1,end) forwards}
.pixcomp-logo .logo-p,.pixcomp-logo .logo-comp{display:inline-block;color:#11192b;text-shadow:1px 0 #11192b;opacity:0}
.pixcomp-logo .logo-p{animation:pixcompLogoLeft 4.65s steps(1,end) forwards}.pixcomp-logo .logo-comp{animation:pixcompLogoRight 4.65s steps(1,end) forwards}
.logo-x{position:relative;display:inline-block;width:.92em;height:.92em;margin:0 .03em;opacity:0;transform:translateY(.05em);animation:pixcompXPop 4.65s steps(1,end) forwards}
.logo-x i{position:absolute;display:block;width:.24em;height:.68em;left:.34em;top:.12em;box-shadow:0 0 0 .02em #fff}.logo-x .x-red{background:#ef174e;transform:rotate(35deg) translate(-.14em,-.12em)}.logo-x .x-blue{background:#1b4dcd;transform:rotate(35deg) translate(.14em,.12em)}.logo-x .x-yellow{background:#ffd313;transform:rotate(-35deg) translate(-.14em,.12em)}.logo-x .x-green{background:#43c431;transform:rotate(-35deg) translate(.14em,-.12em)}
.pixcomp-since{position:absolute;top:calc(50% + clamp(24px,7vw,42px));margin:0;font:400 clamp(5px,1.5vw,8px)/1 Pixel,monospace;letter-spacing:.12em;color:#98a0a8;opacity:0;animation:pixcompSince 4.65s steps(1,end) forwards}
.splash-particles{position:absolute;inset:0;opacity:0;animation:splashParticles 4.65s steps(1,end) forwards}.splash-particles i{position:absolute;width:clamp(3px,.9vw,5px);height:clamp(3px,.9vw,5px);background:#12182b;box-shadow:0 0 0 1px #fff}.splash-particles i:nth-child(1){left:32%;top:44%;background:#f8d713}.splash-particles i:nth-child(2){left:40%;top:38%;background:#942bd4}.splash-particles i:nth-child(3){left:47%;top:43%;background:#f01954}.splash-particles i:nth-child(4){left:55%;top:41%;background:#3fd23c}.splash-particles i:nth-child(5){left:63%;top:44%;background:#101a2d}.splash-particles i:nth-child(6){left:58%;top:35%;background:#ff9e10}.splash-particles i:nth-child(7){left:37%;top:51%;background:#102033}.splash-particles i:nth-child(8){left:52%;top:53%;background:#ffd313}.splash-particles i:nth-child(9){left:68%;top:38%;background:#e92b92}.splash-particles i:nth-child(10){left:28%;top:50%;background:#f0c311}.splash-particles i:nth-child(11){left:72%;top:50%;background:#0e1828}.splash-particles i:nth-child(12){left:45%;top:32%;background:#f01954}
.pixcomp-mascot{position:absolute;left:50%;top:calc(50% - clamp(50px,13vw,80px));width:clamp(42px,12vw,74px);height:clamp(32px,9vw,56px);transform:translate(-50%,24px);opacity:0;animation:pixcompMascot 4.65s steps(1,end) forwards}.mascot-face{position:absolute;left:18%;right:18%;bottom:0;height:68%;background:#fff;border:2px solid #12182b;border-radius:45% 45% 50% 50%;box-shadow:inset 0 -3px #e9edf1,0 2px #d9dde2}.mascot-face b{position:absolute;top:38%;width:12%;height:18%;background:#12182b;border-radius:50%}.mascot-face b:first-child{left:29%}.mascot-face b:nth-child(2){right:29%}.mascot-face em{position:absolute;left:42%;top:58%;width:16%;height:10%;border-bottom:2px solid #f04a70;border-radius:0 0 50% 50%}.mascot-feather{position:absolute;top:15%;width:19%;height:46%;border:2px solid #12182b;border-radius:70% 20% 70% 20%;transform-origin:50% 100%}.mascot-feather.f1{left:0;background:#21b1ff;transform:rotate(-58deg)}.mascot-feather.f2{left:10%;background:#46d341;transform:rotate(-36deg)}.mascot-feather.f3{right:10%;background:#ffcf20;transform:rotate(36deg) scaleX(-1)}.mascot-feather.f4{right:0;background:#ef2d83;transform:rotate(58deg) scaleX(-1)}
@keyframes brandSplashShell{0%,91%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden;pointer-events:none}}
@keyframes splashParticles{0%,6%{opacity:0;transform:scale(.5)}7%,20%{opacity:1;transform:scale(.7)}21%,37%{opacity:1;transform:scale(1)}38%,100%{opacity:0;transform:scale(1.05)}}
@keyframes pixcompLogoBuild{0%,14%{opacity:0;transform:scale(.82)}15%,29%{opacity:1;transform:scale(.86)}30%,45%{opacity:1;transform:scale(.96)}46%,91%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.04)}}
@keyframes pixcompLogoLeft{0%,13%{opacity:0;transform:translateX(-18px)}14%,24%{opacity:1;transform:translateX(-8px)}25%,100%{opacity:1;transform:translateX(0)}}
@keyframes pixcompLogoRight{0%,21%{opacity:0;transform:translateX(18px)}22%,33%{opacity:1;transform:translateX(8px)}34%,100%{opacity:1;transform:translateX(0)}}
@keyframes pixcompXPop{0%,9%{opacity:0;transform:scale(.2) rotate(-10deg)}10%,21%{opacity:1;transform:scale(1.25) rotate(4deg)}22%,100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes pixcompSince{0%,34%{opacity:0;transform:translateY(-4px)}35%,91%{opacity:1;transform:translateY(0)}100%{opacity:0}}
@keyframes pixcompMascot{0%,50%{opacity:0;transform:translate(-50%,24px)}51%,62%{opacity:1;transform:translate(-50%,13px)}63%,91%{opacity:1;transform:translate(-50%,0)}100%{opacity:0;transform:translate(-50%,-3px)}}
@media(prefers-reduced-motion:reduce){.brand-splash{animation:brandSplashShell .9s steps(1,end) forwards}.pixcomp-logo,.pixcomp-logo .logo-p,.pixcomp-logo .logo-comp,.logo-x,.pixcomp-since,.pixcomp-mascot{animation:none;opacity:1;transform:none}.pixcomp-mascot{transform:translate(-50%,0)}.splash-particles{display:none}}


/* Splash loading gate: keep the Pixcomp intro visible until the Phaser scene is ready. */
.brand-splash{animation:none}
.brand-splash--closing{animation:brandSplashClose .32s ease forwards;pointer-events:none}
.brand-splash__loading{position:absolute;left:50%;bottom:clamp(18px,8vh,56px);transform:translateX(-50%);margin:0;color:#839092;font:10px/1 Pixel,monospace;letter-spacing:1px;text-shadow:1px 1px 0 #fff;opacity:0;white-space:nowrap}
.brand-splash--waiting .pixcomp-logo,
.brand-splash--waiting .pixcomp-logo .logo-p,
.brand-splash--waiting .pixcomp-logo .logo-comp,
.brand-splash--waiting .logo-x,
.brand-splash--waiting .pixcomp-since,
.brand-splash--waiting .pixcomp-mascot{animation:none;opacity:1}
.brand-splash--waiting .pixcomp-logo{transform:translateY(0) scale(1)}
.brand-splash--waiting .pixcomp-logo .logo-p,
.brand-splash--waiting .pixcomp-logo .logo-comp{transform:none}
.brand-splash--waiting .logo-x{transform:scale(1) rotate(0)}
.brand-splash--waiting .pixcomp-since{transform:translateY(0)}
.brand-splash--waiting .pixcomp-mascot{transform:translate(-50%,0)}
.brand-splash--waiting .splash-particles{display:none}
.brand-splash--waiting .brand-splash__loading{opacity:1}
.brand-splash__loading span{opacity:0;animation:brandLoadingDot 1.05s steps(1,end) infinite}
.brand-splash__loading span:nth-child(2){animation-delay:.18s}
.brand-splash__loading span:nth-child(3){animation-delay:.36s}
@keyframes brandLoadingDot{0%,18%{opacity:0}19%,100%{opacity:1}}
@keyframes brandSplashClose{to{opacity:0;visibility:hidden}}
@media(prefers-reduced-motion:reduce){.brand-splash__loading span{animation:none;opacity:1}.brand-splash--closing{animation:brandSplashClose .2s ease forwards}}


/* Refined Pixcomp SVG splash. */
.brand-splash{background:#fff;animation:none}
.brand-splash::before{background:radial-gradient(circle at 50% 45%,#fff 0 45%,#f8faf8 75%,#edf1ef 100%);opacity:1}
.brand-splash__stage{width:min(92vw,720px);height:min(58vh,420px);transform:translateY(-1vh);image-rendering:auto}
.brand-splash__art{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 8px 16px rgba(67,82,115,.12));animation:brandSplashArtIn .7s cubic-bezier(.16,1,.3,1) both}
.brand-splash__loading{bottom:clamp(10px,3.5vh,24px);color:#7d899e;font-size:clamp(8px,1.7vw,11px);text-shadow:none}
.brand-splash--waiting .brand-splash__art{animation:none;opacity:1;transform:none}
.brand-splash--waiting .pixcomp-logo,
.brand-splash--waiting .pixcomp-logo .logo-p,
.brand-splash--waiting .pixcomp-logo .logo-comp,
.brand-splash--waiting .logo-x,
.brand-splash--waiting .pixcomp-since,
.brand-splash--waiting .pixcomp-mascot{animation:none;opacity:0}
@keyframes brandSplashArtIn{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}
@media(max-width:560px){.brand-splash__stage{width:96vw;height:46vh}.brand-splash__loading{bottom:0}}
@media(prefers-reduced-motion:reduce){.brand-splash__art{animation:none}}


/* Frame-by-frame Pixcomp splash using exported SVG frames. */
.brand-splash__stage{width:min(100vw,640px);height:100vh;max-height:900px;transform:none;image-rendering:auto}
.brand-splash__frames{position:absolute;inset:0;z-index:1;display:block}
.brand-splash__frame{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity 70ms linear;image-rendering:auto}
.brand-splash__frame.is-active{opacity:1}
.brand-splash--waiting .brand-splash__frame{opacity:0;transition:none}
.brand-splash--waiting .brand-splash__frame:last-child{opacity:1}
.brand-splash__loading{z-index:2;bottom:max(18px,calc(env(safe-area-inset-bottom) + 18px));color:#7d899e;font-size:clamp(8px,1.7vw,11px);text-shadow:none}
@media(max-width:560px){.brand-splash__stage{width:100vw;height:100vh;max-height:none}.brand-splash__loading{bottom:max(22px,calc(env(safe-area-inset-bottom) + 16px))}}
@media(prefers-reduced-motion:reduce){.brand-splash__frame{transition:none}.brand-splash__frame{opacity:0}.brand-splash__frame:last-child{opacity:1}}


/* Single-frame Pixcomp splash requested: fade in for 3 seconds, then wait for game readiness. */
.brand-splash__stage{width:min(100vw,640px);height:100vh;max-height:900px;transform:none;image-rendering:auto}
.brand-splash__single-frame{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:contain;opacity:0;animation:pixcompSingleFrameFade 3s ease forwards;image-rendering:auto}
.brand-splash--waiting .brand-splash__single-frame{animation:none;opacity:1}
.brand-splash__loading{z-index:2;bottom:max(18px,calc(env(safe-area-inset-bottom) + 18px));color:#7d899e;font-size:clamp(8px,1.7vw,11px);text-shadow:none}
@keyframes pixcompSingleFrameFade{0%{opacity:0}100%{opacity:1}}
@media(max-width:560px){.brand-splash__stage{width:100vw;height:100vh;max-height:none}.brand-splash__loading{bottom:max(22px,calc(env(safe-area-inset-bottom) + 16px))}}
@media(prefers-reduced-motion:reduce){.brand-splash__single-frame{animation:none;opacity:1}}


/* Final Pixcomp splash: single supplied SVG with 3-second fade. */
.brand-splash__stage{width:min(100vw,640px);height:100vh;max-height:900px;transform:none;image-rendering:auto}
.brand-splash__single-frame{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:contain;opacity:0;animation:pixcompSingleFrameFade 3s ease forwards;image-rendering:auto}
.brand-splash--waiting .brand-splash__single-frame{animation:none;opacity:1}
.brand-splash__loading{z-index:2;bottom:max(18px,calc(env(safe-area-inset-bottom) + 18px));color:#7d899e;font-size:clamp(8px,1.7vw,11px);text-shadow:none}
@keyframes pixcompSingleFrameFade{0%{opacity:0}100%{opacity:1}}
@media(max-width:560px){.brand-splash__stage{width:100vw;height:100vh;max-height:none}.brand-splash__loading{bottom:max(22px,calc(env(safe-area-inset-bottom) + 16px))}}
@media(prefers-reduced-motion:reduce){.brand-splash__single-frame{animation:none;opacity:1}}


/* Hide the AdSense context copy from the playable viewport while keeping it in the page source. */
.game-info{position:absolute!important;left:-10000px!important;right:auto!important;bottom:auto!important;top:auto!important;width:1px!important;height:1px!important;max-width:1px!important;max-height:1px!important;margin:0!important;padding:0!important;border:0!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;clip-path:inset(50%)!important;white-space:nowrap!important;opacity:0!important;pointer-events:none!important}


/* Info menu social buttons: keep six links inside a 3 by 2 grid. */
.social-grid.social-grid--icons{grid-template-columns:repeat(3,1fr)!important;width:min(calc(var(--ui)*45),72%)!important;gap:calc(var(--ui)*2.2)!important;margin-left:auto!important;margin-right:auto!important;margin-bottom:calc(var(--ui)*6)!important;justify-items:center!important}
.social-grid--icons .social-button{width:calc(var(--ui)*10.8)!important;height:calc(var(--ui)*10.8)!important}
@media(max-height:620px){.social-grid.social-grid--icons{width:min(calc(var(--ui)*36),70%)!important;gap:calc(var(--ui)*1.4)!important;margin-bottom:calc(var(--ui)*4)!important}.social-grid--icons .social-button{width:calc(var(--ui)*8.4)!important;height:calc(var(--ui)*8.4)!important}}
@media(max-width:520px){.social-grid.social-grid--icons{grid-template-columns:repeat(3,1fr)!important;width:min(calc(var(--ui)*40),78%)!important;gap:calc(var(--ui)*1.7)!important}.social-grid--icons .social-button{width:calc(var(--ui)*9.4)!important;height:calc(var(--ui)*9.4)!important}}

/* AdSense readiness: no display ads are rendered inside the game experience. */
.ad-banner-slot,.promo-banner,.pixcomp-banner{display:none!important}
.options-card .options-title{margin:0 0 calc(var(--ui)*2);font-family:Pixel,monospace;font-size:calc(var(--ui)*8.6);line-height:1.08;color:#fff3c2;text-shadow:3px 3px #6b3d2d,-2px -2px #6b3d2d}
#over #defeat-title,.pause-title{font-family:Pixel,monospace;font-size:calc(var(--ui)*7.5);text-shadow:3px 3px #67402c,-2px -2px #67402c;color:#fff0af;margin:0 0 calc(var(--ui)*4)}
#paused .pause-title{font-size:calc(var(--ui)*6.8);margin-bottom:calc(var(--ui)*9)}
.site-footer{position:fixed;left:50%;bottom:max(7px,env(safe-area-inset-bottom));z-index:30;display:flex!important;gap:10px;align-items:center;justify-content:center;transform:translateX(-50%);max-width:calc(100vw - 150px);padding:6px 9px;border:1px solid #315f4d;border-radius:999px;background:#0f211bcc;color:#dceec8;font:700 10px/1.2 Arial,sans-serif;box-shadow:0 4px 18px #0006;pointer-events:auto}.site-footer a{color:#e9ffd3;text-decoration:none}.site-footer a:focus-visible,.site-footer a:hover{text-decoration:underline}
.game-info-drawer{position:fixed;left:max(10px,env(safe-area-inset-left));top:max(10px,env(safe-area-inset-top));z-index:25;width:min(390px,calc(100vw - 20px));max-height:min(72vh,620px);color:#dbe9c1;background:#11251ee8;border:2px solid #3d6d54;box-shadow:0 10px 30px #0008;font:700 12px/1.5 Arial,sans-serif;text-align:left;overflow:auto;pointer-events:auto}.game-info-drawer summary{cursor:pointer;padding:9px 12px;color:#fff3c5;font:400 11px/1 Pixel,monospace;list-style:none}.game-info-drawer summary::-webkit-details-marker{display:none}.game-info-content{padding:0 14px 14px}.game-info-content h1,.game-info-content h2{font-family:Pixel,monospace;color:#fff3c5;text-shadow:2px 2px #5d2d1c}.game-info-content h1{font-size:15px;line-height:1.35;margin:5px 0 12px}.game-info-content h2{font-size:11px;margin:16px 0 6px}.game-info-content p{font:700 12px/1.55 Arial,sans-serif;margin:0 0 8px}.game-info-content a{color:#fff0a8}.game-info-drawer:not([open]){width:auto;max-width:calc(100vw - 150px);background:#11251ed8}.game-info-drawer:not([open]) summary{white-space:nowrap}
@media(max-width:520px){.site-footer{max-width:calc(100vw - 154px);gap:7px;padding:5px 7px;font-size:9px}.game-info-drawer{top:max(8px,env(safe-area-inset-top));left:max(8px,env(safe-area-inset-left));width:min(340px,calc(100vw - 16px));max-height:66vh}.game-info-drawer:not([open]){max-width:calc(100vw - 150px)}}