:root{--loza: #f6f4ee;--papel: #fffefa;--cobalto: #1f3fae;--cobalto-hondo: #142a78;--cobalto-suave: #dfe5f7;--tinta: #17204a;--tinta-suave: #4e5778;--ocre: #d9a441;--sombra: 0 18px 40px -18px rgb(20 42 120 / .45);--display: "Gloock", "Georgia", serif;--texto: "Figtree", system-ui, sans-serif;color-scheme:light}*{box-sizing:border-box}html,body{margin:0;height:100%}body{background:var(--loza);color:var(--tinta);font:400 16px/1.45 var(--texto);overflow:hidden;-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}[hidden]{display:none!important}#mesa{position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100dvh;display:block;z-index:0}.azulejos{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;opacity:.5;background-color:var(--loza);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cg fill='none' stroke='%231f3fae' stroke-opacity='.16' stroke-width='1.6'%3E%3Crect x='1' y='1' width='118' height='118'/%3E%3Ccircle cx='60' cy='60' r='26'/%3E%3Cpath d='M60 22c8 12 8 26 0 38c-8-12-8-26 0-38zM60 98c8-12 8-26 0-38c-8 12-8 26 0 38zM22 60c12-8 26-8 38 0c-12 8-26 8-38 0zM98 60c-12-8-26-8-38 0c12 8 26 8 38 0z'/%3E%3Cpath d='M0 20a20 20 0 0 0 20-20M100 0a20 20 0 0 0 20 20M120 100a20 20 0 0 0-20 20M20 120a20 20 0 0 0-20-20'/%3E%3C/g%3E%3C/svg%3E");background-size:120px 120px}.arriba{position:fixed;z-index:5;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:max(14px,env(safe-area-inset-top)) 18px 0;pointer-events:none}.arriba>*{pointer-events:auto}.marca-pequena{font:400 22px/1 var(--display);color:var(--cobalto);opacity:0;transition:opacity .6s}body.en-partida .marca-pequena,body.menu-listo .marca-pequena{opacity:1}.boton-claro{border:2px solid var(--cobalto);background:var(--papel);color:var(--cobalto);border-radius:999px;padding:9px 18px;font-weight:600;box-shadow:inset 0 0 0 3px var(--papel),inset 0 0 0 4px var(--cobalto-suave)}.boton-claro:hover{background:var(--cobalto-suave)}.portada{position:fixed;z-index:4;left:0;right:0;bottom:max(8vh,40px);display:grid;justify-items:center;gap:18px;padding:0 18px;text-align:center;animation:aparece .7s ease-out both}.logo-texto{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.lema{margin:0;font:400 clamp(18px,2.6vw,24px)/1.2 var(--display);color:var(--cobalto-hondo)}.menu{display:flex;flex-wrap:wrap;gap:14px;justify-content:center}.boton-grande{position:relative;min-width:230px;border:2px solid var(--cobalto);background:var(--papel);color:var(--cobalto);border-radius:16px;padding:15px 26px;font-weight:800;font-size:18px;letter-spacing:.01em;box-shadow:var(--sombra),inset 0 0 0 4px var(--papel),inset 0 0 0 5.5px var(--cobalto-suave);transition:transform .15s,box-shadow .15s}.boton-grande:hover{transform:translateY(-2px)}.boton-grande:active{transform:translateY(1px)}.boton-grande.principal{background:var(--cobalto);color:var(--papel);box-shadow:var(--sombra),inset 0 0 0 4px var(--cobalto),inset 0 0 0 5.5px #ffffff8c}.boton-grande .icono{font-size:20px;margin-right:6px}.lateral{position:fixed;z-index:5;right:max(16px,env(safe-area-inset-right));top:50%;transform:translateY(-50%);display:grid;gap:12px}.boton-redondo{width:48px;height:48px;border-radius:50%;border:2px solid var(--cobalto);background:var(--papel);color:var(--cobalto);font-size:22px;line-height:1;box-shadow:var(--sombra),inset 0 0 0 3px var(--papel),inset 0 0 0 4px var(--cobalto-suave)}.boton-redondo[aria-pressed=false]{color:var(--tinta-suave);text-decoration:line-through}.velo{position:fixed;top:0;right:0;bottom:0;left:0;z-index:8;background:#17204a47;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);animation:aparece .25s both}.ventana{position:fixed;z-index:9;left:50%;top:50%;transform:translate(-50%,-50%);width:min(440px,calc(100vw - 32px));max-height:calc(100dvh - 40px);overflow:auto;background:var(--papel);border:2px solid var(--cobalto);border-radius:22px;padding:26px 22px 18px;display:grid;gap:14px;text-align:center;box-shadow:0 30px 70px -20px #142a788c,inset 0 0 0 6px var(--papel),inset 0 0 0 7.5px var(--cobalto-suave);animation:sube .3s cubic-bezier(.2,.9,.3,1.2) both}.ventana:before,.ventana:after{content:"";position:absolute;width:34px;height:34px;border:2px solid var(--cobalto);border-radius:50%;opacity:.35;pointer-events:none}.ventana:before{top:-12px;left:-12px}.ventana:after{bottom:-12px;right:-12px}.ventana h2{margin:0 0 4px;font:400 28px/1.1 var(--display);color:var(--cobalto-hondo)}.aviso{margin:0;font-size:14px;color:var(--tinta-suave);text-wrap:pretty}.aviso b{color:var(--tinta)}.cerrar{border:0;background:none;color:var(--cobalto);font-weight:600;padding:8px;justify-self:center;text-decoration:underline;text-underline-offset:3px}.boton-modo{display:grid;gap:2px;text-align:left;border:2px solid var(--cobalto);background:var(--papel);border-radius:14px;padding:14px 16px;color:var(--tinta)}.boton-modo b{font:400 22px/1.1 var(--display);color:var(--cobalto)}.boton-modo span{font-size:14px;color:var(--tinta-suave)}.boton-modo:hover{background:var(--cobalto-suave)}.boton-modo[data-pronto]{opacity:.6}.estado{margin:0;color:var(--tinta-suave);font-size:14px}.campo{display:grid;gap:6px;text-align:left;font-weight:600;color:var(--cobalto-hondo)}.campo input,.campo select{font:inherit;padding:10px 12px;border:2px solid var(--cobalto-suave);border-radius:10px;background:#fff;color:var(--tinta)}.campo input:focus,.campo select:focus{outline:none;border-color:var(--cobalto)}.dado-espera{justify-self:center;width:64px;height:64px;border:3px solid var(--cobalto);border-radius:14px;position:relative;background:var(--papel);animation:gira 1.4s cubic-bezier(.5,0,.5,1) infinite}.dado-espera i{position:absolute;width:11px;height:11px;border-radius:50%;background:var(--cobalto)}.dado-espera i:nth-child(1){left:10px;top:10px}.dado-espera i:nth-child(2){right:10px;top:10px}.dado-espera i:nth-child(3){left:50%;top:50%;transform:translate(-50%,-50%)}.dado-espera i:nth-child(4){left:10px;bottom:10px}.dado-espera i:nth-child(5){right:10px;bottom:10px}.huecos{display:flex;justify-content:center;gap:12px}.hueco{width:76px;height:76px;border:2px dashed var(--cobalto);border-radius:16px;display:grid;place-items:center;background:var(--loza)}.catalogo{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.ficha{border:2px solid var(--cobalto-suave);background:#fff;border-radius:14px;padding:10px 6px 8px;display:grid;gap:4px;justify-items:center;color:var(--tinta)}.ficha[aria-pressed=true]{border-color:var(--cobalto);background:var(--cobalto-suave)}.ficha small{font-size:12px;color:var(--tinta-suave)}.cara{width:52px;height:52px}.partida{position:fixed;top:0;right:0;bottom:0;left:0;z-index:4;pointer-events:none}.partida>*{pointer-events:auto}.marcador{position:absolute;left:50%;transform:translate(-50%);display:grid;justify-items:center;gap:2px;background:var(--papel);border:2px solid var(--cobalto);border-radius:14px;padding:8px 16px;min-width:200px;box-shadow:var(--sombra)}.marcador b{font:400 20px/1.1 var(--display);color:var(--cobalto)}.marcador span{font-size:14px;color:var(--tinta-suave)}.marcador.rival{top:max(64px,calc(env(safe-area-inset-top) + 56px))}.marcador.tuyo{bottom:calc(max(20px,env(safe-area-inset-bottom)) + 74px)}.acciones{position:absolute;left:0;right:0;bottom:max(16px,env(safe-area-inset-bottom));display:flex;gap:10px;justify-content:center;align-items:center}.toast{position:fixed;z-index:10;left:50%;bottom:24px;transform:translate(-50%);background:var(--cobalto-hondo);color:#fff;padding:10px 18px;border-radius:999px;font-weight:600;box-shadow:var(--sombra);animation:aparece .2s both}@keyframes aparece{0%{opacity:0;transform:translateY(8px)}}@keyframes sube{0%{opacity:0;transform:translate(-50%,-46%) scale(.96)}}@keyframes gira{0%{transform:rotate(0)}50%{transform:rotate(180deg) scale(.92)}to{transform:rotate(360deg)}}@media (max-width: 600px){.boton-grande{min-width:0;width:min(320px,calc(100vw - 48px))}.lateral{top:auto;bottom:auto;transform:none;top:max(64px,calc(env(safe-area-inset-top) + 54px));right:14px}.boton-redondo{width:42px;height:42px;font-size:19px}.portada{bottom:max(5vh,28px)}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
