:root{
  --rf-modern-surface: rgba(17, 22, 34, .86);
  --rf-modern-surface-soft: rgba(255, 255, 255, .08);
  --rf-modern-border: rgba(255, 255, 255, .16);
  --rf-modern-border-strong: rgba(255, 255, 255, .24);
  --rf-modern-shadow: 0 18px 42px rgba(0,0,0,.34);
  --rf-modern-shadow-hover: 0 26px 52px rgba(0,0,0,.42);
  --rf-modern-radius: 14px;
  --rf-modern-card-top: rgba(255,255,255,.07);
  --rf-modern-card-bottom: rgba(255,255,255,.02);
  --rf-modern-card-glow: rgba(255,255,255,.08);
  --rf-modern-chip-active: rgba(255,255,255,.42);
}

/* Per-page visual tuning (same system, different mood) */
body.page--home,
body.page--public_home{
  --rf-modern-card-top: rgba(108,166,255,.14);
  --rf-modern-card-bottom: rgba(41,81,146,.06);
  --rf-modern-card-glow: rgba(117,181,255,.18);
}

body.page--movies{
  --rf-modern-card-top: rgba(255,186,102,.14);
  --rf-modern-card-bottom: rgba(139,78,28,.06);
  --rf-modern-card-glow: rgba(255,188,110,.18);
}

body.page--shows,
body.page--tv_show_detail{
  --rf-modern-card-top: rgba(148,214,255,.14);
  --rf-modern-card-bottom: rgba(50,90,125,.06);
  --rf-modern-card-glow: rgba(145,210,255,.20);
}

body.page--kids,
body.page--kids_shows{
  --rf-modern-card-top: rgba(134,255,190,.14);
  --rf-modern-card-bottom: rgba(43,130,86,.06);
  --rf-modern-card-glow: rgba(126,255,188,.22);
  --rf-modern-chip-active: rgba(126,255,188,.55);
}

body.rf-mobile-app{
  --rf-modern-card-top: rgba(120,196,255,.14);
  --rf-modern-card-bottom: rgba(39,88,146,.06);
  --rf-modern-card-glow: rgba(116,188,255,.20);
}

/* Card language */
.rows .card,
.featuredStrip__rail .featuredCard,
.watchDrawer__grid .wdTile__imgWrap{
  border-radius: var(--rf-modern-radius) !important;
  border: 1px solid var(--rf-modern-border) !important;
  background: linear-gradient(180deg, var(--rf-modern-card-top) 0%, var(--rf-modern-card-bottom) 100%);
  box-shadow: var(--rf-modern-shadow);
}

@media (hover: hover) and (pointer: fine){
  .rows .card:hover,
  .featuredStrip__rail .featuredCard:hover{
    box-shadow: var(--rf-modern-shadow-hover);
    border-color: var(--rf-modern-border-strong) !important;
    outline: 1px solid var(--rf-modern-card-glow);
    outline-offset: -1px;
  }
}

.rows .card__media,
.featuredStrip__rail .featuredCard,
.watchDrawer__grid .wdTile__imgWrap{
  border-radius: inherit;
}

/* Button shape + tactile depth */
.billboard__actions .btn,
.watchDrawer__playBtn,
.nfModal__btnPlay,
.nfModal__btnSecondary,
.nfModal__btnMyList{
  border-radius: 12px !important;
  border: 1px solid var(--rf-modern-border) !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.24);
}

.billboard__actions .btn--primary,
.watchDrawer__playBtn,
.nfModal__btnPlay{
  border-color: rgba(255,255,255,.08) !important;
}

.billboard__actions .btn--secondary,
.nfModal__btnSecondary,
.nfModal__btnMyList{
  background: var(--rf-modern-surface) !important;
}

/* Chips and small controls */
.searchFilterChip,
.nfModal__pill,
.wdPill,
.maturityBadge{
  border-radius: 999px !important;
  border: 1px solid var(--rf-modern-border) !important;
  background: var(--rf-modern-surface-soft) !important;
}

.searchFilterChip.isActive{
  border-color: var(--rf-modern-chip-active) !important;
  box-shadow: 0 0 0 1px rgba(255,255,255,.1) inset;
}

/* Icon buttons */
.iconBtn,
.rfm-iconBtn,
.roundIconBtn,
.wdIcon{
  border-radius: 12px !important;
  border: 1px solid var(--rf-modern-border) !important;
  background: var(--rf-modern-surface) !important;
  box-shadow: 0 8px 20px rgba(0,0,0,.28);
}

/* Mobile top menu shell */
body.rf-mobile-app .rfm-topMenuCard{
  border-radius: 16px;
  border: 1px solid var(--rf-modern-border);
  background: linear-gradient(180deg, rgba(16,25,42,.98) 0%, rgba(10,16,28,.98) 100%);
  box-shadow: var(--rf-modern-shadow);
}

/* Subtle visual depth under row rails */
.row__viewport{
  border-radius: 12px;
}

/* Row titles + section surfaces */
.rows .row__title{
  font-weight: 800;
  letter-spacing: .005em;
}

.rows .row__viewport{
  background: linear-gradient(180deg, rgba(255,255,255,.03) 0%, rgba(255,255,255,0) 100%);
}

/* Special/static pages: light modern surface */
body.rf-modern-static{
  background: #f0f3f5;
  color: #111827;
}

body.rf-modern-static #app{
  background: #f0f3f5;
}

body.rf-modern-static .topNav.topNav--solid{
  background: #ffffff;
  border-bottom: 1px solid #dbe2e8;
}

body.rf-modern-static .topNav .navLink{
  color: #1f2937;
}

body.rf-modern-static .topNav .navLink.isActive{
  color: #0f172a;
}

body.rf-modern-static .topNav .topNav__logoPlaceholder{
  background: #eef2f7;
  border-color: #dbe2e8;
  color: #111827;
}

body.rf-modern-static .staticPage{
  background: transparent;
  color: #111827;
}

body.rf-modern-static .staticPage__wrap{
  background: #ffffff;
  border: 1px solid #dbe2e8;
  border-radius: 16px;
  padding: clamp(18px, 2.4vw, 28px);
  box-shadow: 0 10px 28px rgba(15, 23, 42, .06);
}

body.rf-modern-static .staticPage__title{
  color: #0f172a;
}

body.rf-modern-static .staticPage__body,
body.rf-modern-static .staticPage__body p,
body.rf-modern-static .staticPage__body li{
  color: #334155;
}

body.rf-modern-static .staticPage__body a{
  color: #0f172a;
}

body.rf-modern-static .siteFooter{
  background: transparent;
  border-top: 1px solid #dbe2e8;
}

body.rf-modern-static .siteFooter a{
  color: #344054;
}

body.rf-modern-static .footerFineprint{
  color: #667085;
}

/* Contact page card + text surfaces */
body.rf-modern-static .contactForm{
  background: #ffffff;
  border-color: #dbe2e8;
}

body.rf-modern-static .contactField span{
  color: #475467;
}

body.rf-modern-static .contactField input,
body.rf-modern-static .contactField select,
body.rf-modern-static .contactField textarea{
  background: #f8fafc;
  border-color: #d0d7de;
  color: #0f172a;
}

body.rf-modern-static .contactAlert--success{
  background: #ecfdf3;
  border-color: #abefc6;
  color: #027a48;
}

body.rf-modern-static .contactAlert--error{
  background: #fef3f2;
  border-color: #fecdca;
  color: #b42318;
}

/* Community page light tokens + card surfaces */
body.rf-modern-static.communityPage{
  --cp-bg: #f0f3f5;
  --cp-card: #ffffff;
  --cp-card-2: #ffffff;
  --cp-border: #dbe2e8;
  --cp-text: #111827;
  --cp-muted: #667085;
  --cp-ok: #027a48;
  --cp-warn: #b54708;
  --cp-err: #b42318;
  background: #f0f3f5;
}

body.rf-modern-static.communityPage .communityWrap{
  color: #111827;
}

body.rf-modern-static.communityPage .communityHero,
body.rf-modern-static.communityPage .communityItem,
body.rf-modern-static.communityPage .communityNotice,
body.rf-modern-static.communityPage .communityForm,
body.rf-modern-static.communityPage .communityCol{
  background: #ffffff;
  border-color: #dbe2e8;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .04);
}

body.rf-modern-static.communityPage .communityHero{
  border: 1px solid #dbe2e8;
  border-radius: 14px;
  padding: 14px;
}

body.rf-modern-static.communityPage .communityBody{
  color: #475467;
}

body.rf-modern-static.communityPage .communityBack,
body.rf-modern-static.communityPage .communityToggle{
  background: #f8fafc;
  border-color: #d0d7de;
  color: #0f172a;
}

body.rf-modern-static.communityPage .communityToggle.isActive,
body.rf-modern-static.communityPage .communitySubmit{
  background: #111827;
  border-color: #111827;
  color: #ffffff;
}

body.rf-modern-static.communityPage .communityForm input,
body.rf-modern-static.communityPage .communityForm textarea{
  background: #f8fafc;
  border-color: #d0d7de;
  color: #0f172a;
}

body.rf-modern-static.communityPage .communityEntry{
  background: #f8fafc;
  border-color: #d0d7de;
}

body.rf-modern-static.communityPage .communityEntry__meta{
  color: #667085;
}

body.rf-modern-static.communityPage .communityBadge{
  border-color: #fec84b;
  color: #b54708;
}

/* Login page modern skin */
body.rf-modern-login{
  background:
    radial-gradient(1000px 420px at 50% -220px, rgba(229,9,20,.12), rgba(229,9,20,0)),
    #f0f3f5 !important;
}

body.rf-modern-login header{
  background: #ffffff;
  border-bottom: 1px solid #dbe2e8;
}

body.rf-modern-login .brand{
  color: #111827;
}

body.rf-modern-login .nav a{
  color: #1f2937;
}

body.rf-modern-login .card{
  background: #ffffff;
  border: 1px solid #dbe2e8;
  border-radius: 16px;
  box-shadow: 0 16px 36px rgba(15, 23, 42, .08);
}

body.rf-modern-login .copy,
body.rf-modern-login .small,
body.rf-modern-login .muted,
body.rf-modern-login label{
  color: #475467;
}

body.rf-modern-login input,
body.rf-modern-login .otp-digit{
  background: #f8fafc;
  border-color: #d0d7de;
  color: #0f172a;
}

body.rf-modern-login .btn.btn-primary{
  background: #111827;
  color: #ffffff;
}

body.rf-modern-login .btn.btn-secondary{
  background: #f3f4f6;
  color: #111827;
}
