/* Only loaded by Landing 2. Keep the original page and scroll geometry intact. */
#root .landing-hero h1 .landing-title-intro { display: block; padding-right: .25em; }
#root .landing-hero h1 .landing-title-intro > .landing-title-lia { margin-left: .5em; }
#root .landing-hero h1 .landing-title-copy { display: block; margin-top: .18em; }
#root .landing-two-intro-name { opacity: 1; transition: opacity .18s ease; }
/* Keep its space so fading the name never shifts the heading or LIA's path.
   Returning to the first dock restores the opening sentence. */
#root .crece-title-journey[data-gravity-journey] .landing-title-intro:has([data-crece-journey-stop="intro"]:not([data-crece-journey-docked])) .landing-two-intro-name { opacity: 0; }
#root .liai-core {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  overflow: visible !important;
  isolation: auto;
}
#root .liai-core::before,
#root .liai-core::after,
#root .liai-core > .crece-brand-core-lettering,
#root .liai-core > .liai-core-halo,
#root .liai-core > .liai-core-status { display: none !important; }
#root .landing-bubble-screen.liai-shell {
  background: radial-gradient(ellipse at 50% 42%, #fff9ef 0%, #f7f0e7 55%, #efe7dd 100%);
  color: #483329;
  padding-bottom: 24px;
}
#root .landing-bubble-header .liai-brand,
#root .landing-bubble-header .demo-place,
#root .landing-bubble-language { color: #674c3b; }
#root .landing-bubble-screen .bubble-orbit.bubble-orbit {
  width: 100%; height: 410px !important; min-height: 410px;
  margin: 12px auto 4px; overflow: visible;
}
#root .landing-bubble-phone .liai-ring,
#root .landing-bubble-phone .bubble-orbit-center-label { display: none !important; }
#root .landing-bubble-phone .bubble-orbit-center {
  left: 50% !important; top: 49% !important;
  width: 112px; height: 144px;
  transform: translate(-50%, -50%) !important;
}
#root .landing-bubble-phone .bubble-orbit-slot {
  left: var(--demo-x) !important; top: var(--demo-y) !important;
  width: clamp(78px, 26%, 108px) !important;
  transform: translate(-50%, -50%) !important;
}
#root .landing-bubble-phone .bubble-orbit-slot:nth-of-type(2) { --demo-x: 29%; --demo-y: 13%; }
#root .landing-bubble-phone .bubble-orbit-slot:nth-of-type(3) { --demo-x: 71%; --demo-y: 15%; }
#root .landing-bubble-phone .bubble-orbit-slot:nth-of-type(4) { --demo-x: 15%; --demo-y: 49%; }
#root .landing-bubble-phone .bubble-orbit-slot:nth-of-type(5) { --demo-x: 85%; --demo-y: 51%; }
#root .landing-bubble-phone .bubble-orbit-slot:nth-of-type(6) { --demo-x: 28%; --demo-y: 83%; }
#root .landing-bubble-phone .bubble-orbit-slot:nth-of-type(7) { --demo-x: 72%; --demo-y: 85%; }
#root .landing-bubble-phone .liai-bubble {
  width: 100% !important; height: auto !important; min-height: 0 !important;
  aspect-ratio: 1; padding: 10px 8px !important;
  background: radial-gradient(circle at 32% 22%, #fff, #fff8f0e6 60%, #e8d8c9e6) !important;
  border: 1px solid #bda4898a !important;
  box-shadow: inset 0 2px 3px #fff, inset 0 -3px 8px #ba977826, 0 7px 13px #70513d16 !important;
  color: #4b3427 !important;
}
#root .landing-bubble-phone .liai-bubble::before { filter: none !important; opacity: .25; }
#root .landing-bubble-phone .liai-bubble strong,
#root .landing-bubble-phone .liai-bubble small {
  color: #4b3427 !important; -webkit-text-fill-color: #4b3427 !important;
  font-size: 14px !important; line-height: 1.2; font-weight: 650; text-shadow: none;
}
#root .landing-bubble-phone .liai-bubble:focus-visible,
#root .landing-bubble-phone .liai-core:focus-visible { outline: 3px solid #986a34; outline-offset: 4px; }
#root .landing-bubble-phone .liai-bubble[aria-pressed=true] { outline-color: #986a34; }
#root .landing-bubble-phone .demo-answer {
  background: #fffaf3; border: 1px solid #cdb697; box-shadow: none;
}
#root .landing-bubble-phone .demo-answer > b { color: #8b6343; }
#root .landing-bubble-phone .demo-answer > p { color: #493429; }
/* The app renderer clips and feathers the silhouette to alpha. Never display
   its opaque source texture as an image or a CSS background. */
#root .landing-two-character,
#root .landing-two-still {
  position: absolute; display: block; width: 114%; height: auto;
  aspect-ratio: 680 / 820; max-width: none;
  left: 50%; top: 50%; transform: translate(-50%, -50%);
  border: 0; border-radius: 0; background: transparent;
  pointer-events: none; z-index: 5;
}
#root .landing-two-character-body { position: absolute; inset: 0; display: block; transform-origin: center; }
#root .landing-two-character-body canvas { width: 100%; height: 100%; display: block; background: transparent; }
#root .landing-two-character-shadow,
#root .landing-two-character-snores { display: none; }
#root .liai-core[data-two-live] > .landing-two-still { display: none; }
#root .landing-bubble-phone .landing-two-name {
  position: absolute; top: calc(50% + 83px); left: 50%; transform: translateX(-50%);
  font: 600 14px/1.2 GravityQuicksand, sans-serif; color: #70513d;
}
#root .landing-bubble-phone[data-demo-view=menu] .bubble-orbit-slot:nth-of-type(2) { --demo-x: 24%; --demo-y: 15%; }
#root .landing-bubble-phone[data-demo-view=menu] .bubble-orbit-slot { width: clamp(90px, 32%, 120px) !important; }
#root .landing-bubble-phone .liai-bubble strong { overflow-wrap: anywhere; }
#root .landing-bubble-phone[data-demo-view=menu] .bubble-orbit-slot:nth-of-type(3) { --demo-x: 76%; --demo-y: 15%; }
#root .landing-bubble-phone[data-demo-view=menu] .bubble-orbit-slot:nth-of-type(4) { --demo-x: 50%; --demo-y: 85%; }
@media (max-width: 380px) {
  #root .landing-bubble-phone .landing-two-character { width: 104%; }
  #root .landing-bubble-phone .liai-bubble strong,
  #root .landing-bubble-phone .liai-bubble small { font-size: 13px !important; }
}
@media (prefers-reduced-motion: reduce) {
  #root .landing-two-intro-name { transition: none; }
  #root .landing-bubble-phone .liai-bubble,
  #root .landing-bubble-phone .liai-core { animation: none !important; }
}
