/* ── Тариф «Пробный» ─────────────────────────────────────────────────────────
   Свой цвет — бирюза с мятой и звёздочки-«старт». Не золото VIP, не сине-фиолетовый ELITE,
   не плоский зелёный START. Движение только у карточек на экране (.tier-on). */
:root {
  --tr-a: #5EEAD4; --tr-b: #14B8A6; --tr-c: #A7F3D0;
  --tr-ink: #052E2B; --tr-text: #CCFBF1;
}

/* Рамка карточки ленты */
.tier-frame.tier-trial {
  padding: 3px; overflow: hidden;
  background: linear-gradient(135deg, var(--tr-c), var(--tr-b) 45%, var(--tr-a) 75%, var(--tr-c));
  box-shadow: 0 0 14px rgba(45,212,191,.42), inset 0 1px 0 rgba(255,255,255,.55);
}
.tier-sweep-soft { background: linear-gradient(90deg, transparent, rgba(204,251,241,.36), transparent); }
.tier-frame.tier-on.tier-trial .tier-sweep { animation: tierSweepGo 5.5s ease-in-out infinite; }
.tier-star {
  position: absolute; z-index: 6; font-size: 13px; line-height: 1; font-style: normal;
  color: #ECFEFF; text-shadow: 0 0 6px rgba(45,212,191,.95);
  opacity: 0; pointer-events: none;
}
.tier-frame.tier-on.tier-trial .tier-star { animation: trialTwinkle 2.8s ease-in-out infinite; }
@keyframes trialTwinkle {
  0%,60%,100% { opacity: 0; transform: scale(.5) rotate(0); }
  72% { opacity: 1; transform: scale(1.15) rotate(20deg); }
  86% { opacity: .15; transform: scale(.8) rotate(40deg); }
}

/* Плашка-ярлык: залитая (у остальных — тёмная), поэтому с другими не спутать */
.tier-badge-trial {
  background: linear-gradient(135deg, var(--tr-a), var(--tr-c));
  color: var(--tr-ink);
  box-shadow: 0 0 10px rgba(45,212,191,.55);
}

/* Кольцо в ленте и профиле ученика */
.feed-ava-trial, .tier-ring-trial {
  background: conic-gradient(var(--tr-c), var(--tr-b), var(--tr-a), var(--tr-c));
  box-shadow: 0 0 10px rgba(45,212,191,.5);
}
.tier-head-trial {
  background: radial-gradient(120% 90% at 50% 0%, rgba(45,212,191,.24), rgba(94,234,212,.08) 50%, transparent 75%);
}
.tier-chip-trial { background: linear-gradient(135deg, var(--tr-a), var(--tr-c)); color: var(--tr-ink); font-weight: 900; }
.tier-head.tier-on .tier-ring-trial, .feed-ava-ring.tier-on.feed-ava-trial { animation: trialRing 2.6s ease-in-out infinite; }
@keyframes trialRing {
  0%,100% { box-shadow: 0 0 6px rgba(45,212,191,.35); }
  50% { box-shadow: 0 0 16px rgba(94,234,212,.85); }
}
.tier-head-trial .tier-spark { display: none; }

/* ── Плашка «Пробный · осталось N дней» ───────────────────────────────────── */
.trial-plate {
  display: flex; align-items: center; gap: 10px; box-sizing: border-box;
  width: 100%; margin: 8px 0 6px; padding: 10px 10px 10px 14px;
  border-radius: 18px; text-align: left; color: var(--tr-text);
  border: 1px solid rgba(94,234,212,.4);
  background: linear-gradient(135deg, rgba(20,184,166,.24), rgba(94,234,212,.08) 60%, rgba(18,16,26,.4));
  box-shadow: 0 0 16px rgba(45,212,191,.18);
}
.trial-plate[hidden] { display: none; }
.trial-plate-main {
  flex: 1; min-width: 0; min-height: 44px; display: flex; align-items: center; gap: 10px;
  background: none; border: 0; padding: 0; color: inherit; font: inherit; text-align: left;
}
.trial-plate-rocket { font-size: 26px; line-height: 1; flex: none; }
.trial-plate-txt { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 6px; min-width: 0; font-size: 15px; line-height: 1.25; }
.trial-plate-txt b { font-size: 17px; font-weight: 900; color: #fff; }
.trial-plate-txt span { color: var(--tr-text); }
.trial-plate-btn {
  flex: none; min-height: 44px; padding: 0 14px; border: 0; border-radius: 14px;
  background: linear-gradient(135deg, var(--tr-a), var(--tr-c)); color: var(--tr-ink);
  font-size: 15px; font-weight: 900; white-space: nowrap;
}
/* Кнопка — отдельной строкой на всю ширину: так крупно и не рвёт текст */
.trial-plate { flex-wrap: wrap; padding: 8px 10px 10px 14px; gap: 6px 10px; }
.trial-plate-main { flex: 1 1 100%; min-height: 40px; }
.trial-plate-btn { flex: 1 1 100%; }
/* Последний день: тёплая подсветка, чтобы не пропустить */
.trial-plate.is-last {
  border-color: rgba(251,191,36,.75);
  background: linear-gradient(135deg, rgba(245,158,11,.28), rgba(94,234,212,.10) 70%, rgba(18,16,26,.4));
  animation: trialLast 2.2s ease-in-out infinite;
}
.trial-plate.is-last .trial-plate-txt span { color: #FDE68A; font-weight: 800; }
.trial-plate.is-last .trial-plate-btn { background: linear-gradient(135deg, #FDE68A, #FBBF24); color: #3B2A00; }
@keyframes trialLast {
  0%,100% { box-shadow: 0 0 10px rgba(251,191,36,.25); }
  50% { box-shadow: 0 0 22px rgba(251,191,36,.6); }
}

/* Внутри экрана профиля плашка — на всю ширину карточки */
.profile-panel > .trial-plate { width: 100%; margin: 0 0 12px; }

/* Окно «что открыто» */
.trial-sheet-panel { padding-top: 22px; }
.trial-sheet-panel h2 { font-size: 22px; margin: 0 0 4px; }
.trial-sheet-days { font-size: 16px; font-weight: 800; color: var(--tr-a); margin-bottom: 14px; }
.trial-sheet-days.is-last { color: #FBBF24; }
.trial-sheet-list { list-style: none; margin: 0 0 16px; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.trial-sheet-list li { display: flex; gap: 10px; font-size: 15px; line-height: 1.35; }
.trial-sheet-list li i { font-style: normal; flex: none; width: 24px; text-align: center; }
.trial-sheet-cta {
  display: block; width: 100%; min-height: 52px; border: 0; border-radius: 16px; margin-bottom: 10px;
  background: linear-gradient(135deg, var(--tr-a), var(--tr-c)); color: var(--tr-ink);
  font-size: 17px; font-weight: 900;
}

@media (prefers-reduced-motion: reduce) {
  .tier-star, .trial-plate.is-last, .tier-ring-trial, .feed-ava-trial { animation: none !important; }
  .tier-star { opacity: 0; }
}