@layer components{.fi-stage{touch-action:none;-webkit-user-select:none;user-select:none;background:radial-gradient(90% 60% at 50% 38%,#142257 0%,#0a1030 55%,#05070f 100%);padding:0}.fi-hud{z-index:3;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;width:min(100% - 24px,520px);height:64px;display:grid;position:absolute;top:12px;left:50%;translate:-50%}.fi-best,.fi-combo{flex-direction:column;gap:1px;display:flex}.fi-best span,.fi-combo>span:first-child{letter-spacing:.08em;color:#ffffff80;font-size:11px;font-weight:600}.fi-best b{font-family:var(--font-display), var(--font-sans);letter-spacing:-.03em;color:#ffffffd9;font-size:19px;font-weight:800}.fi-best.is-new span,.fi-best.is-new b{color:var(--rn)}.fi-score{text-align:center;position:relative}.fi-score b{font-family:var(--font-display), var(--font-sans);letter-spacing:-.05em;color:#fff;text-shadow:0 4px 22px #5078ff73;font-size:46px;font-weight:800;line-height:1;display:block}.fi-plus{font-family:var(--font-display), var(--font-sans);color:var(--rn);white-space:nowrap;pointer-events:none;animation:fi-plus .8s var(--ease-out) forwards;margin-left:4px;font-size:17px;font-style:normal;font-weight:800;position:absolute;top:-2px;left:100%}@keyframes fi-plus{0%{opacity:1;translate:0 6px}to{opacity:0;translate:0 -18px}}.fi-combo{opacity:.35;align-items:flex-end;transition:opacity .2s}.fi-combo.is-on{opacity:1}.fi-combo b{font-family:var(--font-display), var(--font-sans);letter-spacing:-.03em;color:#fff;font-size:19px;font-weight:800}.fi-combo.is-on b{color:#ffc83a}.fi-fuse{gap:4px;margin-top:2px;display:flex}.fi-fuse i{background:#ffffff24;border-radius:3px;width:14px;height:5px;transition:background .2s}.fi-fuse i.is-lit{background:#ffc83a;box-shadow:0 0 8px #ffc83a99}.fi-area{place-items:center;display:grid;position:absolute;inset:88px 12px 188px;container-type:size}.fi-wrap{aspect-ratio:1;width:min(100cqw,100cqh,560px);position:relative}.fi-board{--pad:7px;--gap:4px;--cell:calc((100% - 2 * var(--pad) - 7 * var(--gap)) / 8);gap:var(--gap);width:100%;height:100%;padding:var(--pad);background:linear-gradient(#1b2a66,#121c4a);border-radius:18px;grid-template:repeat(8,minmax(0,1fr))/repeat(8,minmax(0,1fr));display:grid;position:relative;box-shadow:inset 0 0 0 1.5px #8caaff24,0 26px 50px -18px #000000bf}.fi-cell{background:#05091e8c;border-radius:22%;position:relative;box-shadow:inset 0 2px 3px #00000059}.fi-cell.is-full,.fi-mini i,.fi-float i,.fi-burst{background:linear-gradient(180deg, color-mix(in oklab, var(--c) 72%, white) 0%, var(--c) 42%, color-mix(in oklab, var(--c) 78%, black) 100%);box-shadow:inset 0 -3px #00000038,inset 0 2px #ffffff52,0 2px 4px #0000004d}.fi-cell.is-new{animation:fi-land .24s var(--ease-pop)}@keyframes fi-land{0%{scale:.86}}.fi-cell.is-ghost{background:color-mix(in oklab, var(--c) 42%, transparent);box-shadow:inset 0 0 0 2px color-mix(in oklab, var(--c) 80%, white)}.fi-cell.is-hit{filter:brightness(1.18);box-shadow:inset 0 -3px 0 #0003, inset 0 2px 0 #fff6, 0 0 12px color-mix(in oklab, var(--c) 70%, transparent);animation:.6s ease-in-out infinite alternate fi-glow}.fi-cell.is-ghost.is-hit{background:linear-gradient(180deg, color-mix(in oklab, var(--c) 72%, white), var(--c))}@keyframes fi-glow{to{filter:brightness(1.38)}}.fi-cell.is-nope{background:#ff5b3a38;box-shadow:inset 0 0 0 2px #ff5b3a80}.fi-burst{z-index:2;left:calc(var(--pad) + var(--x) * (var(--cell) + var(--gap)));top:calc(var(--pad) + var(--y) * (var(--cell) + var(--gap)));width:var(--cell);height:var(--cell);pointer-events:none;animation:fi-burst .46s var(--ease-out) both;border-radius:22%;position:absolute}@keyframes fi-burst{0%{opacity:1;filter:brightness(1.6);scale:1}35%{opacity:1;filter:brightness(2.2);scale:1.18}to{opacity:0;filter:brightness();rotate:25deg;scale:.2}}.fi-wrap.is-over .fi-cell.is-full{animation:.5s forwards fi-grey;animation-delay:var(--d)}@keyframes fi-grey{to{filter:grayscale()brightness(.55)}}.fi-say{z-index:4;font-family:var(--font-display), var(--font-sans);letter-spacing:-.045em;color:#fff;text-align:center;pointer-events:none;text-shadow:0 3px #0a1030e6,0 0 24px #0009;animation:fi-say 1.2s var(--ease-out) forwards;flex-direction:column;align-items:center;margin:0;font-size:34px;font-weight:800;display:flex;position:absolute;top:38%;left:0;right:0}.fi-say.is-big{color:#ffc83a;font-size:46px}.fi-say small{letter-spacing:0;color:#ffc83a;font-size:18px;font-weight:800}@keyframes fi-say{0%{opacity:0;scale:.6}18%{opacity:1;scale:1.08}30%{scale:1}75%{opacity:1;translate:0 -6px}to{opacity:0;translate:0 -18px}}.fi-over{z-index:4;font-family:var(--font-display), var(--font-sans);letter-spacing:-.045em;text-align:center;color:#fff;text-shadow:0 4px #0a1030e6,0 0 30px #000c;animation:pop .38s var(--ease-pop) .5s both;margin:0;font-size:36px;font-weight:800;position:absolute;top:42%;left:0;right:0}.fi-tray{--m:21px;left:12px;right:12px;bottom:max(26px, calc(env(safe-area-inset-bottom) + 14px));grid-template-columns:repeat(3,1fr);gap:8px;height:150px;display:grid;position:absolute}.fi-slot{touch-action:none;cursor:grab;animation:fi-deal .38s var(--ease-pop) both;animation-delay:calc(var(--i) * 70ms);background:#ffffff09;border-radius:20px;place-items:center;padding:0;transition:background .16s,opacity .2s;display:grid;position:relative}@keyframes fi-deal{0%{opacity:0;translate:0 26px;scale:.8}}@media (hover:hover){.fi-slot:hover:not(:disabled){background:#ffffff12}}.fi-slot:disabled{cursor:default;background:#ffffff04}.fi-slot.is-on{box-shadow:inset 0 0 0 2px var(--rn);background:#ccff3d1a}.fi-slot.is-lifted .fi-mini{opacity:0}.fi-slot.is-stuck .fi-mini{opacity:.3;filter:grayscale(.7)}.fi-slot:focus-visible{outline:2px solid var(--rn);outline-offset:2px}.fi-mini{pointer-events:none;position:relative}.fi-slot.is-back .fi-mini{animation:fi-back .32s var(--ease-pop)}@keyframes fi-back{0%{opacity:.4;scale:1.5}}.fi-mini i{width:calc(var(--m) - 2px);height:calc(var(--m) - 2px);border-radius:22%;position:absolute}.fi-float{z-index:6;pointer-events:none;filter:drop-shadow(0 14px 18px #00000080);animation:fi-lift .14s var(--ease-out);transform-origin:50% 100%;position:absolute}@keyframes fi-lift{0%{opacity:.6;scale:.6}}.fi-float i{border-radius:22%;position:absolute}.fi-hint{z-index:2;left:0;right:0;bottom:max(184px, calc(env(safe-area-inset-bottom) + 172px));text-align:center;color:#ffffff9e;pointer-events:none;margin:0;font-size:14px;font-weight:600;animation:1.6s ease-in-out infinite fi-nudge;position:absolute}@keyframes fi-nudge{50%{translate:0 -4px}}@container (min-width:760px){.fi-hud{width:auto;max-width:none;margin-inline:auto;left:28px;right:336px;translate:none}.fi-area{inset:92px 336px 28px 28px}.fi-board{--pad:9px;--gap:5px;border-radius:22px}.fi-tray{--m:26px;grid-template-columns:minmax(0,1fr);grid-auto-rows:minmax(0,1fr);width:268px;height:min(560px,100% - 64px);inset:50% 36px auto auto;translate:0 -50%}.fi-hint{bottom:32px;left:28px;right:336px}}@media (prefers-reduced-motion:reduce){.fi-cell.is-new,.fi-slot,.fi-float,.fi-slot.is-back .fi-mini,.fi-hint{animation:none}.fi-cell.is-hit{filter:brightness(1.3);animation:none}.fi-burst{animation-duration:.2s}.fi-say{animation-name:fi-fade}@keyframes fi-fade{0%,75%{opacity:1}to{opacity:0}}}}