/* ============================================================================
   FreshStar · 现代重置与基础层  2-base（内容寻址卷 <stem>.<md5前8>.css，R213.0b 起）   （R211 Stage 5 · 2026-10-16）
   ============================================================================
   定位（CLAUDE.md 三层令牌体系第二层）：
     @layer fs.reset —— 现代 CSS Reset（:where() 零特异性，不参与优先级竞争）
     @layer fs.base  —— 元素默认样式（逻辑属性，纵向留白一眼可读）
     非分层工具类    —— u-* 原子工具（带 !important，专为替换历史页内联样式而生）

   过渡期说明：
     · 前两层与 fs-core 卷内的历史同名层**逐字一致**（后者已于 R213.0 删除，见 1-tokens 头注）。
     · font-smoothing 在本层统一接管 —— 全站 9 处页内重复副本（cashier/pay/passwd/
       run/runorder/userinfo/gongdan1/order/login）已删除，规则在 :where(body) 上。
     · [v-cloak] 在非分层区统一接管 —— 此前 kcid/paylist 各自内联一份、其余页
       依赖各页卷；统一后 petite-vue 页面首帧防闪口径一致。

   工具类命名（u-*）：
     · 用途：替换历史页面里的**静态内联样式**（Stage 5 清洗目标），
       如 style="color:red" → class="u-danger"、style="display:none" → class="u-hidden"。
     · 全部带 !important —— 与原内联样式「压过一切普通声明」的效力对齐；
       任何外部样式都不可能带 !important 反对（历史页从未在 style="" 里写 !important）。
     · 间距类按**像素值**命名（u-mb-10 = margin-bottom:10px），因为被替换的
       内联值多为魔数，按值命名才能逐像素对等；新代码请直接用令牌。
   ============================================================================ */

@layer fs.tokens, fs.reset, fs.base;

/* ───────────────────────────────────────────────────────────────────────────
   ① 重置（现代写法：:where() 零特异性，不参与任何优先级竞争）
   ─────────────────────────────────────────────────────────────────────────── */
@layer fs.reset {
  :where(*, *::before, *::after) { box-sizing: border-box; }

  :where(body, h1, h2, h3, h4, h5, h6, p, figure, blockquote, dl, dd, ul, ol) {
    margin: 0;
  }

  :where(img, svg, video, canvas) {
    display: block;
    max-width: 100%;
  }

  :where(button, input, select, textarea) {
    font: inherit;
    color: inherit;
  }

  :where(button) {
    background: none;
    border: 0;
    cursor: pointer;
  }

  /* 键盘可见焦点：鼠标点击不显示，Tab 才显示 */
  :where(:focus-visible) {
    outline: 2px solid var(--c-brand);
    outline-offset: 1px;
  }

  /* R440：iframe 的键盘焦点进入子文档后，元素本身不匹配 :focus，
     Chromium 下连 :focus-within 也为 false；用可聚焦的 [data-fsc-embed]
     容器承接焦点并给出轮廓，用户再按一次 Tab 进入嵌入内容。 */
  :where([data-fsc-embed]:focus) {
    outline: 2px solid var(--c-brand);
    outline-offset: 3px;
  }

  @media (prefers-reduced-motion: reduce) {
    :where(*, *::before, *::after) {
      animation-duration: .01ms !important;
      animation-iteration-count: 1 !important;
      transition-duration: .01ms !important;
      scroll-behavior: auto !important;
    }
  }
}

/* ───────────────────────────────────────────────────────────────────────────
   ② 元素默认样式（现代写法：逻辑属性，纵向留白一眼可读）
   ─────────────────────────────────────────────────────────────────────────── */
@layer fs.base {
  :where(html) {
    -webkit-text-size-adjust: 100%;
    color-scheme: light;   /* R250/C2：显式声明浅色 —— 原生控件/滚动条/日期选择器
                             不再跟随系统深色模式，避免深色系统下控件变黑与页面白底割裂 */
  }

  :where(body) {
    font-size: var(--t-md);
    line-height: var(--lh-base);
    color: var(--c-text);
    background-color: var(--bg-canvas, var(--c-bg));
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
  }

  :where(h1) { font-size: var(--t-2xl); line-height: var(--lh-tight); font-weight: 700; }
  :where(h2) { font-size: var(--t-xl);  line-height: var(--lh-tight); font-weight: 600; }
  :where(h3) { font-size: var(--t-lg);  line-height: var(--lh-tight); font-weight: 600; }
  :where(h4) { font-size: var(--t-md);  line-height: var(--lh-tight); font-weight: 600; }

  /* R250/C1：标题多行时按语义断行，避免中文末行孤字（渐进增强，不支持的引擎直接忽略） */
  :where(h1, h2, h3) { text-wrap: balance; }

  /* 标题与正文的纵向间距（逻辑属性：margin-block-end 就是「下边距」） */
  :where(h1, h2, h3, h4) { margin-block-end: var(--rhythm-head); }

  :where(a) {
    color: var(--c-brand);
    text-decoration: none;
  }
  :where(a:hover) { text-decoration: underline; }

  :where(hr) {
    border: 0;
    border-block-start: 1px solid var(--c-line);
    margin-block: var(--s-4);
  }

  :where(table) { border-collapse: collapse; width: 100%; }
  :where(th, td) { padding-block: var(--s-2); padding-inline: var(--s-3); text-align: start; }
  :where(thead th) {
    font-size: var(--t-xs);
    font-weight: 600;
    color: var(--c-text-3);
    border-block-end: 1px solid var(--c-line);
  }
}

/* ============================================================================
   ③ 非分层工具与全局约定（未分层 —— 未分层样式胜过所有分层样式）
   ============================================================================ */

/* petite-vue 首帧防闪：挂载前隐藏（全站统一口径，替代各页内联副本） */
[v-cloak] { display: none !important; }

/* 数字等宽对齐（金额 / 单号 / 倒计时 —— CLAUDE.md 前端铁律 7） */
.u-tnum { font-variant-numeric: tabular-nums; }

/* 双行截断（商品标题等 —— 铁律 7） */
.u-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* 语义色（替换 style="color:red" 一类的内联样式）；
   色值 = 1-tokens 状态色；!important 理由见文件头。 */
.u-danger  { color: var(--c-danger) !important; }
.u-success { color: var(--c-success) !important; }
.u-warn    { color: var(--c-warning) !important; }
.u-brand   { color: var(--c-brand) !important; }
.u-info    { color: #1E9FFF !important; }   /* 历史内联里的 layui 蓝，逐值保留 */
.u-muted   { color: var(--c-text-3) !important; }
.u-weak    { color: var(--c-text-4) !important; }

/* 展示控制 */
.u-hidden  { display: none !important; }
.u-right   { float: right !important; }
.u-w100    { width: 100% !important; }

/* 排版小工具 */
.u-fs12 { font-size: 12px !important; }
.u-fs13 { font-size: 13px !important; }
.u-fs14 { font-size: 14px !important; }
.u-bold { font-weight: 700 !important; }
.u-fw400 { font-weight: 400 !important; }
.u-center { text-align: center !important; }

/* 间距工具（按像素值命名 —— 逐像素对等替换历史内联魔数） */
.u-mb-4  { margin-bottom: 4px !important; }
.u-mb-6  { margin-bottom: 6px !important; }
.u-mb-8  { margin-bottom: 8px !important; }
.u-mb-10 { margin-bottom: 10px !important; }
.u-mb-12 { margin-bottom: 12px !important; }
.u-mb-14 { margin-bottom: 14px !important; }
.u-mb-15 { margin-bottom: 15px !important; }
.u-mb-16 { margin-bottom: 16px !important; }
.u-mb-20 { margin-bottom: 20px !important; }
.u-mb-24 { margin-bottom: 24px !important; }
.u-mt-4  { margin-top: 4px !important; }
.u-mt-8  { margin-top: 8px !important; }
.u-mt-9  { margin-top: 9px !important; }
.u-mt-10 { margin-top: 10px !important; }
.u-mt-12 { margin-top: 12px !important; }
.u-mt-14 { margin-top: 14px !important; }
.u-mt-15 { margin-top: 15px !important; }
.u-mt-16 { margin-top: 16px !important; }
.u-mt-20 { margin-top: 20px !important; }
.u-mt-24 { margin-top: 24px !important; }
.u-ml-4  { margin-left: 4px !important; }
.u-ml-6  { margin-left: 6px !important; }
.u-ml-8  { margin-left: 8px !important; }
.u-mr-4  { margin-right: 4px !important; }
.u-mr-5  { margin-right: 5px !important; }
.u-mr-8  { margin-right: 8px !important; }
.u-mr-10 { margin-right: 10px !important; }
.u-mr-20 { margin-right: 20px !important; }
.u-ml-auto { margin-left: auto !important; }
.u-mla-0 { margin-left: 0 !important; }
.u-p-14  { padding: 14px !important; }

/* 尺寸工具（历史内联宽度，按像素值命名） */
.u-wp-12 { width: 12px !important; }
.u-wp-14 { width: 14px !important; }
.u-wp-58 { width: 58px !important; }
.u-wp-100 { width: 100px !important; }
.u-wp-110 { width: 110px !important; }
.u-wp-230 { width: 230px !important; }
.u-wp-380 { width: 380px !important; }
.u-minw-0 { min-width: 0 !important; }

/* 历史内联色（精确值类 —— 与语义类 u-danger/u-success 不同：后者走令牌色，
   这里专为「逐像素对等替换 style="color:red" 一类」而生，取值即原值）。 */
.u-c-red        { color: red !important; }
.u-c-green      { color: green !important; }
.u-c-blue       { color: blue !important; }
.u-c-orange     { color: orange !important; }
.u-c-dodgerblue { color: dodgerblue !important; }
.u-c-6699FF     { color: #6699FF !important; }
.u-c-1e9fff     { color: #1e9fff !important; }
.u-c-8bc34a     { color: #8bc34a !important; }
.u-c-FF5722     { color: #FF5722 !important; }
.u-c-8a94a6     { color: #8a94a6 !important; }
.u-c-d9534f     { color: #d9534f !important; }
.u-c-text2      { color: var(--fs-text-2, #5B7086) !important; }
.u-c-danger-tk  { color: var(--fs-danger, #C43D3D) !important; }

/* 历史内联文本装饰/布局等价类（逐值对等） */
.u-link-plain { color: inherit !important; text-decoration: underline !important; }
.u-center-flex { text-align: center !important; text-decoration: none !important; display: flex !important; }
.u-fs12-8a94a6 { font-size: 12px !important; color: #8a94a6 !important; margin-left: 8px !important; }
.u-fs125-text2 { font-size: 12.5px !important; color: var(--fs-text-2, #5B7086) !important; }
.u-mono-12 { font-family: monospace !important; font-size: 12px !important; }
.u-list-plain { color: #8a94a6 !important; list-style: none !important; }
.u-block { display: block !important; }
.u-inline-block { display: inline-block !important; }
.u-flex { display: flex !important; }
.u-vm-2 { vertical-align: -2px !important; }
.u-vm-1 { vertical-align: -1px !important; }
.u-bg-fbfdff { background: #FBFDFF !important; }

/* 历史内联药丸底色（home 部分页；取值逐字对等） */
.u-pill-pri  { background: rgba(22,87,217,.10) !important; color: var(--fs-primary) !important; }
.u-pill-pri2 { background: rgba(22,87,217,.09) !important; color: var(--fs-primary) !important; }
.u-pill-gold { background: rgba(201,138,19,.13) !important; color: var(--fs-gold-deep) !important; }
.u-pill-ink  { background: rgba(23,50,75,.09) !important; color: var(--fs-text) !important; }
.u-pill-ink2 { background: rgba(23,50,75,.08) !important; color: var(--fs-text) !important; }

/* 历史内联面板头（add_ll/add_pl 的 .panel-heading 变体） */
.u-panel-hd-flat { border-top-left-radius: 8px !important; border-top-right-radius: 8px !important; background-color: #fff !important; }

/* 历史内联表头宽度（按像素值命名） */
.u-wp-56  { width: 56px !important; }
.u-wp-78  { width: 78px !important; }
.u-wp-88  { width: 88px !important; }
.u-wp-132 { width: 132px !important; }
.u-wp-150 { width: 150px !important; }
.u-wp-190 { width: 190px !important; }
.u-minw-940  { min-width: 940px !important; }
.u-minw-1000 { min-width: 1000px !important; }
.u-minw-1180 { min-width: 1180px !important; }

/* 历史内联骨架条（home/gongdan1 的 .skl 变体，逐值对等） */
.u-sk1 { display: block !important; height: 14px !important; width: 55% !important; margin-bottom: 10px !important; }
.u-sk2 { display: block !important; height: 9px !important; width: 78% !important; margin-bottom: 14px !important; }
.u-sk3 { display: block !important; height: 6px !important; margin-bottom: 10px !important; }
.u-sk4 { display: block !important; height: 26px !important; width: 62% !important; border-radius: 999px !important; }
.u-sk5 { display: block !important; height: 13px !important; width: 40% !important; margin-bottom: 12px !important; }
.u-sk6 { display: block !important; height: 11px !important; margin-bottom: 8px !important; }
.u-sk7 { display: block !important; height: 11px !important; width: 80% !important; margin-bottom: 14px !important; }
.u-sk8 { display: block !important; height: 28px !important; width: 55% !important; border-radius: 999px !important; }
.u-sk-cat { display: block !important; height: 11px !important; margin: 6px auto 0 !important; width: 70% !important; }

.u-ol-flat { margin: 0 !important; padding-left: 18px !important; line-height: 2 !important; }

/* 其他历史内联（逐值对等） */
.u-indent-2 { text-indent: 2em !important; }
.u-pull-r { float: right !important; }
.u-tc { text-align: center !important; }
.u-c-01AAED { color: #01AAED !important; }
.u-c-999 { color: #999 !important; }
.u-c-666 { color: #666 !important; }
.u-c-99CC66 { color: #99CC66 !important; }
.u-c-000 { color: #000000 !important; }
.u-c-1E6FD0 { color: #1E6FD0 !important; }
.u-minw-none { min-width: 0 !important; }
.u-mt-6 { margin-top: 6px !important; }
.u-p-15 { padding: 15px !important; }
.u-h-5 { height: 5px !important; }
.u-mt--35 { margin-top: -35px !important; }
.u-br10 { border-radius: 10px !important; }
.u-br8-w100 { border-radius: 8px !important; width: 100% !important; }
.u-w100 { width: 100% !important; }
.u-td-none { text-decoration: none !important; }
.u-gcol-full { grid-column: 1 / -1 !important; }
.u-flex-ac8 { display: flex !important; align-items: center !important; gap: 8px !important; }
.u-mw-340 { max-width: 340px !important; }
.u-wh-12 { width: 12px !important; height: 12px !important; }
.u-wh-14v { width: 14px !important; height: 14px !important; vertical-align: -2px !important; }
.u-shrink0-mt2 { flex: 0 0 auto !important; margin-top: 2px !important; }
.u-c-t3 { color: var(--t3, #8A9BAC) !important; }
.u-fs13-text3 { font-size: 13px !important; color: var(--fs-text-3) !important; }
.u-btn-bare { border: 0 !important; background: none !important; color: var(--fs-primary) !important; font-size: 12px !important; cursor: pointer !important; font-family: var(--fs-font) !important; }
.u-hidden-pr { position: absolute !important; overflow: hidden !important; width: 1px !important; height: 1px !important; clip: rect(0 0 0 0) !important; }

/* 药丸补充族（home 部分页的 .qi/.mi-ic 底色，取自内联值） */
.u-pill-ctaA { background: rgba(22,87,217,.11) !important; color: var(--fs-cta) !important; }
.u-pill-ctaB { background: rgba(30,111,208,.12) !important; color: var(--fs-cta, #1E6FD0) !important; }
.u-pill-ctaC { background: rgba(22,87,217,.09) !important; color: var(--fs-cta-deep) !important; }
.u-pill-ctaD { background: rgba(22,87,217,.11) !important; color: var(--fs-cta-deep) !important; }

/* 数据页柱状图（data.php 内联迁入；动态高度仍由 PHP 计算值驱动） */
.dv-chart { display: flex; align-items: flex-end; gap: 3px; height: 110px; }
.dv-col { flex: 1; display: flex; align-items: flex-end; gap: 2px; height: 100%; }
.dv-bar { flex: 1; border-radius: 2px 2px 0 0; display: block; }
.dv-bar-o { background: #4C7BF3; }
.dv-bar-p { background: #34B37E; }
.dv-lg { display: inline-block; width: 10px; height: 10px; border-radius: 2px; }
.dv-lg-o { background: #4C7BF3; }
.dv-lg-p { background: #34B37E; }
.dv-legend { display: flex; gap: 16px; margin-top: 8px; font-size: 12px; color: #8a94a6; }
.dv-ol { margin: 0; padding-left: 18px; line-height: 2; }