/* Midnight emerald palette for the rewards area. */
.v3-rewards-page {
  --rewards-mint: #43e0b0;
  --rewards-mint-strong: #16b98a;
  --rewards-cyan: #79e7f2;
  --rewards-gold: #ffd166;
}

.v3-rewards-hero {
  background:
    radial-gradient(circle at 88% 18%, rgba(67, 224, 176, .24), transparent 32%),
    radial-gradient(circle at 8% 100%, rgba(121, 231, 242, .14), transparent 38%),
    linear-gradient(135deg, #0b2929 0%, #123b3b 52%, #14302e 100%) !important;
  border: 1px solid rgba(121, 231, 242, .28) !important;
  box-shadow: 0 24px 48px -18px rgba(0, 0, 0, .75), inset 0 1px 0 rgba(255, 255, 255, .08) !important;
}

.v3-rewards-badge {
  color: #9af5dc !important;
  background: rgba(67, 224, 176, .16) !important;
  border-color: rgba(67, 224, 176, .4) !important;
}

.v3-rewards-highlight {
  background: linear-gradient(90deg, #43e0b0 0%, #79e7f2 55%, #ffd166 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

.v3-rewards-art-glow {
  background: radial-gradient(circle, rgba(67, 224, 176, .42) 0%, rgba(67, 224, 176, 0) 70%) !important;
}

.v3-rewards-art-icon {
  color: var(--rewards-gold) !important;
  filter: drop-shadow(0 0 18px rgba(255, 209, 102, .6)) !important;
}

.v3-checkin-card {
  background:
    radial-gradient(circle at 92% 4%, rgba(67, 224, 176, .24), transparent 36%),
    linear-gradient(135deg, #102c2b 0%, #123b38 58%, #183c31 100%) !important;
  border: 1px solid rgba(67, 224, 176, .42) !important;
  box-shadow: 0 20px 42px -16px rgba(0, 0, 0, .72), inset 0 1px 0 rgba(255, 255, 255, .08) !important;
}

.v3-checkin-tag,
.v3-checkin-coin-box svg,
.v3-checkin-coin-box strong {
  color: var(--rewards-gold) !important;
}

.v3-checkin-streak {
  color: #9af5dc !important;
  background: rgba(67, 224, 176, .14) !important;
  border-color: rgba(67, 224, 176, .38) !important;
  box-shadow: none !important;
}

.v3-checkin-btn {
  background: linear-gradient(135deg, #24c99b, #119a7b) !important;
  box-shadow: 0 10px 24px rgba(22, 185, 138, .32) !important;
}

.v3-checkin-btn:hover:not(:disabled) {
  background: linear-gradient(135deg, #43e0b0, #16b98a) !important;
  box-shadow: 0 14px 28px rgba(22, 185, 138, .42) !important;
}

.v3-checkin-stats {
  border-top-color: rgba(154, 245, 220, .2) !important;
}

.v3-welcome-card {
  border-color: rgba(67, 224, 176, .24) !important;
}

.v3-welcome-amount-pill {
  color: #9af5dc !important;
  background: rgba(67, 224, 176, .12) !important;
  border-color: rgba(67, 224, 176, .3) !important;
}

.v3-welcome-amount-current,
.v3-welcome-progress-percent {
  color: var(--rewards-mint) !important;
}

.v3-welcome-progress-fill {
  background: linear-gradient(90deg, #16b98a, #79e7f2) !important;
}

.v3-milestone-item.is-next {
  background: rgba(67, 224, 176, .12) !important;
  border-color: var(--rewards-mint) !important;
  box-shadow: 0 0 0 2px rgba(67, 224, 176, .18) !important;
}

.v3-milestone-item.is-next .v3-milestone-icon,
.v3-milestone-next-tag {
  background: var(--rewards-mint-strong) !important;
}

/* Warm coral/orange variant inspired by the supplied mobile reference. */
.v3-rewards-page {
  --rewards-coral: #ff6848;
  --rewards-orange: #ff8a32;
  --rewards-yellow: #ffe56a;
  --rewards-cream: #fff8e8;
  --rewards-ink: #6f2a1d;
}

.v3-rewards-hero {
  background:
    radial-gradient(circle at 86% 14%, rgba(255, 229, 106, .42), transparent 28%),
    radial-gradient(circle at 14% 96%, rgba(255, 138, 50, .4), transparent 38%),
    linear-gradient(135deg, #ff6748 0%, #ff7640 48%, #ffbd4b 100%) !important;
  border: 1px solid rgba(255, 255, 255, .42) !important;
  box-shadow: 0 24px 48px -18px rgba(167, 57, 24, .48), inset 0 1px 0 rgba(255, 255, 255, .28) !important;
}

.v3-rewards-hero h1,
.v3-rewards-hero p {
  color: #fffaf2 !important;
  text-shadow: 0 1px 2px rgba(126, 40, 21, .18);
}

.v3-rewards-badge {
  color: #fff8df !important;
  background: rgba(133, 42, 22, .2) !important;
  border-color: rgba(255, 241, 184, .55) !important;
}

.v3-rewards-highlight {
  background: linear-gradient(90deg, #fff9df 0%, #ffe56a 58%, #fff1b0 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

.v3-rewards-art-glow {
  background: radial-gradient(circle, rgba(255, 244, 170, .7) 0%, rgba(255, 244, 170, 0) 70%) !important;
}

.v3-rewards-art-icon {
  color: #fff1a8 !important;
  filter: drop-shadow(0 0 18px rgba(255, 247, 184, .76)) !important;
}

.v3-checkin-card {
  background:
    radial-gradient(circle at 90% 0%, rgba(255, 225, 116, .35), transparent 34%),
    linear-gradient(145deg, #8e3028 0%, #c84b2e 44%, #ff8a32 100%) !important;
  border: 1px solid rgba(255, 210, 112, .62) !important;
  box-shadow: 0 22px 44px -16px rgba(137, 44, 26, .58), inset 0 1px 0 rgba(255, 255, 255, .18) !important;
}

.v3-checkin-tag,
.v3-checkin-coin-box svg,
.v3-checkin-coin-box strong,
.v3-checkin-streak {
  color: #ffe77b !important;
}

.v3-checkin-streak {
  background: rgba(122, 37, 23, .24) !important;
  border-color: rgba(255, 231, 123, .48) !important;
}

.v3-checkin-desc,
.v3-checkin-stats small,
.v3-checkin-stats strong {
  color: #fff8ef !important;
}

.v3-checkin-btn {
  color: #7a2b1d !important;
  background: linear-gradient(135deg, #fff4b0, #ffd85c) !important;
  box-shadow: 0 10px 24px rgba(113, 35, 20, .24) !important;
}

.v3-checkin-btn:hover:not(:disabled) {
  background: linear-gradient(135deg, #fffbe0, #ffe77b) !important;
  box-shadow: 0 14px 28px rgba(113, 35, 20, .32) !important;
}

.v3-checkin-stats {
  border-top-color: rgba(255, 248, 239, .26) !important;
}

.v3-welcome-card {
  border-color: rgba(255, 138, 50, .32) !important;
}

.v3-welcome-amount-pill {
  color: #9f451e !important;
  background: #fff1c6 !important;
  border-color: #ffd37a !important;
}

.v3-welcome-amount-current,
.v3-welcome-progress-percent,
.v3-milestone-reward {
  color: #e45c27 !important;
}

.v3-welcome-progress-fill {
  background: linear-gradient(90deg, #ff6848, #ffb23e, #ffe56a) !important;
}

.v3-milestone-item.is-next {
  background: #fff4d6 !important;
  border-color: #ff9a3d !important;
  box-shadow: 0 0 0 2px rgba(255, 154, 61, .2) !important;
}

.v3-milestone-item.is-next .v3-milestone-icon,
.v3-milestone-next-tag {
  color: #fff !important;
  background: #f4772f !important;
}

/* Muted copper tuning for the dark site shell. */
.v3-rewards-page {
  --rewards-coral: #c65e3d;
  --rewards-orange: #b8753c;
  --rewards-yellow: #e2b75d;
  --rewards-cream: #f4e4c2;
}

.v3-rewards-hero {
  background:
    radial-gradient(circle at 88% 16%, rgba(226, 183, 93, .18), transparent 28%),
    radial-gradient(circle at 10% 100%, rgba(198, 94, 61, .2), transparent 40%),
    linear-gradient(135deg, #522b2b 0%, #68402f 52%, #725333 100%) !important;
  border-color: rgba(226, 183, 93, .3) !important;
  box-shadow: 0 22px 44px -18px rgba(0, 0, 0, .7), inset 0 1px 0 rgba(255, 255, 255, .08) !important;
}

.v3-rewards-hero h1,
.v3-rewards-hero p {
  text-shadow: none;
}

.v3-rewards-badge {
  color: #f3d68f !important;
  background: rgba(198, 94, 61, .22) !important;
  border-color: rgba(226, 183, 93, .36) !important;
}

.v3-rewards-highlight {
  background: linear-gradient(90deg, #f1d18b 0%, #e2b75d 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

.v3-rewards-art-glow {
  background: radial-gradient(circle, rgba(226, 183, 93, .3) 0%, rgba(226, 183, 93, 0) 70%) !important;
}

.v3-rewards-art-icon {
  color: #e2b75d !important;
  filter: drop-shadow(0 0 14px rgba(226, 183, 93, .4)) !important;
}

.v3-checkin-card {
  background:
    radial-gradient(circle at 92% 0%, rgba(226, 183, 93, .16), transparent 34%),
    linear-gradient(145deg, #492a2b 0%, #633832 48%, #785238 100%) !important;
  border-color: rgba(226, 183, 93, .38) !important;
  box-shadow: 0 20px 40px -18px rgba(0, 0, 0, .72), inset 0 1px 0 rgba(255, 255, 255, .08) !important;
}

.v3-checkin-tag,
.v3-checkin-coin-box svg,
.v3-checkin-coin-box strong,
.v3-checkin-streak {
  color: #e2b75d !important;
}

.v3-checkin-streak {
  background: rgba(85, 44, 38, .42) !important;
  border-color: rgba(226, 183, 93, .3) !important;
}

.v3-checkin-btn {
  color: #5b3029 !important;
  background: #e7c779 !important;
  box-shadow: 0 8px 20px rgba(30, 13, 10, .22) !important;
}

.v3-checkin-btn:hover:not(:disabled) {
  background: #f0d58f !important;
  box-shadow: 0 10px 24px rgba(30, 13, 10, .28) !important;
}

.v3-welcome-amount-pill {
  color: #bf6338 !important;
  background: #f5e6c7 !important;
  border-color: #dfbc77 !important;
}

.v3-welcome-amount-current,
.v3-welcome-progress-percent,
.v3-milestone-reward {
  color: #c66b3f !important;
}

.v3-welcome-progress-fill {
  background: linear-gradient(90deg, #b85b3d, #d19a52) !important;
}

.v3-milestone-item.is-next {
  background: #f5e8cd !important;
  border-color: #c9894c !important;
  box-shadow: 0 0 0 2px rgba(201, 137, 76, .16) !important;
}

.v3-milestone-item.is-next .v3-milestone-icon,
.v3-milestone-next-tag {
  background: #bd6c43 !important;
}

/* Netflix-inspired charcoal and red variant. */
.v3-rewards-page {
  --rewards-netflix-red: #e50914;
  --rewards-netflix-red-soft: #b20710;
  --rewards-netflix-surface: #181818;
  --rewards-netflix-surface-2: #232323;
}

.v3-rewards-hero {
  background: #1b1b1b !important;
  border: 1px solid #3b3b3b !important;
  border-top: 3px solid var(--rewards-netflix-red) !important;
  box-shadow: 0 18px 36px -18px rgba(0, 0, 0, .9) !important;
}

.v3-rewards-hero h1,
.v3-rewards-hero p {
  color: #fff !important;
}

.v3-rewards-badge {
  color: #fff !important;
  background: rgba(229, 9, 20, .16) !important;
  border-color: rgba(229, 9, 20, .52) !important;
}

.v3-rewards-highlight {
  color: #fff !important;
  background: none !important;
  -webkit-text-fill-color: #fff !important;
}

.v3-rewards-art-glow {
  background: radial-gradient(circle, rgba(229, 9, 20, .3) 0%, rgba(229, 9, 20, 0) 70%) !important;
}

.v3-rewards-art-icon {
  color: #fff !important;
  filter: drop-shadow(0 0 12px rgba(229, 9, 20, .58)) !important;
}

.v3-checkin-card {
  background: var(--rewards-netflix-surface) !important;
  border: 1px solid #3c3c3c !important;
  border-left: 3px solid var(--rewards-netflix-red) !important;
  box-shadow: 0 18px 36px -18px rgba(0, 0, 0, .9) !important;
}

.v3-checkin-tag,
.v3-checkin-coin-box svg,
.v3-checkin-coin-box strong,
.v3-checkin-streak,
.v3-welcome-amount-current,
.v3-welcome-progress-percent,
.v3-milestone-reward {
  color: #ff5a60 !important;
}

.v3-checkin-streak {
  background: rgba(229, 9, 20, .13) !important;
  border-color: rgba(229, 9, 20, .42) !important;
}

.v3-checkin-desc,
.v3-checkin-stats small {
  color: #b3b3b3 !important;
}

.v3-checkin-stats strong {
  color: #fff !important;
}

.v3-checkin-btn {
  color: #fff !important;
  background: var(--rewards-netflix-red) !important;
  box-shadow: none !important;
}

.v3-checkin-btn:hover:not(:disabled) {
  background: #f6121d !important;
  box-shadow: none !important;
}

.v3-checkin-stats {
  border-top-color: #3a3a3a !important;
}

.v3-welcome-card {
  background: var(--rewards-netflix-surface) !important;
  border-color: #333 !important;
}

.v3-welcome-amount-pill {
  color: #fff !important;
  background: rgba(229, 9, 20, .13) !important;
  border-color: rgba(229, 9, 20, .42) !important;
}

.v3-welcome-progress-fill {
  background: var(--rewards-netflix-red) !important;
}

.v3-milestone-item.is-next {
  background: rgba(229, 9, 20, .1) !important;
  border-color: var(--rewards-netflix-red) !important;
  box-shadow: 0 0 0 2px rgba(229, 9, 20, .14) !important;
}

.v3-milestone-item.is-next .v3-milestone-icon,
.v3-milestone-next-tag {
  color: #fff !important;
  background: var(--rewards-netflix-red) !important;
}

/* Keep text readable on the dark welcome-reward card. */
.v3-welcome-card {
  color: #fff !important;
}

.v3-welcome-card .v3-welcome-head h2,
.v3-welcome-card .v3-welcome-head p,
.v3-welcome-card .v3-welcome-footer,
.v3-welcome-card .v3-welcome-progress-labels {
  color: #fff !important;
}

.v3-welcome-card .v3-welcome-head p,
.v3-welcome-card .v3-welcome-footer,
.v3-welcome-card .v3-welcome-progress-labels {
  color: #b3b3b3 !important;
}

.v3-welcome-card .v3-welcome-progress-percent {
  color: #ff5a60 !important;
}

.v3-welcome-card .v3-welcome-note {
  color: #181818 !important;
}

.v3-welcome-card .v3-welcome-note strong {
  color: #181818 !important;
}

.v3-welcome-card .v3-welcome-note p {
  color: #5f5f5f !important;
}

.v3-welcome-card .v3-milestone-body strong {
  color: #181818 !important;
}

.v3-welcome-card .v3-milestone-reward {
  color: #e50914 !important;
}

/* Final contrast correction for the dark Netflix card. */
.v3-welcome-card .v3-milestone-item {
  background: #232323 !important;
  border-color: #333 !important;
}

.v3-welcome-card .v3-milestone-item .v3-milestone-body strong {
  color: #fff !important;
}

.v3-welcome-card .v3-milestone-item .v3-milestone-reward {
  color: #ff5a60 !important;
}

.v3-welcome-card .v3-welcome-note {
  background: #232323 !important;
  border-color: #333 !important;
}

.v3-welcome-card .v3-welcome-note strong {
  color: #fff !important;
}

.v3-welcome-card .v3-welcome-note p {
  color: #b3b3b3 !important;
}

.v3-welcome-card > .v3-welcome-footer {
  color: #b3b3b3 !important;
}
