:root{--ink: #4a3f55;--paper: #fffdf7;--pink: #ff8fb1;--hot: #ff5d8f;--mint: #bdeee0;--mint-d: #7cc9b6;--sky: #cfeaff;--lemon: #fff3a8;--lilac: #c4b5ff;--cw: clamp(40px, 7.4vw, 76px);--ch: calc(var(--cw) * 1.42);--av: clamp(46px, 10vw, 104px);--p: 3px}*{box-sizing:border-box}html,body{margin:0;height:100%;background:#ffe5ec}body{font-family:DotGothic16,Courier New,monospace;color:var(--ink);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;overflow:hidden}canvas.px,.px{image-rendering:pixelated;image-rendering:crisp-edges}small{display:block;font-size:.55em;opacity:.8}.btn,.card,.obox,.panel,.chip,.tag,.bubble,.prompt,.toast{box-shadow:0 calc(var(--p) * -1) 0 var(--ink),0 var(--p) 0 var(--ink),calc(var(--p) * -1) 0 0 var(--ink),var(--p) 0 0 var(--ink)}.screen{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden;overflow:clip}.btn{font:inherit;font-size:clamp(14px,2.6vw,20px);color:var(--ink);background:var(--paper);border:0;padding:8px 16px;margin:4px;cursor:pointer;border-bottom:4px solid #d9d0e6;transition:transform .06s steps(2)}.btn:hover{background:var(--lemon)}.btn:active{transform:translateY(3px);border-bottom-width:1px}.btn.go{background:#b9f0b4;border-bottom-color:#7fcf86}.btn.sm{padding:4px 10px;font-size:14px}.btn.big{font-size:clamp(20px,4vw,30px);padding:12px 28px;background:var(--pink);border-bottom-color:var(--hot);color:#fff}.landing{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:repeating-conic-gradient(#ffffff55 0 25%,transparent 0 50%) 0 0 / 48px 48px,linear-gradient(#ffd6e8,#cfeaff 55%,#bdeee0);text-align:center;padding:16px}.title{margin:0;font-size:clamp(34px,9vw,84px);line-height:1;letter-spacing:2px;color:#fff;text-shadow:4px 0 var(--ink),-4px 0 var(--ink),0 4px var(--ink),0 -4px var(--ink),4px 4px var(--ink),-4px 4px var(--ink),4px -4px var(--ink),-4px -4px var(--ink),8px 8px 0 var(--hot);animation:hop 1.2s steps(4) infinite}.sub{margin:10px 0 14px;font-size:clamp(18px,4.4vw,36px);font-weight:400;color:var(--ink);letter-spacing:4px}.panel{background:var(--paper);padding:14px 18px;display:flex;flex-direction:column;gap:8px;align-items:center;z-index:2}.field{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;font-size:16px}.stepper{display:flex;align-items:center}.stepper .num{min-width:28px;font-size:22px}select{font:inherit;font-size:16px;padding:4px;margin:2px;border:3px solid var(--ink);background:#fff;color:var(--ink);border-radius:0}.floaters{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.floaters canvas{position:absolute}.floaters .item{top:8%;width:clamp(30px,7vw,64px);animation:bob 1.6s steps(4) infinite}.floaters .peek{bottom:-2px;width:clamp(48px,12vw,120px);animation:bob 1.2s steps(3) infinite}.game{background:linear-gradient(#ffe0ec,#ffeef4 30%)}.wall{position:absolute;top:0;right:0;bottom:60%;left:0;background:repeating-linear-gradient(90deg,#ffe0ec 0,#ffe0ec 40px,#ffd3e3 40px,#ffd3e3 80px)}.window{position:absolute;left:8%;top:6%;width:16%;height:46%;background:var(--sky);border:6px solid #fff;outline:4px solid var(--ink);background-image:linear-gradient(#fff 0,#fff 0),linear-gradient(#fff 0,#fff 0);background-size:6px 100%,100% 6px;background-position:center;background-repeat:no-repeat;opacity:.8}.window.w2{left:auto;right:8%}.table{position:absolute;left:-10%;right:-10%;top:29%;bottom:-10%;background:var(--mint);border-top:8px solid var(--mint-d);border-radius:50% 50% 0 0/24% 24% 0 0;box-shadow:inset 0 12px #d8f8ef,0 -4px 0 var(--ink);z-index:2}.cloth{position:absolute;top:14%;right:22%;bottom:0;left:22%;background:repeating-conic-gradient(#ffffff80 0,#ffffff80 25%,#fff3a880 0,#fff3a880 50%) 0 0 / 36px 36px;border-radius:40% 40% 0 0/14% 14% 0 0}.opps{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1}.opp{position:absolute;width:var(--av);margin-left:calc(var(--av) / -2);transform:scale(var(--sc, 1));transform-origin:top center;text-align:center;z-index:1}.opp .av canvas{width:100%;height:auto;display:block}.opp .tag{--p: 2px;display:flex;justify-content:center;gap:4px;align-items:center;background:var(--paper);font-size:clamp(9px,1.8vw,14px);padding:1px 3px;margin:0 auto 5px;white-space:nowrap;width:max-content;min-width:100%}.opp .ct{display:inline-flex;align-items:center;gap:2px}.opp .ct b{font-weight:400;color:var(--hot)}.mini{display:inline-block;width:7px;height:10px;background:var(--lilac);border:1px solid var(--ink)}.opp{display:flex;flex-direction:column}.opp .tag{order:0}.opp .av{order:1}.opp.active .tag{background:var(--lemon)}.opp.out .av{filter:grayscale(1) opacity(.45)}.opp .badge{position:absolute;right:-6px;top:34%;font-size:clamp(12px,2.4vw,20px);color:#fff;text-shadow:2px 0 var(--ink),-2px 0 var(--ink),0 2px var(--ink),0 -2px var(--ink);z-index:3}.opp.shuffling .av{animation:wiggle .36s steps(6)}.picking .opp{cursor:pointer}.picking .opp .av{animation:bob .4s steps(2) infinite;outline:3px dashed var(--hot);outline-offset:2px}.bubble{--p: 2px;position:absolute;left:50%;top:-6px;transform:translate(-50%,-100%) scale(0);background:#fff;padding:2px 8px;font-size:clamp(11px,2.2vw,18px);white-space:nowrap;z-index:9;pointer-events:none}.bubble.show{animation:pop 1.1s steps(8) forwards}.bubble.bad{background:#ffd3d3}.bubble.good{background:#d9ffd3}.mebubble{top:auto;bottom:calc(var(--ch) + 150px);z-index:20;font-size:clamp(16px,3vw,26px)}.items{position:absolute;top:0;right:0;bottom:0;left:0;z-index:3;pointer-events:none}.items .item{position:absolute;width:clamp(24px,4.6vw,52px);transform:translate(-50%)}.items .mine{left:9%;top:auto;bottom:calc(var(--ch) + 56px);width:clamp(44px,9vw,110px)}.items .mine.right{left:91%;width:clamp(34px,7vw,84px)}.chopsticks{position:absolute;left:18%;bottom:calc(var(--ch) + 50px);width:clamp(40px,9vw,110px);height:10px;border-top:3px solid #c98f62;border-bottom:3px solid #c98f62;transform:rotate(-8deg)}.shown{position:absolute;display:flex;transform:translate(-50%);--cw: clamp(17px, 2.7vw, 26px);--p: 1px}.shown .card .r{font-size:calc(var(--cw) * .58);left:5%;top:2%}.shown .card .u{font-size:calc(var(--cw) * .52);left:5%;top:48%}.shown .card .big{display:none}.opp.exposed .tag{background:#ffd3d3}.chip.exposedme{background:#ffd3d3;animation:blink .8s steps(2) infinite}.b-exposed{--c: #e63946}.b-exposed .ic{animation:stamp .35s steps(5)}.pile{position:absolute;left:50%;top:50%;width:0;height:0;z-index:4}.pile.thump{animation:thump .22s steps(4)}.pplay{position:absolute;display:flex;transform:translate(-50%,-50%) rotate(var(--r)) translate(var(--ox),var(--oy))}.pplay .card+.card{margin-left:calc(var(--cw) * -.42)}.pile.flipping .card{transition:transform .14s steps(3);transform:scaleX(0)}.discard{position:absolute;left:82%;top:56%;width:0;height:0;z-index:4}.discard .stack{position:absolute;left:0;bottom:0;transform:translate(-50%) scale(.8);transform-origin:bottom center;display:flex;flex-direction:column}.discard .side{height:var(--h, 0px);width:var(--cw);background:repeating-linear-gradient(#fff 0,#fff 2px,#c9b8e8 2px,#c9b8e8 3px);box-shadow:calc(var(--p) * -1) 0 0 var(--ink),var(--p) 0 0 var(--ink),0 var(--p) 0 var(--ink);transition:height .2s steps(4)}.discard.empty .stack{opacity:.25}.discard.tall .stack{animation:sway 1.4s steps(6) infinite}.discard .stack.wobble{animation:sway .16s steps(3) infinite}.discard .stack.fall{animation:fall .5s steps(6) forwards}.dlabel{position:absolute;left:0;top:6px;transform:translate(-50%);font-size:13px;color:#5b8f84}.card{position:relative;flex:none;width:var(--cw);height:calc(var(--cw) * 1.42);background:var(--paper);color:var(--ink);font-size:calc(var(--cw) * .36);line-height:1}.card .r{position:absolute;left:8%;top:5%}.card .u{position:absolute;left:8%;top:31%;font-size:.8em}.card .big{position:absolute;right:8%;bottom:6%;font-size:calc(var(--cw) * .62)}.card.s-H,.s-H{color:#ff4d7d}.card.s-D,.s-D{color:#ff9a2e}.card.s-C,.s-C{color:#1fa896}.card.s-S,.s-S{color:#3b3550}.card.joker{background:linear-gradient(135deg,#ffc6ff,#fff3a8 50%,#9be7f5);color:#7b4bd6}.card.joker .big{font-size:calc(var(--cw) * .26);right:6%;text-align:right}.card.back{background:repeating-conic-gradient(#ffc6ff 0,#ffc6ff 25%,#c4b5ff 0,#c4b5ff 50%) 0 0 / 10px 10px;border:4px solid #fff}.card.flying{position:fixed;left:0;top:0;margin:0;z-index:30;pointer-events:none}.hand{position:absolute;left:0;right:0;bottom:0;height:calc(var(--ch) + 40px);z-index:6}.hand.active:before{content:"";position:absolute;left:10%;right:10%;bottom:0;height:8px;background:var(--lemon);animation:blink .6s steps(2) infinite}.hand .card{position:absolute;top:30px;cursor:pointer;transform:translateY(var(--y, 0)) rotate(var(--rot, 0deg));transition:left .16s steps(4),transform .1s steps(3);transform-origin:50% 120%}.hand .card.sel{transform:translateY(calc(var(--y, 0px) - 24px)) rotate(var(--rot, 0deg));background:#fffbe0}.hand .card.new{animation:dealin .25s steps(4)}.hand .card.nope{animation:nope .4s steps(8)}.hand.buzz{animation:shake .3s steps(6)}.hand.shuffling .card{animation:wiggle .36s steps(6)}.hand.dealing .card{opacity:0}.controls{position:absolute;left:0;right:0;bottom:calc(var(--ch) + 46px);display:flex;justify-content:center;z-index:7;min-height:44px;pointer-events:none}.controls .btn{pointer-events:auto}.prompt{--p: 2px;position:absolute;left:50%;bottom:calc(var(--ch) + 100px);transform:translate(-50%);background:var(--paper);padding:3px 12px;font-size:clamp(13px,2.6vw,20px);z-index:7;white-space:nowrap}.prompt:empty{display:none}.prompt.me{background:var(--lemon)}.prompt.alert{background:#ffd3e3;animation:hop .5s steps(2) infinite}.timer{display:block;height:5px;background:var(--hot);animation:shrink 4s linear forwards;transform-origin:left}.status{position:absolute;left:8px;top:8px;right:215px;display:flex;flex-wrap:wrap;gap:7px 9px;align-items:flex-start;z-index:8;pointer-events:none}.chip{--p: 2px;background:var(--paper);padding:2px 7px;font-size:clamp(10px,1.9vw,15px)}.chip.rev.on,.chip.revo{background:#ffc6ff;animation:blink .8s steps(2) infinite}.chip.spade{background:#3b3550;color:#fff}.chip.jack{background:#9be7f5}.topbar{position:absolute;right:6px;top:6px;z-index:8}.game[data-left="3"]:after,.game[data-left="2"]:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:5}.game[data-left="3"]:after{box-shadow:inset 0 0 90px 10px #ff8caa59;animation:pulse 1.2s steps(4) infinite}.game[data-left="2"]:after{box-shadow:inset 0 0 130px 30px #ff466e80;animation:pulse .5s steps(4) infinite}.fx{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:40}.puff{position:fixed;width:12px;height:12px;margin:-6px;background:#fff;box-shadow:26px 0 #fff3a8,-26px 0 #ffc6ff,0 26px #9be7f5,0 -26px #b9f0b4,18px 18px #fff,-18px -18px #fff,18px -18px #ffc6ff,-18px 18px #fff3a8;animation:puff .4s steps(5) forwards}.burst{position:fixed;--c: var(--hot);transform:translate(-50%,-50%);text-align:center;animation:burst .85s steps(9) forwards}.burst .rays{position:absolute;left:50%;top:40%;width:180px;height:180px;margin:-90px;background:repeating-conic-gradient(var(--c) 0 12deg,transparent 0 30deg);border-radius:50%;opacity:.55;animation:spin 1.2s steps(12) infinite}.burst .ic{position:relative}.burst .ic canvas{width:clamp(54px,11vw,90px);height:auto;filter:drop-shadow(3px 3px 0 var(--ink))}.burst .lb{position:relative;font-size:clamp(22px,5.4vw,44px);color:#fff;text-shadow:3px 0 var(--ink),-3px 0 var(--ink),0 3px var(--ink),0 -3px var(--ink),3px 3px var(--ink),-3px -3px var(--ink),3px -3px var(--ink),-3px 3px var(--ink),5px 6px 0 var(--c);white-space:nowrap}.burst .jp{position:relative;font-size:clamp(12px,2.6vw,20px);background:var(--c);color:#fff;display:inline-block;padding:0 8px}.b-suitLock{--c: #f4b400}.b-suitLock .ic{animation:slam .3s steps(4)}.b-steal{--c: #a070ff}.b-steal .ic{animation:swipe .5s steps(6)}.b-skip{--c: #ff7a59}.b-skip .ic{animation:dash .4s steps(5)}.b-give{--c: #ff8fb1}.b-give .ic{animation:hop .3s steps(3) 2}.b-discard{--c: #7d8aa5}.b-discard .ic{animation:drop .5s steps(6)}.b-endRound{--c: #2bb3a3}.b-endRound .ic{animation:sweep .45s steps(6)}.b-reverseDirection,.b-jumpIn{--c: #3fa7ff}.b-reverseDirection .ic,.b-jumpIn .ic{animation:spin .45s steps(8)}.b-jumpIn{--c: #ff5d8f}.b-reverseOrderRound{--c: #20b6d6}.b-reverseOrderRound .ic{animation:flipy .5s steps(6)}.b-revive{--c: #ffb703}.b-revive .ic{animation:rise .5s steps(6)}.b-cancel{--c: #e63946}.b-cancel .ic{animation:stamp .3s steps(4)}.b-revolution{--c: #ff5d8f}.b-revolution .ic{animation:spin .5s steps(8)}.b-revolution .rays{background:repeating-conic-gradient(#ff8fb1 0,#ff8fb1 10deg,#fff3a8 0,#fff3a8 20deg,#9be7f5 0,#9be7f5 30deg);opacity:.9;width:300px;height:300px;margin:-150px}.b-spade{--c: #3b3550}.b-spade .ic{animation:stamp .4s steps(5)}.b-generic{--c: #7b4bd6}.toast{position:fixed;left:50%;top:20%;transform:translate(-50%);background:var(--lemon);padding:8px 18px;font-size:clamp(18px,4vw,30px);text-align:center;animation:toast 2.1s steps(12) forwards;white-space:nowrap}.shake{animation:shake .25s steps(5)}.shakebig{animation:shakebig .5s steps(10)}.flash:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:39;pointer-events:none;background:repeating-linear-gradient(45deg,#ff8fb155 0,#ff8fb155 30px,#fff3a855 30px,#fff3a855 60px,#9be7f555 60px,#9be7f555 90px);animation:blink .2s steps(2) 3}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#4a3f558c;display:flex;align-items:center;justify-content:center;z-index:50;padding:12px}.obox{position:relative;background:var(--paper);padding:14px 16px;width:min(94vw,560px);max-height:90vh;overflow:auto;text-align:center}.obox h3{margin:0 0 8px;font-size:22px;font-weight:400}.obox h3 small{display:inline}.help .obox{text-align:left;font-size:14px;line-height:1.35;-webkit-user-select:text;user-select:text}.help p{margin:0 0 8px}.hrow{display:flex;gap:12px;align-items:flex-start;margin:10px 2px}.hrow b{font-weight:400;color:var(--hot);font-size:16px}.hcard{--cw: 34px;flex:none;margin-top:4px}.help .close{display:block;margin:8px auto 0}.picker .backs{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;padding:8px;--cw: clamp(34px, 8vw, 56px)}.picker .backs .card{cursor:pointer;animation:bob .6s steps(2) infinite}.picker .backs .card:nth-child(2n){animation-delay:-.3s}.picker .backs .card:hover{transform:translateY(-8px)}.over .head{font-size:clamp(26px,6vw,44px);margin-bottom:6px}.over .head.win{color:#ff9a2e;animation:hop .5s steps(3) infinite}.over .head.lose{color:#5c6f91;animation:shake .4s steps(5) infinite}.over .head.mid{color:#1fa896}.over .obox{display:flex;flex-direction:column}.rows{min-height:60px;flex:1 1 auto;overflow:auto;padding:4px}.obtns{flex:none}.row{display:grid;grid-template-columns:28px 52px 1fr auto;align-items:center;gap:8px;padding:3px 8px;margin:5px 0;background:#f1ecfa;font-size:16px;text-align:left;animation:rowin .25s steps(4)}.row.you{outline:3px dashed var(--hot)}.row .av{position:relative;width:40px;margin-top:10px}.row .av canvas{width:100%;display:block}.row .deco{position:absolute;left:50%;top:-14px;width:26px;margin-left:-13px;z-index:2}.row .deco canvas{width:100%}.row .pl{font-size:22px;text-align:center}.row.win{background:var(--lemon);font-size:19px}.row.win .av{animation:hop .4s steps(3) infinite}.row.win .deco{animation:blink .4s steps(2) infinite}.row.mid .av{animation:nod 1s steps(2) infinite}.row.lose{background:#cdd6e6;font-size:21px;padding:9px 8px;animation:slamrow .5s steps(6);outline:4px solid var(--ink)}.row.lose .av{animation:wiggle .3s steps(4) infinite;filter:saturate(.5)}.row.lose .deco{animation:bob .8s steps(2) infinite;top:-16px}.tear{position:absolute;left:30%;top:48%;width:4px;height:6px;background:#5bc0f5;animation:tear .6s steps(5) infinite}.tear.t2{left:62%;animation-delay:-.3s}.drum{padding:14px;font-size:18px;animation:blink .3s steps(2) infinite}.note{font-size:13px;opacity:.8}.weather{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none}.weather i{position:absolute;top:-20px;width:10px;height:10px;animation:fallfx 2s linear infinite}.weather.lose i{width:3px;height:16px;background:#8fc7f0}.weather.lose{background:#3c466459}@keyframes bob{50%{transform:translateY(-4px)}}@keyframes hop{50%{transform:translateY(-6px)}}@keyframes nod{50%{transform:rotate(4deg)}}@keyframes blink{50%{opacity:.45}}@keyframes pulse{50%{opacity:.3}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes sway{0%,to{transform:translate(-50%) scale(.8) rotate(-2deg)}50%{transform:translate(-50%) scale(.8) rotate(2deg)}}@keyframes fall{to{transform:translate(-50%) scale(.8) rotate(-95deg);opacity:0}}@keyframes wiggle{25%{transform:translate(-4px) rotate(-5deg)}75%{transform:translate(4px) rotate(5deg)}}@keyframes thump{40%{transform:scale(1.18)}}@keyframes pop{0%{transform:translate(-50%,-100%) scale(0)}15%,80%{transform:translate(-50%,-100%) scale(1)}to{transform:translate(-50%,-160%) scale(0)}}@keyframes puff{to{transform:scale(2.6);opacity:0}}@keyframes burst{0%{transform:translate(-50%,-50%) scale(.2)}18%{transform:translate(-50%,-50%) scale(1.25)}30%,80%{transform:translate(-50%,-50%) scale(1);opacity:1}to{transform:translate(-50%,-80%) scale(1.1);opacity:0}}@keyframes slam{0%{transform:translateY(-80px)}}@keyframes swipe{0%{transform:translate(-90px)}60%{transform:translate(30px) rotate(20deg)}}@keyframes dash{0%{transform:translate(-120px) skew(-20deg)}}@keyframes drop{0%{transform:translateY(-60px) rotate(-30deg)}70%{transform:translateY(8px)}}@keyframes sweep{0%{transform:translate(60px,-60px) rotate(40deg)}50%{transform:translate(-30px,20px) rotate(-30deg)}}@keyframes flipy{50%{transform:scaleY(-1)}}@keyframes rise{0%{transform:translateY(70px) scale(.4)}}@keyframes stamp{0%{transform:scale(3.5);opacity:.2}}@keyframes toast{0%{transform:translate(-50%) scale(0)}10%,85%{transform:translate(-50%) scale(1);opacity:1}to{transform:translate(-50%) scale(1);opacity:0}}@keyframes shake{20%{transform:translate(-5px,2px)}40%{transform:translate(5px,-2px)}60%{transform:translate(-3px,-2px)}80%{transform:translate(3px,2px)}}@keyframes shakebig{10%{transform:translate(-12px,6px)}30%{transform:translate(12px,-8px)}50%{transform:translate(-10px,-6px)}70%{transform:translate(10px,8px)}90%{transform:translate(-4px,2px)}}@keyframes dealin{0%{transform:translateY(60px);opacity:0}}@keyframes nope{0%{transform:translateY(var(--y, 0)) rotate(var(--rot, 0deg))}35%{transform:translateY(-110px) rotate(12deg)}55%{transform:translateY(-90px) rotate(-14deg)}to{transform:translateY(var(--y, 0)) rotate(var(--rot, 0deg))}}@keyframes shrink{to{transform:scaleX(0)}}@keyframes rowin{0%{transform:translate(-40px);opacity:0}}@keyframes slamrow{0%{transform:scale(3);opacity:0}60%{transform:scale(.92)}}@keyframes tear{to{transform:translateY(22px);opacity:0}}@keyframes fallfx{to{transform:translateY(110vh) rotate(360deg)}}@media (max-height: 520px){:root{--cw: clamp(34px, 5.4vw, 56px);--av: clamp(40px, 7vw, 76px)}}:root{--ink: #2a1b3d;--paper: #fff1d6;--pink: #ff7a6b;--hot: #ff4f79;--lemon: #ffd166;--lilac: #8f6bd6}html,body,.game,.landing{background:#2a1b3d}canvas.scene{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;image-rendering:pixelated;image-rendering:crisp-edges;pointer-events:none}.scene-bg{z-index:0}.scene-table{z-index:2}.scene-leaves{z-index:3}.table{background:none;border:0;box-shadow:none;border-radius:0}.landing>:not(canvas):not(.floaters){position:relative;z-index:4}.floaters{z-index:3}.title{color:var(--paper)}.sub{color:var(--paper);text-shadow:2px 2px 0 var(--ink),-2px 2px 0 var(--ink),2px -2px 0 var(--ink),-2px -2px 0 var(--ink)}.btn{border-bottom-color:#e0c49c}.btn.go{background:#7ee0b8;border-bottom-color:#3fae8a}.btn.big{background:var(--hot);border-bottom-color:#b8325a}.card.s-H,.s-H{color:#e63e62}.card.s-D,.s-D{color:#f08a24}.card.s-C,.s-C{color:#1f9e89}.card.s-S,.s-S{color:#2a1b3d}.hand .card.sel{background:#fffaf0}.card.joker{background:linear-gradient(135deg,#ffb38a,#ffd166 50%,#ff7a9c);color:#5a2a82}.card.back{background:repeating-conic-gradient(#3d2b6b 0,#3d2b6b 25%,#55388a 0,#55388a 50%) 0 0 / 10px 10px;border:4px solid #ffb38a}.chip.lock{background:var(--lemon)}.chip.jack{background:#8fd9e8}.chip.rev.on,.chip.revo{background:#ff9ecd}.dlabel{color:var(--paper)}.discard .side{background:repeating-linear-gradient(#fff1d6 0,#fff1d6 2px,#b48ad0 2px,#b48ad0 3px)}.overlay{background:#2a1b3db3}.row{background:#f3e2c7}.row.lose{background:#b9a9c9}.game[data-left="3"]:after{box-shadow:inset 0 0 90px 10px #ff6e5a59}.opp .av{animation:breathe 2.4s steps(3) infinite}.opp:nth-child(2n) .av{animation-delay:-.8s}.opp:nth-child(3n) .av{animation-delay:-1.6s}.opp.active .av{animation:bob .5s steps(2) infinite}.opp.out .av{animation:none}.items .item{animation:bobc 2.6s steps(2) infinite}.items .item:nth-child(3n){animation-delay:-.9s}.items .item:nth-child(3n+1){animation-delay:-1.7s}.floaters .peek{animation:bob 1.6s steps(3) infinite}.shown{z-index:1;animation:none}.shown .card.back{border-width:2px;background-size:6px 6px}.cat{position:absolute;left:13%;bottom:calc(var(--ch) + 150px);width:clamp(84px,13vw,156px);z-index:3;pointer-events:none}.cat:before{content:"";position:absolute;left:6%;right:10%;bottom:-3px;height:6px;background:#2a1b3d59}.cat canvas{position:relative;width:100%;height:auto;display:none}.cat .zz{display:none;position:absolute;right:8%;top:-30%;font-style:normal;color:var(--paper);font-size:clamp(12px,2vw,20px);text-shadow:2px 2px 0 var(--ink);animation:zz 1.8s steps(6) infinite}.cat.asleep .zz{display:block}.cat.startle{animation:startle .4s steps(4)}@keyframes breathe{50%{transform:translateY(-2px)}}@keyframes bobc{50%{transform:translate(-50%) translateY(-3px)}}@keyframes zz{0%{transform:translate(0) scale(.6);opacity:0}30%{opacity:1}to{transform:translate(10px,-22px) scale(1.2);opacity:0}}@keyframes startle{40%{transform:translateY(-16px)}}.discard{left:85%;top:64%}:root{--px: 3px;--cw: calc(var(--px) * 26);--ch: calc(var(--px) * 36);--av: calc(var(--px) * 34)}canvas.spr{display:block;image-rendering:pixelated;image-rendering:crisp-edges}.card,.card.back{width:calc(var(--px) * 26);height:calc(var(--px) * 36);background:none;border:0;box-shadow:none;font-size:0;filter:drop-shadow(var(--px) var(--px) 0 rgba(42,27,61,.38))}.card.mini{width:calc(var(--px) * 9);height:calc(var(--px) * 13);filter:drop-shadow(0 var(--px) 0 rgba(42,27,61,.35))}.hand{height:calc(var(--px) * 36 + 40px)}.hand .card{transform:translateY(var(--y, 0));transform-origin:50% 50%}.hand .card.sel{background:none;transform:translateY(calc(var(--y, 0px) - var(--px) * 8))}.pplay{position:absolute;display:flex;transform:none}.pplay .card+.card{margin-left:calc(var(--px) * -12)}.picker .backs{gap:calc(var(--px) * 3)}.discard .stack{transform:translate(-50%)}.discard .side{width:calc(var(--px) * 26);height:calc(var(--px) * var(--hn, 0));background:repeating-linear-gradient(#fff1d6 0 var(--px),#b48ad0 var(--px) calc(var(--px) * 2));box-shadow:none;border-left:var(--px) solid var(--ink);border-right:var(--px) solid var(--ink);border-bottom:var(--px) solid var(--ink);box-sizing:border-box}.discard.tall .stack{animation:sway2 1.4s steps(6) infinite}.discard .stack.wobble{animation:sway2 .16s steps(3) infinite}.discard .stack.fall{animation:fall2 .5s steps(6) forwards}.discard .stack{transform-origin:bottom center}.opp{display:block;width:calc(var(--px) * 34);margin-left:0;transform:none}.opp .av{position:relative;width:calc(var(--px) * 34);height:calc(var(--px) * 40);animation:breathe2 2.6s steps(2) infinite}.opp .av canvas,.cat canvas{display:none;position:absolute;left:0;top:0}.opp .av canvas.on,.cat canvas.on{display:block}.opp.active .av{animation:bob2 .5s steps(2) infinite}.opp .tag{position:absolute;left:50%;bottom:calc(100% + var(--px));transform:translate(-50%);margin:0;min-width:0;gap:calc(var(--px) * 2)}.opp .ct{gap:var(--px)}.opp .bubble{top:calc(var(--px) * -12)}.opp .badge{top:20%;right:calc(var(--px) * -2)}.picking .opp .av{outline:var(--px) dashed var(--hot);outline-offset:0}.hands,.items .item,.shown{position:absolute;transform:none}.hands{z-index:3}.items .item,.items .mine{animation:bob2 2.8s steps(2) infinite;bottom:auto;filter:drop-shadow(var(--px) var(--px) 0 rgba(42,27,61,.32))}.items .item-chopsticks{animation:none}.shown{display:flex}.floaters .peek{bottom:calc(var(--px) * -10);animation:bob2 1.6s steps(2) infinite}.cat{width:calc(var(--px) * 42);height:calc(var(--px) * 26);bottom:auto;transition:left .9s steps(9),top .9s steps(9);filter:drop-shadow(0 var(--px) 0 rgba(42,27,61,.3))}.cat:before{display:none}.cat.flip canvas{transform:scaleX(-1)}.cat .zz{right:0;top:calc(var(--px) * -4)}.btn,.obox,.panel,.chip,.tag,.bubble,.prompt,.toast,.row{background:none!important;box-shadow:none!important;border:calc(var(--px) * 3) solid transparent;border-image:var(--frame-paper) 3 fill / calc(var(--px) * 3) stretch;image-rendering:pixelated}.btn{padding:3px 12px;margin:3px}.btn.sm{padding:0 6px}.btn.big{padding:6px 22px;color:#fff;border-image-source:var(--frame-hot)}.btn:hover{filter:brightness(1.07)}.btn:active{border-bottom-width:calc(var(--px) * 3);transform:translateY(var(--px))}.btn.go,.bubble.good{border-image-source:var(--frame-go)}.prompt.me,.toast,.chip.lock,.opp.active .tag,.row.win{border-image-source:var(--frame-gold)}.prompt.alert,.chip.rev.on,.chip.revo,.chip.exposedme,.bubble.bad,.opp.exposed .tag{border-image-source:var(--frame-rose)}.chip.spade,.row.lose{border-image-source:var(--frame-dark);color:var(--paper)}.chip,.tag,.bubble,.prompt{border-width:calc(var(--px) * 2);border-image-width:calc(var(--px) * 3);padding:0 calc(var(--px) * 2)}.chip{display:flex;align-items:center;gap:calc(var(--px) * 2)}.obox{padding:8px 10px}.panel{padding:8px 12px}.row{padding:0 6px;margin:4px 0;grid-template-columns:28px auto 1fr auto}.row.lose{padding:4px 6px;outline:0}.row.you{outline:var(--px) dashed var(--hot);outline-offset:calc(var(--px) * -1)}.row .av{width:calc(var(--px) * 34);height:calc(var(--px) * 25);overflow:hidden;margin-top:0}.row .deco{width:auto;left:50%;margin-left:0;top:0;transform:translate(-50%)}.row.win .deco{top:calc(var(--px) * -1)}.tear{display:none}@keyframes breathe2{50%{transform:translateY(calc(var(--px) * -1))}}@keyframes bob2{50%{transform:translateY(calc(var(--px) * -1))}}@keyframes sway2{0%,to{transform:translate(-50%) rotate(-2deg)}50%{transform:translate(-50%) rotate(2deg)}}@keyframes fall2{to{transform:translate(-50%) rotate(-95deg);opacity:0}}.row .av{overflow:visible}.row .av>canvas.spr{clip-path:inset(0 0 calc(var(--px) * 15) 0)}.row .deco,.row.win .deco{top:calc(var(--px) * -7);z-index:3}.row.win,.row.lose{margin-top:calc(var(--px) * 4)}.floaters .peek{bottom:calc(var(--px) * -4)}.hrow{align-items:center}.rows{padding-top:calc(var(--px) * 8)}.status{left:50%;right:auto;top:calc(50% + var(--px) * 27);transform:translate(-50%);justify-content:center;width:max-content;max-width:94vw}.hand.active:before{display:none}.row .av{height:calc(var(--px) * 29)}.row .av>canvas.spr{clip-path:inset(0 0 calc(var(--px) * 11) 0)}.status{max-width:min(94vw,calc(var(--px) * 150))}.row .av{height:calc(var(--px) * 26)}.row .av>canvas.spr{clip-path:inset(0 0 calc(var(--px) * 14) 0)}.card.joker{background:none}.card.joker canvas{animation:holohue 3.2s steps(10) infinite}.card.joker:after{content:"";position:absolute;inset:var(--px);pointer-events:none;background:linear-gradient(115deg,transparent 0 34%,rgba(255,255,255,.85) 44%,rgba(255,255,255,.2) 50%,transparent 60%);background-size:320% 100%;mix-blend-mode:overlay;animation:holo 2.6s steps(16) infinite}@keyframes holo{0%{background-position:130% 0}to{background-position:-50% 0}}@keyframes holohue{50%{filter:hue-rotate(35deg) saturate(1.25) brightness(1.05)}}.status{left:50%;right:auto;top:8px;transform:translate(-50%);justify-content:center;width:max-content;max-width:min(94vw,calc(100vw - 460px))}.chip.rev.on,.chip.revo,.chip.exposedme{animation:none}@media (max-width: 760px){.status{top:calc(var(--px) * 22);max-width:94vw}}.card.txt{background:var(--paper);box-sizing:border-box;border:var(--px) solid var(--ink);font-size:calc(var(--px) * 13);line-height:1;font-weight:700}.card.txt .r{position:absolute;left:calc(var(--px) * 2);top:calc(var(--px) * 1);letter-spacing:calc(var(--px) * -1)}.card.txt .u{position:absolute;left:calc(var(--px) * 2);top:calc(var(--px) * 14);font-size:calc(var(--px) * 9)}.card.txt .big{position:absolute;right:calc(var(--px) * 1);bottom:calc(var(--px) * 1);font-size:calc(var(--px) * 20)}.card.txt.s-H{color:#d81e4a}.card.txt.s-D{color:#e06a00}.card.txt.s-C{color:#0f8a76}.card.txt.s-S{color:#2a1b3d}.hand .card.txt.sel{background:#fffaf0}.rows{padding-top:calc(var(--px) * 15)}.row.win .deco{top:calc(var(--px) * -15)}.row.lose .deco{top:calc(var(--px) * -12)}.row.lose{margin-top:calc(var(--px) * 11)}.row.win .deco,.row.lose .deco{animation:none}.game[data-left]:after{display:none}.chip{height:calc(var(--px) * 9);box-sizing:content-box;line-height:1;white-space:nowrap}.chip canvas{flex:none}.chip small{display:inline;margin-left:6px}.card.txt .big{left:0;right:0;bottom:calc(var(--px) * 1);text-align:center;font-size:calc(var(--px) * 19);line-height:1;font-weight:400}.card.txt .r{font-size:calc(var(--px) * 14);top:0}.row{margin:2px 0}.row .av{height:calc(var(--px) * 22)}.row .av>canvas.spr{clip-path:inset(0 0 calc(var(--px) * 18) 0)}.chip .suit{font-size:calc(var(--px) * 9);line-height:1;font-weight:700}.chip .suit.s-H{color:#d81e4a}.chip .suit.s-D{color:#e06a00}.chip .suit.s-C{color:#0f8a76}.chip .suit.s-S{color:#2a1b3d}.row.lose .deco{position:absolute}.drop{position:absolute;top:calc(var(--px) * 16);left:calc(var(--px) * (5 + var(--i) * 4));width:var(--px);height:calc(var(--px) * 2);background:#5cc8d6;animation:raindrop .7s steps(6) infinite;animation-delay:calc(var(--i) * -.27s)}@keyframes raindrop{0%{transform:translateY(0);opacity:1}80%{opacity:1}to{transform:translateY(calc(var(--px) * 11));opacity:0}}.picker .backs .card.chosen{transform:translateY(calc(var(--px) * -6));animation:none;filter:brightness(1.15) drop-shadow(var(--px) var(--px) 0 rgba(42,27,61,.38))}:root{--sal: env(safe-area-inset-left, 0px);--sar: env(safe-area-inset-right, 0px);--sat: env(safe-area-inset-top, 0px);--sab: env(safe-area-inset-bottom, 0px)}.game{touch-action:manipulation;overscroll-behavior:none}.stage{position:absolute;left:50%;top:50%;width:1281px;height:720px;transform-origin:center center;--px: 3px;--cw: calc(var(--px) * 26);--ch: calc(var(--px) * 36);--av: calc(var(--px) * 34)}.stage .fx{position:absolute;top:0;right:0;bottom:0;left:0}.stage .card.flying,.stage .burst,.stage .puff,.stage .toast{position:absolute}.stage .opp .tag{font-size:14px}.stage .opp .badge{font-size:20px}.stage .bubble{font-size:18px}.stage .mebubble{font-size:26px}.stage .prompt{font-size:20px}.stage .chip{font-size:15px}.stage .btn{font-size:20px}.stage .btn.sm{font-size:14px}.stage .burst .lb{font-size:44px}.stage .burst .jp{font-size:20px}.stage .toast{font-size:30px}.stage .cat .zz{font-size:20px}.stage .status{top:8px;max-width:700px;transform:translate(-50%) scale(var(--uk, 1));transform-origin:top center}.stage .topbar{transform:scale(var(--uk, 1));transform-origin:top right}.stage .controls{transform:scale(var(--uk, 1));transform-origin:bottom center}.stage .prompt{bottom:calc(var(--ch) + 46px + 54px * var(--uk, 1));transform:translate(-50%) scale(var(--uk, 1));transform-origin:bottom center}.stage .prompt.alert{animation:hopc .5s steps(2) infinite}.stage .opp .tag{transform:translate(-50%) scale(var(--uk, 1));transform-origin:bottom center}@keyframes hopc{0%,to{transform:translate(-50%) scale(var(--uk, 1))}50%{transform:translate(-50%) translateY(-6px) scale(var(--uk, 1))}}@media (pointer: coarse){.btn{position:relative}.btn:after{content:"";position:absolute;top:-14px;right:-14px;bottom:-14px;left:-14px}}.preview{position:fixed;z-index:70;pointer-events:none}.rotate{display:none;position:absolute;top:0;right:0;bottom:0;left:0;z-index:80;background:#2a1b3df0;color:var(--paper);align-items:center;justify-content:center;flex-direction:column;gap:18px;text-align:center;font-size:20px}.rotate small{font-size:14px}.rotate .phone{width:40px;height:68px;border:6px solid var(--paper);border-radius:6px;background:#5cc8d6;animation:turnphone 2s steps(6) infinite}.rotate .dogs{display:flex;gap:6px}.rotate .dogs canvas{animation:tilt 2s steps(2) infinite}.rotate .dogs canvas:nth-child(2){animation-delay:-.6s}@media (orientation: portrait) and (pointer: coarse){.game .rotate{display:flex}}@keyframes turnphone{0%,25%{transform:rotate(0)}60%,to{transform:rotate(-90deg)}}@keyframes tilt{50%{transform:rotate(16deg)}}.stage{top:auto;bottom:var(--sab);transform-origin:bottom center}.stage .hand .card{top:22px}.stage .status{top:4px}.stage .opp .tag{transform:translate(-50%) scale(var(--tk, 1))}.stage{height:750px}.stage .opp .tag{transform:translate(-50%) scale(var(--uk, 1))}.stage .prompt{bottom:calc(var(--ch) + 46px + 64px * var(--uk, 1))}@media (max-height: 520px){.landing{display:grid;grid-template-columns:auto auto;grid-template-areas:"title panel" "sub panel";align-content:center;justify-content:center;column-gap:34px;row-gap:0;padding:8px}.landing .title{grid-area:title;align-self:end;font-size:clamp(26px,12vh,52px)}.landing .sub{grid-area:sub;align-self:start;font-size:clamp(14px,5.5vh,22px);margin:8px 0 0;letter-spacing:2px}.landing .panel{grid-area:panel;padding:4px 10px;gap:2px}.landing .field{font-size:14px}.landing .btn{font-size:14px;padding:1px 10px;margin:2px}.landing .btn.big{font-size:18px;padding:3px 18px}.landing select{font-size:14px;padding:2px}.landing .stepper .num{font-size:18px}}@media (max-height: 520px){.over .obox{width:min(96vw,760px);padding:4px 8px;max-height:96vh}.over .head{font-size:22px;margin:0}.over .head small{display:inline;margin-left:10px}.over .rows{display:grid;grid-template-columns:1fr 1fr;column-gap:8px;padding-top:calc(var(--px) * 13)}.over .row{font-size:14px;margin:1px 0}.over .row.lose,.over .drum{grid-column:1 / -1}.over .row.lose{font-size:17px;padding:1px 6px;margin-top:calc(var(--px) * 9)}.over .row.win{font-size:15px}.over .obtns .btn{font-size:14px;padding:0 10px}.help .obox{max-height:96vh}}.game>.topbar{position:absolute;right:calc(6px + var(--sar));top:calc(6px + var(--sat));z-index:45}.game>.status{position:absolute;left:50%;right:auto;top:calc(6px + var(--sat));transform:translate(-50%);justify-content:center;width:max-content;max-width:calc(100vw - 2 * (190px + var(--sar)));z-index:44}.game>.status .chip{font-size:15px}.game>.topbar .btn.sm{font-size:14px}.landcat{display:none;left:-300px;top:auto;bottom:calc(var(--px) * 36);transition:none;z-index:0}.floaters .peek{z-index:1}.floaters .peek{left:calc(12% + var(--i) * 19%)}@media (max-aspect-ratio: 20/23){.landing{justify-content:flex-start;padding-top:max(18px,4.5vh)}.landing .title{font-size:clamp(34px,13vw,84px)}.landing .sub{font-size:clamp(18px,6vw,36px);margin:8px 0 0}.landing .panel{margin-top:auto;margin-bottom:calc(var(--px) * 38)}.floaters .peek{left:calc(4% + var(--i) * 24.5%)}.floaters .peek:nth-of-type(n+5){display:none}}.game>.status{flex-wrap:nowrap;max-width:none}.chip .short{display:none}.status.compact .chip{font-size:12px}.status.compact .chip .full{display:none}.status.compact .chip .short{display:inline}.status.compact .chip .short:empty{display:none}.game>.status.compact .chip{font-size:12px}@media (max-height: 520px){.landing .title{justify-self:center}.landing .sub{justify-self:stretch;letter-spacing:0;text-align:justify;text-align-last:justify;text-justify:inter-character}}.sub{text-shadow:-2px -2px var(--ink),-1px -2px var(--ink),0px -2px var(--ink),1px -2px var(--ink),2px -2px var(--ink),-2px -1px var(--ink),-1px -1px var(--ink),0px -1px var(--ink),1px -1px var(--ink),2px -1px var(--ink),-2px 0px var(--ink),-1px 0px var(--ink),1px 0px var(--ink),2px 0px var(--ink),-2px 1px var(--ink),-1px 1px var(--ink),0px 1px var(--ink),1px 1px var(--ink),2px 1px var(--ink),-2px 2px var(--ink),-1px 2px var(--ink),0px 2px var(--ink),1px 2px var(--ink),2px 2px var(--ink)}@media (max-height: 520px){.landing .title{font-size:48px}.landing .sub{font-size:24px}}@media (max-height: 359px){.landing .title{font-size:32px}.landing .sub{font-size:16px}}.b-joker{--c: #ff4f79}.b-joker .rays{background:repeating-conic-gradient(#ff8fb1 0,#ff8fb1 10deg,#fff3a8 0,#fff3a8 20deg,#9be7f5 0,#9be7f5 30deg,#c4b5ff 0,#c4b5ff 40deg);opacity:.9;width:320px;height:320px;margin:-160px}.b-joker .ic{--px: 6px;display:inline-block;animation:jokerflip .5s steps(10)}.b-joker .ic canvas{filter:drop-shadow(6px 6px 0 var(--ink))}.spark{position:absolute;left:50%;top:40%;width:6px;height:6px;margin:-3px;background:#fff;box-shadow:6px 0 #fff3a8,-6px 0 #fff3a8,0 6px #fff3a8,0 -6px #fff3a8;animation:sparkfly .6s steps(8) both;pointer-events:none}.spark:nth-child(3n){box-shadow:6px 0 #ff9eb5,-6px 0 #ff9eb5,0 6px #ff9eb5,0 -6px #ff9eb5}.spark:nth-child(3n+1){box-shadow:6px 0 #9be7f5,-6px 0 #9be7f5,0 6px #9be7f5,0 -6px #9be7f5}.jspark{position:absolute;width:0;height:0;pointer-events:none}.jspark .spark{left:0;top:0}@keyframes jokerflip{0%{transform:scale(.3) rotateY(180deg)}55%{transform:scale(1.15) rotateY(0)}to{transform:scale(1) rotateY(0)}}@keyframes sparkfly{0%{transform:translate(0) scale(.4);opacity:1}70%{opacity:1}to{transform:translate(var(--dx),var(--dy)) scale(1.1);opacity:0}}@keyframes holohue{50%{filter:hue-rotate(12deg) saturate(1.15) brightness(1.06)}}
