:root{--scale:3;--pink:#ff5fa2;--pink-light:#ffd1e6;--pink-deep:#c2185b;--plum:#2a0f24;--plum-2:#3d1535;--white:#fff7fb;--px:calc(1px * var(--scale))}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{background:radial-gradient(circle at 50% 40%, var(--plum-2), var(--plum) 70%);color:var(--white);-webkit-font-smoothing:none;-webkit-user-select:none;user-select:none;touch-action:none;place-items:center;font-family:"Press Start 2P",monospace;display:grid;overflow:hidden}#game{width:calc(256px * var(--scale));height:calc(240px * var(--scale));box-shadow:0 0 0 var(--px) var(--pink-deep), 0 0 0 calc(var(--px) * 2) var(--pink), 0 0 calc(var(--px) * 12) #ff5fa259;position:relative}#screen{width:100%;height:100%;image-rendering:pixelated;image-rendering:crisp-edges;display:block}#ui{pointer-events:none;font-size:calc(8px * var(--scale));text-shadow:var(--px) var(--px) 0 #3c0a288c;line-height:1.25;position:absolute;inset:0}.hidden{display:none!important}#hud{top:calc(8px * var(--scale));left:calc(16px * var(--scale));right:calc(16px * var(--scale));justify-content:space-between;display:flex;position:absolute}.hud-col{gap:calc(2px * var(--scale));flex-direction:column;display:flex}.hud-col:nth-child(3),.hud-col:nth-child(4){align-items:flex-end}.px-heart{width:calc(7px * var(--scale));height:calc(6px * var(--scale));margin-right:calc(1px * var(--scale));vertical-align:calc(-1px * var(--scale));background:url(../heart.svg) 50%/contain no-repeat;display:inline-block}.overlay{justify-content:center;align-items:center;gap:calc(10px * var(--scale));text-align:center;flex-direction:column;display:flex;position:absolute;inset:0}#screen-title{padding-top:calc(40px * var(--scale));justify-content:flex-start}.title-box{padding:calc(10px * var(--scale)) calc(12px * var(--scale));border:var(--px) solid #3a0d1c;box-shadow:inset var(--px) var(--px) 0 #ffb199, inset calc(var(--px) * -1) calc(var(--px) * -1) 0 #a8402e, calc(var(--px) * 3) calc(var(--px) * 3) 0 #3c0a2873;margin-bottom:calc(18px * var(--scale));background:#e8735a}.title-box h1{gap:calc(6px * var(--scale));flex-direction:column;font-weight:400;display:flex}.title-top{font-size:calc(8px * var(--scale));color:var(--pink-light);text-align:left}.title-main{font-size:calc(12px * var(--scale));color:var(--white);text-shadow:var(--px) var(--px) 0 var(--pink-deep), calc(var(--px) * 2) calc(var(--px) * 2) 0 #3a0d1c}.big{font-size:calc(16px * var(--scale));color:var(--white)}.small{font-size:calc(6px * var(--scale))}.muted{color:var(--pink-light)}#screen-ending{padding-top:calc(40px * var(--scale));justify-content:flex-start;animation:1s steps(6,end) both fade-in}.ending-box{gap:calc(8px * var(--scale));padding:calc(10px * var(--scale)) calc(12px * var(--scale));border:var(--px) solid var(--pink);box-shadow:0 0 0 var(--px) var(--pink-deep), calc(var(--px) * 3) calc(var(--px) * 3) 0 #00000073;color:var(--pink-light);margin-bottom:calc(8px * var(--scale));background:#2a0f24cc;flex-direction:column;display:flex}.ending-box p:first-child{color:var(--white)}@keyframes fade-in{0%{opacity:0}}.overlay.solid{background:var(--plum)}#screen-pause{background:#2a0f248c}.blink{color:var(--white);animation:1s step-end infinite blink}@keyframes blink{50%{opacity:0}}#screen-crawl{justify-content:flex-end;gap:0;overflow:hidden}.crawl-pretitle{padding:0 calc(16px * var(--scale));font-size:calc(8px * var(--scale));color:#9ad7ff;opacity:0;justify-content:center;align-items:center;line-height:1.8;transition:opacity .6s steps(4,end);display:flex;position:absolute;inset:0}.crawl-pretitle.show{opacity:1}.crawl-stage{perspective:calc(260px * var(--scale));perspective-origin:50%;opacity:0;transition:opacity .4s steps(3,end);position:absolute;inset:0;overflow:hidden}.crawl-stage.show{opacity:1}.crawl-stage:after{content:"";background:linear-gradient(var(--plum) 25%, #2a0f2400);pointer-events:none;height:45%;position:absolute;inset:0 0 auto}.crawl-plane{transform-origin:50% 100%;position:absolute;inset:0;transform:rotateX(28deg)}.crawl-text{width:72%;transform:translateY(var(--y,0px));gap:calc(10px * var(--scale));font-size:calc(6px * var(--scale));text-align:justify;color:#ffd23f;text-shadow:var(--px) var(--px) 0 #5a280099;flex-direction:column;line-height:1.7;display:flex;position:absolute;top:100%;left:14%}.crawl-ep,.crawl-title{text-align:center;color:#ffe77a}.crawl-ep{margin-bottom:calc(-4px * var(--scale))}.crawl-title{font-size:calc(10px * var(--scale));margin-bottom:calc(6px * var(--scale))}.crawl-skip{bottom:calc(6px * var(--scale));color:var(--pink-light);opacity:.8;position:absolute;left:0;right:0}#screen-map{padding:calc(10px * var(--scale)) 0 calc(4px * var(--scale));justify-content:space-between}.map-top{align-items:center;gap:calc(4px * var(--scale));flex-direction:column;display:flex}.map-hint{color:var(--white)}#screen-intro{gap:calc(14px * var(--scale))}.intro-lives{align-items:center;gap:calc(8px * var(--scale));display:flex}#intro-jose{width:calc(16px * var(--scale));height:calc(16px * var(--scale));image-rendering:pixelated}.controls-help{align-items:center;gap:calc(4px * var(--scale));flex-direction:column;display:flex}.touch-only{display:none}body.touch .touch-only{display:inline}body.touch .kb-only{display:none}#topbar{top:calc(6px + env(safe-area-inset-top,0px));right:calc(8px + env(safe-area-inset-right,0px));z-index:10;gap:6px;display:flex;position:fixed}#topbar button{border:2px solid var(--pink-deep);color:var(--pink-light);cursor:pointer;-webkit-tap-highlight-color:transparent;background:#2a0f24bf;border-radius:6px;align-items:center;gap:6px;padding:4px 7px;font:7px "Press Start 2P",monospace;display:flex}#topbar button:hover,#topbar button:focus-visible{background:#c2185b99;outline:none}#topbar button:active{transform:translateY(1px)}#reset-btn .arrow,#map-btn .arrow{font:11px/7px sans-serif}#controls-toggle .box{border:2px solid var(--pink-light);background:0 0;width:9px;height:9px}#controls-toggle.on{color:var(--white);border-color:var(--pink)}#controls-toggle.on .box{background:var(--pink);border-color:var(--white)}#touch{--btn:clamp(44px, 13vmin, 64px);--gap:calc(var(--btn) * .12);--edge-x:calc(12px + env(safe-area-inset-left,0px));--edge-y:calc(14px + env(safe-area-inset-bottom,0px));display:none}body.controls #touch{pointer-events:none;z-index:5;display:block;position:fixed;inset:0}#touch button{width:var(--btn);height:var(--btn);border:3px solid var(--pink-deep);color:var(--white);font:calc(var(--btn) * .26) "Press Start 2P", monospace;pointer-events:auto;touch-action:none;-webkit-tap-highlight-color:transparent;cursor:pointer;background:#ff5fa259;border-radius:12px;box-shadow:0 4px #00000059}#touch button.pressed{background:#ff5fa2bf;transform:translateY(2px);box-shadow:0 2px #00000059}#touch .dpad{left:var(--edge-x);bottom:var(--edge-y);gap:var(--gap);display:flex;position:absolute}#touch .ab{right:calc(12px + env(safe-area-inset-right,0px));bottom:var(--edge-y);align-items:flex-end;gap:var(--gap);display:flex;position:absolute}#touch .btn-a,#touch .btn-b{width:calc(var(--btn) * 1.1);height:calc(var(--btn) * 1.1);border-radius:50%}#touch .btn-a{margin-bottom:calc(var(--btn) * .5);background:#ff4f9a8c}#touch .btn-start{left:50%;bottom:calc(var(--edge-y) + var(--btn) * 1.6 + 10px);width:calc(var(--btn) * .95);height:calc(var(--btn) * .55);font-size:calc(var(--btn) * .2);position:absolute;transform:translate(-50%)}body:not(.touch-bottom) #touch .btn-start{left:auto;right:calc(12px + env(safe-area-inset-right,0px));bottom:calc(var(--edge-y) + var(--btn) * 1.6 + 24px);transform:none}body.controls.touch-bottom{padding-bottom:var(--touch-h,0px)}