/* «Элитный машинист»: радужный ник и карточка подписки в магазине */
.ms-rainbow {
  background-image: linear-gradient(90deg, #ff3b3b, #ff9f1a, #ffe11a, #2fd36b, #1ea7ff, #7a5cff, #ff3bd4, #ff3b3b);
  background-size: 200% auto;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
  animation: ms-rainbow 4s linear infinite;
  font-weight: 700;
}
@keyframes ms-rainbow { to { background-position: 200% center; } }
/* «Золотая реверсивная рукоятка» без подписки — золотой ник */
.ms-gold {
  background-image: linear-gradient(90deg, #b8860b, #f5c518, #fff1a8, #f5c518, #b8860b);
  background-size: 200% auto;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
  animation: ms-rainbow 5s linear infinite;
  font-weight: 700;
}
html[data-theme="light"] .ms-gold { background-image: linear-gradient(90deg, #8a6100, #c99400, #e8b923, #c99400, #8a6100); }
@media (prefers-reduced-motion: reduce) { .ms-rainbow, .ms-gold { animation: none; } }

.ms-pass {
  position: relative;
  margin: 0 0 1.2em;
  padding: 1.2em 1.3em;
  border-radius: 18px;
  background: linear-gradient(150deg, rgba(122, 92, 255, .14), rgba(30, 167, 255, .06) 45%, transparent 80%), var(--card);
  border: 1px solid transparent;
  background-clip: padding-box;
  box-shadow: var(--shadow);
}
.ms-pass:before {
  content: ""; position: absolute; inset: -1px; z-index: -1; border-radius: 19px;
  background: linear-gradient(90deg, #ff3b3b, #ff9f1a, #ffe11a, #2fd36b, #1ea7ff, #7a5cff, #ff3bd4);
  opacity: .55;
}
.ms-pass { isolation: isolate; }
.ms-pass.is-off { opacity: .7; }
.ms-pass-head { display: flex; align-items: center; gap: 1em; }
.ms-pass-ic { flex: 0 0 auto; width: 3em; height: 3em; border-radius: 14px; display: grid; place-items: center; font-size: 1.15em; color: #fff;
  background: linear-gradient(135deg, #7a5cff, #1ea7ff); box-shadow: 0 8px 18px -8px rgba(122, 92, 255, .9); }
.ms-pass-ic .icon { margin: 0 !important; }
.ms-pass-name { display: flex; flex-direction: column; min-width: 0; }
.ms-pass-name b { font-size: 1.35em; color: var(--head); letter-spacing: -.01em; }
.ms-pass-kicker { font-size: .78em; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); font-weight: 700; }
.ms-pass-active { color: #22c55e; font-weight: 600; font-size: .9em; }
.ms-pass-active .icon { margin: 0 .2em 0 0 !important; }
.ms-pass-perks { list-style: none; margin: 1em 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(15em, 1fr)); gap: .45em 1.2em; }
.ms-pass-perks li { display: flex; align-items: center; gap: .5em; color: var(--text); }
.ms-pass-perks li .icon { margin: 0 !important; color: #7a5cff; }
.ms-pass-perks li.is-no { color: var(--muted); }
.ms-pass-perks li.is-no .icon { color: var(--muted); }
.ms-pass-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1em; }
.ms-pass-prices { display: flex; flex-wrap: wrap; align-items: baseline; gap: .4em 1.1em; }
.ms-pass-prices .ms-shop-price { font-size: 1.5em; font-weight: 800; color: var(--head); }
.ms-pass-btns { display: flex; flex-wrap: wrap; gap: .5em; }
.ms-pass-btns form { margin: 0; }
.ms-pass-paybtn { background: linear-gradient(135deg, #7a5cff, #1ea7ff) !important; color: #fff !important; border: 0 !important; }
.ms-pass-paybtn[disabled] { opacity: .5; }
.ms-pass-note { margin-top: .8em; font-size: .88em; }
.ms-pass-order { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .6em; margin-top: .9em; padding: .7em .9em; border-radius: 12px; background: var(--hover); border: 1px dashed var(--line); }
.ms-pass-order form { display: flex; flex-wrap: wrap; gap: .4em; margin: 0; }
.ms-pass-vio { display: flex; flex-direction: column; gap: .5em; margin-top: 1em; padding-top: 1em; border-top: 1px solid var(--line); }
.ms-pass-vio > .ms-bans-btn { align-self: flex-start; }
@media (max-width: 640px) {
  .ms-pass { padding: 1em; }
  .ms-pass-foot, .ms-pass-btns, .ms-pass-btns form, .ms-pass-btns .ms-bans-btn { width: 100%; }
}