/**
 * 响应式断点常量
 *
 * 
 *
 * 与 `src/tokens/breakpoints.css` 中的 CSS 变量保持一致：
 *  - 客户端运行时检查（matchMedia）通过 `useBreakpoint` hook
 *  - 服务端 / 客户端 CSS 通过 `src/tokens/breakpoints.css` 的 media query
 */
export const Breakpoints = {
  /** 手机设备最大宽度。 */
  mobileMaxWidth: 599.98,
  /** 移动端画布最大宽度，来自 1080px @2x 设计稿。 */
  shellMaxWidth: 540,
  /** 平板设备最小宽度 */
  tabletMinWidth: 600,
  /** 平板设备最大宽度 */
  tabletMaxWidth: 1023,
  /** 桌面设备最小宽度 */
  desktopMinWidth: 1024,
} as const;

export type DeviceSize = "mobile" | "tablet" | "desktop";