/* layout.css —— 页面框 / 底部导航 / PC 适配
   手机单列（375 基准）→ PC 只做三件事：字号 +1 级、同屏多列、批量区。
   **不增加任何手机上没有的功能**（V3 移动优先第二节第 2 条）。 */

/* 页面容器：底部给导航让位。
   ★ 2026-11-13（P0-1）：**不再限宽、不再自带动画**。
     限宽 720 会把桌面上铺满的内容锁成"一张窄纸居中"，与生产（main 不限宽、铺到 14px 边距）
     差 234~474px，是"看着不像一套系统"的头号原因；
     自带 animation 还会盖掉 vendor 的 `main>[id^="view-"]{animation:uiViewIn var(--t-view)}`（300ms 标准切页）。 */
.page{padding-bottom:calc(8px + var(--safe-b))}
@media (prefers-reduced-motion: reduce){.page{animation:none}}

/* ---------- 登录页 ---------- */
.login{min-height:calc(100vh - 64px);display:flex;flex-direction:column;justify-content:center;
  gap:16px;padding:24px var(--pad);max-width:420px;margin:0 auto}
.login .brand{text-align:center;margin-bottom:8px}
.login .brand .t{font-size:22px;font-weight:700}
.login .brand .s{color:var(--sub);font-size:var(--font-sm);margin-top:4px}

/* 列表默认单列（手机）；PC 两列由下面的媒体查询覆盖 ——
   必须写成「基础规则在前、媒体查询在后」，同优先级下后写者胜。 */
.cards{display:flex;flex-direction:column;gap:var(--gap)}

/* ---------- PC 自适应：只放大 + 多列 ---------- */
@media (min-width: 1024px){
  /* 项目列表在 PC 上两列（手机上永远单列） */
  .cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap)}
}