.appIcon {
  display: block !important;
  width: 54px;
  height: 54px;
  border-radius: 14px;
  background-image: url('/favicon.svg') !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  box-shadow: 0 12px 30px rgb(135 23 10 / .25);
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
  overflow: hidden;
  flex: 0 0 auto;
}

.appIcon.small {
  width: 56px;
  height: 56px;
  border-radius: 14px;
}

.feature span,
.bookPoint > svg,
.miniRows svg,
.timeline span,
.chips span {
  transition: transform .18s ease, background .18s ease, color .18s ease, box-shadow .18s ease;
}

.feature:hover span,
.bookPoint:hover > svg,
.miniRows div:hover svg {
  transform: translateY(-2px);
}

.feature:nth-child(1) span {
  background: #eaf5f1;
  color: #0f5b50;
  box-shadow: 0 12px 26px rgb(15 91 80 / .12);
}

.feature:nth-child(2) span {
  background: #fff1dc;
  color: #a05200;
  box-shadow: 0 12px 26px rgb(160 82 0 / .12);
}

.feature:nth-child(3) span {
  background: #eef2ff;
  color: #3f51b5;
  box-shadow: 0 12px 26px rgb(63 81 181 / .11);
}

.feature:nth-child(4) span {
  background: #fff0ed;
  color: #b33225;
  box-shadow: 0 12px 26px rgb(179 50 37 / .12);
}

.feature:nth-child(5) span {
  background: #f4edff;
  color: #7043a8;
  box-shadow: 0 12px 26px rgb(112 67 168 / .11);
}

.feature:nth-child(6) span {
  background: #eaf7e8;
  color: #376a2f;
  box-shadow: 0 12px 26px rgb(55 106 47 / .11);
}

.bookPoint:nth-child(1) > svg { color: #b33225; }
.bookPoint:nth-child(2) > svg { color: #a05200; }
.bookPoint:nth-child(3) > svg { color: #0f5b50; }
.bookPoint:nth-child(4) > svg { color: #7043a8; }
.bookPoint:nth-child(5) > svg { color: #3f51b5; }
.bookPoint:nth-child(6) > svg { color: #376a2f; }

.timeline span:nth-child(1),
.chips span:nth-child(1) {
  background: #eaf5f1;
  color: #0f5b50;
}

.timeline span:nth-child(2),
.chips span:nth-child(2) {
  background: #fff1dc;
  color: #8a4a00;
}

.timeline span:nth-child(3),
.chips span:nth-child(3) {
  background: #eef2ff;
  color: #3f51b5;
}

.timeline span:nth-child(4),
.chips span:nth-child(4) {
  background: #fff0ed;
  color: #b33225;
}

.timeline span.done {
  background: linear-gradient(135deg, #174d45, #0f2e2a);
  color: white;
  box-shadow: 0 10px 24px rgb(23 77 69 / .16);
}

.miniRows div:nth-child(1) svg { color: #d46b08; }
.miniRows div:nth-child(2) svg { color: #b33225; }
.miniRows div:nth-child(3) svg { color: #3f51b5; }
.miniRows div:nth-child(4) svg { color: #0f5b50; }

.miniRows div:nth-child(1) { background: linear-gradient(90deg, #fff7eb, #f8faf9); }
.miniRows div:nth-child(2) { background: linear-gradient(90deg, #fff0ed, #f8faf9); }
.miniRows div:nth-child(3) { background: linear-gradient(90deg, #eef2ff, #f8faf9); }
.miniRows div:nth-child(4) { background: linear-gradient(90deg, #eaf5f1, #f8faf9); }

@media (max-width: 680px) {
  .appIcon {
    width: 46px;
    height: 46px;
    border-radius: 12px;
    font-size: 0 !important;
  }

  .appIcon.small {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    font-size: 0 !important;
  }
}