/* Local image-only navigation: AI Lab is not exposed on desktop or mobile. */
button[aria-label="AI Lab 一键反推提示词"],
button[title="AI Lab 一键反推提示词"],
button[data-tooltip="AI Lab · 一键反推提示词"] {
  display: none !important;
}

.home-tools-stack:has(> button[aria-label="AI Lab 一键反推提示词"]) {
  display: none !important;
}

/* Local mobile preview: image-only, compact, and aligned with the desktop visual language. */
@media (max-width: 767px) {
  :root {
    --mobile-page-gutter: 16px;
    --mobile-border: #e4e7eb;
    --mobile-muted: #6b7280;
  }

  html,
  body,
  #root,
  .home-page {
    min-width: 0 !important;
    width: 100% !important;
    overflow-x: hidden !important;
  }

  .home-page {
    background: #f7f8fa !important;
    padding-bottom: calc(76px + env(safe-area-inset-bottom)) !important;
  }

  .home-topbar {
    position: sticky !important;
    top: 0 !important;
    z-index: 40 !important;
    display: flex !important;
    min-height: 54px !important;
    height: 54px !important;
    padding: 0 var(--mobile-page-gutter) !important;
    border-bottom: 1px solid var(--mobile-border) !important;
    background: rgba(255, 255, 255, 0.96) !important;
    backdrop-filter: blur(12px) !important;
  }

  .home-brand img,
  .home-brand-logo,
  .home-topbar-logo {
    max-width: 86px !important;
    max-height: 28px !important;
  }

  .home-topbar-actions {
    gap: 8px !important;
  }

  .home-member-button {
    display: none !important;
  }

  .home-auth-login-button {
    min-width: 58px !important;
    height: 34px !important;
    padding: 0 15px !important;
    border-radius: 7px !important;
    font-size: 13px !important;
  }

  .home-main {
    width: 100% !important;
    padding: 0 var(--mobile-page-gutter) !important;
  }

  .home-hero {
    width: 100% !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 24px 0 22px !important;
    gap: 12px !important;
  }

  .home-hero h1 {
    max-width: 330px !important;
    margin: 0 auto !important;
    font-size: 24px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
  }

  .model-update-banner {
    max-width: 100% !important;
    height: 32px !important;
    padding: 0 10px !important;
    border-radius: 6px !important;
    font-size: 12px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
  }

  .model-update-banner > *:not(:first-child):not(:last-child) {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .hero-composer {
    width: 100% !important;
    min-height: 218px !important;
    height: auto !important;
    margin: 0 !important;
    padding: 14px 12px 12px !important;
    border: 1px solid #d9dde3 !important;
    border-radius: 8px !important;
    background: #fff !important;
    box-shadow: 0 8px 24px rgba(17, 24, 39, 0.06) !important;
  }

  .home-creation-modes,
  .ip-mode-control {
    display: none !important;
  }

  .hero-composer textarea {
    min-height: 78px !important;
    padding: 0 !important;
    font-size: 15px !important;
    line-height: 1.55 !important;
  }

  .hero-upload-button,
  .hero-upload-tile {
    width: 44px !important;
    height: 44px !important;
    border-radius: 7px !important;
  }

  .hero-composer-footer,
  .hero-composer-toolbar {
    gap: 8px !important;
    align-items: center !important;
  }

  .hero-param-chip {
    min-width: 0 !important;
    height: 36px !important;
    padding: 0 10px !important;
    border-radius: 7px !important;
    font-size: 13px !important;
  }

  .hero-param-chip.model-chip {
    max-width: 154px !important;
    flex: 1 1 128px !important;
  }

  .hero-optimize-button {
    width: 36px !important;
    height: 36px !important;
    border-radius: 7px !important;
  }

  .hero-generate-button {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    border-radius: 50% !important;
    background: #101114 !important;
  }

  .home-primary-skills,
  .primary-skill-list,
  .home-skill-pills,
  .home-skill-chips {
    display: flex !important;
    flex-wrap: nowrap !important;
    grid-template-columns: none !important;
    height: auto !important;
    width: calc(100vw - 32px) !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    overflow-x: auto !important;
    padding: 2px 0 6px !important;
    scrollbar-width: none !important;
  }

  .home-primary-skills::-webkit-scrollbar,
  .primary-skill-list::-webkit-scrollbar,
  .home-skill-pills::-webkit-scrollbar,
  .home-skill-chips::-webkit-scrollbar {
    display: none !important;
  }

  .primary-skill-pill-tooltip {
    flex: 0 0 auto !important;
    width: auto !important;
  }

  .primary-skill-pill {
    flex: 0 0 auto !important;
    width: auto !important;
    height: 34px !important;
    padding: 0 12px !important;
    border-radius: 7px !important;
    font-size: 13px !important;
    white-space: nowrap !important;
  }

  .home-credit-hint {
    margin-top: 0 !important;
    font-size: 12px !important;
  }

  .home-template-section,
  .home-inspiration-section {
    width: 100% !important;
    padding: 22px 0 0 !important;
    border-top: 1px solid var(--mobile-border) !important;
  }

  .home-template-section h2,
  .home-inspiration-section h2 {
    margin: 0 0 14px !important;
    font-size: 19px !important;
    line-height: 1.35 !important;
    letter-spacing: 0 !important;
  }

  .home-template-grid,
  .home-inspiration-grid {
    width: 100% !important;
    column-count: 2 !important;
    column-gap: 10px !important;
  }

  .home-template-card {
    margin: 0 0 10px !important;
    border-radius: 8px !important;
    overflow: hidden !important;
  }

  .home-mobile-nav,
  .mobile-bottom-nav {
    left: 10px !important;
    right: 10px !important;
    bottom: calc(8px + env(safe-area-inset-bottom)) !important;
    width: auto !important;
    min-height: 56px !important;
    padding: 4px 8px !important;
    border: 1px solid var(--mobile-border) !important;
    border-radius: 8px !important;
    background: rgba(255, 255, 255, 0.97) !important;
    box-shadow: 0 8px 24px rgba(17, 24, 39, 0.12) !important;
    backdrop-filter: blur(14px) !important;
  }

  .home-mobile-nav button,
  .mobile-bottom-nav button {
    min-width: 64px !important;
    height: 48px !important;
    border-radius: 7px !important;
    font-size: 11px !important;
  }

  .home-mobile-nav button[aria-label="AI Lab"],
  .mobile-bottom-nav button[aria-label="AI Lab"] {
    display: none !important;
  }
}