.game-menu{position:absolute;width:100%;top:var(--nav-height);left:0;height:0;overflow-y:scroll;z-index:9999;background-color:var(--color-background);transition:height var(--menu-animation-time),background-color var(--background-transition-time)}.menu-active .game-menu{height:calc(100vh - var(--nav-height))}.game-menu-content{max-width:860px;margin:0 auto;padding:40px 20px}.game-menu-block{margin-bottom:40px}.game-menu-title{font-size:28px;margin-bottom:20px;padding-bottom:5px;border-bottom:1px solid}.game-stats{display:flex;justify-content:space-evenly;flex-wrap:wrap;gap:20px;font-size:24px}.game-stats span{font-weight:700}.game-settings{display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap;gap:20px}.game-settings button{padding:12px;border:2px solid var(--card-color-grey);border-radius:8px;background-color:var(--color-black);font-size:18px;text-align:center;cursor:pointer}.game-settings .right-button{min-width:143px}.game-history-list li{display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap;gap:20px;padding:10px;margin:4px 0;background-color:#595959}.game-history-list li.game-history-current{background-color:#252525}.game-history-number{font-size:24px}.game-history-button{display:block;padding:5px 10px;border:2px solid var(--card-color-grey);border-radius:8px;background-color:var(--color-black);text-align:center;font-size:18px;cursor:pointer}.game-history-won{color:var(--win-color);font-weight:700}.game-history-time{flex-grow:1;text-align:right;font-size:20px}@media(max-width:850px){.game-menu-content{padding:20px 10px}.game-stats{justify-content:flex-start}}@media(max-width:500px){.game-history-number{font-size:18px}.game-history-button{padding:5px;font-size:14px}.game-history-time{font-size:16px}}.game-nav{width:100%;height:var(--nav-height);border-bottom:1px solid}.game-nav.menu-active{position:relative;z-index:9999}.game-nav-content{display:flex;justify-content:space-between;align-items:center;max-width:var(--nav-width);height:100%;margin:0 auto}.game-nav-section{display:flex;gap:20px;align-items:center}.nav-button{display:flex;justify-content:center;align-items:center;height:40px;padding:0 12px;border:2px solid var(--card-color-grey);border-radius:8px;background-color:var(--color-black);font-size:18px;text-align:center;cursor:pointer}.nav-button .undo-button{font-size:30px;transform:rotate(-70deg)}.nav-winner{color:var(--win-color);font-weight:700}.nav-count{font-weight:700}.menu-button{flex-direction:column;gap:6px}.menu-button span{display:block;width:30px;height:2px;background-color:var(--color-text);border-radius:4px;transition:all var(--menu-animation-time)}.nav-fade{visibility:visible;opacity:1;transition:opacity var(--menu-animation-time)}.menu-active .menu-button span:nth-child(1){transform:translateY(8px) rotate(45deg)}.menu-active .menu-button span:nth-child(2){opacity:0}.menu-active .menu-button span:nth-child(3){transform:translateY(-8px) rotate(135deg)}.menu-active .nav-fade{visibility:hidden;opacity:0;transition:opacity var(--menu-animation-time),visibility 0s var(--menu-animation-time);pointer-events:none}@media(max-width:850px){.game-nav-content{padding:0 10px}.nav-button{padding:0 8px;font-size:14px}.nav-winner,.nav-count{font-size:14px}}.card{position:relative;width:var(--card-width);height:var(--card-height);z-index:9;line-height:1;cursor:pointer;backface-visibility:hidden;transform-style:preserve-3d;--to-waste-start: calc(-1 * var(--card-width) - 10px);--to-stock-start: calc(var(--card-width) + 10px)}.card .card-back,.card .card-front{position:absolute;width:100%;height:100%;border-radius:var(--card-radius);box-shadow:0 0 3px 1px #414141;overflow:hidden}.card .card-back{background-color:var(--card-back-color-blue);background-image:radial-gradient(var(--card-back-color-purple1) 30%,transparent 30%),radial-gradient(var(--card-back-color-purple2) 20%,transparent 20%);background-position:5px 10px,20px 25px;background-size:30px 30px}.card .card-front{display:flex;flex-direction:column;justify-content:space-between;align-items:center;background-color:var(--card-color-grey);-webkit-user-select:none;user-select:none}.card .card-front .value{display:block;width:100%;padding:5px;font-size:22px;font-weight:700}.card .card-front .value:last-child{text-align:right}.card .card-front .suit{font-size:60px}.card .card-front.red{color:var(--card-color-red)}.card .card-front.black{color:var(--card-color-black)}.card.show-front .card-back,.card.show-back .card-front{display:none}.card.show-animation,.card.show-animation .card-front{transform:rotateY(180deg)}.card.show-animation .card-back{box-shadow:none}.card.shake{animation:shake .3s ease-in-out}.card.flip{animation:flip .3s forwards}.card.move,.card.deal,.card.deal-flip{--move-start-x: 0;--move-start-y: 0;z-index:99}.card.move{animation:move .5s forwards}.card.deal,.card.deal-flip{animation:deal .8s forwards}.card.deal-flip{animation-name:deal-flip}.card.to-waste,.card.to-stock{animation:to-waste .4s forwards;z-index:11}.card.to-stock{animation-name:to-stock}.right-handed .card{--to-waste-start: calc(var(--card-width) + 10px);--to-stock-start: calc(-1 * var(--card-width) - 10px)}@keyframes shake{0%,to{transform:translate(0) rotate(0) rotateY(180deg)}20%{transform:translate(6px) rotate(6deg) rotateY(180deg)}40%{transform:translate(-6px) rotate(-6deg) rotateY(180deg)}60%{transform:translate(4px) rotate(4deg) rotateY(180deg)}80%{transform:translate(-4px) rotate(-4deg) rotateY(180deg)}90%{transform:translate(2px) rotate(2deg) rotateY(180deg)}to{transform:translate(-2px) rotate(-1deg) rotateY(180deg)}}@keyframes flip{0%{transform:rotateY(0)}to{transform:rotateY(180deg)}}@keyframes move{0%{transform:translate(var(--move-start-x),var(--move-start-y)) rotateY(180deg)}to{transform:translate(0) rotateY(180deg)}}@keyframes deal{0%{transform:translate(var(--move-start-x),var(--move-start-y))}80%{transform:translate(0)}to{transform:translate(0)}}@keyframes deal-flip{0%{transform:translate(var(--move-start-x),var(--move-start-y)) rotateY(0)}80%{transform:translate(0) rotateY(0)}to{transform:translate(0) rotateY(180deg)}}@keyframes to-waste{0%{transform:translate(var(--to-waste-start)) rotateY(0)}50%{transform:translate(0) rotateY(0)}to{transform:translate(0) rotateY(180deg)}}@keyframes to-stock{0%{transform:translate(var(--to-stock-start)) rotateY(180deg)}50%{transform:translate(var(--to-stock-start)) rotateY(0)}to{transform:translate(0) rotateY(0)}}@media(max-width:760px){.card .card-front .value:last-child{display:none}}@media(max-width:620px){.card .card-back{background-position:10px 17px,0px 7px;background-size:20px 20px}.card .card-front .value{padding:3px 0 0;font-size:16px}.card .card-front .value:first-child{text-align:center}.card .card-front .value:last-child{display:none}.card .card-front .suit{font-size:34px}}.card-pile li{position:relative}.card-pile li:last-child{height:100%;width:100%}.pile-flip3 .card-pile{display:flex}.pile-flip3 li,.pile-flip3 li:last-child{width:calc(var(--card-width) / 2)}.drag-pile{position:absolute}.win-animation{position:absolute;top:0;left:0}.animation-card{position:absolute;top:0;left:0;transform-origin:top left}.game-board{flex:1;padding:30px 10px;overflow:hidden;touch-action:none}.board-row{display:flex;justify-content:space-between;align-items:flex-start;max-width:var(--board-row-max-width);width:100%;margin:0 auto 30px}.card-position{position:relative;width:var(--card-width);height:var(--card-height);border-radius:6px;background-color:var(--pile-color);border-radius:var(--card-radius);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.card-position-stock{cursor:pointer}.card-position-waste{display:flex}.card-position-spacer{position:initial;background-color:initial}.card-position-tableau li{height:35px}.card-position-single li{height:0px;pointer-events:none}.card-position-single li:last-child{pointer-events:initial}@media(max-height:1200px){.condense.card-position-tableau li{height:25px}}@media(max-width:500px)and (max-height:700px){.condense.card-position-tableau li{height:22px}}.right-handed .card-position-spacer{order:5}.right-handed .card-position-waste{order:6}.right-handed .card-position-stock{order:7}.card-position-stock:after,.card-position-foundation:after{position:absolute;display:flex;justify-content:center;align-items:center;width:100%;height:100%;top:0;left:0;content:"";font-size:70px;color:var(--color-background)}.card-position-stock:after{content:"♻"}.card-position-foundation:nth-child(4):after{content:"♠"}.card-position-foundation:nth-child(5):after{content:"♥"}.card-position-foundation:nth-child(6):after{content:"♣"}.card-position-foundation:nth-child(7):after{content:"♦"}@media(max-width:600px){.card-position-tableau li{height:25px}.card-position-stock:after,.card-position-foundation:after{font-size:30px}}:root{--color-background-1: #09410e;--color-background-2: #032b08;--color-background-3: #031805;--color-background: var(--color-background-2);--color-text: #ccc;--color-black: #000;--nav-width: 860px;--nav-height: 66px;--board-row-max-width: 840px;--pile-color: #1c1c1c;--win-color: #46d746;--menu-animation-time: .4s;--background-transition-time: 2s;--card-width: 100px;--card-height: 140px;--card-radius: 6px;--card-color-light: #aaa;--card-color-grey: #838383;--card-color-black: #111;--card-color-red: #770e13;--card-back-color-blue: #062d79;--card-back-color-purple1: #3f289b;--card-back-color-purple2: #52409d}@media(max-width:850px){:root{--card-width: 40px;--card-height: 56px}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{background-color:var(--color-background);font-size:16px;line-height:1.2;transition:background-color var(--background-transition-time)}body{min-height:100vh;color:var(--color-text);font-family:Noto Sans JP,sans-serif;font-optical-sizing:auto}img,picture,video,canvas,svg{display:block;max-width:100%}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit;color:inherit}ul,ol{list-style:none}.game-wrapper{position:relative;display:flex;flex-direction:column;width:100vw;height:100vh;overflow:hidden;-webkit-user-select:none;user-select:none}
