:root{--fondo: #0e0b16;--fondo-alto: #1a1526;--borde: #2e2740;--texto: #f2eef8;--texto-suave: #a79fbd;--acento: #ff5c8a;--acento-oscuro: #d63e6b;--ok: #4ade80;--malo: #f87171;--radio: 16px;--ancho: 30rem;--lado: 1.25rem}*{box-sizing:border-box}html,body{margin:0;min-height:100%}body{background:var(--fondo);background-image:radial-gradient(circle at 50% 0%,#2a1d3d 0%,var(--fondo) 60%);background-attachment:fixed;color:var(--texto);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased;overflow-wrap:break-word;-webkit-text-size-adjust:100%;text-size-adjust:100%}#root{min-height:100vh;min-height:100dvh}.app{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}.pantalla{width:100%;max-width:var(--ancho);padding:clamp(.75rem,3vh,1.5rem) var(--lado) clamp(1.25rem,5vh,2.5rem);display:flex;flex-direction:column;gap:clamp(.75rem,2.5vh,1.25rem);flex:1}h1,h2,h3{margin:0;line-height:1.15}h1{font-size:clamp(2.25rem,11vw,2.75rem);letter-spacing:-.02em}h2{font-size:clamp(1.35rem,5.5vw,1.5rem)}h3{font-size:.95rem;text-transform:uppercase;letter-spacing:.08em;color:var(--texto-suave)}p{margin:0;line-height:1.55}.atenuado{color:var(--texto-suave);font-size:.95rem}.centrado{text-align:center}.banner{width:100%;display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.5rem;font-size:.8rem;letter-spacing:.03em;background:var(--fondo-alto);border-bottom:1px solid var(--borde);color:var(--texto-suave)}.punto{width:.5rem;height:.5rem;border-radius:50%;background:currentColor}.banner.ok .punto{background:var(--ok)}.banner.malo{color:var(--malo)}.banner.pendiente .punto{background:var(--texto-suave);animation:latido 1.2s ease-in-out infinite}@keyframes latido{50%{opacity:.25}}.hero{text-align:center;display:flex;flex-direction:column;gap:.75rem;margin-top:auto;padding-top:1rem}.hero-emoji{font-size:clamp(2.5rem,14vw,3.5rem);line-height:1}.campo{display:flex;flex-direction:column;gap:.4rem}.campo>span{font-size:.85rem;color:var(--texto-suave);text-transform:uppercase;letter-spacing:.06em}input{width:100%;padding:.9rem 1rem;font-size:1.05rem;font-family:inherit;color:var(--texto);background:var(--fondo-alto);border:1px solid var(--borde);border-radius:var(--radio)}input:focus-visible{outline:2px solid var(--acento);outline-offset:1px}input::placeholder{color:#6b6383}.input-codigo{text-align:center;font-size:1.9rem;font-weight:700;letter-spacing:.35em;text-indent:.35em;text-transform:uppercase}.acciones{display:flex;flex-direction:column;gap:.75rem}.btn{min-height:3.25rem;padding:.9rem 1.25rem;font-size:1.05rem;font-weight:600;font-family:inherit;color:var(--texto);background:var(--fondo-alto);border:1px solid var(--borde);border-radius:var(--radio);cursor:pointer;transition:transform .08s ease,filter .15s ease}.btn:active:not(:disabled){transform:scale(.98)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn:focus-visible{outline:2px solid var(--acento);outline-offset:2px}.btn-primario{background:linear-gradient(180deg,var(--acento),var(--acento-oscuro));border-color:transparent;color:#fff}@media(hover:hover){.btn-primario:hover:not(:disabled){filter:brightness(1.08)}.modo:not(:disabled):hover{border-color:var(--texto-suave)}}.btn-fantasma{background:transparent}.btn-texto{background:none;border:none;min-height:auto;padding:.5rem;font-size:.9rem;font-weight:500;color:var(--texto-suave);margin-top:auto}.btn-chico{min-height:2.25rem;padding:.35rem .85rem;font-size:.85rem}.btn-grande{min-height:4rem;font-size:1.2rem}.btn-camino{display:flex;align-items:center;gap:.9rem;padding:1rem;text-align:left}.camino-emoji{font-size:1.9rem;line-height:1;flex:none}.camino-texto{display:flex;flex-direction:column;gap:.15rem}.camino-texto strong{font-size:1.05rem}.camino-texto small{font-size:.8rem;font-weight:400;line-height:1.35;opacity:.75}.fila-agregar{display:flex;gap:.5rem}.fila-agregar input{flex:1;min-width:0}.fila-agregar .btn{flex:none;align-self:stretch}.btn-quitar{margin-left:auto;flex:none;width:2rem;height:2rem;display:grid;place-items:center;font-size:.9rem;font-family:inherit;color:var(--texto-suave);background:none;border:1px solid var(--borde);border-radius:50%;cursor:pointer}@media(hover:hover){.btn-quitar:hover{color:var(--malo);border-color:var(--malo)}}.btn-quitar:focus-visible{outline:2px solid var(--acento);outline-offset:2px}.caja-codigo{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:1.5rem 1rem;background:var(--fondo-alto);border:1px solid var(--borde);border-radius:var(--radio)}.etiqueta{font-size:.75rem;text-transform:uppercase;letter-spacing:.12em;color:var(--texto-suave)}.codigo{font-size:clamp(2.5rem,14vw,3.5rem);font-weight:800;letter-spacing:.18em;text-indent:.18em;color:var(--acento);font-variant-numeric:tabular-nums}.lista ul{list-style:none;margin:.75rem 0 0;padding:0 .25rem;display:flex;flex-direction:column;gap:.5rem;max-height:min(45vh,21rem);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--borde) transparent}.lista li{display:flex;align-items:center;gap:.75rem;padding:.7rem .9rem;background:var(--fondo-alto);border:1px solid var(--borde);border-radius:12px}.avatar{width:2rem;height:2rem;flex:none;display:grid;place-items:center;border-radius:50%;background:var(--acento);color:#fff;font-weight:700}.nombre{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chip{margin-left:auto;flex:none;padding:.15rem .55rem;font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;color:var(--texto-suave);border:1px solid var(--borde);border-radius:999px}.chip+.chip{margin-left:.35rem}.chip-yo{color:var(--acento);border-color:var(--acento)}.contador{color:var(--acento)}.espera{padding:1rem 0}.modos{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem;margin:.75rem 0 .6rem}.modo{display:flex;flex-direction:column;gap:.2rem;padding:.85rem .75rem;text-align:left;font-family:inherit;color:var(--texto);background:var(--fondo-alto);border:1px solid var(--borde);border-radius:14px;cursor:pointer;transition:border-color .15s ease,background .15s ease}.modo:focus-visible{outline:2px solid var(--acento);outline-offset:2px}.modo-activo{border-color:var(--acento);background:#ff5c8a1f}.modo:disabled{cursor:default;opacity:1}.modo:disabled:not(.modo-activo){opacity:.55}.modo-emoji{font-size:1.35rem;line-height:1}.modo-nombre{font-weight:700;font-size:1rem}.modo-desc{font-size:.78rem;line-height:1.35;color:var(--texto-suave)}.juego{gap:1rem}.juego-cabecera{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:.15rem .75rem}.juego-cabecera .atenuado{font-size:.85rem}.ronda{flex:none;font-size:.85rem;text-transform:uppercase;letter-spacing:.1em;color:var(--acento);font-weight:700}.carta-escena{flex:1;display:flex;perspective:1200px;min-height:min(11rem,30vh)}.carta{position:relative;flex:1;display:grid;place-items:center;padding:2.75rem 1.5rem;text-align:center;background:linear-gradient(160deg,#221b32,var(--fondo-alto) 60%);border:1px solid var(--borde);border-radius:24px;box-shadow:inset 0 1px #ffffff12,0 12px 30px -18px #000;transform-style:preserve-3d}.carta-esquina{position:absolute;top:.85rem;left:1rem;font-size:1.15rem;line-height:1;opacity:.45}.carta-esquina-fin{top:auto;left:auto;bottom:.85rem;right:1rem;transform:rotate(180deg)}.baraja{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.25rem}.baraja-monton{position:relative;display:grid;place-items:center;width:100%;height:min(38vh,13rem)}.baraja-carta{position:absolute;height:min(30vh,11rem);aspect-ratio:5 / 7;border-radius:14px;border:2px solid rgba(255,255,255,.22);background-color:var(--acento-oscuro);background-image:repeating-linear-gradient(45deg,rgba(255,255,255,.1) 0 7px,transparent 7px 14px),linear-gradient(150deg,var(--acento),var(--acento-oscuro));box-shadow:0 10px 24px -12px #000}@media(prefers-reduced-motion:reduce){.banner.pendiente .punto{animation:none}.spinner{animation-duration:3s}}.reto{font-size:clamp(1.4rem,6.5vw,2.1rem);font-weight:700;line-height:1.3;text-wrap:balance}.aviso{padding:.6rem .9rem;font-size:.9rem;text-align:center;color:var(--acento);background:#ff5c8a1f;border-radius:12px}.alerta{padding:.75rem 1rem;font-size:.9rem;color:var(--malo);background:#f871711f;border:1px solid rgba(248,113,113,.35);border-radius:12px}.centro{flex:1;width:100%;max-width:var(--ancho);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:2rem var(--lado);text-align:center}.spinner{width:2.25rem;height:2.25rem;border:3px solid var(--borde);border-top-color:var(--acento);border-radius:50%;animation:gira .8s linear infinite}@keyframes gira{to{transform:rotate(360deg)}}.pie{margin-top:auto;padding-top:1.5rem;font-size:.8rem;text-align:center;color:var(--texto-suave)}@media(max-width:22.5rem){:root{--lado: 1rem}.modos{gap:.4rem}.modo{padding:.7rem .6rem}.input-codigo{font-size:1.6rem;letter-spacing:.25em;text-indent:.25em}.btn-camino{gap:.7rem;padding:.85rem}}@media(min-width:40rem){:root{--ancho: 34rem;--lado: 2rem}.pantalla{padding-top:2rem}.reto{font-size:clamp(1.8rem,3.2vw,2.6rem)}.carta{padding:2.5rem 2rem;border-radius:28px}.lista ul{max-height:min(50vh,26rem)}}@media(min-width:64rem){:root{--ancho: 36rem}.pantalla{padding-bottom:3rem}}@media(max-height:30rem)and (orientation:landscape){:root{--ancho: 40rem}.pantalla{padding-top:clamp(.5rem,2vh,1rem);padding-bottom:clamp(.75rem,3vh,1.25rem);gap:.6rem}.hero{padding-top:0;gap:.35rem}.hero-emoji,h1{font-size:2rem}.btn{min-height:2.75rem;padding:.6rem 1rem}.btn-grande{min-height:3rem;font-size:1.05rem}.caja-codigo{flex-direction:row;justify-content:center;align-items:center;gap:.9rem;padding:.75rem 1rem}.codigo{font-size:2rem}.carta{padding:1.5rem 2.25rem;border-radius:18px}.carta-esquina{top:.5rem;left:.65rem;font-size:.95rem}.carta-esquina-fin{top:auto;left:auto;bottom:.5rem;right:.65rem}.baraja{gap:.6rem}.baraja-monton{height:42vh}.baraja-carta{height:34vh}.lista ul{max-height:40vh}.pie{padding-top:.75rem}.espera{padding:0}}