.playing-card{--card-main:var(--card-wild);--card-dark:#202025;--card-corner-inset:7%;--card-corner-size:11cqw;--card-glyph-size:44cqw;--card-radius-local:1rem;--card-border-width:2px;--card-edge-depth:3px;--card-border-tone:78%;isolation:isolate;aspect-ratio:5/7;border:var(--card-border-width) solid color-mix(in srgb, var(--card-dark) var(--card-border-tone), #101014);border-radius:var(--card-radius-local);color:#fff;background:var(--card-main);box-shadow:inset 0 1px 0 #ffffff1f, 0 var(--card-edge-depth) 0 color-mix(in srgb, var(--card-dark) 82%, #08080a), var(--card-shadow);transform-origin:50% 120%;transition:transform .31s cubic-bezier(.16, .72, .22, 1), opacity var(--motion-ui) var(--ease-standard), filter var(--motion-ui) var(--ease-standard), border-color var(--motion-ui) var(--ease-standard), box-shadow var(--motion-ui) var(--ease-standard);position:relative;overflow:hidden;container-type:inline-size}.playing-card[data-color=red]{--card-main:var(--card-red);--card-dark:var(--card-red-dark)}.playing-card[data-color=blue]{--card-main:var(--card-blue);--card-dark:var(--card-blue-dark)}.playing-card[data-color=green]{--card-main:var(--card-green);--card-dark:var(--card-green-dark)}.playing-card[data-color=yellow]{--card-main:var(--card-yellow);--card-dark:var(--card-yellow-dark)}.playing-card:before{content:"";z-index:-1;background:color-mix(in srgb, var(--card-dark) 76%, transparent);opacity:.72;width:160%;height:42%;position:absolute;top:29%;left:-30%;transform:rotate(-18deg)}.card-sheen{z-index:4;border-radius:inherit;opacity:0;pointer-events:none;transition:transform .28s var(--ease-emphasized), opacity .14s ease;background:linear-gradient(112deg,#0000 42%,#ffffff42 50%,#0000 58%);position:absolute;inset:-45% -80%;transform:translate(-48%)rotate(3deg)}.playing-card.is-playable:hover .card-sheen,.playing-card.is-playable:focus-visible .card-sheen,.playing-card.is-selected .card-sheen{transform:translateX(calc(48% + var(--card-glint-shift,0%))) rotate(3deg);opacity:1}.card-glyph{z-index:2;font-size:var(--card-glyph-size);text-shadow:0 2px 3px #00000057;place-items:center;font-weight:1000;line-height:1;display:grid;position:absolute;inset:0;transform:rotate(-3deg)}.card-corner{z-index:3;font-size:var(--card-corner-size);text-shadow:0 1px 2px #0000006b;font-weight:800;line-height:1;position:absolute}.card-corner.is-top{top:var(--card-corner-inset);left:var(--card-corner-inset);flex-direction:column;align-items:flex-start;max-width:76%;display:flex}.card-corner.is-bottom{right:var(--card-corner-inset);bottom:var(--card-corner-inset);transform:rotate(180deg)}.card-action-label{max-width:100%;font-size:max(.42rem, calc(var(--card-corner-size) * .58));letter-spacing:.035em;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap;opacity:.78;margin-top:.2rem;font-weight:700;overflow:hidden}.playing-card[data-kind=number] .card-glyph{font-variant-numeric:tabular-nums;letter-spacing:-.08em}.playing-card[data-size=mini]{--card-glyph-size:54cqw;--card-radius-local:.22rem;--card-border-width:1px;--card-edge-depth:1px;--card-border-tone:92%;box-shadow:inset 0 1px 0 #ffffff1a, 0 var(--card-edge-depth) 0 color-mix(in srgb, var(--card-dark) 88%, #08080a), 0 2px 4px #0000003d}.playing-card[data-size=mini] .card-corner{display:none}.playing-card[data-size=history]{--card-corner-inset:8%;--card-corner-size:20cqw;--card-glyph-size:49cqw;--card-radius-local:.38rem;--card-border-width:1px;--card-edge-depth:1.5px;--card-border-tone:88%}.playing-card[data-size=history] .card-action-label,.playing-card[data-size=history] .card-corner.is-bottom{display:none}.playing-card[data-size=stack]{--card-corner-size:14cqw;--card-glyph-size:42cqw;--card-radius-local:.55rem;--card-border-width:1.5px;--card-edge-depth:2px;--card-border-tone:84%}.playing-card[data-size=stack] .card-action-label{display:none}.playing-card[data-size=hand]{--card-corner-size:13.5cqw;--card-glyph-size:45cqw;--card-radius-local:.72rem;--card-border-width:1.5px;--card-edge-depth:2.5px;--card-border-tone:82%}.playing-card[data-size=discard]{--card-corner-size:14cqw;--card-glyph-size:50cqw;--card-radius-local:.82rem;--card-border-width:2px;--card-edge-depth:3px;--card-border-tone:80%}.playing-card[data-size=showcase]{--card-corner-size:11cqw;--card-glyph-size:44cqw;--card-radius-local:1rem;--card-border-width:2px;--card-edge-depth:3px;--card-border-tone:78%;border-radius:8%/5.7143%}.playing-card[data-size=showcase] .card-action-label{margin-top:1.3cqw;font-size:6.4cqw}.special-card-symbol{width:1em;height:1em;display:block;overflow:visible}.special-draw-number{color:currentColor;letter-spacing:-.09em;text-shadow:0 2px 3px #00000052;place-items:center;width:1em;height:1em;font-family:Nunito Variable,system-ui,sans-serif;font-size:.92em;font-weight:1000;line-height:1;display:inline-grid}.card-corner-symbol{place-items:center;min-width:1em;display:grid}.card-corner-symbol .special-card-symbol{width:1.25em;height:1.25em}.card-glyph .special-card-symbol{width:.92em;height:.92em}.history-card strong .special-card-symbol{width:1.05em;height:1.05em}.history-card-corner .special-card-symbol{width:1.15em;height:1.15em}.playing-card[data-color=wild]{background:conic-gradient(from 35deg at 55% 48%, var(--card-red) 0 25%, var(--card-blue) 0 50%, var(--card-green) 0 75%, var(--card-yellow) 0)}.playing-card[data-color=wild]:before{background:#242429}.playing-card.is-back{--card-main:#202025;--card-dark:#101014;--card-back-inset:6%;--card-back-frame-width:1.5px;box-shadow:inset 0 1px 0 #ffffff1f, 0 var(--card-edge-depth) 0 #101014, var(--card-shadow);background:#202025;border-color:#626caa}.playing-card.is-back:before{inset:var(--card-back-inset);border:var(--card-back-frame-width) solid #424978;border-radius:calc(var(--card-radius-local) * .76);width:auto;height:auto;box-shadow:inset 0 0 0 var(--card-back-frame-width) #ffffff06;opacity:1;background:0 0;transform:none}.card-back-emblem{z-index:3;aspect-ratio:1;filter:drop-shadow(0 .1em .08em #0000004d);background:0 0;border:0;place-items:center;width:78%;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)rotate(-3deg)}.card-back-emblem .yuno-logo{width:100%;height:100%;font-size:inherit}.card-back-accents{z-index:2;inset:var(--card-back-inset);pointer-events:none;position:absolute}.card-back-accent{opacity:.9;border:0 solid #0000;width:19%;height:13%;position:absolute}.card-back-accent.is-red{border-top-width:max(2px, var(--card-back-frame-width));border-left-width:max(2px, var(--card-back-frame-width));border-color:var(--game-ui-red);border-top-left-radius:calc(var(--card-radius-local) * .76);top:0;left:0}.card-back-accent.is-yellow{border-top-width:max(2px, var(--card-back-frame-width));border-right-width:max(2px, var(--card-back-frame-width));border-color:var(--game-ui-yellow);border-top-right-radius:calc(var(--card-radius-local) * .76);top:0;right:0}.card-back-accent.is-green{border-bottom-width:max(2px, var(--card-back-frame-width));border-left-width:max(2px, var(--card-back-frame-width));border-color:var(--game-ui-green);border-bottom-left-radius:calc(var(--card-radius-local) * .76);bottom:0;left:0}.card-back-accent.is-blue{border-right-width:max(2px, var(--card-back-frame-width));border-bottom-width:max(2px, var(--card-back-frame-width));border-color:var(--game-ui-blue);border-bottom-right-radius:calc(var(--card-radius-local) * .76);bottom:0;right:0}.playing-card.is-back[data-size=mini]{--card-back-inset:7%;--card-back-frame-width:1px}.playing-card.is-back[data-size=mini] .card-back-emblem{width:84%}.playing-card.is-back[data-size=mini] .card-back-accents,.playing-card.is-back[data-size=history] .card-back-accents{display:none}.playing-card.is-back[data-size=history]{--card-back-frame-width:1px}.playing-card.is-back[data-size=history] .card-back-emblem{width:82%}.playing-card.is-back[data-size=showcase] .card-back-emblem{width:74%}.playing-card.is-playable{cursor:pointer;touch-action:pan-x pinch-zoom;border-color:color-mix(in srgb, var(--card-main) 54%, #fff);filter:saturate(1.08)brightness(1.04);box-shadow:0 0 0 1px color-mix(in srgb, var(--card-main) 52%, #fff), 0 var(--card-edge-depth) 0 color-mix(in srgb, var(--card-dark) 82%, #08080a), 0 12px 30px color-mix(in srgb, var(--card-main) 34%, transparent), var(--card-shadow)}.playing-card.is-playable:not(.is-selected){animation:card-playable-ready .3s var(--ease-standard) backwards}.playing-card.is-playable:hover{box-shadow:0 0 0 1px color-mix(in srgb, var(--card-main) 70%, #fff), 0 var(--card-edge-depth) 0 color-mix(in srgb, var(--card-dark) 82%, #08080a), 0 14px 25px #00000052;z-index:80!important;transform:perspective(700px) translateY(-.58rem) rotateX(var(--card-tilt-x,0deg)) rotateY(var(--card-tilt-y,0deg)) rotateZ(0deg) scale(1.018)!important}.playing-card.is-playable.is-pressed{filter:brightness(1.08);transition-duration:75ms;transform:perspective(700px) translateY(-.55rem) rotateX(calc(var(--card-tilt-x,0deg) * .55)) rotateY(calc(var(--card-tilt-y,0deg) * .55)) scale(.965)!important}.playing-card.is-playable.is-dragging{box-shadow:0 24px 42px #00000075, 0 0 28px color-mix(in srgb, var(--card-main) 34%, transparent);touch-action:none;transition:none;z-index:95!important;transform:perspective(700px) translate3d(var(--card-drag-x), var(--card-drag-y), 3rem) rotateX(var(--card-tilt-x,0deg)) rotateY(var(--card-tilt-y,0deg)) scale(1.045)!important}.playing-card:focus-visible{box-shadow:inset 0 -4px 0 var(--focus), 0 20px 36px #0006;outline:none;z-index:82!important;transform:translateY(-.65rem)rotate(0)scale(1.018)!important}.playing-card.is-blocked{cursor:default;border-color:color-mix(in srgb, var(--card-dark) 88%, #08080a);opacity:.82;filter:saturate(.38)brightness(.7)contrast(.94);box-shadow:0 2px 0 color-mix(in srgb, var(--card-dark) 86%, #08080a), 0 6px 12px #00000038;animation:card-blocked-settle .26s var(--ease-standard) both;transform:translateY(.24rem)scale(.975)}.playing-card.is-blocked .card-sheen{display:none}.playing-card.is-selected{box-shadow:inset 0 -4px 0 var(--accent-strong), 0 24px 40px #0000006b;z-index:90!important;transform:translateY(-1.02rem)rotate(0)scale(1.012)!important}.playing-card.just-played{animation:card-land var(--motion-card) var(--ease-emphasized)}@keyframes card-playable-ready{0%{opacity:.78;filter:saturate(.82)brightness(.9)}}@keyframes card-blocked-settle{0%{opacity:1;filter:saturate()brightness();transform:translateY(0)scale(1)}}@media (prefers-reduced-motion:reduce){.playing-card{transition:none}.playing-card.is-playable,.playing-card.is-blocked{animation:none}}@keyframes card-land{0%{opacity:.55;transform:translateY(-1.5rem)rotate(-5deg)scale(1.12)}65%{opacity:1;transform:translateY(0)rotate(2deg)scale(.98)}to{transform:rotate(0)}}
