/* ==========================================================
   手机 / 平板 适配（PC 端不受影响）
   手机：单列大字号、卡片满宽、底部导航、管理员表格转卡片
   ========================================================== */

/* ---------- 平板 ---------- */
@media (max-width: 1024px) {
  .series-grid { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; }
  .product-grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
  .method-card { max-width: 100%; margin-left: 16px; margin-right: 16px; }
  .hero-text h1 { font-size: 34px; }
  .hero-text { padding: 40px 16px 40px 32px; }
}

/* ---------- 手机 ---------- */
@media (max-width: 760px) {
  body { padding-bottom: 66px; -webkit-tap-highlight-color: transparent; }
  .topbar-inner { padding: 9px 13px; gap: 10px; }
  .logo-dot { width: 30px; height: 30px; border-radius: 9px; font-size: 15px; }
  .brand-name { font-size: 16.5px; letter-spacing: .5px; }
  .brand-sub { font-size: 9.5px; letter-spacing: 1.5px; }
  .topnav { gap: 2px; }
  .topnav a { padding: 7px 9px; font-size: 12.5px; }
  .topnav a.admin-link { font-size: 12px; }

  /* 首屏海报（移动端：图在上，竖排标题改横排，数据四列） */
  .hb-wrap { margin: 12px auto 0; padding: 0 12px; }
  .hb { flex-direction: column; height: auto; border-radius: 18px; }
  .hb-pic { width: 100%; height: 156px; }
  .hb-pic::after { background: linear-gradient(180deg, rgba(246,236,217,0) 42%, #f6ecd9 100%); }
  .hb-mid { width: 100%; flex-direction: row; align-items: center; gap: 12px; padding: 8px 16px 0; }
  .hb-vert { writing-mode: horizontal-tb; font-size: 20px; letter-spacing: 1px; height: auto; line-height: 1.3; }
  .hb-vert em::before { content: " · "; }
  .hb-mid-bot { flex-direction: row; align-items: center; gap: 8px; }
  .hb-seal { width: 42px; height: 42px; font-size: 11px; border-radius: 7px; line-height: 1.2; }
  .hb-note { font-size: 9.5px; letter-spacing: .5px; margin-top: 0; }
  .hb-right { padding: 10px 16px 18px; }
  .hb-kicker { font-size: 10.5px; letter-spacing: 1px; padding: 3px 10px; }
  .hb-h1 { font-size: 19px; margin-top: 9px; }
  .hb-p { font-size: 12px; line-height: 1.85; }
  .hb-btns { gap: 9px; margin-top: 12px; }
  .hb-cta { padding: 9px 16px; font-size: 12.5px; }
  .hb-ghost { padding: 8px 14px; font-size: 12px; }
  .hb-divider { margin: 13px 0 10px; }
  .hb-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
  .hb-stats .n b { font-size: 20px; }
  .hb-stats .n b i { font-size: 11px; }
  .hb-stats .n span { font-size: 10px; letter-spacing: 0; margin-top: 2px; }
  .hb-note2 { font-size: 10.5px; margin-top: 8px; }

  .hero { margin-top: 12px; padding: 0 12px; }
  .hero-card { border-radius: 18px; }
  .hero-flex { flex-direction: column-reverse; }
  .hero-text { padding: 20px 18px 24px; flex: none; }
  .hero-text h1 { font-size: 25px; line-height: 1.32; margin: 12px 0 9px; letter-spacing: 1px; }
  .hero-text p { font-size: 13px; line-height: 1.8; }
  .hero-kicker { font-size: 11px; padding: 4px 10px; letter-spacing: 1px; }
  .hero-btns { margin-top: 16px; gap: 10px; }
  .btn-main, .btn-ghost { padding: 11px 18px; font-size: 13.5px; text-align: center; }
  .hero-img { min-height: 190px; flex: none; }
  .hero-img::after { background: linear-gradient(180deg, rgba(107,69,38,0) 55%, #4d3521 100%); }

  .section { margin-top: 28px; padding: 0 12px; }
  .sec-head { gap: 8px; margin-bottom: 12px; }
  .sec-head .bar { width: 6px; height: 20px; }
  .sec-head h2 { font-size: 19px; }
  .sec-head span { font-size: 10px; letter-spacing: 1.5px; }

  .strength-stats { grid-template-columns: repeat(2, 1fr); gap: 9px; }
  .stat-card { padding: 14px 8px; border-radius: 14px; }
  .stat-card b { font-size: 25px; }
  .stat-card b i { font-size: 12px; }
  .stat-card span { font-size: 11.5px; margin-top: 3px; }
  .strength-grid { grid-template-columns: 1fr; gap: 9px; margin-top: 9px; }
  .str-card { padding: 15px 16px; border-radius: 14px; }
  .str-card .ico { width: 34px; height: 34px; border-radius: 10px; font-size: 16px; }
  .str-card h3 { font-size: 15px; margin: 9px 0 6px; }
  .str-card p { font-size: 12.5px; line-height: 1.75; }

  .series-grid { grid-template-columns: repeat(2, 1fr); gap: 9px; }
  .series-card { border-radius: 14px; }
  .series-cover { height: 92px; }
  .series-cover .cnt { font-size: 9px; padding: 3px 7px; right: 6px; top: 6px; }
  .series-body { padding: 9px 10px 11px; }
  .series-body h3 { font-size: 14px; }
  .series-body p {
    font-size: 11px; line-height: 1.6; margin-top: 3px;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  }

  .crumb { margin-top: 12px; padding: 0 13px; font-size: 12px; white-space: nowrap; overflow-x: auto; }
  .product-grid { grid-template-columns: 1fr; gap: 10px; }
  .product-card { border-radius: 16px; }
  .product-card .pc-top { padding: 13px; gap: 11px; }
  .product-thumb { width: 62px; height: 62px; border-radius: 11px; }
  .pc-info h3 { font-size: 15.5px; }
  .pc-info .taste { font-size: 11.5px; }
  .pc-meta { padding: 0 13px 11px; gap: 6px; }
  .tag { font-size: 10.5px; padding: 3px 8px; }
  .pc-foot { padding: 10px 13px; }

  /* 应用方案卡片：手机端满宽 */
  .method-card {
    margin: 12px 0; border-radius: 0; border-left: none; border-right: none;
    padding: 18px 14px 0; box-shadow: none; max-width: 100%;
  }
  .mc-head { gap: 8px; }
  .mc-bar { width: 6px; margin-top: 4px; }
  .mc-dish { font-size: 22px; letter-spacing: .5px; }
  .mc-sub { gap: 7px; margin-top: 7px; }
  .mc-cat { font-size: 10.5px; padding: 3px 9px; border-radius: 6px; }
  .mc-subtxt { font-size: 10.5px; letter-spacing: 0; }
  .mc-badge .ver { font-size: 9.5px; padding: 3px 8px; letter-spacing: 1px; }
  .mc-badge p { font-size: 10px; line-height: 1.4; margin-top: 4px; }
  .mc-photo { margin-top: 12px; border-radius: 12px; }
  .mc-photo img { max-height: none; aspect-ratio: 4 / 3; }
  .mc-sec { margin-top: 16px; }
  .mc-sec-head { gap: 8px; }
  .mc-sec-label { font-size: 11.5px; padding: 5px 12px; letter-spacing: 1px; }
  .mc-ratio { font-size: 11px; padding: 6px 9px; border-radius: 8px; }
  .ings { margin-top: 10px; }
  .ing { flex: 1 1 28%; min-width: 74px; padding: 8px 3px; }
  .ing .n { font-size: 11.5px; }
  .ing .g { font-size: 17px; }
  .steps { gap: 8px; margin-top: 10px; }
  .step { padding: 10px 11px; gap: 9px; border-radius: 10px; }
  .step .num { width: 21px; height: 21px; font-size: 11.5px; }
  .step p { font-size: 12.5px; line-height: 1.75; }
  .mc-rec { flex: 1 1 100%; padding: 8px 11px; }
  .mc-rec .n { font-size: 12.5px; }
  .mc-rec .d { font-size: 11px; }
  .mc-pending { font-size: 11.5px; padding: 10px 12px; }
  .line-tabs { gap: 7px; margin-bottom: 12px; }
  .line-tab { padding: 7px 14px; font-size: 12.5px; }
  .line-tab i { font-size: 10.5px; }
  .line-hint { font-size: 11px; line-height: 1.7; margin: -4px 0 12px; }
  .line-tag { font-size: 10px; padding: 1px 7px; margin-left: 5px; }
  .line-tag.lg { font-size: 11.5px; padding: 3px 10px; margin-left: 6px; }
  .mc-note { font-size: 11px; padding: 9px 11px; }
  .mc-footer { margin: 18px -14px 0; border-radius: 0; padding: 13px 14px 15px; }
  .mcf-row .spec { font-size: 12px; }
  .mcf-price { font-size: 11.5px; }
  .mcf-price b { font-size: 21px; }
  .mcf-sub { flex-direction: column; gap: 5px; font-size: 11.5px; }
  .brand-bar { font-size: 11px; letter-spacing: 1.5px; margin-bottom: 20px; }

  /* 菜系大类分组 */
  .group-nav { gap: 6px; margin: -2px 0 16px; }
  .group-nav a { padding: 6px 11px; font-size: 12px; gap: 4px; }
  .group-nav a i { font-size: 10px; padding: 0 5px; }
  .group-block { margin-bottom: 20px; scroll-margin-top: 60px; }
  .gb-head { gap: 7px; margin-bottom: 8px; }
  .gb-head h3 { font-size: 15.5px; padding-left: 9px; }
  .gb-head h3::before { width: 3px; }
  .gb-head span { font-size: 10.5px; }

  /* 找菜搜索 / 菜品网格 / 菜品详情 */
  .search-input { padding: 12px 15px; font-size: 14px; border-radius: 14px; }
  .q-result { border-radius: 14px; padding: 6px 8px 10px; margin-top: 9px; }
  .qr-item { font-size: 13px; padding: 9px 8px; }
  .qr-item span { font-size: 10.5px; }
  .dish-grid { grid-template-columns: 1fr; gap: 8px; }
  .dish-card { border-radius: 14px; padding: 9px 11px; gap: 10px; }
  .dc-thumb { width: 52px; height: 52px; border-radius: 10px; }
  .dc-body h3 { font-size: 14.5px; }
  .dc-meta .tag { font-size: 10px; }
  .dc-go { font-size: 17px; }
  #dish-head { border-radius: 16px; padding: 16px 14px; }
  .dh-text h1 { font-size: 23px; letter-spacing: .5px; }
  .dh-sub { font-size: 12px; margin-top: 8px; line-height: 1.8; }
  .dh-hint { font-size: 11.5px; }
  .sauce-tabs { gap: 7px; margin-top: 12px; }
  .sauce-tab { padding: 8px 11px; font-size: 12.5px; border-radius: 11px; gap: 5px; }
  .sauce-tab .st-label { font-size: 10px; padding: 1px 6px; }
  .sauce-tab b { font-size: 14px; }
  .sauce-band { padding: 10px 12px; border-radius: 12px; margin-top: 12px; gap: 8px; }
  .sauce-band .sb-left b { font-size: 15px; }
  .sauce-band .sb-right { margin-left: 0; }
  .sauce-band .sb-taste { font-size: 11px; }
  .uses { padding: 11px 12px; border-radius: 12px; margin-top: 14px; }
  .uses-t { font-size: 11.5px; margin-bottom: 8px; }
  .uses-list { gap: 6px; }
  .use-chip { font-size: 11.5px; padding: 6px 9px; border-radius: 9px; gap: 5px; }
  .use-chip .uc-cui { font-size: 10px; padding: 1px 5px; }

  /* 管理员：表格转卡片 */
  .admin-wrap { padding: 0 12px; margin: 16px auto 30px; }
  .admin-stats { gap: 8px; margin: 12px 0; }
  .login-card { margin: 24px 12px; padding: 24px 18px; border-radius: 18px; }
  .adm-table-wrap { background: none; border: none; border-radius: 0; overflow: visible; }
  table.adm { min-width: 0; display: block; }
  table.adm thead { display: none; }
  table.adm tbody { display: block; }
  table.adm tr {
    display: block; background: #fff; border: 1px solid var(--line); border-radius: 14px;
    padding: 6px 12px 10px; margin-bottom: 10px;
  }
  table.adm td {
    display: flex; justify-content: space-between; align-items: flex-start; gap: 10px;
    padding: 8px 0; border-top: 1px dashed #f4ead6; font-size: 12.5px;
  }
  table.adm td:first-child { border-top: none; }
  table.adm td::before {
    content: attr(data-label); color: #a08363; font-weight: 600; font-size: 11.5px; flex: none; padding-top: 1px;
  }
  table.adm td:last-child { flex-direction: column; align-items: stretch; }
  table.adm td:last-child::before { margin-bottom: 4px; }
  .dish-line { font-size: 11.5px; }

  .pagefoot { margin-top: 34px; padding: 22px 16px calc(22px + env(safe-area-inset-bottom)); font-size: 11.5px; }
}

/* ---------- 手机底部导航（PC 隐藏） ---------- */
.mobile-tabbar { display: none; }
@media (max-width: 760px) {
  .mobile-tabbar {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 80;
    display: flex; background: rgba(255, 252, 245, 0.97);
    backdrop-filter: blur(10px); border-top: 1px solid var(--line);
    padding: 7px 0 calc(7px + env(safe-area-inset-bottom));
  }
  .mobile-tabbar a { flex: 1; text-align: center; font-size: 11px; color: #9c8163; letter-spacing: .5px; }
  .mobile-tabbar a .ti { display: block; font-size: 18px; line-height: 1.2; margin-bottom: 2px; }
  .mobile-tabbar a.on { color: var(--accent); font-weight: 700; }
}