/* =====================================================================
 * style.css — 外贸单证网页版工具 设计系统
 * 极简商务风 · 主色 #2f6fed · PC 优先响应式 · 零依赖
 * 组件类：.container .btn .btn-primary .card .field .table .nav .doc ...
 * =================================================================== */

/* ---------- 设计令牌（CSS 变量） ---------- */
:root {
  /* 颜色 */
  --color-primary:        #2f6fed;
  --color-primary-dark:   #2356c4;
  --color-primary-light:  #eaf1fe;
  --color-primary-tint:   #f5f8ff;
  --color-accent:         #16a34a;   /* 成功/校验通过 绿 */
  --color-warn:           #d97706;   /* 警告 橙 */
  --color-danger:         #dc2626;   /* 错误 红 */

  --color-text:           #1f2733;   /* 主文字 */
  --color-text-soft:      #5b6675;   /* 次要文字 */
  --color-text-muted:     #8a94a6;   /* 弱化文字 */
  --color-heading:        #131923;

  --color-bg:             #ffffff;
  --color-bg-soft:        #f6f8fb;   /* 区块底色 */
  --color-bg-alt:         #f0f4fa;
  --color-border:         #e3e8f0;
  --color-border-strong:  #cdd5e1;

  /* 间距 */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  24px;
  --space-6:  32px;
  --space-7:  48px;
  --space-8:  64px;
  --space-9:  96px;

  /* 圆角 */
  --radius-sm:  6px;
  --radius:     10px;
  --radius-lg:  16px;
  --radius-pill: 999px;

  /* 阴影 */
  --shadow-xs: 0 1px 2px rgba(19, 25, 35, 0.05);
  --shadow-sm: 0 2px 8px rgba(19, 25, 35, 0.06);
  --shadow:    0 6px 20px rgba(19, 25, 35, 0.08);
  --shadow-lg: 0 16px 40px rgba(19, 25, 35, 0.12);

  /* 字号 */
  --fs-xs:   12px;
  --fs-sm:   13px;
  --fs-base: 15px;
  --fs-md:   17px;
  --fs-lg:   20px;
  --fs-xl:   26px;
  --fs-2xl:  34px;
  --fs-3xl:  44px;

  --lh-tight: 1.25;
  --lh-base:  1.65;

  /* 布局 */
  --container:  1160px;
  --container-narrow: 820px;
  --header-h:   64px;

  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
               "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;

  --transition: 0.18s ease;
}

/* ---------- 基础重置 ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--font-sans);
  font-size: var(--fs-base);
  line-height: var(--lh-base);
  color: var(--color-text);
  background: var(--color-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--color-primary); text-decoration: none; transition: color var(--transition); }
a:hover { color: var(--color-primary-dark); }
ul, ol { padding-left: 1.4em; }

h1, h2, h3, h4 { color: var(--color-heading); line-height: var(--lh-tight); margin: 0 0 var(--space-4); font-weight: 700; }
h1 { font-size: var(--fs-3xl); letter-spacing: -0.02em; }
h2 { font-size: var(--fs-2xl); letter-spacing: -0.01em; }
h3 { font-size: var(--fs-lg); }
h4 { font-size: var(--fs-md); }
p  { margin: 0 0 var(--space-4); }

@media (max-width: 720px) {
  :root { --fs-3xl: 30px; --fs-2xl: 25px; --fs-xl: 21px; }
}

/* ---------- 布局容器 ---------- */
.container { width: 100%; max-width: var(--container); margin: 0 auto; padding: 0 var(--space-5); }
.container-narrow { max-width: var(--container-narrow); }
.section { padding: var(--space-9) 0; }
.section-sm { padding: var(--space-7) 0; }
.section-soft { background: var(--color-bg-soft); }
.section-tint { background: var(--color-primary-tint); }

.text-center { text-align: center; }
.muted { color: var(--color-text-muted); }
.soft  { color: var(--color-text-soft); }
.lead  { font-size: var(--fs-md); color: var(--color-text-soft); line-height: var(--lh-base); }

.eyebrow {
  display: inline-block;
  font-size: var(--fs-sm); font-weight: 700; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--color-primary);
  margin-bottom: var(--space-3);
}

/* 网格 */
.grid { display: grid; gap: var(--space-5); }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 960px) { .grid-3, .grid-4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; } }

/* ---------- 导航 .nav ---------- */
.nav {
  position: sticky; top: 0; z-index: 50;
  height: var(--header-h);
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: saturate(180%) blur(10px);
  border-bottom: 1px solid var(--color-border);
}
.nav-inner {
  height: 100%;
  display: flex; align-items: center; gap: var(--space-6);
  max-width: var(--container); margin: 0 auto; padding: 0 var(--space-5);
}
.nav-brand {
  display: flex; align-items: center; gap: var(--space-2);
  font-size: var(--fs-md); font-weight: 800; color: var(--color-heading);
  white-space: nowrap;
}
.nav-brand .logo {
  width: 30px; height: 30px; border-radius: 8px;
  background: var(--color-primary); color: #fff;
  display: grid; place-items: center; font-size: 15px; font-weight: 800;
}
.nav-brand b { color: var(--color-primary); }
/* 2026-07-19 修订：桌面端导航项居中（原 margin-left:auto 右对齐）；移动端折叠菜单在下方媒体查询里覆盖不受影响 */
.nav-links { display: flex; align-items: center; gap: var(--space-5); margin-left: auto; margin-right: auto; }
/* 宽屏做绝对居中（消除 Logo 宽度造成的 ~60px 右偏）；1100px 以下退回 margin 近似居中防与 Logo 重叠 */
@media (min-width: 1100px) {
  .nav-inner { position: relative; }
  .nav-links { position: absolute; left: 50%; transform: translateX(-50%); margin: 0; }
}
/* 2026-07-19 修订：链接文字禁止折行（"首页"曾被挤成竖排两行） */
.nav-links a { color: var(--color-text-soft); font-weight: 600; font-size: var(--fs-sm); white-space: nowrap; }
.nav-links a:hover { color: var(--color-primary); }
/* 导航里的按钮：避免被上面的 .nav-links a 颜色覆盖（其特异性更高，必须显式指定） */
.nav-links a.btn { color: var(--color-text); }
.nav-links a.btn-primary,
.nav-links a.btn-primary:hover { color: #fff; }
/* 登录后导航右侧的专属 ID 徽标 */
.nav-links a.nav-id {
  display: inline-flex; align-items: center; gap: 5px;
  background: var(--color-primary-tint, #eaf1fe); color: var(--color-primary);
  border: 1px solid var(--color-primary-light, #cfe0ff);
  border-radius: var(--radius-pill, 999px); padding: 4px 12px;
  font-weight: 800; font-size: var(--fs-xs, 12px); letter-spacing: .02em; white-space: nowrap;
}
.nav-links a.nav-id::before { content: "👤"; font-size: 12px; }
.nav-links a.nav-id:hover { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }
.nav-toggle { display: none; background: none; border: 0; font-size: 24px; cursor: pointer; color: var(--color-heading); }

/* 2026-07-19 修订：汉堡菜单断点 860→1079——登录态页眉(6项+ID徽章+退出)在中等宽度放不下一行，
   与其挤压换行不如提前收进折叠菜单；≥1100px 走上方绝对居中规则，单行不折。 */
@media (max-width: 1079px) {
  .nav-toggle { display: block; margin-left: auto; }
  .nav-links {
    position: absolute; top: var(--header-h); left: 0; right: 0;
    flex-direction: column; align-items: stretch; gap: 0;
    background: #fff; border-bottom: 1px solid var(--color-border);
    box-shadow: var(--shadow); padding: var(--space-2) 0;
    margin-left: 0; display: none;
  }
  .nav-links.open { display: flex; }
  .nav-links a { padding: var(--space-3) var(--space-5); }
  .nav-links .btn { margin: var(--space-2) var(--space-5); text-align: center; }
}

/* ---------- 按钮 .btn ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
  padding: 11px 20px;
  font-size: var(--fs-sm); font-weight: 700; font-family: inherit;
  border: 1px solid var(--color-border-strong); border-radius: var(--radius-sm);
  background: #fff; color: var(--color-text);
  cursor: pointer; white-space: nowrap;
  transition: all var(--transition);
}
.btn:hover { border-color: var(--color-primary); color: var(--color-primary); box-shadow: var(--shadow-xs); }
.btn-primary {
  background: var(--color-primary); border-color: var(--color-primary); color: #fff;
}
.btn-primary:hover { background: var(--color-primary-dark); border-color: var(--color-primary-dark); color: #fff; box-shadow: var(--shadow-sm); }
.btn-ghost { background: transparent; border-color: transparent; color: var(--color-primary); }
.btn-ghost:hover { background: var(--color-primary-light); box-shadow: none; }
.btn-lg { padding: 14px 28px; font-size: var(--fs-base); }
.btn-sm { padding: 7px 14px; font-size: var(--fs-xs); }
.btn-block { display: flex; width: 100%; }
.btn:disabled, .btn[disabled] { opacity: 0.5; cursor: not-allowed; }

/* ---------- 卡片 .card ---------- */
.card {
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-5);
  box-shadow: var(--shadow-xs);
  transition: box-shadow var(--transition), transform var(--transition), border-color var(--transition);
}
.card-hover:hover { box-shadow: var(--shadow); transform: translateY(-2px); border-color: var(--color-border-strong); }
.card-pad-lg { padding: var(--space-6); }
.card-title { font-size: var(--fs-md); margin-bottom: var(--space-2); }
.card .icon {
  width: 48px; height: 48px; border-radius: 12px;
  background: var(--color-primary-light); color: var(--color-primary);
  display: grid; place-items: center; font-size: 24px;
  margin-bottom: var(--space-4);
}

/* ---------- 表单 .field ---------- */
.field { margin-bottom: var(--space-4); }
.field > label, .field-label {
  display: block; font-size: var(--fs-sm); font-weight: 600;
  color: var(--color-text-soft); margin-bottom: var(--space-2);
}
.input, .select, .textarea,
.field input, .field select, .field textarea {
  width: 100%;
  padding: 10px 12px;
  font-size: var(--fs-base); font-family: inherit; color: var(--color-text);
  background: #fff;
  border: 1px solid var(--color-border-strong); border-radius: var(--radius-sm);
  transition: border-color var(--transition), box-shadow var(--transition);
}
.input:focus, .select:focus, .textarea:focus,
.field input:focus, .field select:focus, .field textarea:focus {
  outline: none; border-color: var(--color-primary);
  box-shadow: 0 0 0 3px var(--color-primary-light);
}
.textarea, .field textarea { resize: vertical; min-height: 96px; line-height: 1.6; }
.field-hint { font-size: var(--fs-xs); color: var(--color-text-muted); margin-top: var(--space-1); }
.field-row { display: flex; gap: var(--space-3); }
.field-row > * { flex: 1; }
@media (max-width: 560px) { .field-row { flex-direction: column; gap: 0; } }

/* ---------- 表格 .table ---------- */
.table { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); }
.table th, .table td {
  padding: 10px 12px; text-align: left;
  border-bottom: 1px solid var(--color-border);
}
.table th {
  font-weight: 700; color: var(--color-text-soft);
  background: var(--color-bg-soft);
  font-size: var(--fs-xs); letter-spacing: 0.02em; text-transform: uppercase;
}
.table tbody tr:hover { background: var(--color-primary-tint); }
.table .num { text-align: right; font-variant-numeric: tabular-nums; }
.table-wrap { overflow-x: auto; border: 1px solid var(--color-border); border-radius: var(--radius); }

/* ---------- 单据预览 .doc（PDF/打印样式基础） ---------- */
.doc {
  background: #fff;
  color: #1a1a1a;
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  padding: var(--space-7);
  box-shadow: var(--shadow-sm);
  font-size: 13px; line-height: 1.5;
}
.doc h1, .doc h2 { text-align: center; color: #000; }
.doc-title { font-size: 22px; letter-spacing: 0.06em; margin-bottom: var(--space-2); }
.doc-sub { text-align: center; color: #555; margin-bottom: var(--space-5); }
.doc-meta { display: flex; justify-content: space-between; gap: var(--space-5); margin-bottom: var(--space-4); }
.doc table { width: 100%; border-collapse: collapse; margin: var(--space-3) 0; }
.doc table th, .doc table td { border: 1px solid #999; padding: 6px 8px; }
.doc table th { background: #f0f0f0; }
.doc .num { text-align: right; font-variant-numeric: tabular-nums; }
.doc-words { margin-top: var(--space-3); font-weight: 700; }
.doc-footer { margin-top: var(--space-6); display: flex; justify-content: space-between; }

/* ---------- 徽章 / 标签 ---------- */
.badge {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 3px 10px; border-radius: var(--radius-pill);
  font-size: var(--fs-xs); font-weight: 700;
  background: var(--color-primary-light); color: var(--color-primary);
}
.badge-ok   { background: #e7f6ec; color: var(--color-accent); }
.badge-warn { background: #fdf0dd; color: var(--color-warn); }
.badge-err  { background: #fdeaea; color: var(--color-danger); }

/* 校验结果项 */
.alert { padding: var(--space-3) var(--space-4); border-radius: var(--radius-sm); margin-bottom: var(--space-2); font-size: var(--fs-sm); border: 1px solid transparent; }
.alert-ok   { background: #e7f6ec; border-color: #b9e3c6; color: #15803d; }
.alert-warn { background: #fdf0dd; border-color: #f3d9a8; color: #b45309; }
.alert-err  { background: #fdeaea; border-color: #f4c0c0; color: #b91c1c; }

/* ---------- Hero ---------- */
.hero {
  position: relative;
  overflow: hidden;
  padding: var(--space-9) 0 var(--space-8);
  background:
    radial-gradient(760px 340px at 14% -8%, var(--color-primary-light), transparent 55%),
    radial-gradient(900px 420px at 86% -6%, #e7eefe, transparent 60%),
    linear-gradient(180deg, var(--color-primary-tint), #fff 74%);
}
.hero > .container { position: relative; z-index: 2; }
.hero h1 { max-width: 18em; margin-left: auto; margin-right: auto; letter-spacing: -0.01em; }
.hero .lead { max-width: 40em; margin-left: auto; margin-right: auto; }
.hero-cta { display: flex; gap: var(--space-3); justify-content: center; flex-wrap: wrap; margin-top: var(--space-5); }
.hero-stats { display: flex; gap: var(--space-7); justify-content: center; flex-wrap: wrap; margin-top: var(--space-7); }
.hero-stat strong { display: block; font-size: var(--fs-xl); color: var(--color-primary); }
.hero-stat span { font-size: var(--fs-sm); color: var(--color-text-muted); }

/* Hero 信任行 + 三根柱子 */
.hero-trust { font-size: var(--fs-xs); color: var(--color-text-muted); margin-top: var(--space-3); }
.hero-pillars { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); max-width: 920px; margin: var(--space-7) auto 0; text-align: left; }
@media (max-width: 760px) { .hero-pillars { grid-template-columns: 1fr; } }
.hero-pillar {
  background: rgba(255, 255, 255, .72); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-5);
  box-shadow: var(--shadow-xs); transition: transform var(--transition), box-shadow var(--transition);
}
.hero-pillar:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.hero-pillar .hp-ic { font-size: 26px; line-height: 1; }
.hero-pillar b { display: block; font-size: var(--fs-md); color: var(--color-heading); margin: 10px 0 6px; }
.hero-pillar span { font-size: var(--fs-sm); color: var(--color-text-soft); line-height: 1.65; }

/* ===== Hero 动态科技感装饰层 ===== */
.hero-fx { position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.hero-grid {
  position: absolute; inset: -2px;
  background-image:
    linear-gradient(to right, rgba(47,111,237,.07) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(47,111,237,.07) 1px, transparent 1px);
  background-size: 46px 46px;
  -webkit-mask-image: radial-gradient(760px 460px at 50% 4%, #000 28%, transparent 76%);
          mask-image: radial-gradient(760px 460px at 50% 4%, #000 28%, transparent 76%);
  animation: heroGridPan 24s linear infinite;
}
@keyframes heroGridPan { from { background-position: 0 0; } to { background-position: 46px 46px; } }
.hero-orb { position: absolute; border-radius: 50%; filter: blur(46px); }
.hero-orb.o1 { width: 360px; height: 360px; left: 4%;  top: -70px; opacity: .5;  background: radial-gradient(circle, #4f8cff, transparent 70%); animation: heroFloat1 15s ease-in-out infinite; }
.hero-orb.o2 { width: 300px; height: 300px; right: 6%; top: -30px; opacity: .45; background: radial-gradient(circle, #7aa7ff, transparent 70%); animation: heroFloat2 19s ease-in-out infinite; }
.hero-orb.o3 { width: 240px; height: 240px; left: 46%; top: 130px; opacity: .35; background: radial-gradient(circle, #aacbff, transparent 70%); animation: heroFloat3 17s ease-in-out infinite; }
@keyframes heroFloat1 { 0%,100% { transform: translate(0,0); }      50% { transform: translate(34px,26px); } }
@keyframes heroFloat2 { 0%,100% { transform: translate(0,0); }      50% { transform: translate(-28px,20px); } }
@keyframes heroFloat3 { 0%,100% { transform: translate(0,0); }      50% { transform: translate(20px,-22px); } }
/* 内容入场上浮 */
.hero .eyebrow, .hero h1, .hero .lead, .hero-cta, .hero-stats { animation: heroRise .7s cubic-bezier(.22,.61,.36,1) both; }
.hero h1 { animation-delay: .06s; }
.hero .lead { animation-delay: .12s; }
.hero-cta { animation-delay: .18s; }
.hero-stats { animation-delay: .24s; }
@keyframes heroRise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) {
  .hero-grid, .hero-orb { animation: none; }
  .hero .eyebrow, .hero h1, .hero .lead, .hero-cta, .hero-stats { animation: none; }
}

/* ---------- 功能区块 ---------- */
.feature-icon {
  width: 52px; height: 52px; border-radius: 14px;
  background: var(--color-primary-light); color: var(--color-primary);
  display: grid; place-items: center; font-size: 26px;
  margin-bottom: var(--space-4);
}
.feature h3 { margin-bottom: var(--space-2); }
.feature p { color: var(--color-text-soft); margin: 0; }

/* 三大功能等高卡 */
.feature-card { display: flex; flex-direction: column; height: 100%; }
.feature-card .how-mini { margin-top: var(--space-4); padding-top: var(--space-4); border-top: 1px dashed var(--color-border); }
.feature-card .how-mini strong { display: block; font-size: var(--fs-xs); letter-spacing: 0.04em; text-transform: uppercase; color: var(--color-text-muted); margin-bottom: var(--space-2); }
.feature-card .how-mini ol { margin: 0; padding-left: 1.3em; color: var(--color-text-soft); font-size: var(--fs-sm); }
.feature-card .how-mini li { margin-bottom: var(--space-1); }
.feature-card .btn-block { margin-top: auto; }

/* 移动端 sticky CTA */
.cta-sticky { display: none; }
@media (max-width: 720px) {
  .cta-sticky {
    display: flex; align-items: center; justify-content: center;
    position: fixed; left: var(--space-4); right: var(--space-4); bottom: var(--space-4);
    z-index: 60;
    padding: 14px 20px; border-radius: var(--radius-pill);
    background: var(--color-primary); color: #fff; font-weight: 700;
    box-shadow: var(--shadow-lg);
  }
  .cta-sticky:hover { background: var(--color-primary-dark); color: #fff; }
  body { padding-bottom: 76px; }
}
@media print { .cta-sticky { display: none !important; } }

/* 步骤 */
.steps { counter-reset: step; }
.step { position: relative; padding-left: 56px; margin-bottom: var(--space-5); }
.step::before {
  counter-increment: step; content: counter(step);
  position: absolute; left: 0; top: 0;
  width: 38px; height: 38px; border-radius: 50%;
  background: var(--color-primary); color: #fff;
  display: grid; place-items: center; font-weight: 800;
}

/* ---------- FAQ ---------- */
.faq-item {
  border: 1px solid var(--color-border); border-radius: var(--radius);
  margin-bottom: var(--space-3); background: #fff; overflow: hidden;
}
.faq-item summary {
  list-style: none; cursor: pointer; padding: var(--space-4) var(--space-5);
  font-weight: 700; color: var(--color-heading); font-size: var(--fs-md);
  display: flex; justify-content: space-between; align-items: center; gap: var(--space-3);
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: "+"; color: var(--color-primary); font-size: 22px; font-weight: 400; transition: transform var(--transition); }
.faq-item[open] summary::after { transform: rotate(45deg); }
.faq-item .faq-body { padding: 0 var(--space-5) var(--space-5); color: var(--color-text-soft); }
.faq-item .faq-body p:last-child { margin-bottom: 0; }

/* ---------- 页脚 ---------- */
.footer { background: #0f1726; color: #aeb8c8; padding: var(--space-8) 0 var(--space-5); font-size: var(--fs-sm); }
.footer a { color: #cdd6e3; }
.footer a:hover { color: #fff; }
.footer h4 { color: #fff; font-size: var(--fs-sm); text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: var(--space-4); }
.footer-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: var(--space-6); }
@media (max-width: 760px) { .footer-grid { grid-template-columns: 1fr 1fr; gap: var(--space-5); } }
.footer ul { list-style: none; padding: 0; margin: 0; }
.footer li { margin-bottom: var(--space-2); }
.footer-brand { font-size: var(--fs-md); font-weight: 800; color: #fff; margin-bottom: var(--space-3); }
.footer-bottom {
  margin-top: var(--space-7); padding-top: var(--space-5);
  border-top: 1px solid rgba(255,255,255,0.1);
  display: flex; justify-content: space-between; flex-wrap: wrap; gap: var(--space-3);
  color: #7c8699;
}
.footer-bottom a { color: #7c8699; }

/* ---------- toast（core.js dom.toast 用） ---------- */
.wm-toast {
  position: fixed; left: 50%; bottom: 40px; transform: translateX(-50%) translateY(20px);
  background: #1f2733; color: #fff; padding: 12px 20px; border-radius: var(--radius);
  font-size: var(--fs-sm); box-shadow: var(--shadow-lg); z-index: 9999;
  opacity: 0; pointer-events: none; transition: opacity var(--transition), transform var(--transition); max-width: 80vw;
}
.wm-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
.wm-toast-ok   { background: #15803d; }
.wm-toast-warn { background: #b45309; }
.wm-toast-err  { background: #b91c1c; }

/* ---------- 工具类 ---------- */
.mt-0 { margin-top: 0; } .mb-0 { margin-bottom: 0; }
.mt-3 { margin-top: var(--space-3); } .mt-4 { margin-top: var(--space-4); } .mt-5 { margin-top: var(--space-5); } .mt-6 { margin-top: var(--space-6); }
.flex { display: flex; } .items-center { align-items: center; } .justify-between { justify-content: space-between; }
.gap-2 { gap: var(--space-2); } .gap-3 { gap: var(--space-3); } .gap-4 { gap: var(--space-4); }
.wrap { flex-wrap: wrap; }
.hidden { display: none !important; }

/* ---------- 打印（单据导出友好） ---------- */
@media print {
  .nav, .footer, .no-print { display: none !important; }
  body { background: #fff; }
  .doc { border: 0; box-shadow: none; padding: 0; }
  .section { padding: 0; }
}