body {
  background-image: linear-gradient(
      161deg,
      rgba(121, 121, 121, 0.02) 0%,
      rgba(121, 121, 121, 0.02) 16.667%,
      rgba(193, 193, 193, 0.02) 16.667%,
      rgba(193, 193, 193, 0.02) 33.334%,
      rgba(177, 177, 177, 0.02) 33.334%,
      rgba(177, 177, 177, 0.02) 50.001000000000005%,
      rgba(5, 5, 5, 0.02) 50.001%,
      rgba(5, 5, 5, 0.02) 66.668%,
      rgba(229, 229, 229, 0.02) 66.668%,
      rgba(229, 229, 229, 0.02) 83.33500000000001%,
      rgba(211, 211, 211, 0.02) 83.335%,
      rgba(211, 211, 211, 0.02) 100.002%
    ),
    linear-gradient(
      45deg,
      rgba(223, 223, 223, 0.02) 0%,
      rgba(223, 223, 223, 0.02) 14.286%,
      rgba(70, 70, 70, 0.02) 14.286%,
      rgba(70, 70, 70, 0.02) 28.572%,
      rgba(109, 109, 109, 0.02) 28.572%,
      rgba(109, 109, 109, 0.02) 42.858%,
      rgba(19, 19, 19, 0.02) 42.858%,
      rgba(19, 19, 19, 0.02) 57.144%,
      rgba(180, 180, 180, 0.02) 57.144%,
      rgba(180, 180, 180, 0.02) 71.42999999999999%,
      rgba(63, 63, 63, 0.02) 71.43%,
      rgba(63, 63, 63, 0.02) 85.71600000000001%,
      rgba(87, 87, 87, 0.02) 85.716%,
      rgba(87, 87, 87, 0.02) 100.002%
    ),
    linear-gradient(
      337deg,
      rgba(142, 142, 142, 0.02) 0%,
      rgba(142, 142, 142, 0.02) 20%,
      rgba(164, 164, 164, 0.02) 20%,
      rgba(164, 164, 164, 0.02) 40%,
      rgba(203, 203, 203, 0.02) 40%,
      rgba(203, 203, 203, 0.02) 60%,
      rgba(228, 228, 228, 0.02) 60%,
      rgba(228, 228, 228, 0.02) 80%,
      rgba(54, 54, 54, 0.02) 80%,
      rgba(54, 54, 54, 0.02) 100%
    ),
    linear-gradient(
      314deg,
      rgba(187, 187, 187, 0.02) 0%,
      rgba(187, 187, 187, 0.02) 12.5%,
      rgba(170, 170, 170, 0.02) 12.5%,
      rgba(170, 170, 170, 0.02) 25%,
      rgba(214, 214, 214, 0.02) 25%,
      rgba(214, 214, 214, 0.02) 37.5%,
      rgba(187, 187, 187, 0.02) 37.5%,
      rgba(187, 187, 187, 0.02) 50%,
      rgba(190, 190, 190, 0.02) 50%,
      rgba(190, 190, 190, 0.02) 62.5%,
      rgba(6, 6, 6, 0.02) 62.5%,
      rgba(6, 6, 6, 0.02) 75%,
      rgba(206, 206, 206, 0.02) 75%,
      rgba(206, 206, 206, 0.02) 87.5%,
      rgba(171, 171, 171, 0.02) 87.5%,
      rgba(171, 171, 171, 0.02) 100%
    ),
    linear-gradient(
      300deg,
      rgba(243, 243, 243, 0.01) 0%,
      rgba(243, 243, 243, 0.01) 12.5%,
      rgba(209, 209, 209, 0.01) 12.5%,
      rgba(209, 209, 209, 0.01) 25%,
      rgba(179, 179, 179, 0.01) 25%,
      rgba(179, 179, 179, 0.01) 37.5%,
      rgba(3, 3, 3, 0.01) 37.5%,
      rgba(3, 3, 3, 0.01) 50%,
      rgba(211, 211, 211, 0.01) 50%,
      rgba(211, 211, 211, 0.01) 62.5%,
      rgba(151, 151, 151, 0.01) 62.5%,
      rgba(151, 151, 151, 0.01) 75%,
      rgba(16, 16, 16, 0.01) 75%,
      rgba(16, 16, 16, 0.01) 87.5%,
      rgba(242, 242, 242, 0.01) 87.5%,
      rgba(242, 242, 242, 0.01) 100%
    ),
    linear-gradient(
      6deg,
      rgba(31, 31, 31, 0.02) 0%,
      rgba(31, 31, 31, 0.02) 20%,
      rgba(193, 193, 193, 0.02) 20%,
      rgba(193, 193, 193, 0.02) 40%,
      rgba(139, 139, 139, 0.02) 40%,
      rgba(139, 139, 139, 0.02) 60%,
      rgba(14, 14, 14, 0.02) 60%,
      rgba(14, 14, 14, 0.02) 80%,
      rgba(122, 122, 122, 0.02) 80%,
      rgba(122, 122, 122, 0.02) 100%
    ),
    linear-gradient(
      279deg,
      rgba(190, 190, 190, 0.02) 0%,
      rgba(190, 190, 190, 0.02) 14.286%,
      rgba(160, 160, 160, 0.02) 14.286%,
      rgba(160, 160, 160, 0.02) 28.572%,
      rgba(23, 23, 23, 0.02) 28.572%,
      rgba(23, 23, 23, 0.02) 42.858%,
      rgba(60, 60, 60, 0.02) 42.858%,
      rgba(60, 60, 60, 0.02) 57.144%,
      rgba(149, 149, 149, 0.02) 57.144%,
      rgba(149, 149, 149, 0.02) 71.42999999999999%,
      rgba(4, 4, 4, 0.02) 71.43%,
      rgba(4, 4, 4, 0.02) 85.71600000000001%,
      rgba(50, 50, 50, 0.02) 85.716%,
      rgba(50, 50, 50, 0.02) 100.002%
    ),
    linear-gradient(
      109deg,
      rgba(124, 124, 124, 0.03) 0%,
      rgba(124, 124, 124, 0.03) 12.5%,
      rgba(61, 61, 61, 0.03) 12.5%,
      rgba(61, 61, 61, 0.03) 25%,
      rgba(187, 187, 187, 0.03) 25%,
      rgba(187, 187, 187, 0.03) 37.5%,
      rgba(207, 207, 207, 0.03) 37.5%,
      rgba(207, 207, 207, 0.03) 50%,
      rgba(206, 206, 206, 0.03) 50%,
      rgba(206, 206, 206, 0.03) 62.5%,
      rgba(118, 118, 118, 0.03) 62.5%,
      rgba(118, 118, 118, 0.03) 75%,
      rgba(89, 89, 89, 0.03) 75%,
      rgba(89, 89, 89, 0.03) 87.5%,
      rgba(96, 96, 96, 0.03) 87.5%,
      rgba(96, 96, 96, 0.03) 100%
    ),
    linear-gradient(
      329deg,
      rgba(35, 35, 35, 0.02) 0%,
      rgba(35, 35, 35, 0.02) 20%,
      rgba(246, 246, 246, 0.02) 20%,
      rgba(246, 246, 246, 0.02) 40%,
      rgba(118, 118, 118, 0.02) 40%,
      rgba(118, 118, 118, 0.02) 60%,
      rgba(245, 245, 245, 0.02) 60%,
      rgba(245, 245, 245, 0.02) 80%,
      rgba(140, 140, 140, 0.02) 80%,
      rgba(140, 140, 140, 0.02) 100%
    ),
    linear-gradient(90deg, hsl(314, 0%, 31%), hsl(314, 0%, 31%));

  height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif,
    'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
  font-size: 13px;
  font-weight: 400;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.4);
}

.welcome {
  position: relative;
  background-color: #333333;

  box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);

  /* display: flex;
  flex-wrap: wrap; */
  padding: 4px;
}

.item {
  display: flex;
  padding: 30px;
  max-width: 90vw;
  min-width: 100px;
  cursor: pointer;
}

.welcome > a {
    color: inherit;
    text-decoration: none;
}

.item:hover {
  background-color: rgba(255, 255, 255, 0.1);
}

.item .notice {
  display: none;
  font-size: 12px;
  float: right;
  background-color: #666;
  padding: 3px 6px;
}

.item.unsupported {
  cursor: default;
  color: rgba(255, 255, 255, 0.1);
}

.item.unsupported .notice {
  display: inline-block;
  color: #aaa;
}

.item.unsupported svg path {
  fill: rgba(255, 255, 255, 0.1);
}

.item.unsupported:hover {
  background-color: transparent;
}

.icon {
  width: 80px;
  height: 80px;
  margin-right: 30px;
  flex: 0 0 80px;
}

.content {
  flex: 1 1 auto;
  align-self: center;
}

svg path {
  fill: rgba(255, 255, 255, 0.4);
}

h1 {
  font-size: 2rem;
  font-weight: 300;
}