.App *{touch-action:none;-webkit-user-select:none;user-select:none}.App{--tile-selected: #ffcc66;--card-dark: #335160;--card-dark-transparent: rgba(51, 81, 96, .1);--card-mid: #3c8b9a;--card-light: #388b9a;--player-blue-dark: #233354;--player-blue-light: #3259a8;--player-green-dark: #1d4d2a;--player-green-light: #32a852;--player-orange-dark: #572f16;--player-orange-light: #db7230;--player-purple-dark: #4d1449;--player-purple-light: #8c1f85}.Menu,.Game{overflow:hidden;padding:10px;box-sizing:border-box;width:100dvw;height:100dvh;font-size:calc(10px + 2vmin);color:#fff;justify-content:center}.Menu,.Menu .TileRow,.Game{display:grid;gap:10px}.Menu{grid-template-rows:repeat(3,1fr)}.Menu .TileRow{width:100dvw;grid-template-columns:repeat(4,1fr)}.Menu .Tile{display:flex;border-radius:10px;cursor:pointer;align-items:center;justify-content:center;background-color:var(--card-dark)}.Menu .Tile:hover{background-color:var(--card-mid)}.Menu .Tile.selected{background-color:var(--tile-selected);color:var(--card-dark)}.Game{grid-template-columns:repeat(var(--card-columns),1fr)}.Game.can-commit{cursor:grab}.Game.can-select .Card.state-down{cursor:pointer}.Game .Card{position:relative;transition:transform .5s;transform-style:preserve-3d;touch-action:none}.Game .Card .back,.Game .Card .front{display:flex;align-items:center;justify-content:center;border-radius:10px;position:absolute;width:100%;height:100%;backface-visibility:hidden}.Game .Card .back{background-color:var(--card-dark);background-image:repeating-linear-gradient(45deg,var(--card-light) 0,var(--card-light) 1px,transparent 1px,transparent 4px),repeating-linear-gradient(-45deg,var(--card-mid) 0,var(--card-mid) 1px,transparent 1px,transparent 4px),radial-gradient(circle,var(--card-dark-transparent) 0%,var(--card-dark) 80%);background-size:16px 16px,16px 16px,100% 100%;background-blend-mode:normal,normal,multiply;transform:rotateY(180deg)}.Game .Card .front{background-color:var(--card-light)}.Game .Card.state-down{transform:rotateY(180deg)}.Game .Card.state-matched .front:before{font-size:1.5em;content:"○"}.Game .Card.state-failed .front:before{font-size:2em;content:"×"}.Game .Card.state-claimed.player-blue .front{background-color:var(--player-blue-light)}.Game.player-blue{background-color:var(--player-blue-dark)}.Game .Card.state-claimed.player-green .front{background-color:var(--player-green-light)}.Game.player-green{background-color:var(--player-green-dark)}.Game .Card.state-claimed.player-orange .front{background-color:var(--player-orange-light)}.Game.player-orange{background-color:var(--player-orange-dark)}.Game .Card.state-claimed.player-purple .front{background-color:var(--player-purple-light)}.Game.player-purple{background-color:var(--player-purple-dark)}