/* Use the same pearl surfaces and quiet blue actions as Support and Pro. */
.rewards-page { --rewards-ink: #252a30; --rewards-muted: #555e69; --rewards-line: rgba(74,88,104,.18); --rewards-paper: rgba(255,253,248,.88); --rewards-band: #edf4f8; --rewards-blue: #075da6; color: var(--rewards-ink); background: var(--pearl); }
.rewards-page main { display: block; }
.rewards-shell { width: min(1440px, 100%); margin-inline: auto; }
.rewards-page :is(.rewards-hero, .rewards-workspace, .rewards-history-section) { padding-inline: 32px; }
.rewards-page .eyebrow { margin: 0 0 18px; color: var(--rewards-muted); font-size: 13px; font-weight: 600; letter-spacing: 0; text-transform: none; }
.rewards-hero { padding-block: 88px 72px; border-bottom: 1px solid var(--rewards-line); background: var(--pearl); }
.rewards-hero-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .7fr); gap: clamp(40px, 8vw, 120px); align-items: end; }
.rewards-page h1 { margin: 0; color: var(--rewards-ink); font-size: clamp(48px, 6.4vw, 88px); font-weight: 600; line-height: 1.02; letter-spacing: -.055em; }
.rewards-lead { max-width: 46ch; margin: 26px 0 0; color: var(--rewards-muted); font-size: 19px; line-height: 1.6; }
.rewards-caption-example { padding-block: 24px; border-top: 1px solid var(--rewards-line); }
.rewards-caption-example > span { color: var(--rewards-muted); font-size: 13px; }
.rewards-caption-example code { display: block; margin-top: 18px; color: var(--rewards-ink); font-size: clamp(16px, 1.6vw, 21px); line-height: 1.5; overflow-wrap: anywhere; user-select: all; }
.rewards-caption-example p { max-width: 42ch; margin: 18px 0; color: var(--rewards-muted); font-size: 14px; line-height: 1.65; }
.rewards-caption-example a { display: inline-flex; gap: 16px; align-items: center; min-height: 44px; color: var(--rewards-blue); font-size: 14px; font-weight: 600; text-underline-offset: 4px; }
.rewards-workspace { padding-block: 72px 88px; scroll-margin-top: 90px; }
.rewards-page .rewards-layout { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(40px, 8vw, 120px); align-items: start; }
.rewards-page h2 { margin: 0; color: var(--rewards-ink); font-size: clamp(30px, 3.4vw, 44px); font-weight: 600; line-height: 1.1; letter-spacing: -.04em; }
.rewards-steps { counter-reset: reward-step; margin: 34px 0 0; padding: 0; list-style: none; }
.rewards-steps li { counter-increment: reward-step; position: relative; padding: 22px 0 22px 40px; border-top: 1px solid var(--rewards-line); }
.rewards-steps li::before { content: "0" counter(reward-step); position: absolute; left: 0; top: 25px; color: var(--rewards-muted); font-size: 12px; font-variant-numeric: tabular-nums; }
.rewards-steps strong { color: var(--rewards-ink); font-size: 17px; font-weight: 600; line-height: 1.4; }
.rewards-steps p { max-width: 45ch; margin: 10px 0 0; color: var(--rewards-muted); font-size: 14px; line-height: 1.65; }
.rewards-page .compat-note { padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; margin: 16px 0 0; color: var(--rewards-muted); font-size: 12px; line-height: 1.6; }
.rewards-page .rewards-panel { display: grid; gap: 20px; padding: 32px; border: 1px solid var(--rewards-line); border-radius: var(--radius-lg); color: var(--rewards-ink); background: var(--rewards-paper); box-shadow: inset 0 1px rgba(255,255,255,.7), 0 12px 28px rgba(44,73,108,.04); }
.rewards-page .rewards-panel > h3 { margin: 0; color: var(--rewards-ink); font-size: 24px; font-weight: 600; letter-spacing: -.025em; }
.rewards-page .account-connection-status { padding: 0 0 20px; border: 0; border-bottom: 1px solid var(--rewards-line); border-radius: 0; background: transparent; color: var(--rewards-muted); font-size: 14px; font-weight: 400; line-height: 1.6; }
.rewards-page:not([data-auth-phase="logged-out"]) .rewards-login-prompt { display: none; }
.rewards-login-prompt { display: grid; justify-items: start; gap: 16px; margin: 0; }
.rewards-login-prompt span { max-width: 45ch; color: var(--rewards-muted); font-size: 14px; line-height: 1.65; }
.rewards-page .account-inline-form { grid-template-columns: 1fr; gap: 16px; margin: 0; }
.rewards-page .account-inline-form label { color: var(--rewards-ink); font-size: 13px; font-weight: 600; }
.rewards-page .account-inline-form input { width: 100%; min-height: 48px; border: 1px solid var(--rewards-line); border-radius: 10px; background: var(--pearl); color: var(--rewards-ink); font: inherit; font-size: 15px; font-weight: 400; }
.rewards-page .account-inline-form input::placeholder { color: var(--rewards-muted); opacity: 1; }
.rewards-page :is(.primary-pill, .secondary-pill) { justify-self: start; min-height: 44px; border-radius: 10px; font-size: 14px; font-weight: 600; box-shadow: none; transition: background-color 140ms ease; }
.rewards-page .primary-pill { border: 1px solid var(--rewards-blue); color: #fff; background: var(--rewards-blue); }
.rewards-page .primary-pill:hover { background: #064d88; }
.rewards-page .secondary-pill { border: 1px solid var(--rewards-line); color: var(--rewards-ink); background: transparent; }
.rewards-page .secondary-pill:hover { background: var(--rewards-band); }
.rewards-page .verification-help-trigger { text-align: left; }
.rewards-page .account-verification-instructions { margin: 0; padding: 18px; border: 1px solid var(--rewards-line); border-radius: 10px; background: var(--rewards-band); color: var(--rewards-ink); line-height: 1.65; }
.rewards-page .caption-reward-card { gap: 20px; margin: 0; padding: 24px 0 0; border: 0; border-top: 1px solid var(--rewards-line); border-radius: 0; background: transparent; }
.rewards-page .caption-reward-card h3 { margin: 0 0 12px; color: var(--rewards-ink); font-size: 24px; font-weight: 600; letter-spacing: -.025em; }
.rewards-page .caption-reward-card p { color: var(--rewards-muted); font-size: 14px; line-height: 1.6; }
.rewards-page .caption-reward-actions { flex-wrap: wrap; gap: 16px; padding: 18px; border-color: var(--rewards-line); border-radius: 10px; background: var(--rewards-band); }
.rewards-page .caption-reward-actions code { color: var(--rewards-ink); font-weight: 500; line-height: 1.5; }
.rewards-page .reset-note { margin: 0; color: var(--rewards-ink); font-size: 14px; line-height: 1.6; overflow-wrap: anywhere; }
.rewards-page .reset-note:empty { display: none; }
.rewards-history-section { padding-block: 56px 64px; background: var(--rewards-band); }
.rewards-history-layout { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(40px, 8vw, 120px); align-items: start; }
.rewards-history-layout > div > p:last-child { max-width: 40ch; margin: 20px 0 0; color: var(--rewards-muted); font-size: 15px; line-height: 1.6; }
.rewards-page .rewards-history { margin: 0; border: 1px solid var(--rewards-line); border-radius: var(--radius-lg); background: var(--rewards-paper); box-shadow: none; }
.rewards-page .rewards-history summary { padding: 24px; color: var(--rewards-ink); font-size: 15px; font-weight: 600; }
.rewards-page .rewards-history[open] summary { border-bottom: 1px solid var(--rewards-line); }
.rewards-history-content { padding: 24px; }
.rewards-history-content h3 { margin: 0 0 12px; color: var(--rewards-ink); font-size: 15px; font-weight: 600; }
.rewards-history-content .notifications-list { margin-bottom: 0; }
.rewards-history-content h3:not(:first-child) { margin-top: 28px; }
.rewards-page .account-list { margin-top: 0; }
.rewards-page .account-list > p { margin: 0; color: var(--rewards-muted); font-size: 14px; }
.rewards-page .account-list article { padding: 16px 0; border: 0; border-bottom: 1px solid var(--rewards-line); border-radius: 0; background: transparent; color: var(--rewards-ink); overflow-wrap: anywhere; }
.rewards-page .account-list article :is(span, small) { color: var(--rewards-muted); }
.rewards-page :is(a, button, input, summary):focus-visible { outline: 2px solid #1674c5; outline-offset: 4px; }
.rewards-page [hidden], .rewards-page .hidden { display: none !important; }
html[data-upload120-theme="dark"] .rewards-page { --rewards-ink: #f1f3f7; --rewards-muted: #b0b6c2; --rewards-line: rgba(188,205,222,.2); --rewards-paper: rgba(25,34,43,.9); --rewards-band: #1a1c22; --rewards-blue: #82b7ff; }
html[data-upload120-theme="dark"] .rewards-page .primary-pill { border-color: #075da6; background: #075da6; color: #fff; }
html[data-upload120-theme="dark"] .rewards-page .primary-pill:hover { background: #086ab9; }
html[data-upload120-theme="dark"] .rewards-page .rewards-panel { box-shadow: inset 0 1px rgba(255,255,255,.05), 0 12px 28px rgba(0,0,0,.12); }
@media (max-width: 900px) {
  .rewards-hero-grid, .rewards-page .rewards-layout, .rewards-history-layout { grid-template-columns: 1fr; gap: 40px; }
  .rewards-hero { padding-block: 60px 48px; }
  .rewards-caption-example { max-width: 640px; padding-bottom: 0; }
  .rewards-workspace { padding-block: 56px 64px; }
  .rewards-steps p { max-width: 65ch; }
}
@media (max-width: 600px) {
  .rewards-page :is(.rewards-hero, .rewards-workspace, .rewards-history-section) { padding-inline: 16px; }
  .rewards-hero { padding-top: 48px; }
  .rewards-page h1 { font-size: clamp(40px, 10.5vw, 60px); }
  .rewards-lead { font-size: 16px; }
  .rewards-page .rewards-panel { padding: 24px 20px; }
  .rewards-page .caption-reward-actions { padding: 16px; }
  .rewards-history-section { padding-block: 44px 52px; }
  .rewards-page .rewards-history summary, .rewards-history-content { padding: 20px; }
  .rewards-page .account-list article { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { .rewards-page * { scroll-behavior: auto !important; transition: none !important; animation: none !important; } }

/* Override the shared dark surface selectors while retaining the site's glass layer. */
html[data-upload120-theme="dark"] body.rewards-page .rewards-panel,
html[data-upload120-theme="dark"] body.rewards-page .rewards-history { background: var(--rewards-paper); border-color: var(--rewards-line); box-shadow: inset 0 1px rgba(255,255,255,.05), 0 12px 28px rgba(0,0,0,.12); }
html[data-upload120-theme="dark"] body.rewards-page .caption-reward-card { border: 0; border-top: 1px solid var(--rewards-line); background: transparent; box-shadow: none; }