// 断点常量 —— 与 composables/useResponsive.ts 的媒体查询保持一致
// 改动断点时两处需同步。
$bp-mobile: 768px;
$bp-tablet: 1024px;

/// ≤768px 移动端
@mixin mobile {
  @media (max-width: $bp-mobile) {
    @content;
  }
}

/// 769–1024 平板
@mixin tablet {
  @media (min-width: 769px) and (max-width: $bp-tablet) {
    @content;
  }
}

/// ≤1024px（移动 + 平板）
@mixin mobile-and-tablet {
  @media (max-width: $bp-tablet) {
    @content;
  }
}