@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;700&display=swap";:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box;margin:0;padding:0}html,body{color:#f3f4f6;-webkit-font-smoothing:antialiased;background:#040814;width:100%;height:100%;font-family:Outfit,Consolas,Courier New,monospace;overflow:hidden}#app{flex-direction:column;justify-content:center;align-items:center;width:100vw;height:100vh;padding:24px;display:flex;position:relative}.hud-bar{-webkit-backdrop-filter:blur(12px);pointer-events:none;z-index:20;background:#080c1c99;border:1px solid #ffffff14;border-radius:16px;justify-content:space-between;align-items:center;gap:16px;width:100%;max-width:560px;margin-bottom:14px;padding:14px 28px;display:flex;box-shadow:0 10px 30px #0006}.hud-bar.hidden{display:none}.hud-bar__pairs,.hud-bar__time{letter-spacing:1.5px;color:#fff9;text-transform:uppercase;white-space:nowrap;font-size:12px;font-weight:700}.hud-bar__turn{letter-spacing:1.5px;text-transform:uppercase;color:#ffffffbf;text-align:center;flex:1;font-size:12px;font-weight:700}.hud-bar__turn.is-mine{color:#ffd24a;text-shadow:0 0 10px #ffd24a73}.players-panel{z-index:20;flex-wrap:wrap;justify-content:center;gap:8px;width:100%;max-width:560px;margin-bottom:14px;display:flex}.players-panel.hidden{display:none}.player-chip{letter-spacing:.5px;color:#ffffffbf;background:#080c1c99;border:1px solid #ffffff1a;border-radius:9999px;align-items:center;gap:8px;padding:6px 12px;font-size:12px;font-weight:600;transition:border-color .2s,box-shadow .2s;display:flex}.player-chip.is-turn{border-color:var(--player-color);box-shadow:0 0 14px color-mix(in srgb, var(--player-color) 40%, transparent);color:#fff}.player-chip__pairs{text-align:center;background:color-mix(in srgb, var(--player-color) 22%, transparent);min-width:22px;color:var(--player-color);border-radius:9999px;padding:1px 6px;font-weight:700}.board-wrapper{z-index:10;justify-content:center;align-items:center;width:100%;max-width:560px;display:flex;position:relative}.memory-board{--cols:4;--rows:4;grid-template-columns:repeat(var(--cols), 1fr);width:min(92vw, 560px, calc(72vh * .75 * var(--cols) / var(--rows)));-webkit-backdrop-filter:blur(14px);background:#0a0e1eb3;border:1px solid #ffd24a26;border-radius:20px;gap:clamp(6px,1.4vw,10px);padding:clamp(8px,1.6vw,14px);display:grid;box-shadow:0 16px 40px #0009,0 0 30px #ffd24a0d,inset 0 0 20px #ffd24a0a}.memory-board.hidden{display:none}.card{aspect-ratio:3/4;perspective:700px;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;position:relative}.card__inner{transform-style:preserve-3d;transition:transform .35s cubic-bezier(.25,1,.5,1);position:absolute;inset:0}.card.is-up .card__inner{transform:rotateY(180deg)}.card__face{backface-visibility:hidden;border-radius:12px;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.card__face--back{background:linear-gradient(135deg,#ffffff14 0%,#ffffff05 100%);border:1px solid #ffffff1a;box-shadow:0 4px 10px #0000004d}.card__face--back:after{content:"";aspect-ratio:1;border:2px solid #ffd24a40;border-radius:50%;width:34%}.card:hover .card__face--back{background:linear-gradient(135deg,#ffffff21 0%,#ffffff0a 100%);border-color:#ffffff38}.card__face--front{background:linear-gradient(135deg,#ffffff0d 0%,#ffffff03 100%);border:1px solid #ffffff24;transform:rotateY(180deg);box-shadow:0 4px 10px #0000004d}.card__face--front svg{filter:drop-shadow(0 0 8px);width:55%;height:55%}.card.is-matched{cursor:default}.card.is-matched .card__face--front{border-color:color-mix(in srgb, var(--owner-color) 65%, transparent);box-shadow:0 0 14px color-mix(in srgb, var(--owner-color) 25%, transparent), inset 0 0 10px color-mix(in srgb, var(--owner-color) 10%, transparent);opacity:.75}.card.is-won{animation:.45s cubic-bezier(.25,1,.5,1) card-won}@keyframes card-won{0%{transform:scale(1)}40%{transform:scale(1.12)}to{transform:scale(1)}}.overlay{-webkit-backdrop-filter:blur(20px);z-index:40;text-align:center;background:#040610d9;flex-direction:column;justify-content:center;align-items:center;padding:32px;transition:opacity .3s;display:flex;position:absolute;inset:0}.overlay.hidden{display:none!important}.overlay__title{letter-spacing:4px;background:linear-gradient(135deg,#fff 30%,#ffd24a 100%);-webkit-text-fill-color:transparent;text-shadow:0 10px 30px #ffd24a40;-webkit-background-clip:text;margin-bottom:8px;font-size:clamp(32px,8vw,52px);font-weight:700}.overlay__subtitle{letter-spacing:1px;color:#fff9;max-width:440px;margin-bottom:28px;font-size:15px;font-weight:300;line-height:1.5}.overlay__score{letter-spacing:1px;color:#fff;margin-bottom:12px;font-size:22px;font-weight:600;line-height:1.6}.overlay__bests{letter-spacing:1.5px;color:#ffffff80;margin-bottom:36px;font-size:13px;font-weight:500;line-height:1.6}.overlay__hint{letter-spacing:2px;color:#fff6;text-transform:uppercase;font-size:12px;font-weight:500}.countdown{pointer-events:none;z-index:45;letter-spacing:4px;color:#fff;text-shadow:0 0 40px #ffd24a66,0 10px 40px #0009;opacity:0;justify-content:center;align-items:center;font-size:160px;font-weight:700;display:flex;position:absolute;inset:0}.countdown.is-shown{animation:.75s cubic-bezier(.25,1,.5,1) countdown-pop}@keyframes countdown-pop{0%{opacity:0;transform:scale(.3)}25%{opacity:1;transform:scale(1.1)}45%{transform:scale(1)}85%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.2)}}