/* ═══════════════════════════════════════════════════════════════
   NowssB Normal-Home (Neumorphism) skin
   Light = day mode (cream #f0f2f7) · Dark = night (#0c0c20 navy)
   Dark variants scoped under #home-nm.nm-dark
═══════════════════════════════════════════════════════════════ */

/* ── Header button group (settings + day/night) ── */
.nmh-btn-group {
  display: flex;
  align-items: center;
  gap: 10px;
}

/* Settings gear button — same neumorphism as the mode button */
.nmh-settings-btn {
  width: 40px;
  height: 40px;
  min-width: 40px;
  min-height: 40px;
  border-radius: 50%;
  border: none;
  background: #f0f2f7;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
  box-shadow: 5px 5px 12px rgba(0,0,0,0.2), -4px -4px 10px rgba(255,255,255,1);
  transition: box-shadow .15s, transform .1s;
}
.nmh-settings-btn:active {
  box-shadow: inset 3px 3px 7px rgba(0,0,0,0.2), inset -2px -2px 6px rgba(255,255,255,1);
  transform: scale(.95);
}
.nmh-settings-btn svg path,
.nmh-settings-btn svg circle { stroke: #1a1a2e; }

#home-nm.nm-dark .nmh-settings-btn {
  background: #16163c;
  box-shadow: 5px 5px 13px rgba(0,0,0,0.85), -3px -3px 10px rgba(50,50,110,0.3);
}
#home-nm.nm-dark .nmh-settings-btn:active {
  box-shadow: inset 3px 3px 8px rgba(0,0,0,0.85), inset -2px -2px 6px rgba(50,50,110,0.3);
}
#home-nm.nm-dark .nmh-settings-btn svg path,
#home-nm.nm-dark .nmh-settings-btn svg circle { stroke: rgba(232,213,163,0.9); }

/* ── Storefront section heading ── */
.nmh-store-section { margin-top: 4px; }

.nmh-store-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin: 0 2px 12px;
}
.nmh-store-title {
  font-family: 'DM Sans', sans-serif;
  font-size: 17px;
  font-weight: 700;
  color: #1a1a2e;
  letter-spacing: .2px;
}
.nmh-store-title .accent { color: #c8a96e; }
.nmh-store-link {
  font-family: 'DM Sans', sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: rgba(0,0,0,0.32);
  cursor: pointer;
}
#home-nm.nm-dark .nmh-store-title { color: #fff; }
#home-nm.nm-dark .nmh-store-title .accent { color: #e8d5a3; }
#home-nm.nm-dark .nmh-store-link { color: rgba(232,213,163,0.55); }

/* ── Horizontal scroll rows ── */
.nmh-hscroll {
  display: flex;
  gap: 14px;
  overflow-x: auto;
  padding: 4px 2px 10px;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}
.nmh-hscroll::-webkit-scrollbar { display: none; }

/* ── Trending card ── */
.nmh-trend-card {
  flex: 0 0 188px;
  scroll-snap-align: start;
  border-radius: 22px;
  background: #f0f2f7;
  box-shadow: 7px 7px 18px rgba(0,0,0,0.14), -5px -5px 14px rgba(255,255,255,0.97);
  padding: 18px 18px 16px;
  cursor: pointer;
  position: relative;
  box-sizing: border-box;
  transition: transform .1s, box-shadow .15s;
}
.nmh-trend-card:active {
  transform: scale(.985);
  box-shadow: inset 5px 5px 12px rgba(0,0,0,0.13), inset -4px -4px 10px rgba(255,255,255,0.95);
}
.nmh-trend-badge {
  display: inline-block;
  font-family: 'DM Sans', sans-serif;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: #c8a96e;
  background: rgba(200,169,110,0.12);
  padding: 4px 9px;
  border-radius: 20px;
  margin-bottom: 12px;
}
.nmh-trend-word {
  font-family: 'DM Sans', sans-serif;
  font-size: 22px;
  font-weight: 800;
  color: #1a1a2e;
  letter-spacing: .3px;
  line-height: 1.05;
}
.nmh-trend-organ {
  font-family: 'DM Sans', sans-serif;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: #c8a96e;
  margin-top: 3px;
}
.nmh-trend-benefit {
  font-family: 'DM Sans', sans-serif;
  font-size: 12px;
  font-weight: 400;
  color: rgba(0,0,0,0.5);
  line-height: 1.4;
  margin-top: 8px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.nmh-trend-cta {
  font-family: 'DM Sans', sans-serif;
  font-size: 11px;
  font-weight: 700;
  color: #1a1a2e;
  margin-top: 14px;
  letter-spacing: .2px;
}

#home-nm.nm-dark .nmh-trend-card {
  background: #16163c;
  box-shadow: 8px 8px 22px rgba(0,0,0,0.88), -4px -4px 14px rgba(50,50,110,0.32);
}
#home-nm.nm-dark .nmh-trend-card:active {
  box-shadow: inset 6px 6px 14px rgba(0,0,0,0.85), inset -3px -3px 10px rgba(50,50,110,0.3);
}
#home-nm.nm-dark .nmh-trend-badge { color: #e8d5a3; background: rgba(232,213,163,0.12); }
#home-nm.nm-dark .nmh-trend-word { color: #fff; }
#home-nm.nm-dark .nmh-trend-organ { color: #e8d5a3; }
#home-nm.nm-dark .nmh-trend-benefit { color: rgba(255,255,255,0.55); }
#home-nm.nm-dark .nmh-trend-cta { color: #e8d5a3; }

/* ── Offer card ── */
.nmh-offer-card {
  flex: 0 0 156px;
  scroll-snap-align: start;
  border-radius: 22px;
  background: #f0f2f7;
  box-shadow: 7px 7px 18px rgba(0,0,0,0.14), -5px -5px 14px rgba(255,255,255,0.97);
  padding: 16px 16px 14px;
  cursor: pointer;
  position: relative;
  box-sizing: border-box;
  transition: transform .1s, box-shadow .15s;
}
.nmh-offer-card:active {
  transform: scale(.985);
  box-shadow: inset 5px 5px 12px rgba(0,0,0,0.13), inset -4px -4px 10px rgba(255,255,255,0.95);
}
.nmh-offer-badge {
  position: absolute;
  top: 12px; right: 12px;
  font-family: 'DM Sans', sans-serif;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .3px;
  color: #fff;
  background: linear-gradient(135deg, #e0644b, #c8442e);
  padding: 4px 9px;
  border-radius: 20px;
}
.nmh-offer-word {
  font-family: 'DM Sans', sans-serif;
  font-size: 19px;
  font-weight: 800;
  color: #1a1a2e;
  letter-spacing: .3px;
  margin-top: 26px;
}
.nmh-offer-price {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-top: 10px;
}
.nmh-offer-now {
  font-family: 'DM Sans', sans-serif;
  font-size: 20px;
  font-weight: 800;
  color: #c8a96e;
}
.nmh-offer-was {
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 500;
  color: rgba(0,0,0,0.32);
  text-decoration: line-through;
}
.nmh-offer-cta {
  font-family: 'DM Sans', sans-serif;
  font-size: 11px;
  font-weight: 700;
  color: #1a1a2e;
  margin-top: 14px;
}

#home-nm.nm-dark .nmh-offer-card {
  background: #16163c;
  box-shadow: 8px 8px 22px rgba(0,0,0,0.88), -4px -4px 14px rgba(50,50,110,0.32);
}
#home-nm.nm-dark .nmh-offer-card:active {
  box-shadow: inset 6px 6px 14px rgba(0,0,0,0.85), inset -3px -3px 10px rgba(50,50,110,0.3);
}
#home-nm.nm-dark .nmh-offer-word { color: #fff; }
#home-nm.nm-dark .nmh-offer-now  { color: #e8d5a3; }
#home-nm.nm-dark .nmh-offer-was  { color: rgba(255,255,255,0.32); }
#home-nm.nm-dark .nmh-offer-cta  { color: #e8d5a3; }

/* ═══════════════════════════════════════════════════════════════
   INNER PAGE 1 — SOUND LIBRARY  (#sub-sound-library)
   Neumorphism skin · light = day, dark = night (body.nm-night)
═══════════════════════════════════════════════════════════════ */

/* Hide the cinematic photo layers */
body.nm-mode #sub-sound-library .sl-bg,
body.nm-mode #sub-sound-library .sl-bg-overlay,
body.nm-mode #sub-sound-library .sl-banner-img,
body.nm-mode #sub-sound-library .sl-banner-fade { display: none !important; }

/* Screen surface */
body.nm-mode #sub-sound-library .sl-screen { background: #f0f2f7 !important; }
body.nm-night #sub-sound-library .sl-screen { background: #0c0c20 !important; }

/* Banner header → clean panel */
body.nm-mode #sub-sound-library .sl-banner { height: 150px !important; background: transparent !important; }
body.nm-mode #sub-sound-library .sl-back-btn svg path,
body.nm-mode #sub-sound-library .sl-back-btn svg line { stroke: #1a1a2e !important; }
body.nm-night #sub-sound-library .sl-back-btn svg path,
body.nm-night #sub-sound-library .sl-back-btn svg line { stroke: rgba(232,213,163,0.9) !important; }

body.nm-mode #sub-sound-library .sl-eyebrow { color: #c8a96e !important; }
body.nm-night #sub-sound-library .sl-eyebrow { color: #e8d5a3 !important; }
body.nm-mode #sub-sound-library .sl-banner-title { color: #1a1a2e !important; text-shadow: none !important; }
body.nm-night #sub-sound-library .sl-banner-title { color: #fff !important; }
body.nm-mode #sub-sound-library .sl-stat { color: rgba(0,0,0,0.45) !important; }
body.nm-mode #sub-sound-library .sl-stat strong { color: #1a1a2e !important; }
body.nm-mode #sub-sound-library .sl-stat-sep { color: rgba(0,0,0,0.2) !important; }
body.nm-night #sub-sound-library .sl-stat { color: rgba(255,255,255,0.5) !important; }
body.nm-night #sub-sound-library .sl-stat strong { color: rgba(255,255,255,0.85) !important; }
body.nm-night #sub-sound-library .sl-stat-sep { color: rgba(255,255,255,0.2) !important; }

/* Tab bar */
body.nm-mode #sub-sound-library .sl-tabs {
  background: #f0f2f7 !important;
  border-bottom: none !important;
  box-shadow: 0 6px 14px rgba(0,0,0,0.08) !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
body.nm-night #sub-sound-library .sl-tabs {
  background: #0c0c20 !important;
  box-shadow: 0 6px 16px rgba(0,0,0,0.6) !important;
}
body.nm-mode #sub-sound-library .sl-tab { color: rgba(0,0,0,0.35) !important; }
body.nm-mode #sub-sound-library .sl-tab.active { color: #c8a96e !important; border-bottom-color: #c8a96e !important; }
body.nm-night #sub-sound-library .sl-tab { color: rgba(255,255,255,0.32) !important; }
body.nm-night #sub-sound-library .sl-tab.active { color: #e8d5a3 !important; border-bottom-color: #e8d5a3 !important; }
body.nm-mode #sub-sound-library .sl-tab-badge { background: rgba(0,0,0,0.06) !important; color: rgba(0,0,0,0.4) !important; border-radius: 20px !important; }
body.nm-mode #sub-sound-library .sl-tab.active .sl-tab-badge { background: rgba(200,169,110,0.18) !important; color: #c8a96e !important; }
body.nm-night #sub-sound-library .sl-tab-badge { background: rgba(255,255,255,0.08) !important; color: rgba(255,255,255,0.4) !important; }
body.nm-night #sub-sound-library .sl-tab.active .sl-tab-badge { background: rgba(232,213,163,0.18) !important; color: #e8d5a3 !important; }

/* Content surface */
body.nm-mode #sub-sound-library .sl-content { background: transparent !important; }

/* Sort row + buttons */
body.nm-mode #sub-sound-library .sl-sort-label { color: rgba(0,0,0,0.32) !important; }
body.nm-night #sub-sound-library .sl-sort-label { color: rgba(255,255,255,0.3) !important; }
body.nm-mode #sub-sound-library .sl-sort-btn {
  background: #f0f2f7 !important; border: none !important; color: rgba(0,0,0,0.4) !important;
  border-radius: 12px !important; box-shadow: 3px 3px 7px rgba(0,0,0,0.12),-2px -2px 6px rgba(255,255,255,0.95) !important;
}
body.nm-mode #sub-sound-library .sl-sort-btn.active { color: #c8a96e !important; box-shadow: inset 2px 2px 5px rgba(0,0,0,0.12),inset -2px -2px 5px rgba(255,255,255,0.95) !important; }
body.nm-night #sub-sound-library .sl-sort-btn {
  background: #16163c !important; border: none !important; color: rgba(255,255,255,0.4) !important;
  border-radius: 12px !important; box-shadow: 3px 3px 8px rgba(0,0,0,0.85),-2px -2px 6px rgba(50,50,110,0.3) !important;
}
body.nm-night #sub-sound-library .sl-sort-btn.active { color: #e8d5a3 !important; box-shadow: inset 2px 2px 6px rgba(0,0,0,0.85),inset -2px -2px 5px rgba(50,50,110,0.3) !important; }

/* Sentence cards → neumorphic raised */
body.nm-mode #sub-sound-library .sl-sentence-card {
  background: #f0f2f7 !important; border: none !important; border-radius: 20px !important;
  box-shadow: 7px 7px 18px rgba(0,0,0,0.13),-5px -5px 14px rgba(255,255,255,0.97) !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
body.nm-mode #sub-sound-library .sl-sentence-card::before { display: none !important; }
body.nm-night #sub-sound-library .sl-sentence-card {
  background: #16163c !important; border: none !important; border-radius: 20px !important;
  box-shadow: 8px 8px 22px rgba(0,0,0,0.88),-4px -4px 14px rgba(50,50,110,0.32) !important;
}
body.nm-mode #sub-sound-library .sl-sentence-eyebrow { color: #c8a96e !important; }
body.nm-night #sub-sound-library .sl-sentence-eyebrow { color: #e8d5a3 !important; }
body.nm-mode #sub-sound-library .sl-sentence-date { color: rgba(0,0,0,0.3) !important; }
body.nm-mode #sub-sound-library .sl-sentence-text { color: rgba(0,0,0,0.78) !important; }
body.nm-mode #sub-sound-library .sl-sentence-text .sl-word-hl { color: #c8a96e !important; border-bottom-color: rgba(200,169,110,0.35) !important; }
body.nm-night #sub-sound-library .sl-sentence-text { color: rgba(255,255,255,0.86) !important; }
body.nm-mode #sub-sound-library .sl-sentence-chip { color: #a8854a !important; border-color: rgba(200,169,110,0.3) !important; background: rgba(200,169,110,0.07) !important; border-radius: 12px !important; }
body.nm-night #sub-sound-library .sl-sentence-chip { border-radius: 12px !important; }
body.nm-mode #sub-sound-library .sl-sentence-footer { border-top-color: rgba(0,0,0,0.08) !important; }
body.nm-mode #sub-sound-library .sl-sentence-meta { color: rgba(0,0,0,0.3) !important; }
body.nm-mode #sub-sound-library .sl-sentence-play-btn {
  background: #f0f2f7 !important; border: none !important; border-radius: 12px !important;
  box-shadow: 3px 3px 8px rgba(0,0,0,0.13),-2px -2px 6px rgba(255,255,255,0.95) !important;
}
body.nm-night #sub-sound-library .sl-sentence-play-btn { border-radius: 12px !important; }
body.nm-mode #sub-sound-library .sl-sentence-play-btn svg path,
body.nm-mode #sub-sound-library .sl-sentence-play-btn svg polygon { stroke: #c8a96e !important; fill: #c8a96e !important; }
body.nm-mode #sub-sound-library .sl-sentence-delete-btn {
  background: #f0f2f7 !important; border: none !important; border-radius: 12px !important;
  box-shadow: 3px 3px 8px rgba(0,0,0,0.13),-2px -2px 6px rgba(255,255,255,0.95) !important;
}
body.nm-night #sub-sound-library .sl-sentence-delete-btn { border-radius: 12px !important; }

/* Word cards */
body.nm-mode #sub-sound-library .sl-word-card { border-bottom-color: rgba(0,0,0,0.07) !important; }
body.nm-mode #sub-sound-library .sl-word-card:active { background: rgba(0,0,0,0.03) !important; }
body.nm-mode #sub-sound-library .sl-word-disc {
  background: #f0f2f7 !important; border: none !important; border-radius: 14px !important;
  box-shadow: inset 2px 2px 6px rgba(0,0,0,0.13),inset -2px -2px 5px rgba(255,255,255,0.95) !important;
}
body.nm-night #sub-sound-library .sl-word-disc { background: #16163c !important; border: none !important; border-radius: 14px !important; box-shadow: inset 2px 2px 6px rgba(0,0,0,0.85),inset -2px -2px 5px rgba(50,50,110,0.3) !important; }
body.nm-mode #sub-sound-library .sl-word-disc::after { display: none !important; }
body.nm-mode #sub-sound-library .sl-word-disc-letter { color: rgba(0,0,0,0.4) !important; }
body.nm-mode #sub-sound-library .sl-word-name { color: #1a1a2e !important; }
body.nm-mode #sub-sound-library .sl-word-phonetic { color: rgba(0,0,0,0.35) !important; }
body.nm-night #sub-sound-library .sl-word-name { color: #fff !important; }
body.nm-night #sub-sound-library .sl-word-phonetic { color: rgba(255,255,255,0.35) !important; }
body.nm-mode #sub-sound-library .sl-word-organ { color: rgba(0,0,0,0.25) !important; }
body.nm-mode #sub-sound-library .sl-badge-sub { color: #5a8fa8 !important; border-color: rgba(90,143,168,0.3) !important; background: rgba(90,143,168,0.07) !important; border-radius: 10px !important; }
body.nm-mode #sub-sound-library .sl-badge-buy { color: #a8854a !important; border-color: rgba(200,169,110,0.3) !important; background: rgba(200,169,110,0.07) !important; border-radius: 10px !important; }
body.nm-night #sub-sound-library .sl-word-badge { border-radius: 10px !important; }
body.nm-mode #sub-sound-library .sl-purchased-date { color: rgba(200,169,110,0.55) !important; }

/* Filter chips */
body.nm-mode #sub-sound-library .sl-filter-chip {
  background: #f0f2f7 !important; border: none !important; color: rgba(0,0,0,0.4) !important; border-radius: 20px !important;
  box-shadow: 3px 3px 7px rgba(0,0,0,0.11),-2px -2px 6px rgba(255,255,255,0.95) !important;
}
body.nm-mode #sub-sound-library .sl-filter-chip.active { color: #c8a96e !important; box-shadow: inset 2px 2px 5px rgba(0,0,0,0.12),inset -2px -2px 5px rgba(255,255,255,0.95) !important; }
body.nm-night #sub-sound-library .sl-filter-chip {
  background: #16163c !important; border: none !important; color: rgba(255,255,255,0.4) !important; border-radius: 20px !important;
  box-shadow: 3px 3px 8px rgba(0,0,0,0.85),-2px -2px 6px rgba(50,50,110,0.3) !important;
}
body.nm-night #sub-sound-library .sl-filter-chip.active { color: #e8d5a3 !important; box-shadow: inset 2px 2px 6px rgba(0,0,0,0.85),inset -2px -2px 5px rgba(50,50,110,0.3) !important; }
body.nm-mode #sub-sound-library .sl-word-count-label { color: rgba(0,0,0,0.3) !important; }
body.nm-mode #sub-sound-library .sl-word-count-label span { color: rgba(0,0,0,0.55) !important; }

/* Empty state */
body.nm-mode #sub-sound-library .sl-empty-title { color: rgba(0,0,0,0.45) !important; }
body.nm-mode #sub-sound-library .sl-empty-text { color: rgba(0,0,0,0.3) !important; }
body.nm-mode #sub-sound-library .sl-empty-cta {
  background: #f0f2f7 !important; border: none !important; color: #c8a96e !important; border-radius: 14px !important;
  box-shadow: 4px 4px 10px rgba(0,0,0,0.13),-3px -3px 8px rgba(255,255,255,0.95) !important;
}
body.nm-night #sub-sound-library .sl-empty-cta { background: #16163c !important; border: none !important; color: #e8d5a3 !important; border-radius: 14px !important; box-shadow: 4px 4px 12px rgba(0,0,0,0.85),-3px -3px 8px rgba(50,50,110,0.3) !important; }

/* Upgrade banner */
body.nm-mode #sub-sound-library .sl-upgrade-banner {
  background: #f0f2f7 !important; border: none !important; border-radius: 20px !important;
  box-shadow: 7px 7px 18px rgba(0,0,0,0.13),-5px -5px 14px rgba(255,255,255,0.97) !important;
}
body.nm-mode #sub-sound-library .sl-upgrade-banner::before { display: none !important; }
body.nm-night #sub-sound-library .sl-upgrade-banner { background: #16163c !important; border: none !important; border-radius: 20px !important; box-shadow: 8px 8px 22px rgba(0,0,0,0.88),-4px -4px 14px rgba(50,50,110,0.32) !important; }
body.nm-mode #sub-sound-library .sl-upgrade-label { color: #c8a96e !important; }
body.nm-night #sub-sound-library .sl-upgrade-label { color: #e8d5a3 !important; }
body.nm-mode #sub-sound-library .sl-upgrade-title { color: #1a1a2e !important; }
body.nm-mode #sub-sound-library .sl-upgrade-text { color: rgba(0,0,0,0.5) !important; }
body.nm-mode #sub-sound-library .sl-upgrade-btn {
  background: #f0f2f7 !important; border: none !important; color: #c8a96e !important; border-radius: 14px !important;
  box-shadow: 4px 4px 10px rgba(0,0,0,0.13),-3px -3px 8px rgba(255,255,255,0.95) !important;
}
body.nm-night #sub-sound-library .sl-upgrade-btn { background: #16163c !important; border: none !important; color: #e8d5a3 !important; border-radius: 14px !important; box-shadow: 4px 4px 12px rgba(0,0,0,0.85),-3px -3px 8px rgba(50,50,110,0.3) !important; }

/* ═══════════════════════════════════════════════════════════════
   SETTINGS  (#sub-social) — full neumorphism redesign
   No images · clean sections · light=day, dark=night
═══════════════════════════════════════════════════════════════ */

/* Screen surface */
body.nm-mode #sub-social { background: #f0f2f7 !important; }
body.nm-night #sub-social { background: #0c0c20 !important; }
body.nm-mode #sub-social .ss-wrap,
body.nm-mode #sub-social .ss-tab-content { background: transparent !important; }

/* Kill the cinematic banner, setting-row icons + the search glyph image */
body.nm-mode #sub-social .menu-banner { display: none !important; }
body.nm-mode #sub-social .sr-icon { display: none !important; }
body.nm-mode #sub-social .ss-search-ico { display: none !important; }

/* Back button → neumorphic pill */
body.nm-mode #sub-social .sub-back {
  background: #f0f2f7 !important; border: none !important; color: #1a1a2e !important;
  border-radius: 20px !important;
  box-shadow: 4px 4px 10px rgba(0,0,0,0.13), -3px -3px 8px rgba(255,255,255,0.95) !important;
}
body.nm-night #sub-social .sub-back {
  background: #16163c !important; color: #e8d5a3 !important;
  box-shadow: 4px 4px 12px rgba(0,0,0,0.85), -3px -3px 8px rgba(50,50,110,0.3) !important;
}

/* Header */
body.nm-mode #sub-social .ss-hd-eyebrow { color: #c8a96e !important; }
body.nm-night #sub-social .ss-hd-eyebrow { color: #e8d5a3 !important; }
body.nm-mode #sub-social .ss-hd-title { color: #1a1a2e !important; }
body.nm-night #sub-social .ss-hd-title { color: #fff !important; }

/* Tab bar (Settings / Discover) */
body.nm-mode #sub-social .ss-tabs {
  background: #f0f2f7 !important; border-bottom: none !important;
  box-shadow: 0 6px 14px rgba(0,0,0,0.07) !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
body.nm-night #sub-social .ss-tabs { background: #0c0c20 !important; box-shadow: 0 6px 16px rgba(0,0,0,0.6) !important; }
body.nm-mode #sub-social .ss-tab { color: rgba(0,0,0,0.35) !important; }
body.nm-mode #sub-social .ss-tab.active { color: #c8a96e !important; border-bottom-color: #c8a96e !important; }
body.nm-night #sub-social .ss-tab { color: rgba(255,255,255,0.32) !important; }
body.nm-night #sub-social .ss-tab.active { color: #e8d5a3 !important; border-bottom-color: #e8d5a3 !important; }

/* Section labels */
body.nm-mode #sub-social .slbl { color: rgba(0,0,0,0.4) !important; }
body.nm-night #sub-social .slbl { color: rgba(255,255,255,0.32) !important; }

/* Section groups → neumorphic raised cards */
body.nm-mode #sub-social .sg {
  background: #f0f2f7 !important; border: none !important; border-radius: 20px !important;
  box-shadow: 7px 7px 18px rgba(0,0,0,0.12), -5px -5px 14px rgba(255,255,255,0.97) !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
  padding: 4px 18px !important;
}
body.nm-night #sub-social .sg {
  background: #16163c !important; border: none !important; border-radius: 20px !important;
  box-shadow: 8px 8px 22px rgba(0,0,0,0.88), -4px -4px 14px rgba(50,50,110,0.32) !important;
  padding: 4px 18px !important;
}

/* Profile card */
body.nm-mode #sub-social .ss-profile-card { padding: 16px 18px !important; }
body.nm-mode #sub-social #ss-prof-name { color: #1a1a2e !important; }
body.nm-mode #sub-social #ss-prof-email { color: rgba(0,0,0,0.45) !important; }
body.nm-night #sub-social #ss-prof-name { color: #fff !important; }
body.nm-night #sub-social #ss-prof-email { color: rgba(255,255,255,0.5) !important; }

/* Rows */
body.nm-mode #sub-social .sr { border-bottom-color: rgba(0,0,0,0.07) !important; padding-left: 0 !important; padding-right: 0 !important; }
body.nm-mode #sub-social .sr:active { background: rgba(0,0,0,0.03) !important; }
body.nm-night #sub-social .sr { border-bottom-color: rgba(255,255,255,0.07) !important; padding-left: 0 !important; padding-right: 0 !important; }
body.nm-mode #sub-social .sr-label { color: #1a1a2e !important; }
body.nm-mode #sub-social .sr-sub { color: rgba(0,0,0,0.45) !important; }
body.nm-mode #sub-social .sr-chev { color: rgba(0,0,0,0.25) !important; }
body.nm-night #sub-social .sr-label { color: #fff !important; }
body.nm-night #sub-social .sr-sub { color: rgba(255,255,255,0.45) !important; }
body.nm-night #sub-social .sr-chev { color: rgba(255,255,255,0.25) !important; }
body.nm-mode #sub-social .sr-label.danger,
body.nm-mode #sub-social .sr-label.red { color: #d04545 !important; }

/* Value pills (Voice / Speed / etc.) → neumorphic inset chips */
body.nm-mode #sub-social [id$="-pill"],
body.nm-mode #sub-social .sr-val {
  color: #a8854a !important;
  background: #f0f2f7 !important;
  border-radius: 12px !important;
  box-shadow: inset 2px 2px 5px rgba(0,0,0,0.12), inset -2px -2px 5px rgba(255,255,255,0.95) !important;
}
body.nm-night #sub-social [id$="-pill"],
body.nm-night #sub-social .sr-val {
  color: #e8d5a3 !important;
  background: #16163c !important;
  border-radius: 12px !important;
  box-shadow: inset 2px 2px 6px rgba(0,0,0,0.85), inset -2px -2px 5px rgba(50,50,110,0.3) !important;
}

/* Toggle track → neumorphic groove (knob colour still driven by JS) */
body.nm-mode #sub-social .stgl { box-shadow: inset 2px 2px 5px rgba(0,0,0,0.14), inset -2px -2px 5px rgba(255,255,255,0.92) !important; }
body.nm-night #sub-social .stgl { box-shadow: inset 2px 2px 6px rgba(0,0,0,0.85), inset -2px -2px 5px rgba(50,50,110,0.3) !important; }

/* Search field → neumorphic inset */
body.nm-mode #sub-social .ss-search {
  background: #f0f2f7 !important; border: none !important; color: #1a1a2e !important;
  border-radius: 14px !important; padding-left: 16px !important;
  box-shadow: inset 3px 3px 8px rgba(0,0,0,0.12), inset -2px -2px 6px rgba(255,255,255,0.95) !important;
  backdrop-filter: none !important;
}
body.nm-night #sub-social .ss-search {
  background: #16163c !important; border: none !important; color: #fff !important;
  border-radius: 14px !important; padding-left: 16px !important;
  box-shadow: inset 3px 3px 8px rgba(0,0,0,0.85), inset -2px -2px 6px rgba(50,50,110,0.3) !important;
}
body.nm-mode #sub-social .ss-search::placeholder { color: rgba(0,0,0,0.3) !important; }

/* ── Sliding panels → WHITE NEUMORPHISM ──
   Inline white text is recolored to dark and gold accents to deep-gold via
   [style*=] attribute selectors; dark-background buttons are re-whitened so
   they stay readable. */
body.nm-mode #sub-social .ss-panel { background: #f0f2f7 !important; }

/* Skip the subscription cinematic intro overlay */
body.nm-mode #sub-social #sub-intro-page { display: none !important; }

/* White inline text → dark */
body.nm-mode #sub-social .ss-panel [style*="#fff"],
body.nm-mode #sub-social .ss-panel [style*="255,255,255"],
body.nm-mode #sub-social .ss-panel [style*="255, 255, 255"] { color: #2a2533 !important; }

/* Gold / accent inline text → deep gold (keeps the accent on cream) */
body.nm-mode #sub-social .ss-panel [style*="e8d5a3"],
body.nm-mode #sub-social .ss-panel [style*="accent-gold"],
body.nm-mode #sub-social .ss-panel [style*="var(--accent"] { color: #a8854a !important; }

/* Re-whiten buttons that have a dark background (so their label stays visible) */
body.nm-mode #sub-social .ss-panel button[style*="rgba(0,0,0"],
body.nm-mode #sub-social .ss-panel button[style*="background:#060c18"],
body.nm-mode #sub-social .ss-panel button[style*="135deg,#e8d5a3"] { color: #060c18 !important; }

/* Panel headings / sub (class-based) */
body.nm-mode #sub-social .ss-panel-title { color: #1a1a2e !important; }
body.nm-mode #sub-social .ss-panel-sub { color: rgba(0,0,0,0.5) !important; }
body.nm-mode #sub-social .ss-panel-header { border-bottom-color: rgba(0,0,0,0.07) !important; }

/* Back button */
body.nm-mode #sub-social .ss-back, body.nm-mode #sub-social .ss-panel-back { color: #1a1a2e !important; }
body.nm-mode #sub-social .ss-back svg { stroke: #1a1a2e !important; }

/* Inputs / textareas → neumorphic inset */
body.nm-mode #sub-social .ss-panel input,
body.nm-mode #sub-social .ss-panel textarea,
body.nm-mode #sub-social .ss-input {
  background: #f0f2f7 !important; border: none !important; color: #1a1a2e !important; border-radius: 14px !important;
  box-shadow: inset 3px 3px 8px rgba(0,0,0,0.12), inset -2px -2px 6px rgba(255,255,255,0.95) !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
body.nm-mode #sub-social .ss-panel input::placeholder,
body.nm-mode #sub-social .ss-panel textarea::placeholder { color: rgba(0,0,0,0.3) !important; }

/* Billing toggle */
body.nm-mode #sub-social .bill-toggle {
  background: #f0f2f7 !important; border: none !important;
  box-shadow: inset 3px 3px 8px rgba(0,0,0,0.12), inset -2px -2px 6px rgba(255,255,255,0.95) !important;
}
body.nm-mode #sub-social .bill-btn { color: rgba(0,0,0,0.5) !important; }
body.nm-mode #sub-social .bill-btn[style*="background:rgba(255,255,255"] {
  background: #f0f2f7 !important; color: #1a1a2e !important;
  box-shadow: 3px 3px 8px rgba(0,0,0,0.13), -2px -2px 6px rgba(255,255,255,0.95) !important;
}

/* Plan cards + option rows + checks */
body.nm-mode #sub-social .ss-plan-card {
  background: #f0f2f7 !important; border: none !important; border-radius: 18px !important;
  box-shadow: 7px 7px 18px rgba(0,0,0,0.12), -5px -5px 14px rgba(255,255,255,0.97) !important;
}
body.nm-mode #sub-social .ss-option { border-bottom-color: rgba(0,0,0,0.07) !important; }
body.nm-mode #sub-social .ss-option-label { color: #1a1a2e !important; }
body.nm-mode #sub-social .ss-option-sub { color: rgba(0,0,0,0.45) !important; }
body.nm-mode #sub-social .ss-check { border-color: rgba(0,0,0,0.25) !important; }

/* Gold gradient CTA buttons keep dark text (already dark via re-whiten rule) */
body.nm-mode #sub-social .ss-btn-primary { color: #060c18 !important; }

/* ═══════════════════════════════════════════════════════════════
   INNER PAGE 2 — NOWSSB STORE  (#sub-nowssb-store)
   Neumorphism · no video/photo · light=day, dark=night
═══════════════════════════════════════════════════════════════ */

/* Body surface */
body.nm-mode #sub-nowssb-store .nss-body { background: #f0f2f7 !important; }
body.nm-night #sub-nowssb-store .nss-body { background: #0c0c20 !important; }

/* Banner header — strip the cinematic slideshow, keep a clean header band */
body.nm-mode #sub-nowssb-store .nss-banner {
  aspect-ratio: auto !important; min-height: 0 !important; height: 150px !important;
  background: transparent !important;
}
body.nm-mode #sub-nowssb-store .nss-banner-slides,
body.nm-mode #sub-nowssb-store .nss-banner-fade { display: none !important; }
/* Second (image) banner block — direct sibling after .nss-banner */
body.nm-mode #sub-nowssb-store .nss-banner + div { display: none !important; }
body.nm-mode #sub-nowssb-store .nss-banner-back svg path,
body.nm-mode #sub-nowssb-store .nss-banner-back svg line { stroke: #1a1a2e !important; }
body.nm-night #sub-nowssb-store .nss-banner-back svg path,
body.nm-night #sub-nowssb-store .nss-banner-back svg line { stroke: rgba(232,213,163,0.9) !important; }
body.nm-mode #sub-nowssb-store .nss-banner-back {
  background: #f0f2f7 !important; border: none !important; border-radius: 50% !important;
  box-shadow: 4px 4px 10px rgba(0,0,0,0.13), -3px -3px 8px rgba(255,255,255,0.95) !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
body.nm-night #sub-nowssb-store .nss-banner-back {
  background: #16163c !important; box-shadow: 4px 4px 12px rgba(0,0,0,0.85), -3px -3px 8px rgba(50,50,110,0.3) !important;
}
body.nm-mode #sub-nowssb-store .nss-banner-eyebrow { color: #c8a96e !important; text-shadow: none !important; }
body.nm-night #sub-nowssb-store .nss-banner-eyebrow { color: #e8d5a3 !important; }
body.nm-mode #sub-nowssb-store .nss-banner-title-light,
body.nm-mode #sub-nowssb-store .nss-banner-title-bold { color: #1a1a2e !important; text-shadow: none !important; }
body.nm-night #sub-nowssb-store .nss-banner-title-light,
body.nm-night #sub-nowssb-store .nss-banner-title-bold { color: #fff !important; }
body.nm-mode #sub-nowssb-store .nss-banner-sub { color: rgba(0,0,0,0.5) !important; }
body.nm-night #sub-nowssb-store .nss-banner-sub { color: rgba(255,255,255,0.55) !important; }

/* Topbar cart / wishlist icons */
body.nm-mode #sub-nowssb-store .nss-store-icon-btn {
  background: #f0f2f7 !important; border: none !important;
  box-shadow: 4px 4px 10px rgba(0,0,0,0.13), -3px -3px 8px rgba(255,255,255,0.95) !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
body.nm-night #sub-nowssb-store .nss-store-icon-btn {
  background: #16163c !important; box-shadow: 4px 4px 12px rgba(0,0,0,0.85), -3px -3px 8px rgba(50,50,110,0.3) !important;
}
body.nm-mode #sub-nowssb-store .nss-store-icon-btn svg path,
body.nm-mode #sub-nowssb-store .nss-store-icon-btn svg circle { stroke: #1a1a2e !important; }
body.nm-night #sub-nowssb-store .nss-store-icon-btn svg path,
body.nm-night #sub-nowssb-store .nss-store-icon-btn svg circle { stroke: rgba(232,213,163,0.9) !important; }

/* Library cards (Word + Meaning) → neumorphic, no video */
body.nm-mode #sub-nowssb-store .ws-store-section,
body.nm-mode #sub-nowssb-store .ms-home-card {
  aspect-ratio: auto !important; background: #f0f2f7 !important; border: none !important;
  border-radius: 22px !important; margin-bottom: 16px !important;
  box-shadow: 7px 7px 18px rgba(0,0,0,0.13), -5px -5px 14px rgba(255,255,255,0.97) !important;
}
body.nm-night #sub-nowssb-store .ws-store-section,
body.nm-night #sub-nowssb-store .ms-home-card {
  aspect-ratio: auto !important; background: #16163c !important; border: none !important;
  border-radius: 22px !important; margin-bottom: 16px !important;
  box-shadow: 8px 8px 22px rgba(0,0,0,0.88), -4px -4px 14px rgba(50,50,110,0.32) !important;
}
body.nm-mode #sub-nowssb-store .ws-store-video,
body.nm-mode #sub-nowssb-store .ms-home-card-bg,
body.nm-mode #sub-nowssb-store .ws-store-overlay,
body.nm-mode #sub-nowssb-store .ms-home-card-overlay { display: none !important; }
/* Card content becomes flow layout (no longer absolute over video) */
body.nm-mode #sub-nowssb-store .ws-store-content,
body.nm-mode #sub-nowssb-store .ms-home-card-content { position: relative !important; inset: auto !important; padding: 22px !important; }
body.nm-mode #sub-nowssb-store .ws-store-eyebrow-wrap { position: relative !important; top: auto !important; left: auto !important; margin-bottom: 12px !important; }
body.nm-mode #sub-nowssb-store .ms-home-card-content .ws-store-text-block { padding-top: 0 !important; }

body.nm-mode #sub-nowssb-store .ws-store-eyebrow { color: #c8a96e !important; text-shadow: none !important; }
body.nm-night #sub-nowssb-store .ws-store-eyebrow { color: #e8d5a3 !important; text-shadow: none !important; }
body.nm-mode #sub-nowssb-store .ws-store-title-light,
body.nm-mode #sub-nowssb-store .ws-store-title-bold { color: #1a1a2e !important; text-shadow: none !important; }
body.nm-night #sub-nowssb-store .ws-store-title-light,
body.nm-night #sub-nowssb-store .ws-store-title-bold { color: #fff !important; text-shadow: none !important; }
body.nm-mode #sub-nowssb-store .ws-store-sub { color: rgba(0,0,0,0.5) !important; }
body.nm-night #sub-nowssb-store .ws-store-sub { color: rgba(255,255,255,0.55) !important; }

/* Category chips inside library cards */
body.nm-mode #sub-nowssb-store .ws-store-btn-wrap span {
  color: #a8854a !important; background: rgba(200,169,110,0.08) !important;
  border: 1px solid rgba(200,169,110,0.3) !important; border-radius: 20px !important;
}
body.nm-night #sub-nowssb-store .ws-store-btn-wrap span {
  color: #e8d5a3 !important; background: rgba(232,213,163,0.1) !important;
  border: 1px solid rgba(232,213,163,0.25) !important; border-radius: 20px !important;
}

/* Library card CTA → neumorphic gold button */
body.nm-mode #sub-nowssb-store .ws-store-btn {
  background: linear-gradient(135deg,#e8d5a3,#c4a35a) !important; color: #060c18 !important;
  border-radius: 14px !important;
  box-shadow: 4px 4px 10px rgba(0,0,0,0.18), -3px -3px 8px rgba(255,255,255,0.6) !important;
}
body.nm-night #sub-nowssb-store .ws-store-btn {
  box-shadow: 4px 4px 12px rgba(0,0,0,0.7), -2px -2px 8px rgba(50,50,110,0.3) !important;
}

/* Cart / wishlist panels */
body.nm-mode #sub-nowssb-store .nss-panel { background: #f0f2f7 !important; border-top: none !important; border-radius: 22px 22px 0 0 !important; }
body.nm-night #sub-nowssb-store .nss-panel { background: #14143a !important; border-top: none !important; border-radius: 22px 22px 0 0 !important; }
body.nm-mode #sub-nowssb-store .nss-panel-head { border-bottom-color: rgba(0,0,0,0.07) !important; }
body.nm-mode #sub-nowssb-store .nss-panel-title { color: #1a1a2e !important; }
body.nm-night #sub-nowssb-store .nss-panel-title { color: #fff !important; }
body.nm-mode #sub-nowssb-store .nss-panel-handle { background: rgba(0,0,0,0.15) !important; }
body.nm-mode #sub-nowssb-store .nss-panel-close { background: #f0f2f7 !important; box-shadow: 3px 3px 7px rgba(0,0,0,0.13),-2px -2px 6px rgba(255,255,255,0.95) !important; border-radius: 50% !important; }
body.nm-night #sub-nowssb-store .nss-panel-close { background: #1c1c44 !important; }
body.nm-mode #sub-nowssb-store .nss-panel-item { border-bottom-color: rgba(0,0,0,0.06) !important; }
body.nm-mode #sub-nowssb-store .nss-panel-item-name { color: #1a1a2e !important; }
body.nm-night #sub-nowssb-store .nss-panel-item-name { color: #fff !important; }
body.nm-mode #sub-nowssb-store .nss-panel-item-price { color: #a8854a !important; }
body.nm-mode #sub-nowssb-store .nss-panel-empty { color: rgba(0,0,0,0.32) !important; }
body.nm-mode #sub-nowssb-store .nss-cart-total-amount { color: #a8854a !important; }
body.nm-mode #sub-nowssb-store .nss-cart-total-label { color: rgba(0,0,0,0.45) !important; }

/* ═══════════════════════════════════════════════════════════════
   INNER PAGE 3 — PRACTICE PLAYER  (#sub-practice)
   Neumorphism · cinematic bg removed, disc artwork kept
   light=day, dark=night
═══════════════════════════════════════════════════════════════ */

/* Surface — drop the photographic / video background */
body.nm-mode #sub-practice .sp-player { background: #f0f2f7 !important; }
body.nm-night #sub-practice .sp-player { background: #0c0c20 !important; }
body.nm-mode #sub-practice .sp-bg-img,
body.nm-mode #sub-practice .sp-bg-video,
body.nm-mode #sub-practice .sp-bg-overlay,
body.nm-mode #sub-practice .sp-bg-glow { display: none !important; }

/* Word title */
body.nm-mode #sub-practice .sp-word-title { color: #1a1a2e !important; text-shadow: none !important; }
body.nm-night #sub-practice .sp-word-title { color: #fff !important; text-shadow: none !important; }

/* Glass ring → neumorphic raised well */
body.nm-mode #sub-practice .sp-glass-ring {
  background: #f0f2f7 !important; border: none !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
  box-shadow: 9px 9px 24px rgba(0,0,0,0.16), -7px -7px 20px rgba(255,255,255,0.95) !important;
}
body.nm-night #sub-practice .sp-glass-ring {
  background: #16163c !important; border: none !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
  box-shadow: 9px 9px 26px rgba(0,0,0,0.9), -5px -5px 16px rgba(50,50,110,0.32) !important;
}
body.nm-mode #sub-practice .sp-glass-ring::before { display: none !important; }

/* Disc — keep artwork, soften the heavy black rings */
body.nm-mode #sub-practice .sp-disc { box-shadow: 0 8px 22px rgba(0,0,0,0.22) !important; }
body.nm-mode #sub-practice .sp-disc-outer::after { box-shadow: 0 6px 18px rgba(0,0,0,0.18) !important; border-color: rgba(0,0,0,0.08) !important; }
body.nm-night #sub-practice .sp-disc { box-shadow: 0 10px 26px rgba(0,0,0,0.85) !important; }

/* Play orb → neumorphic */
body.nm-mode #sub-practice .sp-play-orb {
  background: #f0f2f7 !important; border: none !important; backdrop-filter: none !important;
  box-shadow: 4px 4px 12px rgba(0,0,0,0.18), -3px -3px 9px rgba(255,255,255,0.92) !important;
}
body.nm-night #sub-practice .sp-play-orb {
  background: #16163c !important; border: none !important;
  box-shadow: 4px 4px 14px rgba(0,0,0,0.85), -2px -2px 9px rgba(50,50,110,0.3) !important;
}

/* Prev / next nav buttons */
body.nm-mode #sub-practice .sp-nav-btn {
  background: #f0f2f7 !important; border: none !important;
  box-shadow: 4px 4px 10px rgba(0,0,0,0.14), -3px -3px 8px rgba(255,255,255,0.92) !important;
}
body.nm-mode #sub-practice .sp-nav-btn svg path { stroke: #1a1a2e !important; }
body.nm-night #sub-practice .sp-nav-btn {
  background: #16163c !important; border: none !important;
  box-shadow: 4px 4px 12px rgba(0,0,0,0.85), -2px -2px 8px rgba(50,50,110,0.3) !important;
}
body.nm-night #sub-practice .sp-nav-btn svg path { stroke: rgba(232,213,163,0.9) !important; }

/* Status + hint text */
body.nm-mode #sub-practice .sp-auto-status { color: rgba(0,0,0,0.42) !important; }
body.nm-night #sub-practice .sp-auto-status { color: rgba(255,255,255,0.4) !important; }
body.nm-mode #sub-practice .sp-rec-status { color: rgba(0,0,0,0.4) !important; }
body.nm-mode #sub-practice .sp-rec-compare-hint { color: rgba(0,0,0,0.45) !important; }
body.nm-mode #sub-practice #spScoreLabel { color: #a8854a !important; }
body.nm-mode #sub-practice #spPersonaText { color: rgba(0,0,0,0.7) !important; }
body.nm-night #sub-practice #spPersonaText { color: rgba(255,255,255,0.75) !important; }

/* 3-button bar */
body.nm-mode #sub-practice .sp-3btn-bar {
  background: #f0f2f7 !important; border-top: none !important;
  box-shadow: 0 -6px 16px rgba(0,0,0,0.08) !important;
}
body.nm-night #sub-practice .sp-3btn-bar { background: #0c0c20 !important; box-shadow: 0 -6px 18px rgba(0,0,0,0.6) !important; }
body.nm-mode #sub-practice .sp-3btn { color: rgba(0,0,0,0.42) !important; border-right-color: rgba(0,0,0,0.08) !important; }
body.nm-night #sub-practice .sp-3btn { color: rgba(255,255,255,0.4) !important; border-right-color: rgba(255,255,255,0.07) !important; }
body.nm-mode #sub-practice .sp-3btn.sp-btn-playing { color: #c8a96e !important; background: rgba(200,169,110,0.06) !important; }
body.nm-night #sub-practice .sp-3btn.sp-btn-playing { color: #e8d5a3 !important; }

/* Listen meaning + tip */
body.nm-mode #sub-practice .sp-listen-meaning { color: rgba(0,0,0,0.6) !important; }
body.nm-night #sub-practice .sp-listen-meaning { color: rgba(255,255,255,0.55) !important; }
body.nm-mode #sub-practice .sp-listen-tip {
  background: #f0f2f7 !important; border: none !important; border-radius: 14px !important;
  box-shadow: 5px 5px 14px rgba(0,0,0,0.1), -4px -4px 10px rgba(255,255,255,0.95) !important;
}
body.nm-night #sub-practice .sp-listen-tip {
  background: #16163c !important; border: none !important; border-radius: 14px !important;
  box-shadow: 5px 5px 16px rgba(0,0,0,0.8), -3px -3px 10px rgba(50,50,110,0.3) !important;
}
body.nm-mode #sub-practice .sp-listen-tip-label { color: #a8854a !important; }
body.nm-night #sub-practice .sp-listen-tip-label { color: #e8d5a3 !important; }
body.nm-mode #sub-practice .sp-listen-tip-text { color: rgba(0,0,0,0.55) !important; }

/* Info cells */
body.nm-mode #sub-practice .sp-info-cell {
  background: #f0f2f7 !important; border: none !important; border-radius: 14px !important;
  box-shadow: 4px 4px 12px rgba(0,0,0,0.1), -3px -3px 9px rgba(255,255,255,0.95) !important;
}
body.nm-mode #sub-practice .sp-info-cell::before { display: none !important; }
body.nm-night #sub-practice .sp-info-cell {
  background: #16163c !important; border: none !important; border-radius: 14px !important;
  box-shadow: 4px 4px 12px rgba(0,0,0,0.8), -2px -2px 9px rgba(50,50,110,0.3) !important;
}
body.nm-mode #sub-practice .sp-info-label { color: #a8854a !important; }
body.nm-night #sub-practice .sp-info-label { color: #c8e8f5 !important; }
body.nm-mode #sub-practice .sp-info-text { color: rgba(0,0,0,0.7) !important; }
body.nm-mode #sub-practice .sp-meaning-body { color: rgba(0,0,0,0.7) !important; }

/* Library strip */
body.nm-mode #sub-practice .sp-lib-trigger {
  background: #f0f2f7 !important; border: none !important; backdrop-filter: none !important;
  box-shadow: 4px 4px 10px rgba(0,0,0,0.14), -3px -3px 8px rgba(255,255,255,0.92) !important;
}
body.nm-night #sub-practice .sp-lib-trigger {
  background: #16163c !important; border: none !important;
  box-shadow: 4px 4px 12px rgba(0,0,0,0.85), -2px -2px 8px rgba(50,50,110,0.3) !important;
}
body.nm-mode #sub-practice .sp-lib-trigger-label { color: #a8854a !important; }
body.nm-night #sub-practice .sp-lib-trigger-label { color: #c8e8f5 !important; }
body.nm-mode #sub-practice .sp-lib-title { color: #a8854a !important; }
body.nm-night #sub-practice .sp-lib-title { color: #e8d5a3 !important; }
body.nm-mode #sub-practice .sp-lib-count { color: rgba(0,0,0,0.4) !important; }
body.nm-mode #sub-practice .sp-lib-word-chip {
  background: #f0f2f7 !important; border: none !important; color: rgba(0,0,0,0.55) !important; border-radius: 20px !important;
  box-shadow: 3px 3px 7px rgba(0,0,0,0.11), -2px -2px 6px rgba(255,255,255,0.95) !important;
}
body.nm-mode #sub-practice .sp-lib-word-chip.selected { color: #c8a96e !important; box-shadow: inset 2px 2px 5px rgba(0,0,0,0.12), inset -2px -2px 5px rgba(255,255,255,0.95) !important; }
body.nm-night #sub-practice .sp-lib-word-chip {
  background: #16163c !important; border: none !important; color: rgba(255,255,255,0.55) !important; border-radius: 20px !important;
  box-shadow: 3px 3px 8px rgba(0,0,0,0.85), -2px -2px 6px rgba(50,50,110,0.3) !important;
}
body.nm-night #sub-practice .sp-lib-word-chip.selected { color: #e8d5a3 !important; box-shadow: inset 2px 2px 6px rgba(0,0,0,0.85), inset -2px -2px 5px rgba(50,50,110,0.3) !important; }
body.nm-mode #sub-practice .sp-lib-build-btn,
body.nm-mode #sub-practice .sp-complete-btn {
  background: linear-gradient(135deg,#e8d5a3,#c4a35a) !important; border: none !important; color: #060c18 !important; border-radius: 14px !important;
  box-shadow: 4px 4px 10px rgba(0,0,0,0.16), -3px -3px 8px rgba(255,255,255,0.6) !important;
}
body.nm-night #sub-practice .sp-lib-build-btn,
body.nm-night #sub-practice .sp-complete-btn { box-shadow: 4px 4px 12px rgba(0,0,0,0.7), -2px -2px 8px rgba(50,50,110,0.3) !important; }
body.nm-mode #sub-practice .sp-lib-sentence-wrap {
  background: #f0f2f7 !important; border: none !important; border-left: 3px solid #c8a96e !important; border-radius: 14px !important;
  box-shadow: 5px 5px 14px rgba(0,0,0,0.1), -4px -4px 10px rgba(255,255,255,0.95) !important;
}
body.nm-night #sub-practice .sp-lib-sentence-wrap {
  background: #16163c !important; border: none !important; border-left: 3px solid #e8d5a3 !important; border-radius: 14px !important;
  box-shadow: 5px 5px 16px rgba(0,0,0,0.8), -3px -3px 10px rgba(50,50,110,0.3) !important;
}
body.nm-mode #sub-practice .sp-lib-sentence-text { color: rgba(0,0,0,0.78) !important; }
body.nm-mode #sub-practice .sp-lib-sentence-text .sp-lib-word-hl { color: #a8854a !important; }
body.nm-mode #sub-practice .sp-lib-sentence-label { color: #a8854a !important; }
body.nm-mode #sub-practice .sp-lib-play-btn {
  background: #f0f2f7 !important; border: none !important;
  box-shadow: 3px 3px 8px rgba(0,0,0,0.13), -2px -2px 6px rgba(255,255,255,0.95) !important;
}
body.nm-night #sub-practice .sp-lib-play-btn { background: #16163c !important; border: none !important; box-shadow: 3px 3px 8px rgba(0,0,0,0.85), -2px -2px 6px rgba(50,50,110,0.3) !important; }

/* Rep presets + big counter */
body.nm-mode #sub-practice .sp-rep-preset {
  border: none !important; color: rgba(0,0,0,0.4) !important; border-radius: 12px !important;
  box-shadow: 3px 3px 7px rgba(0,0,0,0.11), -2px -2px 6px rgba(255,255,255,0.95) !important; background: #f0f2f7 !important;
}
body.nm-mode #sub-practice .sp-rep-preset.active { color: #c8a96e !important; box-shadow: inset 2px 2px 5px rgba(0,0,0,0.12), inset -2px -2px 5px rgba(255,255,255,0.95) !important; }
body.nm-night #sub-practice .sp-rep-preset {
  border: none !important; color: rgba(255,255,255,0.4) !important; border-radius: 12px !important; background: #16163c !important;
  box-shadow: 3px 3px 8px rgba(0,0,0,0.85), -2px -2px 6px rgba(50,50,110,0.3) !important;
}
body.nm-night #sub-practice .sp-rep-preset.active { color: #e8d5a3 !important; box-shadow: inset 2px 2px 6px rgba(0,0,0,0.85), inset -2px -2px 5px rgba(50,50,110,0.3) !important; }
body.nm-mode #sub-practice .sp-rep-big { color: #1a1a2e !important; text-shadow: none !important; }
body.nm-night #sub-practice .sp-rep-big { color: #fff !important; text-shadow: none !important; }

/* ═══════════════════════════════════════════════════════════════
   INNER PAGE 4 — ROUTINES  (#sub-routines + #sub-routine-detail)
   Neumorphism · light=day, dark=night
═══════════════════════════════════════════════════════════════ */

/* Surface */
body.nm-mode #sub-routines .rt-screen,
body.nm-mode #sub-routine-detail .rt-screen { background: #f0f2f7 !important; }
body.nm-night #sub-routines .rt-screen,
body.nm-night #sub-routine-detail .rt-screen { background: #0c0c20 !important; }

/* Hide cinematic image layers */
body.nm-mode #sub-routines .rt-bg,
body.nm-mode #sub-routines .rt-bg-overlay,
body.nm-mode #sub-routines .rt-banner-img,
body.nm-mode #sub-routines .rt-banner-fade,
body.nm-mode #sub-routine-detail .rt-bg,
body.nm-mode #sub-routine-detail .rt-bg-overlay,
body.nm-mode #sub-routine-detail .rt-banner-img,
body.nm-mode #sub-routine-detail .rt-banner-fade,
body.nm-mode #sub-routine-detail .rt-edit-banner-img,
body.nm-mode #sub-routine-detail .rt-edit-banner-fade { display: none !important; }

/* Banner becomes a clean band */
body.nm-mode #sub-routines .rt-banner,
body.nm-mode #sub-routine-detail .rt-banner { height: 120px !important; background: transparent !important; }

/* Header / titles */
body.nm-mode #sub-routines .rt-banner-title, body.nm-mode #sub-routines .rt-title,
body.nm-mode #sub-routine-detail .rt-banner-title, body.nm-mode #sub-routine-detail .rt-title { color: rgba(0,0,0,0.45) !important; }
body.nm-night #sub-routines .rt-banner-title, body.nm-night #sub-routines .rt-title,
body.nm-night #sub-routine-detail .rt-banner-title, body.nm-night #sub-routine-detail .rt-title { color: rgba(255,255,255,0.45) !important; }
body.nm-mode #sub-routines .rt-section-label,
body.nm-mode #sub-routine-detail .rt-section-label { color: #c8a96e !important; }
body.nm-night #sub-routines .rt-section-label,
body.nm-night #sub-routine-detail .rt-section-label { color: #e8d5a3 !important; }

/* Routine cards → neumorphic raised */
body.nm-mode #sub-routines .rt-card,
body.nm-mode #sub-routine-detail .rt-card {
  background: #f0f2f7 !important; border: none !important; border-radius: 20px !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
  box-shadow: 7px 7px 18px rgba(0,0,0,0.12), -5px -5px 14px rgba(255,255,255,0.97) !important;
}
body.nm-mode #sub-routines .rt-card::before,
body.nm-mode #sub-routine-detail .rt-card::before { display: none !important; }
body.nm-mode #sub-routines .rt-card:active,
body.nm-mode #sub-routine-detail .rt-card:active { background: #eceef4 !important; }
body.nm-night #sub-routines .rt-card,
body.nm-night #sub-routine-detail .rt-card {
  background: #16163c !important; border: none !important; border-radius: 20px !important;
  box-shadow: 8px 8px 22px rgba(0,0,0,0.88), -4px -4px 14px rgba(50,50,110,0.32) !important;
}

body.nm-mode #sub-routines .rt-card-name,
body.nm-mode #sub-routine-detail .rt-card-name { color: #1a1a2e !important; }
body.nm-night #sub-routines .rt-card-name,
body.nm-night #sub-routine-detail .rt-card-name { color: #fff !important; }
body.nm-mode #sub-routines .rt-card-time,
body.nm-mode #sub-routine-detail .rt-card-time { color: rgba(0,0,0,0.35) !important; }
body.nm-mode #sub-routines .rt-card-stat-val,
body.nm-mode #sub-routine-detail .rt-card-stat-val { color: #1a1a2e !important; }
body.nm-night #sub-routines .rt-card-stat-val,
body.nm-night #sub-routine-detail .rt-card-stat-val { color: #fff !important; }
body.nm-mode #sub-routines .rt-card-stat-label,
body.nm-mode #sub-routine-detail .rt-card-stat-label { color: rgba(0,0,0,0.3) !important; }
body.nm-mode #sub-routines .rt-card-footer,
body.nm-mode #sub-routine-detail .rt-card-footer { border-top-color: rgba(0,0,0,0.08) !important; }
body.nm-mode #sub-routines .rt-card-last,
body.nm-mode #sub-routine-detail .rt-card-last { color: rgba(0,0,0,0.3) !important; }

/* Start button → neumorphic */
body.nm-mode #sub-routines .rt-start-btn,
body.nm-mode #sub-routine-detail .rt-start-btn {
  background: #f0f2f7 !important; border: none !important; color: #c8a96e !important; border-radius: 12px !important;
  box-shadow: 3px 3px 8px rgba(0,0,0,0.13), -2px -2px 6px rgba(255,255,255,0.95) !important;
}
body.nm-night #sub-routines .rt-start-btn,
body.nm-night #sub-routine-detail .rt-start-btn {
  background: #16163c !important; border: none !important; color: #e8d5a3 !important; border-radius: 12px !important;
  box-shadow: 3px 3px 8px rgba(0,0,0,0.85), -2px -2px 6px rgba(50,50,110,0.3) !important;
}

/* Word rows in detail */
body.nm-mode #sub-routine-detail .rd-word-row { border-bottom-color: rgba(0,0,0,0.07) !important; }
body.nm-night #sub-routine-detail .rd-word-row { border-bottom-color: rgba(255,255,255,0.07) !important; }

/* Edit sheet */
body.nm-mode #sub-routine-detail .rt-edit-sheet { background: #f0f2f7 !important; border-top: none !important; }
body.nm-night #sub-routine-detail .rt-edit-sheet { background: #14143a !important; border-top: none !important; }
body.nm-mode #sub-routine-detail .rt-edit-title { color: #c8a96e !important; }
body.nm-night #sub-routine-detail .rt-edit-title { color: #e8d5a3 !important; }
body.nm-mode #sub-routine-detail .rt-edit-label { color: rgba(0,0,0,0.4) !important; }
body.nm-mode #sub-routine-detail .rt-edit-input {
  background: #f0f2f7 !important; border: none !important; color: #1a1a2e !important; border-radius: 12px !important;
  box-shadow: inset 3px 3px 8px rgba(0,0,0,0.12), inset -2px -2px 6px rgba(255,255,255,0.95) !important;
}
body.nm-night #sub-routine-detail .rt-edit-input {
  background: #16163c !important; border: none !important; color: #fff !important; border-radius: 12px !important;
  box-shadow: inset 3px 3px 8px rgba(0,0,0,0.85), inset -2px -2px 6px rgba(50,50,110,0.3) !important;
}
body.nm-mode #sub-routine-detail .rt-edit-time-chip {
  background: #f0f2f7 !important; border: none !important; color: rgba(0,0,0,0.4) !important; border-radius: 12px !important;
  box-shadow: 3px 3px 7px rgba(0,0,0,0.11), -2px -2px 6px rgba(255,255,255,0.95) !important;
}
body.nm-mode #sub-routine-detail .rt-edit-time-chip.active { color: #c8a96e !important; box-shadow: inset 2px 2px 5px rgba(0,0,0,0.12), inset -2px -2px 5px rgba(255,255,255,0.95) !important; }
body.nm-night #sub-routine-detail .rt-edit-time-chip {
  background: #16163c !important; border: none !important; color: rgba(255,255,255,0.4) !important; border-radius: 12px !important;
  box-shadow: 3px 3px 8px rgba(0,0,0,0.85), -2px -2px 6px rgba(50,50,110,0.3) !important;
}
body.nm-night #sub-routine-detail .rt-edit-time-chip.active { color: #e8d5a3 !important; box-shadow: inset 2px 2px 6px rgba(0,0,0,0.85), inset -2px -2px 5px rgba(50,50,110,0.3) !important; }
body.nm-mode #sub-routine-detail .rt-edit-save,
body.nm-night #sub-routine-detail .rt-edit-save {
  background: linear-gradient(135deg,#e8d5a3,#c4a35a) !important; border: none !important; color: #060c18 !important; border-radius: 12px !important;
}

/* ═══════════════════════════════════════════════════════════════
   SETTINGS — purpose-built neumorphic UI (#nm-settings-view)
   Replaces the reskinned fashion list in normal-home mode.
═══════════════════════════════════════════════════════════════ */

/* View switch */
#nm-settings-view { display: none; }
body.nm-mode #sub-social #ss-main-view { display: none !important; }
body.nm-mode #sub-social #nm-settings-view {
  display: block; position: absolute; inset: 0; overflow-y: auto; -webkit-overflow-scrolling: touch;
  background: #f0f2f7; padding: 0 18px calc(var(--nav-height,58px) + max(env(safe-area-inset-bottom,28px),28px));
}
body.nm-night #sub-social #nm-settings-view { background: #0c0c20; }
#nm-settings-view::-webkit-scrollbar { display: none; }

/* Header */
.nmset-top { display: flex; align-items: center; gap: 14px; padding: 18px 0 8px; position: sticky; top: 0; z-index: 5;
  background: #f0f2f7; }
body.nm-night #nm-settings-view .nmset-top { background: #0c0c20; }
.nmset-back {
  width: 42px; height: 42px; border-radius: 50%; flex-shrink: 0; border: none; cursor: pointer;
  background: #f0f2f7; display: flex; align-items: center; justify-content: center;
  box-shadow: 5px 5px 12px rgba(0,0,0,0.16), -4px -4px 10px rgba(255,255,255,0.95);
}
.nmset-back:active { box-shadow: inset 3px 3px 7px rgba(0,0,0,0.16), inset -2px -2px 6px rgba(255,255,255,0.95); }
.nmset-back svg { stroke: #1a1a2e; }
body.nm-night #nm-settings-view .nmset-back { background: #16163c; box-shadow: 5px 5px 13px rgba(0,0,0,0.85), -3px -3px 10px rgba(50,50,110,0.3); }
body.nm-night #nm-settings-view .nmset-back svg { stroke: #e8d5a3; }
.nmset-title { font-family: 'DM Sans', sans-serif; font-size: 26px; font-weight: 800; color: #1a1a2e; letter-spacing: -0.5px; }
body.nm-night #nm-settings-view .nmset-title { color: #fff; }

/* Profile hero card */
.nmset-hero {
  display: flex; align-items: center; gap: 16px; margin: 16px 0 8px; padding: 20px; cursor: pointer;
  border-radius: 24px; background: #f0f2f7;
  box-shadow: 9px 9px 22px rgba(0,0,0,0.14), -7px -7px 18px rgba(255,255,255,0.97);
}
.nmset-hero:active { box-shadow: inset 6px 6px 14px rgba(0,0,0,0.12), inset -5px -5px 12px rgba(255,255,255,0.95); }
body.nm-night #nm-settings-view .nmset-hero { background: #16163c; box-shadow: 9px 9px 24px rgba(0,0,0,0.88), -5px -5px 16px rgba(50,50,110,0.32); }
.nmset-hero-av {
  width: 60px; height: 60px; border-radius: 50%; flex-shrink: 0; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #e8d5a3, #c8e8f5); color: #060c18; font-family: 'DM Sans', sans-serif; font-size: 24px; font-weight: 800;
  box-shadow: 4px 4px 10px rgba(0,0,0,0.18);
}
.nmset-hero-info { flex: 1; min-width: 0; }
.nmset-hero-name { font-family: 'DM Sans', sans-serif; font-size: 19px; font-weight: 800; color: #1a1a2e; }
body.nm-night #nm-settings-view .nmset-hero-name { color: #fff; }
.nmset-hero-email { font-family: 'DM Sans', sans-serif; font-size: 13px; color: rgba(0,0,0,0.45); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body.nm-night #nm-settings-view .nmset-hero-email { color: rgba(255,255,255,0.5); }
.nmset-hero-badge { display: inline-block; margin-top: 8px; font-family: 'DM Sans', sans-serif; font-size: 10px; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase; color: #a8854a; background: rgba(200,169,110,0.14); padding: 4px 11px; border-radius: 20px; }
body.nm-night #nm-settings-view .nmset-hero-badge { color: #e8d5a3; background: rgba(232,213,163,0.14); }
.nmset-hero-chev { flex-shrink: 0; }
.nmset-hero-chev svg { stroke: rgba(0,0,0,0.25); }
body.nm-night #nm-settings-view .nmset-hero-chev svg { stroke: rgba(255,255,255,0.3); }

/* Quick-action grid (Flipkart-style) */
.nmset-quick { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 14px 0 6px; }
.nmset-qtile { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 16px 6px; cursor: pointer;
  border-radius: 20px; background: #f0f2f7; box-shadow: 6px 6px 14px rgba(0,0,0,0.12), -5px -5px 12px rgba(255,255,255,0.96); }
.nmset-qtile:active { box-shadow: inset 4px 4px 10px rgba(0,0,0,0.12), inset -3px -3px 8px rgba(255,255,255,0.95); }
body.nm-night #nm-settings-view .nmset-qtile { background: #16163c; box-shadow: 6px 6px 16px rgba(0,0,0,0.85), -4px -4px 12px rgba(50,50,110,0.3); }
.nmset-qtile-ico { width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; }
.nmset-qtile-ico svg { stroke: #c8a96e; }
body.nm-night #nm-settings-view .nmset-qtile-ico svg { stroke: #e8d5a3; }
.nmset-qtile-label { font-family: 'DM Sans', sans-serif; font-size: 10px; font-weight: 700; letter-spacing: .3px; color: #1a1a2e; text-align: center; }
body.nm-night #nm-settings-view .nmset-qtile-label { color: rgba(255,255,255,0.85); }

/* Sections */
.nmset-sec-label { font-family: 'DM Sans', sans-serif; font-size: 11px; font-weight: 800; letter-spacing: 2px; text-transform: uppercase; color: rgba(0,0,0,0.38); margin: 24px 6px 12px; }
body.nm-night #nm-settings-view .nmset-sec-label { color: rgba(255,255,255,0.35); }

/* Section card */
.nmset-card { border-radius: 22px; background: #f0f2f7; padding: 6px 18px; box-shadow: 8px 8px 20px rgba(0,0,0,0.12), -6px -6px 16px rgba(255,255,255,0.97); }
body.nm-night #nm-settings-view .nmset-card { background: #16163c; box-shadow: 8px 8px 22px rgba(0,0,0,0.88), -4px -4px 14px rgba(50,50,110,0.32); }

/* Row */
.nmset-row { display: flex; align-items: center; gap: 14px; padding: 15px 0; cursor: pointer; border-bottom: 1px solid rgba(0,0,0,0.06); }
body.nm-night #nm-settings-view .nmset-row { border-bottom-color: rgba(255,255,255,0.07); }
.nmset-row:last-child { border-bottom: none; }
.nmset-row:active { opacity: 0.7; }
.nmset-ico { width: 40px; height: 40px; border-radius: 13px; flex-shrink: 0; display: flex; align-items: center; justify-content: center;
  background: #f0f2f7; box-shadow: inset 3px 3px 7px rgba(0,0,0,0.13), inset -2px -2px 6px rgba(255,255,255,0.95); }
.nmset-ico svg { stroke: #c8a96e; }
body.nm-night #nm-settings-view .nmset-ico { background: #16163c; box-shadow: inset 3px 3px 8px rgba(0,0,0,0.85), inset -2px -2px 5px rgba(50,50,110,0.3); }
body.nm-night #nm-settings-view .nmset-ico svg { stroke: #e8d5a3; }
.nmset-text { flex: 1; min-width: 0; }
.nmset-label { font-family: 'DM Sans', sans-serif; font-size: 15px; font-weight: 600; color: #1a1a2e; }
body.nm-night #nm-settings-view .nmset-label { color: #fff; }
.nmset-sub { font-family: 'DM Sans', sans-serif; font-size: 12px; color: rgba(0,0,0,0.45); margin-top: 2px; }
body.nm-night #nm-settings-view .nmset-sub { color: rgba(255,255,255,0.45); }
.nmset-val { flex-shrink: 0; font-family: 'DM Sans', sans-serif; font-size: 13px; font-weight: 800; color: #a8854a; background: #f0f2f7; padding: 6px 14px; border-radius: 20px;
  box-shadow: inset 2px 2px 5px rgba(0,0,0,0.12), inset -2px -2px 5px rgba(255,255,255,0.95); }
body.nm-night #nm-settings-view .nmset-val { color: #e8d5a3; background: #16163c; box-shadow: inset 2px 2px 6px rgba(0,0,0,0.85), inset -2px -2px 5px rgba(50,50,110,0.3); }
.nmset-chev { flex-shrink: 0; }
.nmset-chev svg { stroke: rgba(0,0,0,0.25); }
body.nm-night #nm-settings-view .nmset-chev svg { stroke: rgba(255,255,255,0.28); }

/* Toggle */
.nmset-tgl { width: 50px; height: 28px; border-radius: 14px; flex-shrink: 0; position: relative; cursor: pointer; transition: background .2s;
  background: #f0f2f7; box-shadow: inset 3px 3px 6px rgba(0,0,0,0.16), inset -2px -2px 5px rgba(255,255,255,0.92); }
body.nm-night #nm-settings-view .nmset-tgl { background: #16163c; box-shadow: inset 3px 3px 7px rgba(0,0,0,0.85), inset -2px -2px 5px rgba(50,50,110,0.3); }
.nmset-tgl.on { background: linear-gradient(135deg, #e8d5a3, #c4a35a); box-shadow: inset 2px 2px 5px rgba(140,110,40,0.4); }
.nmset-knob { position: absolute; top: 3px; left: 3px; width: 22px; height: 22px; border-radius: 50%; background: #fff; transition: left .2s;
  box-shadow: 2px 2px 5px rgba(0,0,0,0.3); }
.nmset-tgl.on .nmset-knob { left: 25px; background: #060c18; }

/* Danger */
.nmset-row.danger .nmset-label { color: #d04545; }
.nmset-row.danger .nmset-ico svg { stroke: #d04545; }

/* Sign-out button */
.nmset-signout { width: 100%; margin: 22px 0 8px; padding: 16px; border: none; cursor: pointer; border-radius: 18px;
  font-family: 'DM Sans', sans-serif; font-size: 14px; font-weight: 800; letter-spacing: .5px; color: #d04545;
  background: #f0f2f7; box-shadow: 6px 6px 14px rgba(0,0,0,0.12), -5px -5px 12px rgba(255,255,255,0.96); }
.nmset-signout:active { box-shadow: inset 4px 4px 10px rgba(0,0,0,0.12), inset -3px -3px 8px rgba(255,255,255,0.95); }
body.nm-night #nm-settings-view .nmset-signout { background: #16163c; box-shadow: 6px 6px 16px rgba(0,0,0,0.85), -4px -4px 12px rgba(50,50,110,0.3); }
.nmset-foot { text-align: center; font-family: 'DM Sans', sans-serif; font-size: 11px; color: rgba(0,0,0,0.3); padding: 10px 0 4px; }
body.nm-night #nm-settings-view .nmset-foot { color: rgba(255,255,255,0.25); }

/* Sound Library — fix filter chip / sort button height + centering (nm mode) */
body.nm-mode #sub-sound-library .sl-filter-row { align-items: center !important; }
body.nm-mode #sub-sound-library .sl-filter-chip {
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  height: 38px !important; min-height: 38px !important; padding: 0 16px !important; box-sizing: border-box !important;
  white-space: nowrap !important;
}
body.nm-mode #sub-sound-library .sl-sort-btn {
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  height: 34px !important; min-height: 34px !important; padding: 0 16px !important; box-sizing: border-box !important;
  white-space: nowrap !important;
}
body.nm-mode #sub-sound-library .sl-sort-row { align-items: center !important; }

/* ═══════════════════════════════════════════════════════════════
   INNER PAGE 5 — HEALTH  (#sub-health-journey / -male / -female / -category)
   Neumorphism · light=day, dark=night
═══════════════════════════════════════════════════════════════ */

/* Hide photographic backgrounds + surface */
body.nm-mode #sub-health-journey .sub-screen-bg,
body.nm-mode #sub-health-male .sub-screen-bg,
body.nm-mode #sub-health-female .sub-screen-bg,
body.nm-mode #sub-health-category .sub-screen-bg { display: none !important; }
body.nm-mode #sub-health-journey,
body.nm-mode #sub-health-male,
body.nm-mode #sub-health-female,
body.nm-mode #sub-health-category { background: #f0f2f7 !important; }
body.nm-night #sub-health-journey,
body.nm-night #sub-health-male,
body.nm-night #sub-health-female,
body.nm-night #sub-health-category { background: #0c0c20 !important; }

/* Shared header */
body.nm-mode #sub-health-journey .sub-title, body.nm-mode #sub-health-journey .sub-title span,
body.nm-mode #sub-health-male .sub-title, body.nm-mode #sub-health-male .sub-title span,
body.nm-mode #sub-health-female .sub-title, body.nm-mode #sub-health-female .sub-title span,
body.nm-mode #sub-health-category .sub-title, body.nm-mode #sub-health-category .sub-title span { color: #1a1a2e !important; }
body.nm-night #sub-health-journey .sub-title, body.nm-night #sub-health-journey .sub-title span,
body.nm-night #sub-health-male .sub-title, body.nm-night #sub-health-male .sub-title span,
body.nm-night #sub-health-female .sub-title, body.nm-night #sub-health-female .sub-title span,
body.nm-night #sub-health-category .sub-title, body.nm-night #sub-health-category .sub-title span { color: #fff !important; }
body.nm-mode #sub-health-journey .sub-back svg path, body.nm-mode #sub-health-journey .sub-back svg line,
body.nm-mode #sub-health-male .sub-back svg path, body.nm-mode #sub-health-male .sub-back svg line,
body.nm-mode #sub-health-female .sub-back svg path, body.nm-mode #sub-health-female .sub-back svg line,
body.nm-mode #sub-health-category .sub-back svg path, body.nm-mode #sub-health-category .sub-back svg line { stroke: #1a1a2e !important; }
body.nm-night #sub-health-journey .sub-back svg path, body.nm-night #sub-health-journey .sub-back svg line,
body.nm-night #sub-health-male .sub-back svg path, body.nm-night #sub-health-male .sub-back svg line,
body.nm-night #sub-health-female .sub-back svg path, body.nm-night #sub-health-female .sub-back svg line,
body.nm-night #sub-health-category .sub-back svg path, body.nm-night #sub-health-category .sub-back svg line { stroke: #e8d5a3 !important; }

/* Gender select */
body.nm-mode #sub-health-journey .gsel-eyebrow { color: #c8a96e !important; }
body.nm-night #sub-health-journey .gsel-eyebrow { color: #e8d5a3 !important; }
body.nm-mode #sub-health-journey .gsel-title { color: #1a1a2e !important; }
body.nm-night #sub-health-journey .gsel-title { color: #fff !important; }
body.nm-mode #sub-health-journey .gsel-sub { color: rgba(0,0,0,0.5) !important; }
body.nm-night #sub-health-journey .gsel-sub { color: rgba(255,255,255,0.6) !important; }
body.nm-mode #sub-health-journey .gsel-card {
  border: none !important; border-radius: 20px !important;
  box-shadow: 7px 7px 18px rgba(0,0,0,0.16), -5px -5px 14px rgba(255,255,255,0.9) !important;
}
body.nm-night #sub-health-journey .gsel-card {
  border: none !important; border-radius: 20px !important;
  box-shadow: 8px 8px 22px rgba(0,0,0,0.88), -4px -4px 14px rgba(50,50,110,0.32) !important;
}
body.nm-mode #sub-health-journey .brand-name { color: #1a1a2e !important; }

/* Category grids — hero band + items */
body.nm-mode #sub-health-male .hcat-hero-img, body.nm-mode #sub-health-female .hcat-hero-img { display: none !important; }
body.nm-mode #sub-health-male .hcat-hero, body.nm-mode #sub-health-female .hcat-hero {
  height: 120px !important; border: none !important; background: transparent !important;
}
body.nm-mode #sub-health-male .hcat-hero::after, body.nm-mode #sub-health-female .hcat-hero::after { display: none !important; }
body.nm-mode #sub-health-male .hcat-hero-label, body.nm-mode #sub-health-female .hcat-hero-label { color: #c8a96e !important; }
body.nm-night #sub-health-male .hcat-hero-label, body.nm-night #sub-health-female .hcat-hero-label { color: #e8d5a3 !important; }
body.nm-mode #sub-health-male .hcat-hero-name, body.nm-mode #sub-health-female .hcat-hero-name { color: #1a1a2e !important; }
body.nm-night #sub-health-male .hcat-hero-name, body.nm-night #sub-health-female .hcat-hero-name { color: #fff !important; }
body.nm-mode #sub-health-male .hcat-section-label, body.nm-mode #sub-health-female .hcat-section-label { color: rgba(0,0,0,0.4) !important; }
body.nm-night #sub-health-male .hcat-section-label, body.nm-night #sub-health-female .hcat-section-label { color: rgba(255,255,255,0.4) !important; }

body.nm-mode #sub-health-male .hcat-item, body.nm-mode #sub-health-female .hcat-item {
  background: #f0f2f7 !important; border: none !important; border-radius: 18px !important;
  box-shadow: 6px 6px 15px rgba(0,0,0,0.12), -5px -5px 12px rgba(255,255,255,0.96) !important;
}
body.nm-mode #sub-health-male .hcat-item:active, body.nm-mode #sub-health-female .hcat-item:active {
  box-shadow: inset 4px 4px 10px rgba(0,0,0,0.12), inset -3px -3px 8px rgba(255,255,255,0.95) !important;
}
body.nm-night #sub-health-male .hcat-item, body.nm-night #sub-health-female .hcat-item {
  background: #16163c !important; border: none !important; border-radius: 18px !important;
  box-shadow: 6px 6px 16px rgba(0,0,0,0.85), -4px -4px 12px rgba(50,50,110,0.3) !important;
}
body.nm-mode #sub-health-male .hcat-item-icon, body.nm-mode #sub-health-female .hcat-item-icon { color: #c8a96e !important; }
body.nm-night #sub-health-male .hcat-item-icon, body.nm-night #sub-health-female .hcat-item-icon { color: #e8d5a3 !important; }
body.nm-mode #sub-health-male .hcat-item-title, body.nm-mode #sub-health-female .hcat-item-title { color: #1a1a2e !important; }
body.nm-night #sub-health-male .hcat-item-title, body.nm-night #sub-health-female .hcat-item-title { color: #fff !important; }
body.nm-mode #sub-health-male .hcat-item-sub, body.nm-mode #sub-health-female .hcat-item-sub { color: rgba(0,0,0,0.42) !important; }
body.nm-night #sub-health-male .hcat-item-sub, body.nm-night #sub-health-female .hcat-item-sub { color: rgba(255,255,255,0.42) !important; }
body.nm-mode #sub-health-male .hcat-item-arr, body.nm-mode #sub-health-female .hcat-item-arr { color: #c8a96e !important; }

/* Category page */
body.nm-mode #sub-health-category #hcp-banner-img { background-image: none !important; background-color: #f0f2f7 !important; height: 130px !important; }
body.nm-night #sub-health-category #hcp-banner-img { background-color: #0c0c20 !important; }
body.nm-mode #sub-health-category #hcp-banner-img > div:first-child { display: none !important; }
body.nm-mode #sub-health-category #hcp-organ-tag { color: #c8a96e !important; opacity: 1 !important; }
body.nm-mode #sub-health-category #hcp-desc { color: rgba(0,0,0,0.6) !important; }
body.nm-night #sub-health-category #hcp-desc { color: rgba(255,255,255,0.7) !important; }
body.nm-mode #sub-health-category .rtd-tabs {
  background: #f0f2f7 !important; border-top: none !important; border-bottom: none !important;
  box-shadow: 0 6px 14px rgba(0,0,0,0.07) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
body.nm-night #sub-health-category .rtd-tabs { background: #0c0c20 !important; box-shadow: 0 6px 16px rgba(0,0,0,0.6) !important; }
body.nm-mode #sub-health-category .rtd-tab { color: rgba(0,0,0,0.35) !important; }
body.nm-mode #sub-health-category .rtd-tab.active { color: #c8a96e !important; }
body.nm-mode #sub-health-category .rtd-tab.active::after { background: #c8a96e !important; }
body.nm-night #sub-health-category .rtd-tab { color: rgba(255,255,255,0.32) !important; }
body.nm-night #sub-health-category .rtd-tab.active { color: #e8d5a3 !important; }
body.nm-night #sub-health-category .rtd-tab.active::after { background: #e8d5a3 !important; }
body.nm-mode #sub-health-category .rtd-word-row { border-bottom-color: rgba(0,0,0,0.07) !important; }
body.nm-night #sub-health-category .rtd-word-row { border-bottom-color: rgba(255,255,255,0.07) !important; }
body.nm-mode #sub-health-category .rtd-word-name { color: #1a1a2e !important; }
body.nm-night #sub-health-category .rtd-word-name { color: #fff !important; }
body.nm-mode #sub-health-category .rtd-bottom {
  background: #f0f2f7 !important; border-top: none !important;
  box-shadow: 0 -6px 16px rgba(0,0,0,0.08) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
body.nm-night #sub-health-category .rtd-bottom { background: #0c0c20 !important; box-shadow: 0 -6px 18px rgba(0,0,0,0.6) !important; }
body.nm-mode #sub-health-category .rtd-session-btn,
body.nm-night #sub-health-category .rtd-session-btn {
  background: linear-gradient(135deg,#e8d5a3,#c4a35a) !important; border: none !important; color: #060c18 !important; border-radius: 14px !important;
}

/* ═══════════════════════════════════════════════════════════════
   INNER PAGE 6 — COMMUNITY (social) → WHITE NEUMORPHISM
   Overrides the dark NowssB social design when in normal-home mode.
   Day-only (no night). Scoped to the social screens + social nav.
═══════════════════════════════════════════════════════════════ */

/* Screen surfaces + kill the dark ambient glow */
body.nm-mode #sub-people,
body.nm-mode #sub-ig-profile,
body.nm-mode #sub-social-home,
body.nm-mode #sub-reels-feed { background: #f0f2f7 !important; }
body.nm-mode #sub-people::before,
body.nm-mode #sub-ig-profile::before,
body.nm-mode #sub-social-home::before { display: none !important; }
body.nm-mode #sub-people .ig,
body.nm-mode #sub-ig-profile .ig { background: #f0f2f7 !important; }

/* Top bar */
body.nm-mode #sub-people .ig-topbar,
body.nm-mode #sub-ig-profile .ig-topbar,
body.nm-mode #sub-social-home .ig-topbar,
body.nm-mode #sub-reels-feed .ig-topbar {
  background: #f0f2f7 !important; border-bottom: none !important;
  box-shadow: 0 5px 13px rgba(0,0,0,0.07) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
body.nm-mode #sub-people .ig-username,
body.nm-mode #sub-ig-profile .ig-username,
body.nm-mode #sub-social-home .ig-username,
body.nm-mode #sub-reels-feed .ig-username { color: #1a1a2e !important; }
body.nm-mode #sub-ig-profile .ig-iconbtn svg { color: #1a1a2e !important; stroke: #1a1a2e !important; }
/* Topbar/nav icon images are white-filtered → make them dark on cream */
body.nm-mode #sub-people .ig-topbar img,
body.nm-mode #sub-ig-profile .ig-topbar img,
body.nm-mode #sub-social-home .ig-topbar img { filter: brightness(0) opacity(0.82) !important; }

/* Search */
body.nm-mode #sub-people .ig-searchwrap { background: #f0f2f7 !important; }
body.nm-mode #sub-people .ig-searchbar {
  background: #f0f2f7 !important; border: none !important;
  box-shadow: inset 3px 3px 8px rgba(0,0,0,0.12), inset -2px -2px 6px rgba(255,255,255,0.95) !important;
  color: rgba(0,0,0,0.55) !important;
}
body.nm-mode #sub-people .ig-searchbar input { color: #1a1a2e !important; }
body.nm-mode #sub-people .ig-searchbar input::placeholder { color: rgba(0,0,0,0.3) !important; }
body.nm-mode #sub-people .nwsb-search-icon { filter: brightness(0) opacity(0.55) !important; }

/* Explore tiles — neumorphic frame (images kept) */
body.nm-mode #sub-people .ig-tile,
body.nm-mode #sub-ig-profile .ig-tile {
  background: #f0f2f7 !important; border-radius: 16px !important;
  box-shadow: 5px 5px 12px rgba(0,0,0,0.12), -4px -4px 10px rgba(255,255,255,0.95) !important;
}

/* User rows — raised cards */
body.nm-mode #sub-people .ig-userrow,
body.nm-mode #sub-social-home .ig-userrow {
  background: #f0f2f7 !important; border: none !important; border-radius: 16px !important;
  box-shadow: 6px 6px 14px rgba(0,0,0,0.1), -5px -5px 12px rgba(255,255,255,0.96) !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
body.nm-mode #sub-people .ig-userrow .ig-u,
body.nm-mode #sub-social-home .ig-userrow .ig-u { color: #1a1a2e !important; }
body.nm-mode #sub-people .ig-userrow .ig-n,
body.nm-mode #sub-social-home .ig-userrow .ig-n { color: rgba(0,0,0,0.45) !important; }

/* Profile page */
body.nm-mode #sub-ig-profile .ig-prof-banner { background: linear-gradient(160deg, #e8eef7 0%, #dfe6f2 55%, #f0f2f7 100%) !important; }
body.nm-mode #sub-ig-profile .ig-prof-top { background: #f0f2f7 !important; }
body.nm-mode #sub-ig-profile .ig-prof-name { color: #1a1a2e !important; }
body.nm-mode #sub-ig-profile .ig-prof-cat { color: #a8854a !important; }
body.nm-mode #sub-ig-profile .ig-prof-bio,
body.nm-mode #sub-ig-profile .ig-prof-biotext { color: rgba(0,0,0,0.7) !important; }
body.nm-mode #sub-ig-profile .ig-stat .n { color: #a8854a !important; }
body.nm-mode #sub-ig-profile .ig-stat .l { color: rgba(0,0,0,0.4) !important; }
body.nm-mode #sub-ig-profile .ig-prof-initials { background: #e6e9f1 !important; color: #c8a96e !important; border: 3px solid #f0f2f7 !important; }
body.nm-mode #sub-ig-profile .ig-prof-plan-badge { color: #a8854a !important; background: rgba(200,169,110,0.14) !important; border-color: rgba(200,169,110,0.3) !important; }
body.nm-mode #sub-ig-profile .ig-prof-rank { color: rgba(0,0,0,0.45) !important; }

/* Action buttons */
body.nm-mode #sub-ig-profile .ig-btn.gray,
body.nm-mode #sub-ig-profile .ig-btn.icon {
  background: #f0f2f7 !important; border: none !important; color: #1a1a2e !important; border-radius: 14px !important;
  box-shadow: 4px 4px 10px rgba(0,0,0,0.12), -3px -3px 8px rgba(255,255,255,0.95) !important;
}
body.nm-mode #sub-ig-profile .ig-btn.gray svg { stroke: #1a1a2e !important; }

/* Tabs */
body.nm-mode #sub-ig-profile .ig-tabs { background: #f0f2f7 !important; border-top-color: rgba(0,0,0,0.08) !important; }
body.nm-mode #sub-ig-profile .ig-tab { color: rgba(0,0,0,0.3) !important; }
body.nm-mode #sub-ig-profile .ig-tab.active { color: #c8a96e !important; border-bottom-color: #c8a96e !important; }
body.nm-mode #sub-ig-profile .ig-tab svg { stroke: currentColor !important; }
body.nm-mode #sub-ig-profile .ig-tab-img { filter: brightness(0) opacity(0.7) !important; }
body.nm-mode #sub-ig-profile .ig-tab.active .ig-tab-img { filter: brightness(0) saturate(100%) invert(70%) sepia(30%) saturate(500%) hue-rotate(2deg) brightness(90%) !important; }

/* Highlights */
body.nm-mode #sub-ig-profile .ig-hl-circle { background: #f0f2f7 !important; border: none !important;
  box-shadow: 4px 4px 10px rgba(0,0,0,0.12), -3px -3px 8px rgba(255,255,255,0.95) !important; }
body.nm-mode #sub-ig-profile .ig-hl-circle svg { stroke: #c8a96e !important; }
body.nm-mode #sub-ig-profile .ig-hl-label { color: rgba(0,0,0,0.5) !important; }

/* Social bottom nav */
body.nm-mode #ig-social-nav {
  background: #f0f2f7 !important; border-top: none !important;
  box-shadow: 0 -6px 16px rgba(0,0,0,0.08) !important;
}
body.nm-mode #ig-social-nav .ig-social-img { filter: brightness(0) opacity(0.78) !important; }
body.nm-mode #ig-social-nav .ig-social-btn.active .ig-social-img { filter: brightness(0) saturate(100%) invert(70%) sepia(30%) saturate(500%) hue-rotate(2deg) brightness(90%) !important; }
body.nm-mode #ig-social-nav .ig-social-btn span { color: rgba(0,0,0,0.4) !important; }
body.nm-mode #ig-social-nav .ig-social-btn.active span { color: #c8a96e !important; }

/* Social home hero / stat cube → light neumorphic */
body.nm-mode #sub-social-home .nwsb-hero { background: #f0f2f7 !important; border: none !important;
  box-shadow: 8px 8px 20px rgba(0,0,0,0.12), -6px -6px 16px rgba(255,255,255,0.97) !important; }
body.nm-mode #sub-social-home .nwsb-hero-title { color: #1a1a2e !important; }
body.nm-mode #sub-social-home .nwsb-hero-sub { color: rgba(0,0,0,0.45) !important; }
body.nm-mode #sub-social-home .nwsb-hero-stat-num { color: #a8854a !important; }
body.nm-mode #sub-social-home .nwsb-hero-stat-lbl { color: rgba(0,0,0,0.4) !important; }
body.nm-mode #sub-social-home .nwsb-section-hd { color: rgba(0,0,0,0.4) !important; }

/* Reels feed — keep photo cards; lighten the empty/loading states */
body.nm-mode #sub-reels-feed .nwsb-reels-empty-title { color: rgba(0,0,0,0.55) !important; }
body.nm-mode #sub-reels-feed .nwsb-reels-empty-sub { color: rgba(0,0,0,0.35) !important; }

/* ═══════════════════════════════════════════════════════════════
   INNER PAGE 7 — SOUND BATH  (#sub-sound-bath)
   Neumorphism (light) · intro auto-skipped in nm-mode
═══════════════════════════════════════════════════════════════ */

/* Player surface (drop the dark radial bg) */
body.nm-mode #sub-sound-bath .sb-player-bg { background: #f0f2f7 !important; }

/* Top bar */
body.nm-mode #sub-sound-bath .sb-back-btn {
  background: #f0f2f7 !important; border: none !important;
  box-shadow: 4px 4px 10px rgba(0,0,0,0.13), -3px -3px 8px rgba(255,255,255,0.95) !important;
}
body.nm-mode #sub-sound-bath .sb-back-btn svg path,
body.nm-mode #sub-sound-bath .sb-back-btn svg line { stroke: #1a1a2e !important; }
body.nm-mode #sub-sound-bath .sb-timer-display { color: rgba(0,0,0,0.5) !important; }

/* Mode buttons → neumorphic */
body.nm-mode #sub-sound-bath .sb-mode-btn {
  background: #f0f2f7 !important; border: none !important; border-radius: 16px !important;
  box-shadow: 5px 5px 12px rgba(0,0,0,0.12), -4px -4px 10px rgba(255,255,255,0.96) !important;
}
body.nm-mode #sub-sound-bath .sb-mode-btn.active {
  background: #f0f2f7 !important;
  box-shadow: inset 4px 4px 9px rgba(0,0,0,0.13), inset -3px -3px 7px rgba(255,255,255,0.95) !important;
}
body.nm-mode #sub-sound-bath .sb-mode-label { color: rgba(0,0,0,0.45) !important; }
body.nm-mode #sub-sound-bath .sb-mode-btn.active .sb-mode-label { color: #c8a96e !important; }

/* Center text */
body.nm-mode #sub-sound-bath .sb-mode-title { color: #1a1a2e !important; }
body.nm-mode #sub-sound-bath .sb-mode-desc { color: rgba(0,0,0,0.5) !important; }

/* Play button — keep gold accent, add neumorphic lift */
body.nm-mode #sub-sound-bath .sb-play-btn {
  box-shadow: 6px 6px 16px rgba(0,0,0,0.18), -4px -4px 12px rgba(255,255,255,0.85) !important;
}

/* ═══════════════════════════════════════════════════════════════
   INNER PAGE 8 — MY PROGRESS  (#sub-my-progress)
   Neumorphism (light) · intro auto-skipped in nm-mode
═══════════════════════════════════════════════════════════════ */

/* Surface + drop photo bg + kill legibility text-shadows */
body.nm-mode #sub-my-progress { background: #f0f2f7 !important; }
body.nm-mode #sub-my-progress #mpBg,
body.nm-mode #sub-my-progress .sub-screen-bg { display: none !important; }
body.nm-mode #sub-my-progress * { text-shadow: none !important; }

/* Header */
body.nm-mode #sub-my-progress .sub-title, body.nm-mode #sub-my-progress .sub-title span { color: #1a1a2e !important; }
body.nm-mode #sub-my-progress .sub-back svg path, body.nm-mode #sub-my-progress .sub-back svg line { stroke: #1a1a2e !important; }

/* Greeting card */
body.nm-mode #sub-my-progress .mp-greeting {
  background: #f0f2f7 !important; border: none !important; border-radius: 20px !important;
  box-shadow: 7px 7px 18px rgba(0,0,0,0.12), -5px -5px 14px rgba(255,255,255,0.97) !important;
}
body.nm-mode #sub-my-progress .mp-greeting::before { display: none !important; }
body.nm-mode #sub-my-progress .mp-greeting-name { color: #c8a96e !important; }
body.nm-mode #sub-my-progress .mp-greeting-msg { color: #1a1a2e !important; }
body.nm-mode #sub-my-progress .mp-greeting-sub { color: rgba(0,0,0,0.5) !important; }
body.nm-mode #sub-my-progress .mp-last-practiced { color: rgba(0,0,0,0.45) !important; }

/* Stat boxes */
body.nm-mode #sub-my-progress .mp-stat-box {
  background: #f0f2f7 !important; border: none !important; border-radius: 16px !important;
  box-shadow: 6px 6px 14px rgba(0,0,0,0.11), -4px -4px 10px rgba(255,255,255,0.96) !important;
}
body.nm-mode #sub-my-progress .mp-stat-box::after { display: none !important; }
body.nm-mode #sub-my-progress .mp-stat-num { color: #c8a96e !important; }
body.nm-mode #sub-my-progress .mp-stat-label { color: rgba(0,0,0,0.45) !important; }
body.nm-mode #sub-my-progress .mp-stat-sub { color: rgba(0,0,0,0.32) !important; }

/* Week grid */
body.nm-mode #sub-my-progress .mp-week-dot {
  background: #f0f2f7 !important; border: none !important; color: rgba(0,0,0,0.3) !important; border-radius: 12px !important;
  box-shadow: inset 2px 2px 5px rgba(0,0,0,0.12), inset -2px -2px 5px rgba(255,255,255,0.95) !important;
}
body.nm-mode #sub-my-progress .mp-week-dot.done { color: #5a8fa8 !important; box-shadow: 3px 3px 7px rgba(0,0,0,0.12), -2px -2px 6px rgba(255,255,255,0.95) !important; }
body.nm-mode #sub-my-progress .mp-week-dot.done::after { background: #5a8fa8 !important; }
body.nm-mode #sub-my-progress .mp-week-dot.today { color: #c8a96e !important; box-shadow: 3px 3px 7px rgba(0,0,0,0.13), -2px -2px 6px rgba(255,255,255,0.95) !important; }
body.nm-mode #sub-my-progress .mp-week-name { color: rgba(0,0,0,0.35) !important; }

/* Session rows */
body.nm-mode #sub-my-progress .mp-session-row {
  background: #f0f2f7 !important; border: none !important; border-radius: 14px !important; margin-bottom: 8px !important;
  box-shadow: 5px 5px 12px rgba(0,0,0,0.1), -4px -4px 10px rgba(255,255,255,0.95) !important;
}
body.nm-mode #sub-my-progress .mp-session-disc {
  background: #f0f2f7 !important; border: none !important; color: #c8a96e !important;
  box-shadow: inset 2px 2px 5px rgba(0,0,0,0.12), inset -2px -2px 5px rgba(255,255,255,0.95) !important;
}
body.nm-mode #sub-my-progress .mp-session-word { color: #1a1a2e !important; }
body.nm-mode #sub-my-progress .mp-session-reps { color: #c8a96e !important; }
body.nm-mode #sub-my-progress .mp-session-reps-label { color: rgba(0,0,0,0.35) !important; }
body.nm-mode #sub-my-progress .mp-session-detail { color: rgba(0,0,0,0.45) !important; }

/* Milestones */
body.nm-mode #sub-my-progress .mp-milestone {
  background: #f0f2f7 !important; border: none !important; border-radius: 16px !important;
  box-shadow: 6px 6px 14px rgba(0,0,0,0.11), -4px -4px 10px rgba(255,255,255,0.96) !important;
}
body.nm-mode #sub-my-progress .mp-milestone-name { color: #1a1a2e !important; }
body.nm-mode #sub-my-progress .mp-milestone-cond { color: rgba(0,0,0,0.45) !important; }
body.nm-mode #sub-my-progress .mp-milestone-icon { color: #c8a96e !important; }

/* Insight */
body.nm-mode #sub-my-progress .mp-insight-wrap {
  background: #f0f2f7 !important; border: none !important; border-radius: 16px !important;
  box-shadow: 6px 6px 14px rgba(0,0,0,0.11), -4px -4px 10px rgba(255,255,255,0.96) !important;
}
body.nm-mode #sub-my-progress .mp-insight-eyebrow { color: #c8a96e !important; }
body.nm-mode #sub-my-progress .mp-insight-text { color: rgba(0,0,0,0.7) !important; }

/* Feedback */
body.nm-mode #sub-my-progress .mp-feedback-question { color: #1a1a2e !important; }
body.nm-mode #sub-my-progress .mp-chip {
  background: #f0f2f7 !important; border: none !important; color: rgba(0,0,0,0.5) !important; border-radius: 20px !important;
  box-shadow: 3px 3px 7px rgba(0,0,0,0.11), -2px -2px 6px rgba(255,255,255,0.95) !important;
}
body.nm-mode #sub-my-progress .mp-chip.selected,
body.nm-mode #sub-my-progress .mp-chip.selected-gold { color: #c8a96e !important; box-shadow: inset 2px 2px 5px rgba(0,0,0,0.12), inset -2px -2px 5px rgba(255,255,255,0.95) !important; }
body.nm-mode #sub-my-progress .mp-feedback-textarea {
  background: #f0f2f7 !important; border: none !important; color: #1a1a2e !important; border-radius: 14px !important;
  box-shadow: inset 3px 3px 8px rgba(0,0,0,0.12), inset -2px -2px 6px rgba(255,255,255,0.95) !important;
}
body.nm-mode #sub-my-progress .mp-submit-btn {
  background: linear-gradient(135deg,#e8d5a3,#c4a35a) !important; border: none !important; color: #060c18 !important; border-radius: 14px !important;
}
body.nm-mode #sub-my-progress .mp-feedback-saved-title { color: #1a1a2e !important; }
body.nm-mode #sub-my-progress .mp-feedback-saved-sub { color: rgba(0,0,0,0.45) !important; }

/* Empty + loading */
body.nm-mode #sub-my-progress .mp-empty-title { color: rgba(0,0,0,0.5) !important; }
body.nm-mode #sub-my-progress .mp-empty-text { color: rgba(0,0,0,0.32) !important; }
body.nm-mode #sub-my-progress .mp-loading-text { color: rgba(0,0,0,0.4) !important; }

/* ═══════════════════════════════════════════════════════════════
   INNER PAGE 9 — WORD SCIENCE  (#sub-word-science)
   Neumorphism (light) · intro auto-skipped in nm-mode
═══════════════════════════════════════════════════════════════ */

/* Surface */
body.nm-mode #sub-word-science { background: #f0f2f7 !important; }
body.nm-mode #sub-word-science #wsMainContent .sub-screen-bg { display: none !important; }
body.nm-mode #sub-word-science #wsMainContent { background: #f0f2f7 !important; }
body.nm-mode #sub-word-science #wsPanelContainer { background: #f0f2f7 !important; }
body.nm-mode #sub-word-science * { text-shadow: none !important; }

/* Banner header */
body.nm-mode #sub-word-science .sub-header { background-image: none !important; background-color: #f0f2f7 !important; box-shadow: 0 5px 14px rgba(0,0,0,0.07) !important; }
body.nm-mode #sub-word-science .sub-header-title { color: #1a1a2e !important; }
body.nm-mode #sub-word-science .sub-header-tag { color: #c8a96e !important; }
body.nm-mode #sub-word-science .sub-back svg path { stroke: #1a1a2e !important; }

/* Tabs */
body.nm-mode #sub-word-science #wsTabs {
  background: #f0f2f7 !important; border-bottom: none !important;
  box-shadow: 0 5px 13px rgba(0,0,0,0.06) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
body.nm-mode #sub-word-science .ws-tab { color: rgba(0,0,0,0.4) !important; }
body.nm-mode #sub-word-science .ws-tab.ws-active { color: #c8a96e !important; border-bottom-color: #c8a96e !important; }

/* Info / quote / highlight / effect / organ cards → neumorphic raised */
body.nm-mode #sub-word-science .ws-info,
body.nm-mode #sub-word-science .ws-organ-card,
body.nm-mode #sub-word-science .ws-quote,
body.nm-mode #sub-word-science .ws-highlight,
body.nm-mode #sub-word-science .ws-effect-row,
body.nm-mode #sub-word-science .ws-action-tile {
  background: #f0f2f7 !important; border: none !important; border-radius: 18px !important;
  box-shadow: 6px 6px 15px rgba(0,0,0,0.11), -5px -5px 12px rgba(255,255,255,0.96) !important;
}
body.nm-mode #sub-word-science .ws-info::before,
body.nm-mode #sub-word-science .ws-organ-card::before { display: none !important; }
body.nm-mode #sub-word-science .ws-quote { border-left: 3px solid #c8a96e !important; }

body.nm-mode #sub-word-science .ws-info-eyebrow { color: #c8a96e !important; }
body.nm-mode #sub-word-science .ws-info-title { color: #1a1a2e !important; }
body.nm-mode #sub-word-science .ws-info-body { color: rgba(0,0,0,0.68) !important; }
body.nm-mode #sub-word-science .ws-organ-icon { color: #c8a96e !important; }
body.nm-mode #sub-word-science .ws-organ-name { color: #a8854a !important; }
body.nm-mode #sub-word-science .ws-organ-desc { color: rgba(0,0,0,0.62) !important; }
body.nm-mode #sub-word-science .ws-quote { color: rgba(0,0,0,0.8) !important; }
body.nm-mode #sub-word-science .ws-quote-src { color: #a8854a !important; }
body.nm-mode #sub-word-science .ws-highlight-num { color: #c8a96e !important; }
body.nm-mode #sub-word-science .ws-highlight-label { color: #a8854a !important; }
body.nm-mode #sub-word-science .ws-highlight-sub { color: rgba(0,0,0,0.6) !important; }
body.nm-mode #sub-word-science .ws-effect-label { color: #a8854a !important; }
body.nm-mode #sub-word-science .ws-effect-body { color: rgba(0,0,0,0.65) !important; }
body.nm-mode #sub-word-science .ws-effect-dot { background: #c8a96e !important; }

/* Phoneme chips */
body.nm-mode #sub-word-science .ws-phoneme {
  background: #f0f2f7 !important; border: none !important; color: #a8854a !important; border-radius: 12px !important;
  box-shadow: 3px 3px 8px rgba(0,0,0,0.12), -2px -2px 6px rgba(255,255,255,0.95) !important;
}
body.nm-mode #sub-word-science .ws-phoneme-label { color: rgba(0,0,0,0.4) !important; }

/* Action tiles */
body.nm-mode #sub-word-science .ws-action-tile-head { color: #a8854a !important; }
body.nm-mode #sub-word-science .ws-action-tile-title { color: #1a1a2e !important; }
body.nm-mode #sub-word-science .ws-action-tile-sub { color: rgba(0,0,0,0.5) !important; }

/* Atelier search page */
body.nm-mode #sub-word-science .ws-page-input { color: #1a1a2e !important; }
body.nm-mode #sub-word-science .ws-page-input::placeholder { color: rgba(0,0,0,0.3) !important; }
body.nm-mode #sub-word-science .ws-page-chip {
  background: #f0f2f7 !important; border: none !important; color: #a8854a !important;
  box-shadow: 3px 3px 7px rgba(0,0,0,0.11), -2px -2px 6px rgba(255,255,255,0.95) !important;
}
body.nm-mode #sub-word-science .ws-page-tagline { color: rgba(0,0,0,0.5) !important; }
body.nm-mode #sub-word-science .ws-page-brand { color: #1a1a2e !important; }

/* ═══════════════════════════════════════════════════════════════
   INNER PAGE 10 — PROFILE  (#sub-profile)
   Neumorphism (light) · intro already skipped via shouldShowIntro
═══════════════════════════════════════════════════════════════ */

/* Surface */
body.nm-mode #sub-profile #profileMainContent { background: #f0f2f7 !important; }
body.nm-mode #sub-profile .menu-banner { display: none !important; }
body.nm-mode #sub-profile * { text-shadow: none !important; }
body.nm-mode #sub-profile .sub-back svg path { stroke: #1a1a2e !important; }

/* Identity */
body.nm-mode #sub-profile .profile-avatar-ring-img {
  border: 3px solid #f0f2f7 !important;
  box-shadow: 6px 6px 16px rgba(0,0,0,0.16), -4px -4px 12px rgba(255,255,255,0.9) !important;
}
body.nm-mode #sub-profile .profile-name { color: #1a1a2e !important; }
body.nm-mode #sub-profile .profile-email { color: rgba(0,0,0,0.45) !important; }

/* Section labels */
body.nm-mode #sub-profile .sub-section-label { color: #c8a96e !important; }

/* Cards (progress / body map) → neumorphic */
body.nm-mode #sub-profile .sub-card {
  background: #f0f2f7 !important; border: none !important; border-radius: 18px !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
  box-shadow: 7px 7px 18px rgba(0,0,0,0.12), -5px -5px 14px rgba(255,255,255,0.97) !important;
}
body.nm-mode #sub-profile .sub-card::before { display: none !important; }
body.nm-mode #sub-profile .sub-card:active { background: #eceef4 !important; }
body.nm-mode #sub-profile .sub-card-title { color: #1a1a2e !important; }
body.nm-mode #sub-profile .sub-card-sub { color: rgba(0,0,0,0.55) !important; }

/* Preference / shop rows grouped into a neumorphic card look */
body.nm-mode #sub-profile .profile-row { border-bottom-color: rgba(0,0,0,0.08) !important; }
body.nm-mode #sub-profile .profile-row-label { color: #1a1a2e !important; }
body.nm-mode #sub-profile .profile-row-val { color: rgba(0,0,0,0.5) !important; }

/* Toggles → neumorphic groove */
body.nm-mode #sub-profile .stgl { box-shadow: inset 2px 2px 5px rgba(0,0,0,0.14), inset -2px -2px 5px rgba(255,255,255,0.92) !important; }

/* Stat numbers / generic gold accents inside profile */
body.nm-mode #sub-profile .pp-stat-num,
body.nm-mode #sub-profile .profile-stat-num { color: #c8a96e !important; }

/* Live-stats block: dark cells + grid gaps + var/white text → neumorphic light */
body.nm-mode #sub-profile [style*="background:#060c18"] {
  background: #f0f2f7 !important; border-radius: 14px !important;
  box-shadow: inset 2px 2px 6px rgba(0,0,0,0.1), inset -2px -2px 5px rgba(255,255,255,0.92) !important;
}
body.nm-mode #sub-profile #profileStatsBlock > div { background: transparent !important; border: none !important; gap: 10px !important; margin-bottom: 10px !important; }
body.nm-mode #sub-profile [style*="var(--text-secondary)"],
body.nm-mode #sub-profile [style*="var(--text-primary)"],
body.nm-mode #sub-profile [style*="255,255,255"] { color: rgba(0,0,0,0.55) !important; }
body.nm-mode #sub-profile [style*="var(--accent)"] { color: #5a8fa8 !important; }
body.nm-mode #sub-profile [style*="var(--accent-gold)"] { color: #c8a96e !important; }

/* ── Community profile: neumorphic circles (avatar + stats) + icon depth ── */

/* Avatar → raised neumorphic CIRCLE (cream), not the flat gold square */
body.nm-mode #sub-ig-profile .ig-prof-avatar-ring {
  background: #f0f2f7 !important;
  border-radius: 50% !important;
  padding: 6px !important;
  box-shadow: 7px 7px 16px rgba(0,0,0,0.16), -5px -5px 13px rgba(255,255,255,0.95) !important;
}
body.nm-mode #sub-ig-profile .ig-prof-avatar,
body.nm-mode #sub-ig-profile .ig-prof-avatar-ring img {
  border: none !important;
  border-radius: 50% !important;
}
body.nm-mode #sub-ig-profile .ig-prof-initials {
  background: #f0f2f7 !important;
  color: #c8a96e !important;
  border: none !important;
  border-radius: 50% !important;
  box-shadow: inset 3px 3px 7px rgba(0,0,0,0.12), inset -2px -2px 5px rgba(255,255,255,0.9) !important;
}

/* Stat numbers → neumorphic circles */
body.nm-mode #sub-ig-profile .ig-stats { gap: 6px !important; }
body.nm-mode #sub-ig-profile .ig-stat .n {
  width: 54px; height: 54px;
  border-radius: 50% !important;
  display: flex; align-items: center; justify-content: center;
  background: #f0f2f7 !important;
  color: #c8a96e !important;
  font-size: 17px !important;
  margin: 0 auto 7px !important;
  box-shadow: 6px 6px 13px rgba(0,0,0,0.13), -4px -4px 10px rgba(255,255,255,0.95) !important;
}

/* Topbar icon buttons (chat / menu) → neumorphic raised circles */
body.nm-mode #sub-ig-profile .ig-iconbtn {
  background: #f0f2f7 !important;
  border-radius: 50% !important;
  width: 40px !important; height: 40px !important;
  min-width: 40px !important; min-height: 40px !important;
  box-shadow: 4px 4px 10px rgba(0,0,0,0.13), -3px -3px 8px rgba(255,255,255,0.95) !important;
}
body.nm-mode #sub-ig-profile .ig-iconbtn svg { stroke: #1a1a2e !important; }
body.nm-mode #sub-ig-profile .ig-iconbtn img { filter: brightness(0) opacity(0.82) !important; }

/* Profile tab icons → neumorphic depth tiles */
body.nm-mode #sub-ig-profile .ig-tab {
  margin: 6px 4px !important;
}
body.nm-mode #sub-ig-profile .ig-tab svg,
body.nm-mode #sub-ig-profile .ig-tab .ig-tab-img {
  padding: 8px !important;
  border-radius: 14px !important;
  box-sizing: content-box !important;
  background: #f0f2f7 !important;
  box-shadow: 4px 4px 9px rgba(0,0,0,0.12), -3px -3px 7px rgba(255,255,255,0.95) !important;
}
body.nm-mode #sub-ig-profile .ig-tab.active svg,
body.nm-mode #sub-ig-profile .ig-tab.active .ig-tab-img {
  box-shadow: inset 3px 3px 7px rgba(0,0,0,0.13), inset -2px -2px 5px rgba(255,255,255,0.95) !important;
}

/* Reels tab icon is a filled raster (becomes a black blob with the dark filter)
   — shrink it and tint gold so it matches the line-icon tabs */
body.nm-mode #sub-ig-profile #ig-tab-reels .ig-tab-img {
  width: 20px !important; height: 20px !important; object-fit: contain !important;
  filter: brightness(0) saturate(100%) invert(72%) sepia(28%) saturate(560%) hue-rotate(2deg) brightness(92%) opacity(0.85) !important;
}

/* ── Follow buttons → neumorphism (white raised pill, gold text) ── */
body.nm-mode .ig-mini-follow,
body.nm-mode #sub-ig-profile .ig-btn.primary {
  background: #f0f2f7 !important;
  color: #c8a96e !important;
  border: none !important;
  box-shadow: 4px 4px 10px rgba(0,0,0,0.13), -3px -3px 8px rgba(255,255,255,0.95) !important;
}
body.nm-mode .ig-mini-follow.following,
body.nm-mode #sub-ig-profile .ig-btn.primary.following {
  color: rgba(0,0,0,0.5) !important;
  box-shadow: inset 3px 3px 7px rgba(0,0,0,0.13), inset -2px -2px 5px rgba(255,255,255,0.95) !important;
}
body.nm-mode .ig-mini-follow:active,
body.nm-mode #sub-ig-profile .ig-btn.primary:active {
  box-shadow: inset 3px 3px 7px rgba(0,0,0,0.13), inset -2px -2px 5px rgba(255,255,255,0.95) !important;
}

/* ── Social home (Stats): fix faint loading text + broken dashed slots ── */
body.nm-mode #sub-social-home #nwsb-home-reels-strip,
body.nm-mode #sub-social-home #nwsb-home-reels-strip div { color: rgba(0,0,0,0.4) !important; }

/* Image-explainer slots → neumorphic inset drop-zones (look intentional) */
body.nm-mode #sub-social-home .nwsb-explainer-slot {
  background: #f0f2f7 !important;
  border: none !important;
  box-shadow: inset 4px 4px 9px rgba(0,0,0,0.1), inset -3px -3px 7px rgba(255,255,255,0.9) !important;
}
body.nm-mode #sub-social-home .nwsb-explainer-slot span { color: #a8854a !important; }

/* Hero stat-cube text already cream-styled; keep its label readable */
body.nm-mode #sub-social-home .nwsb-section-hd { color: rgba(0,0,0,0.42) !important; }