:root{--bg:#04040d;--panel:#09091f;--text:#f7f5ff;--muted:#aaa5bf;--cyan:#15d9ff;--violet:#8347ff;--magenta:#ff35c7;--green:#b8ff3d;--display:"Press Start 2P",monospace;--body:"Inter",sans-serif}*{box-sizing:border-box}html{background:var(--bg)}body{margin:0;min-width:320px;min-height:100vh;color:var(--text);font-family:var(--body);background:radial-gradient(circle at 10% 20%,rgba(255,53,199,.14),transparent 28%),radial-gradient(circle at 90% 25%,rgba(21,217,255,.12),transparent 26%),linear-gradient(180deg,#04040d,#080819 60%,#03030a);overflow-x:hidden}.scanlines{position:fixed;z-index:9999;inset:0;pointer-events:none;opacity:.035;background:repeating-linear-gradient(to bottom,rgba(255,255,255,.35) 0 1px,transparent 1px 4px)}button{font:inherit;color:inherit}.game-header,.game-shell{width:min(calc(100% - 40px),1380px);margin-inline:auto}.game-header{min-height:82px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none}.brand img{width:52px;height:52px;object-fit:contain;filter:drop-shadow(0 0 10px rgba(21,217,255,.55))}.brand span{display:grid;gap:5px}.brand strong,.brand small{font-family:var(--display)}.brand strong{font-size:.72rem}.brand small{font-size:.4rem;color:var(--cyan)}.header-actions{display:flex;gap:10px}.icon-button,.mobile-toolbar button{width:42px;height:42px;border:1px solid rgba(131,71,255,.48);border-radius:12px;background:rgba(8,9,27,.82);cursor:pointer}.icon-button:disabled,.mobile-toolbar button:disabled{opacity:.35}.game-shell{margin-top:20px;display:grid;grid-template-columns:minmax(300px,.45fr) minmax(520px,.75fr);align-items:center;gap:clamp(42px,5vw,76px)}.eyebrow{display:inline-flex;padding:9px 12px;border:1px solid rgba(21,217,255,.35);border-radius:999px;color:var(--cyan);font-family:var(--display);font-size:.44rem}.game-copy h1{margin:28px 0 20px;font-family:var(--display);font-size:clamp(2rem,3.2vw,3.5rem);line-height:1.3}.game-copy h1 span{display:block;color:var(--magenta);text-shadow:0 0 16px rgba(255,53,199,.65)}.game-copy>p{max-width:410px;margin:0;color:var(--muted);font-size:.96rem;line-height:1.72}.mini-stats{margin-top:32px;display:grid;grid-template-columns:1fr 1fr;gap:12px}.mini-stats div{min-height:84px;padding:16px;display:grid;align-content:center;gap:9px;border:1px solid rgba(131,71,255,.28);border-radius:15px;background:rgba(8,9,27,.66)}.mini-stats span,.hud span,.results span{font-family:var(--display);font-size:.38rem;color:var(--muted)}.mini-stats strong{font-family:var(--display);font-size:.78rem;color:var(--cyan)}.game-frame{position:relative;width:min(100%,660px);justify-self:center;border:1px solid rgba(131,71,255,.52);border-radius:22px;background:rgba(4,5,16,.96);box-shadow:0 30px 100px rgba(0,0,0,.48),0 0 46px rgba(131,71,255,.16);overflow:hidden}.frame-top,.frame-bottom{min-height:42px;padding:0 17px;display:flex;align-items:center;gap:9px;color:#8985a2;font-family:var(--display);font-size:.36rem;background:rgba(7,7,21,.95)}.frame-top{border-bottom:1px solid rgba(131,71,255,.28)}.frame-top span:last-child{margin-left:auto;color:var(--green)}.frame-bottom{justify-content:space-between;border-top:1px solid rgba(131,71,255,.28)}.status-dot{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 10px rgba(184,255,61,.8)}.game-stage{display:grid;background:#050513}.board-wrap{position:relative;width:100%;aspect-ratio:19/21;overflow:hidden;touch-action:none}#gameCanvas{display:block;width:100%;height:100%;image-rendering:pixelated}.hud{position:absolute;z-index:5;inset:12px 14px auto;display:grid;grid-template-columns:repeat(3,1fr);pointer-events:none}.hud div{display:grid;gap:7px}.hud div:nth-child(2){justify-items:center}.hud div:nth-child(3){justify-items:end}.hud strong{font-family:var(--display);font-size:.62rem}.hud div:first-child strong{color:var(--cyan)}.hud div:nth-child(2) strong{color:#ffd33d}.hud div:nth-child(3) strong{color:var(--magenta)}.overlay{position:absolute;z-index:10;inset:0;padding:20px;display:grid;place-items:center;visibility:hidden;opacity:0;pointer-events:none;background:rgba(3,3,13,.78);backdrop-filter:blur(7px);transition:.2s}.overlay.is-visible{visibility:visible;opacity:1;pointer-events:auto}.overlay-card{width:min(92%,500px);padding:26px;border:1px solid rgba(131,71,255,.5);border-radius:22px;text-align:center;background:radial-gradient(circle at 50% 0,rgba(255,53,199,.12),transparent 42%),linear-gradient(180deg,rgba(10,10,31,.98),rgba(5,5,18,.99));box-shadow:0 25px 70px rgba(0,0,0,.52),0 0 34px rgba(131,71,255,.2)}.overlay-card.compact{max-width:390px}.overlay-kicker{color:var(--cyan);font-family:var(--display);font-size:.4rem}.overlay-card h2{margin:16px 0;font-family:var(--display);font-size:clamp(1.1rem,2.5vw,1.8rem);line-height:1.45}.overlay-card h2 span{color:var(--magenta)}.overlay-card p{margin:0 auto;color:var(--muted);font-size:.84rem;line-height:1.55}.mobile-hint{margin:18px 0 6px;padding:12px;border:1px solid rgba(21,217,255,.22);border-radius:12px;color:var(--cyan);font-family:var(--display);font-size:.34rem}.primary-button{width:100%;min-height:50px;margin-top:16px;border:0;border-radius:12px;color:#080811;font-family:var(--display);font-size:.5rem;background:linear-gradient(90deg,var(--cyan),#6af4ff);box-shadow:0 8px 0 #08738d,0 0 28px rgba(21,217,255,.3);cursor:pointer}.overlay-card small{display:block;margin-top:14px;color:#7b7690;font-size:.62rem;line-height:1.45}.results{margin:22px 0 4px;display:grid;grid-template-columns:1fr 1fr;gap:10px}.results div{padding:14px 8px;display:grid;gap:8px;border:1px solid rgba(131,71,255,.32);border-radius:12px}.results strong{font-family:var(--display);font-size:.7rem;color:var(--cyan)}.dpad,.mobile-launch,.mobile-toolbar{display:none}.mobile-launch{width:100%;min-height:54px;margin-top:20px;border:0;border-radius:14px;color:#080811;font-family:var(--display);font-size:.42rem;background:linear-gradient(90deg,var(--cyan),#6af4ff);box-shadow:0 8px 0 #08738d}.mobile-toolbar{position:absolute;z-index:50;top:max(8px,env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right));left:max(10px,env(safe-area-inset-left));align-items:center;gap:7px;pointer-events:none}.mobile-toolbar span{margin-right:auto;padding:8px 10px;border-radius:999px;color:var(--cyan);font-family:var(--display);font-size:.22rem;background:rgba(5,5,18,.82)}.mobile-toolbar button{pointer-events:auto}.dpad{width:144px;height:144px;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr)}.dpad button{border:1px solid rgba(21,217,255,.45);background:rgba(7,8,28,.94);color:var(--cyan);font-family:var(--display);font-size:.8rem;touch-action:none}.dpad button:active{background:var(--cyan);color:#080811}.dpad button[data-dir=up]{grid-column:2;grid-row:1;border-radius:12px 12px 4px 4px}.dpad button[data-dir=left]{grid-column:1;grid-row:2;border-radius:12px 4px 4px 12px}.dpad i{grid-column:2;grid-row:2;border:1px solid rgba(131,71,255,.35);background:rgba(7,8,28,.94)}.dpad button[data-dir=right]{grid-column:3;grid-row:2;border-radius:4px 12px 12px 4px}.dpad button[data-dir=down]{grid-column:2;grid-row:3;border-radius:4px 4px 12px 12px}@media(max-width:1120px){.game-shell{grid-template-columns:1fr}.game-copy{text-align:center}.game-copy>p{margin-inline:auto}.mini-stats{width:min(100%,560px);margin-inline:auto;margin-top:30px}}@media(max-width:900px),(hover:none) and (pointer:coarse){.game-header{min-height:64px}.header-actions{display:none}.game-shell{display:block;margin-top:10px}.game-copy{text-align:left}.game-copy h1{font-size:clamp(1.35rem,7vw,1.9rem)}.game-copy>p{margin:0}.mini-stats{margin:20px 0 0}.mobile-launch{display:grid;place-items:center}.game-frame{display:none}body.mobile-game-open{height:100dvh;overflow:hidden;padding:0}body.mobile-game-open .game-frame{position:fixed;z-index:999;inset:0;width:100vw;height:100dvh;max-width:none;margin:0;display:block;border:0;border-radius:0}body.mobile-game-open .frame-top,body.mobile-game-open .frame-bottom{display:none}body.mobile-game-open .mobile-toolbar{display:flex}body.mobile-game-open .game-stage{width:100vw;height:100dvh;padding:max(54px,calc(env(safe-area-inset-top) + 48px)) max(12px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));display:grid;grid-template-columns:minmax(0,1fr) 154px;align-items:center;gap:10px}body.mobile-game-open .board-wrap{width:auto;height:min(calc(100dvh - 68px),calc((100vw - 190px) * 21 / 19));max-width:calc(100vw - 190px);aspect-ratio:19/21;border:1px solid rgba(131,71,255,.38);border-radius:14px}body.mobile-game-open .dpad{display:grid;align-self:end;margin-bottom:max(12px,env(safe-area-inset-bottom))}body.mobile-game-open .overlay{padding:54px 12px 10px}body.mobile-game-open .overlay-card{width:min(92%,430px);padding:18px}body.mobile-game-open .overlay-card h2{font-size:1rem;margin:10px 0}body.mobile-game-open .overlay-card p{font-size:.72rem}.mobile-hint{font-size:.28rem;margin:12px 0 4px}.primary-button{min-height:44px;font-size:.4rem}.overlay-card small{font-size:.56rem}}@media(max-width:760px) and (orientation:portrait){body.mobile-game-open .game-stage{grid-template-columns:1fr;place-items:center}body.mobile-game-open .board-wrap{width:min(92vw,520px);height:auto;max-width:none}body.mobile-game-open .dpad{display:none}body.mobile-game-open .overlay:before{content:"GIRÁ EL CELULAR";position:absolute;z-index:20;inset:0;display:grid;place-items:center;color:var(--cyan);font-family:var(--display);font-size:.72rem;background:rgba(3,3,13,.97)}body.mobile-game-open .overlay-card{visibility:hidden}}