@media (min-width: 901px) {
  .lz-bottom-nav.cosmic-bottom-nav {
    display: none;
  }
}

@media (max-width: 1180px) {
  .lz-home-layout {
    grid-template-columns: minmax(0, 2.25fr) minmax(270px, .85fr);
  }

  .lz-feature-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .lz-feature-card-chat {
    grid-column: span 1;
  }

  .lz-dashboard-hero {
    grid-template-columns: minmax(0, 1.25fr) minmax(230px, .75fr);
  }

}

@media (max-width: 900px) {
  :root {
    --lz-header-height: 64px;
    --lz-bottom-height: 72px;
  }

  .lz-page-shell.cosmic-page {
    padding: 0;
  }

  .lz-device-shell.cosmic-device {
    width: 100%;
    min-height: 100vh;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  .lz-brandbar.cosmic-brandbar {
    min-height: var(--lz-header-height);
    padding: 8px 16px;
  }

  .lz-home-body .lz-brandbar.cosmic-brandbar {
    box-sizing: border-box;
    height: var(--lz-home-header-height);
    min-height: var(--lz-home-header-height);
    padding: max(7px, env(safe-area-inset-top, 0px)) 16px 7px;
  }

  .lz-home-body .lz-brand-mark {
    width: 44px;
    height: 44px;
  }

  .lz-brand-mark {
    width: 48px;
    height: 48px;
  }

  .lz-brand .brand-title {
    font-size: .98rem;
  }

  .lz-brand .brand-subtitle {
    display: none;
  }

  .lz-member-link.cosmic-member {
    min-width: 44px;
    min-height: 44px;
    padding: 8px 12px;
  }

  .lz-member-link span {
    font-size: .78rem;
  }

  .lz-main.cosmic-main {
    padding: 20px 18px calc(var(--lz-bottom-height) + 28px + env(safe-area-inset-bottom));
  }

  .lz-bottom-nav.cosmic-bottom-nav {
    left: 50%;
    z-index: 150;
    width: 100%;
    min-height: var(--lz-bottom-height);
    padding: 7px 12px calc(7px + env(safe-area-inset-bottom));
    border-radius: 22px 22px 0 0;
    transform: translateX(-50%);
    transition: transform var(--lz-transition), opacity var(--lz-transition), visibility var(--lz-transition);
  }

  body.lz-keyboard-open .lz-bottom-nav.cosmic-bottom-nav {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, 110%);
  }

  .lz-brand-scroll-world {
    text-align: center;
  }

  .lz-brand-scroll-world-stage {
    align-items: end;
    padding: clamp(270px, 48dvh, 430px) 18px calc(var(--lz-bottom-height) + 70px + env(safe-area-inset-bottom));
  }

  .lz-brand-scroll-world-stage::after {
    background: linear-gradient(180deg, transparent 25%, rgba(220, 231, 214, .18) 44%, rgba(220, 231, 214, .8) 68%, rgba(220, 231, 214, .98) 100%);
  }

  .lz-brand-scroll-world-poster img {
    object-position: center top;
  }

  .lz-brand-scroll-world-copy {
    width: min(100%, 530px);
    margin-inline: auto;
  }

  .lz-brand-scroll-world-copy h1 {
    font-size: clamp(1.9rem, 8vw, 3.1rem);
  }

  .lz-brand-scroll-world-copy > p:not(.lz-eyebrow) {
    margin-top: 12px;
    font-size: .92rem;
    line-height: 1.6;
  }

  .lz-brand-scroll-world-copy .lz-intro-actions {
    justify-content: center;
    margin-top: 17px;
  }

  .lz-cinematic-toggle {
    top: 12px;
    right: max(12px, env(safe-area-inset-right, 0px));
    bottom: auto;
    min-height: 42px;
    padding: 8px 12px;
    font-size: .78rem;
  }

  .lz-home-explore {
    bottom: calc(var(--lz-bottom-height) + 8px + env(safe-area-inset-bottom, 0px));
    min-width: 190px;
    padding-inline: 13px;
    background: rgba(255, 253, 248, .64);
  }

  .lz-home-explore__label--desktop { display: none; }
  .lz-home-explore__label--mobile { display: inline; }

  .lz-home-dashboard {
    padding: 16px 16px calc(var(--lz-bottom-height) + 76px + env(safe-area-inset-bottom));
    background:
      linear-gradient(180deg, rgba(255, 235, 220, .2), rgba(250, 245, 236, .52)),
      url("/static/images/lingzhi-redesign/v3/backgrounds/mobile-coral-4k.webp") top center / 100% auto no-repeat,
      #f8f1e7;
  }

  .lz-home-layout {
    grid-template-columns: 1fr;
  }

  .lz-dashboard-hero {
    display: block;
    min-height: 280px;
  }

  .lz-dashboard-copy {
    max-width: 60%;
    padding: 28px;
  }

  .lz-dashboard-copy h2 {
    font-size: clamp(1.75rem, 6vw, 2.4rem);
  }

  .lz-dashboard-art {
    inset: 0;
  }

  .lz-feature-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .lz-feature-card-chat {
    grid-column: span 2;
  }

  .lz-home-aside {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .lz-energy-card,
  .lz-home-recommend-card {
    min-width: 0;
  }

  .lz-energy-card {
    grid-row: span 2;
  }

  .lz-admin-nav .container {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 10px;
  }

  .lz-admin-nav .lz-brand {
    margin-right: auto;
  }

  .lz-admin-nav .lz-admin-home {
    margin-right: 0;
    font-size: .95rem;
  }

  .lz-admin-nav .navbar-collapse {
    flex-basis: 100%;
    overflow-x: auto;
  }

  body.lz-site .table-responsive,
  body.lz-site .cosmic-table-wrap {
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
  }
}

@media (min-width: 801px) and (max-width: 1018px) {
  .lz-form-world .lz-form-layout {
    grid-template-columns: minmax(190px, .72fr) minmax(0, 1.7fr);
    gap: clamp(14px, 1.8vw, 20px);
  }

  .lz-form-world .lz-form-visual {
    min-height: 560px;
    padding-inline: clamp(14px, 2vw, 22px);
  }

  .lz-form-world .lz-form-panel {
    min-width: 0;
    padding-inline: clamp(16px, 2.2vw, 24px);
  }

  .lz-form-world .lz-form-assurance {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
  }

  .lz-form-world .lz-form-assurance__card {
    min-height: 88px;
  }
}

@media (max-width: 800px) {
  body.lz-site {
    --lz-site-background-image: url("/static/images/lingzhi-redesign/v3/backgrounds/mobile-quiet-sage-4k.webp");
  }

  .lz-chat-page {
    margin-inline: 0;
    padding-bottom: env(safe-area-inset-bottom, 0px);
    overflow-x: clip;
  }

  .lz-chat-page-background img {
    object-position: center top;
  }

  .lz-chat-page .lz-chat-hero {
    padding-top: max(16px, env(safe-area-inset-top, 0px));
    padding-right: max(16px, env(safe-area-inset-right, 0px));
    padding-left: max(16px, env(safe-area-inset-left, 0px));
  }

  .lz-form-world {
    --lz-form-mobile-visual-height: clamp(520px, 76dvh, 720px);
    --lz-form-mobile-art-overscan: clamp(110px, 14dvh, 132px);
    max-width: 100%;
    overflow-x: clip;
  }

  .lz-form-world-picture {
    position: absolute;
    inset: 0 0 auto;
    height: var(--lz-form-mobile-visual-height);
    overflow: hidden;
  }

  .lz-form-world-picture img {
    position: absolute;
    top: calc(0px - var(--lz-form-mobile-art-overscan));
    left: 0;
    width: 100%;
    height: calc(100% + var(--lz-form-mobile-art-overscan));
    object-fit: contain;
    object-position: center top;
    transform: none;
  }

  .lz-form-world-picture::after {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 0 54%, rgba(238, 242, 231, .5) 76%, var(--lz-form-world-base) 100%);
    content: "";
    pointer-events: none;
  }

  .lz-form-world::before {
    background: linear-gradient(180deg, rgba(247, 249, 242, .12) 0 24%, rgba(251, 248, 239, .54) 52%, var(--lz-form-world-base) 78%);
  }

  .lz-form-world .lz-form-layout {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }

  .lz-form-world__art,
  .lz-form-page--bazi .lz-form-world__art {
    display: none;
  }

  .lz-form-world .lz-form-panel {
    position: relative;
    z-index: 1;
    width: 100%;
    min-width: 0;
    background: linear-gradient(180deg, rgba(255, 252, 244, .58) 0, rgba(255, 252, 244, .72) 42%, rgba(255, 252, 244, .9) 100%);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
  }

  .lz-form-world .lz-field {
    background: rgba(255, 255, 255, .9);
  }

  .lz-form-world .lz-form-assurance {
    position: relative;
    z-index: 1;
    width: 100%;
    min-width: 0;
  }

  .lz-reading-world,
  .lz-reading-world-picture {
    max-width: 100%;
  }

  .lz-reading-world-picture img {
    object-position: center top;
  }
}

@media (max-width: 640px) {
  .lz-brand-mark {
    width: 44px;
    height: 44px;
  }

  .lz-brand .brand-title {
    font-size: .9rem;
  }

  .lz-member-link span {
    display: none;
  }

  .lz-member-link.cosmic-member {
    border-radius: 50%;
  }

  .lz-brand-scroll-world-copy .lz-eyebrow {
    margin-bottom: 9px;
  }

  .lz-intro-actions {
    flex-wrap: nowrap;
    gap: 10px;
  }

  .lz-intro-actions .lz-button {
    flex: 1 1 0;
    min-width: 0;
    max-width: 190px;
    padding-inline: 14px;
  }

  .lz-dashboard-hero {
    display: block;
    min-height: 210px;
  }

  .lz-dashboard-hero::after {
    background: linear-gradient(90deg, rgba(255, 248, 238, .82) 0%, rgba(255, 248, 238, .58) 42%, rgba(255, 248, 238, .06) 72%);
  }

  .lz-dashboard-copy {
    max-width: 64%;
    padding: 20px 18px;
  }

  .lz-dashboard-copy h2 {
    max-width: 230px;
    font-size: 1.42rem;
    line-height: 1.25;
  }

  .lz-dashboard-copy > p:not(.lz-eyebrow) {
    display: none;
  }

  .lz-dashboard-actions {
    display: none;
  }

  .lz-dashboard-art {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 1;
  }

  .lz-dashboard-art img {
    object-position: center 41%;
  }

  .lz-dashboard-mascot {
    top: 7px;
    right: 4px;
    width: 76px;
  }

  .lz-feature-card {
    min-height: 96px;
    padding: 14px;
  }

  .lz-feature-icon {
    width: 42px;
    height: 42px;
  }

  .lz-feature-card > i:last-child {
    display: none;
  }

  .lz-feature-card strong {
    white-space: normal;
  }

  .lz-trust-strip {
    grid-template-columns: 1fr;
  }

  .lz-home-aside {
    grid-template-columns: 1fr;
  }

  .lz-energy-card {
    grid-row: auto;
  }

  .lz-account-glance {
    align-items: flex-start;
  }

  .lz-side-card {
    padding: 17px;
  }

  body.lz-site .form-row-2,
  body.lz-site .feature-grid,
  body.lz-site .metric-grid,
  body.lz-site .recommend-grid {
    grid-template-columns: 1fr;
  }

  body.lz-site .hero-actions,
  body.lz-site .cosmic-actions {
    gap: 10px;
  }
}

@media (max-width: 380px) {
  .lz-brand-scroll-world-stage {
    padding-inline: 14px;
    padding-top: clamp(230px, 44dvh, 340px);
  }

  .lz-brand-scroll-world-copy h1 {
    font-size: 1.85rem;
  }

  .lz-intro-actions .lz-button {
    font-size: .82rem;
  }

  .lz-feature-grid {
    gap: 9px;
  }

  .lz-feature-card {
    gap: 8px;
    padding: 11px;
  }

  .lz-feature-icon {
    width: 38px;
    height: 38px;
  }
}

@media (max-width: 430px) and (max-height: 840px) {
  .lz-brand-scroll-world-stage {
    padding-top: clamp(190px, 31dvh, 240px);
    padding-right: 14px;
    padding-bottom: calc(var(--lz-bottom-height) + 58px + env(safe-area-inset-bottom));
    padding-left: 14px;
  }

  .lz-brand-scroll-world-copy .lz-eyebrow {
    margin-bottom: 5px;
    font-size: .7rem;
  }

  .lz-brand-scroll-world-copy h1 {
    font-size: 1.7rem;
    line-height: 1.12;
  }

  .lz-brand-scroll-world-copy > p:not(.lz-eyebrow) {
    margin-top: 7px;
    font-size: .8rem;
    line-height: 1.42;
  }

  .lz-brand-scroll-world-copy .lz-intro-actions {
    gap: 8px;
    margin-top: 10px;
  }

  .lz-intro-actions .lz-button {
    min-height: 40px;
    padding: 8px 10px;
    font-size: .8rem;
  }

  .lz-cinematic-toggle {
    top: 8px;
    min-height: 40px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .lz-dashboard-mascot {
    animation: none;
  }
}
