:root{--night:#0d131d;--panel:#ffffff0f;--line:#ffffff1f;--text:#eceae2;--mute:#eceae28c;--warn:#ffd400;--concrete:#9aa1a6;--display:"Archivo", system-ui, sans-serif;--ui:system-ui, -apple-system, "Segoe UI", sans-serif}*{box-sizing:border-box}[hidden]{display:none!important}html,body{background:var(--night);color:var(--text);font:15px/1.4 var(--ui);-webkit-tap-highlight-color:transparent;margin:0}.menu{z-index:20;padding:max(40px, env(safe-area-inset-top)) 16px max(32px, env(safe-area-inset-bottom));background:radial-gradient(70% 60%,#0d131d8c,#0d131d33);flex-direction:column;justify-content:center;align-items:center;animation:.5s fade;display:flex;position:fixed;inset:0;overflow-y:auto}.menu__title,.menu__sub,.menu__keys{text-shadow:0 2px 24px #0d131db3}body:not(.is-playing) :is(.hud,.pad,.back){display:none!important}.film .island-card{border-radius:0;inset:0}.film :is(.pad,.back,.sound,.done){display:none!important}.film .hud{zoom:1.6;top:16px}.film .lab-bubble{border-radius:18px;padding:10px 20px;font-size:22px}.menu__title{font:900 clamp(56px, 16vw, 112px)/.9 var(--display);letter-spacing:-.035em;text-transform:uppercase;text-align:center;margin:0;font-stretch:112%}.menu__sub{color:#eceae2d9;text-align:center;text-wrap:balance;max-width:34ch;margin:16px 0 32px;font-size:17px;line-height:1.45}.start{grid-template-columns:minmax(0,1fr);gap:8px;width:min(400px,100%);display:grid}.start label{color:var(--mute);letter-spacing:.04em;text-transform:uppercase;font-size:13px}.start__row{gap:8px;display:flex}.start input{min-width:0;height:54px;color:var(--text);font:600 18px/1 var(--ui);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0d131d80;border:1.5px solid #ffffff38;border-radius:14px;outline:none;flex:1;padding:0 18px;transition:border-color .15s,background .15s}.start__field{flex:1;min-width:0;display:flex;position:relative}.start__field input{padding-right:52px}.start__dice{cursor:pointer;width:42px;height:42px;color:var(--mute);background:0 0;border:0;border-radius:10px;place-items:center;transition:color .15s,background .15s;display:grid;position:absolute;top:50%;right:6px;translate:0 -50%}.start__dice:hover{color:var(--warn);background:#ffffff14}.start__dice.is-rolling svg{animation:.4s roll}@keyframes roll{to{transform:rotate(360deg)}}.start input::placeholder{color:#eceae24d}.start input:focus{border-color:var(--warn);background:#0d131da6}.start button[type=submit],.btn--main{cursor:pointer;color:#17140a;background:var(--warn);height:54px;font:800 18px/1 var(--display);letter-spacing:.01em;border:0;border-radius:14px;padding:0 26px;transition:transform .1s,filter .15s}.start button[type=submit]:hover,.btn--main:hover{filter:brightness(1.08)}.start button[type=submit]:active,.btn:active{transform:scale(.97)}.start .play{isolation:isolate;font-variant-numeric:tabular-nums;min-width:172px;position:relative;overflow:hidden}.start .play:not(.is-ready){cursor:progress;color:var(--text);background:#ffffff1a;font-size:16px}.play__fill{z-index:-1;will-change:transform;transform-origin:0;background:#ffd40061;transition:opacity .3s .2s;position:absolute;inset:0;overflow:hidden;transform:scaleX(0)}.play__fill:after{content:"";will-change:transform;background:linear-gradient(90deg,#0000,#ffec8c59,#0000);animation:1.1s linear infinite shine;position:absolute;inset:0}@keyframes shine{0%{transform:translate(-100%)}to{transform:translate(100%)}}.play.is-ready .play__fill{opacity:0}.start .play:not(.is-ready):is(:hover,:active){filter:none;transform:none}@media (width<=600px),(pointer:coarse){.start__row{flex-direction:column}.start .play{width:100%}}.start__error{min-height:1.4em;color:var(--warn);margin:0;font-size:14px}.board-card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0d131d80;border:1px solid #ffffff29;border-radius:18px;width:min(400px,100%);margin-top:16px;padding:18px 20px}.board-card h2{color:var(--mute);font:600 13px/1 var(--ui);letter-spacing:.04em;text-transform:uppercase;margin:0 0 12px}.board{text-align:left;gap:2px;margin:0;padding:0;font-size:16px;list-style:none;display:grid}.board li{border-radius:9px;justify-content:space-between;gap:24px;padding:7px 10px;display:flex}.board li span:last-child{font-variant-numeric:tabular-nums;color:var(--mute)}.board li:first-child:not(.board__empty) span:first-child{font-weight:700}.board li.is-me{background:#ffd40024}.board li.is-me span{color:var(--warn);font-weight:700}.board__empty{color:var(--mute)}.timing{color:var(--mute);margin:16px 0 0;font:12px/1.5 ui-monospace,monospace}.menu__keys{color:#eceae261;margin:22px 0 0;font-size:13px}.menu__keys--touch{display:none}@media (pointer:coarse){.menu__keys--desk{display:none}.menu__keys--touch{display:block}}.game{background:var(--night);overscroll-behavior:none;position:fixed;inset:0}.canvas{position:absolute;inset:0}.island-card{--sky-night:1;--sky-dusk:0;background:linear-gradient(180deg, rgb(26 36 54/var(--sky-night)), rgb(44 61 94/var(--sky-night))), linear-gradient(180deg, rgb(92 104 166/var(--sky-dusk)), rgb(178 134 168/var(--sky-dusk)) 38%, rgb(244 160 112/var(--sky-dusk)) 72%, rgb(255 206 140/var(--sky-dusk))), linear-gradient(180deg, #5d9bdc, #8fbde8 45%, #cfe4f2 85%, #e4eef2);border-radius:26px;position:absolute;inset:16px 16px 48px;overflow:hidden}.stars{opacity:var(--sky-night);pointer-events:none;background-image:radial-gradient(1.5px 1.5px at 12% 18%,#fff,#0000),radial-gradient(1px 1px at 28% 42%,#fff,#0000),radial-gradient(1px 1px at 46% 12%,#fff,#0000),radial-gradient(2px 2px at 63% 27%,#fff,#0000),radial-gradient(1px 1px at 78% 8%,#fff,#0000),radial-gradient(1.5px 1.5px at 88% 35%,#fff,#0000),radial-gradient(1px 1px at 8% 66%,#fff,#0000),radial-gradient(1px 1px at 35% 80%,#fff,#0000),radial-gradient(1.5px 1.5px at 92% 72%,#fff,#0000),radial-gradient(1px 1px at 55% 60%,#fff,#0000);background-size:420px 380px;position:absolute;inset:0}.comets{opacity:var(--sky-night);pointer-events:none;position:absolute;inset:0;overflow:hidden}.comet{transform-origin:100%;filter:drop-shadow(0 0 3px #c8dcffb3);background:linear-gradient(90deg,#0000,#bed2fa40 55%,#ebf2ffd9 96%,#fff);border-radius:2px;height:2px;position:absolute}.clouds canvas{width:100%;height:100%;display:block}.clouds{pointer-events:none;filter:brightness(calc(1 - .45 * var(--sky-night)));position:absolute;inset:0;overflow:hidden}.clouds i{aspect-ratio:420/130;animation:260s linear infinite cloud;position:absolute;left:0}.clouds i:first-child{width:620px;animation-delay:-228s;top:6%}.clouds i:nth-child(2){opacity:.85;width:440px;animation-duration:340s;animation-delay:-210s;top:15%}.clouds i:nth-child(3){opacity:.7;width:760px;animation-duration:300s;animation-delay:-120s;top:22%}.clouds i:nth-child(4){opacity:.8;width:500px;animation-duration:380s;animation-delay:-300s;top:0%}@keyframes cloud{0%{translate:-800px}to{translate:calc(100vw + 40px)}}@media (prefers-reduced-motion:reduce){.clouds i{animation-play-state:paused}}.back{z-index:6;cursor:pointer;height:36px;color:var(--text);font:600 13px/1 var(--ui);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#0d131d8c;border:1px solid #ffffff2e;border-radius:99px;place-items:center;width:36px;font-size:17px;text-decoration:none;display:grid;position:absolute;top:28px;left:28px}.back:hover{border-color:var(--warn)}.sound{z-index:21;cursor:pointer;width:36px;height:36px;color:var(--mute);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#0d131d8c;border:1px solid #ffffff2e;border-radius:99px;place-items:center;padding:0;display:grid;position:fixed;top:28px;right:28px}.sound:hover{border-color:var(--warn);color:var(--text)}.sound[aria-pressed=true]{color:var(--text)}.sound[aria-pressed=true] .sound__off,.sound[aria-pressed=false] .sound__waves{display:none}.lab-bubble{z-index:3;pointer-events:none;color:#1d1f1c;font:700 14px/1.3 var(--ui);white-space:nowrap;opacity:0;background:#fff;border-radius:14px;margin-top:-10px;padding:8px 14px;transition:opacity .2s;position:absolute;top:0;left:0}.lab-bubble:after{content:"";background:inherit;width:12px;height:12px;position:absolute;bottom:-6px;left:50%;transform:translate(-50%)rotate(45deg)}.lab-bubble.is-on{opacity:1}.hud{z-index:4;white-space:nowrap;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);height:36px;font:600 15px/1 var(--ui);background:#0d131d99;border:1px solid #ffffff24;border-radius:99px;align-items:center;gap:12px;padding:0 16px;display:flex;position:absolute;top:12px;left:50%;translate:-50%}.hud__name{text-overflow:ellipsis;max-width:9em;overflow:hidden}.hud__time{color:var(--warn);font:800 17px/1 var(--display);font-variant-numeric:tabular-nums}.hud__hint{color:var(--mute);font-weight:500}.done{z-index:7;overscroll-behavior:contain;padding:max(16px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#0d131d80;animation:.4s fade;display:flex;position:absolute;inset:0;overflow-y:auto}.done__card{background:var(--night);border:1px solid var(--line);text-align:center;border-radius:22px;width:min(360px,100%);margin:auto;padding:28px 24px 24px;box-shadow:0 30px 80px #00000073}.done__card h2{font:900 40px/1 var(--display);text-transform:uppercase;letter-spacing:-.03em;margin:0;font-stretch:112%}.done__time{color:var(--mute);margin:10px 0 0}.done__time strong{color:var(--warn);font:800 18px/1 var(--display)}.done__rank{min-height:1.3em;color:var(--warn);margin:6px 0 14px;font-weight:700}.done__card .board{margin-bottom:20px}.done__actions{gap:8px;display:flex}.btn{height:50px;color:var(--text);background:var(--panel);border:1px solid var(--line);font:700 16px/1 var(--ui);border-radius:14px;flex:1;place-items:center;text-decoration:none;display:grid}.btn.btn--main{color:#17140a;background:var(--warn);font-family:var(--display);border:0;flex:1.4;height:50px;padding:0;font-size:17px}.mail{text-align:left;gap:8px;margin:-4px 0 18px;display:grid}.mail label{font-size:14px}.mail label span{color:var(--mute)}.mail__row{gap:6px;display:flex}.mail input{min-width:0;height:44px;color:var(--text);font:500 16px/1 var(--ui);background:var(--panel);border:1.5px solid var(--line);border-radius:12px;outline:none;flex:1;padding:0 14px}.mail input:focus{border-color:var(--warn)}.mail button{cursor:pointer;height:44px;color:var(--text);font:700 15px/1 var(--ui);border:1px solid var(--line);background:#ffffff1a;border-radius:12px;padding:0 16px}.mail button:hover{border-color:var(--warn)}.mail__msg{min-height:1.3em;color:var(--warn);margin:0;font-size:14px}.mail.is-sent .mail__row,.mail.is-sent label{display:none}@media (width<=600px),(pointer:coarse){.mail__row{flex-direction:column;gap:8px}.mail input{flex:none}.mail button{width:100%}}@keyframes fade{0%{opacity:0}}.pad{display:none}@media (pointer:coarse){.island-card{inset:env(safe-area-inset-top) 0 0;border-radius:0}.hud{top:14px}.back{top:14px;left:14px}.sound{top:calc(14px + env(safe-area-inset-top));right:14px}.pad{z-index:5;height:200px;padding-bottom:env(safe-area-inset-bottom);pointer-events:none;display:block;position:absolute;inset:auto 0 0}.stick,.jump{pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none}.stick{left:max(24px, env(safe-area-inset-left));bottom:calc(28px + env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#0d131d52;border:1.5px solid #ffffff47;border-radius:50%;width:132px;height:132px;position:absolute}.stick__knob{background:#eceae2e6;border-radius:50%;width:56px;height:56px;margin:-28px 0 0 -28px;position:absolute;top:50%;left:50%;box-shadow:0 4px 14px #0000004d}.stick.is-on .stick__knob{background:var(--warn)}.jump{right:max(24px, env(safe-area-inset-right));bottom:calc(44px + env(safe-area-inset-bottom));color:#17140a;background:var(--warn);width:96px;height:96px;font:800 17px/1 var(--display);border:0;border-radius:50%;position:absolute;box-shadow:0 6px 20px #00000059}.jump:active,.jump.is-on{filter:brightness(1.1);transform:scale(.93)}}
