/* Mobile-first green theme inspired by the supplied reference site. */
html { background: #edf3f1; }
body { margin: 0; background: radial-gradient(circle at 50% 0,#e4fff1 0,#edf3f1 34%,#e7eceb 100%); }
#root > main { width: min(100%, 430px); min-height: 100vh; margin: 0 auto; overflow: hidden; color: #15232a !important; background: #f4f8f7 !important; box-shadow: 0 0 42px rgba(32,68,56,.14); }
#root nav { position: sticky !important; top: 0; border-color: #e5ece9 !important; background: rgba(255,255,255,.94) !important; box-shadow: 0 5px 24px rgba(31,79,61,.07); }
#root nav > div { height: 68px !important; padding-inline: 17px !important; }
#root nav a, #root nav button, #root nav span { color: #18272d !important; }
#root nav a:first-child span:first-child { border: 0 !important; color: #fff !important; background: linear-gradient(145deg,#11ca79,#00a95d) !important; box-shadow: 0 7px 18px rgba(0,184,104,.25); }
#root nav .md\:flex { display: none !important; }
#root nav .md\:hidden { display: flex !important; }
#root .campaign-shell { border-color: #e3ebe8 !important; color: #17262c !important; background: linear-gradient(180deg,#f0fff7 0,#f7faf9 76%,#eef5f2 100%) !important; }
#root .campaign-shell > div { padding: 38px 18px 44px !important; }
#root .campaign-shell h1 { font-size: clamp(2rem,10vw,3.1rem) !important; color: #142229 !important; }
#root .campaign-gradient { background: linear-gradient(120deg,#05b969,#00a9a0,#75bf21) !important; -webkit-background-clip: text !important; background-clip: text !important; color: transparent !important; }
#root .campaign-shell p { color: #65767d !important; }
#root main section:not(.campaign-shell) { padding: 42px 16px !important; }
#root main section > div { max-width: 100% !important; }
#root .section-heading { display: block !important; }
#root .section-heading h2, #root main section h2 { color: #18272d !important; }
#root .section-heading > p, #root main section p { color: #687a80; }
#root .eyebrow { color: #00a966 !important; }
#root .signal-card, #root .narrative-row, #root .event-row, #root .scanner-card, #root .subscribe-panel, #root #calendar { border-color: #e0ebe6 !important; color: #1a292f !important; background: #fff !important; box-shadow: 0 9px 26px rgba(25,75,56,.07) !important; }
#root .signal-card h3, #root .narrative-row h3, #root .event-row p:first-child, #root .scanner-card h2, #root .subscribe-panel h2 { color: #17272c !important; }
#root .signal-card p, #root .narrative-row p, #root .event-row p, #root .scanner-card p, #root .subscribe-panel p { color: #718086 !important; }
#root .scanner-card input { border-color: #dce8e3 !important; color: #193038 !important; background: #f5faf8 !important; }
#root .scanner-card button { color: #fff !important; background: #05b86e !important; }
#root footer { border-color: #dde8e4 !important; color: #76868b !important; background: #eef4f2 !important; }

/* Reference-style lucky wheel dialog. */
.lw-backdrop { align-items: center; background: rgba(34,42,39,.72) !important; backdrop-filter: blur(3px); }
.lw-dialog { width: min(100%, 390px) !important; max-height: calc(100dvh - 24px); overflow-y: auto !important; border: 0 !important; border-radius: 28px !important; color: #fff !important; background: linear-gradient(160deg,#46d46e 0,#08ae5d 44%,#007e3f 100%) !important; box-shadow: 0 24px 75px rgba(0,0,0,.42) !important; }
.lw-content { padding: 23px 14px 18px !important; }
.lw-kicker { color: rgba(255,255,255,.78) !important; }
.lw-title { margin-top: 4px !important; color: #ffea78 !important; font-size: 31px !important; text-shadow: 0 3px 0 rgba(79,113,0,.25); }
.lw-count { width: fit-content; margin: 10px auto 0 !important; border-radius: 999px; padding: 8px 17px; color: #effff5 !important; background: rgba(0,85,38,.55); }
.lw-count b { color: #ffe86c !important; }
.lw-stage { width: min(80vw,300px) !important; margin: 18px auto 12px !important; }
.lw-wheel { inset: 6px !important; border-color: #ffd64e !important; border-width: 8px !important; box-shadow: inset 0 0 0 2px rgba(255,255,255,.4),0 10px 26px rgba(0,62,24,.32) !important; }
.lw-prize { transform: rotate(var(--angle)) translateY(-107px) rotate(calc(var(--angle) * -1)) !important; font-size: 11px !important; }
.lw-hub { width: 67px !important; height: 67px !important; border-color: #fff !important; color: #fff !important; background: #2474dc !important; font-size: 16px !important; }
.lw-spin { min-height: 50px !important; color: #12602c !important; background: linear-gradient(135deg,#fff58e,#ffd752) !important; box-shadow: 0 9px 22px rgba(50,80,0,.2) !important; }
.lw-note { color: rgba(255,255,255,.78) !important; }
.lw-close { color: #fff !important; background: rgba(255,255,255,.18) !important; }
.lwg-browse { color: rgba(255,255,255,.86) !important; }
#lucky-wheel-launcher { border: 0 !important; color: #fff !important; background: linear-gradient(145deg,#12c873,#009f55) !important; box-shadow: 0 12px 30px rgba(0,151,80,.3) !important; }
.lwg-card { border-color: rgba(123,244,176,.32) !important; background: linear-gradient(160deg,#104d36,#073426) !important; }
.lwg-icon, .lwg-card button { color: #07532d !important; background: #ffea73 !important; }

@media (min-width: 700px) {
  #root > main { margin-block: 0; }
}
@media (max-width: 420px) {
  .lw-prize { transform: rotate(var(--angle)) translateY(-28vw) rotate(calc(var(--angle) * -1)) !important; }
}