/* lentu.css: tokens.css + components.css + pages.css + site.css (assets/css/src). Rebuild by concatenating in that order. */

/* Lentu Web: tokens as CSS custom properties. Source: the Lentu Web design system's tokens.json.
   Dusk is the default; dawn applies with data-theme="dawn", or when the device is light and no theme is set.
   "dark" and "light" are accepted as aliases, for pages embedded in hosts that set those values. */

:root, [data-theme="dusk"], [data-theme="dark"] {
  color-scheme: dark;
  --bg: #17152A;
  --bg-sunken: #131124;
  --surface-1: #221F37;
  --surface-2: #2C2843;
  --surface-plum: #3A2C47;
  --line: rgba(244, 236, 223, 0.10);
  --line-strong: rgba(244, 236, 223, 0.20);
  --text-primary: #F4ECDF;
  --text-secondary: #A9A2B8;
  --accent-fill: #F3DEC0;
  --accent-fill-hover: #F8E8D1;
  --accent-fill-active: #EAD3B2;
  --accent-on: #1F1B30;
  --accent-text: #F8C995;
  --focus-ring: var(--accent-text);
  --ring-track: rgba(244, 236, 223, 0.12);
  --ring-progress: var(--accent-text);
  --toggle-on: #E9A46C;
  --bar-glass: rgba(19, 17, 36, 0.90);
  --notice-fill: #29264A;
  --notice-line: #3F3A70;
  --notice-text: #D3CCF7;
  --notice-icon: #B3A8F0;
  --orb-core: #FFF7EA;
  --orb-body: #FEE4BF;
  --orb-glow: #F8C995;
  --orb-rim: #F2B07A;
  --orb-pool: rgba(250, 198, 140, 0.20);
  --block-lavender: #B8AAE6;
  --block-periwinkle: #9FB2F0;
  --block-sky: #8CC5E6;
  --block-teal: #86CBC2;
  --block-sage: #A9CDA3;
  --block-sand: #E3CFA0;
  --block-rose: #E8B1C8;
  --block-mauve: #CDA7DA;
  --lit-edge: inset 0 1px 0 rgba(248, 201, 149, 0.22), inset 0 0 0 1px rgba(255, 255, 255, 0.05);
  --lit-edge-active: inset 0 1px 0 rgba(248, 201, 149, 0.45), inset 0 0 0 1px rgba(248, 201, 149, 0.18);
  --lit-edge-top: inset 0 1px 0 rgba(248, 201, 149, 0.22);
}

[data-theme="dawn"], [data-theme="light"] {
  color-scheme: light;
  --bg: #F4EEE4;
  --bg-sunken: #ECE4D7;
  --surface-1: #FBF8F2;
  --surface-2: #FFFFFF;
  --surface-plum: #EDE3EC;
  --line: rgba(38, 34, 54, 0.10);
  --line-strong: rgba(38, 34, 54, 0.20);
  --text-primary: #262236;
  --text-secondary: #5C556D;
  --accent-fill: #2A2438;
  --accent-fill-hover: #3A3350;
  --accent-fill-active: #1F1A2B;
  --accent-on: #FBF8F2;
  --accent-text: #8F4E1C;
  --focus-ring: var(--accent-text);
  --ring-track: rgba(38, 34, 54, 0.12);
  --ring-progress: var(--accent-text);
  --toggle-on: #B5672D;
  --bar-glass: rgba(236, 228, 215, 0.90);
  --notice-fill: #E7E3F8;
  --notice-line: #CEC6F0;
  --notice-text: #3B3474;
  --notice-icon: #5A4FB0;
  --orb-core: #FFF3E0;
  --orb-body: #F9CF9B;
  --orb-glow: #F0AE72;
  --orb-rim: #E89A5E;
  --orb-pool: rgba(240, 174, 114, 0.22);
  --block-lavender: #6E5FB0;
  --block-periwinkle: #4E66B8;
  --block-sky: #2F7BA6;
  --block-teal: #2E7F77;
  --block-sage: #4C7B47;
  --block-sand: #86672A;
  --block-rose: #A44E78;
  --block-mauve: #87539D;
  --lit-edge: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 1px 2px rgba(38, 34, 54, 0.06), inset 0 0 0 1px rgba(38, 34, 54, 0.06);
  --lit-edge-active: inset 0 1px 0 rgba(255, 255, 255, 1), 0 2px 10px rgba(232, 154, 94, 0.18), inset 0 0 0 1px rgba(232, 154, 94, 0.35);
  --lit-edge-top: inset 0 1px 0 rgba(38, 34, 54, 0.08);
}

/* No script, light device: dawn. (The site's inline theme script normally sets data-theme before paint.) */
@media (prefers-color-scheme: light) {
  :root:not([data-theme]) {
    color-scheme: light;
    --bg: #F4EEE4; --bg-sunken: #ECE4D7; --surface-1: #FBF8F2; --surface-2: #FFFFFF; --surface-plum: #EDE3EC;
    --line: rgba(38, 34, 54, 0.10); --line-strong: rgba(38, 34, 54, 0.20);
    --text-primary: #262236; --text-secondary: #5C556D;
    --accent-fill: #2A2438; --accent-fill-hover: #3A3350; --accent-fill-active: #1F1A2B; --accent-on: #FBF8F2; --accent-text: #8F4E1C;
    --ring-track: rgba(38, 34, 54, 0.12); --toggle-on: #B5672D; --bar-glass: rgba(236, 228, 215, 0.90);
    --notice-fill: #E7E3F8; --notice-line: #CEC6F0; --notice-text: #3B3474; --notice-icon: #5A4FB0;
    --orb-core: #FFF3E0; --orb-body: #F9CF9B; --orb-glow: #F0AE72; --orb-rim: #E89A5E; --orb-pool: rgba(240, 174, 114, 0.22);
    --block-lavender: #6E5FB0; --block-periwinkle: #4E66B8; --block-sky: #2F7BA6; --block-teal: #2E7F77; --block-sage: #4C7B47; --block-sand: #86672A; --block-rose: #A44E78; --block-mauve: #87539D;
    --lit-edge: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 1px 2px rgba(38, 34, 54, 0.06), inset 0 0 0 1px rgba(38, 34, 54, 0.06);
    --lit-edge-active: inset 0 1px 0 rgba(255, 255, 255, 1), 0 2px 10px rgba(232, 154, 94, 0.18), inset 0 0 0 1px rgba(232, 154, 94, 0.35);
    --lit-edge-top: inset 0 1px 0 rgba(38, 34, 54, 0.08);
  }
}

:root {
  --font-rounded: ui-rounded, "SF Pro Rounded", Nunito, system-ui, sans-serif;
  --font-serif: ui-serif, "New York", Newsreader, Georgia, serif;

  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 20px; --space-6: 24px;
  --space-8: 32px; --space-10: 40px; --space-12: 48px; --space-16: 64px; --space-20: 80px; --space-24: 96px;
  --space-32: 128px; --space-40: 160px;
  --touch-min: 44px; --button-height: 52px; --button-height-lg: 56px;

  --radius-xs: 8px; --radius-sm: 12px; --radius-md: 18px; --radius-lg: 24px; --radius-xl: 32px; --radius-full: 999px;

  --size-display: clamp(2.5rem, 1.664rem + 3.429vw, 4.75rem);
  --size-h2: clamp(2rem, 1.536rem + 1.905vw, 3.25rem);
  --size-h3: clamp(1.5rem, 1.314rem + 0.762vw, 2rem);
  --size-cue: clamp(2.75rem, 2.471rem + 1.143vw, 3.5rem);
  --size-caption: clamp(1.25rem, 1.204rem + 0.19vw, 1.375rem);
  --size-numeral: clamp(3rem, 2.443rem + 2.286vw, 4.5rem);
  --size-lead: clamp(1.0625rem, 0.993rem + 0.286vw, 1.25rem);
  --size-body: clamp(1.0625rem, 1.039rem + 0.095vw, 1.125rem);
  --size-title-2: clamp(1.25rem, 1.204rem + 0.19vw, 1.375rem);
  --size-headline: clamp(1.0625rem, 1.039rem + 0.095vw, 1.125rem);
  --size-wordmark: clamp(1.375rem, 1.282rem + 0.381vw, 1.625rem);
  --space-section: clamp(4rem, 1.771rem + 9.143vw, 10rem);
  --space-gap: clamp(3rem, 1.886rem + 4.571vw, 6rem);
  --orb-hero: clamp(12.5rem, 10.179rem + 9.524vw, 18.75rem);
  --orb-player: clamp(18.75rem, 14.8rem + 16.19vw, 29.375rem);

  --badge-height: 54px; --badge-height-mobile: 48px; --badge-height-bar: 40px;
  --orb-large: 180px; --orb-medium: 120px; --orb-small: 56px;
  --device-sm: 240px; --device-md: 300px; --device-lg: 360px;
  --nav-height: 80px; --nav-height-mobile: 56px;
  --container-max: 1280px; --measure: 34em;

  --grid-columns: 12;
  --grid-margin-390: 20px; --grid-gutter-390: 12px;
  --grid-margin-768: 32px; --grid-gutter-768: 20px;
  --grid-margin-1024: 48px; --grid-gutter-1024: 24px;
  --grid-margin-1440: 80px; --grid-gutter-1440: 24px;

  --dur-hover: 200ms; --dur-accordion: 300ms; --dur-fade: 400ms; --dur-cue-in: 500ms;
  --dur-hero-fade: 600ms; --dur-lit: 600ms; --dur-reveal: 600ms; --dur-orb-handoff: 1200ms; --dur-bloom: 1600ms;
  --breath-in: 5.5s; --breath-out: 5.5s; --breath-cycle: 11s; --breath-settle: 2.5s; --breath-session: 60s;
  --ease-breath: cubic-bezier(0.37, 0, 0.63, 1);
  --ease-fade: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-hold: linear;

  --grain-dusk: 0.3; --grain-dawn: 0.16; --disabled: 0.5; --nav-quiet: 0.4; --orb-paused: 0.6;
  --z-base: 0; --z-nav: 10; --z-sticky: 20; --z-player: 30; --z-menu: 40; --z-skip: 50;
}


/* Lentu Web: component styles. Loaded after tokens.css. Every colour, size, radius, duration and easing is a var(--token). */

/* ------------------------------------------------------------------ base */

.lt-surface {
  position: relative;
  background: var(--bg);
  color: var(--text-primary);
  font-family: var(--font-rounded);
  font-size: var(--size-body);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-size-adjust: 100%;
}
.lt-surface--sunken { background: var(--bg-sunken); }
[data-theme="dusk"] .lt-surface, [data-theme="dusk"].lt-surface, [data-theme="dark"] .lt-surface { color-scheme: dark; }
[data-theme="dawn"] .lt-surface, [data-theme="dawn"].lt-surface, [data-theme="light"] .lt-surface { color-scheme: light; }
.lt-surface ::selection { background: var(--surface-plum); color: var(--text-primary); }
.lt-surface :focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 3px; }
:where(.lt-surface) a { color: var(--accent-text); text-underline-offset: 4px; }
:where(.lt-surface) :where(p, li) > a:not([class]) { text-decoration: underline; }

/* static grain over a ground: add .lt-grain to any section */
.lt-grain { isolation: isolate; }
.lt-grain::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  opacity: var(--grain-dusk); mix-blend-mode: overlay;
}
[data-theme="dawn"] .lt-grain::before, [data-theme="light"] .lt-grain::before { opacity: var(--grain-dawn); mix-blend-mode: multiply; }
@media (prefers-color-scheme: light) { :root:not([data-theme]) .lt-grain::before { opacity: var(--grain-dawn); mix-blend-mode: multiply; } }
:root [data-theme="dusk"] .lt-grain::before, :root [data-theme="dark"] .lt-grain::before { opacity: var(--grain-dusk); mix-blend-mode: overlay; }
:root [data-theme="dawn"] .lt-grain::before, :root [data-theme="light"] .lt-grain::before { opacity: var(--grain-dawn); mix-blend-mode: multiply; }

.lt-sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.lt-skip { position: absolute; left: var(--space-4); top: calc(-1 * var(--touch-min) * 2); z-index: var(--z-skip); padding: var(--space-3) var(--space-5); border-radius: var(--radius-full); background: var(--accent-fill); color: var(--accent-on); font-weight: 600; text-decoration: none; }
.lt-skip:focus { top: var(--space-4); }

/* ------------------------------------------------------------------ type */

.lt-display, .lt-h2, .lt-h3, .lt-cue, .lt-caption { font-family: var(--font-serif); font-weight: 400; margin: 0; font-optical-sizing: auto; }
.lt-display { font-size: var(--size-display); line-height: 1.1; letter-spacing: -0.01em; text-wrap: balance; }
.lt-h2 { font-size: var(--size-h2); line-height: 1.15; text-wrap: balance; }
.lt-h3 { font-size: var(--size-h3); line-height: 1.2; text-wrap: balance; }
.lt-cue { font-size: var(--size-cue); line-height: 1.16; }
.lt-caption { font-size: var(--size-caption); line-height: 1.36; font-style: italic; color: var(--text-secondary); }
.lt-numeral { margin: 0; font-family: var(--font-rounded); font-weight: 300; font-size: var(--size-numeral); line-height: 1.05; font-variant-numeric: tabular-nums lining-nums; white-space: nowrap; }
.lt-lead { margin: 0; font-size: var(--size-lead); line-height: 1.5; color: var(--text-secondary); text-wrap: pretty; max-width: var(--measure); }
.lt-title-2 { margin: 0; font-size: var(--size-title-2); line-height: 1.27; font-weight: 600; }
.lt-headline { margin: 0; font-size: var(--size-headline); line-height: 1.3; font-weight: 600; }
.lt-body { margin: 0; font-size: var(--size-body); line-height: 1.55; }
.lt-callout { margin: 0; font-size: 1rem; line-height: 1.5; }
.lt-subhead { margin: 0; font-size: 0.9375rem; line-height: 1.33; }
.lt-footnote { margin: 0; font-size: 0.8125rem; line-height: 1.38; color: var(--text-secondary); }
.lt-label { margin: 0; font-size: 0.75rem; line-height: 1.33; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; color: var(--text-secondary); }
.lt-wordmark { font-family: var(--font-rounded); font-weight: 300; font-size: var(--size-wordmark); line-height: 1.2; letter-spacing: 0.06em; color: var(--text-primary); text-decoration: none; }
.lt-muted { color: var(--text-secondary); }

/* ------------------------------------------------------------------ layout */

.lt-container {
  --margin: var(--grid-margin-390); --gutter: var(--grid-gutter-390);
  box-sizing: border-box; width: 100%;
  max-width: calc(var(--container-max) + 2 * var(--margin));
  margin-inline: auto; padding-inline: var(--margin);
}
.lt-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); }
.lt-section { position: relative; padding-block: var(--space-section); }
.lt-stack { display: flex; flex-direction: column; }
.lt-center { align-items: center; text-align: center; }
@media (min-width: 768px) { .lt-container { --margin: var(--grid-margin-768); --gutter: var(--grid-gutter-768); } }
@media (min-width: 1024px) { .lt-container { --margin: var(--grid-margin-1024); --gutter: var(--grid-gutter-1024); } }
@media (min-width: 1440px) { .lt-container { --margin: var(--grid-margin-1440); --gutter: var(--grid-gutter-1440); } }

/* ------------------------------------------------------------------ buttons */

.lt-btn {
  appearance: none; border: 0; box-sizing: border-box; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
  min-height: var(--button-height); padding: var(--space-3) var(--space-8);
  border-radius: var(--radius-full); background: var(--accent-fill); color: var(--accent-on);
  font-family: var(--font-rounded); font-size: var(--size-headline); line-height: 1.3; font-weight: 600; text-align: center; text-decoration: none;
  transition: background-color var(--dur-hover) var(--ease-fade);
}
.lt-btn:hover { background: var(--accent-fill-hover); }
.lt-btn:active { background: var(--accent-fill-active); }
.lt-btn[disabled], .lt-btn[aria-disabled="true"] { background: var(--surface-2); color: var(--text-secondary); cursor: default; }
.lt-btn--block { width: 100%; }
.lt-btn svg { width: 18px; height: 18px; flex: none; }
@media (min-width: 768px) { .lt-btn--block { width: auto; } }
@media (min-width: 1024px) { .lt-btn { min-height: var(--button-height-lg); padding-inline: var(--space-10); } }

.lt-link-btn {
  appearance: none; border: 0; background: none; cursor: pointer;
  min-height: var(--touch-min); padding: var(--space-2) var(--space-3);
  color: var(--accent-text); font-family: var(--font-rounded); font-size: var(--size-headline); line-height: 1.3; font-weight: 500;
  text-decoration: none; text-underline-offset: 4px; border-radius: var(--radius-full);
}
.lt-link-btn:hover { text-decoration: underline; }

.lt-quiet-btn {
  appearance: none; border: 0; cursor: pointer; box-sizing: border-box;
  display: inline-flex; align-items: center; gap: var(--space-2);
  min-height: var(--touch-min); padding: var(--space-2) var(--space-4);
  border-radius: var(--radius-full); background: var(--surface-1); box-shadow: var(--lit-edge); color: var(--text-primary);
  font-family: var(--font-rounded); font-size: 0.9375rem; line-height: 1.33; font-weight: 500;
  transition: box-shadow var(--dur-lit) var(--ease-fade), background-color var(--dur-hover) var(--ease-fade);
}
.lt-quiet-btn:hover { box-shadow: var(--lit-edge-active); }
.lt-quiet-btn[aria-pressed="true"], .lt-quiet-btn[aria-checked="true"] { background: var(--surface-2); box-shadow: var(--lit-edge-active); }
.lt-quiet-btn .lt-check { color: var(--toggle-on); }
.lt-quiet-btn svg { width: 16px; height: 16px; flex: none; }

.lt-icon-btn {
  appearance: none; border: 0; background: none; cursor: pointer;
  width: var(--touch-min); height: var(--touch-min); border-radius: var(--radius-full);
  display: inline-flex; align-items: center; justify-content: center; color: var(--text-secondary);
  transition: color var(--dur-hover) var(--ease-fade), background-color var(--dur-hover) var(--ease-fade);
}
.lt-icon-btn:hover { color: var(--text-primary); background: var(--surface-1); }
.lt-icon-btn svg { width: 20px; height: 20px; }

/* ------------------------------------------------------------------ launch CTA and badge */

.lt-cta { display: flex; flex-direction: column; align-items: center; text-align: center; }
.lt-cta--start { align-items: flex-start; text-align: left; }
.lt-cta__note { margin: var(--space-4) 0 0; font-size: 0.9375rem; line-height: 1.33; color: var(--text-secondary); text-wrap: balance; }
.lt-cta__sub { margin: var(--space-1) 0 0; font-size: 0.8125rem; line-height: 1.38; color: var(--text-secondary); }
.lt-cta .lt-link-btn { margin-top: var(--space-2); }
.lt-cta[data-launch="soon"] .lt-cta__live, .lt-cta[data-launch="live"] .lt-cta__soon { display: none; }

.lt-badge { display: inline-block; line-height: 0; text-decoration: none; margin: calc(var(--badge-height-mobile) / 4); border-radius: var(--radius-sm); }
.lt-badge img { display: block; height: var(--badge-height-mobile); width: auto; }
.lt-cta .lt-badge { margin-block: calc(var(--badge-height-mobile) / 4) 0; }
@media (min-width: 768px) {
  .lt-badge { margin: calc(var(--badge-height) / 4); }
  .lt-badge img { height: var(--badge-height); }
  .lt-cta .lt-badge { margin-block: calc(var(--badge-height) / 4) 0; }
}

.lt-chip {
  display: inline-flex; align-items: center; gap: var(--space-2);
  min-height: var(--space-8); padding: var(--space-1) var(--space-3); box-sizing: border-box;
  border-radius: var(--radius-full); background: var(--surface-plum); color: var(--text-primary);
  font-size: 0.8125rem; line-height: 1.38; font-weight: 600;
}

/* ------------------------------------------------------------------ nav */

.lt-header { position: relative; z-index: var(--z-nav); transition: opacity var(--dur-hero-fade) var(--ease-fade); }
.lt-header--quiet { opacity: var(--nav-quiet); }
.lt-header--quiet:hover, .lt-header--quiet:focus-within { opacity: 1; }
.lt-nav { display: flex; align-items: center; justify-content: space-between; height: var(--nav-height-mobile); }
.lt-nav__links { display: none; align-items: center; gap: var(--space-8); margin-left: auto; margin-right: var(--space-5); }
.lt-nav__link { display: inline-flex; align-items: center; min-height: var(--touch-min); font-size: 0.9375rem; line-height: 1.33; color: var(--text-secondary); text-decoration: none; transition: color var(--dur-hover) var(--ease-fade); }
.lt-nav__link:hover { color: var(--text-primary); text-decoration: underline; }
.lt-nav__link[aria-current="page"] { color: var(--text-primary); text-decoration: underline; text-decoration-thickness: 2px; text-decoration-color: var(--accent-text); }
.lt-nav__end { display: flex; align-items: center; margin-right: calc(-1 * var(--space-3)); }
.lt-nav__menu-btn { color: var(--text-primary); }
@media (min-width: 768px) {
  .lt-nav { height: var(--nav-height); }
  .lt-nav__links { display: flex; }
  .lt-nav__menu-btn { display: none; }
}
.lt-menu { position: fixed; inset: 0; z-index: var(--z-menu); display: flex; flex-direction: column; background: var(--bar-glass); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); }
.lt-menu__list { list-style: none; margin: 0; padding: var(--space-6) 0 0; }
.lt-menu__list li { border-bottom: 1px solid var(--line); }
.lt-menu__link { display: flex; align-items: center; min-height: var(--space-16); font-family: var(--font-serif); font-size: var(--size-h3); line-height: 1.2; color: var(--text-primary); text-decoration: none; }

/* ------------------------------------------------------------------ theme control */

.lt-segmented { display: inline-flex; gap: var(--space-1); padding: var(--space-1); border-radius: var(--radius-full); background: var(--surface-1); box-shadow: var(--lit-edge); }
.lt-segmented button { appearance: none; border: 0; cursor: pointer; display: inline-flex; align-items: center; gap: var(--space-2); min-height: var(--touch-min); padding: 0 var(--space-4); border-radius: var(--radius-full); background: none; color: var(--text-secondary); font: 500 0.9375rem/1.33 var(--font-rounded); transition: color var(--dur-hover) var(--ease-fade), background-color var(--dur-hover) var(--ease-fade); }
.lt-segmented button:hover { color: var(--text-primary); }
.lt-segmented button[aria-checked="true"] { background: var(--surface-2); color: var(--text-primary); box-shadow: var(--lit-edge-active); }

/* ------------------------------------------------------------------ section header */

.lt-section-head { display: flex; flex-direction: column; gap: var(--space-5); }
.lt-section-head .lt-label + .lt-h2 { margin-top: calc(var(--space-3) - var(--space-5)); }
.lt-section-head--center { align-items: center; text-align: center; }
.lt-section-head--center .lt-lead { margin-inline: auto; }

/* ------------------------------------------------------------------ cards */

.lt-card { position: relative; box-sizing: border-box; padding: var(--space-6); border-radius: var(--radius-lg); background: var(--surface-1); box-shadow: var(--lit-edge); color: var(--text-primary); transition: box-shadow var(--dur-lit) var(--ease-fade); }
.lt-card--plum { background: var(--surface-plum); }
.lt-card--xl { border-radius: var(--radius-xl); }
a.lt-card { display: block; text-decoration: none; }
a.lt-card:hover { box-shadow: var(--lit-edge-active); }
.lt-card .lt-title-2 + .lt-callout { margin-top: var(--space-2); color: var(--text-secondary); }
.lt-block-chip { display: inline-flex; align-items: center; justify-content: center; width: calc(var(--space-8) + var(--space-1)); height: calc(var(--space-8) + var(--space-1)); border-radius: var(--radius-sm); }
.lt-block-chip svg { width: 20px; height: 20px; }
@media (min-width: 1024px) { .lt-card { padding: var(--space-8); } }

/* ------------------------------------------------------------------ notice */

.lt-notice { display: flex; align-items: flex-start; gap: var(--space-3); padding: var(--space-4) var(--space-5); border-radius: var(--radius-lg); background: var(--notice-fill); box-shadow: inset 0 0 0 1px var(--notice-line); color: var(--notice-text); font-size: 1rem; line-height: 1.5; }
.lt-notice svg { flex: none; width: 20px; height: 20px; margin-top: 2px; color: var(--notice-icon); }
.lt-notice strong { font-weight: 600; }

/* ------------------------------------------------------------------ FAQ */

.lt-faq { border-top: 1px solid var(--line); }
.lt-faq details { border-bottom: 1px solid var(--line); }
.lt-faq summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); min-height: var(--touch-min); padding: var(--space-5) 0; font-size: var(--size-title-2); line-height: 1.27; font-weight: 600; }
.lt-faq summary::-webkit-details-marker { display: none; }
.lt-faq summary::after { content: ""; flex: none; width: 10px; height: 10px; margin-right: var(--space-1); border-right: 2px solid var(--text-secondary); border-bottom: 2px solid var(--text-secondary); transform: translateY(-3px) rotate(45deg); transition: transform var(--dur-accordion) var(--ease-fade); }
.lt-faq details[open] > summary::after { transform: translateY(3px) rotate(-135deg); }
.lt-faq summary:hover { text-decoration: underline; text-underline-offset: 4px; }
.lt-faq summary:hover::after { border-color: var(--text-primary); }
.lt-faq__a { padding: 0 0 var(--space-6); max-width: var(--measure); color: var(--text-secondary); font-size: var(--size-body); line-height: 1.55; }
.lt-faq__a p { margin: 0; }
.lt-faq__a p + p { margin-top: var(--space-3); }
@supports (interpolate-size: allow-keywords) {
  .lt-faq { interpolate-size: allow-keywords; }
  .lt-faq details::details-content { block-size: 0; overflow: hidden; transition: block-size var(--dur-accordion) var(--ease-fade), content-visibility var(--dur-accordion) allow-discrete; }
  .lt-faq details[open]::details-content { block-size: auto; }
}

/* ------------------------------------------------------------------ orb */

.lt-orb { --orb-size: var(--orb-hero); position: relative; flex: none; width: var(--orb-size); aspect-ratio: 1; }
.lt-orb__pool { position: absolute; inset: -66.5%; border-radius: 50%; pointer-events: none; background: radial-gradient(circle, var(--orb-pool) 0%, color-mix(in srgb, var(--orb-pool) 40%, transparent) 34%, transparent 62%); }
.lt-orb__body { position: absolute; inset: 0; }
.lt-orb__dim, .lt-orb__bright { position: absolute; inset: 0; border-radius: 50%; background: radial-gradient(circle at 50% 48%, var(--orb-core) 0%, var(--orb-body) 26%, var(--orb-glow) 47%, color-mix(in srgb, var(--orb-rim) 62%, transparent) 60%, color-mix(in srgb, var(--orb-rim) 18%, transparent) 67%, transparent 72%); }
.lt-orb__dim { filter: brightness(0.82); }
.lt-orb__bright { filter: brightness(1.08); opacity: 0; }
.lt-orb--rest .lt-orb__bright { opacity: 0.69; }
.lt-orb--paused .lt-orb__body { filter: brightness(var(--orb-paused)); }
.lt-orb--paused .lt-orb__pool { opacity: 0.5; }

@keyframes lt-breathe-scale { 0%, 100% { transform: scale(0.94); } 50% { transform: scale(1.04); } }
@keyframes lt-breathe-light { 0%, 100% { opacity: 0; } 50% { opacity: 1; } }
@keyframes lt-breathe-pool { 0%, 100% { transform: scale(0.8); opacity: 0.55; } 50% { transform: scale(1.1); opacity: 1; } }
@keyframes lt-breathe-pool-rm { 0%, 100% { opacity: 0.55; } 50% { opacity: 1; } }
.lt-orb--breathing .lt-orb__body { animation: lt-breathe-scale var(--breath-cycle) var(--ease-breath) infinite; }
.lt-orb--breathing .lt-orb__bright { animation: lt-breathe-light var(--breath-cycle) var(--ease-breath) infinite; }
.lt-orb--breathing .lt-orb__pool { animation: lt-breathe-pool var(--breath-cycle) var(--ease-breath) infinite; }
.lt-orb--paused .lt-orb__body, .lt-orb--paused .lt-orb__bright, .lt-orb--paused .lt-orb__pool { animation-play-state: paused; }

/* ------------------------------------------------------------------ player */

.lt-player { display: flex; flex-direction: column; align-items: center; text-align: center; }
.lt-player__stage { position: relative; width: min(var(--orb-player), 52svh); aspect-ratio: 1; margin-top: var(--space-5); }
.lt-player__ring { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; transform: rotate(-90deg); }
.lt-player__ring circle { fill: none; }
.lt-player__track { stroke: var(--ring-track); stroke-width: 1.5px; }
.lt-player__progress { stroke: var(--ring-progress); stroke-width: 2px; stroke-linecap: round; stroke-dasharray: 100; }
.lt-player__stage .lt-orb { --orb-size: 93.6%; position: absolute; left: 3.2%; top: 3.2%; }
.lt-player__cue { position: relative; align-self: stretch; height: calc(var(--size-cue) * 1.16); margin-top: var(--space-5); }
.lt-player__cue > * { position: absolute; inset: 0; transition: opacity var(--dur-cue-in) var(--ease-fade); }
.lt-player__caption { position: relative; align-self: stretch; min-height: calc(var(--size-caption) * 1.36 * 2); margin-top: var(--space-2); }
.lt-player__caption > * { position: absolute; left: 0; right: 0; top: 0; transition: opacity var(--dur-cue-in) var(--ease-fade); }
.lt-player [data-out] { opacity: 0; transition-duration: var(--dur-fade); }
.lt-player__controls { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-1); margin-top: var(--space-8); padding: var(--space-1); border-radius: var(--radius-full); background: var(--surface-1); box-shadow: var(--lit-edge); }
.lt-player__controls .lt-quiet-btn { background: none; box-shadow: none; }
.lt-player__controls .lt-quiet-btn:hover { background: var(--surface-2); }
.lt-player__time { margin-top: var(--space-3); font-size: 0.9375rem; line-height: 1.33; color: var(--text-secondary); font-variant-numeric: tabular-nums; }

/* ------------------------------------------------------------------ device frame */

.lt-device { position: relative; margin: 0; width: var(--device-md); flex: none; }
.lt-device--sm { width: var(--device-sm); }
.lt-device--lg { width: var(--device-lg); }
.lt-device img { display: block; width: 100%; height: auto; }
.lt-device__light { position: absolute; z-index: -1; left: 50%; top: var(--light-y, 36%); width: 180%; aspect-ratio: 1; transform: translate(-50%, -50%); border-radius: 50%; pointer-events: none; background: radial-gradient(circle, var(--orb-pool) 0%, color-mix(in srgb, var(--orb-pool) 40%, transparent) 34%, transparent 62%); }
.lt-device figcaption { margin-top: var(--space-3); font-size: 0.8125rem; line-height: 1.38; color: var(--text-secondary); text-align: center; }

/* ------------------------------------------------------------------ sticky download bar (mobile, live only) */

.lt-stickybar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: var(--z-sticky);
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-3);
  padding: var(--space-2) var(--grid-margin-390) calc(var(--space-2) + env(safe-area-inset-bottom, 0px));
  background: var(--bar-glass); -webkit-backdrop-filter: blur(20px) saturate(1.2); backdrop-filter: blur(20px) saturate(1.2);
  box-shadow: var(--lit-edge-top);
  transform: translateY(110%); transition: transform var(--dur-hero-fade) var(--ease-fade);
}
.lt-stickybar.is-shown { transform: none; }
.lt-stickybar__text { margin: 0; font-size: 0.9375rem; line-height: 1.33; color: var(--text-secondary); }
.lt-stickybar__text strong { display: block; color: var(--text-primary); font-weight: 600; }
.lt-stickybar .lt-badge { margin: var(--space-1); }
.lt-stickybar .lt-badge img { height: var(--badge-height-bar); }
@media (min-width: 768px) { .lt-stickybar { display: none; } }

/* ------------------------------------------------------------------ footer */

.lt-footer { border-top: 1px solid var(--line); padding-block: var(--space-16) var(--space-12); }
.lt-footer__cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-8) var(--gutter, var(--space-5)); }
.lt-footer__col h2 { margin: 0 0 var(--space-3); }
.lt-footer__cols > :first-child { grid-column: 1 / -1; }
.lt-footer__col ul { list-style: none; margin: 0; padding: 0; }
.lt-footer__col a { display: inline-flex; align-items: center; min-height: var(--touch-min); font-size: 0.9375rem; color: var(--text-primary); text-decoration: none; }
.lt-footer__col a:hover { text-decoration: underline; }
.lt-footer__legal { margin-top: var(--space-10); padding-top: var(--space-6); border-top: 1px solid var(--line); display: flex; flex-direction: column; gap: var(--space-2); }
@media (min-width: 1024px) { .lt-footer__cols { grid-template-columns: repeat(4, minmax(0, 1fr)); } .lt-footer__cols > :first-child { grid-column: auto; } }

/* ------------------------------------------------------------------ reveal (only with JS) */

.js .lt-reveal { opacity: 0; transform: translateY(12px); transition: opacity var(--dur-reveal) var(--ease-fade), transform var(--dur-reveal) var(--ease-fade); }
.js .lt-reveal.is-in { opacity: 1; transform: none; }

/* ------------------------------------------------------------------ reduced motion, contrast, transparency */

@media (prefers-reduced-motion: reduce) {
  .lt-orb--breathing .lt-orb__body { animation: none; }
  .lt-orb--breathing .lt-orb__pool { animation-name: lt-breathe-pool-rm; }
  .js .lt-reveal { transform: none; }
  .lt-stickybar { transform: none; opacity: 0; visibility: hidden; transition: opacity var(--dur-fade) var(--ease-fade), visibility var(--dur-fade); }
  .lt-stickybar.is-shown { opacity: 1; visibility: visible; }
  .lt-faq summary::after { transition: none; }
  .lt-faq details::details-content { transition: none; }
}
@media (prefers-contrast: more) {
  .lt-grain::before { display: none; }
  .lt-card, .lt-notice { box-shadow: inset 0 0 0 1px var(--text-secondary); }
  .lt-faq, .lt-faq details, .lt-footer, .lt-footer__legal { border-color: var(--line-strong); }
  .lt-orb__pool, .lt-device__light { display: none; }
}
@media (prefers-reduced-transparency: reduce) {
  .lt-orb__pool, .lt-device__light { display: none; }
  .lt-stickybar, .lt-menu { background: var(--bg-sunken); -webkit-backdrop-filter: none; backdrop-filter: none; }
}


/* Lentu Web: page sections. Loaded after tokens.css and components.css. Values are tokens. */

.lt-site { min-height: 100vh; overflow-x: clip; }
.lt-site main { display: block; }
/* Short pages on tall screens: the footer sits at the bottom, the spare room stays in main. */
.lt-site:has(> main) { display: flex; flex-direction: column; }
.lt-site > main { flex: 1 0 auto; }
:where(.lt-site) :where(h1, h2, h3, p, ul, ol, dl, figure, address) { margin: 0; }
:where(.lt-site) :where(img, svg) { display: block; }
:where(.lt-site) :where(.lt-icon-btn, .lt-btn, .lt-quiet-btn) svg { display: inline-block; }
.lt-gap { margin-top: var(--space-gap); }
.lt-mt-2 { margin-top: var(--space-2); } .lt-mt-3 { margin-top: var(--space-3); } .lt-mt-4 { margin-top: var(--space-4); }
.lt-mt-5 { margin-top: var(--space-5); } .lt-mt-6 { margin-top: var(--space-6); } .lt-mt-8 { margin-top: var(--space-8); }
.lt-mt-10 { margin-top: var(--space-10); } .lt-mt-12 { margin-top: var(--space-12); }

/* ------------------------------------------------------------------ hero */

.hero { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;
  min-height: min(calc(100svh - var(--nav-height-mobile)), 760px); padding: var(--space-4) 0 var(--space-16); box-sizing: border-box; }
.hero .lt-container { display: flex; flex-direction: column; align-items: center; }
.hero__orb { --orb-size: var(--orb-hero); }
.hero .lt-display { margin-top: var(--space-1); max-width: 14ch; }
.hero .lt-lead { margin-top: var(--space-5); max-width: 32em; }
.hero .lt-cta { margin-top: var(--space-8); width: 100%; }
@media (min-width: 768px) {
  .hero { min-height: min(calc(100svh - var(--nav-height)), 860px); }
  .hero .lt-display { max-width: none; }
  .hero .lt-cta { width: auto; }
}

/* ------------------------------------------------------------------ the Pause moment */

.pause__body { display: grid; gap: var(--space-10); justify-items: center; }
.pause__device { order: -1; }
.pause__steps { list-style: none; padding: 0; display: flex; flex-direction: column; gap: var(--space-2); width: 100%; }
.step { appearance: none; border: 0; background: none; width: 100%; box-sizing: border-box; cursor: pointer; text-align: left; color: var(--text-secondary);
  display: grid; grid-template-columns: var(--space-8) 1fr; column-gap: var(--space-4); align-items: start;
  padding: var(--space-4) var(--space-5); border-radius: var(--radius-lg); font-family: var(--font-rounded);
  transition: background-color var(--dur-fade) var(--ease-fade), box-shadow var(--dur-lit) var(--ease-fade), color var(--dur-fade) var(--ease-fade); }
.step:hover { color: var(--text-primary); }
.step__n { width: 28px; height: 28px; border-radius: var(--radius-full); box-shadow: inset 0 0 0 1px var(--line-strong);
  display: inline-flex; align-items: center; justify-content: center; font-size: 0.8125rem; font-weight: 600; font-variant-numeric: tabular-nums; margin-top: 1px; }
.step__title { display: block; font-size: var(--size-title-2); line-height: 1.27; font-weight: 600; color: inherit; }
.step__text { display: none; margin-top: var(--space-2); font-size: 1rem; line-height: 1.5; color: var(--text-secondary); }
.step[aria-selected="true"] { background: var(--surface-1); box-shadow: var(--lit-edge-active); color: var(--text-primary); }
.step[aria-selected="true"] .step__n { background: var(--accent-fill); color: var(--accent-on); box-shadow: none; }
.step[aria-selected="true"] .step__text { display: block; }
@media (min-width: 768px) {
  .pause__body { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); align-items: start; justify-items: stretch; }
  .pause__steps { grid-column: 1 / 7; }
  .pause__device { grid-column: 7 / 13; order: 0; justify-self: center; position: sticky; top: var(--space-10); }
  .step__text { display: block; }
}
@media (min-width: 1024px) {
  .pause__steps { grid-column: 1 / 7; }
  .pause__device { grid-column: 8 / 12; }
}

/* ------------------------------------------------------------------ phone (stand-in for Apple's bezel + a real capture) */

.phone { position: relative; z-index: 0; flex: none; width: var(--device-sm); }
.phone__frame { position: relative; aspect-ratio: 430 / 902; box-sizing: border-box; padding: 3.26%; border-radius: 16.28% / 7.76%;
  background: #34333B; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.18); }
.phone__light { position: absolute; z-index: -1; left: 50%; top: var(--light-y, 36%); width: 190%; aspect-ratio: 1; transform: translate(-50%, -50%); border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, var(--orb-pool) 0%, color-mix(in srgb, var(--orb-pool) 40%, transparent) 34%, transparent 62%); }
.phone__screen { position: relative; height: 100%; overflow: hidden; border-radius: 13.93% / 6.41%; background: var(--bg); color: var(--text-primary);
  container-type: inline-size; font-family: -apple-system, system-ui, var(--font-rounded); }
.phone__island { position: absolute; z-index: 3; left: 34.3%; top: 1.26%; width: 31.3%; height: 4.23%; border-radius: 999px; background: #0B0A12; }
.phone figcaption { margin-top: var(--space-3); text-align: center; font-size: 0.8125rem; line-height: 1.38; color: var(--text-secondary); }
@media (min-width: 768px) { .phone { width: var(--device-md); } }
@media (min-width: 1440px) { .phone--lg { width: var(--device-lg); } }

/* screens, sized in container units: 1pt of the 402pt screen = 0.2488cqw */
.scr { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; box-sizing: border-box;
  padding: 15.4cqw 6.97cqw 8.46cqw; text-align: center; transition: opacity var(--dur-fade) var(--ease-fade); }
.scr[hidden] { display: none; }
.scr__veil { position: absolute; inset: 0; background: radial-gradient(ellipse at 50% 38%, color-mix(in srgb, var(--orb-pool) 50%, transparent) 0%, transparent 55%); }
.scr__fill { flex: 1 1 0; min-height: 4cqw; }
.scr__fill--more { flex: 1.5 1 0; }
.scr__orb { position: relative; flex: none; border-radius: 50%;
  background: radial-gradient(circle at 50% 48%, var(--orb-core) 0%, var(--orb-body) 26%, var(--orb-glow) 47%, color-mix(in srgb, var(--orb-rim) 62%, transparent) 60%, color-mix(in srgb, var(--orb-rim) 18%, transparent) 67%, transparent 72%); }
.scr__title { position: relative; margin-top: 5cqw; font-size: 5.47cqw; line-height: 6.97cqw; font-weight: 600; }
.scr__serif { position: relative; font-family: var(--font-serif); font-weight: 400; font-size: 8.46cqw; line-height: 10.2cqw; }
.scr__sub { position: relative; margin-top: 2cqw; font-size: 3.73cqw; line-height: 4.98cqw; color: var(--text-secondary); }
.scr__btn { position: relative; align-self: stretch; box-sizing: border-box; min-height: 12.94cqw; padding: 3.5cqw 5cqw; border-radius: 999px;
  background: var(--accent-fill); color: var(--accent-on); font-size: 4.23cqw; line-height: 5.47cqw; font-weight: 600; }
.scr__link { position: relative; align-self: stretch; min-height: 10.95cqw; margin-top: 1cqw; padding-top: 2.7cqw; box-sizing: border-box; color: var(--accent-text); font-size: 4.23cqw; line-height: 5.47cqw; }
.scr__label { position: relative; font-size: 2.99cqw; line-height: 3.98cqw; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; color: var(--text-secondary); }
.scr__banner { position: absolute; z-index: 2; left: 2cqw; right: 2cqw; top: 13.4cqw; display: flex; gap: 3cqw; align-items: flex-start; padding: 3.5cqw;
  border-radius: 6.5cqw; background: color-mix(in srgb, var(--surface-2) 94%, transparent); box-shadow: 0 2.5cqw 7.5cqw rgba(8, 6, 20, 0.3), inset 0 0 0 1px var(--line); text-align: left; }
.scr__appicon { flex: none; width: 9.45cqw; height: 9.45cqw; border-radius: 2.24cqw; background: #19172C; display: flex; align-items: center; justify-content: center; }
.scr__appicon span { width: 7.5cqw; height: 7.5cqw; border-radius: 50%; background: radial-gradient(circle at 50% 48%, #FFF7EA 0%, #FEE4BF 26%, #F8C995 47%, rgba(242, 176, 122, 0.62) 60%, rgba(242, 176, 122, 0) 72%); }
.scr__btext { flex: 1; min-width: 0; font-size: 3.73cqw; line-height: 4.98cqw; }
.scr__btext b { display: flex; justify-content: space-between; font-weight: 600; }
.scr__btext b span { font-weight: 400; font-size: 3.23cqw; color: var(--text-secondary); }
.scr__btext small { display: block; margin-top: 0.5cqw; font-size: 2.99cqw; line-height: 3.98cqw; color: var(--text-secondary); }
.scr__tiles { position: relative; align-self: stretch; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.5cqw; margin-top: 6cqw; }
.scr__tile { padding: 4cqw 1cqw; border-radius: 4.5cqw; background: var(--surface-1); box-shadow: var(--lit-edge); text-align: center; }
.scr__tile b { display: block; font-size: 4.98cqw; line-height: 6.2cqw; font-weight: 600; }
.scr__tile span { display: block; margin-top: 1cqw; font-size: 3.23cqw; line-height: 4.23cqw; color: var(--text-secondary); }
.scr__tile--on { background: var(--surface-2); box-shadow: var(--lit-edge-active); }
.scr__ring { position: relative; width: 67cqw; aspect-ratio: 1; }
.scr__ring svg { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.scr__ring .scr__orb { position: absolute; inset: 3.2%; }
.scr__chips { position: relative; display: flex; justify-content: center; gap: 2cqw; margin-top: 4.5cqw; flex-wrap: wrap; }
.scr__chip { padding: 2cqw 4cqw; border-radius: 999px; background: var(--surface-1); box-shadow: var(--lit-edge); font-size: 3.73cqw; line-height: 4.98cqw; font-weight: 500; }
.scr__chip--on { background: var(--surface-2); box-shadow: var(--lit-edge-active); }
.scr__list { position: relative; align-self: stretch; margin-top: 5cqw; padding: 4cqw; border-radius: 6cqw; background: var(--surface-plum); text-align: left; }
.scr__list p { font-size: 3.48cqw; line-height: 4.73cqw; }
.scr__list p + p { margin-top: 2.2cqw; }
.scr__list b { font-weight: 600; }
.scr__icons { display: flex; gap: 1.6cqw; margin-top: 1.6cqw; }
.scr__icons i { width: 7.5cqw; height: 7.5cqw; border-radius: 1.8cqw; background: color-mix(in srgb, var(--text-secondary) 35%, transparent); }
.scr__tick { position: relative; align-self: stretch; display: flex; align-items: center; gap: 2.5cqw; margin-top: 4cqw; font-size: 3.73cqw; line-height: 4.98cqw; text-align: left; }
.scr__tick i { flex: none; width: 5.5cqw; height: 5.5cqw; border-radius: 1.4cqw; background: var(--toggle-on); position: relative; }
.scr__tick i::after { content: ""; position: absolute; left: 1.7cqw; top: 0.7cqw; width: 1.4cqw; height: 2.8cqw; border: solid #FFFFFF; border-width: 0 0.6cqw 0.6cqw 0; transform: rotate(45deg); }

/* ------------------------------------------------------------------ Blocks and Lists */

.cards-3 { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-3); }
@media (min-width: 768px) { .cards-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gutter); } }
.block-card { display: flex; flex-direction: column; }
.block-card .lt-block-chip { margin-bottom: var(--space-5); }
.block-card__meta { margin-top: var(--space-4); display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.mode-chip { display: inline-flex; align-items: center; min-height: 28px; padding: 0 var(--space-3); border-radius: var(--radius-full); box-shadow: inset 0 0 0 1px var(--line-strong);
  font-size: 0.8125rem; line-height: 1.38; font-weight: 600; color: var(--text-primary); }
.modes { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
.modes dt { font-size: var(--size-title-2); line-height: 1.27; font-weight: 600; }
.modes dd { margin: var(--space-2) 0 0; font-size: 1rem; line-height: 1.5; color: var(--text-secondary); }
@media (min-width: 768px) { .modes { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gutter); } }
.list-chips { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-5); }
.list-chip { display: inline-flex; align-items: center; gap: var(--space-2); min-height: 36px; padding: 0 var(--space-3) 0 var(--space-2); border-radius: var(--radius-full);
  background: var(--surface-2); font-size: 0.9375rem; line-height: 1.33; }
.list-chip i { width: 20px; height: 20px; border-radius: var(--radius-full); }
.split { display: grid; gap: var(--space-6); }
@media (min-width: 1024px) { .split { grid-template-columns: 5fr 7fr; gap: var(--space-12); align-items: start; } }

/* ------------------------------------------------------------------ Hard mode */

.hard { padding: var(--space-8) var(--space-6); display: grid; gap: var(--space-10); justify-items: center; }
.hard__text { display: flex; flex-direction: column; gap: var(--space-5); max-width: 36em; }
.hard__facts { list-style: none; padding: 0; display: flex; flex-direction: column; gap: var(--space-3); }
.hard__facts li { display: grid; grid-template-columns: 20px 1fr; gap: var(--space-3); font-size: 1rem; line-height: 1.5; }
.hard__facts svg { width: 20px; height: 20px; margin-top: 2px; color: var(--toggle-on); }
@media (min-width: 768px) { .hard { padding: var(--space-12); } }
@media (min-width: 1024px) { .hard { grid-template-columns: 7fr 5fr; align-items: center; justify-items: stretch; padding: var(--space-16); } .hard .phone { justify-self: center; } }

/* ------------------------------------------------------------------ Privacy */

.points { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-8); }
.point svg { width: 28px; height: 28px; color: var(--accent-text); }
.point .lt-title-2 { margin-top: var(--space-4); }
.point .lt-callout { margin-top: var(--space-2); color: var(--text-secondary); }
@media (min-width: 1024px) { .points { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gutter); } }

/* ------------------------------------------------------------------ widgets */

.widgets { display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-end; gap: var(--space-8) var(--space-6); }
.widgets figcaption { margin-top: var(--space-3); font-size: 0.8125rem; line-height: 1.38; color: var(--text-secondary); text-align: center; }
.widgets figure { display: flex; flex-direction: column; align-items: center; max-width: 100%; }
.w-small, .w-medium { box-sizing: border-box; border-radius: 22px; background: var(--surface-1); box-shadow: var(--lit-edge); padding: 14px; text-align: left; }
.w-small { width: 158px; height: 158px; display: flex; flex-direction: column; justify-content: space-between; }
.w-small .lt-orb { --orb-size: 64px; margin: -6px 0 0 -6px; }
.w-small b, .w-medium b { display: block; font-size: 0.9375rem; line-height: 1.33; font-weight: 600; }
.w-small span, .w-medium span { display: block; font-size: 0.8125rem; line-height: 1.38; color: var(--text-secondary); }
.w-medium { width: 338px; max-width: 100%; height: 158px; display: grid; grid-template-columns: 1fr 1fr 1fr; grid-template-rows: auto 1fr; gap: 10px 8px; }
.w-medium__now { grid-column: 1 / -1; display: flex; align-items: center; gap: 10px; }
.w-medium__now i { width: 30px; height: 30px; border-radius: 9px; background: color-mix(in srgb, var(--block-periwinkle) 18%, transparent); display: flex; align-items: center; justify-content: center; color: var(--block-periwinkle); }
.w-medium__now i svg { width: 18px; height: 18px; }
.w-num { align-self: end; }
.w-num strong { display: block; font-weight: 300; font-size: 2rem; line-height: 1.1; font-variant-numeric: tabular-nums; }
.w-lock { width: 76px; height: 76px; border-radius: 50%; background: color-mix(in srgb, var(--text-primary) 14%, transparent); display: flex; align-items: center; justify-content: center; }
.w-lock i { width: 46px; height: 46px; border-radius: 50%; background: radial-gradient(circle, var(--text-primary) 0%, color-mix(in srgb, var(--text-primary) 85%, transparent) 40%, transparent 72%); }
.w-island { width: 236px; height: 40px; border-radius: 999px; background: #0B0A12; display: flex; align-items: center; justify-content: space-between; padding: 0 16px 0 10px; box-sizing: border-box; color: #F4ECDF; font-size: 0.9375rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.w-island i { width: 22px; height: 22px; border-radius: 50%; background: radial-gradient(circle at 50% 48%, #FFF7EA 0%, #FEE4BF 26%, #F8C995 47%, rgba(242, 176, 122, 0.62) 60%, rgba(242, 176, 122, 0) 72%); }
.w-control { width: 72px; height: 72px; border-radius: 22px; background: color-mix(in srgb, var(--text-primary) 14%, transparent); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; font-size: 0.75rem; font-weight: 600; }
.w-control i { width: 28px; height: 28px; border-radius: 50%; background: radial-gradient(circle, var(--text-primary) 0%, color-mix(in srgb, var(--text-primary) 85%, transparent) 40%, transparent 72%); }
@media (min-width: 1024px) { .widgets { gap: var(--space-10) var(--space-12); } }

/* ------------------------------------------------------------------ pricing */

.price-card { max-width: 560px; margin-inline: auto; padding: var(--space-10) var(--space-6); display: flex; flex-direction: column; align-items: center; text-align: center; }
.price-card .lt-orb { --orb-size: var(--orb-medium); margin-top: calc(-1 * var(--space-4)); }
.price-card__price { display: flex; align-items: baseline; gap: var(--space-3); margin-top: var(--space-2); }
.price-card__price span { font-size: var(--size-lead); color: var(--text-secondary); }
.price-card__was { font-size: var(--size-lead); color: var(--text-secondary); text-decoration: line-through; }
.price-card ul { list-style: none; padding: 0; margin-top: var(--space-6); display: flex; flex-direction: column; gap: var(--space-3); text-align: left; }
.price-card li { display: grid; grid-template-columns: 20px 1fr; gap: var(--space-3); font-size: 1rem; line-height: 1.5; }
.price-card li svg { width: 20px; height: 20px; margin-top: 2px; color: var(--toggle-on); }
.price-card .lt-cta { margin-top: var(--space-8); }
@media (min-width: 768px) { .price-card { padding: var(--space-12); } }

/* ------------------------------------------------------------------ FAQ on Home, final call to action */

.faq-wrap { max-width: 800px; margin-inline: auto; }
.faq-more { display: flex; justify-content: center; margin-top: var(--space-6); }
.final { text-align: center; display: flex; flex-direction: column; align-items: center; }
.final .lt-cta { margin-top: var(--space-8); width: 100%; }
@media (min-width: 768px) { .final .lt-cta { width: auto; } }

/* ------------------------------------------------------------------ inner pages */

.page-head { padding-top: var(--space-12); padding-bottom: var(--space-10); display: flex; flex-direction: column; gap: var(--space-4); }
.page-head .lt-lead { max-width: 36em; }
@media (min-width: 1024px) { .page-head { padding-top: var(--space-20); padding-bottom: var(--space-12); } }
.narrow { max-width: 800px; }
.narrow--center { margin-inline: auto; }

.faq-group + .faq-group { margin-top: var(--space-12); }
.faq-group > .lt-label { margin-bottom: var(--space-3); }
.contact-card { margin-top: var(--space-16); display: flex; flex-direction: column; gap: var(--space-4); align-items: flex-start; }
.contact-card .lt-btn { margin-top: var(--space-2); }
@media (min-width: 768px) { .contact-card { flex-direction: row; align-items: center; justify-content: space-between; gap: var(--space-8); } .contact-card .lt-btn { margin-top: 0; flex: none; } }

.legal { display: grid; gap: var(--space-10); padding-bottom: var(--space-section); }
.legal__toc { display: none; }
.legal__body { max-width: var(--measure); font-size: var(--size-body); line-height: 1.6; }
.legal__body h2 { margin-top: var(--space-12); font-size: var(--size-title-2); line-height: 1.27; font-weight: 600; scroll-margin-top: var(--space-6); }
.legal__body h2:first-of-type { margin-top: var(--space-8); }
.legal__body p, .legal__body ul { margin-top: var(--space-3); color: var(--text-secondary); }
.legal__body ul { padding-left: 1.2em; }
.legal__body li + li { margin-top: var(--space-2); }
.legal__body strong { color: var(--text-primary); font-weight: 600; }
.legal__body .lt-notice p, .legal__body .lt-notice strong { color: inherit; }
.legal__body address p { color: var(--text-primary); }
.legal__meta { margin-top: var(--space-4); }
.legal__toc ol { list-style: none; padding: 0; display: flex; flex-direction: column; gap: var(--space-1); }
.legal__toc a { display: inline-flex; min-height: 36px; align-items: center; font-size: 0.9375rem; color: var(--text-secondary); text-decoration: none; }
.legal__toc a:hover { color: var(--text-primary); text-decoration: underline; }
@media (min-width: 1440px) {
  .legal { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); }
  .legal__body { grid-column: 3 / 10; }
  .legal__toc { display: block; grid-column: 10 / 13; position: sticky; top: var(--space-10); align-self: start; padding-top: var(--space-8); }
}
.address { font-style: normal; }

.redeem { max-width: 600px; margin-inline: auto; padding: var(--space-12) var(--space-6); display: flex; flex-direction: column; align-items: center; text-align: center; }
.redeem .lt-orb { --orb-size: var(--orb-medium); }
.redeem .lt-h2 { margin-top: var(--space-3); }
.redeem .lt-lead { margin-top: var(--space-4); }
.redeem .lt-cta { margin-top: var(--space-8); }
.redeem .lt-notice { margin-top: var(--space-6); text-align: left; }
.code { display: inline-flex; align-items: center; gap: var(--space-3); margin-top: var(--space-6); padding: var(--space-3) var(--space-5); border-radius: var(--radius-sm);
  background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--line-strong); font-size: 1.25rem; line-height: 1.2; font-weight: 600; letter-spacing: 0.12em; font-variant-numeric: tabular-nums; }
.code small { font-size: 0.75rem; letter-spacing: 0.2em; font-weight: 600; color: var(--text-secondary); text-transform: uppercase; }
.steps-inline { list-style: none; padding: 0; margin-top: var(--space-8); display: grid; gap: var(--space-3); text-align: left; counter-reset: s; }
.steps-inline li { counter-increment: s; display: grid; grid-template-columns: 28px 1fr; gap: var(--space-3); font-size: 1rem; line-height: 1.5; color: var(--text-secondary); }
.steps-inline li::before { content: counter(s); width: 28px; height: 28px; border-radius: 50%; box-shadow: inset 0 0 0 1px var(--line-strong); display: flex; align-items: center; justify-content: center; font-size: 0.8125rem; font-weight: 600; color: var(--text-primary); }
@media (min-width: 768px) { .redeem { padding: var(--space-16); } .steps-inline { grid-template-columns: repeat(3, minmax(0, 1fr)); } .steps-inline li { grid-template-columns: 1fr; justify-items: center; text-align: center; } }

.press-about { max-width: var(--measure); }
.facts { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; border-top: 1px solid var(--line); }
.facts div { display: grid; grid-template-columns: 9em 1fr; gap: var(--space-4); padding: var(--space-4) 0; border-bottom: 1px solid var(--line); font-size: 1rem; line-height: 1.5; }
.facts dt { color: var(--text-secondary); }
.facts dd { margin: 0; }
.assets { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--gutter); }
.asset { display: flex; flex-direction: column; gap: var(--space-4); }
.asset__art { aspect-ratio: 4 / 3; border-radius: var(--radius-md); background: var(--bg); box-shadow: inset 0 0 0 1px var(--line); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.asset__art--dawn { background: #F4EEE4; }
.asset__art--split { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 100%; padding: 0; }
.asset__art--split > div { display: flex; align-items: center; justify-content: center; }
.asset__art--icon { background: var(--surface-1); }
.asset__art--dusk { background: #17152A; }
.asset__links { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-4); }
.asset__links a { display: inline-flex; align-items: center; min-height: var(--touch-min); font-size: 0.9375rem; font-weight: 500; }
.icon-tile { width: 112px; height: 112px; border-radius: 25px; background: #17152A; display: flex; align-items: center; justify-content: center; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08); }
.icon-tile .lt-orb { --orb-size: 104px; }
.shots { display: flex; gap: var(--space-2); align-items: flex-end; justify-content: center; padding: var(--space-4); }
.shots .phone { width: 72px; }
@media (min-width: 768px) { .facts { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--gutter); } .assets { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.notfound { min-height: min(calc(100svh - var(--nav-height) - 200px), 720px); display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding-block: var(--space-16); }
.notfound .lt-orb { --orb-size: var(--orb-large); }
.notfound .lt-h2 { margin-top: var(--space-4); }
.notfound .lt-lead { margin-top: var(--space-4); }
.notfound .lt-cta { margin-top: var(--space-8); }

/* draft label for legal pages */
.draft { margin-top: var(--space-2); }

/* ------------------------------------------------------------------ Why Lentu (Home) */

.why__intro { display: grid; gap: var(--space-6); }
.why__intro .lt-h2 { margin-top: var(--space-3); max-width: 12ch; }
.why__lede { font-family: var(--font-serif); font-weight: 400; font-size: var(--size-h3); line-height: 1.25; text-wrap: balance; }
.why__intro .lt-lead { margin-top: var(--space-5); }
.why__beliefs { list-style: none; padding: 0; display: grid; gap: var(--space-8); }
.why__beliefs li { padding-top: var(--space-5); border-top: 1px solid var(--line-strong); }
.why__beliefs .lt-callout { margin-top: var(--space-2); color: var(--text-secondary); }
.why__more { margin-top: var(--space-8); margin-left: calc(-1 * var(--space-3)); }
@media (min-width: 768px) { .why__beliefs { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gutter); } }
@media (min-width: 1024px) { .why__intro { grid-template-columns: 5fr 7fr; column-gap: var(--gutter); align-items: start; } }

/* ------------------------------------------------------------------ Why not a subscription? (Pricing) */

.pricing-why { max-width: 38rem; margin: var(--space-12) auto 0; display: flex; flex-direction: column; align-items: center; gap: var(--space-4); text-align: center; }
.pricing-why .lt-lead { margin: 0; }

/* ------------------------------------------------------------------ /why: the story */

.story { padding-block: var(--space-10) var(--space-section); }
.story__head { display: flex; flex-direction: column; align-items: center; gap: var(--space-4); padding-bottom: var(--space-16); text-align: center; }
.story__head .lt-orb { --orb-size: var(--orb-medium); margin-bottom: var(--space-4); }
.story__head .lt-display { max-width: 14ch; }
.story__body { max-width: 40rem; margin-inline: auto; }
.story__body h2 { margin-top: var(--space-16); font-family: var(--font-serif); font-weight: 400; font-size: var(--size-h3); line-height: 1.2; text-wrap: balance; }
.story__body h2:first-child { margin-top: 0; }
.story__body p { margin-top: var(--space-4); font-size: var(--size-body); line-height: 1.65; text-wrap: pretty; }
.story__pull { margin: var(--space-12) 0; padding-block: var(--space-8); border-block: 1px solid var(--line-strong); text-align: center; }
.story__pull p { margin: 0; font-family: var(--font-serif); font-weight: 400; font-size: var(--size-h2); line-height: 1.15; text-wrap: balance; }
.story__pull + p { margin-top: 0; }
.story__promises { list-style: none; padding: 0; margin-top: var(--space-5); display: flex; flex-direction: column; gap: var(--space-3); }
.story__promises li { display: grid; grid-template-columns: 20px 1fr; gap: var(--space-3); font-size: var(--size-body); line-height: 1.5; }
.story__promises svg { width: 20px; height: 20px; margin-top: 3px; color: var(--toggle-on); }
.story__body .story__sign { margin-top: var(--space-12); font-family: var(--font-serif); font-style: italic; font-size: var(--size-caption); line-height: 1.3; }
.story__sign span { display: block; margin-top: var(--space-1); font-family: var(--font-rounded); font-style: normal; font-size: 0.8125rem; color: var(--text-secondary); }


/* Lentu Web: site layer. Loaded after tokens.css, components.css and pages.css.
   Fonts, the launch and offer switches, theme controls, the phone menu, the Pause screens and the breath player's states. */

/* ------------------------------------------------------------------ fonts
   Self-hosted and never preloaded: Safari and every iPhone browser match ui-rounded / ui-serif first and download nothing.
   The fallback faces stop the swap from moving the page. Nunito against Arial: size-adjust measured from both fonts'
   lowercase widths. Newsreader against Georgia: estimated; confirm both with Fontaine or Capsize at build. */
@font-face { font-family: Nunito; src: url("../fonts/Nunito-wght.woff2") format("woff2"); font-weight: 200 1000; font-style: normal; font-display: swap; }
@font-face { font-family: Newsreader; src: url("../fonts/Newsreader-Roman-opsz.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: Newsreader; src: url("../fonts/Newsreader-Italic-20.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Nunito Fallback"; src: local("Arial"), local("ArialMT"); size-adjust: 100%; ascent-override: 101.1%; descent-override: 35.3%; line-gap-override: 0%; }
@font-face { font-family: "Newsreader Fallback"; src: local("Georgia"); size-adjust: 91%; ascent-override: 80.8%; descent-override: 29.1%; line-gap-override: 0%; }
:root {
  --font-rounded: ui-rounded, "SF Pro Rounded", Nunito, "Nunito Fallback", system-ui, sans-serif;
  --font-serif: ui-serif, "New York", Newsreader, "Newsreader Fallback", Georgia, serif;
}

/* ------------------------------------------------------------------ page */
html { -webkit-text-size-adjust: 100%; scroll-padding-top: var(--space-6); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body { margin: 0; background: var(--bg); }
[hidden] { display: none !important; }

/* ------------------------------------------------------------------ LAUNCH SWITCH
   Before release: <html data-launch="soon">. On release day scripts/go-live.py sets "live" on every page. */
html:not([data-launch="live"]) [data-launch="live"],
html[data-launch="live"] [data-launch="soon"] { display: none !important; }

/* ------------------------------------------------------------------ offer switch on /redeem
   <main data-offer-state="code|sale|expired">. site.js moves it to "expired" after data-offer-ends. */
[data-offer-state] [data-offer] { display: none; }
[data-offer-state="code"] [data-offer="code"],
[data-offer-state="sale"] [data-offer="sale"],
[data-offer-state="expired"] [data-offer="expired"] { display: contents; }
/* Before launch /redeem only says that offers open on launch day. */
html:not([data-launch="live"]) [data-offer-state] [data-offer] { display: none !important; }
html:not([data-launch="live"]) [data-offer-state] [data-offer="prelaunch"] { display: contents !important; }

/* ------------------------------------------------------------------ theme controls (need script) */
html:not(.js) [data-theme-toggle], html:not(.js) [data-theme-choices] { display: none; }
.theme-icon--moon { display: none; }
:root[data-theme="dawn"] .theme-icon--sun, :root[data-theme="light"] .theme-icon--sun { display: none; }
:root[data-theme="dawn"] .theme-icon--moon, :root[data-theme="light"] .theme-icon--moon { display: block; }

/* ------------------------------------------------------------------ phone menu */
.lt-menu { box-sizing: border-box; padding: env(safe-area-inset-top, 0px) var(--grid-margin-390) calc(var(--space-8) + env(safe-area-inset-bottom, 0px)); overflow-y: auto; color: var(--text-primary); font-family: var(--font-rounded); }
.lt-menu__bar { display: flex; align-items: center; justify-content: space-between; min-height: var(--nav-height-mobile); margin-right: calc(-1 * var(--space-3)); }
.lt-menu__list { padding-top: var(--space-4); }
.lt-menu__link[aria-current="page"] { text-decoration: underline; text-decoration-thickness: 2px; text-decoration-color: var(--accent-text); text-underline-offset: 6px; }
.lt-menu__foot { margin-top: var(--space-8); display: flex; flex-direction: column; gap: var(--space-2); }
@media (min-width: 768px) { .lt-menu { display: none !important; } }

/* ------------------------------------------------------------------ the Pause screens: six captures, one shown */
.pause-screen { position: absolute; inset: 0; opacity: 0; transition: opacity var(--dur-fade) var(--ease-fade); }
.pause-screen.is-current { opacity: 1; }
.pause__device .phone__screen { isolation: isolate; }

/* ------------------------------------------------------------------ hero and the breath player */
.hero__intro { display: flex; flex-direction: column; align-items: center; transition: opacity var(--dur-hero-fade) var(--ease-fade); }
.hero__text { display: contents; }
.hero__text > * { transition: opacity var(--dur-hero-fade) var(--ease-fade); }
.hero.is-leaving .hero__text > * { opacity: 0; }
html:not(.js) [data-breath-start] { display: none; }
.is-offscreen .lt-orb__body, .is-offscreen .lt-orb__bright, .is-offscreen .lt-orb__pool { animation-play-state: paused; }

.hero__player { width: 100%; }
.hero__player .lt-label { margin-top: 0; }
.lt-player .lt-orb__body { transition: transform 1.2s var(--ease-breath), filter 1s var(--ease-fade), opacity 1s var(--ease-fade); }
.lt-player .lt-orb__bright { transition: opacity 1.2s var(--ease-breath); }
.lt-player .lt-orb__pool { transition: transform 1.2s var(--ease-breath), opacity 1.2s var(--ease-breath); }
.lt-player .lt-orb--breathing .lt-orb__body,
.lt-player .lt-orb--breathing .lt-orb__bright,
.lt-player .lt-orb--breathing .lt-orb__pool { animation-delay: var(--orb-delay, 0s); }
/* The pose every breath starts and ends in (the 0% keyframe), eased into over --settle-dur. */
.lt-player.is-settling .lt-orb__body { transform: scale(0.94); transition: transform var(--settle-dur, var(--breath-settle)) var(--ease-breath), filter 1s var(--ease-fade), opacity 1s var(--ease-fade); }
.lt-player.is-settling .lt-orb__bright { opacity: 0; transition: opacity var(--settle-dur, var(--breath-settle)) var(--ease-breath); }
.lt-player.is-settling .lt-orb__pool { transform: scale(0.8); opacity: 0.55; transition: transform var(--settle-dur, var(--breath-settle)) var(--ease-breath), opacity var(--settle-dur, var(--breath-settle)) var(--ease-breath); }
.lt-player__stage { transition: width var(--dur-orb-handoff) var(--ease-breath); }
.lt-player__ring { transition: opacity var(--dur-hero-fade) var(--ease-fade); }
.lt-player__ring:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 6px; border-radius: 50%; }
.lt-player__progress { transition: none; }
/* Ring strokes stay 1.5px and 2px at any size: --ring-unit is 100 / the stage's width in px, set by breath.js. */
.lt-player__track { stroke-width: calc(1.5 * var(--ring-unit, 0.32)); }
.lt-player__progress { stroke-width: calc(2 * var(--ring-unit, 0.32)); }
/* Paused: dusk dims the light; dawn fades the orb back into the paper, which reads as dimmer on a light ground. */
:root[data-theme="dawn"] .lt-player .lt-orb--paused .lt-orb__body, :root[data-theme="light"] .lt-player .lt-orb--paused .lt-orb__body { filter: none; opacity: var(--orb-paused); }
.lt-player__time { min-height: 1.33em; margin-top: var(--space-2); opacity: 0; transition: opacity var(--dur-fade) var(--ease-fade); }
.lt-player__time.is-shown { opacity: 1; }
.lt-player__after { display: grid; justify-items: center; align-self: stretch; }
.lt-player__after > * { grid-area: 1 / 1; }
.lt-player__live { display: flex; flex-direction: column; align-items: center; align-self: stretch; transition: opacity var(--dur-hero-fade) var(--ease-fade); }
.lt-player__live .lt-player__cue, .lt-player__live .lt-player__caption { align-self: stretch; }
.lt-player.is-handoff .lt-player__ring { opacity: 0; }
.lt-player.is-handoff .lt-player__live, .lt-player.is-handoff > .lt-label { opacity: 0; }
.lt-player > .lt-label { transition: opacity var(--dur-hero-fade) var(--ease-fade); }
.lt-player.is-ending .lt-player__ring, .lt-player.is-ending .lt-player__live, .lt-player.is-ending > .lt-label, .lt-player.is-ending .lt-player__time { opacity: 0; }
.lt-player.is-ended .lt-player__stage { width: var(--orb-large); }
.lt-player.is-ended .lt-player__ring, .lt-player.is-ended .lt-player__live { visibility: hidden; }

.breath-end { display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--space-4); padding-top: var(--space-8); opacity: 0; transition: opacity var(--dur-hero-fade) var(--ease-fade); }
.breath-end.is-shown { opacity: 1; }
.breath-end .lt-h3 { max-width: 22ch; }
.breath-end .lt-h3:focus { outline: none; }
.breath-end .lt-lead { margin-top: calc(-1 * var(--space-2)); }
.breath-end .lt-cta { margin-top: var(--space-4); }

.sound { position: relative; }
.sound__menu { position: absolute; z-index: var(--z-player); bottom: calc(100% + var(--space-2)); left: 50%; transform: translateX(-50%);
  display: flex; flex-direction: column; min-width: 10.5rem; padding: var(--space-1); border-radius: var(--radius-lg);
  background: var(--surface-2); box-shadow: var(--lit-edge-active); text-align: left; }
.sound__menu button { appearance: none; border: 0; background: none; cursor: pointer; display: flex; align-items: center; gap: var(--space-2);
  min-height: var(--touch-min); padding: 0 var(--space-4) 0 var(--space-3); border-radius: var(--radius-sm); color: var(--text-primary);
  font: 500 0.9375rem/1.33 var(--font-rounded); text-align: left; }
.sound__menu button:hover { background: var(--surface-1); }
.sound__menu button .lt-check { width: 16px; height: 16px; flex: none; color: var(--toggle-on); visibility: hidden; }
.sound__menu button[aria-checked="true"] .lt-check { visibility: visible; }
.sound__note { margin-top: var(--space-3); max-width: 28rem; }

@media (prefers-reduced-motion: reduce) {
  .lt-player .lt-orb__body, .lt-player.is-settling .lt-orb__body { transform: none !important; transition: filter 1s var(--ease-fade); }
  .lt-player.is-settling .lt-orb__pool { transform: none; }
  .lt-player__stage { transition: none; }
  .hero__intro, .hero__text > *, .lt-player__live, .breath-end, .lt-player__ring { transition-duration: var(--dur-fade); }
}

/* ------------------------------------------------------------------ prototype-only panel (not in the production pages) */
.proto-panel { border-top: 1px solid var(--line); padding-block: var(--space-6) calc(var(--space-6) + env(safe-area-inset-bottom, 0px)); }
.proto-panel .lt-container { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3) var(--space-6); }
.proto-panel .lt-segmented { flex-wrap: wrap; }