/* Marketing, editorial, legal and guest membership pages share the public paper stock. */
html[data-landing-design="childhood"][data-public-page]:not([data-public-page="landing"]) {
  --paper-base: #F8F1DF;
  --paper-aged: #FFF9EA;
  --paper-warm: #F2E8CE;
  --paper-shadow: #D8CEB6;
  --ink-dark: #34392F;
  --ink-primary: #34392F;
  --ink-soft: #485244;
  --ink-light: #4F5749;
  --leather-brown: #2E5272;
  --sepia-line: #9B967F;
  --danger: #9D342C;
  --font-sans: "Landing childhood hand", "Trebuchet MS", sans-serif;
  --font-serif: "Landing childhood hand", Georgia, serif;
  --button-focus: #315F87;
}
html[data-landing-design] .landing-logo-text { display: inline-flex; align-items: center; min-height: 44px; }
html[data-landing-design] .landing-nav-link { display: inline-flex; align-items: center; min-height: 44px; }
html[data-landing-design="childhood"] :is(.blog-card, .relevant-post-card, .engineering-card, .engineering-related__card, .feature-hub-card, .features-page__closing, .experience-plan, .experience-return-card, .experience-photo) {
  background: var(--landing-paper-texture), var(--landing-surface);
  background-size: var(--landing-paper-sizes);
  border: 1px solid var(--landing-border);
  border-image: url("/assets/childhood/ink-frame-979fd19b.svg") 12 / 9px / 1px stretch;
  border-radius: 3px;
  box-shadow: var(--landing-paper-shadow);
}
html[data-landing-design="childhood"] :is(.editorial-post, .engineering-article, .landing-content, .membership-picker, .experience-app, .membership-feedback-dialog) {
  position: relative;
  background: var(--landing-paper-texture), var(--landing-surface);
  background-size: var(--landing-paper-sizes);
  border: 1px solid transparent;
  border-image: url("/assets/childhood/paper-edge-3e4f4e8a.svg") 6 / 6px / 2px stretch;
  border-radius: 3px;
  box-shadow: var(--landing-paper-shadow);
}
html[data-landing-design="childhood"] :is(.editorial-post, .engineering-article, .membership-picker)::before {
  content: "";
  position: absolute;
  top: -12px;
  left: calc(50% - 42px);
  width: 84px;
  height: 25px;
  background: repeating-linear-gradient(90deg, transparent 0 9px, rgb(255 255 255 / 24%) 9px 10px), #E8CA8DD9;
  clip-path: polygon(1% 4%, 98% 0, 100% 25%, 98% 48%, 100% 73%, 97% 100%, 1% 96%, 3% 70%, 0 45%);
  transform: rotate(-5deg);
  pointer-events: none;
}
html[data-landing-design="childhood"] :is(.blog-share-button, .blog-pagination__link, .blog-post-explore-btn, .engineering-secondary-action, .experience-button, .membership-start .btn, .membership-feedback-dialog .btn, .membership-feedback-invitation button, .membership-option, .blog-search-form .search-input) {
  color: var(--landing-ink);
  background-color: var(--landing-surface);
  background-image: var(--landing-fine-texture);
  background-size: var(--landing-fine-sizes);
  border: 1px solid var(--landing-border);
  border-image: url("/assets/childhood/ink-frame-979fd19b.svg") 12 / 9px / 1px stretch;
  border-radius: 3px;
  box-shadow: 0 1px 1px rgb(51 46 35 / 15%);
  font-family: var(--font-body);
  font-weight: 400;
}
html[data-landing-design="childhood"] :is(.experience-button:not(.experience-button--outline), .membership-start .btn-primary, .membership-feedback-dialog .btn-primary, .blog-share-button--primary) { color: var(--landing-ink); background-color: #F3DE88; }
html[data-landing-design="childhood"] :is(.blog-share-button, .blog-pagination__link, .experience-button, .membership-start .btn, .membership-feedback-dialog .btn):hover { color: var(--landing-ink); background-color: #E8CA8D; transform: none; }
html[data-landing-design="childhood"] :is(.blog-share-button, .experience-button, .membership-start .btn):active { box-shadow: inset 0 1px 2px rgb(51 46 35 / 18%); }
html[data-landing-design="childhood"] :is(.blog-share-button, .experience-button, .membership-start .btn):disabled { opacity: .6; box-shadow: none; }
html[data-landing-design="childhood"] body.landing-page :is(a, button, input, textarea, summary, [tabindex="0"]):focus-visible { outline: 2px solid #315F87; outline-offset: 3px; }
html[data-landing-design="childhood"] :is(.blog-header-back, .engineering-header-label, .experience-header-label) { color: var(--landing-secondary); font-weight: 400; }
html[data-landing-design="childhood"] .landing-nav-link { text-transform: none; letter-spacing: 0; }

/* Archive slips and long-form paper. Keep photos and authored emphasis intact. */
html[data-landing-design="childhood"] .blog-search-form .search-input { font-size: 20px; min-height: 48px; }
html[data-landing-design="childhood"] .blog-search-form .search-input::placeholder { color: var(--landing-secondary); opacity: 1; }
html[data-landing-design="childhood"] .blog-search-form .search-icon { opacity: 1; }
html[data-landing-design="childhood"] :is(.blog-card-category, .relevant-post-date) { color: #2E5272; font-size: 16px; text-transform: none; letter-spacing: 0; }
html[data-landing-design="childhood"] .blog-card-meta .text-neutral-400 { color: var(--landing-secondary); font-size: 14px; }
html[data-landing-design="childhood"] .blog-index-hero .text-neutral-500 { color: var(--landing-secondary); }
html[data-landing-design="childhood"] .blog-empty-state p { color: var(--landing-secondary); }
html[data-landing-design="childhood"] .editorial-post { max-width: 850px; padding: clamp(24px, 4vw, 56px); }
html[data-landing-design="childhood"] .editorial-post p,
html[data-landing-design="childhood"] .editorial-content li { font-size: 20px; line-height: 1.6; letter-spacing: 0; }
html[data-landing-design="childhood"] :is(.blog-post-title-large, .blog-archive-title) { color: #2E5272; }
html[data-landing-design="childhood"] .blog-post-title-large { font-size: clamp(36px, 5vw, 62px); }
html[data-landing-design="childhood"] .blog-post-header { margin-bottom: 32px; padding-bottom: 32px; }
html[data-landing-design="childhood"] :is(.blog-post-hero-image-wrap, .editorial-image-container) { margin-inline: 0; border-radius: 3px; box-shadow: 0 2px 5px rgb(51 46 35 / 16%); }
html[data-landing-design="childhood"] .blog-post-cta-section { background: var(--landing-fine-texture), #DCE8ED; background-size: var(--landing-fine-sizes); border-image: url("/assets/childhood/ink-frame-979fd19b.svg") 12 / 9px / 1px stretch; overflow: visible; box-shadow: none; }
html[data-landing-design="childhood"] .blog-post-cta-section::before { display: none; }
html[data-landing-design="childhood"] .blog-post-cta-section h2 { max-width: 22ch; font-weight: 400; letter-spacing: 0; }

html[data-landing-design="childhood"] .relevant-post-card { padding: 16px; }
html[data-landing-design="childhood"] .relevant-post-image-wrap { margin-bottom: 16px; }
html[data-landing-design="childhood"] .relevant-posts-title { text-transform: none; letter-spacing: 0; }
html[data-landing-design="childhood"] :is(.blog-post-meta-top, .blog-post-cta-eyebrow, .blog-share-row__label, .engineering-eyebrow, .engineering-card__topline, .engineering-card__meta, .engineering-article__meta) { font-weight: 400; letter-spacing: .02em; text-transform: none; }

/* Engineering stays legible, including code, diagrams and long source links. */
html[data-landing-design="childhood"] .engineering-grid { gap: 24px; border: 0; }
html[data-landing-design="childhood"] .engineering-card__link { padding: 24px; }
html[data-landing-design="childhood"] .engineering-card__link:hover { background: transparent; }
html[data-landing-design="childhood"] .engineering-article { padding: clamp(24px, 4vw, 56px); max-width: 900px; }
html[data-landing-design="childhood"] .engineering-article__header h1 { font-size: clamp(36px, 5vw, 60px); line-height: 1.08; }
html[data-landing-design="childhood"] .engineering-article__body :is(p, li, dd) { font-size: 20px; line-height: 1.6; }
html[data-landing-design="childhood"] :is(.engineering-article__body a, .landing-content a) { overflow-wrap: anywhere; }
html[data-landing-design="childhood"] .engineering-article__cta { background: var(--landing-fine-texture), #DCE8ED; background-size: var(--landing-fine-sizes); }
html[data-landing-design="childhood"] :is(.engineering-version-note, .engineering-code, .engineering-flow, .engineering-toc) { background-color: var(--paper-warm); }
html[data-landing-design="childhood"] .engineering-code { color: var(--landing-ink); }

/* Features and legal/support reading sheets. */
html[data-landing-design="childhood"] .feature-hub-card--privacy { background-color: #DCE8ED; color: var(--landing-ink); }
html[data-landing-design="childhood"] .feature-hub-card--direction { background-color: #EFDEE4; }
html[data-landing-design="childhood"] .feature-hub-card--privacy :is(p, li, a) { color: var(--landing-secondary); }
html[data-landing-design="childhood"] .feature-hub-card__eyebrow { font-size: 16px; text-transform: none; letter-spacing: 0; }
html[data-landing-design="childhood"] .landing-content { max-width: 850px; margin: calc(var(--landing-header-height) + 48px) auto 48px; padding: clamp(24px, 4vw, 56px); }
html[data-landing-design="childhood"] .landing-content__heading { font-size: clamp(36px, 5vw, 60px); color: #2E5272; }
html[data-landing-design="childhood"] .landing-content__text { font-size: 20px; line-height: 1.6; }
html[data-landing-design="childhood"] .landing-content__text :is(h2, h3) { margin-top: 32px; }

/* Guest plan choice and its feedback sheet, without changing checkout behavior. */
html[data-landing-design="childhood"] .landing-page .membership-start--focused { max-width: 600px; padding-top: calc(var(--landing-header-height) + 40px); }
html[data-landing-design="childhood"] .membership-picker { padding: 24px; margin-top: 32px; }
html[data-landing-design="childhood"] .membership-option:has(input:checked) { background-color: #F6E6BE; }
html[data-landing-design="childhood"] .membership-option:has(input:focus-visible) { outline: 2px solid #315F87; outline-offset: 3px; }
html[data-landing-design="childhood"] .membership-option input { accent-color: #2E5272; }
html[data-landing-design="childhood"] .membership-option__identity > strong { font-size: 22px; font-weight: 400; }
html[data-landing-design="childhood"] :is(.membership-picker__billing, .membership-option__identity > span, .membership-legal-footer a) { font-size: 16px; }
html[data-landing-design="childhood"] .membership-feedback-dialog { color: var(--landing-ink); }
html[data-landing-design="childhood"] .membership-feedback-dialog::backdrop { background: rgb(47 61 47 / 55%); }
html[data-landing-design="childhood"] .membership-feedback-writing textarea { color: #2E5272; background: url("/assets/childhood/writing-rule-38326613.svg"), var(--landing-paper-texture), var(--landing-surface); background-size: 100% 28px, var(--landing-paper-sizes); border: 1px solid var(--landing-border); font: 20px/28px var(--font-body); }

/* The sample journal uses the same loose pages as the app. */
html[data-landing-design="childhood"] .experience-app { --experience-line: var(--sepia-line); background-color: var(--paper-warm); }
html[data-landing-design="childhood"] :is(.experience-app__header, .experience-nav, .experience-entries) { background: var(--landing-paper-texture), var(--landing-surface); background-size: var(--landing-paper-sizes); }
html[data-landing-design="childhood"] .experience-page,
html[data-landing-design="childhood"] .experience-diary-entry__note {
  color: #2E5272;
  background: linear-gradient(90deg, transparent 22px, #D9776A99 22px 23px, transparent 23px), url("/assets/childhood/writing-rule-38326613.svg"), var(--landing-paper-texture), var(--landing-surface);
  background-size: auto, 100% 28px, var(--landing-paper-sizes);
  border: 1px solid var(--landing-border);
  border-image: url("/assets/childhood/pencil-frame-43fe9b19.svg") 12 / 8px / 1px stretch;
  border-radius: 3px;
  box-shadow: var(--landing-paper-shadow);
}
html[data-landing-design="childhood"] .experience-page { position: relative; padding-top: 28px; }
html[data-landing-design="childhood"] .experience-page::before {
  content: "";
  position: absolute;
  top: -16px;
  left: calc(50% - 19px);
  width: 38px;
  height: 46px;
  background: url("/assets/childhood/pushpin-e3110781.svg") center / contain no-repeat;
  pointer-events: none;
}
html[data-landing-design="childhood"] .experience-page h2 { color: #2E5272; }
html[data-landing-design="childhood"] .experience-page__writing { font-size: 20px; line-height: 28px; }
html[data-landing-design="childhood"] .experience-diary-entry__note { padding: 12px 16px 12px 32px; font-size: 20px; line-height: 28px; }
html[data-landing-design="childhood"] .experience-nav > a { border-radius: 0; border-bottom: 1px solid var(--sepia-line); font-size: 16px; }
html[data-landing-design="childhood"] .experience-nav > a[aria-current],
html[data-landing-design="childhood"] .experience-entries a[aria-current] { background: #F2DD88A6; color: var(--landing-ink); box-shadow: none; border-radius: 3px; }
html[data-landing-design="childhood"] .experience-time__step[aria-current] .experience-time__number { background: #F3DE88; color: var(--landing-ink); }
html[data-landing-design="childhood"] .experience-time__step strong { font-size: 16px; }
html[data-landing-design="childhood"] .experience .experience-eyebrow { font-size: 14px; letter-spacing: .02em; text-transform: none; }
html[data-landing-design="childhood"] :is(.experience-time__step small, .experience-app__sample, .experience-app__author, .experience-page__date, .experience-entries time, .experience-plan > p, .experience-plan ul, .experience-sample-note) { font-size: 14px; }
html[data-landing-design="childhood"] .experience-calendar { max-width: 390px; width: 100%; margin: auto; background: var(--landing-paper-texture), var(--landing-surface); background-size: var(--landing-paper-sizes); border: 0; }
html[data-landing-design="childhood"] .experience-diary-book { border-radius: 3px; background: transparent; overflow: visible; }
html[data-landing-design="childhood"] .experience-calendar__table { border-spacing: 0; }
html[data-landing-design="childhood"] .experience-calendar__table td { border-top: 1px solid var(--sepia-line); border-right: 1px solid var(--sepia-line); }
html[data-landing-design="childhood"] .experience-calendar__table td:last-child { border-right: 0; }
html[data-landing-design="childhood"] .experience-calendar__day { min-height: 56px; border-radius: 0; background: transparent; }
html[data-landing-design="childhood"] .experience-calendar__day[aria-current] { color: var(--landing-ink); border: 1px solid transparent; background: url("/assets/childhood/calendar-circle-6c91ca1d.svg") center 2px / 34px 32px no-repeat; box-shadow: none; }
html[data-landing-design="childhood"] .experience-calendar__number { font-size: 18px; }
html[data-landing-design="childhood"] .experience-plan--premium { background-color: #DCE8ED; }
html[data-landing-design="childhood"] .experience-photo { transform: none; }

@media (max-width: 1200px) {
  html[data-landing-design] .landing-nav-links { display: none; }
}
@media (max-width: 640px) {
  html[data-landing-design] .landing-nav--blog .landing-logo-text,
  html[data-landing-design] .landing-nav--blog .blog-header-divider { display: none; }
  html[data-landing-design] :is(.blog-header-back, .engineering-header-label, .experience-header-label) { padding: 4px; white-space: nowrap; font-size: 12px; }
  html[data-landing-design] .experience-header-label { display: inline-flex; align-items: center; min-height: 44px; }
  html[data-landing-design] .landing-brand-group { min-width: 0; }
  html[data-landing-design] .landing-auth-group { flex-shrink: 0; }
  html[data-landing-design="childhood"] :is(.blog-header-back, .engineering-header-label, .experience-header-label) { font-size: 16px; }
  html[data-landing-design="childhood"] .editorial-post,
  html[data-landing-design="childhood"] .engineering-article { padding: 24px 20px; }
  html[data-landing-design="childhood"] .blog-card { padding: 24px; }
  html[data-landing-design="childhood"] .blog-card-image-wrap { margin: -24px -24px 24px; }
  html[data-landing-design="childhood"] .landing-page .membership-start--focused { padding-inline: 16px; }
  html[data-landing-design="childhood"] .membership-picker { padding: 16px; }
  html[data-landing-design="childhood"] .membership-option { padding: 12px; gap: 8px; }
  html[data-landing-design="childhood"] .experience-calendar { padding-inline: 0; }
  html[data-landing-design="childhood"] .experience-checkin { padding-inline: 0; }
  html[data-landing-design="childhood"] .experience-page__date { font-size: 12px; }
}
@media (forced-colors: active) {
  html[data-landing-design="childhood"] body.landing-page,
  html[data-landing-design="childhood"] body.landing-page * { background-image: none !important; border-image: none !important; box-shadow: none !important; }
  html[data-landing-design="childhood"] :is(.editorial-post, .engineering-article, .membership-picker)::before { display: none; }
  html[data-landing-design="childhood"] .experience-page::before { display: none; }
  html[data-landing-design="childhood"] :is(.editorial-post, .engineering-article, .membership-picker, .landing-content, .membership-feedback-dialog) { border-color: CanvasText; }
}
@media (max-width: 360px) {
  html[data-landing-design="childhood"] .experience { padding-inline: 0; }
}