[data-component~="components/games/ur/tabletop"] {
  #board {
    td {
      position: relative;
      max-width: clamp(1rem, 10vh, 5rem);
      &.no-tile {
        background-color: var(--color-player-bg) !important;
      }
      .mark > * {
        color: var(--color-yellow-400);
        opacity: 0.5;
        width: 95%;
        height: 95%;
        position: absolute;
        top: 2.5%;
        left: 2.5%;
        svg {
          width: 100%;
          height: 100%;
        }
      }
    }
  }
  .dice {
    margin-top: 1rem;
    display: flex;
    cursor: pointer;
  }
  .die {
    position: relative;
    width: 100%;
    max-width: clamp(1rem, 10vh, 5rem);
    aspect-ratio: 1/1;
    [data-component~="components/icon"] {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 75%;
      height: 75%;
      svg {
        width: 100%;
        height: 100%;
      }
    }
    &[data-value="1"] {
      [data-component~="components/icon"] {
        opacity: 1;
      }
    }
    &[data-value="0"] {
      [data-component~="components/icon"] {
        opacity: 0.3;
      }
    }
  }
  &:not([data-direction=backward]) {
    .dice.rolled {
      [data-component~="components/icon"] {
        svg {
          animation: 350ms ease-out 1 spin;
        }
      }
    }
  }
}