/* 旧版 AI 图鉴接入个人网站时的最小适配：不改变视觉语言。 */
body { overflow-x: hidden; }
.legacy-nav-actions { display: flex; align-items: center; gap: 14px; }
.legacy-site-link { color: var(--ink-soft); text-decoration: none; transition: color .15s; }
.legacy-site-link:hover { color: var(--accent); }
.legacy-site-link[aria-current="page"] { color: var(--ink); font-weight: 600; }
.legacy-logo { width: 26px; height: 26px; display: block; flex: 0 0 26px; border-radius: 50%; box-shadow: 0 0 0 1px rgba(2,22,45,.08); }
.legacy-home, .legacy-section { display: inline-flex; align-items: center; gap: 8px; color: inherit; text-decoration: none; }
.legacy-home:hover, .legacy-section:hover { color: var(--accent); }
.legacy-sep { color: var(--ink-mute); font-weight: 400; }
.brand .b-ic, .brand .brand-dot { display: none !important; }
.mn-site { font-family: var(--mono); font-size: 12px; color: var(--ink-soft); text-decoration: none; display: flex; align-items: center; gap: 7px; white-space: nowrap; }
.mn-site:hover { color: var(--accent); }
.mn-site .dot { width: 24px !important; height: 24px !important; border-radius: 50%; background: url('../assets/ce-logo.svg') center / contain no-repeat !important; box-shadow: 0 0 0 1px rgba(2,22,45,.08); flex: 0 0 24px; }
.mn-switch { font-family: var(--mono); font-size: 11px; color: var(--ink-mute); text-decoration: none; white-space: nowrap; }
.mn-switch:hover { color: var(--accent); }

@media (max-width: 900px) {
  .layout { grid-template-columns: minmax(0, 1fr) !important; }
  .layout > .card.info { grid-column: 1 !important; }
  .side { height: auto !important; }
  .side > .card { min-height: 380px; }
  .workspace { max-width: 100%; }
}

@media (max-width: 620px) {
  .wrap { padding-left: 18px !important; padding-right: 18px !important; }
  .topbar .in, .topbar-inner { align-items: flex-start; flex-direction: column; gap: 10px; }
  .topbar .meta, .legacy-nav-actions { width: 100%; justify-content: space-between; font-size: 10px; }
  .nav-tabs { width: 100%; overflow-x: auto; flex-wrap: nowrap !important; padding-bottom: 2px; }
  .nav-tab { white-space: nowrap; }
  .hero { padding-top: 54px !important; }
  .hero h1 { font-size: 48px !important; }
  .comp-grid, .comp-grid.wide { grid-template-columns: minmax(0, 1fr) !important; }
  .comp-card { min-width: 0; }

  .modnav .in { padding: 10px 16px !important; gap: 8px !important; }
  .mn-site span:last-child { display: none; }
  .mn-home { font-size: 11px !important; white-space: nowrap; }
  .mn-switch { font-size: 0; }
  .mn-switch::after { content: '组件'; font-size: 10px; }
  .mn-tabs { gap: 3px !important; flex-wrap: nowrap !important; overflow-x: auto; }
  .mn-t { width: 25px !important; height: 25px !important; flex: 0 0 25px; }
  header.top { padding: 28px 16px 12px !important; }
  header.top h1 { font-size: 38px !important; }
  .creed { align-items: flex-start !important; border-radius: 12px !important; }
  .layout { padding: 12px 16px 32px !important; }
  .workspace { height: 500px !important; }
  .side > .card { min-height: 360px; }
  .info-below { padding: 4px 16px 36px !important; }
  .info { padding: 18px !important; }
  .info-grid { grid-template-columns: minmax(0, 1fr) !important; }
  .info-grid .cell { padding: 13px 0 !important; border-left: 0 !important; border-top: 1px dashed var(--line) !important; }
  .info-grid .cell:first-child { border-top: 0 !important; }
  .modfoot .in { padding: 20px 16px 36px !important; }
  .mf-link.nx { margin-left: 0 !important; }
}