/* =====================================================================
   Lapriland landing — "Lamplight"
   A lamp on a desk at night: deep warm ink, one amber glow, editorial serif
   display type, monospace dates, film grain, the product glowing in the dark.
   Scoped to body.lp-dark so the light doc pages are untouched.
   ===================================================================== */
body.lp-dark {
  --lp-ink-0: #0f0b09; --lp-ink-1: #15100e; --lp-ink-2: #1d1613; --lp-ink-3: #2a211c;
  --lp-line: rgba(255, 232, 200, .10); --lp-line-2: rgba(255, 232, 200, .18);
  --lp-text: #f3ece2; --lp-text-2: #cbbfb1; --lp-muted: #8f8377; --lp-faint: #6b6158;
  --lp-amber: #f2a93b; --lp-amber-2: #ffcf7a; --lp-amber-deep: #c8781c; --lp-rose: #ff7a90; --lp-sky: #7cc4ff;
  --lp-paper: #f4ead9; --lp-paper-ink: #2a211c;
  --lp-serif: 'Literata', Georgia, 'Times New Roman', serif;
  --lp-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --lp-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --lp-container: 1120px; --lp-pad: clamp(20px, 5vw, 48px); --lp-gap: clamp(88px, 12vw, 160px);
  --lp-fill: #f2a93b; --lp-fill-hi: #ffcf7a; /* amber behind dark text: bright in both themes */
  --lp-shadow-c: #000; /* every shadow is this colour at some strength */
  --accent: var(--lp-amber); /* the shared wordmark SVG reads this */
  background: var(--lp-ink-0); color: var(--lp-text); font-family: var(--lp-sans);
  -webkit-font-smoothing: antialiased;
}
/* film grain over everything, never in the way. A small bitmap tile on its own
   GPU layer with normal blending. It used to be an SVG noise filter blended over
   the page ("overlay"), which made Safari repaint the whole screen on every
   scroll, so text went dark until it caught up (reported on /pricing). */
body.lp-dark::before {
  content: ""; position: fixed; inset: 0; z-index: 9999; pointer-events: none;
  background: url("/img/grain.png") repeat 0 0 / 128px 128px; opacity: .22;
  transform: translateZ(0); will-change: transform;
}
body.lp-dark ::selection { background: rgba(242,169,59,.35); color: #fff; }

/* ---- shared chrome re-lit ------------------------------------------------ */
body.lp-dark .mkt-nav { position: sticky; top: 0; z-index: 50; background: rgba(15,11,9,.72); backdrop-filter: blur(14px) saturate(120%); -webkit-backdrop-filter: blur(14px) saturate(120%); border-bottom: 1px solid var(--lp-line); box-shadow: none; }
body.lp-dark .mkt-nav__links a, body.lp-dark .mkt-nav__signin { color: var(--lp-text-2); }
body.lp-dark .mkt-nav__links a:hover, body.lp-dark .mkt-nav__signin:hover { color: var(--lp-amber-2); }
body.lp-dark .mkt-wordmark__text { font-family: var(--lp-serif); font-style: italic; font-weight: 500; letter-spacing: 0; color: var(--lp-amber-2); font-size: 1.25rem; }
body.lp-dark .mkt-btn--primary { background: var(--lp-fill); color: #1a1208; box-shadow: 0 8px 24px -8px rgba(242,169,59,.55), inset 0 1px 0 rgba(255,255,255,.35); }
body.lp-dark .mkt-btn--primary:hover { background: var(--lp-fill-hi); color: #1a1208; }
body.lp-dark .mkt-btn--secondary { background: transparent; color: var(--lp-text); border-color: var(--lp-line-2); box-shadow: none; }
body.lp-dark .mkt-btn--secondary:hover { color: var(--lp-amber-2); border-color: rgba(242,169,59,.5); }
body.lp-dark .mkt-footer { background: #0b0807; border-top: 1px solid var(--lp-line); }
body.lp-dark .mkt-footer__h { font: 500 .7rem/1 var(--lp-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--lp-muted); margin-bottom: 16px; }
body.lp-dark .mkt-nav__links a[aria-current="page"] { color: var(--lp-amber-2); }
body.lp-dark .mkt-footer__col a, body.lp-dark .mkt-footer__contact a { color: var(--lp-text-2); }
body.lp-dark .mkt-footer__col a:hover, body.lp-dark .mkt-footer__contact a:hover { color: var(--lp-amber-2); }
body.lp-dark .mkt-footer__tag, body.lp-dark .mkt-footer__contact { color: var(--lp-muted); }
body.lp-dark .mkt-footer__rule { border-color: var(--lp-line); }
body.lp-dark .mkt-footer__rule p { color: var(--lp-faint); }

/* ---- nav: language menu and theme switch ---------------------------------- */
body.lp-dark .mkt-ico { display: block; width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.mkt-lang { position: relative; }
.mkt-lang summary {
  list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 11px;
  border: 1px solid var(--lp-line-2); border-radius: 999px; color: var(--lp-text-2); font: 500 .8rem/1 var(--lp-sans); letter-spacing: .02em;
  transition: color .2s, border-color .2s;
}
.mkt-lang summary::-webkit-details-marker { display: none; }
.mkt-lang summary:hover, .mkt-lang[open] summary { color: var(--lp-text); border-color: color-mix(in srgb, var(--lp-amber) 55%, transparent); }
body.lp-dark .mkt-lang__menu {
  position: absolute; right: 0; top: calc(100% + 8px); z-index: 60; min-width: 190px; margin: 0; padding: 6px; list-style: none;
  border: 1px solid var(--lp-line-2); border-radius: 14px; background: var(--lp-ink-2);
  box-shadow: 0 24px 60px -24px color-mix(in srgb, var(--lp-shadow-c) 80%, transparent);
}
body.lp-dark .mkt-lang__menu a { display: block; padding: 9px 12px; border-radius: 9px; color: var(--lp-text-2); font-size: .92rem; }
body.lp-dark .mkt-lang__menu a:hover { background: color-mix(in srgb, var(--lp-amber) 10%, transparent); color: var(--lp-text); }
body.lp-dark .mkt-lang__menu a[aria-current="true"] { color: var(--lp-amber-2); font-weight: 600; }
.mkt-theme {
  cursor: pointer; display: inline-grid; place-items: center; width: 36px; height: 36px; padding: 0;
  border: 1px solid var(--lp-line-2); border-radius: 50%; background: transparent; color: var(--lp-text-2); transition: color .2s, border-color .2s;
}
.mkt-theme[hidden] { display: none; }
.mkt-theme:hover { color: var(--lp-amber-2); border-color: color-mix(in srgb, var(--lp-amber) 55%, transparent); }
html[data-theme="light"] .mkt-theme__sun, html[data-theme="dark"] .mkt-theme__moon { display: none; }
@media (max-width: 640px) {
  .mkt-lang__now { display: none; }
  .mkt-lang summary { padding: 0 9px; }
}
@media (max-width: 400px) {
  .mkt-lang summary, .mkt-theme { width: 32px; height: 32px; padding: 0; justify-content: center; }
}

.mkt-cta-short { display: none; }
@media (max-width: 560px) {
  /* phones: one call to action; "Sign in" moves under the hero buttons */
  body.lp-dark .mkt-nav__signin { display: none; }
  .mkt-cta-long { display: none; }
  .mkt-cta-short { display: inline; }
  body.lp-dark .mkt-nav__cta .mkt-btn { padding: 9px 14px; font-size: .84rem; white-space: nowrap; }
  body.lp-dark .mkt-nav__cta { gap: 8px; }
  /* long labels in some languages wrap instead of widening the page */
  .lp-btn { white-space: normal; text-align: center; line-height: 1.3; }
}
/* buttons inside cards may wrap in any language */
.hm-plan .lp-btn { white-space: normal; text-align: center; line-height: 1.3; }

/* a short cross-fade while the theme switches (site.js adds the class) */
html.lp-theme-anim body.lp-dark, html.lp-theme-anim body.lp-dark * {
  transition: background-color .35s ease, color .35s ease, border-color .35s ease, fill .35s ease, stroke .35s ease !important;
}
@media (prefers-reduced-motion: reduce) {
  html.lp-theme-anim body.lp-dark, html.lp-theme-anim body.lp-dark * { transition: none !important; }
}

/* ---- languages -------------------------------------------------------------- */
/* Chinese: the page's Latin faces first, then Chinese ones; no synthetic italics
   (Chinese has none) and no tightened tracking on headings. */
html[lang^="zh"] body.lp-dark {
  --lp-serif: 'Literata', 'Noto Serif SC', 'Songti SC', 'STSong', serif;
  --lp-sans: 'Inter', 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', sans-serif;
}
html[lang^="zh"] body.lp-dark :is(em, i, .hm-note__said, .hm-beat__quote, .hm-paper__q, .hm-mini-quote, .hm-final__prompts a, .hm-payoff) { font-style: normal; }
html[lang^="zh"] body.lp-dark :is(.lp-h1, .lp-h2, .hm-payoff, .hm-panel__h, .hm-plan__price) { letter-spacing: 0; }
html[lang^="zh"] body.lp-dark .lp-h1 { line-height: 1.14; }
html[lang^="zh"] body.lp-dark .lp-h2 { line-height: 1.22; }
html[lang^="zh"] .lp-kicker { letter-spacing: .08em; }
/* Long German, French, Spanish and Malay words: headings may hyphenate rather
   than overflow a phone; running text only wraps. */
html:is([lang="de"], [lang="fr"], [lang="ms"], [lang="es"]) body.lp-dark :is(h1, h2, h3) { hyphens: auto; overflow-wrap: break-word; }
html:is([lang="de"], [lang="fr"], [lang="ms"], [lang="es"]) body.lp-dark :is(p, li, summary) { overflow-wrap: break-word; }
.mkt-footer__note { display: block; margin-top: 6px; }

/* ---- primitives ------------------------------------------------------------ */
.lp-wrap { max-width: var(--lp-container); margin: 0 auto; padding: 0 var(--lp-pad); }
.lp-section { margin-top: var(--lp-gap); }
.lp-kicker { display: inline-flex; align-items: center; gap: 10px; font-family: var(--lp-mono); font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; color: var(--lp-amber); margin-bottom: 18px; }
.lp-kicker i { width: 6px; height: 6px; border-radius: 50%; background: var(--lp-amber); box-shadow: 0 0 0 0 rgba(242,169,59,.55); animation: lp-ping 2.6s ease-out infinite; }
.lp-h1 { font-family: var(--lp-serif); font-weight: 400; font-size: clamp(2.8rem, 2rem + 3.8vw, 5.25rem); line-height: 1.0; letter-spacing: -.022em; color: var(--lp-text); margin: 0 0 24px; max-width: 12ch; text-wrap: balance; }
.lp-h2 { font-family: var(--lp-serif); font-weight: 400; font-size: clamp(2rem, 1.5rem + 2.3vw, 3.5rem); line-height: 1.06; letter-spacing: -.02em; color: var(--lp-text); margin: 0 0 18px; max-width: 22ch; text-wrap: balance; }
.lp-h1 em, .lp-h2 em { font-style: italic; color: var(--lp-amber-2); }
.lp-lead { font-size: clamp(1.05rem, 1rem + .35vw, 1.25rem); line-height: 1.65; color: var(--lp-text-2); max-width: 56ch; margin: 0 0 44px; }
.lp-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 15px 28px; border-radius: 999px; font: 600 .95rem/1 var(--lp-sans); text-decoration: none; border: 1px solid transparent; transition: transform .18s ease, background-color .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease; white-space: nowrap; }
.lp-btn--amber { background: var(--lp-fill); color: #1a1208; box-shadow: 0 12px 34px -12px rgba(242,169,59,.7), inset 0 1px 0 rgba(255,255,255,.35); }
.lp-btn--amber:hover { background: var(--lp-fill-hi); transform: translateY(-1px); box-shadow: 0 16px 40px -12px rgba(242,169,59,.8), inset 0 1px 0 rgba(255,255,255,.4); }
.lp-btn--ghost { color: var(--lp-text); border-color: var(--lp-line-2); }
.lp-btn--ghost:hover { color: var(--lp-amber-2); border-color: rgba(242,169,59,.55); transform: translateY(-1px); }
.lp-micro { margin: 18px 0 0; font-size: .85rem; color: var(--lp-muted); }
.lp-micro b { color: var(--lp-text-2); font-weight: 600; }
.lp-mono { font-family: var(--lp-mono); }

/* ---- primitives: display type and rhythm ------------------------------------
   The shared .mkt h1/h2/h3 rule (Inter, navy, bold) and the .mkt p margin reset
   outrank plain class selectors, so these are asserted under body.lp-dark. */
body.lp-dark .lp-h1, body.lp-dark .lp-h2 { font-family: var(--lp-serif); color: var(--lp-text); text-wrap: balance; }
body.lp-dark .lp-h1 { font-weight: 400; line-height: 1.0; letter-spacing: -.022em; margin: 0 0 30px; }
body.lp-dark .lp-h2 { font-weight: 400; line-height: 1.06; letter-spacing: -.02em; margin: 0 0 20px; }
body.lp-dark .lp-h1 em, body.lp-dark .lp-h2 em { color: var(--lp-amber-2); font-style: italic; }
body.lp-dark .lp-lead { margin: 0 0 48px; }
body.lp-dark .lp-micro { margin: 20px 0 0; }
body.lp-dark strong { color: inherit; }

@keyframes lp-breathe { 0%, 100% { opacity: .85; } 50% { opacity: 1; } }
@keyframes lp-ping { 0% { box-shadow: 0 0 0 0 rgba(242,169,59,.55); } 70% { box-shadow: 0 0 0 10px rgba(242,169,59,0); } 100% { box-shadow: 0 0 0 0 rgba(242,169,59,0); } }
@media (prefers-reduced-motion: reduce) {
  .lp-kicker i { animation: none !important; }
}

/* =====================================================================
   Shared marketing kit (the landing, pricing and doc pages). Scoped under
   .hm, the class on each page's <main>, because the shared .mkt rules in
   marketing.css (h1/h2/h3, p, ul, figure, svg) outrank bare classes.
   Landing-only sections live in home.css, pricing in pricing.css, the
   about and legal layouts in doc.css.
   ===================================================================== */
.hm {
  --hm-moss: #93c47d; --hm-ember: #ff8f6b; --hm-radius: 22px;
  --hm-ease: cubic-bezier(.2, .7, .2, 1);
  overflow-x: clip;
}
.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.hm .icon {
  display: inline-block; flex: none; width: 1.1em; height: 1.1em; vertical-align: -0.18em;
  fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round;
}
.hm .lp-btn .icon { width: 18px; height: 18px; }
.hm-vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.hm-mono { font-family: var(--lp-mono); }
.hm b { font-weight: 600; color: var(--lp-text); }
.hm-cta { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }

/* ---- section heads ---------------------------------------------------- */
.hm-head { margin-bottom: clamp(36px, 5vw, 60px); }
.hm-head--center { display: flex; flex-direction: column; align-items: center; text-align: center; }
.hm-head--center .lp-h2, .hm-head--center .lp-lead { margin-left: auto; margin-right: auto; }
body.lp-dark .hm-head .lp-lead { margin-bottom: 0; }
body.lp-dark .hm-head .lp-h2 { max-width: 20ch; }
.hm-pill { padding: 8px 15px; border: 1px solid var(--lp-line-2); border-radius: 999px; background: rgba(255,232,200,.03); }

/* plan cards */
.hm-plans { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; align-items: stretch; padding-top: 12px; }
.hm-plan { position: relative; display: flex; flex-direction: column; padding: 30px 28px; border: 1px solid var(--lp-line); border-radius: 24px; background: linear-gradient(180deg, var(--lp-ink-2), var(--lp-ink-1)); }
.hm-plan--pro {
  border-color: transparent; transform: translateY(-12px);
  background: linear-gradient(var(--lp-ink-1), var(--lp-ink-1)) padding-box, linear-gradient(140deg, var(--lp-amber), var(--lp-rose) 62%, var(--lp-amber-2)) border-box;
  box-shadow: 0 40px 90px -40px rgba(242,169,59,.5);
}
.hm-plan__name { font: 500 .74rem/1 var(--lp-mono); letter-spacing: .18em; text-transform: uppercase; color: var(--lp-muted); }
.hm-plan--pro .hm-plan__name { color: var(--lp-amber); }
.hm-plan__badge { position: absolute; top: -13px; right: 22px; padding: 6px 12px; border-radius: 999px; background: var(--lp-fill); color: #1a1208; font: 600 .72rem/1 var(--lp-sans); }
.hm-plan__price { margin-top: 16px; font: 400 2.9rem/1 var(--lp-serif); letter-spacing: -.02em; color: var(--lp-text); }
.hm-plan__price small { font: 400 .95rem/1 var(--lp-sans); letter-spacing: 0; color: var(--lp-muted); }
.hm .hm-plan__alt { min-height: 2.9em; margin: 10px 0 0; font-size: .92rem; line-height: 1.5; color: var(--lp-text-2); }
.hm-save { display: inline-block; margin-left: 4px; padding: 3px 8px; border-radius: 6px; background: rgba(242,169,59,.14); color: var(--lp-amber-2); font-size: .76rem; font-weight: 600; white-space: nowrap; }
.hm .hm-plan ul { display: grid; gap: 11px; margin: 22px 0 30px; }
.hm-plan li { position: relative; padding-left: 26px; font-size: .95rem; line-height: 1.5; color: var(--lp-text-2); }
.hm-plan li::before { content: ""; position: absolute; left: 2px; top: .42em; width: 11px; height: 6px; border-left: 2px solid var(--lp-amber); border-bottom: 2px solid var(--lp-amber); transform: rotate(-45deg); }
.hm-plan .lp-btn { width: 100%; margin-top: auto; }

/* ---- faq ---------------------------------------------------------------------------- */
.hm-faq { scroll-margin-top: 80px; }
.hm-faq__list { max-width: 820px; margin: 0 auto; border-top: 1px solid var(--lp-line); }
.hm-faq details { border-bottom: 1px solid var(--lp-line); }
.hm-faq summary { cursor: pointer; list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 22px 4px; font: 400 1.26rem/1.35 var(--lp-serif); color: var(--lp-text); transition: color .2s; }
.hm-faq summary:hover { color: var(--lp-amber-2); }
.hm-faq summary::-webkit-details-marker { display: none; }
.hm-faq summary::after { content: ""; flex: none; width: 10px; height: 10px; border-right: 1.5px solid var(--lp-amber); border-bottom: 1.5px solid var(--lp-amber); transform: translateY(-3px) rotate(45deg); transition: transform .25s ease; }
.hm-faq details[open] summary::after { transform: translateY(2px) rotate(-135deg); }
.hm .hm-faq details p { max-width: 70ch; padding: 0 4px 24px; line-height: 1.72; color: var(--lp-text-2); }
.hm-faq details a { color: var(--lp-amber-2); border-bottom: 1px solid rgba(255,207,122,.35); }
.hm-faq details a:hover { border-bottom-color: var(--lp-amber-2); }

/* ---- final ---------------------------------------------------------------------------- */
.hm-final { position: relative; overflow: hidden; margin-top: var(--lp-gap); padding: clamp(84px, 10vw, 150px) 0 clamp(72px, 8vw, 112px); border-top: 1px solid var(--lp-line); text-align: center; }
.hm-final__lamp { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(46% 62% at 50% 0%, rgba(242,169,59,.30), transparent 70%); animation: lp-breathe 9s ease-in-out infinite; }
.hm-final__inner { position: relative; }
body.lp-dark .hm-final .lp-h2 { margin: 0 auto 16px; }
.hm .hm-final p { max-width: 52ch; margin: 0 auto 30px; font-size: 1.1rem; line-height: 1.6; color: var(--lp-text-2); }
.hm .hm-final p.lp-micro { margin: 22px auto 0; font-size: .85rem; color: var(--lp-muted); }
.hm-final__prompts { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 0 auto 36px; max-width: 980px; }
.hm-final__prompts a { display: inline-flex; align-items: center; gap: 9px; padding: 13px 18px; border: 1px solid var(--lp-line-2); border-radius: 14px; background: rgba(255,232,200,.03); color: var(--lp-text); font: italic 400 1.04rem/1.2 var(--lp-serif); transition: border-color .2s, color .2s, transform .2s; }
.hm-final__prompts a:hover { border-color: rgba(242,169,59,.55); color: var(--lp-amber-2); transform: translateY(-2px); }
.hm-final__prompts .icon { width: 16px; height: 16px; color: var(--lp-amber); }
.hm-cta--center { justify-content: center; }

@media (max-width: 980px) {
  .hm-plans { grid-template-columns: minmax(0, 1fr); max-width: 520px; margin: 0 auto; }
  .hm-plan--pro { transform: none; order: -1; }
}
@media (max-width: 560px) {
  .hm-plan { padding: 26px 22px; }
  .hm-faq summary { font-size: 1.14rem; }
}
@media (prefers-reduced-motion: reduce) {
  .hm-final__lamp { animation: none !important; }
  .hm-final__prompts a { transition: none; }
}

/* =====================================================================
   Site-wide Lamplight: re-map the shared .mkt tokens so every doc page
   (pricing, about, legal) re-themes through the same variables, then patch
   the handful of components that hard-code white.
   ===================================================================== */
body.lp-dark {
  --mkt-primary: var(--lp-amber); --mkt-primary-hover: var(--lp-amber-2); --mkt-primary-press: var(--lp-amber-deep);
  --mkt-primary-tint: rgba(242,169,59,.10); --mkt-primary-border: rgba(242,169,59,.35);
  --mkt-ink: var(--lp-text); --mkt-ink-2: var(--lp-text); --mkt-slate: var(--lp-text-2); --mkt-muted: var(--lp-muted); --mkt-faint: var(--lp-faint);
  --mkt-hairline: var(--lp-line); --mkt-border: var(--lp-line); --mkt-border-strong: var(--lp-line-2);
  --mkt-bg: var(--lp-ink-0); --mkt-bg-tint: var(--lp-ink-1); --mkt-bg-tint-2: var(--lp-ink-2);
  --mkt-success: #3ecf8e; --mkt-success-soft: #3ecf8e;
  --mkt-warn-ink: var(--lp-amber-2); --mkt-warn-bg: rgba(242,169,59,.09); --mkt-warn-border: rgba(242,169,59,.35);
  --mkt-shadow-sm: 0 1px 2px color-mix(in srgb, var(--lp-shadow-c) 50%, transparent); --mkt-shadow: 0 8px 24px -12px color-mix(in srgb, var(--lp-shadow-c) 80%, transparent);
  --mkt-shadow-md: 0 20px 40px -20px color-mix(in srgb, var(--lp-shadow-c) 90%, transparent); --mkt-shadow-lg: 0 40px 80px -30px color-mix(in srgb, var(--lp-shadow-c) 95%, transparent);
  --mkt-shadow-primary: 0 10px 30px -10px rgba(242,169,59,.6); --mkt-shadow-primary-hover: 0 14px 36px -10px rgba(242,169,59,.75);
  --mkt-gradient: linear-gradient(105deg, #c8781c, #f2a93b 45%, #ff7a90 100%);
  --mkt-gradient-soft: linear-gradient(160deg, rgba(242,169,59,.10), transparent 60%);
}
/* the contents list on the legal pages (doc.css refines it) */
body.lp-dark .mkt-toc { background: linear-gradient(180deg, var(--lp-ink-2), var(--lp-ink-1)); border-color: var(--lp-line); box-shadow: var(--mkt-shadow-md); }
body.lp-dark .mkt-btn--primary { color: #1a1208; }
body.lp-dark .mkt-legal code, body.lp-dark .mkt-draft code, body.lp-dark .mkt-doc__meta code { background: rgba(242,169,59,.09); border-color: rgba(242,169,59,.3); color: var(--lp-amber-2); }
body.lp-dark .mkt-draft { background: rgba(242,169,59,.07); border-color: rgba(242,169,59,.3); color: var(--lp-text-2); }
body.lp-dark .mkt-draft strong { color: var(--lp-amber-2); }
/* editorial type on the doc pages */
body.lp-dark .mkt-doc__h1, body.lp-dark .mkt-section-h, body.lp-dark .mkt-h3, body.lp-dark .mkt-faq__q, body.lp-dark .mkt-legal h2, body.lp-dark .mkt-prose h2 {
  font-family: var(--lp-serif); font-weight: 400; color: var(--lp-text); letter-spacing: -.015em;
}
body.lp-dark .mkt-doc__h1 { font-size: clamp(2.2rem, 1.6rem + 2.4vw, 3.6rem); line-height: 1.06; }
body.lp-dark .mkt-section-h { font-size: clamp(1.7rem, 1.3rem + 1.6vw, 2.5rem); }
body.lp-dark .mkt-legal h2, body.lp-dark .mkt-prose h2 { font-size: 1.6rem; margin-top: 2.2em; }
body.lp-dark .mkt-h3, body.lp-dark .mkt-faq__q { font-weight: 500; font-size: 1.3rem; }
body.lp-dark .mkt-legal h3, body.lp-dark .mkt-prose h3 { color: var(--lp-text); }
body.lp-dark .mkt-doc__lead, body.lp-dark .mkt-legal p, body.lp-dark .mkt-legal li, body.lp-dark .mkt-prose p, body.lp-dark .mkt-prose li, body.lp-dark .mkt-price__notes p, body.lp-dark .mkt-faq__item p { color: var(--lp-text-2); }
body.lp-dark .mkt-legal strong, body.lp-dark .mkt-prose strong, body.lp-dark .mkt-faq__item strong { color: var(--lp-text); }
body.lp-dark .mkt-doc__meta { color: var(--lp-muted); }
body.lp-dark .mkt-legal a, body.lp-dark .mkt-prose a, body.lp-dark .mkt-faq__item a, body.lp-dark .mkt-doc__lead a, body.lp-dark .mkt-price__notes a, body.lp-dark .mkt-toc a { color: var(--lp-amber-2); }
/* the lamp glow at the top of every doc page: a plain background on the page
   itself (it was a 120vw pseudo-element pushed behind the page with z-index -1
   and a transform, another thing Safari repaints badly while scrolling) */
body.lp-dark .mkt-doc { background: radial-gradient(54vw 286px at 50% -40px, rgba(242,169,59,.16), transparent 65%) no-repeat; }
body.lp-dark .mkt-doc__h1 { margin: 0 0 22px; }
body.lp-dark .mkt-doc__head { margin-bottom: clamp(32px, 5vw, 56px); }

/* =====================================================================
   Light theme, the default: html[data-theme="light"]. The server sets the
   attribute from the lp_theme cookie (routes/marketing.js), and
   public/js/site.js switches it. Same warm paper palette as the app's Paper
   theme. Accent text is a deep amber so it stays readable on cream; amber
   fills behind dark text (--lp-fill) stay bright in both themes.
   ===================================================================== */
html[data-theme="light"] { color-scheme: light; }
html[data-theme="dark"] { color-scheme: dark; }
html[data-theme="light"] body.lp-dark {
  --lp-ink-0: #f7f2e8; --lp-ink-1: #fbf7f0; --lp-ink-2: #fefcf7; --lp-ink-3: #f0eadf;
  --lp-line: rgba(39,29,22,.10); --lp-line-2: rgba(39,29,22,.18);
  --lp-text: #271d16; --lp-text-2: #453b33; --lp-muted: #665b53; --lp-faint: #8e847b;
  --lp-amber: #a55a12; --lp-amber-2: #9e4c03; --lp-amber-deep: #8f410e; --lp-rose: #c2536b; --lp-sky: #3a80b7;
  --lp-paper: #fffaf1; --lp-paper-ink: #271d16;
  --lp-fill: #f2a93b; --lp-fill-hi: #f7b955;
  --lp-shadow-c: rgba(92,62,30,.26);
  --mkt-success: #2f8f5b;
}
html[data-theme="light"] .hm { --hm-moss: #4d8b50; --hm-ember: #b25e59; }
html[data-theme="light"] body.lp-dark::before { opacity: .14; }
html[data-theme="light"] body.lp-dark ::selection { background: rgba(242,169,59,.35); color: var(--lp-text); }
html[data-theme="light"] body.lp-dark .mkt-nav { background: rgba(247,242,232,.84); }
html[data-theme="light"] body.lp-dark .mkt-footer { background: #f0e9dd; }
html[data-theme="light"] .hm-pill { background: rgba(255,255,255,.6); }
html[data-theme="light"] .lp-btn--ghost { background: rgba(255,255,255,.55); }
html[data-theme="light"] .lp-btn--ghost:hover { background: #fff; }