/* LifeDrop product shell — shared by the FastAPI-rendered product surfaces. */
@font-face {
  font-family: "LifeDrop Display";
  src: url("/static/fonts/dm-serif-display-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "LifeDrop Sans";
  src: url("/static/fonts/dm-sans-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 1000;
  font-display: swap;
}

@font-face {
  font-family: "LifeDrop Wordmark";
  src: url("/static/fonts/caveat-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 500 600;
  font-display: swap;
}

:root {
  /* Exact palette from the public landing page. */
  --ld-ink: #172019;
  --ld-muted: #706960;
  --ld-wall: #e7ddcf;
  --ld-paper: #fff9ee;
  --ld-cream: #fff9ee;
  --ld-clay: #5f7f68;
  --ld-orange: #eb7e4f;
  --ld-sage: #5f7f68;
  --ld-blue: #4f6f97;
  --ld-mint: #5f7f68;
  --ld-gold: #4f6f97;
  --ld-forest: #172019;
  --ld-forest-2: #24211e;
  --ld-forest-3: #302c28;
  --ld-line-dark: rgba(255, 249, 238, 0.16);
  --ld-line-light: rgba(23, 32, 25, 0.16);
  --ld-display: ui-rounded, "SF Pro Rounded", "LifeDrop Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ld-sans: ui-rounded, "SF Pro Rounded", "LifeDrop Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ld-hand: "LifeDrop Wordmark", Caveat, cursive;
  --ld-ease: cubic-bezier(0.16, 1, 0.3, 1);
}

html { min-width: 320px; background: var(--ld-cream); }
body { text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
button, input, textarea, select { font-family: var(--ld-sans); }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible {
  outline: 3px solid rgba(217, 173, 119, 0.58) !important;
  outline-offset: 3px;
}
::selection { background: rgba(217, 121, 71, 0.28); }

/* Shared cinematic background and film-grain treatment. */
body:has(#openForm),
body:has(#codeForm),
body:has(.sendback-page-top),
body:has(.sent-postcard-view),
body:has(.profile-shell),
body:has(.relationship-workspace) {
  position: relative;
  isolation: isolate;
}

body:has(#openForm)::before,
body:has(#codeForm)::before,
body:has(.sendback-page-top)::before,
body:has(.sent-postcard-view)::before {
  content: "";
  position: fixed;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  opacity: 0.22;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.88' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E");
  mix-blend-mode: soft-light;
}

/* Open-a-LifeDrop and public-link gates. */
body:has(#openForm),
body:has(#codeForm) {
  min-height: 100vh !important;
  display: grid !important;
  place-items: center !important;
  padding: 30px 20px !important;
  overflow-x: hidden;
  color: var(--ld-cream) !important;
  font-family: var(--ld-sans) !important;
  background:
    radial-gradient(circle at 76% 18%, rgba(55, 120, 91, 0.24), transparent 30rem),
    radial-gradient(circle at 18% 86%, rgba(217, 173, 119, 0.11), transparent 26rem),
    var(--ld-forest) !important;
}

body:has(#openForm) > main,
body:has(#codeForm) > main {
  width: min(1080px, 100%) !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

body:has(#openForm) .brand,
body:has(#codeForm) .brand {
  margin: 0 0 30px !important;
  color: var(--ld-cream) !important;
  font: 400 34px/0.9 var(--ld-hand) !important;
  letter-spacing: -0.035em !important;
  text-transform: none !important;
}

body:has(#openForm) > main > section,
body:has(#codeForm) .notice,
body:has(#codeForm) .actions {
  border: 1px solid var(--ld-line-dark) !important;
  border-radius: 28px !important;
  box-shadow: 0 36px 100px rgba(0, 0, 0, 0.28) !important;
}

body:has(#openForm) > main > section {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1.06fr) minmax(340px, 0.94fr);
  gap: 54px;
  align-items: end;
  padding: clamp(34px, 6vw, 72px) !important;
  background:
    radial-gradient(circle at 82% 8%, rgba(172, 215, 198, 0.12), transparent 22rem),
    rgba(10, 38, 28, 0.86) !important;
  backdrop-filter: blur(22px);
}

body:has(#openForm) > main > section::after {
  content: "A private doorway to something made for you.";
  grid-column: 1;
  max-width: 34ch;
  color: var(--ld-sage);
  font-size: 14px;
  line-height: 1.6;
}

body:has(#openForm) h1,
body:has(#codeForm) h1 {
  color: var(--ld-cream) !important;
  font-family: var(--ld-display) !important;
  font-weight: 400 !important;
  letter-spacing: -0.055em !important;
}

body:has(#openForm) h1 {
  align-self: end;
  margin: 0 !important;
  font-size: clamp(64px, 9vw, 116px) !important;
  line-height: 0.83 !important;
}

body:has(#openForm) > main > section > p {
  align-self: start;
  max-width: 30ch;
  margin: 24px 0 0 !important;
  color: var(--ld-sage) !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
}

body:has(#openForm) #openForm {
  grid-column: 2;
  grid-row: 1 / span 3;
  display: grid !important;
  gap: 14px !important;
  align-self: stretch;
  align-content: center;
  margin: 0 !important;
  padding: clamp(24px, 4vw, 42px);
  border: 1px solid rgba(217, 173, 119, 0.25);
  border-radius: 22px;
  background: rgba(4, 21, 15, 0.62);
}

body:has(#openForm) label,
body:has(#codeForm) .field span {
  color: var(--ld-gold) !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: 0.15em !important;
}

body:has(#openForm) input,
body:has(#codeForm) input[type="text"] {
  min-height: 58px;
  padding: 0 17px !important;
  border: 1px solid rgba(172, 215, 198, 0.22) !important;
  border-radius: 13px !important;
  background: rgba(244, 236, 223, 0.07) !important;
  color: var(--ld-cream) !important;
  font-size: 16px !important;
  text-transform: none !important;
  transition: border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}

body:has(#openForm) input::placeholder,
body:has(#codeForm) input::placeholder { color: rgba(169, 188, 180, 0.52); }
body:has(#openForm) input:focus,
body:has(#codeForm) input:focus {
  border-color: var(--ld-gold) !important;
  background: rgba(244, 236, 223, 0.1) !important;
  box-shadow: 0 0 0 4px rgba(217, 173, 119, 0.1);
}

body:has(#openForm) button,
body:has(#codeForm) .button {
  min-height: 54px !important;
  border: 1px solid var(--ld-cream) !important;
  border-radius: 999px !important;
  background: var(--ld-cream) !important;
  color: var(--ld-ink) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  transition: transform 180ms var(--ld-ease), box-shadow 180ms ease !important;
}
body:has(#openForm) button:hover,
body:has(#codeForm) .button:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(0,0,0,.22); }

body:has(#openForm) nav {
  position: absolute;
  top: 24px;
  right: 28px;
  margin: 0 !important;
}
body:has(#openForm) nav a,
body:has(#codeForm) a { color: var(--ld-sage) !important; }

body:has(#codeForm) > main { max-width: 1080px !important; }
body:has(#codeForm) .office-top { margin-bottom: 26px !important; }
body:has(#codeForm) .profile-nav { display: flex; align-items: center; gap: 22px; }
body:has(#codeForm) .login-link { color: var(--ld-gold) !important; }
body:has(#codeForm) .handle { color: var(--ld-cream) !important; opacity: .72; }
body:has(#codeForm) .notice {
  padding: clamp(34px, 6vw, 68px) !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  background: rgba(10, 38, 28, 0.88);
}
body:has(#codeForm) .notice h1 { max-width: 790px; font-size: clamp(58px, 8vw, 104px) !important; line-height: .88 !important; }
body:has(#codeForm) .notice p { color: var(--ld-sage) !important; font-weight: 500 !important; }
body:has(#codeForm) .label { color: var(--ld-gold) !important; }
body:has(#codeForm) .actions {
  margin-top: -1px !important;
  padding: clamp(24px, 4vw, 40px) !important;
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  background: rgba(4, 21, 15, 0.8) !important;
}
body:has(#codeForm) .button.secondary { border-color: var(--ld-line-dark) !important; background: transparent !important; color: var(--ld-cream) !important; }

/* Postcard reader and creator chrome. The postcard art itself remains untouched. */
body:has(.postcard-desktop-stage),
body:has(.sendback-page-top),
body:has(.sent-postcard-view) {
  font-family: var(--ld-sans) !important;
  background:
    radial-gradient(circle at 78% 12%, rgba(54, 118, 89, 0.2), transparent 30rem),
    radial-gradient(circle at 12% 88%, rgba(217, 173, 119, 0.1), transparent 28rem),
    var(--ld-forest) !important;
  color: var(--ld-cream) !important;
}

body:has(.postcard-desktop-stage) #root,
body:has(.sendback-page-top) #root,
body:has(.sent-postcard-view) #root { width: min(1440px, 100%) !important; }

.eyebrow.desktop-postcard-piece,
.postcard-top-actions.desktop-postcard-piece,
.flip-controls.desktop-postcard-piece,
.sendback-page-top,
.sent-detail-hero,
.sent-page-nav { font-family: var(--ld-sans) !important; }

.eyebrow.desktop-postcard-piece {
  color: var(--ld-gold) !important;
  font-size: 9px !important;
  letter-spacing: .17em !important;
}

.postcard-top-app-link,
.flip-button,
.sendback-page-back,
.sendback-step-button,
.sendback-submit,
[data-postcard-open-pdf] {
  border-radius: 999px !important;
  font-family: var(--ld-sans) !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  transition: transform 180ms var(--ld-ease), box-shadow 180ms ease, background 180ms ease !important;
}
.postcard-top-app-link:hover,
.flip-button:hover,
.sendback-page-back:hover,
.sendback-step-button:hover,
.sendback-submit:hover { transform: translateY(-2px); }

.postcard-top-app-link,
.flip-button {
  min-height: 44px !important;
  padding-inline: 18px !important;
  border-color: var(--ld-line-dark) !important;
  background: rgba(244, 236, 223, .08) !important;
  color: var(--ld-cream) !important;
  backdrop-filter: blur(16px);
}

.postcard-desktop-stage { perspective: 1800px; }
.postcard-shell {
  filter: drop-shadow(0 45px 72px rgba(0, 0, 0, .34));
  transition: transform 600ms var(--ld-ease), filter 400ms ease !important;
}
.postcard-shell:hover { filter: drop-shadow(0 52px 88px rgba(0, 0, 0, .4)); }

.sendback-page-top {
  position: relative;
  overflow: hidden;
  margin: 12px auto 28px !important;
  padding: clamp(28px, 5vw, 58px) !important;
  border: 1px solid var(--ld-line-dark) !important;
  border-radius: 26px !important;
  background:
    radial-gradient(circle at 84% 8%, rgba(172,215,198,.12), transparent 22rem),
    rgba(10, 38, 28, .82) !important;
  box-shadow: 0 28px 84px rgba(0,0,0,.24);
}
.sendback-page-brand { color: var(--ld-cream) !important; font: 400 30px/1 var(--ld-hand) !important; text-transform: none !important; letter-spacing: -.03em !important; }
.sendback-page-back { color: var(--ld-sage) !important; }
.sendback-account-chip,
.sendback-account-alert {
  border: 1px solid rgba(172,215,198,.15) !important;
  border-radius: 13px !important;
  background: rgba(4,21,15,.52) !important;
  color: var(--ld-sage) !important;
}
.sendback-account-alert.is-conflict {
  border-color: rgba(217,121,71,.32) !important;
  background: rgba(217,121,71,.10) !important;
  color: #f2c4ad !important;
}
.sendback-account-chip *,
.sendback-account-alert * { color: inherit !important; }
.sendback-account-alert button,
.sendback-account-alert a { border-radius:999px !important; }
.sendback-page-top h1,
.sent-detail-hero h1 {
  max-width: 900px;
  color: var(--ld-cream) !important;
  font-family: var(--ld-display) !important;
  font-weight: 400 !important;
  font-size: clamp(54px, 7vw, 94px) !important;
  line-height: .92 !important;
  letter-spacing: -.05em !important;
}
.sendback-page-top > p,
.sent-detail-hero p { color: var(--ld-sage) !important; font-weight: 500 !important; }

.web-sendback-flow,
.sendback-step,
.sendback-review,
.sendback-success {
  border-color: var(--ld-line-dark) !important;
  border-radius: 24px !important;
}
.web-sendback-flow {
  background: rgba(8, 30, 22, .9) !important;
  box-shadow: 0 30px 90px rgba(0,0,0,.25) !important;
}
.web-sendback-flow > h2,
.sendback-head h2,
.sendback-form > h2 {
  color: var(--ld-cream) !important;
  font-family: var(--ld-display) !important;
  font-weight: 400 !important;
  letter-spacing: -.035em !important;
}
.sendback-stepper,
.sendback-live-side-toggle,
.sendback-design-dock {
  border-color: var(--ld-line-dark) !important;
  background: rgba(244,236,223,.045) !important;
}
.sendback-step-dot,
.sendback-live-side-toggle button,
.sendback-design-dock button { color: var(--ld-sage) !important; }
.sendback-step-dot.is-active,
.sendback-live-side-toggle button.is-active,
.sendback-design-dock button[aria-expanded="true"] {
  background: var(--ld-cream) !important;
  color: var(--ld-ink) !important;
}
.sendback-step-status,
.sendback-autosave-status { color: var(--ld-sage) !important; }
.sendback-step { background: rgba(244, 236, 223, .035) !important; }
.sendback-step-guide {
  border: 1px solid var(--ld-line-dark) !important;
  border-radius: 16px !important;
  background: rgba(172,215,198,.055) !important;
  color: var(--ld-sage) !important;
}
.sendback-step-guide strong { color: var(--ld-gold) !important; }
.sendback-step-guide *:not(strong) { color: var(--ld-sage) !important; }
.sendback-step h2,
.sendback-step legend,
.sendback-review h2,
.sendback-success h2 { color: var(--ld-cream) !important; font-family: var(--ld-display) !important; font-weight: 400 !important; }
.sendback-step p,
.sendback-step small,
.sendback-review p { color: var(--ld-sage) !important; }
.sendback-field,
.sendback-field > span,
.sendback-group legend,
.sendback-style-section-title,
.sendback-design-intro { color: var(--ld-cream) !important; }
.sendback-section-reset {
  border-color: var(--ld-line-dark) !important;
  border-radius: 999px !important;
  background: rgba(244,236,223,.06) !important;
  color: var(--ld-sage) !important;
}
.web-sendback-flow input,
.web-sendback-flow textarea,
.web-sendback-flow select {
  border-color: rgba(172,215,198,.18) !important;
  border-radius: 12px !important;
  background: rgba(244,236,223,.06) !important;
  color: var(--ld-cream) !important;
}
.sendback-submit,
.sendback-step-button:not(.secondary) { border-color: var(--ld-cream) !important; background: var(--ld-cream) !important; color: var(--ld-ink) !important; }
.sendback-step-button.secondary { border-color: var(--ld-line-dark) !important; background: transparent !important; color: var(--ld-cream) !important; }
.sendback-step-actions {
  border: 1px solid var(--ld-line-dark) !important;
  border-radius: 18px !important;
  background: rgba(4,21,15,.56) !important;
}
.sendback-step-actions .sendback-autosave-status { color: var(--ld-sage) !important; }
.sendback-step-actions *:not(button) { color: var(--ld-sage) !important; }
.sendback-step-actions button[disabled] { opacity: .44 !important; }

/* Shared polished empty/loading cards. */
body > main > .empty:only-child {
  width: min(560px, calc(100% - 32px));
  margin: 15vh auto;
  padding: 44px;
  border: 1px solid var(--ld-line-dark);
  border-radius: 24px;
  background: rgba(10, 38, 28, .82);
  color: var(--ld-cream);
  box-shadow: 0 30px 90px rgba(0,0,0,.25);
  text-align: center;
}
body > main > .empty:only-child h1 { margin: 0; font: 400 48px/1 var(--ld-display); }
body > main > .empty:only-child p { color: var(--ld-sage); }

/* Legal pages use the same editorial forest world as the product. */
body:has(.legal-nav):has(.contents) {
  color: var(--ld-cream) !important;
  font-family: var(--ld-sans) !important;
  background:
    radial-gradient(circle at 78% 10%, rgba(54,118,89,.22), transparent 30rem),
    var(--ld-forest) !important;
}
body:has(.legal-nav):has(.contents) .topbar { border-bottom:1px solid var(--ld-line-dark); }
body:has(.legal-nav):has(.contents) .brand,
body:has(.legal-nav):has(.contents) .back { color:var(--ld-cream) !important; }
body:has(.legal-nav):has(.contents) .brand-mark { background:var(--ld-gold) !important; color:var(--ld-ink) !important; }
body:has(.legal-nav):has(.contents) article {
  border-color:var(--ld-line-dark) !important;
  background:
    radial-gradient(circle at 84% 4%, rgba(172,215,198,.08), transparent 24rem),
    rgba(10,38,28,.86) !important;
  box-shadow:0 32px 100px rgba(0,0,0,.28) !important;
}
body:has(.legal-nav):has(.contents) .eyebrow,
body:has(.legal-nav):has(.contents) .summary strong { color:var(--ld-gold) !important; }
body:has(.legal-nav):has(.contents) h1,
body:has(.legal-nav):has(.contents) h2 { color:var(--ld-cream) !important; font-family:var(--ld-display) !important; }
body:has(.legal-nav):has(.contents) .updated,
body:has(.legal-nav):has(.contents) .intro,
body:has(.legal-nav):has(.contents) p,
body:has(.legal-nav):has(.contents) li,
body:has(.legal-nav):has(.contents) .fine-print { color:var(--ld-sage) !important; }
body:has(.legal-nav):has(.contents) .summary {
  border-color:rgba(217,173,119,.24) !important;
  background:rgba(217,173,119,.07) !important;
}
body:has(.legal-nav):has(.contents) .summary p { color:#cfdbd5 !important; }
body:has(.legal-nav):has(.contents) .contents,
body:has(.legal-nav):has(.contents) .legal-nav { border-color:var(--ld-line-dark) !important; }
body:has(.legal-nav):has(.contents) .contents a,
body:has(.legal-nav):has(.contents) .legal-nav a { color:var(--ld-mint) !important; }
body:has(.legal-nav):has(.contents) .legal-nav a[aria-current="page"] { color:var(--ld-gold) !important; }

/* Warm editorial refresh: match the paper-led landing page. */
body:has(#openForm),
body:has(#codeForm),
body:has(.postcard-desktop-stage),
body:has(.sendback-page-top),
body:has(.sent-postcard-view),
body:has(.legal-nav):has(.contents) {
  color: var(--ld-ink) !important;
  background:
    radial-gradient(circle at 84% 12%, rgba(228, 151, 101, .12), transparent 30rem),
    radial-gradient(circle at 16% 88%, rgba(172, 215, 198, .14), transparent 32rem),
    #f5eee4 !important;
}

body:has(#openForm)::before,
body:has(#codeForm)::before,
body:has(.sendback-page-top)::before,
body:has(.sent-postcard-view)::before {
  opacity: .035;
  mix-blend-mode: multiply;
}

body:has(#openForm) .brand,
body:has(#codeForm) .brand,
body:has(#openForm) h1,
body:has(#codeForm) h1,
body:has(#codeForm) .handle {
  color: var(--ld-ink) !important;
}

body:has(#openForm) > main > section,
body:has(#codeForm) .notice,
body:has(#codeForm) .actions {
  border-color: rgba(23, 32, 25, .13) !important;
  background: rgba(255, 253, 248, .68) !important;
  box-shadow: 0 32px 90px rgba(72, 51, 32, .09) !important;
}

body:has(#openForm) > main > section::after {
  display: none;
}

body:has(#openForm) > main > section > p,
body:has(#codeForm) .notice p {
  color: #686d68 !important;
  font-size: 17px !important;
}

body:has(#openForm) #openForm {
  border-color: rgba(23, 32, 25, .13);
  background: rgba(255, 253, 248, .78);
}

body:has(#openForm) label,
body:has(#codeForm) .field span,
body:has(#codeForm) .label {
  color: #a45d32 !important;
  font-size: 13px !important;
}

body:has(#openForm) input,
body:has(#codeForm) input[type="text"] {
  border-color: rgba(23, 32, 25, .18) !important;
  background: #fffdf8 !important;
  color: var(--ld-ink) !important;
  font-size: 17px !important;
}

body:has(#openForm) input::placeholder,
body:has(#codeForm) input::placeholder {
  color: #8a877f;
}

body:has(#openForm) input:focus,
body:has(#codeForm) input:focus {
  border-color: #a45d32 !important;
  background: #fffdf8 !important;
  box-shadow: 0 0 0 4px rgba(164, 93, 50, .1);
}

body:has(#openForm) button,
body:has(#codeForm) .button {
  border-color: var(--ld-ink) !important;
  background: var(--ld-ink) !important;
  color: var(--ld-cream) !important;
  font-size: 14px !important;
}

body:has(#openForm) nav a,
body:has(#codeForm) a,
body:has(#codeForm) .login-link {
  color: #365c4d !important;
  font-size: 14px !important;
}

body:has(#codeForm) .button.secondary {
  border-color: rgba(23, 32, 25, .16) !important;
  background: transparent !important;
  color: var(--ld-ink) !important;
}

.eyebrow.desktop-postcard-piece {
  color: #a45d32 !important;
  font-size: 13px !important;
}

.postcard-top-app-link,
.flip-button {
  border-color: rgba(23, 32, 25, .15) !important;
  background: rgba(255, 253, 248, .78) !important;
  color: var(--ld-ink) !important;
}

.postcard-shell {
  filter: drop-shadow(0 34px 58px rgba(72, 51, 32, .18));
}

.postcard-shell:hover {
  filter: drop-shadow(0 40px 70px rgba(72, 51, 32, .23));
}

.sendback-page-top,
.sent-detail-hero {
  border-color: rgba(23, 32, 25, .13) !important;
  background: rgba(255, 253, 248, .54) !important;
  box-shadow: none !important;
}

.sendback-page-brand,
.sendback-page-top h1,
.sent-detail-hero h1,
.web-sendback-flow > h2,
.sendback-head h2,
.sendback-form > h2,
.sendback-step h2,
.sendback-step legend,
.sendback-review h2,
.sendback-success h2,
.sendback-field,
.sendback-field > span,
.sendback-group legend,
.sendback-style-section-title,
.sendback-design-intro {
  color: var(--ld-ink) !important;
}

.sendback-page-back {
  color: #365c4d !important;
  font-size: 14px !important;
}

.sendback-page-top > p {
  display: none !important;
}

.sendback-account-chip,
.sendback-account-alert {
  border-color: rgba(23, 32, 25, .13) !important;
  background: rgba(255, 253, 248, .72) !important;
  color: #5f655f !important;
  font-size: 14px !important;
}

.sendback-account-alert.is-conflict {
  border-color: rgba(164, 93, 50, .28) !important;
  background: rgba(228, 151, 101, .1) !important;
  color: #874825 !important;
}

.web-sendback-flow {
  border-color: rgba(23, 32, 25, .13) !important;
  background: rgba(255, 253, 248, .72) !important;
  box-shadow: 0 28px 80px rgba(72, 51, 32, .09) !important;
}

.sendback-stepper,
.sendback-live-side-toggle,
.sendback-design-dock,
.sendback-step {
  border-color: rgba(23, 32, 25, .13) !important;
  background: rgba(255, 253, 248, .7) !important;
}

.sendback-step-dot,
.sendback-live-side-toggle button,
.sendback-design-dock button,
.sendback-step-status {
  color: #6b706b !important;
}

.sendback-step-dot,
.sendback-step-dot em,
.sendback-step-dot i,
.sendback-live-side-toggle button,
.sendback-design-dock button,
.sendback-section-reset,
.sendback-step-guide strong {
  font-size: 13px !important;
}

.sendback-field > span {
  font-size: 14px !important;
}

.sendback-creation-progress *,
.live-postcard-tabs button,
.sendback-look-copy * {
  font-size: 13px !important;
}

.sendback-step-dot.is-active,
.sendback-live-side-toggle button.is-active,
.sendback-design-dock button[aria-expanded="true"] {
  background: var(--ld-ink) !important;
  color: var(--ld-cream) !important;
}

.sendback-step-guide {
  border-color: rgba(23, 32, 25, .13) !important;
  background: rgba(172, 215, 198, .13) !important;
  color: #365c4d !important;
}

.sendback-step-guide strong {
  color: #365c4d !important;
}

.sendback-step-guide span {
  display: none !important;
}

.sendback-step p,
.sendback-step small,
.sendback-review p {
  color: #666c67 !important;
  font-size: 15px !important;
}

.sendback-section-reset {
  border-color: rgba(23, 32, 25, .14) !important;
  background: rgba(255, 253, 248, .8) !important;
  color: #5f655f !important;
}

.web-sendback-flow input,
.web-sendback-flow textarea,
.web-sendback-flow select {
  border-color: rgba(23, 32, 25, .17) !important;
  background: #fffdf8 !important;
  color: var(--ld-ink) !important;
  font-size: 16px !important;
}

.sendback-submit,
.sendback-step-button:not(.secondary) {
  border-color: var(--ld-ink) !important;
  background: var(--ld-ink) !important;
  color: var(--ld-cream) !important;
  font-size: 14px !important;
}

.sendback-step-button.secondary {
  border-color: rgba(23, 32, 25, .16) !important;
  background: transparent !important;
  color: var(--ld-ink) !important;
}

.sendback-step-actions {
  border-color: rgba(23, 32, 25, .13) !important;
  background: rgba(255, 253, 248, .7) !important;
}

.sendback-autosave-status {
  display: none !important;
}

.sendback-share-status {
  display: none !important;
}

body > main > .empty:only-child {
  border-color: rgba(23, 32, 25, .13);
  background: rgba(255, 253, 248, .72);
  color: var(--ld-ink);
  box-shadow: 0 30px 90px rgba(72, 51, 32, .09);
}

body > main > .empty:only-child p {
  color: #686d68;
  font-size: 16px;
}

body:has(.legal-nav):has(.contents) .topbar,
body:has(.legal-nav):has(.contents) .contents,
body:has(.legal-nav):has(.contents) .legal-nav {
  border-color: rgba(23, 32, 25, .12) !important;
}

body:has(.legal-nav):has(.contents) .brand,
body:has(.legal-nav):has(.contents) .back,
body:has(.legal-nav):has(.contents) h1,
body:has(.legal-nav):has(.contents) h2 {
  color: var(--ld-ink) !important;
}

body:has(.legal-nav):has(.contents) article {
  border-color: rgba(23, 32, 25, .13) !important;
  background: rgba(255, 253, 248, .7) !important;
  box-shadow: 0 32px 90px rgba(72, 51, 32, .08) !important;
}

body:has(.legal-nav):has(.contents) .updated,
body:has(.legal-nav):has(.contents) .intro,
body:has(.legal-nav):has(.contents) p,
body:has(.legal-nav):has(.contents) li,
body:has(.legal-nav):has(.contents) .fine-print {
  color: #555d57 !important;
  font-size: 16px !important;
  line-height: 1.65 !important;
}

body:has(.legal-nav):has(.contents) .summary {
  border-color: rgba(182, 120, 69, .22) !important;
  background: rgba(228, 151, 101, .08) !important;
}

body:has(.legal-nav):has(.contents) .summary p {
  color: #454d47 !important;
}

body:has(.legal-nav):has(.contents) .contents a,
body:has(.legal-nav):has(.contents) .legal-nav a {
  color: #365c4d !important;
  font-size: 15px !important;
}

body:has(.legal-nav):has(.contents) .legal-nav a[aria-current="page"],
body:has(.legal-nav):has(.contents) .eyebrow,
body:has(.legal-nav):has(.contents) .summary strong {
  color: #a45d32 !important;
}

/* Creator composition: one workspace instead of stacked legacy sections. */
body.is-sendback-page main {
  width: min(1480px, 100%) !important;
  max-width: none !important;
  box-sizing: border-box;
  padding: 16px clamp(18px, 2.5vw, 38px) 56px !important;
}

body.is-sendback-page .sendback-page-top {
  width: min(1400px, 100%) !important;
  min-height: 62px;
  display: block !important;
  margin: 0 auto 26px !important;
  padding: 0 4px 15px !important;
  overflow: visible;
  border: 0 !important;
  border-bottom: 1px solid rgba(23, 32, 25, .14) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.is-sendback-page .sendback-page-nav {
  min-height: 46px;
}

body.is-sendback-page .sendback-page-brand {
  color: var(--ld-ink) !important;
  font: 400 36px/.9 var(--ld-hand) !important;
}

body.is-sendback-page .sendback-page-back {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  padding: 0 16px;
  border: 1px solid rgba(23, 32, 25, .15) !important;
  border-radius: 999px !important;
  background: rgba(255, 253, 248, .55);
  color: var(--ld-ink) !important;
  text-decoration: none;
}

body.is-sendback-page .sendback-page-top > .sendback-account-chip,
body.is-sendback-page .sendback-page-top > .sendback-account-alert,
body.is-sendback-page .sendback-page-top > h1,
body.is-sendback-page .sendback-page-top > p {
  display: none !important;
}

body.is-sendback-page .web-sendback-flow {
  width: min(1400px, 100%) !important;
  display: grid !important;
  grid-template-columns: minmax(360px, 430px) minmax(0, 1fr) !important;
  grid-template-areas:
    "head preview"
    "progress preview"
    "form preview" !important;
  grid-template-rows: auto auto 1fr;
  align-items: start !important;
  gap: 16px 34px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.is-sendback-page .sendback-head {
  grid-area: head !important;
  width: 100% !important;
  display: grid !important;
  gap: 10px !important;
  justify-self: stretch !important;
  text-align: left !important;
}

body.is-sendback-page .sendback-head::before {
  content: "New lifedrop";
  color: #a45d32;
  font-size: 13px;
  font-weight: 850;
  letter-spacing: .13em;
  text-transform: uppercase;
}

body.is-sendback-page .sendback-head h2 {
  margin: 0 !important;
  color: var(--ld-ink) !important;
  font: 400 clamp(46px, 4.7vw, 70px)/.9 var(--ld-display) !important;
  letter-spacing: -.058em !important;
}

body.is-sendback-page .sendback-head p {
  display: none !important;
}

body.is-sendback-page .sendback-creation-progress {
  grid-area: progress !important;
  width: 100%;
  border-color: rgba(23, 32, 25, .13) !important;
  background: rgba(255, 253, 248, .72) !important;
}

body.is-sendback-page .sendback-form {
  grid-area: form !important;
  width: 100% !important;
  display: grid !important;
  gap: 15px !important;
  justify-self: stretch !important;
  padding: 22px !important;
  border: 1px solid rgba(23, 32, 25, .18);
  border-radius: 16px;
  background: rgba(255, 253, 248, .78);
  box-shadow: 0 16px 38px rgba(72, 51, 32, .07);
}

body.is-sendback-page .sendback-form[hidden] {
  display: none !important;
}

body.is-sendback-page .sendback-live-preview {
  grid-area: preview !important;
  grid-column: auto !important;
  grid-row: 1 / span 3 !important;
  width: 100% !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  align-content: start;
  position: sticky !important;
  top: 18px !important;
  max-height: calc(100dvh - 36px) !important;
  overflow: auto !important;
  padding: 18px !important;
  border: 1px solid rgba(23, 32, 25, .18);
  border-radius: 18px;
  background: rgba(255, 253, 248, .7);
  box-shadow: 0 18px 46px rgba(72, 51, 32, .08);
  scrollbar-width: thin;
}

body.is-sendback-page .sendback-live-preview > .live-postcard {
  grid-column: 1 !important;
  width: min(100%, 880px) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.is-sendback-page .sendback-preview-controls {
  grid-column: 1 !important;
  width: min(100%, 880px);
  margin: 14px auto 0 !important;
}

body.is-sendback-page .sendback-stepper {
  position: relative !important;
  top: auto !important;
  z-index: 1 !important;
  display: flex !important;
  justify-content: space-between;
  gap: 8px !important;
  overflow: visible !important;
  padding: 0 0 14px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(23, 32, 25, .11) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

body.is-sendback-page .sendback-step-dot {
  min-width: 0;
  min-height: 36px !important;
  display: grid;
  place-items: center;
  padding: 0 !important;
  background: transparent !important;
}

body.is-sendback-page .sendback-step-dot em {
  display: none;
}

body.is-sendback-page .sendback-step-dot i {
  width: 34px !important;
  height: 34px !important;
  border-color: rgba(23, 32, 25, .14) !important;
  background: rgba(255, 253, 248, .78) !important;
  color: #70746f !important;
  font-size: 13px !important;
}

body.is-sendback-page .sendback-step-dot.is-active i {
  border-color: var(--ld-ink) !important;
  background: var(--ld-ink) !important;
  color: var(--ld-cream) !important;
}

body.is-sendback-page .sendback-step-dot.is-complete i {
  border-color: rgba(54, 92, 77, .26) !important;
  background: rgba(172, 215, 198, .2) !important;
  color: #365c4d !important;
}

body.is-sendback-page .sendback-step-guide {
  min-height: 0;
  padding: 2px 0 0 !important;
  border: 0 !important;
  background: transparent !important;
}

body.is-sendback-page .sendback-step-guide strong {
  color: #a45d32 !important;
  font-size: 13px !important;
}

body.is-sendback-page .sendback-step {
  min-height: 190px;
  padding: 20px !important;
  border: 1px solid rgba(23, 32, 25, .17) !important;
  border-radius: 12px !important;
  background: #fffdf8 !important;
}

body.is-sendback-page .sendback-step-actions {
  position: static !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  gap: 10px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

body.is-sendback-page .sendback-step-actions.is-first {
  grid-template-columns: 1fr !important;
}

body.is-sendback-page .sendback-step-button,
body.is-sendback-page .sendback-submit {
  min-height: 52px !important;
}

body.is-sendback-page .sendback-step-button.primary,
body.is-sendback-page .sendback-submit {
  width: 100%;
}

body.is-sendback-page .sendback-design-editor :is(span, summary, small, button),
body.is-sendback-page .sendback-group :is(span, small, button),
body.is-sendback-page .sendback-photo-fields :is(span, small, button),
body.is-sendback-page .sendback-photo-label {
  font-size: 13px !important;
}

body.is-sendback-page .sendback-photo-grid {
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 12px !important;
}

body.is-sendback-page .sendback-photo-moment {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: 104px minmax(0, 1fr) !important;
  grid-template-areas:
    "picker heading"
    "picker context"
    "picker location"
    "picker video" !important;
  gap: 9px 12px !important;
  align-items: stretch;
  padding: 12px !important;
  border: 1px solid rgba(23, 32, 25, .16);
  border-radius: 10px;
  background: rgba(245, 238, 228, .38);
}

body.is-sendback-page .sendback-photo-picker {
  grid-area: picker !important;
  width: 104px !important;
  min-height: 150px !important;
  align-self: stretch;
}

body.is-sendback-page .sendback-photo-heading {
  grid-area: heading !important;
}

body.is-sendback-page .sendback-photo-context {
  grid-area: context !important;
}

body.is-sendback-page .sendback-photo-location {
  grid-area: location !important;
}

body.is-sendback-page .sendback-video-thumb {
  grid-area: video !important;
}

body.is-sendback-page .sendback-photo-moment :is(input, textarea) {
  width: 100% !important;
  min-width: 0 !important;
}

body.is-sendback-page .sendback-photo-status,
body.is-sendback-page .sendback-group-help {
  font-size: 13px !important;
}

body.is-sendback-page .sendback-gallery-button,
body.is-sendback-page .sendback-gallery-button * {
  color: var(--ld-cream) !important;
}

body.is-sendback-page .sendback-success {
  grid-column: 1 / -1 !important;
  width: 100% !important;
}

@media (max-width: 900px) {
  body.is-sendback-page main {
    width: min(100%, 760px) !important;
    padding: 12px 12px 42px !important;
  }

  body.is-sendback-page .sendback-page-top {
    margin-bottom: 22px !important;
  }

  body.is-sendback-page .sendback-page-brand {
    font-size: 32px !important;
  }

  body.is-sendback-page .sendback-page-back {
    min-height: 40px;
    padding-inline: 13px;
  }

  body.is-sendback-page .web-sendback-flow {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas:
      "head"
      "progress"
      "form"
      "preview" !important;
    gap: 18px !important;
  }

  body.is-sendback-page .sendback-head {
    display: grid !important;
  }

  body.is-sendback-page .sendback-head h2 {
    font-size: clamp(48px, 15vw, 68px) !important;
  }

  body.is-sendback-page .sendback-form {
    padding: 16px !important;
    border-radius: 20px;
  }

  body.is-sendback-page .sendback-live-preview {
    grid-area: preview !important;
    position: relative !important;
    top: auto !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 10px !important;
    border-radius: 20px;
  }

  body.is-sendback-page .sendback-step {
    min-height: 0;
    padding: 17px !important;
  }
}

body.is-sendback-page .live-postcard-tabs button,
body.is-sendback-page .sendback-look-button,
body.is-sendback-page .sendback-section-reset,
body.is-sendback-page .sendback-step-button.secondary {
  border-color: rgba(20, 35, 27, .12) !important;
  border-radius: 999px !important;
  background: rgba(255, 249, 238, .82) !important;
  color: var(--ld-ink) !important;
}

body.is-sendback-page .live-postcard-tabs button.is-active {
  border-color: var(--ld-ink) !important;
  background: var(--ld-ink) !important;
  color: var(--ld-paper) !important;
}

body.is-sendback-page .sendback-step-button.primary:not([disabled]) {
  border-color: var(--ld-orange) !important;
  background: var(--ld-orange) !important;
  color: var(--ld-paper) !important;
}

/* Landing-page design language: rounded type, square controls, paper depth. */
body.is-sendback-page .sendback-head h2 {
  font-family: var(--ld-display) !important;
  font-weight: 950 !important;
  letter-spacing: -.065em !important;
}

body.is-sendback-page .sendback-head::after {
  display: none;
}

body.is-sendback-page :is(
  .sendback-page-back,
  .sendback-step-button,
  .sendback-submit,
  .sendback-section-reset,
  .sendback-account-alert,
  input,
  textarea,
  select
) {
  border-radius: 0 !important;
}

body.is-sendback-page .live-postcard-tabs,
body.is-sendback-page .live-postcard-tabs button {
  border-radius: 0 !important;
}

body.is-sendback-page .sendback-live-preview .postcard-shell.sendback-live-shell {
  filter: drop-shadow(0 22px 23px rgba(40, 31, 23, .18));
  transform: rotate(-.8deg) translateY(5px);
}

body.is-sendback-page .sendback-live-preview:hover .postcard-shell.sendback-live-shell {
  filter: drop-shadow(0 28px 28px rgba(40, 31, 23, .2));
}

body:has(#openForm) :is(#openForm, input, button),
body:has(#codeForm) :is(.notice, .actions, input, .button),
body:has(.legal-nav):has(.contents) :is(article, .summary) {
  border-radius: 0 !important;
}

@media (max-width: 760px) {
  body:has(#openForm), body:has(#codeForm) { padding: 18px 14px !important; }
  body:has(#openForm) > main > section { grid-template-columns: 1fr; gap: 22px; padding: 28px 22px 22px !important; }
  body:has(#openForm) h1 { font-size: clamp(58px, 19vw, 82px) !important; }
  body:has(#openForm) #openForm { grid-column: 1; grid-row: auto; padding: 22px 18px; }
  body:has(#openForm) > main > section::after { grid-column: 1; }
  body:has(#openForm) nav { position: static; grid-column: 1; }
  body:has(#codeForm) .notice { padding: 34px 24px !important; }
  body:has(#codeForm) .notice h1 { font-size: clamp(52px, 17vw, 76px) !important; }
  .sendback-page-top { margin-inline: 10px !important; padding: 28px 22px !important; }
  .sendback-page-top h1, .sent-detail-hero h1 { font-size: clamp(46px, 14vw, 68px) !important; }
}

/* Crisp editorial box system shared by all server-rendered product pages. */
body:has(#openForm) > main > section,
body:has(#codeForm) .notice,
body:has(#codeForm) .actions,
.sendback-page-top,
.sent-detail-hero,
.sent-page-nav,
body > main > .empty:only-child,
body:has(.legal-nav):has(.contents) article {
  border-color: rgba(23, 32, 25, .18) !important;
  box-shadow: 0 14px 34px rgba(72, 51, 32, .07) !important;
}

body:has(#openForm) > main > section,
body > main > .empty:only-child,
body:has(.legal-nav):has(.contents) article,
.sent-detail-hero {
  border-radius: 8px !important;
}

body:has(#openForm) #openForm,
body:has(#codeForm) .notice,
body:has(#codeForm) .actions,
.sendback-account-chip,
.sendback-account-alert,
.sendback-section-reset,
.web-sendback-flow input,
.web-sendback-flow textarea,
.web-sendback-flow select,
body:has(.legal-nav):has(.contents) .summary {
  border-radius: 5px !important;
}

body:has(#codeForm) .notice {
  border-top-left-radius: 8px !important;
  border-top-right-radius: 8px !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

body:has(#codeForm) .actions {
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  border-bottom-left-radius: 8px !important;
  border-bottom-right-radius: 8px !important;
}

body.is-sendback-page .sendback-form {
  border-color: rgba(23, 32, 25, .2) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

body.is-sendback-page .sendback-live-preview {
  border-color: rgba(23, 32, 25, .2) !important;
  border-radius: 10px !important;
  box-shadow: 0 12px 28px rgba(72, 51, 32, .07) !important;
}

body.is-sendback-page .sendback-step {
  border-color: rgba(23, 32, 25, .19) !important;
  border-radius: 4px !important;
}

body.is-sendback-page .sendback-photo-moment {
  border-color: rgba(23, 32, 25, .18) !important;
  border-radius: 4px !important;
}

body.is-sendback-page .sendback-stepper,
body.is-sendback-page .sendback-step-guide,
body.is-sendback-page .sendback-step-actions {
  box-shadow: none !important;
}

body:has(.legal-nav):has(.contents) .summary {
  border-left: 4px solid #a45d32 !important;
  background: rgba(228, 151, 101, .06) !important;
}

/* Flat cinematic canvas: depth belongs to the object, not every section. */
body:has(#openForm),
body:has(#codeForm),
body:has(.sendback-page-top),
body:has(.sent-postcard-view),
body:has(.legal-nav):has(.contents) {
  color: var(--ld-ink) !important;
  background:
    radial-gradient(ellipse at 8% 4%, rgba(217, 121, 71, .17), transparent 34rem),
    radial-gradient(ellipse at 92% 78%, rgba(172, 215, 198, .2), transparent 42rem),
    linear-gradient(135deg, #fbf4e9 0%, #f4e7d8 55%, #eedfce 100%) !important;
}

body:has(#openForm)::before,
body:has(#codeForm)::before,
body:has(.sendback-page-top)::before,
body:has(.sent-postcard-view)::before,
body:has(.legal-nav):has(.contents)::before {
  opacity: .14;
  background-image: radial-gradient(rgba(83, 64, 45, .2) .55px, transparent .55px);
  background-size: 17px 17px;
  mix-blend-mode: multiply;
}

body:has(#openForm) .brand,
body:has(#codeForm) .brand,
body:has(#openForm) h1,
body:has(#codeForm) h1,
body:has(#codeForm) .handle {
  color: var(--ld-ink) !important;
}

body:has(#openForm) > main > section {
  overflow: visible;
  border: 0 !important;
  border-top: 1px solid rgba(23, 32, 25, .2) !important;
  border-bottom: 1px solid rgba(23, 32, 25, .2) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none;
}

body:has(#openForm) > main > section > p,
body:has(#openForm) > main > section::after,
body:has(#openForm) nav a,
body:has(#codeForm) a {
  color: #5f685f !important;
}

body:has(#openForm) #openForm {
  padding-left: clamp(24px, 4vw, 42px);
  border: 0;
  border-left: 2px solid var(--ld-ink);
  border-radius: 0 !important;
  background: rgba(255, 253, 248, .22);
}

body:has(#openForm) label,
body:has(#codeForm) .field span {
  color: #96552f !important;
  font-size: 13px !important;
}

body:has(#openForm) input,
body:has(#codeForm) input[type="text"] {
  border-color: rgba(23, 32, 25, .2) !important;
  background: rgba(255, 253, 248, .36) !important;
  color: var(--ld-ink) !important;
}

body:has(#openForm) input::placeholder,
body:has(#codeForm) input::placeholder {
  color: rgba(23, 32, 25, .46);
}

body:has(#openForm) button,
body:has(#codeForm) .button {
  border-color: var(--ld-ink) !important;
  background: var(--ld-ink) !important;
  color: var(--ld-cream) !important;
}

body:has(#codeForm) .notice,
body:has(#codeForm) .actions {
  border-width: 1px 0 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body:has(#codeForm) .actions {
  border-bottom-width: 1px !important;
}

body:has(.legal-nav):has(.contents) article,
.sent-detail-hero,
.sent-page-nav,
body > main > .empty:only-child {
  border-width: 1px 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body:has(.legal-nav):has(.contents) .summary {
  border-width: 0 0 0 3px !important;
  border-radius: 0 !important;
  background: transparent !important;
}

body.is-sendback-page .web-sendback-flow {
  gap: 16px 0 !important;
}

body.is-sendback-page .sendback-form {
  padding: 19px 34px 0 0 !important;
  border: 0 !important;
  border-top: 2px solid var(--ld-ink) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.is-sendback-page .sendback-live-preview {
  padding: 0 0 0 34px !important;
  border: 0 !important;
  border-left: 1px solid rgba(23, 32, 25, .18) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.is-sendback-page .sendback-step {
  padding: 20px 0 !important;
  border: 0 !important;
  border-top: 1px solid rgba(23, 32, 25, .18) !important;
  border-radius: 0 !important;
  background: transparent !important;
}

body.is-sendback-page .sendback-photo-moment {
  padding: 14px 0 !important;
  border: 0 !important;
  border-top: 1px solid rgba(23, 32, 25, .15) !important;
  border-radius: 0 !important;
  background: transparent !important;
}

@media (max-width: 900px) {
  body.is-sendback-page .sendback-form {
    padding: 17px 0 0 !important;
  }

  body.is-sendback-page .sendback-live-preview {
    padding: 24px 0 0 !important;
    border-left: 0 !important;
    border-top: 1px solid rgba(23, 32, 25, .18) !important;
  }

  body.is-sendback-page .sendback-step {
    padding: 18px 0 !important;
  }
}

@media (max-width: 760px) {
  body:has(#openForm) > main > section {
    padding-inline: 0 !important;
  }

  body:has(#openForm) #openForm {
    padding: 22px 0 0;
    border-left: 0;
    border-top: 2px solid var(--ld-ink);
    background: transparent;
  }
}

/* Art-directed editorial pass: graphic canvas, tactile postcard object. */
body:has(#openForm),
body:has(#codeForm),
body:has(.sendback-page-top),
body:has(.sent-postcard-view),
body:has(.legal-nav):has(.contents) {
  background:
    linear-gradient(90deg, rgba(66, 48, 32, .032) 1px, transparent 1px) 0 0 / 32px 32px,
    linear-gradient(0deg, rgba(66, 48, 32, .028) 1px, transparent 1px) 0 0 / 32px 32px,
    var(--ld-wall) !important;
}

body.is-sendback-page {
  background:
    linear-gradient(90deg, rgba(66, 48, 32, .034) 1px, transparent 1px) 0 0 / 32px 32px,
    linear-gradient(0deg, rgba(66, 48, 32, .03) 1px, transparent 1px) 0 0 / 32px 32px,
    var(--ld-wall) !important;
}

body.is-sendback-page .sendback-head h2 {
  text-shadow: 0 1px 0 rgba(255, 253, 248, .58);
}

body.is-sendback-page .sendback-head::after {
  content: "01";
  position: absolute;
  top: -20px;
  right: 8px;
  z-index: -1;
  color: rgba(235, 126, 79, .15);
  font: 400 116px/.8 var(--ld-display);
  letter-spacing: -.08em;
}

body.is-sendback-page .sendback-head {
  position: relative;
  isolation: isolate;
}

body.is-sendback-page .sendback-stepper {
  padding: 9px 0 18px !important;
}

body.is-sendback-page .sendback-stepper::before {
  content: "";
  position: absolute;
  top: 26px;
  right: 17px;
  left: 17px;
  z-index: -1;
  height: 1px;
  background: rgba(23, 32, 25, .18);
}

body.is-sendback-page .sendback-step-dot i {
  border-radius: 2px !important;
  box-shadow: 0 0 0 7px rgba(231, 221, 207, .94);
}

body.is-sendback-page .sendback-step-dot.is-active i {
  border-color: var(--ld-orange) !important;
  background: var(--ld-orange) !important;
  box-shadow: 0 8px 20px rgba(164, 78, 41, .2), 0 0 0 7px rgba(231, 221, 207, .96);
}

body.is-sendback-page .sendback-form {
  border-top-color: var(--ld-orange) !important;
}

body.is-sendback-page .sendback-live-preview {
  isolation: isolate;
}

body.is-sendback-page .sendback-live-preview::before {
  content: "";
  position: absolute;
  top: 17%;
  right: 3%;
  bottom: 5%;
  left: 10%;
  z-index: -1;
  border-radius: 50%;
  background: rgba(255, 249, 238, .7);
  filter: blur(34px);
  transform: rotate(-4deg);
}

body.is-sendback-page .sendback-live-preview .postcard-shell.sendback-live-shell {
  filter: drop-shadow(0 32px 30px rgba(65, 49, 34, .2));
  transform: rotate(-.65deg) translateY(5px);
  transform-origin: 52% 56%;
  transition: transform 420ms var(--ld-ease), filter 420ms ease;
}

body.is-sendback-page .sendback-live-preview:hover .postcard-shell.sendback-live-shell {
  filter: drop-shadow(0 40px 38px rgba(65, 49, 34, .23));
  transform: rotate(0deg) translateY(0);
}

body.is-sendback-page .sendback-account-alert {
  border-left: 3px solid var(--ld-orange) !important;
  background: rgba(255, 249, 238, .56) !important;
}

body.is-sendback-page .sendback-head::before,
body.is-sendback-page .sendback-step-guide strong,
body:has(#openForm) label,
body:has(#codeForm) .field span,
body:has(.legal-nav):has(.contents) .eyebrow,
body:has(.legal-nav):has(.contents) .summary strong {
  color: var(--ld-clay) !important;
}

body:has(.legal-nav):has(.contents) .contents a,
body:has(.legal-nav):has(.contents) .legal-nav a {
  color: var(--ld-blue) !important;
}

@media (max-width: 900px) {
  body.is-sendback-page {
    background:
      linear-gradient(90deg, rgba(66, 48, 32, .03) 1px, transparent 1px) 0 0 / 28px 28px,
      linear-gradient(0deg, rgba(66, 48, 32, .026) 1px, transparent 1px) 0 0 / 28px 28px,
      var(--ld-wall) !important;
  }

  body.is-sendback-page .sendback-live-preview .postcard-shell.sendback-live-shell,
  body.is-sendback-page .sendback-live-preview:hover .postcard-shell.sendback-live-shell {
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
}

/* Public landing-page system — shared visual source of truth. */
body.is-sendback-page,
body:has(#openForm),
body:has(#codeForm),
body:has(.sent-postcard-view),
body:has(.legal-nav):has(.contents) {
  color: var(--ld-ink) !important;
  font-family: var(--ld-sans) !important;
  background:
    radial-gradient(circle at 86% 16%, rgba(214, 173, 118, .16), transparent 22rem),
    radial-gradient(circle at 18% 78%, rgba(217, 121, 71, .05), transparent 24rem),
    linear-gradient(145deg, #fffbf2 0%, #fbf3e8 58%, #f3e5d4 100%) !important;
}

body.is-sendback-page::before,
body:has(#openForm)::before,
body:has(#codeForm)::before,
body:has(.sent-postcard-view)::before,
body:has(.legal-nav):has(.contents)::before {
  opacity: .2 !important;
  background-image: radial-gradient(rgba(83, 64, 45, .16) .65px, transparent .65px) !important;
  background-size: 18px 18px !important;
  mix-blend-mode: normal !important;
  mask-image: linear-gradient(to bottom, black, transparent 88%);
}

body.is-sendback-page main {
  width: min(1440px, 100%) !important;
  padding: 16px clamp(22px, 3vw, 48px) 64px !important;
}

body.is-sendback-page .sendback-page-top {
  width: min(1320px, 100%) !important;
  margin-bottom: 34px !important;
  border-bottom-color: rgba(20, 35, 27, .1) !important;
}

body.is-sendback-page .sendback-page-back,
body.is-sendback-page .sendback-page-nav a,
body.is-sendback-page .sendback-page-nav button {
  border-color: rgba(20, 35, 27, .1) !important;
  border-radius: 999px !important;
  background: rgba(255, 249, 238, .72) !important;
  box-shadow: 0 10px 30px rgba(65, 49, 34, .05) !important;
}

body.is-sendback-page .web-sendback-flow {
  width: min(1320px, 100%) !important;
  grid-template-columns: minmax(350px, 430px) minmax(0, 1fr) !important;
  grid-template-areas:
    "head head"
    "progress preview"
    "form preview" !important;
  gap: 18px 38px !important;
}

body.is-sendback-page .sendback-head {
  justify-items: center !important;
  padding: 30px 0 34px;
  text-align: center !important;
}

body.is-sendback-page .sendback-head::before {
  color: var(--ld-orange) !important;
  letter-spacing: .16em;
}

body.is-sendback-page .sendback-head::after {
  display: none !important;
}

body.is-sendback-page .sendback-head h2 {
  font: 400 clamp(60px, 6.7vw, 94px)/.9 var(--ld-display) !important;
  letter-spacing: -.058em !important;
  white-space: nowrap;
  text-shadow: none !important;
}

body.is-sendback-page .sendback-creation-progress {
  border: 1px solid rgba(20, 35, 27, .1) !important;
  border-radius: 24px !important;
  background: rgba(255, 249, 238, .64) !important;
  box-shadow: 0 16px 40px rgba(65, 49, 34, .06) !important;
}

body.is-sendback-page .sendback-stepper {
  padding: 11px 12px 16px !important;
  border: 0 !important;
}

body.is-sendback-page .sendback-stepper::before {
  background: rgba(20, 35, 27, .1) !important;
}

body.is-sendback-page .sendback-step-dot i {
  border-radius: 50% !important;
  background: #fffaf1 !important;
  box-shadow: 0 0 0 7px rgba(255, 249, 238, .94) !important;
}

body.is-sendback-page .sendback-step-dot.is-active i {
  border-color: var(--ld-orange) !important;
  background: var(--ld-orange) !important;
  color: var(--ld-paper) !important;
  box-shadow: 0 8px 20px rgba(164, 78, 41, .2), 0 0 0 7px rgba(255, 249, 238, .96) !important;
}

body.is-sendback-page .sendback-form {
  padding: 24px !important;
  border: 1px solid rgba(20, 35, 27, .1) !important;
  border-radius: 28px !important;
  background: rgba(255, 249, 238, .66) !important;
  box-shadow: 0 20px 52px rgba(65, 49, 34, .07) !important;
}

body.is-sendback-page .sendback-step,
body.is-sendback-page .sendback-photo-moment {
  border-color: rgba(20, 35, 27, .1) !important;
}

body.is-sendback-page .web-sendback-flow input,
body.is-sendback-page .web-sendback-flow textarea,
body.is-sendback-page .web-sendback-flow select {
  min-height: 52px;
  border: 1px solid rgba(20, 35, 27, .12) !important;
  border-radius: 16px !important;
  background: rgba(255, 253, 248, .82) !important;
}

body.is-sendback-page .sendback-live-preview {
  grid-column: 2 !important;
  grid-row: 2 / span 2 !important;
  padding: 18px !important;
  border: 1px solid rgba(20, 35, 27, .08) !important;
  border-radius: 30px !important;
  background: rgba(255, 249, 238, .36) !important;
  box-shadow: 0 24px 70px rgba(65, 49, 34, .06) !important;
}

body.is-sendback-page .sendback-live-preview::before {
  border-radius: 50% !important;
  background: rgba(255, 249, 238, .68) !important;
}

body.is-sendback-page .sendback-live-preview .postcard-shell.sendback-live-shell,
body.is-sendback-page .sendback-live-preview:hover .postcard-shell.sendback-live-shell {
  filter: drop-shadow(0 28px 28px rgba(65, 49, 34, .17));
  transform: none;
}

body.is-sendback-page button,
body.is-sendback-page .button,
body.is-sendback-page input[type="submit"],
body:has(#openForm) button,
body:has(#codeForm) .button {
  border-color: var(--ld-orange) !important;
  border-radius: 999px !important;
  background: var(--ld-orange) !important;
  color: var(--ld-paper) !important;
}

body.is-sendback-page button[disabled] {
  border-color: rgba(20, 35, 27, .08) !important;
  background: rgba(20, 35, 27, .2) !important;
  color: rgba(255, 249, 238, .9) !important;
}

body.is-sendback-page .sendback-preview-controls,
body.is-sendback-page .sendback-preview-controls button,
body.is-sendback-page .sendback-design-toggle,
body.is-sendback-page .sendback-design-toggle button {
  border-radius: 999px !important;
}

body.is-sendback-page .sendback-account-alert {
  border: 1px solid rgba(235, 126, 79, .2) !important;
  border-radius: 18px !important;
  background: rgba(255, 249, 238, .68) !important;
}

body:has(#openForm) > main > section,
body:has(#codeForm) .notice,
body:has(#codeForm) .actions,
body:has(.legal-nav):has(.contents) article,
.sent-detail-hero,
.sent-page-nav {
  border: 1px solid rgba(20, 35, 27, .1) !important;
  border-radius: 28px !important;
  background: rgba(255, 249, 238, .68) !important;
  color: var(--ld-ink) !important;
  box-shadow: 0 24px 64px rgba(65, 49, 34, .08) !important;
}

@media (max-width: 900px) {
  body.is-sendback-page .web-sendback-flow {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas: "head" "progress" "form" "preview" !important;
  }

  body.is-sendback-page .sendback-head {
    padding: 18px 0 22px;
  }

  body.is-sendback-page .sendback-live-preview {
    grid-column: 1 !important;
    grid-row: auto !important;
  }

  body.is-sendback-page .sendback-head h2 {
    font-size: clamp(52px, 14vw, 72px) !important;
    white-space: normal;
  }
}

body.is-sendback-page .live-postcard-tabs button,
body.is-sendback-page .sendback-look-button,
body.is-sendback-page .sendback-section-reset,
body.is-sendback-page .sendback-step-button.secondary {
  border-color: rgba(20, 35, 27, .12) !important;
  border-radius: 999px !important;
  background: rgba(255, 249, 238, .82) !important;
  color: var(--ld-ink) !important;
}

body.is-sendback-page .live-postcard-tabs button.is-active {
  border-color: var(--ld-ink) !important;
  background: var(--ld-ink) !important;
  color: var(--ld-paper) !important;
}

body.is-sendback-page .sendback-step-button.primary:not([disabled]) {
  border-color: var(--ld-orange) !important;
  background: var(--ld-orange) !important;
  color: var(--ld-paper) !important;
}

/* Keep the postcard flow inside very narrow phone viewports. */
@media (max-width: 420px) {
  body.is-sendback-page .sendback-form {
    min-width: 0;
    padding: 18px !important;
    border-radius: 22px !important;
  }

  body.is-sendback-page .sendback-form > *,
  body.is-sendback-page .sendback-stepper,
  body.is-sendback-page .sendback-step-guide,
  body.is-sendback-page .sendback-step,
  body.is-sendback-page .sendback-step-actions {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  body.is-sendback-page .sendback-stepper {
    grid-template-columns: repeat(7, minmax(50px, 1fr));
  }

  body.is-sendback-page.is-sendback-reply-page .sendback-stepper {
    grid-template-columns: repeat(6, minmax(50px, 1fr));
  }
}