@layer components{.kl-stage{-webkit-user-select:none;user-select:none;touch-action:none;background:radial-gradient(120% 80% at 50% 0,#ffffff14,#0000 60%),radial-gradient(90% 70% at 50% 35%,#12683f 0%,#0b4429 58%,#062a19 100%);padding:0;overflow:hidden}.kl-bar{z-index:950;align-items:center;gap:8px;height:46px;display:flex;position:absolute;top:8px;left:12px;right:12px}.kl-read{color:#ffffff9e;align-items:baseline;gap:12px;margin-right:auto;font-size:13px;display:flex}.kl-read b{font-family:var(--font-display), var(--font-sans);letter-spacing:-.02em;color:#fff;font-size:22px;font-weight:800}.kl-key{--key:#ffffff1a;--key-ink:#fff;--edge:#0000004d;height:44px;box-shadow:inset 0 -3px 0 var(--edge), inset 0 0 0 1.5px #ffffff24;gap:6px;padding:0 14px;font-size:14px}.kl-key svg{width:19px;height:19px}.is-narrow .kl-key{width:44px;padding:0}.is-narrow .kl-key-word{display:none}.kl-slot{width:var(--cw);height:var(--ch);border-radius:calc(var(--cw) * .11);background:#0000001a;transition:box-shadow .16s,background .16s;position:absolute;top:0;left:0;box-shadow:inset 0 0 0 1.5px #ffffff29}.kl-slot.is-target{background:#ccff3d1f;box-shadow:inset 0 0 0 2.5px #ccff3dd9,0 0 18px #ccff3d59}.kl-base{background:0 0;box-shadow:inset 0 0 0 1.5px #ffffff1a}.kl-ghost{color:#ffffff29;width:46%;height:46%;position:absolute;inset:27%}.kl-stock{color:#ffffff8c;cursor:pointer;place-items:center;display:grid}.kl-stock svg{width:42%}.kl-stock:focus-visible{outline:3px solid var(--rn);outline-offset:3px}.kl-card{width:var(--cw);height:var(--ch);border-radius:calc(var(--cw) * .11);color:#18181d;perspective:700px;transition:transform .28s var(--ease-out), translate .24s var(--ease-out), scale .16s var(--ease-out), box-shadow .16s ease;will-change:transform;position:absolute;top:0;left:0;box-shadow:0 1px 1.5px #0006,0 2px 6px #00000024}.kl-card.is-red{color:#d3263a}.kl-card:not(.is-live){pointer-events:none}.kl-card.is-live{cursor:grab}.kl-card.is-lifted{translate:var(--dx) var(--dy);transition:scale .14s var(--ease-out), box-shadow .14s ease;cursor:grabbing;scale:1.06;box-shadow:0 18px 30px #0000006b,0 4px 8px #0003}.kl-card.is-drop{box-shadow:0 0 0 3px var(--rn), 0 0 22px #ccff3d73}.kl-card.is-hint{animation:.9s ease-in-out 2 kl-hint}@keyframes kl-hint{50%{translate:0 calc(var(--cw) * -.12);box-shadow:0 0 0 3px var(--rn), 0 10px 22px #0006}}.kl-card.is-nope{animation:.28s kl-nope}@keyframes kl-nope{25%{translate:-5px}75%{translate:5px}}.kl-flip{transform-style:preserve-3d;transition:transform .32s var(--ease-out);position:absolute;inset:0}.kl-card.is-down .kl-flip{transform:rotateY(180deg)}.kl-face,.kl-back{border-radius:inherit;backface-visibility:hidden;position:absolute;inset:0}.kl-face{border-radius:calc(var(--cw) * .11);background:linear-gradient(170deg,#fffefb 0%,#f6f2e9 100%);overflow:hidden;box-shadow:inset 0 0 0 1px #0000001f,inset 0 -2px #0000000d}.kl-back{border-radius:calc(var(--cw) * .11);box-shadow:inset 0 0 0 calc(var(--cw) * .05) #f7f4ec, inset 0 0 0 calc(var(--cw) * .05 + 1.5px) #00000040;background:radial-gradient(circle,#ccff3de6 1px,#0000 1.5px) 0 0/7px 7px,linear-gradient(160deg,#2a2a33,#121216);transform:rotateY(180deg)}.kl-idx{height:calc(var(--cw) * .38);font-family:var(--font-display), var(--font-sans);font-size:calc(var(--cw) * .36);letter-spacing:-.07em;justify-content:space-between;align-items:center;font-weight:800;line-height:1;display:flex;position:absolute;top:3%;left:8%;right:7%}.kl-pip{width:calc(var(--cw) * .27);height:calc(var(--cw) * .27)}.kl-big{width:54%;height:54%;position:absolute;bottom:9%;left:50%;translate:-50%}.kl-ace{filter:drop-shadow(0 1px #0000001f);width:66%;height:60%;position:absolute;bottom:10%;left:50%;translate:-50%}.kl-court{border-radius:calc(var(--cw) * .07);background:color-mix(in oklab, currentColor 10%, #fffaf0);box-shadow:inset 0 0 0 1.5px color-mix(in oklab, currentColor 30%, transparent);place-items:center;display:grid;position:absolute;inset:34% 9% 6%}.kl-court svg{filter:drop-shadow(0 1px #00000026);width:86%;height:86%}.kl-cursor{z-index:940;width:var(--cw);height:var(--ch);border-radius:calc(var(--cw) * .11);box-shadow:0 0 0 3px var(--rn);pointer-events:none;transition:translate .14s var(--ease-out);position:absolute;top:0;left:0}.kl-note{z-index:960;left:50%;bottom:max(24px, calc(env(safe-area-inset-bottom) + 12px));text-align:center;color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:none;width:max-content;max-width:calc(100% - 32px);animation:pop .3s var(--ease-pop) both;background:#000000b8;border-radius:999px;padding:10px 18px;font-size:14px;font-weight:600;position:absolute;translate:-50%}.kl-won{z-index:980;text-align:center;pointer-events:none;position:absolute;top:40%;left:0;right:0}.kl-won p{letter-spacing:-.05em;color:#fff;text-shadow:0 4px 30px #0000008c;animation:pop .42s var(--ease-pop) .5s both;font-size:56px;font-weight:800}.kl-won .confetti{top:40%}.is-done .kl-card{animation:kl-fly 1.5s var(--fd) cubic-bezier(.45, 0, .7, 1) forwards}@keyframes kl-fly{0%{translate:0;rotate:none}22%{translate:calc(var(--fx) * .22) -110px}to{translate:var(--fx) 115vh;rotate:var(--fr)}}.kl-sum{align-items:center;gap:16px;display:flex}.kl-sum-cards{flex:none;width:96px;height:62px;position:relative}.kl-sum-cards .kl-card{transition:none}.kl-sum p{color:var(--on-dark-dim);font-size:14px;line-height:1.35}.kl-sum b{color:var(--on-dark);font-weight:700}@media (prefers-reduced-motion:reduce){.kl-card,.kl-flip,.kl-cursor{transition:none}.kl-card.is-lifted{scale:none}.kl-card.is-hint{box-shadow:0 0 0 3px var(--rn);animation:none}.kl-card.is-nope{box-shadow:0 0 0 3px var(--bad,#ff4d4f);animation:none}.is-done .kl-card,.kl-note,.kl-won p{animation:none}}}