*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--ink:#3c4a38;--card:#dfa561;--red:#d64a3c;--white:#fdfdfa;--s1:8px;--s2:16px;--s3:24px;--s4:32px;--s5:40px;--s6:48px;--cw:clamp(64px, 8.6vmin, 112px);--pad-x:96px;--pad-y:384px;--w-max:260px;--stage-y:-24px}html,body{height:100%}body{color:var(--ink);background:linear-gradient(#e6f1e8 0%,#eef2e6 46%,#f8f2e6 100%);font-family:Nunito,system-ui,sans-serif}.vh{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}main{height:100%}.screen{justify-content:center;align-items:center;gap:var(--s6);height:100%;padding:var(--s3) var(--s2) var(--s2);flex-direction:column;display:flex;position:relative}.top-bar{top:var(--s3);z-index:30;width:min(640px, calc(100vw - var(--s6)));backdrop-filter:blur(10px);background:#fdfdfaad;border:1px solid #54634e1a;border-radius:999px;justify-content:space-between;align-items:center;min-height:60px;padding:8px;display:flex;position:absolute;left:50%;transform:translate(-50%);box-shadow:0 8px 24px #465a421f}.bar-end{width:44px;height:44px}.finished .top-bar{justify-content:center;width:250px}.finished .bar-end{display:none}.progress{align-items:center;gap:7px;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.progress:before{content:"";z-index:-1;background:#54634e2e;border-radius:3px;height:3px;position:absolute;left:5px;right:5px}.progress-step{background:#edf1e7;border:2px solid #54634e61;border-radius:50%;width:10px;height:10px;transition:width .18s,height .18s,border-color .18s,background .18s,box-shadow .18s;box-shadow:0 0 0 2px #fdfdfab8}.progress-step.done{background:#728b68;border-color:#728b68}.progress-step.current{border:3px solid var(--white);background:var(--card);width:16px;height:16px;box-shadow:0 2px 5px #5a46284d}.progress-step.failed{border:3px solid var(--white);background:var(--red);width:16px;height:16px;box-shadow:0 0 0 3px #d64a3c2e}.lvl{color:#54634e;background:#b6ccab57;border-radius:50%;place-items:center;width:42px;height:42px;font-size:24px;font-weight:900;display:grid}.left{align-items:center;width:44px;display:flex}.tally{align-items:center;gap:6px;display:flex}.tally-mark{place-items:center;width:20px;height:20px;display:grid}.tally-mark svg{fill:none;stroke:#6b7a66;stroke-linecap:round;stroke-width:2.4px;width:100%;height:100%}.tally-num{color:#54634e;font-size:20px;font-weight:900;line-height:1}.run-tally{top:calc(var(--s3) + 68px);z-index:29;backdrop-filter:blur(8px);background:#fdfdfa9e;border:1px solid #54634e1a;border-radius:999px;justify-content:center;min-width:54px;padding:5px 10px;position:absolute;left:50%;transform:translate(-50%);box-shadow:0 5px 14px #465a4217}.audio-controls{top:var(--s3);right:var(--s3);z-index:31;backdrop-filter:blur(8px);background:#fdfdfa9e;border:1px solid #54634e1a;border-radius:999px;gap:4px;padding:5px;display:flex;position:absolute;box-shadow:0 5px 14px #465a4217}.audio-toggle{color:#54634e;cursor:pointer;background:#b6ccab57;border:0;border-radius:50%;place-items:center;width:38px;height:38px;transition:background .15s,transform .15s,opacity .15s;display:grid;position:relative}.audio-toggle:hover{transform:translateY(-1px)}.audio-toggle:focus-visible{outline-offset:2px;outline:3px solid #54634e52}.audio-toggle svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.9px;width:22px;height:22px}.audio-toggle[aria-pressed=false]{opacity:.62;background:#54634e1a}.audio-toggle[aria-pressed=false]:after{content:"";background:currentColor;border-radius:2px;width:26px;height:2px;position:absolute;transform:rotate(-45deg)}#game.tally-changed .run-tally{animation:.42s cubic-bezier(.2,.9,.25,1.2) both tally-tick}.stage{top:var(--stage-y);flex:none;place-items:center;width:100%;display:grid;position:relative}#game.booting .top-bar,#game.booting .run-tally{animation:.42s ease-out both chrome-in}#game.booting .stage,#game.entering .stage{animation:.44s cubic-bezier(.2,.85,.25,1.05) both board-in}#game.booting .hand .c,#game.entering .hand .c{animation:.33s cubic-bezier(.2,.9,.25,1.15) both deal-card}#game.booting .hand .c:nth-child(2),#game.entering .hand .c:nth-child(2){animation-delay:45ms}#game.booting .hand .c:nth-child(3),#game.entering .hand .c:nth-child(3){animation-delay:90ms}#game.booting .hand .c:nth-child(4),#game.entering .hand .c:nth-child(4){animation-delay:.135s}#game.booting .hand .c:nth-child(5),#game.entering .hand .c:nth-child(5){animation-delay:.18s}#game.booting .hand .c:nth-child(6),#game.entering .hand .c:nth-child(6){animation-delay:.225s}.board{--w:min(calc((100vw - var(--pad-x)) * var(--fx)), calc((100vh - var(--pad-y)) * var(--fy)), var(--w-max));--lift:calc(var(--w) * .3);--hw:calc(var(--w) / 2);--h:calc(var(--w) / 2);--hh:calc(var(--w) / 4);--d:calc(var(--w) * .13);--head:calc(var(--peak,0) * var(--lift));width:calc(var(--w) * var(--span-x) / 2);height:calc(var(--hh) * (var(--cols) + var(--rows) - 2) + var(--h) + var(--d) + var(--head));filter:drop-shadow(0 18px 26px #465a4233);transition:opacity .3s;position:relative}.board.dim{opacity:.58;filter:grayscale(.42)drop-shadow(0 12px 18px #5c362f29)}.lost:before{content:"";z-index:20;pointer-events:none;background:#d64a3c21;animation:.56s ease-out both loss-wash;position:absolute;inset:0}.lost .loss-restart{animation:.64s cubic-bezier(.2,.9,.25,1.25) .18s both restart-call}.t{z-index:calc(var(--r) + var(--c));--lv:0;--dd:calc(var(--d) + var(--lv) * var(--lift));--rn:0px;--re:0px;--rs:0px;--rw:0px;--rmax:0px;left:calc((var(--c) - var(--r) - var(--min-q)) * var(--hw));top:calc((var(--c) + var(--r)) * var(--hh) - (var(--dd) - var(--d)) - var(--rmax) + var(--head));width:var(--w);height:calc(var(--h) + var(--dd) + var(--rmax));--yN:calc(var(--rmax) - var(--rn));--yE:calc(var(--hh) + var(--rmax) - var(--re));--yS:calc(var(--h) + var(--rmax) - var(--rs));--yW:calc(var(--hh) + var(--rmax) - var(--rw));--yEb:calc(var(--hh) + var(--rmax) + var(--dd));--yWb:calc(var(--hh) + var(--rmax) + var(--dd));--ySb:calc(var(--h) + var(--rmax) + var(--dd));--tl:min(var(--yW), var(--yS));--tr:min(var(--yS), var(--yE));--poly:polygon(50% var(--yN), 100% var(--yE), 50% var(--yS), 0 var(--yW));position:absolute}.top,.fl,.fr,.fx{position:absolute}.top{width:var(--w);height:calc(var(--h) + var(--rmax));clip-path:var(--poly);top:0;left:0}.top:after{content:"";clip-path:var(--poly);position:absolute;inset:0;transform:scale(.962)}.fl{top:var(--tl);width:var(--hw);height:calc(var(--ySb) - var(--tl));clip-path:polygon(0 calc(var(--yW) - var(--tl)), 100% calc(var(--yS) - var(--tl)), 100% calc(var(--ySb) - var(--tl)), 0 calc(var(--yWb) - var(--tl)));left:0}.fr{top:var(--tr);left:var(--hw);width:var(--hw);height:calc(var(--ySb) - var(--tr));clip-path:polygon(0 calc(var(--yS) - var(--tr)), 100% calc(var(--yE) - var(--tr)), 100% calc(var(--yEb) - var(--tr)), 0 calc(var(--ySb) - var(--tr)))}.fx{top:var(--rmax);z-index:2;width:var(--w);height:var(--h);left:0}.gr{--surface:#b6ccab;--surface-up:#8ba580}.gr .top{background:#a3bb98}.gr .top:after{background:#b6ccab}.gr .fl{background:#94ac8a}.gr .fr{background:#84997a}.up{--surface:#8ba580;--surface-up:#6b8560}.up .top{background:#7b9670}.up .top:after{background:#8ba580}.up .fl{background:#6e8664}.up .fr{background:#5e7556}.up2{--surface:#6b8560;--surface-up:#516247}.up2 .top{background:#5c7452}.up2 .top:after{background:#6b8560}.up2 .fl{background:#516247}.up2 .fr{background:#43533c}.sd .top{background:#dbc899}.sd .top:after{background:#eddcae radial-gradient(circle,#b4965a80 1.4px,#0000 1.8px) 0 0/10px 10px}.sd .fl{background:#cbb98b}.sd .fr{background:#b9a67b}.sl{--rmax:var(--lift);--tilt:.6}.sl-se{--re:var(--lift);--rs:var(--lift)}.sl-nw{--rn:var(--lift);--rw:var(--lift)}.sl-sw{--rw:var(--lift);--rs:var(--lift)}.sl-ne{--rn:var(--lift);--re:var(--lift)}.sl-se .pl.ar{transform:matrix(1, calc(.5 - var(--tilt)), -1, .5, 0, 0) rotate(var(--rot))}.sl-nw .pl.ar{transform:matrix(1, calc(.5 + var(--tilt)), -1, .5, 0, 0) rotate(var(--rot))}.sl-sw .pl.ar{transform:matrix(1, .5, -1, calc(.5 - var(--tilt)), 0, 0) rotate(var(--rot))}.sl-ne .pl.ar{transform:matrix(1, .5, -1, calc(.5 + var(--tilt)), 0, 0) rotate(var(--rot))}.sl-se .pl.direction-pad{transform:matrix(1, calc(.5 - var(--tilt)), -1, .5, 0, 0)}.sl-nw .pl.direction-pad{transform:matrix(1, calc(.5 + var(--tilt)), -1, .5, 0, 0)}.sl-sw .pl.direction-pad{transform:matrix(1, .5, -1, calc(.5 - var(--tilt)), 0, 0)}.sl-ne .pl.direction-pad{transform:matrix(1, .5, -1, calc(.5 + var(--tilt)), 0, 0)}.sl .tri{width:calc(var(--w) * .52);height:calc(var(--w) * .34)}.sl-se .top:after{background:linear-gradient(297deg, var(--surface-up), var(--surface))}.sl-nw .top:after{background:linear-gradient(117deg, var(--surface-up), var(--surface))}.sl-sw .top:after{background:linear-gradient(63deg, var(--surface-up), var(--surface))}.sl-ne .top:after{background:linear-gradient(243deg, var(--surface-up), var(--surface))}.pl{z-index:2;width:var(--w);height:var(--w);margin:calc(var(--w) / -2) 0 0 calc(var(--w) / -2);place-items:center;display:grid;position:absolute;top:50%;left:50%;transform:matrix(1,.5,-1,.5,0,0)}.pl.ar{transform:matrix(1, .5, -1, .5, 0, 0) rotate(var(--rot));--edge:calc(var(--w) * .009);filter:drop-shadow(var(--edge) 0 0 var(--white)) drop-shadow(calc(var(--edge) * -1) 0 0 var(--white)) drop-shadow(0 var(--edge) 0 var(--white)) drop-shadow(0 calc(var(--edge) * -1) 0 var(--white));display:none}.armed .pl.ar{display:grid}.tri{width:calc(var(--w) * .46);height:calc(var(--w) * .24);clip-path:polygon(0% 33%,57% 33%,57% 0%,100% 50%,57% 100%,57% 67%,0% 67%);background:#2c3a28e6;display:block}.cup{z-index:1;width:calc(var(--w) * .4);height:calc(var(--w) * .2);background:#41513c;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:inset 0 2px 4px #00000080}.flag{bottom:50%;left:calc(50% + var(--w) * .02);z-index:9;width:calc(var(--w) * .018);min-width:2px;height:calc(var(--w) * .46);background:#4a4a46;border-radius:2px;position:absolute}.flag:after{content:"";border-top:calc(var(--w) * .085) solid transparent;border-bottom:calc(var(--w) * .085) solid transparent;border-left:calc(var(--w) * .22) solid var(--red);position:absolute;top:0;left:100%}.shdw{width:calc(var(--w) * .34);height:calc(var(--w) * .17);background:#3c503842;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-30%)}.ball{z-index:8;width:calc(var(--w) * .3);height:calc(var(--w) * .3);background:var(--white);border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-72%);box-shadow:inset -2px -3px 5px #505f4c33}.sand-burst{z-index:902;pointer-events:none;width:1px;height:1px;position:absolute}.sand-burst i{width:calc(var(--burst) * .045);height:calc(var(--burst) * .045);--gx:calc(var(--burst) * .18);--gy:calc(var(--burst) * -.08);background:#c8aa70;border-radius:50%;animation:.26s ease-out both sand-grain;position:absolute}.sand-burst i:nth-child(2){--gx:calc(var(--burst) * -.17);--gy:calc(var(--burst) * -.1)}.sand-burst i:nth-child(3){--gx:calc(var(--burst) * .1);--gy:calc(var(--burst) * -.16)}.sand-burst i:nth-child(4){--gx:calc(var(--burst) * -.08);--gy:calc(var(--burst) * -.17)}.sand-burst i:nth-child(5){--gx:calc(var(--burst) * .21);--gy:calc(var(--burst) * .02)}.sand-burst i:nth-child(6){--gx:calc(var(--burst) * -.2);--gy:calc(var(--burst) * .01)}.hand{justify-content:center;align-items:flex-end;display:flex}.screen>.hand,.screen>.endcard{top:var(--hand-y,78%);position:absolute;left:50%;transform:translate(-50%,-50%)}.c{z-index:1;--turn:0deg;--fan-y:0px;width:var(--cw);height:calc(var(--cw) * 1.4);border-radius:var(--s2);background:var(--card);cursor:pointer;font:inherit;transform:translateY(var(--fan-y)) rotate(var(--turn));border:0;place-items:center;margin:0 -5px;transition:transform .16s,box-shadow .16s;display:grid;position:relative;box-shadow:0 6px 12px #5a46283d,inset 0 -5px #00000017}.cards-2 .c:first-child{--turn:-3deg;--fan-y:2px}.cards-2 .c:nth-child(2){--turn:3deg;--fan-y:2px}.cards-3 .c:first-child{--turn:-6deg;--fan-y:5px}.cards-3 .c:nth-child(2){--turn:0deg;--fan-y:0px}.cards-3 .c:nth-child(3){--turn:6deg;--fan-y:5px}.cards-4 .c:first-child{--turn:-6deg;--fan-y:6px}.cards-4 .c:nth-child(2){--turn:-2deg;--fan-y:1px}.cards-4 .c:nth-child(3){--turn:2deg;--fan-y:1px}.cards-4 .c:nth-child(4){--turn:6deg;--fan-y:6px}.cards-5 .c:first-child{--turn:-7deg;--fan-y:8px}.cards-5 .c:nth-child(2){--turn:-3.5deg;--fan-y:3px}.cards-5 .c:nth-child(3){--turn:0deg;--fan-y:0px}.cards-5 .c:nth-child(4){--turn:3.5deg;--fan-y:3px}.cards-5 .c:nth-child(5){--turn:7deg;--fan-y:8px}.cards-6 .c:first-child{--turn:-7deg;--fan-y:9px}.cards-6 .c:nth-child(2){--turn:-4deg;--fan-y:4px}.cards-6 .c:nth-child(3){--turn:-1.5deg;--fan-y:1px}.cards-6 .c:nth-child(4){--turn:1.5deg;--fan-y:1px}.cards-6 .c:nth-child(5){--turn:4deg;--fan-y:4px}.cards-6 .c:nth-child(6){--turn:7deg;--fan-y:9px}button.c:not(.sel):hover{z-index:3;transform:translateY(calc(var(--fan-y) - 4px)) rotate(var(--turn));box-shadow:0 10px 17px #5a46284d,inset 0 -5px #00000017}button.c:focus-visible{z-index:11;outline:4px solid var(--white);outline-offset:3px}.c.sel{z-index:10;box-shadow:0 12px 20px #5a46284d, 0 0 0 4px var(--white), inset 0 -5px 0 #00000017;transform:translateY(calc(var(--s3) * -1)) rotate(0)!important}.c.spent{z-index:0;box-shadow:none;cursor:default;opacity:.55;background:#cdc7b6}.num{top:var(--s1);left:var(--s1);background:var(--white);color:#8a6236;font-size:calc(var(--cw) * .32);border-radius:8px;padding:2px 8px;font-weight:900;line-height:1;position:absolute}.gl{width:56%;height:4px;margin-top:var(--s2);background:#7a5a2c;border-radius:3px;position:relative}.gl:after{content:"";border-top:8px solid #0000;border-bottom:8px solid #0000;border-left:12px solid #7a5a2c;position:absolute;top:-6px;right:-3px}.gl.arc{height:calc(var(--cw) * .24);border-radius:calc(var(--cw) * .3) calc(var(--cw) * .3) 0 0;background:0 0;border:4px solid #7a5a2c;border-bottom:0}.gl.arc:after{border:8px solid #0000;border-top:12px solid #7a5a2c;border-bottom:0;top:auto;bottom:-4px;right:-8px}.result{align-items:center;gap:var(--s3);flex-direction:column;display:flex}#game.entering .finished .finish{animation:.52s ease-out both goal-in}#game.entering .finished .flag:after{transform-origin:0;animation:.52s ease-in-out .22s both flag-wave}#game.entering .finished .finish-message{animation-delay:.18s}#game.entering .finished .start-over{animation:.36s ease-out .36s both action-in}.finish{--w:min(46vmin, 420px);width:var(--w);height:calc(var(--w) / 2);filter:drop-shadow(0 18px 26px #465a422e);position:relative}.finish-message{text-align:center;animation:.56s cubic-bezier(.2,.9,.25,1.15) both score-arrive}.finish-message h2{color:#4f624a;font-size:clamp(32px,4vmin,52px);font-weight:900}.finish-message p{color:#6b7a66;margin-top:4px;font-size:clamp(18px,2vmin,24px);font-weight:600}.finish-message strong{color:#4f624a;font-size:1.2em;font-weight:900}.start-over{min-height:58px;padding:0 var(--s3);background:var(--card);color:#5b4526;cursor:pointer;font:inherit;border:0;border-radius:999px;align-items:center;gap:10px;font-size:19px;font-weight:900;transition:transform .15s;display:flex;box-shadow:0 8px 16px #5a462847,inset 0 -5px #0000001a}.start-over:hover{transform:translateY(-2px)}.start-over svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-width:2.6px;width:25px;height:25px}.endcard{z-index:21;align-items:center;display:flex;position:relative}.loss-restart{position:absolute;bottom:calc(100% + 14px);left:50%;transform:translate(-50%)}.loss-restart:hover{transform:translate(-50%,-2px)}.lost .endcard .c{animation:.42s ease-out both spent-drop}@keyframes loss-wash{0%{opacity:0}28%{opacity:1}to{opacity:.28}}@keyframes restart-call{0%{opacity:0;transform:translate(-50%)scale(.55)rotate(-70deg)}to{opacity:1;transform:translate(-50%)scale(1)rotate(0)}}@keyframes spent-drop{0%{transform:translateY(calc(var(--fan-y) - 10px)) rotate(var(--turn));opacity:.9}to{transform:translateY(var(--fan-y)) rotate(var(--turn));opacity:1}}@keyframes score-arrive{0%{opacity:0;transform:translateY(-14px)scale(.88)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes chrome-in{0%{opacity:0;transform:translate(-50%,-8px)}to{opacity:1;transform:translate(-50%)}}@keyframes board-in{0%{opacity:0;transform:translateY(14px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes deal-card{0%{opacity:0;transform:translateY(calc(var(--fan-y) + 18px)) rotate(var(--turn)) scale(.94)}to{opacity:1;transform:translateY(var(--fan-y)) rotate(var(--turn)) scale(1)}}@keyframes tally-tick{0%{transform:translate(-50%)scale(1)}48%{background:#fff7e9;transform:translate(-50%)scale(1.2)rotate(4deg)}to{transform:translate(-50%)scale(1)}}@keyframes sand-grain{0%{opacity:.85;transform:translate(0)scale(1)}to{opacity:0;transform:translate(var(--gx), var(--gy)) scale(.35)}}@keyframes goal-in{0%{opacity:0;transform:translateY(16px)scale(.9)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes flag-wave{0%,to{transform:skewY(0)scaleX(1)}35%{transform:skewY(-5deg)scaleX(.9)}70%{transform:skewY(3deg)scaleX(1.04)}}@keyframes action-in{0%{opacity:0;transform:translateY(10px)scale(.92)}to{opacity:1;transform:translateY(0)scale(1)}}.endcard .c{margin:0 var(--s1) 0 0}.endcard .cards-6 .c:first-child{--turn:-9deg;--fan-y:11px}.endcard .cards-6 .c:nth-child(2){--turn:-5.5deg;--fan-y:5px}.endcard .cards-6 .c:nth-child(3){--turn:-2deg;--fan-y:1px}.endcard .cards-6 .c:nth-child(4){--turn:2deg;--fan-y:1px}.endcard .cards-6 .c:nth-child(5){--turn:5.5deg;--fan-y:5px}.endcard .cards-6 .c:nth-child(6){--turn:9deg;--fan-y:11px}.endcard .c.spent{opacity:1;background:#bdb7a6;box-shadow:0 4px 10px #5a462829}.endcard .c.spent .num{color:#5f5c51;background:#f4f2ea}.redo{background:var(--card);cursor:pointer;border:0;border-radius:50%;place-items:center;width:72px;height:72px;transition:transform .15s;display:grid;box-shadow:0 8px 16px #5a462847,inset 0 -5px #0000001a}.redo:hover{transform:translateY(-2px)}.redo.sm{width:44px;height:44px;box-shadow:0 3px 8px #5a462833,inset 0 -3px #0000001a}.redo svg{fill:none;stroke:#5b4526;stroke-linecap:round;stroke-width:2.6px;width:50%;height:50%}@media (width<=700px){:root{--pad-x:24px;--pad-y:264px;--w-max:150px;--stage-y:0px}.screen{gap:var(--s4);padding:var(--s2) var(--s1)}.top-bar{top:var(--s2);width:calc(100vw - var(--s3));min-height:58px;padding:7px}.audio-controls{top:auto;right:var(--s2);bottom:var(--s2);padding:4px}.audio-toggle{width:34px;height:34px}.audio-toggle svg{width:19px;height:19px}.finished .top-bar{width:190px}.progress{gap:4px}.progress-step{border-width:1px;width:7px;height:7px}.progress-step.current,.progress-step.failed{border-width:2px;width:12px;height:12px}.endcard{gap:var(--s2)}.endcard .c{margin-left:-4px;margin-right:-4px}.lvl,.redo.sm{width:44px;height:44px}.redo{width:60px;height:60px}.tally-mark{width:18px;height:18px}.tally-num{font-size:18px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;transition-delay:0s!important;animation-duration:.01ms!important;animation-delay:0s!important}}.mk{z-index:calc(var(--r) + var(--c));left:calc((var(--c) - var(--r) - var(--min-q)) * var(--hw));top:calc((var(--c) + var(--r)) * var(--hh) - var(--lv) * var(--lift) + var(--head));width:var(--w);height:var(--h);pointer-events:none;transform-origin:50%;transition:transform .12s;animation:.22s cubic-bezier(.2,.9,.25,1.15) backwards direction-arrive;position:absolute}.dir-se{--from-x:-50%;--from-y:-50%;animation-delay:20ms}.dir-sw{--from-x:50%;--from-y:-50%;animation-delay:50ms}.dir-nw{--from-x:50%;--from-y:50%;animation-delay:80ms}.dir-ne{--from-x:-50%;--from-y:50%}.direction-pad i{width:calc(var(--w) * .42);height:calc(var(--w) * .42);filter:drop-shadow(0 3px 4px #3c4a3833);background:#fdfdfaad;transition:background .12s,filter .12s,transform .12s;display:block}.mk:has(.hit:hover){transform:scale(1.045)}.mk:has(.hit:active){transform:scale(.965)}.mk:has(.hit:hover) .direction-pad i{background:#fdfdfae0}.mk:has(.hit:hover) .tri,.mk:has(.hit:focus-visible) .tri{background:#c87832}.mk:has(.hit:focus-visible) .direction-pad i{filter:drop-shadow(2px 0 0 var(--card)) drop-shadow(-2px 0 0 var(--card)) drop-shadow(0 2px 0 var(--card)) drop-shadow(0 -2px 0 var(--card));background:#fdfdfaf0}.hit{clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);cursor:pointer;pointer-events:auto;background:0 0;border:0;position:absolute;inset:0}.hit:focus{outline:0}@keyframes direction-arrive{0%{opacity:0;transform:translate(var(--from-x), var(--from-y)) scale(.64)}to{opacity:1;transform:translate(0)scale(1)}}.t{pointer-events:none}