:root{--bg: #0b3b4a;--ink: #fff7e6;--ink-soft: #cfeae4;--pink: #ff5da2;--sky: #22c8c2;--amber: #ffc94a;--grass: #2fbf71;--violet: #8b6bff;--coral: #ff7a55;--gold: #ffd966}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{margin:0;min-height:100%}body{background:var(--bg);color:var(--ink);font-family:Segoe UI,system-ui,-apple-system,Helvetica,Arial,sans-serif}.blob{position:absolute;border-radius:50%;filter:blur(70px);opacity:.3;z-index:0;animation:blobmove 20s ease-in-out infinite alternate}.blob.b1{width:36vw;height:36vw;background:var(--violet);top:-16%;left:-10%}.blob.b2{width:30vw;height:30vw;background:var(--sky);bottom:-16%;right:-8%;animation-duration:24s}@keyframes blobmove{0%{transform:translate(0) scale(1)}to{transform:translate(4vw,3vh) scale(1.12)}}.ambient{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none;z-index:1}.spark{position:absolute;bottom:-6%;opacity:0;animation:drift linear infinite;line-height:1;filter:drop-shadow(0 2px 4px rgba(0,0,0,.35))}@keyframes drift{0%{transform:translateY(0) scale(.6);opacity:0}12%{opacity:.7}88%{opacity:.5}to{transform:translateY(-112vh) scale(1.1);opacity:0}}.sun{position:absolute;top:-8vh;right:6vw;width:22vw;height:22vw;max-width:260px;max-height:260px;border-radius:50%;z-index:0;pointer-events:none;background:radial-gradient(circle at 50% 50%,#FFF7E6 0%,var(--gold) 35%,var(--amber) 65%,rgba(255,201,74,0) 72%);box-shadow:0 0 90px 30px #ffc94a59;animation:sunpulse 6s ease-in-out infinite}.sun:before{content:"";position:absolute;top:-35%;right:-35%;bottom:-35%;left:-35%;background:repeating-conic-gradient(rgba(255,217,102,.35) 0deg 4deg,transparent 4deg 18deg);border-radius:50%;animation:sunspin 40s linear infinite;opacity:.6}@keyframes sunpulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.06);opacity:.85}}@keyframes sunspin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.waves{position:absolute;left:0;right:0;bottom:0;height:9vh;min-height:54px;overflow:hidden;z-index:1;pointer-events:none}.wave{position:absolute;bottom:0;left:0;width:200%;height:100%;background-repeat:repeat-x;background-size:50% 100%}.wave.w1{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'%3E%3Cpath d='M0,40 C300,90 900,0 1200,40 L1200,120 L0,120 Z' fill='%2322C8C2' fill-opacity='.28'/%3E%3C/svg%3E");animation:wavemove 16s linear infinite;opacity:.9}.wave.w2{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'%3E%3Cpath d='M0,60 C400,10 800,100 1200,50 L1200,120 L0,120 Z' fill='%230B3B4A' fill-opacity='.65'/%3E%3C/svg%3E");animation:wavemove 10s linear infinite reverse}@keyframes wavemove{0%{transform:translate(0)}to{transform:translate(-50%)}}html:has(.stage),body:has(.stage){overflow:hidden;height:100%}.stage{position:relative;width:100vw;height:100vh;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2.4vh;padding:3vh 3vw}.title{font-size:clamp(34px,5.6vw,64px);font-weight:900;letter-spacing:.01em;text-align:center;-webkit-text-stroke:4px rgba(11,59,74,.85);paint-order:stroke fill;background:linear-gradient(135deg,var(--gold),var(--pink) 55%,var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 6px 0 rgba(11,59,74,.35))}.subtitle{font-family:Consolas,Menlo,monospace;font-size:clamp(13px,1.5vw,18px);color:var(--ink-soft);text-align:center;margin-top:-1.2vh}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2vh 2vw;width:100%;max-width:1180px}.card{position:relative;border-radius:22px;padding:2.6vh 1.4vw;text-decoration:none;color:inherit;display:flex;flex-direction:column;align-items:center;gap:.8vh;text-align:center;box-shadow:0 16px 34px -18px #000000a6;border:3px solid rgba(255,255,255,.12);transition:transform .18s ease,box-shadow .18s ease}.card:hover,.card:focus-visible{transform:translateY(-6px) scale(1.02);box-shadow:0 22px 40px -16px #000000b3;outline:none}.card .ico{font-size:clamp(42px,5.4vw,68px)}.card .nm{font-size:clamp(17px,1.9vw,24px);font-weight:900}.card .tag{font-family:Consolas,Menlo,monospace;font-size:clamp(11px,1.05vw,13px);color:#0b3b4ab8;line-height:1.4}.card .key{margin-top:.6vh;width:2em;height:2em;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#0b3b4a38;font-family:Consolas,Menlo,monospace;font-weight:800;font-size:clamp(12px,1.2vw,15px);color:#0b3b4a}.card.c1{background:linear-gradient(150deg,var(--violet),var(--sky));color:#0b3b4a}.card.c2{background:linear-gradient(150deg,var(--coral),var(--pink));color:#0b3b4a}.card.c3{background:linear-gradient(150deg,var(--gold),var(--amber));color:#0b3b4a}.card.locked{background:#ffffff0d;border-style:dashed;color:var(--ink-soft);cursor:not-allowed}.card.locked .ico{opacity:.5;filter:grayscale(1)}.card.locked .tag{color:var(--ink-soft)}.card.locked .badge{position:absolute;top:1.2vh;right:1.2vw;font-family:Consolas,Menlo,monospace;font-size:10.5px;background:#00000059;padding:3px 9px;border-radius:20px;letter-spacing:.06em}.stage .hint{position:absolute;bottom:1.8vh;left:0;right:0;text-align:center;z-index:2;font-family:Consolas,Menlo,monospace;font-size:12.5px;color:var(--ink-soft)}.help{position:absolute;top:0;right:0;bottom:0;left:0;z-index:40;display:none;background:#000000d9;color:var(--ink);align-items:center;justify-content:center}.help.show{display:flex}.help div{font-family:Consolas,Menlo,monospace;font-size:16px;line-height:2;text-align:left}.help b{color:var(--amber)}.hostShell{position:relative;min-height:100vh;padding:max(14px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left))}.hostShell .title{font-size:26px;margin:6px 0 2px;filter:drop-shadow(0 3px 0 rgba(11,59,74,.35));-webkit-text-stroke:2.5px rgba(11,59,74,.85)}.hostShell .status{text-align:center;font-family:Consolas,Menlo,monospace;font-size:12px;color:var(--ink-soft);margin-bottom:14px}.hostShell .status .dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px;background:var(--coral)}.hostShell .status.ok .dot{background:var(--grass)}.hostShell .gate{max-width:420px;margin:14vh auto 0;text-align:center;padding:0 8px}.hostShell .gate p{color:var(--ink-soft);font-size:14px;line-height:1.5}.hostShell .gate input{width:100%;padding:16px;font-size:20px;border-radius:14px;border:2px solid rgba(255,255,255,.18);background:#ffffff0f;color:var(--ink);text-align:center;letter-spacing:.04em;margin:14px 0}.hostShell .gate input:focus{outline:2px solid var(--amber)}.hostShell .gate button{width:100%;padding:16px;border-radius:14px;border:none;cursor:pointer;font-size:17px;font-weight:800;color:#0b3b4a;background:linear-gradient(135deg,var(--amber),var(--grass))}.hostShell .gate .err{color:var(--coral);font-size:13px;min-height:18px;margin-top:8px}.hostShell .app{display:block;max-width:560px;margin:0 auto}.hostShell .section-label{font-family:Consolas,Menlo,monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);margin:18px 4px 8px}.hostShell .homeBtn{display:block;width:100%;padding:14px;border-radius:14px;text-align:center;background:#ffffff0f;border:2px solid rgba(255,255,255,.12);color:var(--ink);font-weight:800;font-size:15px;cursor:pointer}.hostShell .gameList{display:flex;flex-direction:column;gap:8px}.hostShell .gameItem{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;border:2px solid rgba(255,255,255,.1);background:#ffffff0d;cursor:pointer;color:inherit;text-align:left}.hostShell .gameItem .ico{font-size:26px;width:1.3em;text-align:center}.hostShell .gameItem .nm{font-weight:800;font-size:14.5px}.hostShell .gameItem.active{border-color:var(--amber);background:#ffb02029}.hostShell .gameItem.locked{opacity:.5;cursor:not-allowed;border-style:dashed}.hostShell .gameItem.locked .soon{margin-left:auto;font-family:Consolas,Menlo,monospace;font-size:10px;background:#00000059;padding:3px 9px;border-radius:20px;letter-spacing:.05em;white-space:nowrap}.hostShell .changeGameBtn{display:inline-flex;align-items:center;gap:6px;padding:10px 16px;border-radius:12px;background:#ffffff0f;border:2px solid rgba(255,255,255,.14);color:var(--ink);font-weight:800;font-size:13.5px;cursor:pointer;margin-top:4px}.hostShell .activeGame{display:flex;align-items:center;gap:10px;margin:10px 0 2px;padding:10px 12px;border-radius:14px;background:#ffb02024;border:2px solid rgba(255,176,32,.4)}.hostShell .activeGame .ico{font-size:26px}.hostShell .activeGame .nm{font-weight:900;font-size:15px}.hostShell .panel{margin-top:10px;padding:12px;border-radius:16px;background:#ffffff0a;border:2px dashed rgba(255,255,255,.14)}.hostShell .panel .empty{color:var(--ink-soft);font-size:13.5px;text-align:center;padding:10px}.hostShell .btnGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.hostShell .btnGrid button{padding:16px 8px;border-radius:14px;border:none;cursor:pointer;font-size:14.5px;font-weight:800;color:#0b3b4a;line-height:1.25;background:linear-gradient(135deg,var(--sky),var(--violet));box-shadow:0 8px 16px -10px #0009}.hostShell .btnGrid button.wide{grid-column:1 / -1}.hostShell .btnGrid button:active{transform:scale(.96)}.hostShell .btnGrid button.danger{background:linear-gradient(135deg,var(--coral),var(--pink))}.hostShell .btnGrid button.good{background:linear-gradient(135deg,var(--grass),var(--sky))}.hostShell .btnGrid button.gold{background:linear-gradient(135deg,var(--gold),var(--amber))}.hostShell .pasaHint{color:var(--ink-soft);font-size:13.5px;text-align:center;padding:6px 4px 14px;line-height:1.4}.hostShell .pasaProgreso{font-family:Consolas,Menlo,monospace;font-size:11.5px;letter-spacing:.04em;color:var(--ink-soft);margin-bottom:8px;text-transform:uppercase}.hostShell .pasaPregunta{font-weight:800;font-size:15.5px;line-height:1.4;margin-bottom:10px}.hostShell .pasaRespuesta{font-family:Consolas,Menlo,monospace;font-size:14px;color:var(--ink-soft);margin-bottom:14px}.hostShell .pasaRespuesta b{color:var(--gold);letter-spacing:.03em}.hostShell .pasaFin{text-align:center;padding:20px 6px 8px}.hostShell .pasaFin .pasaFinIco{font-size:46px;margin-bottom:8px}.hostShell .pasaFin .pasaFinTitulo{font-weight:900;font-size:16.5px}.hostShell .pasaFin.win .pasaFinTitulo{color:var(--gold)}.hostShell .pasaFin.lose .pasaFinTitulo{color:var(--coral)}.hostShell .memoCode{text-align:center;padding:10px 6px 18px;margin-bottom:6px;border-bottom:2px dashed rgba(255,255,255,.14)}.hostShell .memoCodeLabel{color:var(--ink-soft);font-size:12.5px;margin-bottom:8px}.hostShell .memoCodeValue{font-family:Consolas,Menlo,monospace;font-weight:900;font-size:34px;letter-spacing:.12em;color:var(--gold);margin-bottom:12px}.hostShell .memoCodeHint{color:var(--ink-soft);font-size:12px;margin-top:10px;line-height:1.4}.hostShell .pasaResetBtn{display:block;width:100%;text-align:center;justify-content:center;margin-top:12px}.hostShell .footer{text-align:center;font-family:Consolas,Menlo,monospace;font-size:11px;color:var(--ink-soft);margin:22px 0 8px}.hostShell .footer button{background:none;border:none;color:var(--ink-soft);text-decoration:underline;font-size:11px;cursor:pointer}