/* 哆来咪宽屏适配层：只在桌面端覆盖布局，不改变手机端既有视觉和交互。 */
@media screen and (min-width: 900px) {
  :root { --violin-desktop-width: 1180px; }

  body {
    min-width: 0;
    padding-bottom: 112px !important;
  }

  .profile-header,
  .top-banner,
  .notice-bar,
  .page-header,
  .page-title,
  .search-bar,
  .category-list,
  .video-list,
  .content-wrapper,
  .course-header-title,
  .main-media-box,
  .audio-intro,
  .main-card,
  .order-list,
  .settings-card,
  .section-card,
  .profile-banner,
  .footer,
  .product-grid,
  .section,
  .tab-scroll,
  .tabs,
  .card,
  .wallet-card,
  .member-hero,
  .logout-btn,
  #cartListContainer,
  #resultContainer {
    max-width: var(--violin-desktop-width) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .profile-header { padding-left: 0 !important; padding-right: 0 !important; }
  .top-banner { width: 100% !important; }
  .page-header, .page-title { width: min(var(--violin-desktop-width), calc(100% - 48px)) !important; }
  .search-bar, .category-list, .video-list, .content-wrapper, .course-header-title,
  .main-media-box, .audio-intro, .main-card, .order-list, .settings-card, .section-card,
  .profile-banner, .footer, .product-grid, .section, .tab-scroll, .tabs, .card,
  .wallet-card, .member-hero, .logout-btn, #cartListContainer, #resultContainer {
    width: min(var(--violin-desktop-width), calc(100% - 48px)) !important;
  }

  .top-banner { min-height: 150px; max-height: 220px; }
  .top-banner img { object-fit: cover; }

  .bottom-nav {
    left: 50% !important;
    right: auto !important;
    bottom: 18px !important;
    width: min(920px, calc(100% - 48px)) !important;
    transform: translateX(-50%);
    border-radius: 18px !important;
  }
  .bottom-nav > div { max-width: 142px; }

  .course-list { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 16px !important; }
  .course-item { min-height: 146px; padding: 20px !important; }
  .product-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 18px !important; }
  .category-list { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; gap: 12px !important; }
  .video-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; padding-left: 0 !important; padding-right: 0 !important; }
  .video-item { height: 100%; margin: 0 !important; }

  .profile-tags { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
  .grid-4, .grid-4-services { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
  .benefit-list { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
  .plans { gap: 16px !important; }
  .plan-card { min-height: 180px; padding: 18px 14px !important; }
  .wallet-actions { flex-direction: row !important; }

  .main-media-box { aspect-ratio: 16 / 8; max-height: 590px; }
  .tab-content { width: min(var(--violin-desktop-width), calc(100% - 48px)) !important; margin-left: auto !important; margin-right: auto !important; }
  .bottom-toolbar { width: min(var(--violin-desktop-width), calc(100% - 48px)); margin-left: auto; margin-right: auto; border-radius: 16px; }

  .cart-item, .order-card, .result-item, .product-item { padding-left: 22px !important; padding-right: 22px !important; }
  .cart-thumb { width: 126px !important; height: 126px !important; }
  .order-product img, .product-thumb { width: 98px !important; height: 98px !important; }

  .modal-box, .episode-modal { width: min(650px, calc(100% - 48px)) !important; max-width: 650px !important; }
  .modal-overlay { padding: 24px !important; }
}

@media screen and (min-width: 1280px) {
  .course-list { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; }
  .course-item { min-height: 162px; }
  .product-grid { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
  .video-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}