/* ============================================================
空运报价系统 · 设计系统 v2
------------------------------------------------------------
配色依据 GOE logo 的实测主色重新对齐：
logo 主色 = 淡紫 #9C84FC（占比约 78%），点缀 = 金黄 #F0A21E
旧的「红 #C8102E + 藏蓝」与 logo 是两套互不相干的色系，v2 接上：
· 行动色 = logo 紫家族。logo 那个紫太浅（白底上约 2.6:1，承载不了文字），
所以行动色取同色系的深紫 #5B3FD9（白字 6.7:1）。
· 结构色 = 深藏蓝。logo 的黄笔画在浅底仅 2.0:1、在深藏蓝上 7.2:1，
紫在浅底 3.4:1 → 深底 4.3:1。深藏蓝是唯一能放 logo 的底色，继续保留。
· 点缀 = logo 金黄。只做极小面积（徽标、动效光带），不承载正文。
· 红色退为语义色：只用于删除 / 作废 / 失败，不再当强调色。
字号收敛到 6 档（原版在 10–14px 之间挤了 9 档）：
32 / 24 / 18 / 15 / 13 / 12
圆角 3 档、阴影 2 档、间距走 4px 网格。
对比度：正文 16.5:1，次要 7.5:1，辅助 5.7:1（≤12px 的小字一律用 ink-2）。
============================================================ */
:root{
--bg:#F6F7F9;
--surface:#FFFFFF;
--surface-2:#F2F4F7;
--surface-3:#E7EAF0;
--line:#E4E7EC;
--line-2:#EFF1F5;
--ink:#101828; /* 正文 / 关键数字 16.5:1 */
--ink-2:#475467; /* 次要文字 7.5:1 —— ≤12px 的小字用这一档 */
--ink-3:#5D6B82; /* 辅助文字 5.7:1 —— 仅 ≥13px */
--ink-4:#98A2B3; /* 仅图标 / 占位，不用于正文 */
/* 行动色：logo 紫家族 */
--brand:#5B3FD9; /* 白字 6.7:1 */
--brand-2:#7A63E8; /* 渐变高光 */
--brand-ink:#4A2FC0; /* hover / 按压 */
--brand-soft:#EFEBFD;
--brand-line:#C9BDF7;
/* 结构色：深藏蓝（logo 的唯一正确底色） */
--deep-1:#0F1C3F;
--deep-2:#16264F;
--deep-3:#2E4174;
/* 点缀：logo 金黄，只做小面积 */
--gold:#F0A21E;
--gold-soft:#FEF3DC;
--ok:#067647; --ok-soft:#ECFDF3; --ok-ink:#05603A; --ok-line:#ABEFC6;
--warn:#B54708; --warn-soft:#FFFAEB; --warn-ink:#93370D; --warn-line:#FEDF89;
--bad:#B42318; --bad-soft:#FEF3F2; --bad-ink:#912018; --bad-line:#FECDCA;
--r-s:6px; --r-m:10px; --r-l:14px; --r-xl:14px;
--sh-1:0 1px 2px rgba(16,24,40,.06);
--sh-2:0 1px 3px rgba(16,24,40,.08), 0 8px 24px -12px rgba(16,24,40,.14);
--sh-3:0 16px 40px -16px rgba(16,24,40,.22);
--ease:cubic-bezier(.4,0,.2,1);
/* 货物分组：表头与输入行共用同一套列宽
（原版表头 54px / 输入行 72px 不一致，标签永远错位） */
--pkg-cols:56px repeat(4,1fr) 40px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
background:var(--bg);color:var(--ink);
font-size:15px;line-height:1.65;
font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",Helvetica,Arial,sans-serif;
-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
a{color:var(--brand);text-decoration:none}
h1,h2,h3,h4{margin:0;font-weight:650;letter-spacing:-.015em}
button,input,select,textarea{font-family:inherit;font-size:15px;color:inherit}
::selection{background:var(--brand-line);color:var(--deep-1)}
/* ---------- 顶栏 ----------
原版写死 height:60px，窄屏要塞「品牌 + 语言 + 公司名 + 退出」四组内容：
实测内容高 150px、品牌字被挤成竖排、横向溢出 28px。
改为 min-height + 分级收纳，窄屏恒为一行：
>860 全部显示 · 640–860 公司名收成头像 · <720 品牌用简称、退出只留图标
<480 只留 logo 图形 */
.top{
position:sticky;top:0;z-index:60;
background:linear-gradient(90deg,var(--deep-1),var(--deep-2));
color:#fff;
}
.top-in{
max-width:1200px;margin:0 auto;padding:0 20px;
min-height:56px;display:flex;align-items:center;gap:12px;
}
.logo{
display:flex;align-items:center;gap:10px;min-width:0;
font-weight:650;font-size:15px;letter-spacing:-.015em;color:#fff;white-space:nowrap;
}
.logo .mk{
width:30px;height:30px;border-radius:9px;flex:0 0 auto;
background:linear-gradient(135deg,var(--brand),var(--brand-ink));
color:#fff;display:grid;place-items:center;
box-shadow:0 2px 8px -2px rgba(91,63,217,.6), inset 0 1px 0 rgba(255,255,255,.24);
}
.logo .mk svg{display:block}
.logo .sub{font-size:11.5px;font-weight:500;color:rgba(255,255,255,.6);letter-spacing:.06em;text-transform:uppercase}
.spacer{flex:1;min-width:0}
.top .btn.ghost{background:transparent;color:rgba(255,255,255,.82);border-color:rgba(255,255,255,.28);box-shadow:none}
.top .btn.ghost:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.5);color:#fff}
.top .chip{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.22);color:#fff;max-width:180px;overflow:hidden;text-overflow:ellipsis}
.top .chip .dot{background:#4ADE80;box-shadow:0 0 0 3px rgba(74,222,128,.25)}
/* 品牌长名 / 简称 */
.brand-full{display:inline}
.brand-mini{display:none}
/* 语言切换：顶栏右侧胶囊（英文版是外国客户在用，必须保留）
触控目标按 WCAG 2.2 AA（2.5.8，最小 24×24）向上留足余量，
顶栏这类紧凑条统一取 ≥32px，正文区控件另按 44px。 */
.lang-switch{display:flex;gap:3px;padding:3px;border-radius:99px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);flex:0 0 auto}
.lang-switch button{
border:0;background:transparent;color:rgba(255,255,255,.8);border-radius:99px;
padding:5px 12px;min-height:32px;font-size:13px;font-weight:600;cursor:pointer;
transition:.15s var(--ease);white-space:nowrap;
}
.lang-switch button:hover{color:#fff}
.lang-switch button.on{background:#fff;color:var(--deep-2)}
/* 账号区：宽屏显示公司名，窄屏收成圆形头像；退出按钮窄屏只留图标 */
.who{display:inline-flex;align-items:center;gap:8px;min-width:0}
.who-ava{
display:none;width:28px;height:28px;border-radius:50%;flex:0 0 auto;
background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.28);
place-items:center;font-size:12.5px;font-weight:700;color:#fff;
}
.who-name{
display:inline-flex;align-items:center;gap:7px;padding:5px 12px;border-radius:99px;
background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);color:#fff;
font-size:13px;font-weight:550;max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.who-name .dot{width:6px;height:6px;border-radius:50%;background:#4ADE80;flex:0 0 auto;box-shadow:0 0 0 3px rgba(74,222,128,.22)}
.btn-out-text{display:inline}
.btn-out-ico{display:none}
@media(max-width:860px){
.who-name{display:none}
.who-ava{display:grid}
.logo .sub{display:none}
}
@media(max-width:720px){
.top-in{padding:0 14px;gap:9px;min-height:52px}
.brand-full{display:none}
.brand-mini{display:inline}
.lang-switch button{padding:4px 9px;font-size:12.5px}
.btn-out-text{display:none}
.btn-out-ico{display:inline}
.top .btn.ghost.sm{padding:6px 8px}
/* 后台的登录身份胶囊窄屏收起（后台只在电脑前用，手机上优先保住一行） */
.adm-who{display:none}
}
@media(max-width:480px){
.logo>span:not(.logo-img-wrap){display:none}
.logo-img{height:20px}
}
.chip{
display:inline-flex;align-items:center;gap:7px;padding:5px 12px;border-radius:99px;
background:var(--surface-2);border:1px solid var(--line);
font-size:13px;font-weight:550;color:var(--ink-2);white-space:nowrap;
}
.chip .dot{width:6px;height:6px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 3px var(--ok-soft)}
.chip.guest{background:var(--warn-soft);border-color:var(--warn-line);color:var(--warn-ink)}
/* ---------- 布局 ---------- */
.wrap{max-width:1200px;margin:0 auto;padding:20px 24px 56px}
.grid2{display:grid;grid-template-columns:minmax(0,384px) minmax(0,1fr);gap:20px;align-items:start}
.quote-shell{max-width:880px;margin:0 auto}
.quote-shell>.card{padding:26px 30px}
.quote-shell #result:empty{display:none}
.quote-shell #result:not(:empty){margin-top:16px}
@media (max-width:960px){.grid2{grid-template-columns:1fr}}
@media (max-width:640px){
.wrap{padding:14px 14px 48px}
.quote-shell>.card{padding:18px 16px}
}
/* ---------- 卡片 ---------- */
.card{
background:var(--surface);border:1px solid var(--line);
border-radius:var(--r-l);box-shadow:var(--sh-1);
}
.card.pad{padding:20px}
.card+.card{margin-top:16px}
.card-h{
padding:14px 20px;border-bottom:1px solid var(--line-2);
display:flex;align-items:center;gap:9px;background:var(--surface);
}
.card-h h3{font-size:15px}
.card-h h3 .idx{
display:inline-grid;place-items:center;width:20px;height:20px;border-radius:var(--r-s);
background:var(--brand-soft);color:var(--brand-ink);font-size:12px;font-weight:700;margin-right:8px;
vertical-align:-3px;
}
.card-h .sub{margin-left:auto;font-size:13px;color:var(--ink-2)}
.card-b{padding:16px 20px}
/* ---------- 表单 ---------- */
.fgroup{margin-bottom:16px}
.fgroup:last-child{margin-bottom:0}
.flabel{
display:flex;align-items:center;gap:6px;
font-size:13px;font-weight:600;color:var(--ink-2);margin-bottom:7px;
}
.flabel .hint{font-weight:400;color:var(--ink-2);letter-spacing:0;margin-left:auto;font-size:12px}
.fhint{margin-top:7px;font-size:13px;line-height:1.6;color:var(--ink-2)}
input[type=text],input[type=number],input[type=password],input[type=email],select,textarea{
width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-s);
background:#fff;transition:border-color .15s var(--ease),box-shadow .15s var(--ease);
outline:none;font-size:15px;min-height:42px;
}
input:hover,select:hover,textarea:hover{border-color:#D0D5DD}
input:focus,select:focus,textarea:focus{
border-color:var(--brand);box-shadow:0 0 0 3px rgba(91,63,217,.14);
}
select{
appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:34px;
background-image:url("data:image/svg+xml;utf8,");
background-repeat:no-repeat;background-position:right 12px center;
}
.row{display:grid;gap:10px}
.row.c3{grid-template-columns:repeat(3,1fr)}
.row.c2{grid-template-columns:repeat(2,1fr)}
.unit-wrap{position:relative}
.unit-wrap input{padding-right:38px}
.unit-wrap .u{
position:absolute;right:12px;top:50%;transform:translateY(-50%);
font-size:13px;color:var(--ink-2);pointer-events:none;font-weight:500;
}
.mini{
width:78px;padding:5px 8px;font-size:13px;border:1px solid var(--line);
border-radius:var(--r-s);text-align:right;font-variant-numeric:tabular-nums;min-height:34px;
}
/* 隐藏数字框的上下箭头：它会吃掉约 16px，窄列里 6000 会被显示成 600 */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
input[type=number]{-moz-appearance:textfield;appearance:textfield}
.mini:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(91,63,217,.14)}
.mini.err{border-color:var(--bad);background:var(--bad-soft);color:var(--bad-ink)}
/* 表单分组标题 */
.fsec{
display:flex;align-items:center;gap:9px;
margin:0 0 13px;font-size:13px;font-weight:650;color:var(--ink);
}
.fsec::after{content:"";flex:1;height:1px;background:var(--line-2)}
.fsec .n{
display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;
background:var(--brand-soft);color:var(--brand-ink);font-size:12px;font-weight:700;
}
.fsec+.fgroup{margin-top:0}
/* ---------- 按钮 ----------
行动色改为 logo 紫。红色退为语义色（删除 / 作废），不再做强调。
每屏紫色实心按钮 ≤ 1；需要第二个实心按钮时用 .navy（深藏蓝，结构色）。 */
.btn{
display:inline-flex;align-items:center;justify-content:center;gap:7px;
padding:11px 18px;border:1px solid var(--brand);min-height:44px;
background:var(--brand);color:#fff;
border-radius:var(--r-s);font-size:15px;font-weight:600;cursor:pointer;
transition:.16s var(--ease);
box-shadow:0 1px 2px rgba(91,63,217,.24);
}
.btn:hover{background:var(--brand-ink);border-color:var(--brand-ink);box-shadow:0 6px 16px -6px rgba(91,63,217,.5)}
.btn:active{transform:translateY(1px)}
.btn:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.btn.wide{width:100%}
.btn.ghost{background:#fff;color:var(--ink-2);border-color:var(--line);box-shadow:var(--sh-1)}
.btn.ghost:hover{background:var(--surface-2);border-color:#D0D5DD;color:var(--ink);box-shadow:var(--sh-1)}
.btn.sm{padding:8px 13px;font-size:13px;border-radius:var(--r-s);min-height:40px}
.btn.danger{background:#fff;color:var(--bad-ink);border-color:var(--bad-line);box-shadow:none}
.btn.danger:hover{background:var(--bad-soft);border-color:#F4A9A2;box-shadow:none}
.btn.navy{background:var(--deep-2);border-color:var(--deep-2)}
.btn.navy:hover{background:var(--deep-1);border-color:var(--deep-1);box-shadow:0 6px 16px -6px rgba(15,28,63,.5)}
/* 顶栏是紧凑条：正文区控件按 44px，顶栏内的取 34px（仍高于 WCAG AA 的 24px） */
.top .btn{min-height:34px}
/* chips（多选） */
.chips{display:flex;flex-wrap:wrap;gap:7px}
.chip-btn{
padding:7px 14px;border:1px solid var(--line);border-radius:99px;background:#fff;min-height:36px;
font-size:13px;cursor:pointer;transition:.15s var(--ease);color:var(--ink-2);user-select:none;
}
.chip-btn:hover{border-color:var(--brand-line);color:var(--brand-ink);background:var(--brand-soft)}
.chip-btn.on{background:var(--brand);border-color:var(--brand);color:#fff;font-weight:600}
/* 开关：开启态用绿色 —— 语义是「启用」而不是「危险」，
原版用品牌红容易和删除类操作混淆 */
.swt{position:relative;display:inline-block;width:42px;height:24px;flex:0 0 auto;vertical-align:middle}
.swt input{opacity:0;width:0;height:0;position:absolute}
.swt i{position:absolute;inset:0;background:#CBD2DD;border-radius:99px;cursor:pointer;transition:.18s var(--ease)}
.swt i::before{
content:"";position:absolute;width:19px;height:19px;left:2.5px;top:2.5px;
background:#fff;border-radius:50%;transition:.18s var(--ease);box-shadow:0 1px 2px rgba(0,0,0,.18);
}
.swt input:checked+i{background:var(--ok)}
.swt input:checked+i::before{transform:translateX(18px)}
.swt input:focus-visible+i{box-shadow:0 0 0 3px rgba(6,118,71,.25)}
/* ---------- 结果区 ---------- */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
@media(max-width:560px){.stats{grid-template-columns:1fr}}
.stat{
background:var(--surface-2);border:1px solid var(--line-2);border-radius:var(--r-m);
padding:12px 14px;position:relative;
}
.stat .k{
font-size:12px;color:var(--ink-2);font-weight:600;margin-bottom:6px;
display:flex;align-items:center;gap:5px;line-height:1.4;
}
.stat .v{
font-size:24px;font-weight:700;letter-spacing:-.025em;
font-variant-numeric:tabular-nums;color:var(--ink);line-height:1.15;
}
.stat .v u{font-size:13px;font-weight:500;color:var(--ink-2);text-decoration:none;margin-left:2px}
.stat.hl{background:var(--brand-soft);border-color:var(--brand-line)}
.stat.hl .v,.stat.hl .k{color:var(--brand-ink)}
.stat .badge{
position:absolute;top:-9px;right:10px;
padding:2px 8px;border-radius:99px;background:var(--brand);color:#fff;
font-size:11px;font-weight:700;
}
.stat .n{font-size:12px;color:var(--ink-2);margin-top:3px}
.vs-row{
display:flex;align-items:center;justify-content:center;gap:8px;
margin:10px 0 0;font-size:13px;color:var(--ink-2);
}
.vs-row::before,.vs-row::after{content:"";flex:1;height:1px;background:var(--line-2)}
/* 价格 Hero（快递报价面板仍在用；客户空运结果 v2 已不再用它） */
.hero{
background:linear-gradient(128deg,var(--deep-1) 0%,var(--deep-2) 60%,var(--deep-3) 100%);
color:#fff;border-radius:var(--r-l);padding:22px 24px;margin-top:16px;
box-shadow:var(--sh-3);position:relative;overflow:hidden;
}
.hero::after{
content:"";position:absolute;right:-60px;top:-80px;width:240px;height:240px;border-radius:50%;
background:radial-gradient(circle,rgba(156,132,252,.34) 0%,rgba(156,132,252,0) 68%);
}
.hero .lbl{font-size:13px;color:rgba(255,255,255,.82);position:relative}
.hero .amt{
font-size:32px;font-weight:700;letter-spacing:-.035em;margin:5px 0 3px;
font-variant-numeric:tabular-nums;line-height:1.1;position:relative;
}
.hero .meta{
display:grid;grid-template-columns:repeat(4,1fr);gap:14px;
margin-top:16px;padding-top:15px;border-top:1px solid rgba(255,255,255,.2);position:relative;
}
@media (max-width:620px){.hero .meta{grid-template-columns:repeat(2,1fr)}}
.hero .meta div{font-size:12px;color:rgba(255,255,255,.7)}
.hero .meta b{display:block;font-size:15px;font-weight:650;margin-top:3px;color:#fff;font-variant-numeric:tabular-nums}
.pill{
display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:99px;
background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.2);
font-size:12px;font-weight:550;
}
/* ---------- 客户报价结果卡（v2：同一个价格只出现一次） ---------- */
.quote-res{
background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l);
box-shadow:var(--sh-2);overflow:hidden;
}
.quote-res-h{
display:flex;align-items:center;gap:9px;flex-wrap:wrap;
padding:14px 20px;border-bottom:1px solid var(--line-2);background:var(--surface-2);
}
.quote-res-h .rt{font-size:15px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.quote-res-b{padding:20px}
.quote-price{
font-size:32px;font-weight:700;letter-spacing:-.035em;line-height:1.05;
font-variant-numeric:tabular-nums;color:var(--ink);
}
.quote-price small{font-size:15px;font-weight:600;color:var(--ink-2);margin-left:4px}
.quote-per{font-size:13px;color:var(--ink-2);margin-top:6px}
.quote-kv{
display:grid;grid-template-columns:repeat(4,1fr);gap:0;
margin-top:18px;border-top:1px solid var(--line-2);padding-top:14px;
}
.quote-kv>div{padding-right:12px}
.quote-kv>div+div{border-left:1px solid var(--line-2);padding-left:14px}
.quote-kv .k{font-size:12px;color:var(--ink-2);margin-bottom:3px}
.quote-kv .v{font-size:15px;font-weight:650;font-variant-numeric:tabular-nums}
@media(max-width:640px){
.quote-kv{grid-template-columns:1fr 1fr;gap:14px 0}
.quote-kv>div:nth-child(odd){border-left:0;padding-left:0}
.quote-kv>div:nth-child(even){border-left:1px solid var(--line-2);padding-left:14px}
}
.quote-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}
.quote-chip{
font-size:12px;padding:4px 10px;border-radius:99px;
background:var(--surface-2);border:1px solid var(--line);color:var(--ink-2);
}
.quote-chip.no{text-decoration:line-through;color:var(--ink-3)}
.quote-acts{display:flex;gap:9px;flex-wrap:wrap;margin-top:18px}
/* 「最优 / 最低」徽标：logo 金黄做小面积点缀，深字保证对比 */
.badge-best{
display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:5px;
background:var(--gold-soft);border:1px solid var(--gold);color:#7A4A02;
font-size:11.5px;font-weight:700;
}
.badge-best::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--gold)}
/* 表格 */
table.t{width:100%;border-collapse:collapse;font-size:13px}
table.t th{
text-align:left;padding:10px 14px;font-size:12px;font-weight:650;color:var(--ink-2);
border-bottom:1px solid var(--line);background:var(--surface-2);
}
table.t td{padding:10px 14px;border-bottom:1px solid var(--line-2);vertical-align:middle;font-size:13px}
table.t tbody tr{transition:background .12s var(--ease)}
table.t tbody tr:hover{background:#FAFBFC}
table.t tr:last-child td{border-bottom:0}
table.t td.r,table.t th.r{text-align:right}
table.t td.num,table.t th.num{font-variant-numeric:tabular-nums}
table.t tr.sum td{font-weight:700;border-top:1.5px solid var(--line);background:#FAFBFC;font-size:13.5px}
.formula{font-size:12.5px;color:var(--ink-2);margin-top:2px;font-variant-numeric:tabular-nums}
/* 提示条 */
.tip{
display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:var(--r-m);
font-size:13px;line-height:1.6;border:1px solid transparent;
}
.tip svg{flex:0 0 auto;margin-top:3px}
.tip.info{background:var(--brand-soft);border-color:var(--brand-line);color:var(--brand-ink)}
.tip.ok{background:var(--ok-soft);border-color:var(--ok-line);color:var(--ok-ink)}
.tip.warn{background:var(--warn-soft);border-color:var(--warn-line);color:var(--warn-ink)}
.tip.bad{background:var(--bad-soft);border-color:var(--bad-line);color:var(--bad-ink)}
.tip+.tip{margin-top:9px}
.tag{display:inline-block;padding:2px 8px;border-radius:var(--r-s);font-size:12px;font-weight:650}
.tag.g{background:var(--ok-soft);color:var(--ok-ink)}
.tag.y{background:var(--warn-soft);color:var(--warn-ink)}
.tag.r{background:var(--bad-soft);color:var(--bad-ink)}
.tag.b{background:var(--brand-soft);color:var(--brand-ink)}
.tag.n{background:var(--surface-2);color:var(--ink-2);border:1px solid var(--line)}
.empty{padding:44px 20px;text-align:center;color:var(--ink-2);font-size:14px}
.empty .ic{opacity:.35;margin-bottom:10px;display:block}
/* 档位试算 chips */
.trials{display:flex;flex-wrap:wrap;gap:8px}
.trial{
padding:6px 12px;border-radius:var(--r-s);border:1px solid var(--line);background:#fff;
font-size:12.5px;font-variant-numeric:tabular-nums;
}
.trial.win{border-color:var(--brand);background:var(--brand-soft);color:var(--brand-ink);font-weight:650}
.trial.best{border-color:var(--brand-line);color:var(--brand-ink)}
.trial.lose{color:var(--ink-3);text-decoration:line-through;opacity:.75;background:var(--surface-2)}
/* 登录 / 申请 */
.auth{max-width:420px;margin:38px auto}
.auth .tabs{display:flex;gap:4px;margin-bottom:20px;background:var(--surface-2);padding:4px;border-radius:var(--r-m);border:1px solid var(--line-2)}
.auth .tabs button{
flex:1;border:0;background:transparent;padding:9px;border-radius:var(--r-s);cursor:pointer;
font-size:14px;font-weight:600;color:var(--ink-2);transition:.15s var(--ease);
}
.auth .tabs button.on{background:#fff;color:var(--brand-ink);box-shadow:var(--sh-1)}
/* ---------- 后台布局 ---------- */
.admin-grid{display:grid;grid-template-columns:210px minmax(0,1fr);gap:20px;align-items:start}
.nav{
display:flex;flex-direction:column;gap:3px;position:sticky;top:76px;
background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l);
padding:10px;box-shadow:var(--sh-1);
}
.nav button{
display:flex;align-items:center;gap:10px;padding:9px 12px;border:0;background:transparent;
border-radius:var(--r-s);cursor:pointer;font-size:14px;font-weight:500;color:var(--ink-2);
text-align:left;transition:.14s var(--ease);position:relative;white-space:nowrap;min-height:40px;
}
.nav button svg{opacity:.6;flex:0 0 auto}
.nav button:hover{background:var(--surface-2);color:var(--ink)}
.nav button:hover svg{opacity:.9}
.nav button.on{background:var(--brand-soft);color:var(--brand-ink);font-weight:650}
.nav button.on svg{opacity:1;color:var(--brand)}
.nav button.on::before{
content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
width:3px;height:18px;border-radius:0 3px 3px 0;background:var(--brand);
}
.nav .sec{font-size:11.5px;color:var(--ink-2);padding:12px 12px 5px;font-weight:700;letter-spacing:.08em}
/* 窄屏：侧栏 10 项原版整块铺在内容之上（后台手机端实测 8 屏），
改成横向可滑的一行，首屏立刻还给内容 */
@media (max-width:880px){
.admin-grid{grid-template-columns:1fr;gap:14px}
.nav{
position:static;flex-direction:row;flex-wrap:nowrap;align-items:center;
gap:4px;padding:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;
border-radius:var(--r-m);
}
.nav .sec{
padding:0 8px 0 12px;display:flex;align-items:center;flex:0 0 auto;
font-size:11.5px;white-space:nowrap;
}
.nav .sec:first-child{padding-left:4px}
.nav button{flex:0 0 auto;padding:8px 12px;min-height:38px}
.nav button.on::before{left:50%;top:auto;bottom:0;transform:translateX(-50%);width:16px;height:3px;border-radius:3px 3px 0 0}
}
.route-h{
display:flex;align-items:center;gap:12px;padding:14px 18px;
border-bottom:1px solid var(--line-2);background:var(--surface);
}
.route-h .rt{font-size:15px;font-weight:650;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.route-h .mt{font-size:12.5px;color:var(--ink-2);margin-top:3px}
.tbl-card{
border:1px solid var(--line);border-radius:var(--r-l);overflow:hidden;background:#fff;
box-shadow:var(--sh-1);transition:box-shadow .18s var(--ease);
}
.tbl-card:hover{box-shadow:var(--sh-2)}
.tbl-card+.tbl-card{margin-top:14px}
.tbl-card .h{
display:flex;align-items:center;gap:9px;padding:14px 18px;border-bottom:1px solid var(--line-2);
background:var(--surface);flex-wrap:wrap;
}
.tbl-card .h h3{font-size:14.5px}
.tbl-card .h .t2{margin-left:auto;font-size:12.5px;color:var(--ink-2)}
.foot-note{
padding:11px 18px;background:var(--surface-2);font-size:12.5px;color:var(--ink-2);
border-top:1px solid var(--line-2);line-height:1.7;
}
.foot-note b{color:var(--ink)}
.lines{
font-size:12.5px;color:var(--ink-2);background:var(--surface-2);
border-radius:var(--r-m);padding:12px 14px;line-height:1.85;
border:1px solid var(--line-2);font-variant-numeric:tabular-nums;
}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12.5px}
.muted{color:var(--ink-3)}
.sm{font-size:12.5px}
.banner{
background:var(--warn-soft);border-bottom:1px solid var(--warn-line);color:var(--warn-ink);
padding:9px 24px;font-size:13px;display:flex;gap:8px;align-items:center;
}
/* 入场动画 */
@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.card.result-in,.quote-res.result-in{animation:rise .26s var(--ease) both}
/* 英文界面统一 Cambria Math（含拉丁字母与数字，随 Windows/Office 附带）。
这是既定偏好，v2 不动字体，只把行高与字重单独校一遍 ——
衬线数学字体直接套中文那套 15px/1.65 的节奏会显得发飘。 */
html[lang="en"] body,
html[lang="en"] button,html[lang="en"] input,html[lang="en"] select,html[lang="en"] textarea{
font-family:"Cambria Math",Cambria,Georgia,"Times New Roman",serif;
}
html[lang="en"] body{font-size:15.5px;line-height:1.6}
html[lang="en"] .quote-price,html[lang="en"] .hero .amt,
html[lang="en"] .stat .v,html[lang="en"] table.t td.num,html[lang="en"] table.t th.num,
html[lang="en"] .recent-item .price,html[lang="en"] .rt-st .v,html[lang="en"] table.rt-t td.num,
html[lang="en"] .formula,html[lang="en"] .lines{
font-variant-numeric:tabular-nums;
}
html[lang="en"] h1,html[lang="en"] h2,html[lang="en"] h3{letter-spacing:0}
/* ============================================================
品牌标识区（客户门户）
logo 文件本身不改动。logo 的黄笔画在浅底仅 2.0:1、在深藏蓝上 7.2:1；
紫笔画 3.4:1 → 4.3:1。所以顶栏与登录卡头部用同一种深藏蓝、同一个
logo 高度，两处观感一致，也保证 logo 的对比度达标。
============================================================ */
.top .logo.light .vbar{width:1px;height:18px;background:rgba(255,255,255,.35);flex:0 0 auto}
.logo-img{height:22px;width:auto;display:block}
.logo-img-wrap{display:inline-flex;align-items:center;flex:0 0 auto}
/* 未登录着陆页：内容在视口里垂直居中，避免"下半屏整块空白" */
body.landing{background:var(--bg);background-image:none;display:flex;flex-direction:column;min-height:100vh}
body.landing .land-wrap{flex:1 1 auto;display:flex}
/* 用 margin:auto 而不是 align-items:center —— 内容高于视口时前者不会把顶部裁掉 */
body.landing .land-grid{width:100%;margin:auto 0}
.land-wrap{max-width:1060px;margin:0 auto;padding:56px 24px 64px}
.land-grid{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:56px;align-items:center}
.land-copy .kicker{font-size:12px;font-weight:700;letter-spacing:.28em;color:var(--brand);margin-bottom:18px}
.land-copy h1{font-size:32px;line-height:1.28;letter-spacing:-.02em;color:var(--deep-2);font-weight:700}
.land-copy p{margin:16px 0 0;font-size:15px;color:var(--ink-2);max-width:430px}
/* 中伊航线：旗帜 + 动效，周期 2.2s，旗帜不参与呼吸 */
.route-flag{position:relative;display:flex;align-items:center;gap:11px;margin-top:32px;font-size:13px;font-weight:700;color:var(--deep-2);letter-spacing:.12em}
.route-flag .route-city{font-size:13px}
.route-flag .flag{
display:inline-block;width:26px;height:18px;border-radius:2px;flex:none;
box-shadow:0 1px 3px rgba(15,28,63,.25);
}
.route-flag .flag-cn{background:#de2910;position:relative;overflow:hidden}
.route-flag .flag-cn::before{
content:"";position:absolute;left:0;top:0;width:100%;height:100%;
background:url("data:image/svg+xml;utf8,") center/contain no-repeat;
}
.route-flag .flag-ir{background:url("/flag-ir.svg?v=1") center/100% 100% no-repeat}
.route-flag .dash{
position:relative;overflow:hidden;flex:0 0 150px;height:2px;
background:linear-gradient(90deg,var(--brand),var(--deep-3));
}
.route-flag .dash::after{
content:"";position:absolute;top:0;left:-40%;width:40%;height:100%;
background:linear-gradient(90deg,transparent,var(--gold),transparent);
animation:goeRouteFlow 2.2s linear infinite alternate;
}
.route-flag>span{animation:goePulse 2.2s ease-in-out infinite}
.route-flag>.dash,.route-flag>.flag{animation:none}
@keyframes goeRouteFlow{0%{left:-40%}100%{left:100%}}
@keyframes goePulse{0%,100%{opacity:.7}50%{opacity:1}}
@media(prefers-reduced-motion:reduce){
.route-flag .dash::after,.route-flag>span,.card.result-in,.quote-res.result-in{animation:none}
}
.land-card{padding:0;border-radius:var(--r-l);border:1px solid var(--line);overflow:hidden;box-shadow:var(--sh-3)}
.land-card-head{
display:flex;align-items:center;padding:15px 26px;
background:linear-gradient(90deg,var(--deep-1),var(--deep-2));
}
.land-card-body{padding:22px 26px 28px}
.land-card h2{font-size:18px;margin:0 0 4px;color:var(--deep-2)}
.gate-note{font-size:13px;color:var(--ink-2);margin:0 0 18px;line-height:1.6}
.land-card .fld{margin-bottom:16px}
.land-card .fld label{display:block;font-size:13px;font-weight:600;color:var(--ink-2);margin-bottom:6px}
.land-card .fld .lbl-sub{color:var(--ink-2);font-weight:400;margin-left:6px;font-size:12.5px}
.land-card input,.land-card select{border:1px solid var(--line);border-radius:var(--r-s);background:#fff}
.land-card input:focus,.land-card select:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(91,63,217,.14)}
.land-card .fld2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.land-card .tabs{display:flex;gap:4px;margin-bottom:18px;background:var(--surface-2);padding:4px;border-radius:var(--r-m)}
.land-card .tabs button{
flex:1;border:0;background:transparent;padding:9px;border-radius:var(--r-s);cursor:pointer;
font-size:14px;font-weight:600;color:var(--ink-2);transition:.15s var(--ease);
}
.land-card .tabs button.on{background:#fff;color:var(--brand-ink);box-shadow:var(--sh-1)}
.forgot{display:inline-block;font-size:13px;color:var(--brand);margin:-6px 0 16px}
/* 注册面板底部的说明：邮箱验证通过即开通，不需要等审核 */
.apply-note{margin:12px 0 0;font-size:12.5px;line-height:1.6;color:var(--ink-2);text-align:center}
.apply-note b{color:var(--brand-ink)}
.btn.land{background:var(--brand);border-color:var(--brand);padding:12px;box-shadow:0 6px 16px -8px rgba(91,63,217,.6)}
.btn.land:hover{background:var(--brand-ink);border-color:var(--brand-ink)}
.guest-link{display:block;width:100%;margin-top:12px;background:none;border:0;color:var(--ink-2);font-size:13px;cursor:pointer;min-height:36px}
.guest-link:hover{color:var(--brand)}
@media(max-width:900px){
.land-wrap{padding:32px 18px 48px}
.land-grid{grid-template-columns:1fr;gap:28px}
.land-copy h1{font-size:26px}
}
@media(max-width:420px){
.land-card .fld2{grid-template-columns:1fr}
}
/* ---------- 客服弹窗 ---------- */
.cs-link{background:#159447!important;border-color:#159447!important;color:#fff!important;animation:goeSupportBreathe 5.5s ease-in-out infinite;transform-origin:center}
@keyframes goeSupportBreathe{
0%,100%{opacity:.94;transform:scale(1);box-shadow:0 0 0 0 rgba(21,148,71,0)}
50%{opacity:1;transform:scale(1.014);box-shadow:0 0 0 7px rgba(21,148,71,.16)}
}
.clear-cargo{color:#c62828!important;border-color:#efb0b0!important}
.cs-dialog{
margin:auto;width:min(460px,calc(100vw - 32px));max-height:86vh;overflow:auto;
border:1px solid var(--line);border-radius:var(--r-l);padding:22px;background:#fff;color:var(--ink);
box-shadow:0 24px 80px rgba(16,24,40,.28);
}
.cs-dialog::backdrop{background:rgba(15,28,63,.5);backdrop-filter:blur(3px)}
.cs-dialog-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.cs-dialog-head h2{font-size:17px;color:var(--deep-2)}
.cs-dialog-head button{border:0;background:none;font-size:26px;line-height:1;cursor:pointer;color:var(--ink-3);padding:4px 8px}
.cs-dialog-head button:hover{color:var(--brand)}
.cs-cards{display:grid;gap:10px}
.cs-card{border:1px solid var(--line);border-radius:var(--r-m);padding:14px 16px;transition:.16s var(--ease)}
.cs-card:hover{border-color:var(--brand-line);background:#FBFAFF}
.cs-card .cs-name{font-size:14px;font-weight:650;color:var(--deep-2)}
.cs-card .cs-title{font-size:12.5px;color:var(--ink-2);margin-left:6px}
.cs-card .cs-company{font-size:12.5px;color:var(--ink-2);margin-top:3px}
.cs-rows{margin-top:10px;display:grid;gap:7px}
.cs-row{display:flex;align-items:center;gap:9px;font-size:14px;color:var(--ink-2);flex-wrap:wrap}
.cs-row b{font-weight:550;color:var(--ink);font-variant-numeric:tabular-nums}
.cs-row .cs-act{
margin-left:auto;font-size:12.5px;color:var(--brand);border:1px solid var(--brand-line);
background:#fff;border-radius:var(--r-s);padding:4px 10px;cursor:pointer;min-height:32px;
}
.cs-row .cs-act:hover{background:var(--brand-soft)}
.cs-empty{padding:24px 8px;text-align:center;color:var(--ink-2);font-size:14px}
@media(prefers-reduced-motion:reduce){.cs-link{animation:none}}
/* 宽表格：列多时允许横向滑动，避免被等比压缩把字挤断 */
.t-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.t-scroll table.t{min-width:100%}
.t-scroll table.t td,.t-scroll table.t th{white-space:nowrap}
.t-scroll table.t input.mini{white-space:normal}
.page-intro{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin:0 0 20px;flex-wrap:wrap}
.page-intro h1{margin:4px 0 5px;font-size:24px;letter-spacing:-.03em;color:var(--deep-2)}
.page-intro p{margin:0;color:var(--ink-2);font-size:13px}
.eyebrow{font-size:12px;font-weight:700;letter-spacing:.16em;color:var(--brand)}
/* ============================================================
货物分组
原版：表头首列与输入行首列不一致（54 vs 72px）→ 标签永远错位；
窄屏五列被压到 54–56px，「单件毛重（kg，必填）」折三行还溢出。
v2：表头与输入行共用 --pkg-cols；<640px 改为「每组一张卡」，输入框全宽。
============================================================ */
.package-head{
display:grid;grid-template-columns:var(--pkg-cols);gap:6px;
margin-bottom:7px;color:var(--ink-2);font-size:12px;text-align:center;align-items:end;
}
.package-row{
display:grid;grid-template-columns:var(--pkg-cols);gap:6px;
margin-bottom:8px;align-items:center;
}
.package-row .pf{display:contents}
.package-row .pf-l{display:none}
.package-row input{text-align:center}
/* 只有一组时不显示删除（用 visibility 保住列宽，避免表头再错位） */
#packageRows .package-row:only-child .package-del{visibility:hidden}
.package-del{
border:1px solid var(--line);background:#fff;border-radius:var(--r-s);
width:34px;height:40px;cursor:pointer;color:var(--ink-2);font-size:15px;line-height:1;padding:0;
}
.package-del:hover{border-color:var(--bad-line);color:var(--bad-ink);background:var(--bad-soft)}
@media(max-width:640px){
.package-head{display:none}
/* 6 列栅格 + 显式定位：件数与单件毛重并排一行（都是"数量"类），
长宽高各占 1/3 一行（都是"尺寸"类）。用 grid-area 而不是 order，
避免依赖 order 参与自动排布的细节差异。 */
.package-row{
grid-template-columns:repeat(6,1fr);gap:10px 8px;
padding:12px;border:1px solid var(--line);border-radius:var(--r-m);
background:var(--surface-2);margin-bottom:10px;align-items:end;
}
.package-row .pf{display:block;min-width:0}
.package-row .pf-l{display:block;font-size:12px;font-weight:600;color:var(--ink-2);margin-bottom:5px}
.package-row .pf:nth-child(1){grid-area:1/1/2/4}
.package-row .pf:nth-child(5){grid-area:1/4/2/7}
.package-row .pf:nth-child(2){grid-area:2/1/3/3}
.package-row .pf:nth-child(3){grid-area:2/3/3/5}
.package-row .pf:nth-child(4){grid-area:2/5/3/7}
.package-row .package-del{grid-area:3/1/4/7;width:100%;height:40px;font-size:13px}
/* 窄屏删组按钮本来就是整行宽，藏起来不会破坏对齐，直接不占位（否则留一行空白） */
#packageRows .package-row:only-child .package-del{display:none}
.package-del::after{content:" 移除本组"}
}
/* ============================================================
「最近查过的几条」—— 存在浏览器本地（localStorage），不落库，后端不参与。
做成一行横向芯片：始终可见、不占用表单与结果之间的垂直空间，
点一下回填表单并自动重查。
============================================================ */
.recent{margin:0 0 16px}
.recent:empty{display:none}
.recent-h{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.recent-h h3{font-size:12.5px;font-weight:650;color:var(--ink-2);letter-spacing:.02em}
.recent-h .r{margin-left:auto}
.recent-clear{
background:none;border:0;color:var(--ink-2);font-size:12.5px;cursor:pointer;padding:4px 8px;min-height:36px;
}
.recent-clear:hover{color:var(--bad-ink)}
.recent-list{
display:flex;gap:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;
padding-bottom:2px;scrollbar-width:thin;
}
.recent-item{
flex:0 0 auto;display:inline-flex;align-items:center;gap:9px;
padding:9px 13px;border:1px solid var(--line);border-radius:99px;
background:#fff;cursor:pointer;transition:.15s var(--ease);min-height:42px;
font-size:13px;color:var(--ink-2);
}
.recent-item:hover{border-color:var(--brand-line);background:var(--brand-soft);color:var(--brand-ink)}
.recent-item .rt{font-weight:650;font-variant-numeric:tabular-nums;color:var(--ink)}
.recent-item:hover .rt{color:var(--brand-ink)}
.recent-item .price{font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.recent-item .ts{font-size:11.5px;color:var(--ink-3);white-space:nowrap}
.recent-item:hover .ts{color:var(--brand-ink)}
@media(max-width:640px){
.recent-item{padding:7px 11px;font-size:12.5px;gap:7px}
}
/* ============================================================
后台 · 空运运价（v2）
原版 10 张同构卡片顺序铺开：全高 3770px ≈ 4 屏、689 个 DOM 节点、
121 个可点区域短边 < 40px，没有概览、没有筛选、不能折叠。
v2：概览条 + 筛选行 + 紧凑表格（一行一卡，档位横向成列）+ 行内展开编辑。
============================================================ */
.rt-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.rt-top h3{font-size:18px}
.rt-top .r{margin-left:auto;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.rt-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px}
@media(max-width:880px){.rt-stats{grid-template-columns:repeat(2,1fr)}}
.rt-st{background:#fff;border:1px solid var(--line);border-radius:var(--r-m);padding:12px 14px}
.rt-st .k{font-size:12px;color:var(--ink-2)}
.rt-st .v{font-size:24px;font-weight:700;margin-top:2px;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.rt-st .v.warn{color:var(--warn-ink)}
.rt-fil{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
.rt-fil select,.rt-fil input[type=text]{
width:auto;min-width:130px;min-height:38px;padding:7px 12px;font-size:13px;
}
.rt-fil input[type=text]{min-width:190px}
.rt-fil .sp{flex:1;min-width:0}
.rt-on{
display:inline-flex;align-items:center;gap:7px;white-space:nowrap;
font-size:13px;color:var(--ink-2);cursor:pointer;min-height:38px;
}
.rt-on input{width:16px;height:16px;accent-color:var(--brand);min-height:0;cursor:pointer}
.rt-tblwrap{
overflow-x:auto;-webkit-overflow-scrolling:touch;
border:1px solid var(--line);border-radius:var(--r-l);background:#fff;box-shadow:var(--sh-1);
}
table.rt-t{width:100%;border-collapse:collapse;font-size:13px;min-width:860px}
table.rt-t th{
text-align:left;padding:10px 12px;font-size:12px;font-weight:650;color:var(--ink-2);
background:var(--surface-2);border-bottom:1px solid var(--line);white-space:nowrap;
}
table.rt-t th.r,table.rt-t td.r{text-align:right}
table.rt-t td{
padding:10px 12px;border-bottom:1px solid var(--line-2);
white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--ink-2);
}
table.rt-t tbody tr:hover{background:#FAFBFC}
table.rt-t tr.off td{color:var(--ink-3)}
table.rt-t td.b{color:var(--ink);font-weight:600}
table.rt-t td.miss{color:var(--ink-4)}
table.rt-t td.acts{text-align:right}
table.rt-t tr.open>td{background:var(--brand-soft);border-bottom-color:var(--brand-line)}
.rt-sup{
display:inline-flex;align-items:center;gap:6px;padding:2px 8px;border-radius:var(--r-s);
background:var(--brand-soft);color:var(--brand-ink);font-size:12px;font-weight:650;
}
.rt-exp-td{background:#FBFAFF;padding:0!important;border-bottom:1px solid var(--line)!important}
.rt-exp-in{padding:14px 16px 16px;border-top:1px dashed var(--brand-line)}
.rt-exp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px 14px;align-items:end;margin-bottom:12px}
.rt-exp-grid label{display:block;font-size:12px;font-weight:600;color:var(--ink-2);margin-bottom:5px}
.rt-exp-grid .mini,.rt-exp-grid select{width:100%;text-align:left;min-height:38px}
.rt-exp-tiers{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end;margin-bottom:12px}
.rt-tier{flex:0 0 auto;text-align:center}
.rt-tier .lb{font-size:12px;color:var(--ink-2);margin-bottom:5px;white-space:nowrap}
.rt-tier .mini{width:86px;text-align:center}
.rt-exp-foot{display:flex;gap:16px;flex-wrap:wrap;align-items:center;font-size:13px;color:var(--ink-2)}
.rt-exp-foot .mini{width:86px}
.rt-empty{padding:40px 20px;text-align:center;color:var(--ink-2);font-size:14px}
/* 新增运价卡：默认收起，展开后仍是原来的批量录入表 */
.rt-newtable{overflow-x:auto;-webkit-overflow-scrolling:touch}
.rt-newtable table.t{min-width:520px}
@media(max-width:640px){
.rt-top h3{font-size:16px}
.rt-top .r{width:100%;margin-left:0}
.rt-top .r .btn{flex:1}
/* 三个下拉两列排布，关键字搜索独占一行，否则下拉被挤到只剩三个字 */
.rt-fil select{flex:1 1 calc(50% - 5px);min-width:0}
.rt-fil input[type=text]{flex:1 1 100%;min-width:0}
.rt-on{flex:1 1 100%;min-height:32px}
.rt-fil .sp{display:none}
.rt-exp-in{padding:12px}
}
/* ============================================================
旧版遗留（仍在别处引用，保留以免漏样式）
============================================================ */
.info-card{
min-height:290px;padding:32px 30px;
background:linear-gradient(145deg,#fff,#FAFBFF);border:1px solid var(--line);
display:flex;flex-direction:column;justify-content:center;border-radius:var(--r-l);
}
.info-icon{
width:44px;height:44px;border-radius:12px;background:var(--brand-soft);color:var(--brand);
display:grid;place-items:center;font-size:20px;margin-bottom:18px;
}
.info-card h2{font-size:20px;margin:0 0 8px;color:var(--deep-2)}
.info-card p{max-width:430px;line-height:1.8;color:var(--ink-2);margin:0 0 20px}
.info-points{display:grid;gap:9px;color:var(--ink-2);font-size:13px}