:root{--bg:#080a1e;--white:#f7f7ff;--mute:#aeb8d5;--cyan:#4bf4ff;--gold:#ffc94e;--pink:#ff58b4;--mint:#76ffbb;--edge:rgba(159,178,255,.21)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--white);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}.home{overflow-x:hidden;background:radial-gradient(ellipse at 85% 9%,#222263 0,transparent 30%),radial-gradient(ellipse at 12% 45%,#16244e 0,transparent 48%),#090a20}.nav{max-width:1440px;margin:auto;padding:18px 4.7%;display:flex;align-items:center;justify-content:space-between;gap:18px}.brand{display:flex;gap:12px;align-items:center}.brand img{height:50px;width:50px;object-fit:contain}.brand strong{display:block;font-weight:1000;letter-spacing:.18em;font-size:23px}.brand small{display:block;font-size:9px;letter-spacing:.26em;color:#72eaf8;font-weight:800}.nav-label{font-size:12px;letter-spacing:.14em;font-weight:900;color:#c2cae0}.nav-label b{color:#4cf1f9}.nav-link{font-size:13px;font-weight:850;border:1px solid var(--edge);border-radius:28px;padding:11px 17px}.hero{max-width:1320px;min-height:min(690px,76vh);margin:8px auto 0;padding:55px 5.5%;border:1px solid #37376c;border-radius:32px;display:grid;grid-template-columns:1.15fr 1fr;overflow:hidden;position:relative;background:radial-gradient(circle at 72% 62%,rgba(100,0,168,.39),transparent 35%),linear-gradient(115deg,#090b26,#100e35 62%,#080b2e)}.hero:before{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(90deg,transparent 0 90px,rgba(47,200,254,.035) 91px 92px)}.hero-text{z-index:2;position:relative;align-self:center}.eyebrow{display:inline-flex;align-items:center;gap:10px;border:1px solid #218c9f;background:#0b303e;padding:10px 15px;border-radius:30px;font-size:10px;font-weight:1000;letter-spacing:.2em;color:#67f7f2}.eyebrow.simple{background:none;border:0;padding:0;color:#50f6fc}.pip{height:7px;width:7px;border-radius:50%;background:#5fffd6;box-shadow:0 0 15px #5fffd6}.hero h1{margin:24px 0 12px;font-size:clamp(41px,5.25vw,84px);letter-spacing:-.065em;line-height:.99;font-weight:1000}.hero h1 em,.section-head h2 em,.short-link h2 em{font-style:normal;color:var(--gold)}.hero h1 em{color:var(--cyan)}.hero p{font-size:clamp(15px,1.3vw,19px);line-height:1.7;max-width:570px;color:#d3def2;font-weight:530}.hero-cta,.play-btn{display:inline-flex;border:0;align-items:center;justify-content:center;gap:20px;background:linear-gradient(110deg,#fff776,#ffb93e);color:#10112a;font-weight:1000;border-radius:17px;padding:18px 26px;box-shadow:0 15px 35px #ffbb3e24;white-space:nowrap}.hero-cta{margin-top:14px}.hero-stats{display:flex;gap:24px;flex-wrap:wrap;margin-top:29px;color:#adb8d4;font-size:12px;font-weight:650}.hero-stats b{color:var(--cyan);font-size:21px;margin-right:4px}.hero-art{display:grid;place-items:center;position:relative;min-height:440px}.hero-art img{width:min(360px,70%);position:relative;z-index:3;filter:drop-shadow(0 0 50px #4ed5ff66) drop-shadow(0 32px 25px #000a)}.orb{position:absolute;border-radius:50%;border:2px solid #51f6f3b3;box-shadow:0 0 55px #46ccff61,inset 0 0 65px #4550ed44}.orb1{height:420px;width:420px;background:radial-gradient(circle,#2642c080,transparent 65%)}.orb2{height:520px;width:520px;border-color:#905aff40;transform:rotateX(62deg)}.hero-glyph{position:absolute;font-size:48px;filter:drop-shadow(0 4px 18px #000a)}.g1{top:10%;right:6%}.g2{bottom:10%;left:10%;color:#ffdf52}.g3{bottom:16%;right:4%}.g4{top:16%;left:10%}.world-section{max-width:1320px;margin:70px auto;padding:0 20px}.section-head{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:28px}.section-head h2,.short-link h2{font-size:clamp(32px,3.8vw,53px);margin:10px 0;font-weight:1000;letter-spacing:-.05em}.section-head p{max-width:380px;color:var(--mute);line-height:1.7}.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.world-card{background:#12152c;border:1px solid #383b70;border-radius:27px;overflow:hidden;transition:transform .18s,border-color .18s}.world-card:hover{transform:translateY(-4px);border-color:#94e9fb}.poster{height:215px;position:relative;overflow:hidden;display:grid;place-items:center}.poster:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#11142e65,transparent 65%)}.poster-grid{position:absolute;inset:0;opacity:.55;background-image:linear-gradient(#ffffff17 1px,transparent 1px),linear-gradient(90deg,#ffffff17 1px,transparent 1px);background-size:33px 33px;transform:perspective(260px) rotateX(19deg) scale(1.2)}.poster-symbol{font-size:108px;font-weight:1000;text-shadow:0 14px 35px #0009;filter:drop-shadow(0 0 24px #ffffff59);z-index:1}.flag .poster{background:radial-gradient(circle at 50% 90%,#027acc,#082460 55%,#0b153c)}.math .poster{background:radial-gradient(circle at 50% 65%,#cd6aee,#4b197a 48%,#1b1248)}.images .poster{background:radial-gradient(circle at 50% 65%,#4efaff,#0b689f 44%,#13163e)}.english .poster{background:radial-gradient(circle at 50% 80%,#faa751,#e83b88 40%,#3a1a60)}.poster-track{position:absolute;bottom:0;height:5px;width:100%;background:linear-gradient(90deg,transparent,#fff7,transparent)}.poster-label{position:absolute;top:18px;left:20px;font-size:10px;z-index:2;font-weight:900;letter-spacing:.17em;background:#08142d88;padding:8px 11px;border-radius:20px}.card-body{padding:24px 27px 27px}.chip{font-size:10px;letter-spacing:.14em;font-weight:1000;color:#78eaf8}.card-body h3{font-size:39px;line-height:1.15;letter-spacing:-.04em;margin:10px 0}.card-body h3 em{font-style:normal;color:var(--gold)}.card-body p{color:#bfcae3;line-height:1.55;max-width:480px;min-height:51px}.card-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:20px}.card-bottom>span{font-size:11px;font-weight:850;color:#aeb9d5}.play-btn{padding:13px 19px;border-radius:14px;font-size:13px}.short-link{max-width:1280px;margin:50px auto 80px;padding:34px 44px;border:1px solid #643c79;border-radius:24px;background:radial-gradient(circle at 80% 80%,#512d6666,transparent 40%),#1b1234;display:flex;align-items:center;justify-content:space-between;gap:30px}.short-link p{color:#cbcee6}.short-link a{font-size:13px;font-weight:1000;background:#fff3;border:1px solid #ffffff4a;border-radius:18px;padding:15px 20px;white-space:nowrap}footer{text-align:center;color:#66739c;font-size:11px;letter-spacing:.18em;padding:25px}
/* one-screen arcade */
body.playing{overflow:hidden}body.playing #home{display:none}.arcade{height:100dvh;min-height:0;overflow:hidden;display:flex;flex-direction:column;padding:6px max(8px,env(safe-area-inset-right)) max(5px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));background:radial-gradient(ellipse at 60% 10%,#211c54,#090b23 70%)}.arcade[hidden]{display:none}.game-header{display:flex;align-items:center;justify-content:space-between;gap:10px;max-height:54px;height:54px;flex-shrink:0}.back{background:#181e3c;border:1px solid #49577c;color:#fff;border-radius:13px;padding:10px 14px;font-weight:850}.game-heading{min-width:0;text-align:center}.game-heading div{color:var(--cyan);font-size:10px;letter-spacing:.15em;font-weight:900}.game-heading strong{font-size:clamp(14px,2vw,22px);letter-spacing:.02em;white-space:nowrap}.game-header img{height:45px;max-width:60px;object-fit:contain}.game-meta{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;max-width:1100px;width:100%;margin:4px auto}.meta-pill{text-align:center;background:#171c3b;border:1px solid #303b68;border-radius:10px;padding:6px 4px;font-weight:850;font-size:clamp(10px,1.2vw,13px);white-space:nowrap}.meta-pill b{font-size:clamp(15px,1.9vw,22px);color:#fff8bf;padding:0 3px}.meta-pill small{color:#8997be}.stage-bars{display:flex;max-width:1100px;width:100%;gap:5px;margin:4px auto;flex-shrink:0}.stage-bars div{height:5px;flex:1;background:#273358;border-radius:10px}.stage-bars div.done{background:#68efd6}.stage-bars div.active{background:#ffd562;box-shadow:0 0 12px #ffcf45}.canvas-shell{flex:1;min-height:0;width:100%;max-width:1100px;margin:4px auto;display:grid;place-items:center;position:relative;background:#090e28;border:1px solid #3b5683;border-radius:16px;overflow:hidden}.canvas-shell canvas{display:block;width:auto;height:auto;max-width:100%;max-height:100%;aspect-ratio:5/3;touch-action:none;object-fit:contain}.toast{position:absolute;left:50%;top:14px;transform:translate(-50%,-8px);border:1px solid #64f2f2;background:#0d3145e8;border-radius:15px;padding:8px 15px;font-size:clamp(12px,1.4vw,17px);font-weight:900;text-align:center;pointer-events:none;opacity:0;transition:opacity .16s;max-width:92%;z-index:2}.toast.show{opacity:1;transform:translate(-50%,0)}.instructions{height:24px;flex-shrink:0;color:#b5d6f5;text-align:center;font-weight:750;font-size:clamp(10px,1.15vw,14px);padding:3px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.touch-controls{width:100%;max-width:1100px;margin:auto;height:114px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:0 15px}.joystick{width:100px;height:100px;flex-shrink:0;border-radius:50%;border:2px solid #6cfaff7d;background:radial-gradient(circle,#19416a,#161d42);box-shadow:inset 0 0 28px #0007,0 0 20px #51efff19;display:grid;place-items:center;touch-action:none;user-select:none}.stick{width:43px;height:43px;border-radius:50%;background:linear-gradient(140deg,#8efbff,#36b2f2);box-shadow:0 0 16px #43f9fe99;transform:translate(0,0)}.control-help{flex:1;color:#bed9ed;text-align:center}.control-help span{display:block;font-weight:900;font-size:12px}.control-help small{font-size:10px;color:#8197b7}.action-btn{border:0;min-width:100px;min-height:73px;border-radius:20px;background:linear-gradient(145deg,#fff184,#ffb443);color:#161528;font-weight:1000;box-shadow:0 10px 25px #ffaa2730;touch-action:manipulation}.puzzle-layer,.transition{position:absolute;inset:0;background:#060920e8;z-index:10;display:grid;place-items:center;padding:10px;overflow:hidden}.puzzle-layer[hidden],.transition[hidden]{display:none}.puzzle-card,.transition-card{width:min(690px,100%);max-height:100%;overflow:auto;background:linear-gradient(145deg,#14193a,#222046);border:2px solid #6bdcfb;border-radius:25px;box-shadow:0 0 55px #2084f54f;padding:clamp(14px,2.5vh,32px);text-align:center}.puzzle-tag{font-size:11px;letter-spacing:.18em;color:#71fff0;font-weight:1000}.puzzle-card h2{font-size:clamp(19px,3.4vh,34px);margin:10px 0;line-height:1.18}.puzzle-visual{font-size:clamp(35px,7vh,74px);min-height:clamp(45px,9vh,105px);display:flex;justify-content:center;align-items:center;color:#fff3a3;gap:8px}.puzzle-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.choice{background:#1c2e54;border:2px solid #526f9e;border-radius:16px;color:white;padding:clamp(10px,2vh,24px) 5px;font-size:clamp(12px,2.2vh,19px);font-weight:900;min-height:62px}.choice:active,.choice:hover{border-color:#a3fffd;background:#28517b}.choice.correct{background:#165b51;border-color:#82ffbf}.choice.wrong{background:#742c52;border-color:#ff718f}.puzzle-feedback{min-height:24px;font-size:13px;color:#ffd578;font-weight:850;padding-top:8px}.transition-card{border-color:#ffd767;padding:28px;max-width:550px}.transition-glow{font-size:75px;color:#ffe077;text-shadow:0 0 40px #ffd778}.transition h2{font-size:clamp(30px,5vw,55px);margin:10px 0}.transition p{color:#e1dbf5;font-size:16px;line-height:1.65}.transition .hero-cta{font-size:14px}@media(max-width:720px){.nav{padding:9px 14px}.brand img{height:42px;width:42px}.brand strong{font-size:18px}.nav-label{display:none}.nav-link{font-size:11px;padding:9px}.hero{margin:4px 9px;padding:28px 24px 12px;min-height:unset;display:flex;flex-direction:column;border-radius:22px}.hero h1{font-size:clamp(34px,8vw,50px)}.hero p{font-size:14px}.hero-art{min-height:180px;height:185px}.hero-art img{width:170px}.orb1{width:200px;height:200px}.orb2{width:270px;height:270px}.hero-glyph{font-size:30px}.hero-stats{gap:9px}.hero-stats b{font-size:17px}.world-section{margin:42px auto;padding:0 14px}.section-head{display:block}.cards{grid-template-columns:1fr;gap:16px}.poster{height:180px}.card-body{padding:20px}.card-body h3{font-size:34px}.short-link{margin:35px 14px;display:block;padding:24px}.short-link a{display:inline-flex;margin-top:14px}.game-header{height:42px}.game-header img{height:34px}.back{padding:6px 8px;font-size:11px}.meta-pill{font-size:9px;padding:5px 2px}.meta-pill b{font-size:14px}.touch-controls{height:102px;padding:0 9px}.joystick{width:94px;height:94px}.action-btn{min-width:90px;min-height:68px}.control-help span{font-size:10px}.control-help small{font-size:9px}.puzzle-card{border-radius:18px}}@media(max-height:650px){.arcade{padding-top:2px}.game-header{height:37px}.game-header img{height:31px}.game-meta{margin:1px auto}.meta-pill{padding:3px}.stage-bars{margin:2px auto}.instructions{height:19px;padding:0}.touch-controls{height:88px}.joystick{width:79px;height:79px}.stick{width:35px;height:35px}.action-btn{min-width:86px;min-height:57px}.puzzle-visual{font-size:35px;min-height:41px}.puzzle-card{padding:12px}.puzzle-card h2{font-size:19px}.choice{min-height:52px;padding:9px 3px;font-size:12px}}@media(orientation:landscape) and (max-height:500px){.touch-controls{height:66px}.joystick{width:60px;height:60px}.action-btn{min-height:50px}.game-header{height:29px}.game-header img{height:25px}.puzzle-card{max-width:780px}.puzzle-visual{min-height:30px;font-size:28px}.puzzle-card h2{margin:5px 0}.choice{min-height:44px;padding:6px}}

/* Conquistar áreas usa trazos en pantalla: no mostrar botones sin función. */
.arcade.math-mode .joystick,.arcade.math-mode .action-btn{display:none}.arcade.math-mode .touch-controls{height:55px;justify-content:center}.arcade.math-mode .control-help{text-align:center}.arcade.math-mode .control-help span{font-size:15px;color:#b7fff6}

/* 4.1: catálogo visible en el primer viewport; sin heros, pasos extra ni botones redundantes. */
html,body{overscroll-behavior:none} .home-compact{height:100dvh;min-height:0;overflow:hidden;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;gap:clamp(5px,1.2vh,15px);padding:clamp(7px,1.25vh,16px) clamp(9px,2vw,28px) max(7px,env(safe-area-inset-bottom));background:radial-gradient(ellipse at 45% 0,#232460,#090b20 70%)}
.arcade-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:0}.arcade-nav .brand img{height:clamp(33px,5vh,52px);width:clamp(33px,5vh,52px)}.arcade-nav .brand strong{font-size:clamp(16px,2.25vw,26px)}.arcade-nav .brand small{font-size:9px}.shorts-brand{display:flex;align-items:center;gap:7px;border:1px solid #525a91;background:#161a3b;border-radius:20px;padding:4px 12px 4px 4px;font-weight:900;font-size:clamp(10px,1.4vw,13px)}.shorts-brand img{width:clamp(25px,4vh,36px);height:clamp(25px,4vh,36px);object-fit:contain}.shorts-brand b{color:#74f9ff}
.catalog-head{display:flex;align-items:end;justify-content:space-between;gap:8px;min-height:0}.catalog-eyebrow{font-size:clamp(9px,1vw,11px);font-weight:1000;letter-spacing:.15em;color:#73fbf2}.catalog-head h1{font-size:clamp(18px,3vw,35px);line-height:1.08;letter-spacing:-.04em;margin:4px 0 0}.catalog-sub{font-size:clamp(9px,1vw,12px);font-weight:800;letter-spacing:.04em;color:#bec8e0;white-space:nowrap}
.catalog-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(7px,1.2vw,15px);min-height:0}.tile-card{min-width:0;min-height:0;overflow:hidden;border:1px solid #4c5487;color:#fff;text-align:left;background:#141935;border-radius:clamp(14px,1.6vw,24px);padding:0;position:relative;display:grid;grid-template-rows:minmax(0,1fr) auto;transition:filter .16s,transform .16s}.tile-card:hover{filter:brightness(1.15);transform:translateY(-2px)}.tile-picture{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;min-height:0;background:radial-gradient(circle at 50% 45%,#3e78ab,#0d2048 72%)}.tile-card.math .tile-picture{background:radial-gradient(circle at 50% 42%,#a05bde,#241049 70%)}.tile-card.images .tile-picture{background:radial-gradient(circle at 50% 44%,#17a9c5,#0e2251 74%)}.tile-card.english .tile-picture{background:radial-gradient(circle at 50% 44%,#ff8bb4,#3a174d 74%)}.tile-picture:before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 27px,#ffffff12 28px 29px),repeating-linear-gradient(90deg,transparent 0 27px,#ffffff12 28px 29px);transform:perspective(400px) rotateX(23deg) scale(1.4)}.tile-big{position:relative;font-size:clamp(40px,6.8vw,112px);line-height:1;text-shadow:0 10px 40px #0008;filter:drop-shadow(0 0 20px #b1faff85)}.tile-detail{position:absolute;bottom:10%;font-size:clamp(16px,2.2vw,28px);opacity:.8;color:#b8f7fb;letter-spacing:.4em}.tile-text{position:relative;display:flex;flex-direction:column;gap:5px;padding:clamp(10px,1.6vw,21px) clamp(10px,1.5vw,20px);background:#12162f}.tile-text strong{font-size:clamp(17px,2vw,28px);line-height:1.08}.tile-text small{font-size:clamp(8px,.95vw,11px);color:#9bf1f9;letter-spacing:.07em;font-weight:950}.tile-arrow{position:absolute;bottom:16px;right:13px;color:#ffe888;font-size:23px;font-weight:1000}
.catalog-foot{display:flex;align-items:center;gap:9px;justify-content:center;color:#c8d5ed;font-size:clamp(9px,1vw,12px);min-height:0}.catalog-foot img{width:27px;height:27px;object-fit:contain}.catalog-foot a{color:#79faff;font-weight:950;margin-left:12px}
/* HUD compacto; el canvas no crece más allá de la pantalla útil */
.arcade{height:100dvh;max-height:100dvh}.arcade .canvas-shell{flex:1;min-height:0}.arcade .puzzle-card{overflow:auto;max-height:min(88dvh,660px)}
@media(max-width:850px){.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}.catalog-head{align-items:start}.catalog-sub{display:none}.tile-big{font-size:clamp(44px,12vw,100px)}.tile-detail{font-size:clamp(13px,3vw,25px)}.tile-text strong{font-size:clamp(16px,3.7vw,23px)}.tile-text small{font-size:clamp(8px,1.8vw,10px)}.tile-arrow{font-size:18px;right:8px;bottom:13px}.catalog-foot{font-size:clamp(8px,2vw,12px)} }
@media(max-width:450px){.home-compact{gap:7px;padding:8px 9px max(5px,env(safe-area-inset-bottom))}.catalog-head h1{font-size:clamp(16px,5vw,22px)}.tile-text{padding:10px 8px}.tile-text strong{font-size:clamp(15px,4.6vw,21px)}.tile-text small{font-size:8px;line-height:1.2;padding-right:7px}.tile-arrow{display:none}.tile-picture:before{background-size:18px 18px}.catalog-foot img{width:22px;height:22px}}
@media(max-height:590px){.home-compact{gap:4px;padding-top:4px}.arcade-nav .brand img{height:30px;width:30px}.arcade-nav .brand strong{font-size:16px}.catalog-head h1{margin:0;font-size:clamp(15px,3.1vw,24px)}.catalog-eyebrow{display:none}.tile-text{padding:6px 8px;gap:2px}.tile-text strong{font-size:clamp(13px,3.5vw,19px)}.tile-text small{font-size:8px}.catalog-foot img{display:none}.catalog-foot{font-size:9px}.shorts-brand img{width:25px;height:25px}}
@media(orientation:landscape) and (max-height:490px){.catalog-grid{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:1fr}.tile-big{font-size:clamp(32px,7vh,67px)}.tile-text strong{font-size:clamp(12px,2.3vw,18px)}.catalog-head h1{font-size:clamp(13px,3vw,24px)}.catalog-foot{display:none}}

.arcade.math-mode .joystick{display:grid}.arcade.math-mode .action-btn{display:none}.arcade.math-mode .touch-controls{height:104px;justify-content:center;gap:16px}.arcade.math-mode .control-help{text-align:left}.arcade.math-mode .control-help span{font-size:12px;color:#b7fff6}.control-help{display:none}.touch-controls{justify-content:space-between}.arcade.math-mode .control-help{display:block}.arcade.math-mode .control-help small{display:none}@media(max-height:650px){.arcade.math-mode .touch-controls{height:80px}}

.transition .transition-card:has(#nextBtn){} .transition-card #nextBtn{display:inline-flex} .arcade .transition:not([hidden]) .transition-card{padding:16px} 

/* V4.2: retos visuales con lógica matricial, más legibles incluso en móvil. */
.puzzle-visual{white-space:pre-line;font-family:ui-monospace,SFMono-Regular,Consolas,'DejaVu Sans Mono',monospace;font-size:clamp(23px,4.3vh,48px);line-height:1.19;max-width:100%;word-break:normal;min-height:62px;padding:8px 3px}
.puzzle-card h2{font-size:clamp(18px,3vh,29px)}
@media(max-width:560px) and (orientation:portrait){.arcade.portrait-focus .canvas-shell{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);background:radial-gradient(circle at 50% 45%,#17285f,#090d28 82%)}.arcade.portrait-focus .canvas-shell canvas{height:100%;width:auto;max-width:none;max-height:100%;min-width:0;justify-self:center}}
@media(max-width:480px){.puzzle-visual{font-size:clamp(17px,3.2vh,30px);letter-spacing:-.025em}.puzzle-choices{gap:5px}.choice{font-size:clamp(11px,1.8vh,16px);padding:8px 2px}}
@media(orientation:landscape) and (max-height:470px){.puzzle-visual{font-size:19px;min-height:48px;line-height:1.05}.puzzle-card h2{font-size:17px}}

/* QUBIRAX 4.3 — Aspect-fit of the ENTIRE canvas in both portrait and landscape. */
html,body{width:100%;height:100%;margin:0}
body.playing{height:100dvh;overflow:hidden;touch-action:pan-x pan-y}
.arcade{box-sizing:border-box;min-height:0;height:100dvh;max-height:100dvh;overflow:hidden;display:flex;flex-direction:column}
.arcade .canvas-shell{box-sizing:border-box;position:relative;flex:1 1 0;min-height:0;max-width:1330px;width:100%;display:flex;justify-content:center;align-items:center;overflow:hidden;margin:3px auto}
.arcade .canvas-shell canvas,.arcade.portrait-focus .canvas-shell canvas{position:relative;display:block;box-sizing:content-box;flex:none;aspect-ratio:5/3;object-fit:contain;min-width:0;max-width:100%!important;max-height:100%!important}
.arcade .game-header,.arcade .game-meta,.arcade .stage-bars,.arcade .instructions,.arcade .touch-controls{flex-shrink:0}
.arcade .touch-controls{margin:0 auto}
@media(max-height:660px){
 .arcade .game-header{height:34px}
 .arcade .game-meta{margin:1px auto}
 .arcade .meta-pill{padding:3px 1px}
 .arcade .stage-bars{margin:1px auto}
 .arcade .instructions{height:17px;line-height:17px;padding:0;font-size:10px}
 .arcade .touch-controls{height:72px}
 .arcade .joystick{width:65px;height:65px}
 .arcade .stick{width:30px;height:30px}
 .arcade .action-btn{min-height:51px}
 .arcade.math-mode .touch-controls{height:72px}
}
@media(orientation:landscape) and (max-height:440px){
 .arcade .game-header{height:26px}
 .arcade .stage-bars{display:none}
 .arcade .touch-controls{height:51px}
 .arcade.math-mode .touch-controls{height:51px}
 .arcade .joystick{width:47px;height:47px}
 .arcade .stick{width:22px;height:22px}
 .arcade .action-btn{min-height:42px}
 .arcade .game-heading div{display:none}
}

/* QUBIRAX 4.5 - single-screen catalog, real illustrated posters and offline country flags. */
.home-compact{grid-template-rows:auto auto minmax(0,1fr)}
.catalog-foot{display:none!important}
.tile-picture{display:block;overflow:hidden;position:relative;isolation:isolate}
.tile-picture .poster-image{position:absolute;width:100%;height:100%;inset:0;object-fit:cover;object-position:center;filter:saturate(1.15)}
.tile-picture:after{content:'';position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 -18px 34px #070c2985}
.tile-card .tile-picture{background:#090c2b!important}
.puzzle-visual.flag-quiz{min-height:clamp(95px,19dvh,205px);padding:0;margin:4px auto 12px}
.puzzle-flag-img{display:block;max-width:min(235px,65vw);max-height:clamp(90px,19dvh,182px);width:auto;height:auto;object-fit:contain;filter:drop-shadow(0 12px 14px #000a) drop-shadow(0 0 9px #4fd9ff44);image-rendering:auto}
.arcade .puzzle-card:has(.flag-quiz){max-width:770px}
@media(max-width:540px){.puzzle-visual.flag-quiz{min-height:clamp(80px,14dvh,145px)}.puzzle-flag-img{max-height:clamp(77px,14dvh,145px)}}
@media(max-height:580px){.puzzle-visual.flag-quiz{min-height:75px}.puzzle-flag-img{max-height:75px}}
@media(max-width:450px){.tile-picture .poster-image{object-position:70% 50%}}


/* v4.5.1 — imágenes completas y aisladas en documento propio */
html, body { max-width: 100%; }
.home-compact .catalog-grid .tile-card .tile-picture { background:#0e1b45 !important; isolation:isolate; }
.home-compact .catalog-grid .tile-card .tile-picture img.poster-image {
  display:block !important; position:absolute !important; inset:0 !important;
  box-sizing:border-box !important; width:100% !important; height:100% !important;
  max-width:100% !important; max-height:100% !important;
  object-fit:contain !important; object-position:center center !important;
  transform:none !important; scale:1 !important; filter:none !important;
}