.daily-rewards { max-width: 1298px; margin: 0 auto 5rem; }
.daily-rewards-intro { margin: 0 auto 1.2rem; text-align: center; }
.daily-eyebrow { display: inline-flex; align-items: center; gap: .5rem; color: var(--az-accent, #62b6ff); font-size: .76rem; font-weight: 800; letter-spacing: .16em; }
.daily-rewards-intro h2 { margin: .65rem 0 0; font-size: clamp(1.9rem, 3.4vw, 3.2rem); font-weight: 800; }
.daily-rewards-layout { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); align-items: center; gap: clamp(1.5rem, 4vw, 4rem); }
.daily-wheel-stage { position: relative; display: grid; place-items: center; min-width: 0; padding: 1.5rem 0; isolation: isolate; }
.daily-wheel-stage::before { position: absolute; z-index: -1; width: min(100%, 780px); aspect-ratio: 1.4; border-radius: 50%; background: radial-gradient(ellipse, rgba(49, 126, 232, .19), transparent 67%); content: ''; pointer-events: none; }
.daily-wheel-shell { --wheel-size: min(48vw, 600px); position: relative; display: grid; place-items: center; width: calc(var(--wheel-size) + 30px); aspect-ratio: 1; }
.daily-wheel { position: relative; width: var(--wheel-size); aspect-ratio: 1; border: clamp(7px, 1vw, 11px) solid #10294b; border-radius: 50%; background: var(--wheel-gradient, #173456); box-shadow: inset 0 0 0 3px rgba(255, 255, 255, .3), 0 0 0 5px rgba(82, 153, 235, .14), 0 25px 70px rgba(4, 15, 38, .34); transition: transform 5s cubic-bezier(.11,.72,.12,1); }
.daily-wheel::after { position: absolute; inset: 0; border-radius: inherit; background: radial-gradient(circle, transparent 28%, rgba(3, 11, 26, .13) 100%); content: ''; pointer-events: none; }
.daily-wheel-pointer { position: absolute; z-index: 4; top: -4px; left: 50%; width: 38px; height: 52px; background: linear-gradient(#fff, #8cc9ff); clip-path: polygon(0 0, 100% 0, 50% 100%); filter: drop-shadow(0 4px 6px rgba(0, 0, 0, .45)); transform: translateX(-50%); }
.daily-wheel-label { position: absolute; z-index: 2; top: 50%; left: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .1rem; width: min(138px, calc(var(--wheel-size) * 2.3 / var(--reward-count))); color: #fff; text-align: center; text-shadow: 0 2px 6px rgba(0, 0, 0, .65); transform: translate(-50%, -50%) rotate(var(--angle)) translateY(calc(var(--wheel-size) * -.34)) rotate(calc(-1 * var(--angle))); }
.daily-wheel-label img { display: block; width: min(94px, calc(var(--wheel-size) / var(--reward-count))); height: min(94px, calc(var(--wheel-size) / var(--reward-count))); object-fit: contain; filter: drop-shadow(0 7px 7px rgba(0, 0, 0, .35)); }
.daily-wheel-label > .bi { display: grid; place-items: center; width: 70px; height: 70px; font-size: 2rem; }
.daily-wheel-label strong { display: block; max-width: 100%; overflow: hidden; font-size: clamp(.67rem, 1.5vw, .91rem); font-weight: 800; line-height: 1.15; text-overflow: ellipsis; white-space: nowrap; }
.daily-wheel-center { position: absolute; z-index: 3; top: 50%; left: 50%; display: grid; place-items: center; width: clamp(60px, 14vw, 92px); aspect-ratio: 1; border: 5px solid rgba(211, 235, 255, .9); border-radius: 50%; background: radial-gradient(circle at 35% 30%, #245a9c, #0b1d3d 75%); color: #dbf0ff; font-size: 1.9rem; box-shadow: 0 8px 24px rgba(0, 0, 0, .4); transform: translate(-50%, -50%); }
.daily-wheel-actions { justify-self: center; width: 100%; min-width: 0; max-width: 540px; margin: 0 auto; text-align: center; }
.daily-wheel-actions h3 { margin: 0 0 1rem; font-size: clamp(1.55rem, 2.6vw, 2.25rem); font-weight: 800; line-height: 1.15; }
.daily-wheel-note { margin: 0 0 2rem; color: var(--az-muted, var(--bs-secondary-color)); font-size: .98rem; line-height: 1.7; }
.daily-spins-remaining { margin: 0 0 1rem; color: var(--az-accent, #62b6ff); font-size: .95rem; font-weight: 700; }
.daily-cooldown { padding: 1.1rem 1.25rem 1.2rem; border: 1px solid var(--az-border, var(--bs-border-color)); border-radius: 1rem; background: var(--az-surface-raised, var(--bs-tertiary-bg)); }
.daily-cooldown[hidden] { display: none; }
.daily-cooldown-label { margin: 0 0 .8rem; color: var(--az-text, var(--bs-body-color)); font-size: .98rem; line-height: 1.4; text-align: center; }
.daily-cooldown-label strong { color: var(--az-accent, #62b6ff); font-variant-numeric: tabular-nums; white-space: nowrap; }
.daily-cooldown-track { height: 16px; overflow: hidden; border-radius: 999px; background: var(--az-bg, var(--bs-body-bg)); }
.daily-cooldown-fill { display: block; width: 100%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--az-accent-strong, #287ce9), var(--az-accent, #62b6ff)); transition: width .8s linear; }
.daily-spin-button { display: inline-flex; justify-content: center; align-items: center; gap: .7rem; width: 100%; min-height: 56px; margin-top: 1.25rem; border: 0; border-radius: 999px; background: linear-gradient(110deg, var(--az-accent-strong, #287ce9), #489bef); color: #fff; font-size: 1.05rem; font-weight: 800; box-shadow: 0 10px 25px rgba(33, 111, 224, .24); transition: filter .2s, transform .2s, box-shadow .2s; }
.daily-cooldown[hidden] + .daily-spin-button { margin-top: 0; }
.daily-spin-button:hover:not(:disabled), .daily-spin-button:focus-visible { background: linear-gradient(110deg, var(--az-accent-strong, #287ce9), #64b7ff); color: #fff; box-shadow: 0 12px 30px rgba(33, 111, 224, .34); transform: translateY(-2px); }
.daily-spin-button:disabled { border: 0; background: linear-gradient(110deg, var(--az-accent-strong, #287ce9), #489bef); color: #fff; box-shadow: none; opacity: .6; cursor: not-allowed; }
.daily-wheel-feedback { min-height: 1.5rem; margin: 1rem 0 0; color: var(--az-accent, #62b6ff); font-size: .9rem; line-height: 1.55; text-align: center; }
.daily-wheel-feedback:empty { display: none; }
.daily-prizes { margin-top: clamp(4rem, 6vw, 6.5rem); padding-top: clamp(2.5rem, 4vw, 4rem); border-top: 1px solid var(--az-border, var(--bs-border-color)); }
.daily-prizes-heading { margin-bottom: 1.8rem; text-align: center; }
.daily-prizes-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); grid-auto-rows: minmax(185px, auto); gap: clamp(.7rem, 1.2vw, 1.1rem); }
.daily-prize-card { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .7rem; min-width: 0; padding: 1.1rem; border: 1px solid var(--az-border, var(--bs-border-color)); border-radius: 1.1rem; background: linear-gradient(145deg, var(--az-surface-raised, var(--bs-tertiary-bg)), var(--az-surface, var(--bs-body-bg))); text-align: center; box-shadow: 0 14px 32px var(--az-card-shadow, rgba(0, 0, 0, .08)); }
.daily-prize-card img { display: block; width: min(100%, 130px); height: 112px; object-fit: contain; filter: drop-shadow(0 9px 9px rgba(0, 0, 0, .2)); }
.daily-prize-caption { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: .35rem .55rem; max-width: 100%; }
.daily-prize-card h4 { margin: 0; color: var(--az-text, var(--bs-body-color)); font-size: 1.05rem; font-weight: 750; line-height: 1.25; overflow-wrap: anywhere; }
.daily-prize-chance { display: inline-flex; align-items: center; flex: none; padding: .18rem .5rem; border: 1px solid color-mix(in srgb, var(--az-accent, #62b6ff) 35%, transparent); border-radius: 999px; background: color-mix(in srgb, var(--az-accent, #62b6ff) 11%, transparent); color: var(--az-accent, #62b6ff); font-size: .76rem; font-weight: 800; line-height: 1.25; white-space: nowrap; }
.daily-prize-placeholder { display: grid; place-items: center; width: 112px; height: 112px; color: var(--az-accent, #62b6ff); font-size: 3rem; }
.daily-prize-card-featured { grid-column: span 2; grid-row: span 2; justify-content: space-between; padding: 1.5rem; border-color: color-mix(in srgb, var(--az-accent, #62b6ff) 42%, transparent); background: radial-gradient(circle at 50% 45%, rgba(70, 148, 242, .2), transparent 65%), linear-gradient(145deg, var(--az-surface-raised, var(--bs-tertiary-bg)), var(--az-surface, var(--bs-body-bg))); }
.daily-prize-card-featured img { width: min(90%, 260px); height: 240px; }
.daily-prize-card-featured h4 { font-size: clamp(1.25rem, 2vw, 1.65rem); }
.daily-prize-badge { display: inline-flex; align-items: center; gap: .45rem; padding: .35rem .8rem; border: 1px solid color-mix(in srgb, var(--az-accent, #62b6ff) 45%, transparent); border-radius: 999px; background: color-mix(in srgb, var(--az-accent, #62b6ff) 14%, transparent); color: var(--az-accent, #62b6ff); font-size: .72rem; font-weight: 800; letter-spacing: .08em; }
.daily-prize-card-wide { grid-column: span 2; flex-direction: row; gap: 1.4rem; }
.daily-prize-card-wide img { width: 145px; height: 125px; }
.daily-prizes-empty { grid-column: 1 / -1; margin: 0; color: var(--az-muted, var(--bs-secondary-color)); text-align: center; }
.daily-recent { margin-top: clamp(2.5rem, 4vw, 4rem); border: 1px solid var(--az-border, var(--bs-border-color)); border-radius: 999px; background: linear-gradient(110deg, var(--az-surface-raised, var(--bs-tertiary-bg)), var(--az-surface, var(--bs-body-bg))); box-shadow: 0 12px 30px var(--az-card-shadow, rgba(0, 0, 0, .08)); }
.daily-recent-viewport { overflow: hidden; border-radius: inherit; }
.daily-recent-track, .daily-recent-group { display: flex; align-items: center; }
.daily-recent-track { width: max-content; min-height: 54px; }
.daily-recent-group { flex: none; gap: clamp(1.25rem, 3vw, 3rem); width: max-content; padding: .65rem clamp(.625rem, 1.5vw, 1.5rem); }
.daily-recent-track:not(.is-animated):not(.is-preparing) { width: 100%; }
.daily-recent-track:not(.is-animated):not(.is-preparing) .daily-recent-group { justify-content: space-around; width: 100%; }
.daily-recent-item { display: inline-flex; flex: none; align-items: center; gap: .4rem; white-space: nowrap; }
.daily-recent-item::before { content: '▸'; margin-right: .15rem; color: var(--az-accent, #62b6ff); font-size: .82rem; }
.daily-recent-item strong { color: var(--az-text, var(--bs-body-color)); font-size: .84rem; font-weight: 700; }
.daily-recent-item > span { color: var(--az-muted, var(--bs-secondary-color)); font-size: .8rem; }
.daily-recent-track.is-animated { animation: daily-recent-scroll var(--daily-recent-duration, 32s) linear infinite; }
.daily-recent-viewport:hover .daily-recent-track.is-animated { animation-play-state: paused; }
.daily-recent-empty { margin: 0; padding: .9rem 1.5rem; color: var(--az-muted, var(--bs-secondary-color)); font-size: .85rem; text-align: center; }
@keyframes daily-recent-scroll { from { transform: translateX(-50%); } to { transform: translateX(0); } }
@media (max-width: 991.98px) { .daily-rewards-layout { grid-template-columns: 1fr; gap: 1.5rem; } .daily-wheel-shell { --wheel-size: min(82vw, 560px); } .daily-wheel-actions { width: min(100%, 560px); max-width: none; } .daily-prizes-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .daily-prize-card-featured { grid-column: 1 / -1; grid-row: auto; min-height: 280px; } .daily-prize-card-featured img { height: 170px; } }
/* Avoid black filter tiles around transparent prizes on mobile WebKit. */
@media (max-width: 767.98px) { .daily-wheel-pointer, .daily-wheel-label img, .daily-prize-card img { filter: none; } }
@media (max-width: 600px) { .daily-rewards { margin-bottom: 3rem; } .daily-wheel-stage { padding-top: 1rem; } .daily-wheel-shell { --wheel-size: min(79vw, 440px); } .daily-wheel-label { gap: 0; } .daily-wheel-label strong { font-size: .65rem; } .daily-wheel-pointer { width: 28px; height: 39px; } .daily-wheel-note { margin-bottom: 1.4rem; } .daily-prizes-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: minmax(160px, auto); } .daily-prize-card { padding: .9rem; } .daily-prize-card img { height: 100px; } .daily-prize-card h4 { font-size: .95rem; } .daily-prize-card-featured { grid-column: 1 / -1; min-height: 250px; } .daily-prize-card-featured img { height: 155px; } .daily-prize-card-wide { gap: .8rem; } .daily-recent { border-radius: 1rem; } .daily-recent-viewport { overflow: hidden; } .daily-recent-track:not(.is-animated):not(.is-preparing), .daily-recent-track:not(.is-animated):not(.is-preparing) .daily-recent-group { width: max-content; } }
@media (prefers-reduced-motion: reduce) { .daily-wheel { transition: none; } .daily-recent-track.is-animated { animation: none; } .daily-recent-viewport { overflow-x: auto; scrollbar-width: thin; } }