/*
 * SleepBaby.org — Moonlit Editorial
 * Article and article-discovery visual layer.
 *
 * Scope rule: this file intentionally targets only the article/listing body
 * classes and their theme-owned descendants. It does not target the injected
 * sales footer or the normal site footer.
 */

body.sleepbaby-single-post,
body.sleepbaby-post-listing {
  --sbm-midnight: #14183f;
  --sbm-deep: #28245f;
  --sbm-blue: #6552ad;
  --sbm-violet: #755bc4;
  --sbm-magenta: #c45a9a;
  --sbm-aqua: #4bbbc3;
  --sbm-dream: #cfcaec;
  --sbm-moonlight: #eeecf9;
  --sbm-mist: #f7f6fc;
  --sbm-warm: #fefcff;
  --sbm-gold: #eab76d;
  --sbm-ink: #252541;
  --sbm-muted: #66677f;
  --sbm-line: #d8d4eb;
  --sbm-line-soft: rgba(76, 62, 139, .17);
  --sbm-serif: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Palatino, Georgia, serif;
  --sbm-sans: Aptos, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, Helvetica, sans-serif;
  --sbm-shell: 1260px;
  --sbm-reading: 730px;
  color: var(--sbm-ink);
}

body.sleepbaby-single-post :where(.sleepbaby-site-header, .sleepbaby-topic-nav, .sleepbaby-main),
body.sleepbaby-post-listing :where(.sleepbaby-site-header, .sleepbaby-topic-nav, .sleepbaby-main) {
  font-family: var(--sbm-sans);
}

body.sleepbaby-single-post :where(.sleepbaby-site-header, .sleepbaby-topic-nav, .sleepbaby-main) :where(a, button, input, textarea, select):focus-visible,
body.sleepbaby-post-listing :where(.sleepbaby-site-header, .sleepbaby-topic-nav, .sleepbaby-main) :where(a, button, input, textarea, select):focus-visible {
  outline: 3px solid rgba(226, 168, 74, .58);
  outline-offset: 3px;
}

body.sleepbaby-single-post .sleepbaby-shell,
body.sleepbaby-post-listing .sleepbaby-shell {
  width: min(calc(100% - 64px), var(--sbm-shell));
}

/* --------------------------------------------------------------------------
   Masthead + topic rail
   -------------------------------------------------------------------------- */

body.sleepbaby-single-post .sleepbaby-site-header,
body.sleepbaby-post-listing .sleepbaby-site-header {
  color: var(--sbm-midnight);
  background: rgba(254, 254, 255, .985);
  border-bottom: 1px solid rgba(76, 62, 139, .14);
  box-shadow: none;
}

body.sleepbaby-single-post .sleepbaby-masthead,
body.sleepbaby-post-listing .sleepbaby-masthead {
  min-height: 68px;
  gap: 20px;
}

body.sleepbaby-single-post .sleepbaby-header-logo,
body.sleepbaby-post-listing .sleepbaby-header-logo {
  width: 174px;
}

body.sleepbaby-single-post .sleepbaby-header-control,
body.sleepbaby-post-listing .sleepbaby-header-control {
  min-height: 38px;
  min-width: 38px;
  padding: 6px 8px;
  gap: 7px;
  color: var(--sbm-midnight);
  background: transparent;
  border: 1px solid transparent;
  border-radius: 9px;
  font-size: 14px !important;
  font-weight: 650;
  letter-spacing: .01em;
}

body.sleepbaby-single-post .sleepbaby-header-control:hover,
body.sleepbaby-single-post .sleepbaby-site-header.is-menu-open .sleepbaby-menu-toggle,
body.sleepbaby-single-post .sleepbaby-site-header.is-search-open .sleepbaby-search-toggle,
body.sleepbaby-post-listing .sleepbaby-header-control:hover,
body.sleepbaby-post-listing .sleepbaby-site-header.is-menu-open .sleepbaby-menu-toggle,
body.sleepbaby-post-listing .sleepbaby-site-header.is-search-open .sleepbaby-search-toggle {
  color: var(--sbm-midnight);
  background: rgba(117, 91, 196, .08);
  border-color: rgba(101, 82, 173, .16);
}

body.sleepbaby-single-post .sleepbaby-menu-icon i,
body.sleepbaby-post-listing .sleepbaby-menu-icon i {
  background: currentColor;
}

body.sleepbaby-single-post .sleepbaby-header-control svg,
body.sleepbaby-post-listing .sleepbaby-header-control svg {
  width: 17px;
  height: 17px;
  stroke: currentColor;
}

body.sleepbaby-single-post .sleepbaby-menu-icon,
body.sleepbaby-post-listing .sleepbaby-menu-icon {
  width: 18px;
}

body.sleepbaby-post-listing .sleepbaby-help-link {
  min-height: 38px;
  padding-left: 14px;
  font-size: 14px;
  font-weight: 680;
}

/* Keep the article masthead editorial rather than conversion-heavy. The same
   destination remains available inside the existing navigation panel. */
body.sleepbaby-single-post .sleepbaby-help-link {
  display: none;
}

body.sleepbaby-single-post .sleepbaby-primary-nav,
body.sleepbaby-post-listing .sleepbaby-primary-nav {
  color: var(--sbm-midnight);
  background: rgba(247, 246, 252, .99);
  border-top: 1px solid rgba(101, 82, 173, .12);
  border-bottom: 1px solid var(--sbm-line);
  box-shadow: 0 18px 45px rgba(38, 31, 84, .09);
}

body.sleepbaby-single-post .sleepbaby-nav-list a,
body.sleepbaby-post-listing .sleepbaby-nav-list a {
  color: var(--sbm-midnight);
  font-size: 13px;
  font-weight: 690;
}

body.sleepbaby-single-post .sleepbaby-nav-list a:hover,
body.sleepbaby-single-post .sleepbaby-nav-list .current-menu-item > a,
body.sleepbaby-post-listing .sleepbaby-nav-list a:hover,
body.sleepbaby-post-listing .sleepbaby-nav-list .current-menu-item > a {
  color: var(--sbm-blue);
  text-decoration-color: var(--sbm-gold);
}

body.sleepbaby-single-post .sleepbaby-nav-help,
body.sleepbaby-post-listing .sleepbaby-nav-help {
  color: var(--sbm-midnight);
  background: var(--sbm-gold);
  border-color: var(--sbm-gold);
  border-radius: 10px;
}

body.sleepbaby-single-post .sleepbaby-header-search,
body.sleepbaby-post-listing .sleepbaby-header-search {
  background: var(--sbm-mist);
  border-top: 1px solid var(--sbm-line);
  border-bottom: 1px solid var(--sbm-line);
  box-shadow: 0 18px 45px rgba(11, 31, 51, .08);
}

body.sleepbaby-single-post .sleepbaby-search-intro strong,
body.sleepbaby-post-listing .sleepbaby-search-intro strong {
  color: var(--sbm-midnight);
  font-family: var(--sbm-serif);
  font-size: 21px;
  font-weight: 650;
  letter-spacing: -.02em;
}

body.sleepbaby-single-post .sleepbaby-search-intro span,
body.sleepbaby-post-listing .sleepbaby-search-intro span {
  color: var(--sbm-muted);
}

body.sleepbaby-single-post .sleepbaby-search-form input[type="search"],
body.sleepbaby-post-listing .sleepbaby-search-form input[type="search"] {
  color: var(--sbm-ink);
  background: #fff;
  border: 1px solid var(--sbm-dream);
  border-radius: 10px;
  box-shadow: none;
}

body.sleepbaby-single-post .sleepbaby-search-form input[type="search"]::placeholder,
body.sleepbaby-post-listing .sleepbaby-search-form input[type="search"]::placeholder {
  color: #71808a;
}

body.sleepbaby-single-post .sleepbaby-search-form button,
body.sleepbaby-post-listing .sleepbaby-search-form button {
  color: #fff;
  background: var(--sbm-midnight);
  border-color: var(--sbm-midnight);
  border-radius: 10px;
}

body.sleepbaby-single-post .sleepbaby-topic-nav,
body.sleepbaby-post-listing .sleepbaby-topic-nav {
  color: var(--sbm-midnight);
  background: #fff;
  border-bottom: 1px solid var(--sbm-line);
}

body.sleepbaby-single-post .sleepbaby-topic-nav-inner,
body.sleepbaby-post-listing .sleepbaby-topic-nav-inner {
  min-height: 42px;
  gap: 28px;
}

body.sleepbaby-single-post .sleepbaby-topic-nav-label,
body.sleepbaby-post-listing .sleepbaby-topic-nav-label {
  color: var(--sbm-blue);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
}

body.sleepbaby-single-post .sleepbaby-topic-nav a,
body.sleepbaby-post-listing .sleepbaby-topic-nav a {
  color: var(--sbm-midnight);
  font-size: 11.5px;
  font-weight: 620;
}

body.sleepbaby-single-post .sleepbaby-topic-nav a:hover,
body.sleepbaby-post-listing .sleepbaby-topic-nav a:hover {
  color: var(--sbm-blue);
  text-decoration-color: var(--sbm-gold);
}

/* --------------------------------------------------------------------------
   Single article opening
   -------------------------------------------------------------------------- */

body.sleepbaby-single-post .sleepbaby-main {
  background: #fff;
}

body.sleepbaby-single-post .sleepbaby-article-header {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 54px 0 76px;
  background:
    radial-gradient(circle at 86% 16%, rgba(75, 187, 195, .09), transparent 25%),
    linear-gradient(135deg, #fefcff 0%, #f2effb 62%, #eeecf9 100%);
  border-bottom: 1px solid var(--sbm-moonlight);
}

body.sleepbaby-single-post .sleepbaby-article-header::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -130px;
  right: max(-88px, calc((100vw - var(--sbm-shell)) / 2 - 120px));
  width: 440px;
  height: 440px;
  opacity: .09;
  background: var(--sbm-violet);
  -webkit-mask: url("../images/moonlit/sleepbaby-window.svg") center / 76% 76% no-repeat;
  mask: url("../images/moonlit/sleepbaby-window.svg") center / 76% 76% no-repeat;
  pointer-events: none;
}

body.sleepbaby-single-post .sleepbaby-article-header::after {
  content: "";
  position: absolute;
  z-index: -2;
  top: -170px;
  right: -110px;
  width: 510px;
  height: 510px;
  border-radius: 50%;
  background: radial-gradient(circle at 34% 42%, rgba(196, 90, 154, .10), rgba(196, 90, 154, 0) 68%);
  pointer-events: none;
}

body.sleepbaby-single-post .sleepbaby-article-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.75fr) minmax(250px, 310px);
  align-items: end;
  gap: clamp(60px, 7vw, 96px);
}

body.sleepbaby-single-post .sleepbaby-article-title-block {
  max-width: 940px;
}

body.sleepbaby-single-post .sleepbaby-article-kicker {
  gap: 9px;
  margin-bottom: 18px;
  color: var(--sbm-blue);
  font-size: 10.5px;
  font-weight: 790;
  letter-spacing: .09em;
  line-height: 1.4;
}

body.sleepbaby-single-post .sleepbaby-article-kicker::before {
  content: "";
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  background: var(--sbm-gold);
  -webkit-mask: url("../images/moonlit/sleepbaby-crescent.svg") center / contain no-repeat;
  mask: url("../images/moonlit/sleepbaby-crescent.svg") center / contain no-repeat;
}

body.sleepbaby-single-post .sleepbaby-article-kicker a {
  color: var(--sbm-blue);
}

body.sleepbaby-single-post .sleepbaby-article-header h1 {
  max-width: 940px;
  margin: 0;
  color: var(--sbm-midnight);
  font-family: var(--sbm-serif);
  font-size: clamp(46px, 4.35vw, 64px);
  font-weight: 600;
  letter-spacing: -.038em;
  line-height: 1.005;
  overflow-wrap: break-word;
  text-wrap: balance;
}

body.sleepbaby-single-post .sleepbaby-article-deck {
  max-width: 820px;
  margin: 25px 0 0;
  color: #565970;
  font-size: clamp(17.5px, 1.35vw, 19px);
  line-height: 1.6;
}

body.sleepbaby-single-post .sleepbaby-article-meta {
  position: relative;
  display: grid;
  gap: 11px;
  align-self: end;
  padding: 5px 0 5px 27px;
  color: #63727d;
  border: 0;
  border-left: 1px solid var(--sbm-dream);
  font-size: 12px;
  line-height: 1.48;
}

body.sleepbaby-single-post .sleepbaby-article-meta::before {
  content: "";
  position: absolute;
  top: -16px;
  left: -7px;
  width: 13px;
  height: 13px;
  border: 2px solid var(--sbm-gold);
  border-radius: 50%;
  background: var(--sbm-warm);
}

body.sleepbaby-single-post .sleepbaby-article-meta > span {
  display: block;
}

body.sleepbaby-single-post .sleepbaby-article-meta a,
body.sleepbaby-single-post .sleepbaby-article-meta time {
  color: var(--sbm-midnight);
  font-weight: 700;
}

body.sleepbaby-single-post .sleepbaby-article-meta a {
  text-decoration-color: rgba(49, 90, 115, .45);
}

body.sleepbaby-single-post .sleepbaby-featured-wrap {
  position: relative;
  z-index: 2;
  width: min(calc(100% - 64px), 1040px);
  max-width: none;
  margin: -34px auto 0;
}

body.sleepbaby-single-post .sleepbaby-featured-wrap::before {
  content: "";
  position: absolute;
  z-index: 2;
  top: 26px;
  left: -1px;
  width: 5px;
  height: 72px;
  border-radius: 0 5px 5px 0;
  background: var(--sbm-gold);
  pointer-events: none;
}

body.sleepbaby-single-post .sleepbaby-featured-image {
  width: 100%;
  height: auto;
  max-height: 585px;
  display: block;
  object-fit: cover;
  object-position: center 42%;
  border: 1px solid rgba(49, 90, 115, .14);
  border-radius: 20px;
  box-shadow: 0 18px 45px rgba(36, 31, 86, .11);
}

body.sleepbaby-single-post .sleepbaby-featured-wrap figcaption {
  max-width: var(--sbm-reading);
  margin: 10px auto 0;
  color: #687681;
  font-size: 11.75px;
  line-height: 1.52;
  text-align: left;
}

/* --------------------------------------------------------------------------
   Long-form reading river
   -------------------------------------------------------------------------- */

body.sleepbaby-single-post .sleepbaby-reading-shell {
  width: min(calc(100% - 64px), var(--sbm-reading));
  margin-inline: auto;
  padding: 54px 0 66px;
}

body.sleepbaby-single-post .sleepbaby-article:not(.has-post-thumbnail) .sleepbaby-reading-shell {
  padding-top: 54px;
}

body.sleepbaby-single-post .sleepbaby-prose {
  color: var(--sbm-ink);
  font-family: var(--sbm-sans);
  font-size: 18px;
  line-height: 1.72;
  overflow-wrap: break-word;
}

body.sleepbaby-single-post .sleepbaby-prose :where(p, ul, ol) {
  margin-top: 0;
  margin-bottom: 24px;
}

body.sleepbaby-single-post .sleepbaby-prose :where(h2, h3, h4) {
  max-width: 730px;
  color: var(--sbm-midnight);
  font-family: var(--sbm-serif);
  font-weight: 600;
  letter-spacing: -.026em;
  text-wrap: balance;
  scroll-margin-top: 96px;
}

body.sleepbaby-single-post .sleepbaby-prose h2 {
  position: relative;
  margin: 60px 0 19px;
  font-size: clamp(32px, 2.7vw, 38px);
  line-height: 1.1;
}

body.sleepbaby-single-post .sleepbaby-prose h2::before {
  content: "";
  position: absolute;
  top: .22em;
  left: -34px;
  width: 18px;
  height: 18px;
  background: var(--sbm-gold);
  -webkit-mask: url("../images/moonlit/sleepbaby-crescent.svg") center / contain no-repeat;
  mask: url("../images/moonlit/sleepbaby-crescent.svg") center / contain no-repeat;
}

body.sleepbaby-single-post .sleepbaby-prose h3 {
  margin: 42px 0 13px;
  font-size: 26px;
  line-height: 1.13;
}

body.sleepbaby-single-post .sleepbaby-prose h4 {
  margin: 32px 0 11px;
  font-family: var(--sbm-sans);
  font-size: 20px;
  font-weight: 760;
  letter-spacing: -.012em;
  line-height: 1.25;
}

body.sleepbaby-single-post .sleepbaby-prose a {
  color: var(--sbm-blue);
  text-decoration-color: rgba(49, 90, 115, .48);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

body.sleepbaby-single-post .sleepbaby-prose a:hover {
  color: var(--sbm-midnight);
  text-decoration-color: var(--sbm-gold);
}

body.sleepbaby-single-post .sleepbaby-prose :where(ul, ol) {
  padding-left: 1.35em;
}

body.sleepbaby-single-post .sleepbaby-prose li {
  padding-left: .28em;
  margin-bottom: 8px;
}

body.sleepbaby-single-post .sleepbaby-prose li::marker {
  color: var(--sbm-blue);
  font-weight: 800;
}

body.sleepbaby-single-post .sleepbaby-prose blockquote {
  position: relative;
  margin: 38px -34px;
  padding: 27px 34px 29px 46px;
  color: #3c3b59;
  background: var(--sbm-mist);
  border: 1px solid #ddd8ee;
  border-left: 1px solid #ddd8ee;
  border-radius: 17px;
  font-family: var(--sbm-serif);
  font-size: 24px;
  line-height: 1.44;
}

body.sleepbaby-single-post .sleepbaby-prose blockquote::before {
  content: "";
  position: absolute;
  top: 25px;
  bottom: 25px;
  left: -1px;
  width: 5px;
  border-radius: 0 6px 6px 0;
  background: var(--sbm-magenta);
}

body.sleepbaby-single-post .sleepbaby-prose blockquote p:last-child {
  margin-bottom: 0;
}

body.sleepbaby-single-post .sleepbaby-prose .wp-block-pullquote {
  margin: 42px -42px;
  padding: 30px 42px;
  color: var(--sbm-midnight);
  background: var(--sbm-mist);
  border: 1px solid #ddd8ee;
  border-radius: 18px;
}

body.sleepbaby-single-post .sleepbaby-prose .wp-block-pullquote blockquote {
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  font-size: 26px;
  text-align: left;
}

body.sleepbaby-single-post .sleepbaby-prose .wp-block-pullquote blockquote::before {
  display: none;
}

body.sleepbaby-single-post .sleepbaby-prose figure {
  margin: 40px 0;
}

body.sleepbaby-single-post .sleepbaby-prose img {
  max-width: 100%;
  height: auto;
  display: block;
  border-radius: 16px;
}

body.sleepbaby-single-post .sleepbaby-prose figcaption {
  margin-top: 9px;
  color: #687681;
  font-size: 12px;
  line-height: 1.52;
  text-align: left;
}

body.sleepbaby-single-post .sleepbaby-prose > figure.alignwide,
body.sleepbaby-single-post .sleepbaby-prose > .alignwide {
  width: min(980px, calc(100vw - 64px));
  max-width: none;
  margin-left: 50%;
  transform: translateX(-50%);
}

body.sleepbaby-single-post .sleepbaby-prose > .alignfull {
  width: min(1120px, calc(100vw - 32px));
  max-width: none;
  margin-left: 50%;
  transform: translateX(-50%);
}

body.sleepbaby-single-post .sleepbaby-prose .wp-block-embed,
body.sleepbaby-single-post .sleepbaby-prose .wp-block-video {
  overflow: hidden;
  border-radius: 16px;
}

body.sleepbaby-single-post .sleepbaby-prose .wp-block-embed iframe,
body.sleepbaby-single-post .sleepbaby-prose .wp-block-video video {
  max-width: 100%;
}

/* Tables become quiet reference material instead of spreadsheet debris. */
body.sleepbaby-single-post .sleepbaby-prose .wp-block-table {
  max-width: 100%;
  margin: 32px 0;
  overflow-x: auto;
  border: 1px solid #d8d4eb;
  border-radius: 14px;
  -webkit-overflow-scrolling: touch;
}

body.sleepbaby-single-post .sleepbaby-prose table {
  width: 100%;
  margin: 32px 0;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  border: 1px solid #d8d4eb;
  border-radius: 14px;
  font-size: 14px;
  line-height: 1.5;
}

body.sleepbaby-single-post .sleepbaby-prose .wp-block-table table {
  min-width: 560px;
  margin: 0;
  border: 0;
  border-radius: 0;
}

body.sleepbaby-single-post .sleepbaby-prose :where(th, td) {
  padding: 13px 14px;
  border: 0;
  border-top: 1px solid #d4e1e7;
  border-right: 1px solid #e0eaef;
  text-align: left;
  vertical-align: top;
}

body.sleepbaby-single-post .sleepbaby-prose tr:first-child :where(th, td) {
  border-top: 0;
}

body.sleepbaby-single-post .sleepbaby-prose :where(th, td):last-child {
  border-right: 0;
}

body.sleepbaby-single-post .sleepbaby-prose th {
  color: #fff;
  background: var(--sbm-midnight);
  border-color: rgba(255,255,255,.12);
  font-weight: 740;
}

body.sleepbaby-single-post .sleepbaby-prose tbody tr:nth-child(even) td {
  background: #f8fbfc;
}

/* Existing background groups become a calm editorial callout without changing
   their text or semantics. Explicit utility classes can opt into a matching
   SleepBaby icon when editors already have meaningful context. */
body.sleepbaby-single-post .sleepbaby-prose :where(.wp-block-group.has-background, .sleepbaby-editorial-callout) {
  position: relative;
  margin: 36px 0;
  padding: 25px 27px;
  color: var(--sbm-ink);
  background: var(--sbm-mist) !important;
  border: 1px solid #dad6ec;
  border-radius: 16px;
}

body.sleepbaby-single-post .sleepbaby-prose :where(.wp-block-group.has-background, .sleepbaby-editorial-callout) > :first-child {
  margin-top: 0;
}

body.sleepbaby-single-post .sleepbaby-prose :where(.wp-block-group.has-background, .sleepbaby-editorial-callout) > :last-child {
  margin-bottom: 0;
}

body.sleepbaby-single-post .sleepbaby-prose .sleepbaby-editorial-callout--safety,
body.sleepbaby-single-post .sleepbaby-prose .sleepbaby-editorial-callout--timing,
body.sleepbaby-single-post .sleepbaby-prose .sleepbaby-editorial-callout--sound,
body.sleepbaby-single-post .sleepbaby-prose .sleepbaby-editorial-callout--environment {
  padding-left: 76px;
}

body.sleepbaby-single-post .sleepbaby-prose :where(.sleepbaby-editorial-callout--safety, .sleepbaby-editorial-callout--timing, .sleepbaby-editorial-callout--sound, .sleepbaby-editorial-callout--environment)::before {
  content: "";
  position: absolute;
  top: 24px;
  left: 25px;
  width: 34px;
  height: 34px;
  background: var(--sbm-blue);
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

body.sleepbaby-single-post .sleepbaby-prose .sleepbaby-editorial-callout--safety::before {
  -webkit-mask-image: url("../images/moonlit/sleepbaby-safety-crib.svg");
  mask-image: url("../images/moonlit/sleepbaby-safety-crib.svg");
}

body.sleepbaby-single-post .sleepbaby-prose .sleepbaby-editorial-callout--timing::before {
  -webkit-mask-image: url("../images/moonlit/sleepbaby-clock.svg");
  mask-image: url("../images/moonlit/sleepbaby-clock.svg");
}

body.sleepbaby-single-post .sleepbaby-prose .sleepbaby-editorial-callout--sound::before {
  -webkit-mask-image: url("../images/moonlit/sleepbaby-soundwave.svg");
  mask-image: url("../images/moonlit/sleepbaby-soundwave.svg");
}

body.sleepbaby-single-post .sleepbaby-prose .sleepbaby-editorial-callout--environment::before {
  -webkit-mask-image: url("../images/moonlit/sleepbaby-nightlight.svg");
  mask-image: url("../images/moonlit/sleepbaby-nightlight.svg");
}

/* --------------------------------------------------------------------------
   Table of contents
   -------------------------------------------------------------------------- */

body.sleepbaby-single-post .sleepbaby-prose.sleepbaby-article-content :is(.wp-block-table-of-contents, .wp-block-table-of-contents-block, .ez-toc-container, .lwptoc, nav[class*="toc"]) {
  position: relative;
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr);
  gap: 26px;
  width: 100%;
  margin: 0 0 50px;
  padding: 22px 0 24px;
  color: var(--sbm-ink);
  background: transparent;
  border: 0;
  border-top: 1px solid #b9ccd7;
  border-bottom: 1px solid #b9ccd7;
  border-radius: 0;
  box-shadow: none;
}

body.sleepbaby-single-post .sleepbaby-prose.sleepbaby-article-content :is(.wp-block-table-of-contents, .wp-block-table-of-contents-block, .ez-toc-container, .lwptoc, nav[class*="toc"]) > :where(strong, h2, h3, .ez-toc-title-container):first-child {
  position: relative;
  margin: 0;
  padding: 0 0 0 28px;
  color: var(--sbm-blue);
  font-family: var(--sbm-sans);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: .12em;
  line-height: 1.45;
  text-transform: uppercase;
}

body.sleepbaby-single-post .sleepbaby-prose.sleepbaby-article-content :is(.wp-block-table-of-contents, .wp-block-table-of-contents-block, .ez-toc-container, .lwptoc, nav[class*="toc"]) > :where(strong, h2, h3, .ez-toc-title-container):first-child::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 19px;
  height: 19px;
  background: var(--sbm-gold);
  -webkit-mask: url("../images/moonlit/sleepbaby-lamp.svg") center / contain no-repeat;
  mask: url("../images/moonlit/sleepbaby-lamp.svg") center / contain no-repeat;
}

body.sleepbaby-single-post .sleepbaby-prose.sleepbaby-article-content :is(.wp-block-table-of-contents, .wp-block-table-of-contents-block, .ez-toc-container, .lwptoc, nav[class*="toc"]) h2::before,
body.sleepbaby-single-post .sleepbaby-prose.sleepbaby-article-content :is(.wp-block-table-of-contents, .wp-block-table-of-contents-block, .ez-toc-container, .lwptoc, nav[class*="toc"]) h3::before {
  display: none;
}

body.sleepbaby-single-post .sleepbaby-prose.sleepbaby-article-content :is(.wp-block-table-of-contents, .wp-block-table-of-contents-block, .ez-toc-container, .lwptoc, nav[class*="toc"]) :where(ol, ul) {
  columns: 2;
  column-gap: 36px;
  margin: 0;
  padding-left: 18px;
  font-size: 13.5px;
  line-height: 1.55;
}

body.sleepbaby-single-post .sleepbaby-prose.sleepbaby-article-content :is(.wp-block-table-of-contents, .wp-block-table-of-contents-block, .ez-toc-container, .lwptoc, nav[class*="toc"]) li {
  margin: 0 0 8px;
  padding-left: 4px;
  break-inside: avoid;
}

body.sleepbaby-single-post .sleepbaby-prose.sleepbaby-article-content :is(.wp-block-table-of-contents, .wp-block-table-of-contents-block, .ez-toc-container, .lwptoc, nav[class*="toc"]) li > a {
  color: var(--sbm-midnight);
  text-decoration: none;
}

body.sleepbaby-single-post .sleepbaby-prose.sleepbaby-article-content :is(.wp-block-table-of-contents, .wp-block-table-of-contents-block, .ez-toc-container, .lwptoc, nav[class*="toc"]) li > a:hover {
  color: var(--sbm-blue);
  text-decoration: underline;
  text-decoration-color: var(--sbm-gold);
  text-underline-offset: 3px;
}

/* --------------------------------------------------------------------------
   Sources / references — visual energy deliberately decreases here.
   -------------------------------------------------------------------------- */

body.sleepbaby-single-post .sleepbaby-sources {
  position: relative;
  width: min(880px, calc(100vw - 64px));
  max-width: none;
  margin: 58px 0 8px 50%;
  padding: 29px 34px 30px;
  transform: translateX(-50%);
  color: var(--sbm-ink);
  background: var(--sbm-mist);
  border: 1px solid #d9d5eb;
  border-radius: 16px;
  box-shadow: none;
}

body.sleepbaby-single-post .sleepbaby-prose.sleepbaby-article-content .sleepbaby-sources > :is(h2, h3, h4) {
  position: relative;
  margin: 0 0 15px;
  padding-left: 38px;
  color: var(--sbm-midnight);
  font-family: var(--sbm-serif);
  font-size: 29px;
  font-weight: 600;
  letter-spacing: -.025em;
  line-height: 1.05;
  text-transform: none;
}

body.sleepbaby-single-post .sleepbaby-prose.sleepbaby-article-content .sleepbaby-sources > :is(h2, h3, h4)::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 27px;
  height: 27px;
  background: var(--sbm-blue);
  -webkit-mask: url("../images/moonlit/sleepbaby-book.svg") center / contain no-repeat;
  mask: url("../images/moonlit/sleepbaby-book.svg") center / contain no-repeat;
}

body.sleepbaby-single-post .sleepbaby-prose.sleepbaby-article-content .sleepbaby-sources :where(ol, ul) {
  columns: 2;
  column-gap: 42px;
  margin: 0;
  padding-left: 21px;
  color: #586b78;
  font-size: 13px;
  line-height: 1.52;
}

body.sleepbaby-single-post .sleepbaby-prose.sleepbaby-article-content .sleepbaby-sources li {
  margin-bottom: 8px;
  break-inside: avoid;
  overflow-wrap: anywhere;
}

body.sleepbaby-single-post .sleepbaby-prose.sleepbaby-article-content .sleepbaby-sources a {
  color: var(--sbm-blue);
}

body.sleepbaby-single-post .sleepbaby-entry-footer {
  height: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

/* --------------------------------------------------------------------------
   Archive / search / Parent Library discovery
   -------------------------------------------------------------------------- */

body.sleepbaby-post-listing .sleepbaby-main {
  color: var(--sbm-ink);
  background: #fff;
}

body.sleepbaby-post-listing .sleepbaby-archive-header {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 66px 0 58px;
  background: var(--sbm-mist);
  border-bottom: 1px solid #d2e0e7;
}

body.sleepbaby-post-listing .sleepbaby-archive-header::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: -78px;
  right: max(24px, calc((100vw - var(--sbm-shell)) / 2));
  width: 210px;
  height: 210px;
  opacity: .075;
  background: var(--sbm-blue);
  -webkit-mask: url("../images/moonlit/sleepbaby-nightlight.svg") center / contain no-repeat;
  mask: url("../images/moonlit/sleepbaby-nightlight.svg") center / contain no-repeat;
  pointer-events: none;
}

body.sleepbaby-post-listing .sleepbaby-archive-header-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr);
  gap: clamp(52px, 7vw, 90px);
  align-items: end;
}

body.sleepbaby-post-listing .sleepbaby-eyebrow {
  margin: 0 0 12px;
  color: var(--sbm-blue);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

body.sleepbaby-post-listing .sleepbaby-archive-header h1 {
  margin: 0;
  color: var(--sbm-midnight);
  font-family: var(--sbm-serif);
  font-size: clamp(48px, 5vw, 64px);
  font-weight: 600;
  letter-spacing: -.032em;
  line-height: .99;
  text-wrap: balance;
}

body.sleepbaby-post-listing .sleepbaby-archive-description {
  max-width: 680px;
  margin-top: 16px;
  color: #546874;
  font-size: 17px;
  line-height: 1.58;
}

body.sleepbaby-post-listing .sleepbaby-archive-search {
  padding: 0;
  border: 0;
}

body.sleepbaby-post-listing .sleepbaby-archive-search > span {
  display: block;
  margin-bottom: 9px;
  color: var(--sbm-blue);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}

body.sleepbaby-post-listing .sleepbaby-archive-search .sleepbaby-search-form {
  padding: 7px;
  background: rgba(255,255,255,.7);
  border: 1px solid var(--sbm-dream);
  border-radius: 13px;
}

body.sleepbaby-post-listing .sleepbaby-archive-search .sleepbaby-search-form input[type="search"] {
  border: 0;
}

body.sleepbaby-post-listing .sleepbaby-posts-section {
  padding: 54px 0 82px;
  background: #fff;
}

body.sleepbaby-post-listing .sleepbaby-post-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 52px;
}

body.sleepbaby-post-listing .sleepbaby-post-card,
body.sleepbaby-post-listing .sleepbaby-post-card:first-child,
body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(2),
body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(3),
body.sleepbaby-post-listing .sleepbaby-post-card.has-post-thumbnail,
body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(2).has-post-thumbnail,
body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(3).has-post-thumbnail {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  grid-column: auto !important;
  grid-row: auto !important;
  align-items: center;
  gap: 25px;
  min-height: 220px;
  margin: 0;
  padding: 30px 0;
  background: transparent;
  border: 0;
  border-top: 1px solid #c9d8e0;
  border-radius: 0;
  box-shadow: none;
}

body.sleepbaby-post-listing .sleepbaby-card-media {
  position: relative;
  min-width: 0;
  width: 100%;
  height: 100%;
  min-height: 158px;
  display: block;
  overflow: hidden;
  background: linear-gradient(145deg, var(--sbm-deep), var(--sbm-blue));
  border-radius: 18px;
}

body.sleepbaby-post-listing .sleepbaby-card-media img {
  width: 100%;
  height: 100%;
  min-height: 158px;
  display: block;
  object-fit: cover;
  aspect-ratio: auto !important;
  transform: none;
  transition: transform .24s ease;
}

body.sleepbaby-post-listing .sleepbaby-post-card:hover .sleepbaby-card-media img {
  transform: scale(1.025);
}

body.sleepbaby-post-listing .sleepbaby-card-media--placeholder::before {
  content: "";
  position: absolute;
  top: 22px;
  right: 22px;
  width: 58px;
  height: 58px;
  background: var(--sbm-moonlight);
  -webkit-mask: url("../images/moonlit/sleepbaby-crescent.svg") center / contain no-repeat;
  mask: url("../images/moonlit/sleepbaby-crescent.svg") center / contain no-repeat;
  opacity: .9;
}

body.sleepbaby-post-listing .sleepbaby-card-media--placeholder::after {
  content: "";
  position: absolute;
  right: 18px;
  bottom: 22px;
  left: 18px;
  height: 68px;
  background: var(--sbm-dream);
  -webkit-mask: url("../images/moonlit/sleepbaby-crib-rail.svg") center / 100% 100% no-repeat;
  mask: url("../images/moonlit/sleepbaby-crib-rail.svg") center / 100% 100% no-repeat;
  opacity: .88;
}

body.sleepbaby-post-listing .sleepbaby-card-body,
body.sleepbaby-post-listing .sleepbaby-post-card:first-child .sleepbaby-card-body,
body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(2).has-post-thumbnail .sleepbaby-card-body,
body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(3).has-post-thumbnail .sleepbaby-card-body {
  min-width: 0;
  padding: 0;
  align-self: center;
}

body.sleepbaby-post-listing .sleepbaby-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 9px;
  margin: 0 0 8px;
  color: var(--sbm-blue);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .09em;
  line-height: 1.4;
  text-transform: uppercase;
}

body.sleepbaby-post-listing .sleepbaby-card-meta a {
  color: var(--sbm-blue);
}

body.sleepbaby-post-listing .sleepbaby-card-time::before {
  content: "·";
  margin-right: 9px;
  color: var(--sbm-gold);
}

body.sleepbaby-post-listing .sleepbaby-post-card h2,
body.sleepbaby-post-listing .sleepbaby-post-card:first-child h2,
body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(2) h2,
body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(3) h2 {
  margin: 0 0 10px;
  color: var(--sbm-midnight);
  font-family: var(--sbm-serif);
  font-size: 27px;
  font-weight: 600;
  letter-spacing: -.025em;
  line-height: 1.08;
  text-wrap: balance;
}

body.sleepbaby-post-listing .sleepbaby-post-card h2 a {
  color: inherit;
  text-decoration: none;
}

body.sleepbaby-post-listing .sleepbaby-post-card h2 a:hover {
  color: var(--sbm-blue);
}

body.sleepbaby-post-listing .sleepbaby-post-card p,
body.sleepbaby-post-listing .sleepbaby-post-card:first-child p {
  margin: 0 0 15px;
  color: #5d6f79;
  font-size: 14px;
  line-height: 1.55;
}

body.sleepbaby-post-listing .sleepbaby-card-link {
  color: var(--sbm-midnight);
  font-size: 12px;
  font-weight: 800;
  text-decoration: underline;
  text-decoration-color: var(--sbm-gold);
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}

body.sleepbaby-post-listing .sleepbaby-pagination {
  margin-top: 48px;
}

body.sleepbaby-post-listing .sleepbaby-pagination .nav-links {
  gap: 8px;
}

body.sleepbaby-post-listing .sleepbaby-pagination .page-numbers {
  min-width: 44px;
  min-height: 44px;
  color: var(--sbm-midnight);
  background: #fff;
  border: 1px solid var(--sbm-line);
  border-radius: 10px;
}

body.sleepbaby-post-listing .sleepbaby-pagination .current,
body.sleepbaby-post-listing .sleepbaby-pagination a:hover {
  color: #fff;
  background: var(--sbm-midnight);
  border-color: var(--sbm-midnight);
}

/* Parent Library home inherits the palette and typography without replacing its
   existing layout or copy. This keeps the redesign inside article discovery. */
body.sleepbaby-post-listing .sleepbaby-library-hero {
  color: var(--sbm-ink);
  background: var(--sbm-warm);
  border-bottom-color: var(--sbm-line);
}

body.sleepbaby-post-listing .sleepbaby-library-hero h1,
body.sleepbaby-post-listing .sleepbaby-section-heading h2,
body.sleepbaby-post-listing .sleepbaby-topic-directory h2 {
  color: var(--sbm-midnight);
  font-family: var(--sbm-serif);
  font-weight: 600;
}

body.sleepbaby-post-listing .sleepbaby-library-intro,
body.sleepbaby-post-listing .sleepbaby-library-feature p {
  color: var(--sbm-muted);
}

body.sleepbaby-post-listing .sleepbaby-topic-directory {
  background: #fff;
}

body.sleepbaby-post-listing .sleepbaby-topic-directory-list a {
  border-color: var(--sbm-line);
}

body.sleepbaby-post-listing .sleepbaby-topic-directory-list a::before {
  color: var(--sbm-gold);
}

/* --------------------------------------------------------------------------
   Explicit editorial media roles + the Moonpath article handoff
   -------------------------------------------------------------------------- */

body.sleepbaby-single-post .sleepbaby-prose :where(.sleepbaby-media--photo, .sleepbaby-media--diagram, .sleepbaby-media--illustration, .sleepbaby-media--portrait) {
  margin-inline: auto;
}

body.sleepbaby-single-post .sleepbaby-prose :where(.sleepbaby-media--photo, .sleepbaby-media--photo img) {
  width: min(100%, 730px);
}

body.sleepbaby-single-post .sleepbaby-prose :where(.sleepbaby-media--diagram, .sleepbaby-media--diagram img) {
  width: min(100%, 700px);
  max-height: 620px;
  object-fit: contain;
}

body.sleepbaby-single-post .sleepbaby-prose :where(.sleepbaby-media--illustration, .sleepbaby-media--illustration img, .is-style-sleepbaby-illustration, .is-style-sleepbaby-illustration img) {
  width: min(100%, 540px);
  max-height: 520px;
  object-fit: contain;
}

body.sleepbaby-single-post .sleepbaby-prose :where(.sleepbaby-media--portrait, .sleepbaby-media--portrait img) {
  width: min(100%, 410px);
  max-height: 560px;
  object-fit: contain;
}

body.sleepbaby-single-post .sleepbaby-prose :where(.sleepbaby-media--icon, .sleepbaby-media--icon img, .sleepbaby-editorial-icon) {
  width: 44px !important;
  height: 44px !important;
  max-width: 44px !important;
  max-height: 44px !important;
  object-fit: contain;
}

body.sleepbaby-single-post .sleepbaby-prose :where(img[src$=".svg"], img[src*=".svg?"]):not(.sleepbaby-media--icon) {
  width: auto;
  max-width: min(100%, 540px);
  max-height: 520px;
  margin-inline: auto;
  object-fit: contain;
}

body.sleepbaby-single-post .sleepbaby-prose :where(.sleepbaby-tonight, .sleepbaby-night-note, .sleepbaby-safety-note) {
  position: relative;
  margin: 36px 0;
  padding: 23px 25px 23px 66px;
  color: var(--sbm-ink);
  background: linear-gradient(135deg, #f5f3fc, #eeecf9);
  border: 1px solid rgba(101, 82, 173, .20);
  border-radius: 17px;
}

body.sleepbaby-single-post .sleepbaby-prose :where(.sleepbaby-tonight, .sleepbaby-night-note, .sleepbaby-safety-note)::before {
  content: "";
  position: absolute;
  top: 23px;
  left: 23px;
  width: 25px;
  height: 25px;
  background: var(--sbm-violet);
  -webkit-mask: url("../images/moonlit/sleepbaby-nightlight.svg") center / contain no-repeat;
  mask: url("../images/moonlit/sleepbaby-nightlight.svg") center / contain no-repeat;
}

body.sleepbaby-single-post .sleepbaby-prose .sleepbaby-safety-note {
  background: linear-gradient(135deg, #f2f7fb, #eeecf9);
  border-color: rgba(75, 187, 195, .28);
}

body.sleepbaby-single-post .sleepbaby-prose .sleepbaby-safety-note::before {
  background: var(--sbm-aqua);
  -webkit-mask-image: url("../images/moonlit/sleepbaby-safety-crib.svg");
  mask-image: url("../images/moonlit/sleepbaby-safety-crib.svg");
}

body.sleepbaby-single-post .sleepbaby-prose :where(.sleepbaby-tonight, .sleepbaby-night-note, .sleepbaby-safety-note) > :first-child {
  margin-top: 0;
}

body.sleepbaby-single-post .sleepbaby-prose :where(.sleepbaby-tonight, .sleepbaby-night-note, .sleepbaby-safety-note) > :last-child {
  margin-bottom: 0;
}

body.sleepbaby-single-post .sleepbaby-nightfall-transition {
  position: relative;
  height: 112px;
  overflow: hidden;
  background: linear-gradient(180deg, #fff 0%, #f0eef9 52%, #17183f 100%);
}

body.sleepbaby-single-post .sleepbaby-nightfall-transition__path {
  position: absolute;
  left: 50%;
  top: 36px;
  width: min(520px, 72vw);
  height: 52px;
  border-top: 1px solid rgba(101, 82, 173, .40);
  border-radius: 50%;
  transform: translateX(-50%) rotate(-3deg);
}

body.sleepbaby-single-post .sleepbaby-nightfall-transition__star {
  position: absolute;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--sbm-aqua);
  box-shadow: 0 0 0 4px rgba(75, 187, 195, .10);
}

body.sleepbaby-single-post .sleepbaby-nightfall-transition__star--one {
  left: calc(50% - 168px);
  top: 36px;
}

body.sleepbaby-single-post .sleepbaby-nightfall-transition__star--two {
  left: calc(50% + 105px);
  top: 54px;
  background: var(--sbm-magenta);
  box-shadow: 0 0 0 4px rgba(196, 90, 154, .09);
}

body.sleepbaby-single-post .sleepbaby-nightfall-transition__moon {
  position: absolute;
  left: 50%;
  top: 22px;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  background: #fff9df;
  transform: translateX(-50%);
  box-shadow: 0 0 22px rgba(234, 183, 109, .28);
}

body.sleepbaby-single-post .sleepbaby-nightfall-transition__moon::after {
  content: "";
  position: absolute;
  left: 9px;
  top: -3px;
  width: 25px;
  height: 25px;
  border-radius: inherit;
  background: #f0eef9;
}

/* --------------------------------------------------------------------------
   Responsive composition
   -------------------------------------------------------------------------- */

@media (max-width: 1120px) {
  body.sleepbaby-single-post .sleepbaby-article-heading {
    grid-template-columns: minmax(0, 1.55fr) minmax(230px, .55fr);
    gap: 52px;
  }

  body.sleepbaby-post-listing .sleepbaby-post-grid {
    gap-inline: 36px;
  }

  body.sleepbaby-post-listing .sleepbaby-post-card,
  body.sleepbaby-post-listing .sleepbaby-post-card:first-child,
  body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(2),
  body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(3),
  body.sleepbaby-post-listing .sleepbaby-post-card.has-post-thumbnail,
  body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(2).has-post-thumbnail,
  body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(3).has-post-thumbnail {
    grid-template-columns: 160px minmax(0, 1fr);
    gap: 21px;
  }
}

@media (max-width: 900px) {
  body.sleepbaby-single-post .sleepbaby-shell,
  body.sleepbaby-post-listing .sleepbaby-shell {
    width: min(calc(100% - 44px), var(--sbm-shell));
  }

  body.sleepbaby-single-post .sleepbaby-masthead,
  body.sleepbaby-post-listing .sleepbaby-masthead {
    min-height: 66px;
  }

  body.sleepbaby-single-post .sleepbaby-header-logo,
  body.sleepbaby-post-listing .sleepbaby-header-logo {
    width: min(165px, 42vw);
  }

  body.sleepbaby-single-post .sleepbaby-header-control,
  body.sleepbaby-post-listing .sleepbaby-header-control {
    min-width: 44px;
    min-height: 44px;
  }

  body.sleepbaby-single-post .sleepbaby-topic-nav-inner,
  body.sleepbaby-post-listing .sleepbaby-topic-nav-inner {
    width: 100%;
    padding-left: 22px;
  }

  body.sleepbaby-single-post .sleepbaby-topic-nav-label,
  body.sleepbaby-post-listing .sleepbaby-topic-nav-label {
    background: #fff;
  }

  body.sleepbaby-single-post .sleepbaby-article-header {
    padding: 48px 0 62px;
  }

  body.sleepbaby-single-post .sleepbaby-article-heading {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  body.sleepbaby-single-post .sleepbaby-article-header h1 {
    max-width: 820px;
    font-size: clamp(42px, 6.4vw, 54px);
  }

  body.sleepbaby-single-post .sleepbaby-article-meta {
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px 24px;
    padding: 17px 0 0;
    border-left: 0;
    border-top: 1px solid var(--sbm-dream);
  }

  body.sleepbaby-single-post .sleepbaby-article-meta::before {
    top: -7px;
    left: 0;
  }

  body.sleepbaby-single-post .sleepbaby-featured-wrap {
    width: calc(100% - 32px);
    margin-top: -34px;
  }

  body.sleepbaby-single-post .sleepbaby-prose blockquote {
    margin-inline: -20px;
  }

  body.sleepbaby-single-post .sleepbaby-prose .wp-block-pullquote {
    margin-inline: -20px;
  }

  body.sleepbaby-post-listing .sleepbaby-archive-header {
    padding: 52px 0 48px;
  }

  body.sleepbaby-post-listing .sleepbaby-archive-header-grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  body.sleepbaby-post-listing .sleepbaby-archive-search {
    max-width: 640px;
  }

  body.sleepbaby-post-listing .sleepbaby-post-grid {
    grid-template-columns: 1fr;
    gap: 0;
  }

  body.sleepbaby-post-listing .sleepbaby-post-card,
  body.sleepbaby-post-listing .sleepbaby-post-card:first-child,
  body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(2),
  body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(3),
  body.sleepbaby-post-listing .sleepbaby-post-card.has-post-thumbnail,
  body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(2).has-post-thumbnail,
  body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(3).has-post-thumbnail {
    grid-template-columns: 180px minmax(0, 1fr);
    gap: 24px;
  }
}

@media (max-width: 640px) {
  body.sleepbaby-single-post .sleepbaby-shell,
  body.sleepbaby-post-listing .sleepbaby-shell {
    width: calc(100% - 36px);
  }

  body.sleepbaby-single-post .sleepbaby-masthead,
  body.sleepbaby-post-listing .sleepbaby-masthead {
    min-height: 64px;
    grid-template-columns: 44px minmax(0, 1fr) 44px;
    gap: 6px;
  }

  body.sleepbaby-single-post .sleepbaby-header-logo,
  body.sleepbaby-post-listing .sleepbaby-header-logo {
    width: min(148px, 43vw);
  }

  body.sleepbaby-single-post .sleepbaby-header-control,
  body.sleepbaby-post-listing .sleepbaby-header-control {
    min-width: 44px;
    min-height: 44px;
    padding: 7px;
  }

  body.sleepbaby-single-post .sleepbaby-header-control > span:last-child,
  body.sleepbaby-post-listing .sleepbaby-header-control > span:last-child {
    display: none;
  }

  body.sleepbaby-post-listing .sleepbaby-help-link {
    display: none;
  }

  body.sleepbaby-single-post .sleepbaby-topic-nav-inner,
  body.sleepbaby-post-listing .sleepbaby-topic-nav-inner {
    padding-left: 18px;
  }

  body.sleepbaby-single-post .sleepbaby-article-header {
    padding: 38px 0 52px;
  }

  body.sleepbaby-single-post .sleepbaby-article-header::before {
    top: -80px;
    right: -90px;
    width: 270px;
    height: 270px;
    opacity: .07;
  }

  body.sleepbaby-single-post .sleepbaby-article-heading {
    width: calc(100% - 36px);
    gap: 25px;
  }

  body.sleepbaby-single-post .sleepbaby-article-kicker {
    margin-bottom: 13px;
    font-size: 9.5px;
  }

  body.sleepbaby-single-post .sleepbaby-article-kicker::before {
    flex-basis: 16px;
    width: 16px;
    height: 16px;
  }

  body.sleepbaby-single-post .sleepbaby-article-header h1 {
    font-size: clamp(34px, 9.4vw, 42px);
    line-height: 1.045;
    letter-spacing: -.031em;
  }

  body.sleepbaby-single-post .sleepbaby-article-deck {
    margin-top: 18px;
    font-size: 16.5px;
    line-height: 1.55;
  }

  body.sleepbaby-single-post .sleepbaby-article-meta {
    gap: 10px 18px;
    padding-top: 15px;
    font-size: 11.5px;
  }

  body.sleepbaby-single-post .sleepbaby-featured-wrap {
    width: calc(100% - 24px);
    margin-top: -28px;
  }

  body.sleepbaby-single-post .sleepbaby-featured-wrap::before {
    top: 18px;
    height: 52px;
    width: 4px;
  }

  body.sleepbaby-single-post .sleepbaby-featured-image {
    max-height: min(360px, 58vh);
    object-fit: contain;
    background: var(--sbm-moonlight);
    border-radius: 16px;
    box-shadow: 0 12px 30px rgba(36, 31, 86, .10);
  }

  body.sleepbaby-single-post .sleepbaby-featured-wrap figcaption {
    width: calc(100% - 12px);
    font-size: 11px;
  }

  body.sleepbaby-single-post .sleepbaby-reading-shell {
    width: calc(100% - 36px);
    padding: 43px 0 58px;
  }

  body.sleepbaby-single-post .sleepbaby-prose {
    font-size: 17px;
    line-height: 1.70;
  }

  body.sleepbaby-single-post .sleepbaby-prose :where(p, ul, ol) {
    margin-bottom: 20px;
  }

  body.sleepbaby-single-post .sleepbaby-prose h2 {
    margin: 48px 0 17px;
    padding-left: 24px;
    font-size: clamp(29px, 8.6vw, 34px);
    line-height: 1.08;
  }

  body.sleepbaby-single-post .sleepbaby-prose h2::before {
    top: .18em;
    left: 0;
    width: 15px;
    height: 15px;
  }

  body.sleepbaby-single-post .sleepbaby-prose h3 {
    margin-top: 35px;
    font-size: 24px;
  }

  body.sleepbaby-single-post .sleepbaby-prose h4 {
    margin-top: 29px;
    font-size: 19px;
  }

  body.sleepbaby-single-post .sleepbaby-prose blockquote {
    margin: 30px -8px;
    padding: 23px 20px 24px 28px;
    border-radius: 13px;
    font-size: 20px;
    line-height: 1.48;
  }

  body.sleepbaby-single-post .sleepbaby-prose blockquote::before {
    top: 20px;
    bottom: 20px;
    width: 4px;
  }

  body.sleepbaby-single-post .sleepbaby-prose .wp-block-pullquote {
    margin: 31px -8px;
    padding: 23px 22px;
  }

  body.sleepbaby-single-post .sleepbaby-prose .wp-block-pullquote blockquote {
    font-size: 21px;
  }

  body.sleepbaby-single-post .sleepbaby-prose > figure.alignwide,
  body.sleepbaby-single-post .sleepbaby-prose > .alignwide,
  body.sleepbaby-single-post .sleepbaby-prose > .alignfull {
    width: calc(100vw - 36px);
  }

  body.sleepbaby-single-post .sleepbaby-prose :where(.sleepbaby-tonight, .sleepbaby-night-note, .sleepbaby-safety-note) {
    padding: 20px 18px 20px 54px;
    border-radius: 14px;
  }

  body.sleepbaby-single-post .sleepbaby-prose :where(.sleepbaby-tonight, .sleepbaby-night-note, .sleepbaby-safety-note)::before {
    top: 20px;
    left: 17px;
    width: 23px;
    height: 23px;
  }

  body.sleepbaby-single-post .sleepbaby-nightfall-transition {
    height: 88px;
  }

  body.sleepbaby-single-post .sleepbaby-nightfall-transition__path {
    top: 29px;
    width: 76vw;
  }

  body.sleepbaby-single-post .sleepbaby-nightfall-transition__moon {
    top: 18px;
  }

  body.sleepbaby-single-post .sleepbaby-prose .wp-block-table {
    width: calc(100vw - 36px);
    border-radius: 12px;
  }

  body.sleepbaby-single-post .sleepbaby-prose table {
    font-size: 12.5px;
  }

  body.sleepbaby-single-post .sleepbaby-prose :where(th, td) {
    padding: 10px 9px;
  }

  body.sleepbaby-single-post .sleepbaby-prose :where(.wp-block-group.has-background, .sleepbaby-editorial-callout) {
    margin: 31px 0;
    padding: 21px 20px;
    border-radius: 13px;
  }

  body.sleepbaby-single-post .sleepbaby-prose .sleepbaby-editorial-callout--safety,
  body.sleepbaby-single-post .sleepbaby-prose .sleepbaby-editorial-callout--timing,
  body.sleepbaby-single-post .sleepbaby-prose .sleepbaby-editorial-callout--sound,
  body.sleepbaby-single-post .sleepbaby-prose .sleepbaby-editorial-callout--environment {
    padding-left: 60px;
  }

  body.sleepbaby-single-post .sleepbaby-prose :where(.sleepbaby-editorial-callout--safety, .sleepbaby-editorial-callout--timing, .sleepbaby-editorial-callout--sound, .sleepbaby-editorial-callout--environment)::before {
    top: 21px;
    left: 18px;
    width: 29px;
    height: 29px;
  }

  body.sleepbaby-single-post .sleepbaby-prose.sleepbaby-article-content :is(.wp-block-table-of-contents, .wp-block-table-of-contents-block, .ez-toc-container, .lwptoc, nav[class*="toc"]) {
    grid-template-columns: 1fr;
    gap: 11px;
    margin-bottom: 40px;
    padding: 17px 0 18px;
  }

  body.sleepbaby-single-post .sleepbaby-prose.sleepbaby-article-content :is(.wp-block-table-of-contents, .wp-block-table-of-contents-block, .ez-toc-container, .lwptoc, nav[class*="toc"]) :where(ol, ul) {
    columns: 1;
    font-size: 12.75px;
  }

  body.sleepbaby-single-post .sleepbaby-sources {
    width: calc(100vw - 24px);
    margin-top: 46px;
    padding: 22px 20px 23px;
    border-radius: 13px;
  }

  body.sleepbaby-single-post .sleepbaby-prose.sleepbaby-article-content .sleepbaby-sources > :is(h2, h3, h4) {
    min-height: 25px;
    padding-left: 34px;
    font-size: 24px;
  }

  body.sleepbaby-single-post .sleepbaby-prose.sleepbaby-article-content .sleepbaby-sources > :is(h2, h3, h4)::before {
    width: 24px;
    height: 24px;
  }

  body.sleepbaby-single-post .sleepbaby-prose.sleepbaby-article-content .sleepbaby-sources :where(ol, ul) {
    columns: 1;
    font-size: 12px;
    line-height: 1.5;
  }

  body.sleepbaby-post-listing .sleepbaby-archive-header {
    padding: 44px 0 42px;
  }

  body.sleepbaby-post-listing .sleepbaby-archive-header h1 {
    font-size: clamp(42px, 12vw, 50px);
  }

  body.sleepbaby-post-listing .sleepbaby-archive-description {
    margin-top: 14px;
    font-size: 15.5px;
  }

  body.sleepbaby-post-listing .sleepbaby-posts-section {
    padding: 28px 0 62px;
  }

  body.sleepbaby-post-listing .sleepbaby-post-card,
  body.sleepbaby-post-listing .sleepbaby-post-card:first-child,
  body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(2),
  body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(3),
  body.sleepbaby-post-listing .sleepbaby-post-card.has-post-thumbnail,
  body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(2).has-post-thumbnail,
  body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(3).has-post-thumbnail {
    grid-template-columns: 112px minmax(0, 1fr);
    gap: 17px;
    min-height: 160px;
    padding: 22px 0;
  }

  body.sleepbaby-post-listing .sleepbaby-card-media,
  body.sleepbaby-post-listing .sleepbaby-card-media img {
    min-height: 116px;
  }

  body.sleepbaby-post-listing .sleepbaby-card-media {
    border-radius: 14px;
  }

  body.sleepbaby-post-listing .sleepbaby-card-media--placeholder::before {
    top: 15px;
    right: 14px;
    width: 38px;
    height: 38px;
  }

  body.sleepbaby-post-listing .sleepbaby-card-media--placeholder::after {
    right: 10px;
    bottom: 13px;
    left: 10px;
    height: 47px;
  }

  body.sleepbaby-post-listing .sleepbaby-card-meta {
    margin-bottom: 6px;
    font-size: 9px;
  }

  body.sleepbaby-post-listing .sleepbaby-post-card h2,
  body.sleepbaby-post-listing .sleepbaby-post-card:first-child h2,
  body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(2) h2,
  body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(3) h2 {
    margin-bottom: 8px;
    font-size: 23px;
  }

  body.sleepbaby-post-listing .sleepbaby-post-card p,
  body.sleepbaby-post-listing .sleepbaby-post-card:first-child p {
    display: none;
  }
}

@media (max-width: 380px) {
  body.sleepbaby-single-post .sleepbaby-header-logo,
  body.sleepbaby-post-listing .sleepbaby-header-logo {
    width: min(140px, 42vw);
  }

  body.sleepbaby-single-post .sleepbaby-article-meta {
    grid-template-columns: 1fr 1fr;
    gap-inline: 12px;
    font-size: 11px;
  }

  body.sleepbaby-post-listing .sleepbaby-post-card,
  body.sleepbaby-post-listing .sleepbaby-post-card:first-child,
  body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(2),
  body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(3),
  body.sleepbaby-post-listing .sleepbaby-post-card.has-post-thumbnail,
  body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(2).has-post-thumbnail,
  body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(3).has-post-thumbnail {
    grid-template-columns: 102px minmax(0, 1fr);
    gap: 14px;
  }

  body.sleepbaby-post-listing .sleepbaby-post-card h2,
  body.sleepbaby-post-listing .sleepbaby-post-card:first-child h2,
  body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(2) h2,
  body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(3) h2 {
    font-size: 21px;
  }
}

@media (max-width: 340px) {
  body.sleepbaby-single-post .sleepbaby-shell,
  body.sleepbaby-single-post .sleepbaby-reading-shell,
  body.sleepbaby-single-post .sleepbaby-article-heading,
  body.sleepbaby-post-listing .sleepbaby-shell {
    width: calc(100% - 28px);
  }

  body.sleepbaby-single-post .sleepbaby-masthead,
  body.sleepbaby-post-listing .sleepbaby-masthead {
    width: calc(100% - 16px);
  }

  body.sleepbaby-single-post .sleepbaby-article-header h1 {
    font-size: 34px;
  }

  body.sleepbaby-single-post .sleepbaby-article-meta {
    grid-template-columns: 1fr;
  }

  body.sleepbaby-post-listing .sleepbaby-post-card,
  body.sleepbaby-post-listing .sleepbaby-post-card:first-child,
  body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(2),
  body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(3),
  body.sleepbaby-post-listing .sleepbaby-post-card.has-post-thumbnail,
  body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(2).has-post-thumbnail,
  body.sleepbaby-post-listing .sleepbaby-post-card:nth-child(3).has-post-thumbnail {
    grid-template-columns: 94px minmax(0, 1fr);
    gap: 13px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.sleepbaby-single-post .sleepbaby-site-header *,
  body.sleepbaby-single-post .sleepbaby-main *,
  body.sleepbaby-post-listing .sleepbaby-site-header *,
  body.sleepbaby-post-listing .sleepbaby-main * {
    scroll-behavior: auto !important;
    transition-duration: .001ms !important;
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
  }
}

@media print {
  body.sleepbaby-single-post .sleepbaby-site-header,
  body.sleepbaby-single-post .sleepbaby-topic-nav {
    display: none !important;
  }

  body.sleepbaby-single-post .sleepbaby-article-header {
    padding: 20px 0;
    background: #fff;
  }

  body.sleepbaby-single-post .sleepbaby-article-header::before,
  body.sleepbaby-single-post .sleepbaby-article-header::after,
  body.sleepbaby-single-post .sleepbaby-featured-wrap::before,
  body.sleepbaby-single-post .sleepbaby-prose h2::before {
    display: none !important;
  }

  body.sleepbaby-single-post .sleepbaby-reading-shell,
  body.sleepbaby-single-post .sleepbaby-featured-wrap {
    width: 100%;
  }
}

/* --------------------------------------------------------------------------
   Moonpath article-pack components
   Existing semantic article modules share one quiet editorial vocabulary.
   -------------------------------------------------------------------------- */
@media screen {
  body.sleepbaby-single-post .sleepbaby-prose figure[data-sleepbaby-token-resolved="figure"] {
    width: min(100%, 700px);
    margin-inline: auto;
  }

  body.sleepbaby-single-post .sleepbaby-prose figure[data-sleepbaby-token-resolved="divider"] {
    width: min(100%, 680px);
    margin: 31px auto;
  }

  body.sleepbaby-single-post .sleepbaby-prose figure[data-sleepbaby-token-resolved="divider"] img {
    width: 100%;
    max-height: 138px;
    object-fit: contain;
    border-radius: 0;
  }

  body.sleepbaby-single-post .sleepbaby-prose figure[data-sleepbaby-token-resolved="divider"] figcaption {
    max-width: 560px;
    margin-inline: auto;
    text-align: center;
  }

  body.sleepbaby-single-post .sleepbaby-prose > .sbds-article > section[data-sb-component],
  body.sleepbaby-single-post .sleepbaby-prose > section[data-sb-component] {
    margin: 48px 0;
    scroll-margin-top: 24px;
  }

  body.sleepbaby-single-post .sleepbaby-prose :where(
    [data-sb-component="answer-wheel"],
    [data-sb-component="whole-wheel-check"],
    [data-sb-component="field-notes"],
    [data-sb-component="join-broaden-park"]
  ) {
    position: relative;
    padding: 31px 32px 32px;
    background: linear-gradient(135deg, rgba(247, 246, 252, .98), rgba(238, 236, 249, .92));
    border: 1px solid rgba(101, 82, 173, .18);
    border-radius: 20px;
    box-shadow: 0 14px 36px rgba(38, 31, 84, .055);
  }

  body.sleepbaby-single-post .sleepbaby-prose :where(
    [data-sb-component="answer-wheel"],
    [data-sb-component="whole-wheel-check"],
    [data-sb-component="field-notes"],
    [data-sb-component="join-broaden-park"]
  )::before {
    content: "";
    position: absolute;
    top: -10px;
    right: 25px;
    width: 42px;
    height: 42px;
    background: var(--sbm-magenta);
    opacity: .76;
    -webkit-mask: url("../images/moonlit/sleepbaby-crescent.svg") center / contain no-repeat;
    mask: url("../images/moonlit/sleepbaby-crescent.svg") center / contain no-repeat;
  }

  body.sleepbaby-single-post .sleepbaby-prose :where(
    [data-sb-component="answer-wheel"],
    [data-sb-component="whole-wheel-check"],
    [data-sb-component="field-notes"],
    [data-sb-component="join-broaden-park"]
  ) > :where(h2, h3):first-child {
    max-width: 640px;
    margin-top: 0;
    padding-right: 34px;
  }

  body.sleepbaby-single-post .sleepbaby-prose [data-sb-component="answer-wheel"] > ul {
    margin: 24px 0 22px;
    padding: 0;
    list-style: none;
    border-top: 1px solid rgba(101, 82, 173, .17);
  }

  body.sleepbaby-single-post .sleepbaby-prose [data-sb-component="answer-wheel"] > ul > li {
    position: relative;
    margin: 0;
    padding: 15px 0 15px 30px;
    border-bottom: 1px solid rgba(101, 82, 173, .14);
  }

  body.sleepbaby-single-post .sleepbaby-prose [data-sb-component="answer-wheel"] > ul > li::before {
    content: "";
    position: absolute;
    top: 22px;
    left: 4px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--sbm-aqua);
    box-shadow: 0 0 0 5px rgba(75, 187, 195, .10);
  }

  body.sleepbaby-single-post .sleepbaby-prose :where(
    [data-sb-component="curiosity-workshop"],
    [data-sb-component="join-broaden-park"],
    [data-sb-component="field-notes"]
  ) > ol {
    counter-reset: sbm-step;
    margin: 27px 0 24px;
    padding: 0 0 0 44px;
    list-style: none;
    border-left: 1px solid rgba(101, 82, 173, .24);
  }

  body.sleepbaby-single-post .sleepbaby-prose :where(
    [data-sb-component="curiosity-workshop"],
    [data-sb-component="join-broaden-park"],
    [data-sb-component="field-notes"]
  ) > ol > li {
    counter-increment: sbm-step;
    position: relative;
    margin: 0;
    padding: 0 0 25px 20px;
  }

  body.sleepbaby-single-post .sleepbaby-prose :where(
    [data-sb-component="curiosity-workshop"],
    [data-sb-component="join-broaden-park"],
    [data-sb-component="field-notes"]
  ) > ol > li:last-child {
    padding-bottom: 0;
  }

  body.sleepbaby-single-post .sleepbaby-prose :where(
    [data-sb-component="curiosity-workshop"],
    [data-sb-component="join-broaden-park"],
    [data-sb-component="field-notes"]
  ) > ol > li::before {
    content: counter(sbm-step, decimal-leading-zero);
    position: absolute;
    top: 0;
    left: -62px;
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    color: #fff;
    background: var(--sbm-violet);
    border: 5px solid var(--sbm-warm);
    border-radius: 50%;
    font-family: var(--sbm-sans);
    font-size: 9px;
    font-weight: 780;
    letter-spacing: .06em;
  }

  body.sleepbaby-single-post .sleepbaby-prose :where(
    [data-sb-component="curiosity-workshop"],
    [data-sb-component="join-broaden-park"],
    [data-sb-component="field-notes"]
  ) > ol > li > h3 {
    margin: 0 0 7px;
    color: var(--sbm-violet);
    font-family: var(--sbm-sans);
    font-size: 18px;
    font-weight: 760;
  }

  body.sleepbaby-single-post .sleepbaby-prose [data-sb-component="whole-wheel-check"] > dl {
    display: grid;
    grid-template-columns: minmax(130px, .34fr) minmax(0, 1fr);
    margin: 24px 0;
    border-top: 1px solid rgba(101, 82, 173, .17);
  }

  body.sleepbaby-single-post .sleepbaby-prose [data-sb-component="whole-wheel-check"] > dl > :where(dt, dd) {
    margin: 0;
    padding: 15px 0;
    border-bottom: 1px solid rgba(101, 82, 173, .14);
  }

  body.sleepbaby-single-post .sleepbaby-prose [data-sb-component="whole-wheel-check"] > dl > dt {
    padding-right: 20px;
    color: var(--sbm-violet);
  }

  body.sleepbaby-single-post .sleepbaby-prose :where(
    [data-sb-component="play-by-age"] > ul,
    [data-sb-component="wheel-safety-cards"]
  ) {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin: 25px 0 0;
    padding: 0;
    list-style: none;
  }

  body.sleepbaby-single-post .sleepbaby-prose [data-sb-component="wheel-safety-cards"] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.sleepbaby-single-post .sleepbaby-prose :where(
    [data-sb-component="play-by-age"] > ul,
    [data-sb-component="wheel-safety-cards"]
  ) > li {
    margin: 0;
    padding: 21px 20px 20px;
    background: rgba(247, 246, 252, .72);
    border: 1px solid rgba(101, 82, 173, .15);
    border-radius: 15px;
  }

  body.sleepbaby-single-post .sleepbaby-prose :where(
    [data-sb-component="play-by-age"] > ul,
    [data-sb-component="wheel-safety-cards"]
  ) > li > :where(h3, h4):first-child {
    margin: 0 0 13px;
    color: var(--sbm-violet);
    font-family: var(--sbm-sans);
    font-size: 17px;
    font-weight: 760;
    line-height: 1.25;
  }

  body.sleepbaby-single-post .sleepbaby-prose [data-sb-component="safe-wheel-bay"] {
    margin-inline: -18px;
    padding: 28px 18px 22px;
    background: linear-gradient(180deg, rgba(20, 24, 63, .985), rgba(40, 36, 95, .985));
    border-radius: 20px;
  }

  body.sleepbaby-single-post .sleepbaby-prose [data-sb-component="safe-wheel-bay"] > h2 {
    margin-top: 0;
    color: #fff;
  }

  body.sleepbaby-single-post .sleepbaby-prose [data-sb-component="safe-wheel-bay"] > h2::before {
    background: var(--sbm-gold);
  }

  body.sleepbaby-single-post .sleepbaby-prose [data-sb-component="safe-wheel-bay"] [data-sb-component="wheel-safety-cards"] > li {
    color: #dedcec;
    background: rgba(255, 255, 255, .055);
    border-color: rgba(238, 236, 249, .17);
  }

  body.sleepbaby-single-post .sleepbaby-prose [data-sb-component="safe-wheel-bay"] [data-sb-component="wheel-safety-cards"] a {
    color: #fff;
  }

  body.sleepbaby-single-post .sleepbaby-prose [data-sb-component="cta"] {
    position: relative;
    margin: 52px 0 46px;
    padding: 30px 32px;
    overflow: hidden;
    color: #deddec;
    background: radial-gradient(circle at 92% 10%, rgba(75, 187, 195, .18), transparent 25%), linear-gradient(128deg, var(--sbm-midnight), var(--sbm-deep));
    border-radius: 20px;
  }

  body.sleepbaby-single-post .sleepbaby-prose [data-sb-component="cta"] > h2 {
    max-width: 650px;
    margin-top: 0;
    color: #fff;
  }

  body.sleepbaby-single-post .sleepbaby-prose [data-sb-component="cta"] > h2::before {
    background: var(--sbm-aqua);
  }

  body.sleepbaby-single-post .sleepbaby-prose [data-sb-component="cta"] > p:last-child,
  body.sleepbaby-single-post .sleepbaby-prose [data-sb-component="cta"] > p:last-child small {
    margin-bottom: 0;
    color: #c8c6de;
  }

  body.sleepbaby-single-post .sleepbaby-prose [data-sb-component="cta"] a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 9px 16px;
    color: #171534;
    background: var(--sbm-gold);
    border-radius: 10px;
    font-family: var(--sbm-sans);
    font-size: 14px;
    font-weight: 780;
    text-decoration: none;
  }
}

@media screen and (max-width: 640px) {
  body.sleepbaby-single-post .sleepbaby-prose figure[data-sleepbaby-token-resolved="divider"] {
    margin-block: 24px;
  }

  body.sleepbaby-single-post .sleepbaby-prose figure[data-sleepbaby-token-resolved="divider"] img {
    max-height: 92px;
  }

  body.sleepbaby-single-post .sleepbaby-prose > .sbds-article > section[data-sb-component],
  body.sleepbaby-single-post .sleepbaby-prose > section[data-sb-component] {
    margin: 38px 0;
  }

  body.sleepbaby-single-post .sleepbaby-prose :where(
    [data-sb-component="answer-wheel"],
    [data-sb-component="whole-wheel-check"],
    [data-sb-component="field-notes"],
    [data-sb-component="join-broaden-park"]
  ) {
    padding: 25px 20px 26px;
    border-radius: 16px;
  }

  body.sleepbaby-single-post .sleepbaby-prose :where(
    [data-sb-component="answer-wheel"],
    [data-sb-component="whole-wheel-check"],
    [data-sb-component="field-notes"],
    [data-sb-component="join-broaden-park"]
  )::before {
    right: 17px;
    width: 34px;
    height: 34px;
  }

  body.sleepbaby-single-post .sleepbaby-prose [data-sb-component="whole-wheel-check"] > dl {
    grid-template-columns: 1fr;
  }

  body.sleepbaby-single-post .sleepbaby-prose [data-sb-component="whole-wheel-check"] > dl > dt {
    padding-bottom: 3px;
    border-bottom: 0;
  }

  body.sleepbaby-single-post .sleepbaby-prose [data-sb-component="whole-wheel-check"] > dl > dd {
    padding-top: 3px;
  }

  body.sleepbaby-single-post .sleepbaby-prose :where(
    [data-sb-component="play-by-age"] > ul,
    [data-sb-component="wheel-safety-cards"]
  ) {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  body.sleepbaby-single-post .sleepbaby-prose [data-sb-component="safe-wheel-bay"] {
    margin-inline: -8px;
    padding: 24px 14px 18px;
    border-radius: 16px;
  }

  body.sleepbaby-single-post .sleepbaby-prose [data-sb-component="cta"] {
    margin: 42px -2px 38px;
    padding: 25px 20px;
    border-radius: 16px;
  }
}
