/* Selected banner art: separate rounded surface, live copy and overflowing foreground. */
.won-banner {
  --banner-field: radial-gradient(ellipse at 100% 50%, #154d8b77, transparent 64%), linear-gradient(120deg, #202b3a, #162235 62%, #172d4a);
  position: relative; isolation: isolate; overflow: visible; border: 0; box-shadow: none;
  background: transparent; color: #f4f6fb; border-radius: calc(18 * var(--won-unit));
}
.won-banner::before,
.home-screen .referral-card.won-banner::before,
.tasks-screen .tasks-summary.won-banner::before {
  content: ''; position: absolute; z-index: 0; inset: 0; width: auto; height: auto;
  border: 1px solid #849db23b; border-radius: inherit; background: var(--banner-field);
  transform: none; filter: none; pointer-events: none; box-shadow: inset 0 1px 0 #ffffff05;
}
.won-banner::after,
.home-event-banner.won-banner::after,
.home-screen .referral-card.won-banner::after,
.tasks-screen .tasks-summary.won-banner::after { content: none; }
.won-banner-art {
  display: block; position: absolute; z-index: 1; top: calc(-32 * var(--won-unit)); bottom: 0;
  right: 0; width: calc(174 * var(--won-unit)); overflow: hidden;
  border-radius: 0 0 calc(18 * var(--won-unit)) 0; pointer-events: none;
}
.won-banner-illustration {
  display: block; position: absolute; top: 0; right: calc(-12 * var(--won-unit));
  width: calc(200 * var(--won-unit)); height: calc(200 * var(--won-unit));
  max-width: none; object-fit: contain; opacity: 1; transform: none; filter: none;
}
/* The carousel clips horizontally, but each slide reserves headroom inside its viewport. */
.home-screen #main {
  height: calc(100svh - 179 * var(--won-unit) - var(--tg-safe-top) - max(env(safe-area-inset-bottom), var(--tg-safe-bottom)));
  min-height: calc(658 * var(--won-unit));
  grid-template-rows: calc(186 * var(--won-unit)) minmax(calc(164 * var(--won-unit)), 1fr) calc(226 * var(--won-unit)) calc(82 * var(--won-unit));
}
.home-screen #main:not(:has(.home-event-carousel)) {
  min-height: calc(472 * var(--won-unit));
  grid-template-rows: minmax(calc(164 * var(--won-unit)), 1fr) calc(226 * var(--won-unit)) calc(82 * var(--won-unit));
}
.home-event-track {
  height: 100%; gap: calc(12 * var(--won-unit)); border-radius: 0;
  overflow-x: auto; overflow-y: hidden; align-items: stretch;
}
.home-event-slide {
  position: relative; flex: 0 0 100%; min-width: 0; height: 100%;
  padding-top: calc(22 * var(--won-unit)); box-sizing: border-box;
  scroll-snap-align: start; scroll-snap-stop: always;
}
.home-event-banner.won-banner {
  display: block; width: 100%; height: calc(164 * var(--won-unit)); overflow: visible;
  --banner-field: radial-gradient(ellipse at 92% 62%, #175baa77, transparent 61%), linear-gradient(115deg, #1c293b, #11233d 70%, #1b385a);
}
.home-event-title {
  top: calc(20 * var(--won-unit)); left: calc(20 * var(--won-unit)); right: auto;
  width: calc(170 * var(--won-unit)); max-height: calc(44 * var(--won-unit));
  font-size: calc(19 * var(--won-unit)); font-weight: 600; line-height: 1.15;
  letter-spacing: calc(-.35 * var(--won-unit)); white-space: normal; text-wrap: balance;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;
}
.home-event-prize {
  top: calc(72 * var(--won-unit)); left: calc(20 * var(--won-unit));
  font-size: calc(35 * var(--won-unit)); font-weight: 650; line-height: 1.1;
  letter-spacing: calc(-1 * var(--won-unit)); font-variant-numeric: tabular-nums;
}
.home-event-prize-wide { font-size: calc(26 * var(--won-unit)); }
.home-event-time {
  top: calc(117 * var(--won-unit)); left: calc(20 * var(--won-unit));
  max-width: calc(172 * var(--won-unit)); font-size: calc(12 * var(--won-unit)); color: #b8c6da;
}
.home-event-dots { left: calc(20 * var(--won-unit)); bottom: calc(12 * var(--won-unit)); }
.home-event-banner .won-banner-art { width: calc(170 * var(--won-unit)); top: calc(-35 * var(--won-unit)); }
.home-event-banner .won-banner-illustration { width: calc(205 * var(--won-unit)); height: calc(205 * var(--won-unit)); right: calc(-20 * var(--won-unit)); }
.home-event-banner:has(img[src*="draws"]) .won-banner-illustration { height: calc(220 * var(--won-unit)); width: calc(220 * var(--won-unit)); top: calc(-8 * var(--won-unit)); right: calc(-32 * var(--won-unit)); }
/* Deliberate two-line referral heading, with the level separate from the heading. */
.home-screen .referral-card.won-banner {
  height: calc(226 * var(--won-unit)); padding: 0; border: 0; overflow: visible; backdrop-filter: none;
  --banner-field: radial-gradient(ellipse at 94% 46%, #155b825e, transparent 66%), linear-gradient(120deg, #222d3a, #192637 60%, #1b3549);
}
.referral-title-row { left: calc(20 * var(--won-unit)); top: calc(19 * var(--won-unit)); right: auto; width: calc(152 * var(--won-unit)); }
.home-screen .referral-card h1 {
  font-size: calc(22 * var(--won-unit)); font-weight: 600; line-height: 1.1;
  letter-spacing: calc(-.45 * var(--won-unit)); white-space: normal; text-wrap: initial;
}
.home-screen .referral-reward-line { left: calc(20 * var(--won-unit)); top: calc(78 * var(--won-unit)); }
.home-screen .referral-reward-line strong {
  font-size: calc(35 * var(--won-unit)); font-weight: 650; line-height: 1.1;
  letter-spacing: calc(-.8 * var(--won-unit)); font-variant-numeric: tabular-nums;
}
.home-screen .referral-reward-line > span {
  margin-top: calc(6 * var(--won-unit)); font-size: calc(12 * var(--won-unit));
  white-space: nowrap; color: #bdc8d8;
}
.referral-level-row { position: absolute; z-index: 3; top: calc(144 * var(--won-unit)); left: calc(20 * var(--won-unit)); }
.home-screen .referral-level-button {
  min-height: calc(27 * var(--won-unit)); margin: 0; padding: 0 calc(6 * var(--won-unit));
  border: 0; background: #ffffff08; color: #b5c6db; font-size: calc(11 * var(--won-unit));
}
.home-screen .referral-card > .primary-button {
  left: calc(18 * var(--won-unit)); right: calc(18 * var(--won-unit)); bottom: calc(16 * var(--won-unit));
  height: calc(39 * var(--won-unit)); font-weight: 550; font-size: calc(14 * var(--won-unit));
}
.referral-card .won-banner-art { width: calc(192 * var(--won-unit)); top: calc(-45 * var(--won-unit)); bottom: calc(59 * var(--won-unit)); border-radius: 0; }
.referral-card .won-banner-illustration { width: calc(214 * var(--won-unit)); height: calc(214 * var(--won-unit)); right: calc(-16 * var(--won-unit)); }
/* Both task reward states use exactly the same geometry. */
.tasks-screen #main { padding-top: calc(23 * var(--won-unit)); }
.tasks-screen .tasks-summary.tasks-summary-emphasis.won-banner {
  display: block; height: calc(152 * var(--won-unit)); min-height: calc(152 * var(--won-unit));
  padding: 0; margin: 0 0 calc(20 * var(--won-unit)); border: 0; background: transparent; box-shadow: none;
  --banner-field: radial-gradient(ellipse at 95% 55%, #23599370, transparent 64%), linear-gradient(115deg, #202e40, #172940 67%, #1e3d5d);
}
.tasks-screen .tasks-summary.won-banner.is-completed {
  --banner-field: radial-gradient(ellipse at 95% 55%, #22796555, transparent 64%), linear-gradient(115deg, #223530, #1b302c 67%, #244b40);
}
.tasks-screen .tasks-summary-copy {
  position: absolute; z-index: 2; left: calc(20 * var(--won-unit)); top: calc(24 * var(--won-unit));
  width: calc(174 * var(--won-unit)); max-width: calc(100% - 164 * var(--won-unit));
  display: block;
}
.tasks-screen .tasks-summary-label {
  min-height: calc(36 * var(--won-unit)); max-width: calc(166 * var(--won-unit));
  color: #c2ccdd; font-size: calc(16 * var(--won-unit)); font-weight: 500; line-height: 1.2;
}
.tasks-screen .is-completed .tasks-summary-label { color: #c4d9d0; }
.tasks-screen .tasks-summary-amount {
  font-size: calc(var(--summary-amount-size, 36) * var(--won-unit));
  font-weight: 650; line-height: 1.1; letter-spacing: calc(-.7 * var(--won-unit));
  margin-top: calc(7 * var(--won-unit));
}
.tasks-screen .tasks-summary-note { top: calc(100% + 8 * var(--won-unit)); font-size: calc(11 * var(--won-unit)); font-weight: 400; color: #b9cfbf; }
.tasks-summary .won-banner-art { top: calc(-28 * var(--won-unit)); width: calc(160 * var(--won-unit)); }
.tasks-summary .won-banner-illustration { width: calc(188 * var(--won-unit)); height: calc(188 * var(--won-unit)); right: calc(-19 * var(--won-unit)); }
/* Bonus overview: actual fund or honest empty state, not invented prize amounts. */
.bonus-content[data-subview="overview"] .page-heading { margin-bottom: calc(36 * var(--won-unit)); }
.bonus-entry-grid { gap: calc(38 * var(--won-unit)); }
.bonus-entry.won-banner {
  display: block; min-height: 0; height: calc(168 * var(--won-unit)); padding: calc(20 * var(--won-unit));
  border: 0; background: transparent; border-radius: calc(18 * var(--won-unit));
  --banner-field: radial-gradient(ellipse at 95% 52%, #275d9966, transparent 65%), linear-gradient(115deg, #222e3f, #192b46 70%, #1c3d63);
}
.bonus-entry-draws.won-banner {
  --banner-field: radial-gradient(ellipse at 95% 52%, #5d429655, transparent 65%), linear-gradient(115deg, #2a2a3d, #29253c 70%, #303453);
}
.bonus-entry-main { position: relative; z-index: 2; max-width: calc(176 * var(--won-unit)); }
.bonus-entry-title { font-size: calc(21 * var(--won-unit)); font-weight: 600; letter-spacing: calc(-.4 * var(--won-unit)); }
.bonus-entry-caption { margin: calc(13 * var(--won-unit)) 0 calc(5 * var(--won-unit)); font-size: calc(11 * var(--won-unit)); color: #b7c5da; line-height: 1.25; }
.bonus-entry-value { font-size: calc(32 * var(--won-unit)); font-weight: 650; letter-spacing: calc(-.8 * var(--won-unit)); white-space: nowrap; overflow-wrap: normal; }
.bonus-entry-value-wide { font-size: calc(25 * var(--won-unit)); }
.bonus-entry-value small { font-size: 1em; font-weight: inherit; color: inherit; }
.bonus-entry-value.is-empty { font-size: calc(18 * var(--won-unit)); font-weight: 500; letter-spacing: 0; }
.bonus-entry-foot { position: absolute; z-index: 2; bottom: calc(16 * var(--won-unit)); left: calc(20 * var(--won-unit)); right: auto; max-width: calc(175 * var(--won-unit)); font-size: calc(11 * var(--won-unit)); color: #b5c3d8; }
.bonus-entry-foot .ui-icon { display: none; }
.bonus-entry .won-banner-art { top: calc(-32 * var(--won-unit)); width: calc(166 * var(--won-unit)); }
.bonus-entry .won-banner-illustration { width: calc(198 * var(--won-unit)); height: calc(198 * var(--won-unit)); right: calc(-15 * var(--won-unit)); }
.bonus-entry-draws .won-banner-art { top: calc(-43 * var(--won-unit)); }
.bonus-entry-draws .won-banner-illustration { width: calc(210 * var(--won-unit)); height: calc(210 * var(--won-unit)); right: calc(-24 * var(--won-unit)); }
@media (prefers-reduced-motion: reduce) { .won-banner { transition: none; } }

