@layer components{.fv-stage{--fv-correct:var(--rn);--fv-present:#ffc83a;--fv-absent:#3a393f;background:radial-gradient(90% 60% at 50% 18%,#2a230b 0%,#0c0b07 68%);align-items:center;padding:0}.fv-stage.is-contrast,.fv-mini.is-contrast{--fv-correct:#ff8e1f;--fv-present:#3fb8f2}.fv-mini{--fv-correct:var(--rn);--fv-present:#ffc83a;--fv-absent:#3a393f;text-align:center}.fv-bar{z-index:2;justify-content:center;gap:8px;display:flex;position:absolute;top:12px;left:16px;right:16px}.key.fv-toggle{border-radius:12px;height:40px;padding:0 14px;font-size:13px}.fv-area{flex:1;place-items:center;width:100%;min-height:0;padding:58px 16px 12px;display:grid}.fv-board{gap:6px;width:min(100cqw - 32px,82cqh - 205px,380px);display:grid;container-type:inline-size}.fv-row{grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;display:grid}.fv-row.is-shake{animation:fv-shake .38s var(--ease-out)}.fv-tile{--fv-bg:transparent;--fv-ink:var(--on-dark);aspect-ratio:1;text-transform:lowercase;color:var(--fv-ink);background:var(--fv-bg);border-radius:8px;place-items:center;font-size:9.5cqw;font-weight:700;line-height:1;display:grid;position:relative;box-shadow:inset 0 0 0 2px #ffffff1f}.fv-tile.is-typed{animation:fv-pop .14s var(--ease-out);box-shadow:inset 0 0 0 2px #ffffff6b}.fv-tile.is-correct{--fv-bg:var(--fv-correct);--fv-ink:#0d0d0f}.fv-tile.is-present{--fv-bg:var(--fv-present);--fv-ink:#0d0d0f}.fv-tile.is-absent{--fv-bg:var(--fv-absent)}.fv-tile.is-flip{box-shadow:none;animation:fv-flip .56s var(--ease-in-out) both;animation-delay:var(--d)}.fv-tile.is-present:after,.fv-mini-tile.is-present:after{content:"";aspect-ratio:1;opacity:.55;background:#0d0d0f;border-radius:50%;width:14%;position:absolute;top:9%;right:9%}.fv-tile.is-win{animation:fv-flip .56s var(--ease-in-out) both, fv-hop .52s var(--ease-spring) both;animation-delay:var(--d), calc(var(--d) * .35)}@keyframes fv-flip{0%{color:var(--on-dark);background:0 0;transform:rotateX(0);box-shadow:inset 0 0 0 2px #ffffff6b}49.9%{color:var(--on-dark);background:0 0;transform:rotateX(90deg);box-shadow:inset 0 0 0 2px #ffffff6b}50%{color:var(--fv-ink);background:var(--fv-bg);box-shadow:none;transform:rotateX(90deg)}to{color:var(--fv-ink);background:var(--fv-bg);box-shadow:none;transform:rotateX(0)}}@keyframes fv-pop{50%{transform:scale(1.09)}}@keyframes fv-hop{40%{transform:translateY(-22%)}}@keyframes fv-shake{20%,60%{transform:translate(-7px)}40%,80%{transform:translate(7px)}}@media (prefers-reduced-motion:reduce){.fv-tile.is-flip,.fv-tile.is-win,.fv-tile.is-typed,.fv-row.is-shake{animation:none}}.fv-toast{z-index:4;white-space:nowrap;color:#0d0d0f;animation:pop .24s var(--ease-pop) both;background:#fff;border-radius:999px;padding:9px 15px;font-size:14px;font-weight:600;position:absolute;top:54px;left:50%;translate:-50%}.fv-keys{width:100%;padding:0 8px max(14px, env(safe-area-inset-bottom))}.fv-k0{color:var(--on-dark-faint);background:#ffffff0d}.fv-k1{color:#0d0d0f;background:var(--fv-present)}.fv-k2{color:#0d0d0f;background:var(--fv-correct)}.fv-mini-tile{color:#0d0d0f;background:var(--fv-absent);border-radius:6px;place-items:center;width:26px;height:26px;font-size:13px;font-weight:700;display:grid;position:relative}.fv-mini-tile.is-correct{background:var(--fv-correct)}.fv-mini-tile.is-present{background:var(--fv-present)}.fv-mini-tile.is-absent{color:#fff}.fv-mini .grid{justify-content:center}.fv-spread{text-align:left;gap:4px;width:min(100%,260px);margin:14px auto 0;display:grid}.fv-spread p{color:var(--on-dark-faint);margin-bottom:2px;font-size:12px;font-weight:600}.fv-spread div{align-items:center;gap:8px;font-size:12.5px;font-weight:650;display:flex}.fv-spread span{width:10px;color:var(--on-dark-dim)}.fv-spread i{text-align:right;min-width:22px;color:var(--on-dark);transition:width .6s var(--ease-out);background:#ffffff1f;border-radius:5px;padding:2px 7px;font-style:normal}.fv-spread .is-mine i{color:#0d0d0f;background:var(--fv-correct)}}