:root {
  --credit-v4-cyan: #9bc6c0;
  --credit-v4-gold: #cfaf75;
  --credit-v4-line: rgba(225, 230, 228, .14);
  --credit-v4-raised: #101214;
}

body.credit-page.cassell-platform-v2 .credit-nav nav a img,
body.credit-page.cassell-platform-v2 .credit-panel img,
body.credit-page.cassell-platform-v2 .credit-bell img {
  background: transparent;
}

body.credit-page.cassell-platform-v2 .credit-nav nav a img {
  width: 18px;
  height: 18px;
  opacity: .7;
}

body.credit-page.cassell-platform-v2 .credit-nav nav a:hover img,
body.credit-page.cassell-platform-v2 .credit-nav nav a.active img {
  opacity: 1;
}

body.credit-page.cassell-platform-v2 .cassell-audio-slot--credit {
  flex: 0 0 auto;
  padding: 0 20px 16px;
}

body.credit-page.cassell-platform-v2 .cassell-audio-slot--credit .cassell-audio-toggle {
  justify-content: flex-start;
  width: 100%;
  height: 40px;
  margin: 0;
  border: 1px solid var(--credit-v4-line);
  border-radius: 10px !important;
  color: #a8adab;
  background: #0b0c0e !important;
}

body.credit-page.cassell-platform-v2 .cassell-audio-slot--credit .cassell-audio-toggle:hover,
body.credit-page.cassell-platform-v2 .cassell-audio-slot--credit .cassell-audio-toggle.is-playing {
  border-color: rgba(155, 198, 192, .34) !important;
  color: #e8eeec !important;
  background: #111416 !important;
}

body.credit-page.cassell-platform-v2 .credit-rules-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

body.credit-page.cassell-platform-v2 .credit-rules-link svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
}

body.credit-page.cassell-platform-v2 .credit-panel {
  border-color: var(--credit-v4-line);
  background: linear-gradient(145deg, rgba(16, 18, 20, .96), rgba(8, 9, 10, .98));
}

body.credit-page.cassell-platform-v2 .credit-panel h2 img,
body.credit-page.cassell-platform-v2 .credit-panel-head h2 img {
  width: 18px;
  height: 18px;
  opacity: .8;
}

body.credit-page.cassell-platform-v2 .credit-balance-card,
body.credit-page.cassell-platform-v2 .credit-student-card,
body.credit-page.cassell-platform-v2 .credit-trend {
  position: relative;
  overflow: hidden;
}

body.credit-page.cassell-platform-v2 .credit-balance-card::after,
body.credit-page.cassell-platform-v2 .credit-student-card::after,
body.credit-page.cassell-platform-v2 .credit-trend::after {
  position: absolute;
  inset: 0 auto auto 0;
  display: block;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, var(--credit-v4-cyan), transparent 45%);
  opacity: .34;
  content: "";
}

body.credit-page.cassell-platform-v2 .credit-student-card::after {
  background: linear-gradient(90deg, var(--credit-v4-gold), transparent 45%);
}

body.credit-page.cassell-platform-v2 .credit-button,
body.credit-page.cassell-platform-v2 .credit-tabs button,
body.credit-page.cassell-platform-v2 .credit-shortcuts :is(a, button) {
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
}

body.credit-page.cassell-platform-v2 .credit-entry-title img {
  width: 18px;
  height: 18px;
  padding: 0;
  border: 0;
  background: transparent;
}

body.credit-page.cassell-platform-v2 .credit-entry:hover {
  background: rgba(255, 255, 255, .025);
}

body.credit-page.cassell-platform-v2 .credit-chart .line { stroke: var(--credit-v4-cyan); }
body.credit-page.cassell-platform-v2 .credit-chart circle { stroke: var(--credit-v4-cyan); }

@media (max-width: 1080px) {
  body.credit-page.cassell-platform-v2 .credit-nav {
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 8px;
  }

  body.credit-page.cassell-platform-v2 .cassell-audio-slot--credit {
    padding: 0;
  }

  body.credit-page.cassell-platform-v2 .cassell-audio-slot--credit .cassell-audio-toggle {
    width: 40px;
    min-width: 40px;
    justify-content: center;
    padding: 0;
  }

  body.credit-page.cassell-platform-v2 .cassell-audio-slot--credit .cassell-audio-toggle__label {
    display: none;
  }
}

@media (max-width: 720px) {
  body.credit-page.cassell-platform-v2 .credit-user > img { display: none; }
  body.credit-page.cassell-platform-v2 .credit-user { gap: 5px; }
  body.credit-page.cassell-platform-v2 .credit-rules-link { min-width: 40px; justify-content: center; }
  body.credit-page.cassell-platform-v2 .credit-rules-link svg { flex: 0 0 auto; }
}

