@import "tailwindcss";

@theme {
  --color-primary: #D9AFD9;
  --color-input: color-mix(in srgb, var(--color-white, #fff) 20%, transparent);
  --color-background: black;
  --color-common: var(--color-sky-500);
  --color-uncommon: var(--color-green-400);
  --color-rare: var(--color-red-500);
  --color-legendary: var(--color-amber-500);
  --bg-brand: -webkit-linear-gradient(225deg, rgb(251, 175, 21), rgb(251, 21, 242),             
  rgb(21, 198, 251)) 0% 0% / 100% 300%;
  --bg-secondary: linear-gradient(90deg, #D9AFD9 0%, #97D9E1 100%) 0% 0% / 100% 300%;
  --animate-gradientmove: gradientmove 1s ease 0s 1 normal forwards;
  @keyframes gradientmove {
    0%{background-position: 0% 0%}
    100%{background-position: 0% 100%}
  }
}

button {
  cursor: pointer;
}

.grid-border-b div:not(:nth-last-child(-n+3)) {
  @apply border-b border-white/10;
}

/* .game-board { */
/*   display: grid; */
/*   gap: 2px; */
/*   max-width: fit-content; */
/* } */
/**/
/* .game-wrapper { */
/*   display: flex; */
/*   flex-direction: column; */
/*   align-items: center; */
/* } */
/**/
/* .mine-button { */
/*   background-color: #666; */
/*   border: 1px solid black; */
/*   width: 2rem; */
/*   height: 2rem; */
/*   font-size: 1.25rem; */
/*   user-select: none; */
/*   display: flex; */
/*   justify-content: center; */
/*   align-items: center; */
/*   font-weight: bold; */
/*   font-family: monospace; */
/*   box-sizing: border-box; */
/*   transition: all 0.2s ease-in-out; */
/* } */
/**/
/* html { */
/*   background: #111; */
/*   color: #eee; */
/* } */
/**/
/* body { */
/*   margin: auto; */
/*   max-width: 1400px; */
/*   padding: 1rem; */
/*   font-family: monospace; */
/* } */
/**/
/* .timer { */
/*   flex-grow: 1; */
/*   display: flex; */
/*   justify-content: space-between; */
/*   align-items: center; */
/*   font-size: 2rem; */
/*   font-family: monospace; */
/* } */
/**/
/* .footer { */
/*   display: flex; */
/*   flex-direction: column; */
/*   align-items: center; */
/*   font-size: 1rem; */
/*   font-family: monospace; */
/* } */
/**/
/* pre { */
/*   margin: 0; */
/* } */
/**/
/* .stage { */
/*   font-size: 1rem; */
/*   font-family: monospace; */
/* } */
/**/
/* input { */
/*   font-size: 14px; */
/*   margin: 12px; */
/*   padding: 6px 12px 6px 12px; */
/*   border-radius: 0.7em; */
/*   background: #333; */
/*   color: #eee; */
/*   border: 1px solid rgb(251, 21, 242); */
/**/
/* } */
/**/
/* button { */
/*   color: white; */
/*   font-weight: 600; */
/*   font-size: 14px; */
/*   margin: 12px; */
/*   padding: 6px 12px 6px 12px; */
/*   border-radius: 0.7em; */
/*   background: -webkit-linear-gradient(225deg, rgb(251, 175, 21), rgb(251, 21, 242),              */
/*   rgb(21, 198, 251)) 0% 0% / 300% 300%; */
/*   background-size: 200% auto; */
/* } */
/**/
/* button:hover { */
/*   animation: gradient_move 1s ease infinite; */
/* } */
/**/
/**/
/* .header { */
/*   display: grid; */
/*   grid-template-columns: 1fr 1fr; */
/*   margin-bottom: 1rem; */
/* } */
/**/
/* .scores { */
/*   text-align: right; */
/* } */