/* z-index */
#hand0>.charcontainer:nth-child(1), #pool>.charcontainer:nth-child(1), #hand1>.charcontainer:nth-child(1){
  z-index: 10;
}
#hand0>.charcontainer:nth-child(2), #pool>.charcontainer:nth-child(2), #hand1>.charcontainer:nth-child(2){
  z-index: 9;
}
#hand0>.charcontainer:nth-child(3), #pool>.charcontainer:nth-child(3), #hand1>.charcontainer:nth-child(3){
  z-index: 8;
}
#hand0>.charcontainer:nth-child(4), #pool>.charcontainer:nth-child(4), #hand1>.charcontainer:nth-child(4){
  z-index: 7;
}
#hand0>.charcontainer:nth-child(5), #pool>.charcontainer:nth-child(5), #hand1>.charcontainer:nth-child(5){
  z-index: 6;
}
#hand0>.charcontainer:nth-child(6), #pool>.charcontainer:nth-child(6), #hand1>.charcontainer:nth-child(6){
  z-index: 5;
}
#hand0>.charcontainer:nth-child(7), #pool>.charcontainer:nth-child(7), #hand1>.charcontainer:nth-child(7){
  z-index: 4;
}
#hand0>.charcontainer:nth-child(8), #pool>.charcontainer:nth-child(8), #hand1>.charcontainer:nth-child(8){
  z-index: 3;
}
#hand0>.charcontainer:nth-child(9), #pool>.charcontainer:nth-child(9), #hand1>.charcontainer:nth-child(9){
  z-index: 2;
}
#hand0>.charcontainer:nth-child(10), #pool>.charcontainer:nth-child(10), #hand1>.charcontainer:nth-child(10){
  z-index: 1;
}

/* flip */
#pool .card, #hand1 .card, #table0 .card, #table1 .card, #specials1 .card, .faceup .card{
  transform: rotateY(180deg);
}

/* array positioning */
.cardstack>.charcontainer, #repository>.charcontainer {
  position: absolute;
}
#hand0>.charcontainer, #pool>.charcontainer, #hand1>.charcontainer{
  position: relative;
  float: left;
}
#hand0>.charcontainer:not(:first-child), #hand1>.charcontainer:not(:first-child){
  margin-left: calc(var(--card-width)*-0.44);
}
#pool>.charcontainer:not(:first-child){
  margin-left: var(--pool-margin);
}

/* repository deck effect */
#repository .charcontainer:nth-child(n+5) .cardback{
  box-shadow: none;
}
#repository .charcontainer:first-child){
  left: calc(var(--card-width) / 4);
  top: calc(var(--card-height) /30);
}
#repository .charcontainer:nth-child(2){
  left: calc(var(--card-width) / 4 * 0.67);
  top: calc(var(--card-height) /30 * 0.67);
}
#repository .charcontainer:nth-child(3){
  left: calc(var(--card-width) / 4 * 0.33);
  top: calc(var(--card-height) /30 * 0.33);
}

/* hand0, hand1, pool top-variance */
#hand0>.charcontainer:nth-child(odd), #hand1>.charcontainer:nth-child(odd){
  top: 1px;
}
#hand0>.charcontainer:nth-child(even), #hand1>.charcontainer:nth-child(even){
  top: -1px;
}
#pool>.charcontainer:nth-child(odd){
  top: calc(var(--card-height)/8);
}
#pool>.charcontainer:nth-child(even){
  top: calc(var(--card-height)/-8);
}

/* pool card rotation */
#pool>.charcontainer:nth-child(2)>.cardcontainer{transform: rotate(-15deg);}
#pool>.charcontainer:nth-child(4)>.cardcontainer{transform: rotate(-5deg);}
#pool>.charcontainer:nth-child(6)>.cardcontainer{transform: rotate(3deg);}
#pool>.charcontainer:nth-child(8)>.cardcontainer{transform: rotate(-9deg);}
#pool>.charcontainer:nth-child(10)>.cardcontainer{transform: rotate(5deg);}
#pool>.charcontainer:nth-child(1)>.cardcontainer{transform: rotate(8deg);}
#pool>.charcontainer:nth-child(3)>.cardcontainer{transform: rotate(-12deg);}
#pool>.charcontainer:nth-child(5)>.cardcontainer{transform: rotate(12deg);}
#pool>.charcontainer:nth-child(7)>.cardcontainer{transform: rotate(25deg);}
#pool>.charcontainer:nth-child(9)>.cardcontainer{transform: rotate(-6deg);}

/* table & sp card rotation: only rotate the last 5 */
#table0>.charcontainer:nth-last-child(1)>.cardcontainer,#table1>.charcontainer:nth-last-child(5)>.cardcontainer, #specials0>.charcontainer:nth-last-child(3)>.cardcontainer,#specials1>.charcontainer:nth-last-child(2)>.cardcontainer {
  transform: rotate(-15deg);
  top: -4%;
  left: 4%;
}
#table0>.charcontainer:nth-last-child(2)>.cardcontainer,#table1>.charcontainer:nth-last-child(4)>.cardcontainer, #specials0>.charcontainer:nth-last-child(5)>.cardcontainer,#specials1>.charcontainer:nth-last-child(3)>.cardcontainer {
  transform: rotate(25deg);
  top: 2%;
  left: 4%;
}
#table0>.charcontainer:nth-last-child(3)>.cardcontainer,#table1>.charcontainer:nth-last-child(3)>.cardcontainer, #specials0>.charcontainer:nth-last-child(1)>.cardcontainer,#specials1>.charcontainer:nth-last-child(5)>.cardcontainer {
  transform: rotate(-21deg);
  top: 3%;
  left: -3%;
}
#table0>.charcontainer:nth-last-child(4)>.cardcontainer,#table1>.charcontainer:nth-last-child(2)>.cardcontainer, #specials0>.charcontainer:nth-last-child(4)>.cardcontainer,#specials1>.charcontainer:nth-last-child(1)>.cardcontainer {
  transform: rotate(13deg);
  top: -2%;
  left: 7%;
}
#table0>.charcontainer:nth-last-child(5)>.cardcontainer,#table1>.charcontainer:nth-last-child(1)>.cardcontainer, #specials0>.charcontainer:nth-last-child(2)>.cardcontainer,#specials1>.charcontainer:nth-last-child(4)>.cardcontainer {
  transform: rotate(6deg);
  top: 5%;
  left: -7%;
}

/* hover effects */
#pool>.charcontainer:hover>.cardcontainer, #hand1>.charcontainer:hover>.cardcontainer{
  transform: translate(0, calc(var(--card-height)/-3));
}
#table0>.charcontainer:hover>.cardcontainer, #table1>.charcontainer:hover>.cardcontainer,  #specials1>.charcontainer:hover>.cardcontainer{
  transform: translate(0, calc(var(--card-height)/-4));
}
#pool>.charcontainer:nth-child(odd)>.cardcontainer:hover {
  transform: translate(0, calc(var(--card-height)/3));
}
