/* 主题变量(用户定 2026-06)：深/浅两套 srX 调色，配 theme.js 把 Tailwind 配色改引用本变量。
   :root = 深色(默认)；html.light = 苹果风明色。值用「空格分隔 RGB 三元组」配合 <alpha-value>，
   保留 bg-srblue-50/70 这类透明度写法。pre-paint 内联脚本按 localStorage / 系统偏好给 html 加 .light/.dark。 */
:root {
  --srink: 232 236 248;  --srcard: 20 26 48;
  --srgray-50: 13 18 38;  --srgray-100: 26 34 64;  --srgray-200: 35 44 78;
  --srgray-300: 48 60 100;  --srgray-400: 139 147 184;  --srgray-600: 189 197 224;
  --srblue-50: 13 40 71;  --srblue-100: 15 48 88;  --srblue-200: 28 74 133;
  --srblue-300: 88 166 255;  --srblue-400: 88 166 255;  --srblue-500: 56 139 253;
  --srblue-600: 31 111 235;  --srblue-700: 88 166 255;
  --srred: 248 81 73;  --srgreen: 63 185 80;  --sramber: 210 153 34;
  --srpurple-50: 39 26 77;  --srpurple-100: 46 33 84;  --srpurple-200: 68 48 140;  --srpurple-700: 163 113 247;
  color-scheme: dark;   /* 原生控件(下拉框/日期选择器/滚动条)跟随站点深色,不被系统偏好带跑 */
}
html.light {
  --srink: 23 28 42;  --srcard: 255 255 255;
  --srgray-50: 244 248 253;  --srgray-100: 234 241 250;  --srgray-200: 199 212 230;
  --srgray-300: 170 186 209;  --srgray-400: 108 122 148;  --srgray-600: 56 70 94;
  --srblue-50: 222 238 255;  --srblue-100: 203 228 255;  --srblue-200: 150 199 252;
  --srblue-300: 0 106 220;  --srblue-400: 0 122 255;  --srblue-500: 0 122 255;
  --srblue-600: 0 106 220;  --srblue-700: 8 82 178;
  --srred: 221 29 37;  --srgreen: 18 142 68;  --sramber: 186 86 0;
  --srteal: 6 148 138;  --srcoral: 232 51 90;
  --srpurple-50: 238 233 255;  --srpurple-100: 224 213 252;  --srpurple-200: 168 140 240;  --srpurple-700: 112 66 210;
  color-scheme: light;   /* 浅色主题 → 原生控件也用浅色 */
}

html, body { transition: background-color .2s ease, color .2s ease; }

/* 切换按钮：深色显太阳(点→变浅)，浅色显月亮(点→变深) */
.theme-toggle { display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px;
  border-radius:9px; border:1px solid rgb(var(--srgray-200)); background:transparent; color:rgb(var(--srgray-400));
  cursor:pointer; transition:color .15s, border-color .15s; }
.theme-toggle:hover { color:rgb(var(--srblue-700)); border-color:rgb(var(--srblue-300)); }
.theme-toggle svg { width:16px; height:16px; }
html.light .theme-toggle .ic-sun { display:none; }
html:not(.light) .theme-toggle .ic-moon { display:none; }

/* ================================================================
   外版首页「工具启动台」· 苹果玻璃质感(C 稳妥版:白底 .7 半透明 + 背景光晕)
   用户定案 2026-07-08。作用域仅公网首页 .pubhero,不影响其它页面。
   深色=默认(无前缀)/ 浅色=html.light 覆写。支柱色:关税赤陶橙·合规工具蓝·货运深蓝。
   ================================================================ */
/* 英雄区不再用专属彩色渐变面板 —— 透明,和整页一起坐在同一层 .ed-bg 光晕上(用户定 2026-07-08:上下必须同一质感) */
.pubhero { position:relative; padding:14px 4px 6px; background:transparent; }
@media (min-width:640px){ .pubhero { padding:22px 10px 10px; } }

/* 支柱主色(深色默认亮一档 / 浅色用定案色) */
.p-tariffs    { --h:#E0794A; --hbg:rgba(224,121,74,.18); }
.p-compliance { --h:#3FC6A0; --hbg:rgba(63,198,160,.18); }
.p-freight    { --h:#4A97CC; --hbg:rgba(74,151,204,.18); }
html.light .p-tariffs    { --h:#C95B2B; --hbg:rgba(201,91,43,.12); }
html.light .p-compliance { --h:#1E9E77; --hbg:rgba(30,158,119,.12); }
html.light .p-freight    { --h:#176A9E; --hbg:rgba(23,106,158,.14); }

/* 支柱标题:彩色图标片 + 标题 + 小色条 */
.picon { width:32px; height:32px; border-radius:10px; display:inline-flex; align-items:center;
  justify-content:center; color:var(--h); background:var(--hbg); border:1px solid rgba(255,255,255,.12); }
html.light .picon { border-color:rgba(255,255,255,.7); }
.picon .ed-ic { width:19px; height:19px; }
.pname { font-size:18px; font-weight:800; letter-spacing:-.01em; color:rgb(var(--srink)); }
.pname::after { content:""; display:inline-block; width:22px; height:3px; border-radius:3px;
  background:var(--h); vertical-align:middle; margin-left:9px; opacity:.85; }

/* 关键词行:彩色分词 + 短渐变线 */
.hero-eyebrow { color:rgb(var(--srgray-400)); }
.hero-eyebrow .w1{ color:#E0794A } .hero-eyebrow .w2{ color:#4A97CC } .hero-eyebrow .w3{ color:#57ABE9 }
.hero-eyebrow .w4{ color:#4A97CC } .hero-eyebrow .w5{ color:#57ABE9 }
html.light .hero-eyebrow .w1{ color:#C95B2B } html.light .hero-eyebrow .w2{ color:#176A9E }
html.light .hero-eyebrow .w3{ color:#1E88C8 } html.light .hero-eyebrow .w4{ color:#176A9E } html.light .hero-eyebrow .w5{ color:#1E88C8 }
.hero-krule { height:3px; width:132px; margin:14px auto 0; border-radius:3px;
  background:linear-gradient(90deg,#57ABE9,#4A97CC 55%,#E0794A); }
html.light .hero-krule { background:linear-gradient(90deg,#1E88C8,#176A9E 55%,#C95B2B); }

/* 玻璃工具卡(稳妥版:白底 .7,即使不支持模糊也够清晰) */
.tool-card { position:relative; display:block; width:100%; text-align:left; cursor:pointer;
  border-radius:18px; padding:18px 20px 16px 24px;
  background-color:rgba(48,49,53,.36);
  background-image:linear-gradient(140deg, rgba(255,255,255,.11), rgba(255,255,255,.02) 44%, transparent 72%);
  -webkit-backdrop-filter:blur(30px) saturate(200%); backdrop-filter:blur(30px) saturate(200%);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 2px 6px rgba(0,0,0,.26), 0 14px 30px -10px rgba(0,0,0,.5), 0 34px 60px -26px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.18), inset 0 -1px 0 rgba(0,0,0,.22);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background-color .18s ease; }
html.light .tool-card { background-color:rgba(255,255,255,.42);
  background-image:linear-gradient(140deg, rgba(255,255,255,.55), rgba(255,255,255,.12) 44%, transparent 72%);
  border-color:rgba(255,255,255,.9);
  box-shadow:0 2px 5px rgba(16,42,67,.05), 0 12px 24px -8px rgba(16,42,67,.14), 0 30px 54px -24px rgba(16,42,67,.26), inset 0 1px 0 rgba(255,255,255,.95), inset 0 -1px 0 rgba(16,42,67,.03); }
.tool-card::before { content:""; position:absolute; left:0; top:16px; bottom:16px; width:4px;
  border-radius:4px; background:var(--h); }
.tool-card:hover { transform:translateY(-4px); border-color:var(--h);
  box-shadow:0 3px 8px rgba(0,0,0,.3), 0 18px 36px -10px rgba(0,0,0,.55), 0 46px 76px -26px rgba(0,0,0,.68), inset 0 1px 0 rgba(255,255,255,.2); background-color:rgba(60,62,70,.44); }
html.light .tool-card:hover { background-color:rgba(255,255,255,.56);
  box-shadow:0 3px 8px rgba(16,42,67,.07), 0 18px 34px -8px rgba(16,42,67,.18), 0 48px 78px -24px rgba(16,42,67,.3), inset 0 1px 0 rgba(255,255,255,1); }
.tool-card .tc-title { font-size:14.5px; font-weight:700; color:rgb(var(--srink)); }
.tool-card .tc-desc { font-size:12.5px; line-height:1.55; margin-top:3px; color:#a6b0bd; }
html.light .tool-card .tc-desc { color:#5B6B7F; }
.tool-card .tc-cta { font-size:12.5px; font-weight:700; margin-top:10px; color:var(--h);
  display:inline-flex; align-items:center; gap:5px; }
.tool-card .tc-cta .arw { transition:transform .16s ease; }
.tool-card:hover .tc-cta .arw { transform:translateX(4px); }
.tool-card.soon { opacity:.9; cursor:default; }
.tool-card.soon .tc-title { color:rgb(var(--srgray-400)); }
.tool-card.soon .tc-cta { color:rgb(var(--srgray-400)); font-weight:600; }
.soon-badge { font-size:9px; font-weight:800; letter-spacing:.05em; text-transform:uppercase;
  padding:2px 6px; border-radius:5px; margin-left:8px; vertical-align:middle;
  background:var(--hbg); color:var(--h); }

/* 底部转化按钮:赤陶橙实心(明确但不像广告) */
.freight-cta { display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:700;
  color:#fff; background:#C95B2B; border-radius:10px; padding:9px 18px; text-decoration:none;
  box-shadow:0 10px 22px -10px rgba(201,91,43,.6); transition:filter .15s ease, transform .15s ease; }
.freight-cta:hover { filter:brightness(1.06); transform:translateY(-1px); }

@media (prefers-reduced-motion:reduce){
  .tool-card, .tool-card .tc-cta .arw, .freight-cta { transition:none; }
}

/* ================================================================
   全站 Liquid Glass(用户定 2026-07-08:整页统一玻璃,不许上新下旧)
   ① 固定光晕背景层 .ed-bg 给玻璃当"透得出的底";② 所有大面板转玻璃;
   ③ 弹窗玻璃遮罩 + 缓出动画。深=默认(html:not(.light))/ 浅=html.light。
   见记忆 design-liquid-glass-global。
   ================================================================ */
/* 画布兜底色(回弹滚动露出时) */
html.light { background:#F5F8FC; }
html:not(.light) { background:#0b1020; }

/* 固定全屏光晕背景(z-index:-1,body 需透明才露出)
   —— 用户 2026-07-08:浅色玻璃"看不出",根因是背景太白;加大、加浓、铺满整屏,
      让玻璃从上到下都透得出柔和色washes(蓝/青/桃/薰衣草,柔和不刺眼)。 */
.ed-bg { position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(1500px 1050px at 14% -12%, rgba(150,175,220,.26), transparent 58%),
    radial-gradient(1250px 950px at 100% 0%,   rgba(190,200,235,.22), transparent 58%),
    radial-gradient(1350px 1000px at 92% 108%, rgba(235,205,190,.22), transparent 58%),
    radial-gradient(1250px 980px at -10% 100%, rgba(175,190,225,.20), transparent 58%),
    radial-gradient(1100px 820px at 50% 40%,   rgba(180,198,230,.12), transparent 64%),
    linear-gradient(180deg,#F2F6FC 0%, #F7FAFE 46%, #FBF4EF 100%); }
html:not(.light) .ed-bg {
  background:
    radial-gradient(1100px 820px at 8% -8%,   rgba(72,150,235,.26), transparent 56%),
    radial-gradient(1000px 780px at 102% 6%,  rgba(30,150,160,.20), transparent 56%),
    radial-gradient(1050px 860px at 90% 104%, rgba(201,110,74,.24),  transparent 55%),
    radial-gradient(980px 820px at -6% 102%,  rgba(96,120,220,.20), transparent 56%),
    radial-gradient(760px 640px at 50% 48%,   rgba(70,130,200,.12), transparent 62%),
    linear-gradient(180deg,#0f1528 0%, #0a0f1f 55%, #121a36 100%); }

/* 所有大面板(bg-srcard + rounded-2xl)统一转玻璃 —— 覆盖 Tailwind 用 !important */
[class*="bg-srcard"][class*="rounded-2xl"] {
  background-color:rgba(255,255,255,.46) !important;
  background-image:linear-gradient(150deg, rgba(255,255,255,.7), rgba(255,255,255,.16) 42%, transparent 68%) !important;
  -webkit-backdrop-filter:blur(38px) saturate(240%); backdrop-filter:blur(38px) saturate(240%);
  border-color:rgba(255,255,255,.95) !important;
  box-shadow:0 2px 6px rgba(30,55,110,.07), 0 16px 34px -12px rgba(30,55,110,.18), 0 48px 84px -32px rgba(30,55,110,.32), inset 0 1.5px 0 rgba(255,255,255,1), inset 0 -1px 0 rgba(30,55,110,.05), inset 1px 0 0 rgba(255,255,255,.55) !important; }
html:not(.light) [class*="bg-srcard"][class*="rounded-2xl"] {
  background-color:rgba(22,30,58,.5) !important;
  background-image:linear-gradient(150deg, rgba(255,255,255,.11), rgba(255,255,255,.02) 40%, transparent 66%) !important;
  border-color:rgba(255,255,255,.13) !important;
  box-shadow:0 2px 8px rgba(0,0,0,.3), 0 16px 34px -10px rgba(0,0,0,.5), 0 44px 76px -30px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.14), inset 0 -1px 0 rgba(0,0,0,.25) !important; }

/* 弹窗:毛玻璃遮罩 + 缓出动画(替代原 bg-black/60,不许突然蹦出) */
.ed-modal-back { background:rgba(8,12,20,.34);
  -webkit-backdrop-filter:blur(12px) saturate(140%); backdrop-filter:blur(12px) saturate(140%);
  animation:edBackIn .26s ease-out both; }
.ed-modal-back > * { animation:edPanelIn .34s cubic-bezier(.16,1,.3,1) both; }
@keyframes edBackIn { from{opacity:0} to{opacity:1} }
@keyframes edPanelIn { from{opacity:0; transform:translateY(14px) scale(.975)} to{opacity:1; transform:none} }
@media (prefers-reduced-motion:reduce){ .ed-modal-back, .ed-modal-back > * { animation:none; } }

/* 说明:ETDETA 走针时钟已由 index.html 内联的品牌时钟系统提供(.ed-clock + data-ed-clock
   + __edClockReplay,圆形"ETDETA SHIPPING"钟)。此处不再另造,避免类名冲突。加载态统一复用它。 */

/* ================================================================
   层次 & 收纳(用户定 2026-07-08:去文字墙,次要信息「详情」收起,
   但内容留在 DOM 里给搜索引擎读;色彩点缀但不花俏)
   ================================================================ */
/* 可折叠「详情」—— 用原生 <details>,收起内容仍在 HTML(SEO 友好) */
.ed-more { margin-top:6px; }
.ed-more > summary { cursor:pointer; list-style:none; display:inline-flex; align-items:center; gap:5px;
  font-size:12px; font-weight:600; color:rgb(var(--srblue-300)); user-select:none; }
.ed-more > summary::-webkit-details-marker { display:none; }
.ed-more > summary::after { content:"⌄"; font-size:13px; line-height:1; transform:translateY(-1px); transition:transform .2s ease; }
.ed-more[open] > summary::after { transform:translateY(1px) rotate(180deg); }
.ed-more > summary:hover { text-decoration:underline; }
.ed-more .ed-more-body { margin-top:7px; }

/* 区块小标题的色彩点缀:标题前一枚小竖条(用 --acc 或默认工具蓝),克制 */
.ed-sec { display:flex; align-items:center; gap:9px; }
.ed-sec::before { content:""; width:4px; height:17px; border-radius:3px;
  background:var(--acc, rgb(var(--srblue-300))); flex:0 0 auto; }
.ed-acc-tariff   { --acc:#C95B2B; --acc-soft:rgba(201,91,43,.13); }
.ed-acc-compliance{ --acc:#1E9E77; --acc-soft:rgba(30,158,119,.13); }
.ed-acc-freight  { --acc:#176A9E; --acc-soft:rgba(23,106,158,.14); }
.ed-acc-data     { --acc:#2E9B8F; --acc-soft:rgba(46,155,143,.14); }
html:not(.light) .ed-acc-tariff{ --acc:#E0794A; --acc-soft:rgba(224,121,74,.2); }
html:not(.light) .ed-acc-compliance{ --acc:#3FC6A0; --acc-soft:rgba(63,198,160,.2); }
html:not(.light) .ed-acc-freight{ --acc:#4A97CC; --acc-soft:rgba(74,151,204,.2); }
html:not(.light) .ed-acc-data{ --acc:#37b3a4; --acc-soft:rgba(55,179,164,.2); }

/* 信任框图标片(点3:给三句话加存在感) */
.ed-tb-ic { width:42px; height:42px; border-radius:13px; display:flex; align-items:center;
  justify-content:center; margin:0 auto 11px; color:var(--acc); background:var(--acc-soft); }
.ed-tb-ic svg { width:22px; height:22px; }

/* 打印时隐藏光晕背景(保护决策书等可打印页)*/
@media print { .ed-bg { display:none !important; } }