/* ============================================================ 校跑侠 · 企业蓝白主题 通过覆盖 Vant 4 的 CSS 变量统一品牌色,避免"AI 紫渐变"观感 ============================================================ */ :root { /* 品牌色板:企业蓝 */ --brand-primary: #1677ff; --brand-primary-dark: #0958d9; --brand-primary-light: #e8f1ff; --brand-primary-lighter: #f2f7ff; /* 中性色 */ --brand-text: #1d2129; --brand-text-secondary: #4e5969; --brand-text-tertiary: #86909c; --brand-border: #e5e6eb; --brand-bg: #f4f6fa; --brand-surface: #ffffff; /* 功能色 */ --brand-success: #00b42a; --brand-warning: #ff7d00; --brand-danger: #f53f3f; /* 阴影与圆角 */ --brand-shadow-sm: 0 2px 8px rgba(20, 46, 92, 0.06); --brand-shadow-md: 0 6px 20px rgba(20, 46, 92, 0.08); --brand-radius: 12px; --brand-radius-lg: 16px; /* —— 覆盖 Vant 变量 —— */ --van-primary-color: var(--brand-primary); --van-blue: var(--brand-primary); --van-text-color: var(--brand-text); --van-text-color-2: var(--brand-text-secondary); --van-border-color: var(--brand-border); --van-background: var(--brand-bg); --van-background-2: var(--brand-surface); --van-cell-group-inset-radius: var(--brand-radius); --van-button-border-width: 0; --van-tabbar-height: 56px; --van-tabbar-item-active-color: var(--brand-primary); --van-nav-bar-background: transparent; --van-search-background: transparent; } * { box-sizing: border-box; -webkit-tap-highlight-color: transparent; } html, body { margin: 0; padding: 0; height: 100%; } body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif; color: var(--brand-text); background: #e9edf5; -webkit-font-smoothing: antialiased; } /* 手机外壳:桌面预览时居中显示为一部手机 */ #app { max-width: 480px; min-height: 100vh; margin: 0 auto; background: var(--brand-bg); position: relative; box-shadow: 0 0 40px rgba(0, 0, 0, 0.08); overflow: hidden; } .app-body { min-height: 100vh; padding-bottom: calc(56px + env(safe-area-inset-bottom)); } /* 通用页面容器 */ .page { min-height: 100vh; } .page__inner { padding: 12px 14px; } /* section 通用标题 */ .section { margin-top: 14px; } .section__head { display: flex; align-items: center; justify-content: space-between; margin: 0 2px 10px; } .section__title { font-size: 16px; font-weight: 700; color: var(--brand-text); display: flex; align-items: center; gap: 6px; } .section__title::before { content: ''; width: 4px; height: 15px; border-radius: 3px; background: var(--brand-primary); } .section__more { font-size: 13px; color: var(--brand-text-tertiary); display: flex; align-items: center; } /* 卡片 */ .card { background: var(--brand-surface); border-radius: var(--brand-radius); box-shadow: var(--brand-shadow-sm); } /* 通用工具类 */ .muted { color: var(--brand-text-tertiary); } .price { color: var(--brand-danger); font-weight: 700; } .price .unit { font-size: 12px; } /* 覆盖 Vant 按钮圆角,企业风更方正一点 */ .van-button--round { border-radius: 22px; } .van-button--primary { background: linear-gradient(135deg, var(--brand-primary), var(--brand-primary-dark)); } /* 让内容区可滚动而底部导航固定 */ .van-tabbar { max-width: 480px; margin: 0 auto; }