:root {
    --color-primary: #4A5FFF;
    --color-primary-light: #EAEBFF;
    --color-primary-hover: #3a4fe6;
    --color-bg: #F2F2F7;
    --color-card: #ffffff;
    --color-text: #111827;
    --color-text-dark: #1F2937;
    --color-text-body: #4B5563;
    --color-text-secondary: #6B7280;
    --color-text-muted: #9CA3AF;
    --color-border: #E5E7EB;
    --color-border-light: #F3F4F6;
    --color-indigo: #4F46E5;
    --color-success: #16A34A;
    --color-success-dark: #15803D;
    --color-success-light: #DCFCE7;
    --color-success-bg: #F0FDF4;
    --color-error: #DC2626;
    --color-error-light: #FEE2E2;
    --color-error-bg: #FEF2F2;
    --color-warning: #EAB308;
    --color-warning-dark: #A16207;
    --color-warning-text: #854D0E;
    --color-warning-light: #FEF3C7;
    --color-warning-bg: #FEFCE8;
    --color-warning-border: #FDE68A;
    --color-purple: #7C3AED;
    --color-purple-light: #F5F3FF;
    --color-gray-50: #F9FAFB;
    --color-gray-100: #F3F4F6;
    --color-gray-200: #E5E7EB;
    --color-gray-300: #D1D5DB;
    --color-gray-400: #9CA3AF;
    --color-pink-ticket: #FECDD3;
    --color-pink-accent: #F472B6;
    --color-pink-light: #F9A8D4;
    --radius-card: 16px;
    --radius-button: 12px;
    --radius-input: 12px;
    --radius-full: 9999px;
    --shadow-card: 0 8px 24px rgba(102, 112, 133, 0.1);
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --font-mono: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;

    /* Premium / monetization */
    --color-premium: #F59E0B;
    --color-premium-hover: #D97706;
    --color-premium-light: #FFFBEB;
    --color-premium-bg: #FEF3C7;
    --color-premium-border: #FDE68A;
    --color-premium-text: #92400E;

    /* Amber family */
    --color-amber: #F59E0B;
    --color-amber-dark: #D97706;
    --color-amber-darker: #92400E;

    /* Extended greens */
    --color-success-alt: #10B981;
    --color-success-dark-text: #065F46;

    /* Extended reds */
    --color-error-alt: #EF4444;
    --color-error-dark-text: #991B1B;

    /* Primary bg */
    --color-primary-bg: rgba(74, 95, 255, 0.08);

    /* Font weights */
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;

    /* Animation durations */
    --duration-fast: 150ms;
    --duration-normal: 300ms;
    --duration-slow: 600ms;

    /* Text darkest (used in participant pages) */
    --color-text-darkest: #000927;
}

.container_main {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 480px;
    margin: 0 auto;
    background-color: transparent;
    border-radius: 1em;
    box-sizing: border-box;
    padding: 1rem;
    min-height: 95vh;
}

.success-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    box-sizing: border-box;
    background-color: #ffffff;
    border-radius: 1em;
    box-shadow: 0 8px 24px rgba(102, 112, 133, 0.1);
    padding: 1.25em;

}

.success-section img {
    width: 7em;
    object-fit: cover;
    border-radius: 100em;
}

.main-heading {
    font-size: 1.25rem;
    line-height: 1.75rem;
    font-weight: 700;
    color: var(--color-text, #111827);
    text-align: center;
    margin-top: 0.5em;
    width: 100%;
    display: block;
}

.ticket-number {
    font-size: 0.9em;
    font-weight: 400;
    color: var(--color-text, #111827);
    text-align: center;
    margin-top: 0.25em;
    width: 100%;
}

.ticket-number.big {
    font-size: 1.5em;
    font-weight: 600;
}

.participation-text {
    font-size: 1.125rem;
    line-height: 1.75rem;
    font-weight: 600;
    color: var(--color-indigo, #4F46E5);
    text-align: center;
    margin-top: 0.5em;
    overflow-wrap: break-word;
    width: 100%;
    box-sizing: border-box;
    display: block;
}

.participation-text b {
    font-weight: 600;
}

.warning-text-container {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    border-width: 1px;
    width: 100%;
    box-sizing: border-box;
    gap: 0.75rem;
    border-radius: 0.75rem;
    border-color: rgb(254 240 138 / var(--tw-border-opacity, 1));
    background-color: rgb(254 252 232 / var(--tw-bg-opacity, 1));
    padding: 0.75em;
}

.warning-text {
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 400;
    text-align: left;
    color: rgb(133 77 14 / var(--tw-text-opacity, 1));

}

.warning-text-icon {
    width: 1.25em;
    height: 1.25em;
    vertical-align: middle;
    overflow: hidden;
    color: rgb(234 179 8 / var(--tw-text-opacity, 1));
}

.countdown-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    box-sizing: border-box;
    margin-top: 1em;
    margin-bottom: 0.75em;
}

.countdown-timer {
    font-size: 2em;
    font-weight: 700;
    color: rgb(79 70 229 / var(--tw-text-opacity, 1));
    letter-spacing: 0.05em;
    margin-top: 0.25em;
}

.countdown-label {
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 400;
    color: #6E7B8C;
    text-align: center;
}

.main-heading-label {
    font-size: 0.875rem;
    line-height: 1.625;
    font-weight: 400;
    color: rgb(75 85 99 / var(--tw-text-opacity, 1));;
    text-align: center;
    margin-top: 0.75em;
}

.action-buttons {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    box-sizing: border-box;
    margin-top: 0.75em;
}


.primary-button {
    background-color: rgb(234 235 255 / var(--tw-bg-opacity, 1));
    color: rgb(74 95 255 / var(--tw-text-opacity, 1));
    border: none;
    border-radius: 0.75em;
    padding: 0.75em 0.75em;
    font-size: 1em;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 100%;
}

.primary-button-smooth {
    background-color: rgb(74 95 255 / var(--tw-bg-opacity, 1));
    color: rgb(255 255 255 / var(--tw-text-opacity, 1));
    border: none;
    border-radius: 0.75em;
    padding-top: 1rem;
    padding-bottom: 1rem;
    font-size: 1em;
    font-weight: 700;
    width: 100%;
}


.primary-button:active {
    background-color: var(--color-primary-hover, #3a4fe6);
    color: var(--color-card, #ffffff);
}

.primary-button.inactive {
    background-color: var(--color-gray-300, #D1D5DB);
    color: var(--color-text-muted, #9CA3AF);
}

.primary-button-smooth:active {
    background-color: var(--color-primary-hover, #3a4fe6);
    color: var(--color-card, #ffffff);
}

.primary-button-smooth.inactive {
    background-color: var(--color-gray-300, #D1D5DB);
    color: var(--color-text-muted, #9CA3AF);
}

.channels-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    box-sizing: border-box;
    margin-top: 1.5em;
}

.section-title {
    font-size: 13px;
    line-height: 1.25rem;
    font-weight: 500;
    color: var(--color-text-secondary, #6B7280);
    text-align: left;
    margin-bottom: 0.25em;
    width: 100%;
}

/* Иконка платформы (TG/Max) в углу аватарки канала — как в TMA */
.channel-icon--with-badge {
    position: relative;
    overflow: visible; /* бейдж выступает за границы */
}
.channel-icon--with-badge .channel-icon__avatar {
    overflow: hidden;
    border-radius: inherit;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.channel-platform-badge {
    position: absolute;
    bottom: -3px;
    right: -3px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 1.5px solid #fff;
    overflow: hidden;
    display: block;
    box-shadow: 0 0 0 1px rgba(0,0,0,0.1);
}
.channel-platform-badge img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: flex;
}

.cards-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    box-sizing: border-box;
    margin-top: 1.5em;
    gap: 0.5em;
}

/* Не перебивать DS-карточки участника (an_tma.css + card--padded / gift / hero) */
body:not(.participant-page) .card,
body.participant-page .card.gradient,
body.participant-page .card.boost_channels_card,
body.participant-page .card.offer_card {
    display: flex;
    align-items: center;
    justify-content: left;
    width: 100%;
    box-sizing: border-box;
    border-radius: var(--radius-card, 16px);
    padding: 1em 1em;
    /* gap: 1em; */
    background-color: var(--color-card, #ffffff);
    color: var(--color-text, #111827);
    border: 1px solid var(--color-border, #E5E7EB);
    box-shadow: var(--shadow-sm, 0 1px 2px rgba(0, 0, 0, 0.05));
}

.card.offer_card {
    padding: 0.75em 1em;
    justify-content: space-between;
}

.card.gradient {
    background: linear-gradient(90deg, #00C5FE 0%, #DF51E0 100%);
    color: white;
    width: 100%;
    box-sizing: border-box;
}

.card-icon {
    width: 3em;
    height: 3em;
    border-radius: 100em;
    background-color: rgb(74 95 255 / var(--tw-bg-opacity, 1));
    border-radius: 100em;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding: 1em;
}
.card-icon.boost_icon {
    background: linear-gradient(to bottom, #60a5fa, #a855f7);
}
.share_icon {
    position: absolute;
    width: 1.25em;
    height: 1.25em;
    vertical-align: middle;
    overflow: visible;
    color: rgb(74 95 255 / var(--tw-text-opacity, 1));
    top: -0.25em;
    right: -0.25em;
    background-color: var(--color-card, #ffffff);
    border-radius: 100em;
    padding: 0.15em;
}
    

.share_icon_svg {
    width: 1.5em;
    height: 1.5em;
    overflow: visible;
    vertical-align: middle;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}



.card-icon img {
    width: 100%;
    object-fit: contain;
}

.card-icon.offer_icon {
    width: 3.2em;
    height: auto;
    border-radius: 0;
}

.card-content {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: center;
}

.card-title {
    font-size: 1em;
    font-weight: 600;
    color: rgb(31 41 55 / var(--tw-text-opacity, 1));
}

.card-title.offer_card_title {
    font-size: 0.85em;
    font-weight: 400;
    color: var(--color-text, #111827);
}

.gradient .card-title {
    color: var(--color-card, #ffffff);
}

.card-description {
    font-size: 0.85rem;
    line-height: 1.25rem;
    font-weight: 400;
    color: rgb(107 114 128 / var(--tw-text-opacity, 1));
}

.gradient .card-description {
    color: var(--color-card, #ffffff);
}

.card-button {
    font-size: 0.75em;
    font-weight: 400;
    color: var(--color-card, #ffffff);
    border-radius: 0.75em;
    padding: 0.5em 0.75em;
    background: #514CE5;
}

.card-button div {
    font-size: 1em;
    text-align: center;
}


.channel-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 0.5em;
    background-color: transparent;
    border-radius: 0.75em;
    padding: 0.5em;
    gap: 0.5em;
}
.channel-card.divided {
    background-color: #ffffff;
    box-shadow: 0 8px 24px rgba(102, 112, 133, 0.1);
    border-radius: 0.75em;
    padding: 1em;
}

.status-check{
    color: rgb(21 128 61 / var(--tw-text-opacity, 1));
    font-size: 0.75rem;
    line-height: 1rem;
    font-weight: 500;
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
    padding-left: 0.625rem;
    padding-right: 0.625rem;
    background-color: rgb(220 252 231 / var(--tw-bg-opacity, 1));
    border-radius: 100em;
}

.channel-container {
    display: flex;
    align-items: center;
    justify-content: left;
    box-sizing: border-box;
    gap: 1em;
}


.channel-icon {
    width: 2em;
    height: 2em;
    border-radius: 100em;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
}

.channel-icon img {
    width: 100%;
    border-radius: 100%;
}

.card-space{
    display: flex;
    align-items: center;
    justify-content: left;
    box-sizing: border-box;
    gap: 0.5em;
}

.default-channel-icon {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    width: 2em;
    height: 2em;
    border-radius: 100em;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size: 16px;
}


.channel-info {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    box-sizing: border-box;
    gap: 0.25em;
    max-width: 11em;
}

.channel-name {
    font-size: 1em;
    font-weight: 400;
    color: var(--color-text, #111827);
}

.channel-status {
    font-size: 0.9em;
    font-weight: 400;
    color: #6E7B8C;
}

.channel-action {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    gap: 0.5em;
}


.subscribe-btn {
    font-size: 0.75em;
    font-weight: 600;
    color: var(--color-card, #ffffff);
    border-radius: 0.75em;
    padding: 0.5em 1.25em;
    background: rgb(79 70 229 / var(--tw-bg-opacity, 1));
}


/* ========== About Raffle Modal ========== */
.about-raffle-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0);
  z-index: 50;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  transition: background-color 0.35s ease;
  pointer-events: none;
}

.about-raffle-overlay.open {
  background: rgba(0, 0, 0, 0.5);
  pointer-events: auto;
}

.about-raffle-sheet {
  width: 100%;
  max-width: 32rem;
  background: var(--color-bg, #F2F2F7);
  border-radius: 16px 16px 0 0;
  max-height: 90vh;
  overflow-y: auto;
  transform: translateY(100%);
  opacity: 0;
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.25s ease;
}

.about-raffle-overlay.open .about-raffle-sheet {
  transform: translateY(0);
  opacity: 1;
}

.about-raffle-header {
  padding: 1rem;
  position: sticky;
  top: 0;
  background: rgba(242, 242, 247, 0.85);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  z-index: 10;
  border-bottom: 1px solid var(--color-border, #E5E7EB);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.about-raffle-header-title {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--color-text, #111827);
  text-align: center;
  flex: 1;
}

.about-raffle-close {
  color: var(--color-text-secondary, #6B7280);
  padding: 0.25rem;
  border-radius: 50%;
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.about-raffle-body {
  padding: 1rem 1rem 2rem;
}

.about-raffle-how-winners {
  margin-top: 1.25rem;
  width: 100%;
  box-sizing: border-box;
}

.about-raffle-desc {
  background: var(--color-card, #ffffff);
  border: 1px solid var(--color-border, #E5E7EB);
  border-radius: 16px;
  padding: 1rem;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--color-text-body, #4B5563);
  white-space: pre-line;
  overflow-wrap: break-word;
  margin-bottom: 1rem;
}

.about-raffle-section-title {
  font-size: 13px;
  font-weight: 500;
  color: var(--color-text-secondary, #6B7280);
  padding-left: 0;
  margin: 1rem 0 0.5rem;
}

.about-raffle-card {
  background: var(--color-card, #ffffff);
  border: 1px solid var(--color-border, #E5E7EB);
  border-radius: 16px;
  overflow: hidden;
}

.about-raffle-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--color-border-light, #F3F4F6);
  min-height: 44px;
}

.about-raffle-row:last-child {
  border-bottom: none;
}

.about-raffle-label {
  font-size: 1rem;
  font-weight: 400;
  color: var(--color-text, #111827);
}

.about-raffle-value {
  font-size: 1rem;
  font-weight: 400;
  color: var(--color-text-muted, #9CA3AF);
}

.about-raffle-channel {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.625rem 1rem;
  border-bottom: 1px solid var(--color-border-light, #F3F4F6);
  cursor: pointer;
  min-height: 52px;
}

.about-raffle-channel:last-child {
  border-bottom: none;
}

.about-raffle-channel--disabled {
  cursor: not-allowed;
  opacity: 0.65;
}

.about-raffle-channel-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  position: relative;
}

.about-raffle-channel-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}

.about-raffle-channel-initial {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: linear-gradient(135deg, #4A5FFF, #C084FC);
  color: #fff;
  font-weight: 700;
  font-size: 0.875rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.about-raffle-channel-badge {
  position: absolute;
  bottom: -2px;
  right: -2px;
  width: 16px;
  height: 16px;
}

.about-raffle-channel-badge img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
}

.about-raffle-channel-name {
  font-size: 1rem;
  font-weight: 600;
  color: var(--color-text-dark, #1F2937);
}

/* --- more_info (экран ошибки подписки an_main_error_smooth и др.): разметка legacy, раньше в an_* не хватало overlay/popup — «сломанная» шторка --- */
.more_info_overlay {
	position: fixed;
	inset: 0;
	width: 100%;
	height: 100%;
	max-height: 100%;
	box-sizing: border-box;
	z-index: 6;
	visibility: hidden;
	background-color: rgba(0, 0, 0, 0.7);
	opacity: 0;
	cursor: default;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-ms-transition: 0.5s;
	-o-transition: 0.5s;
	transition: 0.3s ease-in-out;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: stretch;
	padding: 0;
	margin: 0;
}

.more_info_popup {
	position: relative;
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	justify-content: flex-start;
	align-items: stretch;
	border-top-left-radius: 1em;
	border-top-right-radius: 1em;
	border: solid black 0.05em;
	background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
	width: 100%;
	max-width: 32rem;
	min-width: 0;
	align-self: stretch;
	margin: 0 auto;
	z-index: 2;
	transform: translate(0, 45em);
	transition: 0.3s ease-in-out;
	max-height: 90vh;
	min-height: 60vh;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	padding-bottom: max(0.75rem, env(safe-area-inset-bottom, 0px));
}

.more_info_popup.show_up {
	transform: translate(0, 0);
	-webkit-transform: translate(0, 0);
	-o-transform: translate(0, 0);
	-moz-transform: translate(0, 0);
	transition: 0.3s ease-in-out;
}

.more_info_popup_cross {
	position: absolute;
	top: 0em;
	right: 0.5em;
}

.more_info_popup_cross svg {
	width: 1.5em;
}

.more_info_popup_content {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 100%;
	box-sizing: border-box;
	padding: 1em;
	background-color: rgb(243 244 246 / 0.8);
}

.more_info_popup_content_title {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: rgb(243 244 246 / 0.8);
	padding: 1em;
	border-color: rgb(229 231 235 / var(--tw-border-opacity, 1));
	border-bottom-width: 1px;
	border-bottom-style: solid;
}

.more_info_popup_content_title span {
	font-size: 1.125rem;
	line-height: 1.75rem;
	font-weight: 700;
	color: rgb(17 24 39 / var(--tw-text-opacity, 1));
	text-align: center;
	width: 100%;
}

.more_info_popup_content_text {
	width: 100%;
	box-sizing: border-box;
	padding: 1em;
	border-radius: 0.75em;
	background-color: var(--color-card, #ffffff);
	text-align: left;
	white-space: pre-line;
	line-height: 1.625;
	font-size: 0.875rem;
	box-shadow: 0 8px 24px rgba(102, 112, 133, 0.1);
	overflow-wrap: break-word;
}

.more_info_popup_content_text span {
	font-size: 0.9em;
	font-weight: 400;
	color: #000927;
	text-align: left;
	width: 100%;
	white-space: pre-line;
}

.more_info_popup_content_info {
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: start;
	justify-content: center;
	gap: 0.5em;
	margin-top: 1em;
}

.more_info_popup_content_info_item_title {
	text-align: left;
	width: 100%;
	padding: 0em 0.5em;
}

.more_info_popup_content_info_item_title span {
	font-size: 1rem;
	line-height: 1.5rem;
	font-weight: 700;
	color: rgb(107 114 128 / var(--tw-text-opacity, 1));
	text-align: left;
	width: 100%;
}

.more_info_popup_content_info_items {
	display: flex;
	flex-direction: column;
	align-items: start;
	justify-content: center;
	width: 100%;
	padding: 1em;
	border-radius: 0.75em;
	background-color: var(--color-card, #ffffff);
	text-align: left;
	box-sizing: border-box;
	box-shadow: 0 8px 24px rgba(102, 112, 133, 0.1);
	gap: 0.5em;
}

.more_info_popup_content_info_item span {
	font-size: 0.75em;
	font-weight: 500;
	color: rgb(107 114 128 / var(--tw-text-opacity, 1));
	text-align: left;
	width: 100%;
}

.more_info_popup_content_info_item_channels {
	display: flex;
	flex-direction: column;
	align-items: start;
	justify-content: center;
	width: 100%;
	border-radius: 0.75em;
	gap: 0em;
	background-color: var(--color-card, #ffffff);
	box-shadow: 0 8px 24px rgba(102, 112, 133, 0.1);
	padding: 0.75em;
}

.tickets-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    box-sizing: border-box;
    margin-top: 1.5em;
    gap: 0.5em;
}

.tickets-section .section-title {
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 600;
    color: rgb(75 85 99 / var(--tw-text-opacity, 1));
    text-align: left;
    width: 100%;
    margin-bottom: 0em;
}

.ticket-card {
    display: flex;
    align-items: center;
    justify-content: left;
    width: 100%;
    box-sizing: border-box;
    background-color: var(--color-card, #ffffff);
    border-radius: 0.75em;
    padding: 1em;
    gap: 1em;
    box-shadow: 0 8px 24px rgba(102, 112, 133, 0.1);
}

.ticket-icon {
    width: 2em;
    border-radius: 100em;
    overflow: hidden;
}

.ticket-icon img {
    width: 100%;
    object-fit: contain;
}   

.ticket-info {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: center;
    box-sizing: border-box;
    gap: 0.25em;
    width: 100%;
}

.ticket-number-text {
    font-size: 1em;
    font-weight: 600;
    color: var(--color-text, #111827);
    letter-spacing: 0.1em;
}

.ticket-date {
    font-size: 0.9em;
    font-weight: 400;
    color: #6E7B8C;
}

.ticket-position {
    font-size: 0.9em;
    font-weight: 400;
    color: var(--color-text, #111827);
}



/* Шторка «Поделиться»: как .modal-overlay + .about-raffle — на iPhone на всю ширину (flex column + stretch) */
.share_overlay {
	position: fixed;
	inset: 0;
	width: 100%;
	height: 100%;
	max-height: 100%;
	box-sizing: border-box;
	z-index: 6;
	visibility: hidden;
	background-color: rgba(0, 0, 0, 0.7);
	opacity: 0;
	cursor: default;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-ms-transition: 0.5s;
	-o-transition: 0.5s;
	transition: 0.3s ease-in-out;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: stretch;
	padding: 0;
	margin: 0;
}

.share_popup {
	position: relative;
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	justify-content: flex-start;
	align-items: stretch;
	border-top-left-radius: 1em;
	border-top-right-radius: 1em;
	border: solid black 0.05em;
	background-color: #F0EFF5;
	width: 100%;
	max-width: 32rem;
	min-width: 0;
	align-self: stretch;
	margin: 0 auto;
	z-index: 2;
	transform: translate(0, 45em);
	transition: 0.3s ease-in-out;
	max-height: 90vh;
	min-height: 40vh;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	padding-bottom: max(0.75rem, env(safe-area-inset-bottom, 0px));
}

.share_popup.show_up {
	transform: translate(0,0);
    -webkit-transform: translate(0,0); /** Safari & Chrome **/
    -o-transform: translate(0,0); /** Opera **/
    -moz-transform: translate(0,0); /** Firefox **/
	transition: .3s ease-in-out;
}

.share_popup_cross {
	position: absolute;
	top: 0.5em;
	right: 0.5em;
}

.share_popup_cross svg {
	width: 2em;
    height: 2em;
}

.share_popup_content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    box-sizing: border-box;
    padding: 1em 0.5em;
    background-color: var(--color-card, #ffffff);
}

.share_popup_content_info {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: center;
    gap: 0.5em;
    margin-top: 1em;
    padding: 0 0.5em;
}

.share_popup_content_info_item_title {
    text-align: left;
    width: 100%;
    padding: 0em 0.5em;
}

.share_popup_content_info_item_title span {
    font-size: 1.25em;
    font-weight: 400;
    color: #6E7B8C;
    text-align: left;
    width: 100%;
}


.share_popup_content_text_title {
    font-size: 1.25em;
    font-weight: 600;
    line-height: 1.25;
    color: var(--color-text, #111827);
    text-align: center;
    width: 100%;

}

.share_popup_content_text_description {
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 400;
    line-height: 1.25;
    color: rgb(75 85 99 / var(--tw-text-opacity, 1));;
    text-align: center;
    width: 100%;
}

.share_popup_content_text_description b{
    font-size: 0.875rem;
    line-height: 1.25;
    font-weight: 600;
}

.share_popup_content_info_item_share {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    box-sizing: border-box;
    gap: 0.75em;
    background-color: transparent;
    border-radius: 0.75em;
    padding: 0.5em;
    box-sizing: border-box;
}

.share_popup_content_info_item_share_link {
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 400;
    color: rgb(31 41 55 / var(--tw-text-opacity, 1));;
    text-align: left;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
    padding: 0.75em;
    background-color: #ffffff;
    border-radius: 0.75em;
    box-sizing: border-box;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(229 231 235 / var(--tw-border-opacity, 1));
}

.share_popup_content_info_item_share_buttons {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    box-sizing: border-box;
    gap: 0.75em;
    margin-bottom: 1.5em;
}

.share_popup_content_info_item_share_button {
    font-size: 1em;
    font-weight: 600;
    color: var(--color-card, #ffffff);
    text-align: left;
    width: 100%;
    padding: 1em 0.25em;
    background-color: rgb(74 95 255 / var(--tw-bg-opacity, 1));;
    border-radius: 0.75em;
    box-sizing: border-box;
    text-align: center;
}

.share_popup_content_info_item_share_button:active {
    background-color: var(--color-success-alt, #10B981);
    color: var(--color-card, #ffffff);
}

.success_svg_container {
    width: 14em;
    height: 7em;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

#outerCircle,
#confetti {
  opacity: 0;
  transform: scale(1);
}

#core, #outerCircle {
    transform: scale(0.7);
    opacity: 0;
    transform-origin: 364px 305px;
    animation: appearZoom 0.8s ease-out forwards;
  }
  
  @keyframes appearZoom {
    to {
      transform: scale(1);
      opacity: 1;
    }
  }

#core, #outerCircle {
    transform-origin: 364px 305px;
  }


/* Корона — мягкое увеличение */
#crownGroup {
    transform-origin: 340px 314px;
    transform: scale(0.8);
    opacity: 0;
    animation: crownAppear 0.8s ease-out forwards;
  }
  
  @keyframes crownAppear {
    to {
      transform: scale(1);
      opacity: 1;
    }
  }
  
  /* Кольца — плавное появление */
  #ringsGroup {
    transform-origin: 340px 314px;
    transform: scale(0.8);
    opacity: 0;
    animation: ringsBurst 0.6s ease-out forwards;
  }

  @keyframes ringsBurst {
    to {
      transform: scale(1);
      opacity: 1;
    }
  }


  @keyframes shakeAndStop {
    0%   { transform: rotate(0deg); }
    10%  { transform: rotate(-20deg); }
    20%  { transform: rotate(20deg); }
    30%  { transform: rotate(-10deg); }
    40%  { transform: rotate(10deg); }
    50%  { transform: rotate(-5deg); }
    60%  { transform: rotate(5deg); }
    70%  { transform: rotate(-2deg); }
    80%  { transform: rotate(2deg); }
    90%  { transform: rotate(0deg); }
    100% { transform: rotate(0deg); }
  }
  
  #cross {
    animation: shakeAndStop 2s ease-in-out infinite;
    transform-origin: center;
  }

  .emoji lottie-player {
    width: 1.2em;
    height: 1.2em;
    display: inline-block;
}

/* Стили для анимированных эмоджи */
.emoji {
    display: inline-block;
    width: 1.2em;
    height: 1.2em;
    vertical-align: middle;
    margin: 0 0.1em; /* Небольшие отступы между эмоджи и текстом */
}

/* Стили для контейнера с описанием розыгрыша */
.raffle-description {
    white-space: pre-line; /* Сохраняет переносы строк */
    line-height: 1.6; /* Улучшает читаемость */
    word-wrap: break-word; /* Перенос длинных слов */
}

.special_offers_overlay {
	position: fixed;
	inset: 0;
	width: 100%;
	height: 100%;
	max-height: 100%;
	box-sizing: border-box;
	z-index: 6;
	visibility: hidden;
	background-color: rgba(0, 0, 0, 0.7);
	opacity: 0;
	cursor: default;
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-ms-transition: 0.5s;
	-o-transition: 0.5s;
	transition: 0.3s ease-in-out;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: stretch;
	padding: 0;
	margin: 0;
}


.special_offers_popup {
	position: relative;
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	justify-content: flex-start;
	align-items: stretch;
	border-top-left-radius: 1em;
	border-top-right-radius: 1em;
	border: solid black 0.05em;
	background-color: #F0EFF5;
	width: 100%;
	max-width: 32rem;
	min-width: 0;
	align-self: stretch;
	margin: 0 auto;
	z-index: 3;
	transform: translate(0, 45em);
	transition: 0.3s ease-in-out;
	max-height: 90vh;
	min-height: 60vh;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	padding-bottom: max(0.75rem, env(safe-area-inset-bottom, 0px));
}

.special_offers_popup.show_up {
	transform: translate(0,0);
    -webkit-transform: translate(0,0); /** Safari & Chrome **/
    -o-transform: translate(0,0); /** Opera **/
    -moz-transform: translate(0,0); /** Firefox **/
	transition: .3s ease-in-out;
}

.special_offers_popup_cross {
	position: absolute;
	top: 0em;
	right: 0.5em;
}

.special_offers_popup_cross svg {
	width: 1.5em;
}

.special_offers_popup_content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    box-sizing: border-box;
    padding: 1em 0.5em;
}

.special_offers_popup_content_title {
    /* margin-bottom: 1em; */
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.special_offers_popup_content_title span {
    font-size: 1em;
    font-weight: 600;
    color: var(--color-text, #111827);
    text-align: center;
    margin-bottom: 1em;
    width: 100%;
}


.special_offers_popup_content_offers {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    box-sizing: border-box;
    gap: 0.75em;
}

/* Стили для карточек offers внутри overlay */
.special_offers_popup_content_offers .card.offer_card {
    background: white;
    border-radius: 1em;
    padding: 0.5em;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    width: 100%;
    box-sizing: border-box;
}

.special_offers_popup_content_offers .card.offer_card .card-space {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    box-sizing: border-box;
    gap: 0.5em;
}

.special_offers_popup_content_offers .card.offer_card .card-icon.offer_icon {
    width: 3em;
    height: 3em;
    border-radius: 0.5em;
    overflow: hidden;
    flex-shrink: 0;
}

.special_offers_popup_content_offers .card.offer_card .card-icon.offer_icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.special_offers_popup_content_offers .card.offer_card .card-content {
    flex: 1;
    min-width: 0; /* Позволяет тексту сжиматься */
}

.special_offers_popup_content_offers .card.offer_card .card-title.offer_card_title {
    font-size: 0.9em;
    font-weight: 500;
    color: var(--color-text, #111827);
    line-height: 1.3;
    margin: 0;
}

.special_offers_popup_content_offers .card.offer_card .card-button {
    background: #514CE5;
    color: white;
    border: none;
    padding: 0.6em 1em;
    border-radius: 0.5em;
    font-size: 0.7em;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.3s ease;
    flex-shrink: 0;
}

.special_offers_popup_content_offers .card.offer_card .card-button:hover {
    background: #3d37b3;
}

.special_offers_popup_content_offer_card {
    display: flex;
    align-items: center;
    justify-content: left;
    width: 100%;
    box-sizing: border-box;
}

.special_offers_popup_content_offer_icon {
    width: 2.2em;
    border-radius: 100em;
    overflow: hidden;
}

.special_offers_popup_content_offer_icon img {
    width: 100%;
    object-fit: contain;
}

.special_offers_popup_content_offer_content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    box-sizing: border-box;
}

.special_offers_popup_content_offer_title {
    font-size: 1em;
    font-weight: 400;
    color: var(--color-text, #111827);
    text-align: left;
    width: 100%;
}

.special_offers_popup_content_offer_button {
    font-size: 0.9em;
    font-weight: 400;
    color: var(--color-card, #ffffff);
    text-align: left;
    width: 100%;
    padding: 0.5em 0.75em;
    background-color: #514CE5;
    border-radius: 0.75em;
    box-sizing: border-box;
    text-align: center;
}

.special_offers_popup_content_more {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    box-sizing: border-box;
    gap: 0.5em;
    margin-top: 4em;
   
}

.special_offers_popup_content_more_text {
    font-size: 1em;
    width: 100%;
    box-sizing: border-box;
    background-color: var(--color-card, #ffffff);
    padding: 0.5em 1em;
    border-radius: 0.75em;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.special_offers_popup_content_more_text span {
    font-size: 0.75em;
    font-weight: 400;
    color: var(--color-text, #111827);
    text-align: left;
}

/* Стили для попапа детального просмотра offer */
.offer_detail_overlay {
	position: fixed;
	inset: 0;
	width: 100%;
	height: 100%;
	max-height: 100%;
	box-sizing: border-box;
	z-index: 9999;
	visibility: hidden;
	background-color: rgba(0, 0, 0, 0.7);
	opacity: 0;
	cursor: default;
	transition: 0.3s ease-in-out;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: stretch;
	padding: 0;
	margin: 0;
}


.offer_detail_popup {
	position: relative;
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	justify-content: flex-start;
	align-items: stretch;
	border-top-left-radius: 1em;
	border-top-right-radius: 1em;
	border: solid black 0.05em;
	background-color: #F0EFF5;
	width: 100%;
	max-width: 32rem;
	min-width: 0;
	align-self: stretch;
	margin: 0 auto;
	z-index: 10000;
	transform: translate(0, 45em);
	transition: 0.3s ease-in-out;
	max-height: 90vh;
	min-height: 60vh;
	overflow: hidden;
	padding-bottom: max(0.75rem, env(safe-area-inset-bottom, 0px));
}

.offer_detail_popup.show_up {
	transform: translate(0,0);
    -webkit-transform: translate(0,0); /** Safari & Chrome **/
    -o-transform: translate(0,0); /** Opera **/
    -moz-transform: translate(0,0); /** Firefox **/
	transition: .3s ease-in-out;
}

.offer_detail_popup_cross {
    position: absolute;
    top: 0.5em;
    right: 0.5em;
    cursor: pointer;
    z-index: 10001; /* Выше всех остальных элементов */
    pointer-events: auto; /* Явно разрешаем клики */
    padding: 0.5em; /* Увеличиваем кликабельную область */
    background: rgba(255, 255, 255, 0.1); /* Легкий фон для видимости */
    border-radius: 50%; /* Круглая область */
}

.offer_detail_popup_cross svg {
    width: 1.5em;
    height: 1.5em;
    pointer-events: none; /* Отключаем клики по SVG, чтобы они проходили к родителю */
}

.offer_detail_popup_content {
    width: 100%;
    padding: 2em 1.5em 0 1.5em;
    box-sizing: border-box;
    position: relative;
    min-height: 100%;
    padding-bottom: 5em; /* Место для закрепленной кнопки */
    overflow-y: auto; /* Добавляем скролл для контента */
    max-height: calc(90vh - 4em); /* Высота минус место для кнопки */
}

.offer_detail_popup_content_title {
    text-align: center;
    margin-bottom: 1.5em;
}

.offer_detail_popup_content_title span {
    font-size: 1.3em;
    font-weight: 700;
    color: var(--color-text, #111827);
    line-height: 1.3;
}

.offer_detail_popup_content_description {
    margin-bottom: 2em;
    line-height: 1.6;
    color: var(--color-text, #111827);
}

/* Стили для HTML тегов в описании offers */
.offer_detail_popup_content_description strong,
.offer_detail_popup_content_description b {
    font-weight: 700;
    color: var(--color-text, #111827);
}

.offer_detail_popup_content_description em,
.offer_detail_popup_content_description i {
    font-style: italic;
    color: var(--color-text, #111827);
}

.offer_detail_popup_content_description u {
    text-decoration: underline;
    color: var(--color-text, #111827);
}

.offer_detail_popup_content_description s,
.offer_detail_popup_content_description strike {
    text-decoration: line-through;
    color: #666;
}

.offer_detail_popup_content_description h1,
.offer_detail_popup_content_description h2,
.offer_detail_popup_content_description h3,
.offer_detail_popup_content_description h4,
.offer_detail_popup_content_description h5,
.offer_detail_popup_content_description h6 {
    font-weight: 700;
    color: var(--color-text, #111827);
    margin: 1em 0 0.5em 0;
    line-height: 1.3;
}

.offer_detail_popup_content_description h1 { font-size: 1.4em; }
.offer_detail_popup_content_description h2 { font-size: 1.3em; }
.offer_detail_popup_content_description h3 { font-size: 1.2em; }
.offer_detail_popup_content_description h4 { font-size: 1.1em; }
.offer_detail_popup_content_description h5 { font-size: 1em; }
.offer_detail_popup_content_description h6 { font-size: 0.9em; }

.offer_detail_popup_content_description p {
    margin: 0.5em 0;
    line-height: 1.6;
}

.offer_detail_popup_content_description ul,
.offer_detail_popup_content_description ol {
    margin: 0.5em 0;
    padding-left: 1.5em;
}

.offer_detail_popup_content_description li {
    margin: 0.3em 0;
    line-height: 1.5;
}

.offer_detail_popup_content_description blockquote {
    margin: 1em 0;
    padding: 0.5em 1em;
    border-left: 3px solid #514CE5;
    background-color: rgba(81, 76, 229, 0.1);
    font-style: italic;
}

.offer_detail_popup_content_description code {
    background-color: #f0f0f0;
    padding: 0.2em 0.4em;
    border-radius: 0.3em;
    font-family: 'Courier New', monospace;
    font-size: 0.9em;
}

.offer_detail_popup_content_description pre {
    background-color: #f0f0f0;
    padding: 1em;
    border-radius: 0.5em;
    overflow-x: auto;
    font-family: 'Courier New', monospace;
    font-size: 0.9em;
    line-height: 1.4;
}

.offer_detail_popup_content_description a {
    color: #514CE5;
    text-decoration: underline;
}

.offer_detail_popup_content_description a:hover {
    color: #3d37b3;
    text-decoration: none;
}

.offer_detail_popup_content_description mark {
    background-color: #fff3cd;
    padding: 0.1em 0.3em;
    border-radius: 0.2em;
}

.offer_detail_popup_content_description small {
    font-size: 0.85em;
    color: #666;
}

.offer_detail_popup_content_description sup {
    font-size: 0.75em;
    vertical-align: super;
}

.offer_detail_popup_content_description sub {
    font-size: 0.75em;
    vertical-align: sub;
}

/* Дополнительные стили для таблиц и других элементов */
.offer_detail_popup_content_description table {
    width: 100%;
    border-collapse: collapse;
    margin: 1em 0;
    background-color: white;
    border-radius: 0.5em;
    overflow: hidden;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.offer_detail_popup_content_description th,
.offer_detail_popup_content_description td {
    padding: 0.5em;
    text-align: left;
    border-bottom: 1px solid #e0e0e0;
}

.offer_detail_popup_content_description th {
    background-color: #f8f9fa;
    font-weight: 600;
    color: var(--color-text, #111827);
}

.offer_detail_popup_content_description tr:hover {
    background-color: #f8f9fa;
}

.offer_detail_popup_content_description hr {
    border: none;
    border-top: 1px solid #e0e0e0;
    margin: 1em 0;
}

/* Стили для вложенных списков */
.offer_detail_popup_content_description ul ul,
.offer_detail_popup_content_description ol ol,
.offer_detail_popup_content_description ul ol,
.offer_detail_popup_content_description ol ul {
    margin: 0.2em 0;
    padding-left: 1.5em;
}

/* Стили для определений */
.offer_detail_popup_content_description dl {
    margin: 1em 0;
}

.offer_detail_popup_content_description dt {
    font-weight: 600;
    color: var(--color-text, #111827);
    margin-top: 0.5em;
}

.offer_detail_popup_content_description dd {
    margin-left: 1em;
    margin-bottom: 0.5em;
    color: #333;
}

.offer_detail_popup_content_button {
    width: 100%;
    text-align: center;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: transparent;
    padding: 1em 1.5em;
    box-sizing: border-box;
}

.offer_detail_button {
    display: block;
    width: 100%;
    background: #514CE5;
    color: white;
    text-decoration: none;
    padding: 1em;
    border-radius: 0.75em;
    font-size: 1em;
    font-weight: 600;
    transition: background-color 0.3s ease;
    box-sizing: border-box;
    text-align: center;
}

.offer_detail_button:hover {
    background: #3d37b3;
    color: white;
    text-decoration: none;
}


.main-heading-info {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    box-sizing: border-box;
    padding: 1em 0.75em;
    /* Фон и обводка были зашиты числами — плашку «Розыгрыш завершён» нельзя было
       перекрасить ничем. Теперь переменные, фолбэк — прежние значения.
       Держать синхронно с branded/an_main_smooth.css. */
    background-color: var(--finished-bg, rgb(249 250 251 / var(--tw-bg-opacity, 1)));
    border-width: 1px;
    border-radius: 0.75rem;
    border-color: var(--finished-border, rgb(243 244 246 / var(--tw-border-opacity, 1)));
    gap: 0.25em;
    margin-top: 1em;
}

.main-heading-info-general {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    box-sizing: border-box;
    gap: 0.5em;
}

.main-heading-info-general svg {
    width: 1em;
    height: 1em;
}

.main-heading-info-general span {
    color: rgb(107 114 128 / var(--tw-text-opacity, 1));
    letter-spacing: 0.05em;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 0.75rem;
    line-height: 1rem;
    text-align: left;
}


.main-heading-info-title {
    color: rgb(31 41 55 / var(--tw-text-opacity, 1));
    font-weight: 600;
    font-size: 0.875rem;
    line-height: 1.25rem;
    text-align: center;
}

.main-heading-info-date {
    color: rgb(75 85 99 / var(--tw-text-opacity, 1));
    font-size: 0.875rem;
    line-height: 1.25rem;
    text-align: center;
}

.boost_channels_cards_section {
    display: flex;
    flex-direction: column;
    gap: 0.25em;
    padding: 1em;
    box-sizing: border-box;
    background-color: white;
    border-radius: 0.75em;
    box-shadow: 0 8px 24px rgba(102, 112, 133, 0.1);
    width: 100%;
}

.boost_channels_cards_section a {
    text-decoration: none;
}

.boost_channel_card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5em;
    background-color: #fff;
    border-radius: 0.75em;
    padding: 0.75em;
    border: 1px solid rgb(243 244 246 / var(--tw-border-opacity, 1));
    box-sizing: border-box;
}

.boost_channel_card_content {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.5em;
}

.boost_channel_card_icon {
    width: 2.5em;
    height: 2.5em;
    border-radius: 0.5em;
}

.boost_channel_card_icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.boost_channel_card_title {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--color-text, #111827);
}

.boost_channel_card_button {
    display: flex;
    align-items: center;
    gap: 0.25em;
    background-color: rgb(245 243 255 / var(--tw-bg-opacity, 1));
    color: #fff;
    padding: 0.375em 0.75em;
    border-radius: 0.5em;
}

.boost_channel_card_button span {
    color: rgb(124 58 237 / var(--tw-text-opacity, 1));
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1.25rem;
    text-align: center;
}

.boost_channel_card_button svg {
    width: 0.875em;
    height: 0.875em;
}

.card.boost_channels_card {
   padding: 0;
   box-shadow: none;
   padding-bottom: 0.5em;
}

.share_icon.boost_icon_plus {
    color: rgb(168 85 247 / var(--tw-text-opacity, 1));
}

.boost_channels_cards_section_footer {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 0.5em;
    padding: 0.5em 0;
    box-sizing: border-box;
}

.boost_channels_cards_section_footer_boost_button {
    background-color: rgb(74 95 255 / var(--tw-bg-opacity, 1));
    color: rgb(255 255 255 / var(--tw-text-opacity, 1));
    border: none;
    border-radius: 0.75em;
    padding-top: 1rem;
    padding-bottom: 1rem;
    font-size: 1em;
    font-weight: 700;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
    margin-top: 0.5em;
}

.boost_channels_cards_section_footer_boost_button:hover {
    background-color: var(--color-primary-hover, #3a4fe6);
}

.boost_channels_cards_section_footer_boost_button.inactive {
    background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1));;
    color: rgb(107 114 128 / var(--tw-text-opacity, 1));;
}

.boost_channels_cards_section_footer_info {
    color: rgb(74 95 255 / var(--tw-text-opacity, 1));
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.25rem;
    text-align: center;
    width: 100%;
    box-sizing: border-box;
}

/* --- Sync modal (связка аккаунтов) для joint-розыгрыша --- */
.sync_modal_overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background-color: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    box-sizing: border-box;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition: visibility 0.3s, opacity 0.3s;
}

.sync_modal_overlay.sync_modal_show {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
}

.sync_modal_popup {
    background: #fff;
    border-radius: 16px;
    max-width: 90%;
    width: 340px;
    padding: 1.25rem;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
    max-height: 85vh;
    overflow-y: auto;
}

.sync_modal_header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.sync_modal_title {
    font-weight: 600;
    font-size: 1.1rem;
}

.sync_modal_close {
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px;
    color: #6b7280;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sync_modal_close:hover {
    color: #374151;
}

.sync_modal_close svg {
    width: 24px;
    height: 24px;
}

.sync-modal-platforms {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.sync-modal-platform-icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #f3f4f6;
    border: 1.5px solid #e5e7eb;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.sync-modal-platform-icon img {
    width: 26px;
    height: 26px;
    object-fit: contain;
}

.sync-modal-arrow {
    color: #6b7280;
    font-size: 1.25rem;
}

.sync-link-box {
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 0.625rem 0.875rem;
    font-family: monospace;
    font-size: 0.75rem;
    color: #374151;
    word-break: break-all;
    margin: 0.75rem 0;
    user-select: all;
}

.sync-link-box--clickable {
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
}

.sync-link-box--clickable:active {
    background: #f3f4f6;
}

.sync-link-box--copied {
    background: #d1fae5 !important;
    border-color: #10b981 !important;
}

.sync-warning-note {
    font-size: 0.75rem;
    color: #dc2626;
    font-weight: 500;
    padding: 0.5rem 0.625rem;
    background: #fef2f2;
    border-radius: 8px;
    margin-top: 0.5rem;
}

/* Подарок, .card--compact, .interactive, .animate-fade-in — только an_tma.css (раньше дубль здесь перебивал DS и был битый var(or-border-light--col)) */

/* Participant an_* + DS: кнопка «Подождите (N сек)» */
.participant-page .btn.inactive {
  opacity: 0.55;
  cursor: not-allowed;
}

/* ===== EMERGE gift block (разовый промо-блок: промокод EMERGE) ===== */
.emerge-block {
  background: #fff;
  border: 1px solid #eef0f2;
  border-radius: 16px;
  padding: 0.625rem 0.875rem;
  overflow: hidden;
}
.emerge-content {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  justify-content: space-between;
  width: 100%;
}
.emerge-info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.emerge-title {
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--color-text-dark, #0f0f0f);
  margin-bottom: 1px;
}
.emerge-subtitle {
  font-size: 0.625rem;
  color: var(--color-text-secondary, #6b7280);
  margin-bottom: 0.4rem;
  white-space: nowrap;
  position: relative;
  z-index: 2;
}
.emerge-code {
  display: inline-block;
  background: #fde3ea;
  color: #0f0f0f;
  font-weight: 700;
  font-size: 0.85rem;
  letter-spacing: 0.05em;
  padding: 0.3rem 0.625rem;
  border-radius: 8px;
  border: none;
  cursor: pointer;
  font-family: "Anonymous Pro", ui-monospace, SFMono-Regular, monospace;
  transition: background 0.2s;
}
.emerge-code:active { background: #f8cdd9; }
.emerge-code.copied { background: #d6f5dd; }
.emerge-cta {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  margin-top: 0.4rem;
  color: var(--color-primary, #2563eb);
  font-weight: 900;
  font-size: 0.8rem;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  transition: color 0.2s;
}
.emerge-cta:hover { color: var(--color-primary-hover, #1d4ed8); }
.emerge-cta svg { width: 16px; height: 16px; }
.emerge-image-wrap {
  flex-shrink: 0;
  width: 6rem;
  height: 5.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.emerge-image {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}