@import "https://fonts.googleapis.com/css2?family=VT323&display=swap";body{--font-size:32px;--font-family:"VT323", sans-serif;font-family:var(--font-family);font-size:var(--font-size);--black:#000;--green:#0e402d;--white:#f4f7f5;--red:#a63d40;--red-darker:#69181a;--card-offset-x:0px;--card-offset-y:0px;--card-hand-to-center-offset:0px 0px;--card-center-to-hand-offset:0px 0px;--card-deal-to-hand-delay:0s;--card-rotation-z:0deg;--card-face-image:url(/images/front.bmp);margin:0;padding:0}.fullscreen{color:var(--white);background-color:var(--green);touch-action:manipulation;position:fixed;inset:0}.app{flex-direction:column;max-width:1000px;height:100%;max-height:1500px;margin:0 auto;display:flex;overflow-x:visible}.modal{background:var(--green);border:2px solid var(--black);text-align:center;z-index:10000;width:max-content;max-width:33vw;max-height:90vh;box-shadow:10px 10px var(--black);padding:32px;position:absolute;top:50%;left:50%;overflow-y:scroll;transform:translate(-50%,-50%)}@media (width<=1050px){.modal{max-width:66vw}}@media (width<=860px){.modal{max-width:90vw;padding:8px}}header{box-sizing:border-box;flex-direction:row;justify-content:space-between;align-items:center;height:80px;padding:8px 32px;display:flex}.author,.author>a{font-size:calc(var(--font-size) * .6);color:var(--white);display:inline-block}h1{margin:0;font-size:48px}ul{text-align:left;list-style:square}a{cursor:pointer;text-decoration:underline}.non-game-container{text-align:center;box-sizing:border-box;width:100%;max-width:500px;margin:0 auto;padding:32px}.join-game{flex-direction:column;display:flex}.how-to-play{font-size:calc(var(--font-size) * .8)}input{background-color:var(--white);font-family:var(--font-family);font-size:var(--font-size);margin-top:8px;padding:8px}button{color:var(--black);background-color:var(--white);border:2px solid var(--red);font-family:var(--font-family);font-size:var(--font-size);cursor:pointer;width:100%;margin-top:8px;margin-bottom:8px;padding:8px}.game{flex-grow:1;grid-template:"opponent-deck event-log event-log"1fr".center-deck."1fr". .your-deck"1fr/1fr 1fr 1fr;min-height:410px;padding:16px;display:grid;overflow:visible hidden}.opponent-deck{grid-area:opponent-deck;position:relative}.event-log{flex-direction:column-reverse;grid-area:event-log;height:4lh;margin-top:auto;padding:24px 64px;font-size:20px;display:flex}@media (height<=950px){.event-log{padding:0}}.event{color:var(--white);opacity:0;animation:15s fadeOutWithDelay}@keyframes fadeOutWithDelay{0%{opacity:1}50%{opacity:1}to{opacity:0}}.center-top-card{backface-visibility:hidden;z-index:1000;animation:.4s ease-out dealCard}.center-top-card-back-face{z-index:999;animation:.4s dealCard;transform:rotateY(-180deg)}.card-in-hand{animation:.4s dealCardToHand;animation-delay:var(--card-deal-to-hand-delay);animation-fill-mode:both}@keyframes wiggle{0%{translate:0}25%{translate:-6px 5px}50%{translate:10px -2px}75%{translate:-6px 1px}to{translate:0}}@keyframes wiggleAlt{0%{translate:0}25%{translate:6px 2px}50%{translate:-8px -2px}75%{translate:10px 1px}to{translate:0}}@keyframes dealCardToHand{0%{translate:var(--card-center-to-hand-offset)}to{}}@keyframes dealCard{0%{translate:var(--card-hand-to-center-offset);rotate:y -180deg}to{}}@keyframes dealCardBackFace{0%{translate:var(--card-hand-to-center-offset);rotate:y -360deg}to{}}.wiggle{animation:.2s wiggle}.wiggle-alt{animation:.2s wiggleAlt}.center-deck{grid-area:center-deck;position:relative}.your-deck{grid-area:your-deck;position:relative}.card{aspect-ratio:63/88;box-sizing:border-box;height:352px;translate:calc(-50% + var(--card-offset-x)) calc(-50% + var(--card-offset-y));rotate:y 0 z var(--card-rotation-z);background-color:#0000;position:absolute;top:50%;left:50%}.card-back{image-rendering:pixelated;background-image:url(/snap/images/back.png);background-size:cover;box-shadow:0 0 15px #00000008}.card-front{image-rendering:pixelated;background-size:cover;background-image:var(--card-face-image);box-shadow:0 0 15px #00000026}.card-face{font-size:48px;top:25%;left:25%;transform:translate(25%,25%)}.card-ghost{box-shadow:none;border:none}.will-change{will-change:rotate}.game-end-notification{border:2px solid var(--black);background-color:var(--white);text-align:center;margin:24px}button.play-again{border:2px solid var(--red-darker);background-color:var(--white);font-size:var(--font-size);font-family:var(--font-family);text-align:center}@media (height<=850px) and (width>=860px){.game{grid-template-rows:4lh 1fr 4lh;grid-template-areas:"opponent-deck center-deck event-log""opponent-deck center-deck your-deck"".center-deck your-deck"}}@media (width<=860px){.game{grid-template-rows:4lh 1fr 1fr 1fr;grid-template-areas:"event-log event-log event-log""opponent-deck opponent-deck.""center-deck center-deck center-deck"".your-deck your-deck"}.card{height:176px}}@media (width<=860px) and (height<=850px){.body{font-size:22px}.game{grid-template:"event-log opponent-deck"4lh"center-deck opponent-deck"1fr"center-deck your-deck"1fr"center-deck your-deck"4lh/1fr 1fr}}
