/* =========================================================================
   A377Tool · Wise 皮肤覆盖层
   ---------------------------------------------------------------------------
   第三套皮肤。在页面自身样式之后加载，用 Wise（wise.com）的设计语言
   统一全站视觉：暖白画布 + 近黑文字 + 柠檬绿 CTA + 药丸按钮 + 环形描边。

   规范来源：DESIGN.md（Wise），见仓库根 design/wise/DESIGN.md。

   ★ 和 onepage.css 同构：**只是 wise 皮肤的覆盖层**。
     classic / one 下这个文件根本不加载（media="not all"），
     所以不存在「覆盖层泄漏到别的皮肤」的问题。
     但每条规则依然带 html[data-skin="wise"] 前缀 —— 这是第二道保险。

   ★ 字体说明（重要，别当成遗漏）：
     Wise 的显示字体是 **Wise Sans**（专有字体，仅 Wise 自有渠道可用），
     所以这里用 **Inter 900 + line-height 0.85** 去逼近它的「广告牌」观感 ——
     Inter 本来就是 Wise 的正文/UI 字体，规范里写着。
     Inter 走本地副本（SIL OFL 1.1，见 assets/fonts/LICENSE-INTER.txt），
     不依赖任何 CDN，和 vendor/ 里的 pdf.js 一个原则。

   ★ 只有浅色一套（和 one 皮肤同理）：
     DESIGN.md 只定义了浅色画布（暖白 + 近黑），没有深色变体。
     所以 wise 下把生效主题压成 light 并隐藏深浅色开关 ——
     不自己发明一套「Wise 深色」，那就不叫 Wise 了。
   ========================================================================= */

/* ---------------------------------------------------------------- 字体 */
@font-face{
  font-family:"Inter W";
  src:url("/assets/fonts/inter-var.woff2") format("woff2");
  font-weight:100 900;
  font-style:normal;
  font-display:swap;
}

/* ---------------------------------------------------------------- 令牌 */
html[data-skin="wise"]{
  /* 品牌 */
  --w-green:#9fe870;          /* Wise Green —— 只给 CTA 用，不做大面积底色 */
  --w-green-dark:#163300;     /* Dark Green —— 绿底上的文字 */
  --w-mint:#e2f6d5;           /* Light Mint —— 柔和绿面 */
  --w-green-pastel:#cdffad;   /* Pastel Green —— hover 强调 */

  /* 中性 */
  --w-ink:#0e0f0c;            /* Near Black —— 主文字 */
  --w-warm-dark:#454745;      /* 次级文字 */
  --w-gray:#666962;           /* 弱化文字 —— 承载信息的小字用它（见下方「为什么不用 #868685」） */
  --w-gray-soft:#868685;      /* 装饰性弱化：序号、分隔符、状态点。不承载信息才用它 */
  --w-surface:#e8ebe6;        /* Light Surface —— 微绿灰面 */
  --w-canvas:#ffffff;

  /* ★ 为什么弱化文字不用规范里的 #868685
     ---------------------------------------------------------------------
     DESIGN.md 把 #868685 定义为 "Muted text, tertiary"，照抄是对的，
     但实测它在浅底上的对比度只有 3.64（白）/ 3.29（#f2f4ef）/ 3.03（#e8ebe6），
     12~13px 的小字（提示、页脚、面包屑、城市名）压在上面是真的吃力 ——
     全站扫出 118 处，WCAG AA 正文线是 4.5。
     所以把「承载信息的弱化文字」提到 #666962：
     三种浅底上分别是 5.58 / 5.04 / 4.64，全部过 AA，
     同时明显浅于次级文字 #454745（7.79），层级还在。
     纯装饰的序号（01 / FILE）仍用 #868685 —— 它不承载信息，浅一点更好看。
     证据：tests/diag_wise_contrast.mjs 可复现这张对比表。 */

  /* 语义 */
  --w-positive:#054d28;
  --w-danger:#d03238;
  --w-warning:#ffd11a;
  --w-orange:#b8501c;         /* Bright Orange(#ffc091) 压深版，白底上才读得出 */

  /* 形状 */
  --w-ring:0 0 0 1px rgba(14,15,12,.12);   /* Wise 只有环形阴影，没有投影 */
  --w-r-sm:10px;
  --w-r-md:16px;
  --w-r-lg:30px;
  --w-r-xl:40px;
  --w-pill:9999px;

  /* 排版 */
  --w-font:"Inter W","PingFang SC","Hiragino Sans GB","Microsoft YaHei",
           -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --w-mono:ui-monospace,SFMono-Regular,"SF Mono",Consolas,"Liberation Mono",Menlo,monospace;
}

/* ------------------------------------------------ 变量重映射（第一组）
   --ui-* 是 tokens.css 的共享令牌。shell.css 的顶栏 / Toast / ui-btn /
   modal 全部引用它们，所以改这一组就能把全站小件一次带过去。        */
html[data-skin="wise"],
html[data-skin="wise"][data-theme="light"],
html[data-skin="wise"][data-theme="dark"]{
  --ui-accent:#163300!important;        /* 文字/图标强调色：绿底绿字在白底上对比度只有 1.5，不能用 */
  --ui-accent-ink:#163300!important;
  --ui-accent-soft:#e2f6d5!important;   /* 柔和绿面 = Light Mint */
  --ui-on-accent:#163300!important;     /* 绿按钮上的字 */

  --ui-bg:#ffffff!important;
  --ui-surface:#ffffff!important;
  --ui-sunken:#f2f4ef!important;
  --ui-line:#e4e7e0!important;
  --ui-line-strong:#d3d8cd!important;

  --ui-ink:#0e0f0c!important;
  --ui-ink-2:#454745!important;
  --ui-ink-3:var(--w-gray)!important;

  --ui-ok:#054d28!important;   --ui-ok-soft:#e2f6d5!important;
  --ui-err:#d03238!important;  --ui-err-soft:#fdeced!important;
  --ui-warn:#8a6d1f!important; --ui-warn-soft:#fff8dd!important;
  --ui-info:#163300!important; --ui-info-soft:#eef7e6!important;

  --ui-r-sm:10px!important;
  --ui-r-md:16px!important;
  --ui-r-lg:30px!important;
  --ui-r-full:9999px!important;

  /* 环形阴影，不是投影 */
  --ui-shadow-1:0 0 0 1px rgba(14,15,12,.12)!important;
  --ui-shadow-2:0 0 0 1px rgba(14,15,12,.16)!important;
  --ui-shadow-3:0 0 0 1px rgba(14,15,12,.2)!important;

  --ui-font:var(--w-font)!important;
  --ui-mono:var(--w-mono)!important;
  color-scheme:light;
}

/* ------------------------------------------------ 变量重映射（第二组）
   /trips/ 自己定义了一整套 --bg/--s1../--text/--a… ，是深色优先写的，
   浅色靠 html[data-theme="light"] 覆盖。wise 只有浅色一套，
   所以两个主题态都要给值，否则深色态下会黑底黑字。               */
html[data-skin="wise"],
html[data-skin="wise"][data-theme="light"],
html[data-skin="wise"][data-theme="dark"]{
  --bg:#ffffff!important;
  --s1:#ffffff!important;    /* 面板 */
  --s2:#f2f4ef!important;    /* 卡片 / 凸起 */
  --s3:#e8ebe6!important;    /* hover / 再上一层 */
  --s4:#dde3d6!important;    /* 选中 */
  --text:#0e0f0c!important;
  --dim:#454745!important;
  --dim2:var(--w-gray)!important;
  --ok:#054d28!important;
  --gold:#8a6d1f!important;
  --r:16px!important;

  /* 两个人的代表色。Wise 的调色板很窄（绿 + 中性 + 少量语义色），
     所以取「深绿 vs 亮橙压深」这一对 —— 白底上都能读，色相也拉得开。
     --w-orange 的来历见文件头令牌区注释。 */
  --a:#054d28!important;
  --b:#b8501c!important;

  /* 地图：浅底 + 绿系描边，跟着 wise 走 */
  --map-bg:#f2f4ef!important;      --map-grat:#e0e5da!important;
  --map-river:#c3d6c6!important;   --map-casing:#ffffff!important;
  --map-corridor:#b7c4ae!important;--map-spur:#d3dbca!important;
  --map-node-stroke:#ffffff!important;
  --map-ring:#054d28!important;    --map-both:#054d28!important;
  --map-label:#454745!important;   --map-label-stroke:#ffffff!important;
  --map-label-t3:#0e0f0c!important;--map-label-t1:#0e0f0c!important;
  --map-bar-bg:rgba(255,255,255,.92)!important;
  --map-bar-ink:#454745!important; --map-bar-hover:#0e0f0c!important;
  --map-tip-bg:rgba(255,255,255,.97)!important;
  --map-dot-top:#054d28!important; --map-dot-2:#0e0f0c!important;
  --map-dot-3:#868685!important;   --map-dot-dim:#b4b8b0!important;
  --map-leg-a:#054d28!important;   --map-leg-b:#b8501c!important;
}

/* ------------------------------------------------ 变量重映射（第三组）
   /draw/studio/ 是一套 shadcn 风格变量，/draw/code0/ 另有一套简化版。
   两页共用的名字一起给。                                          */
html[data-skin="wise"],
html[data-skin="wise"][data-theme="light"],
html[data-skin="wise"][data-theme="dark"]{
  --background:#ffffff!important;
  --foreground:#0e0f0c!important;
  --card:#ffffff!important;
  --card-foreground:#0e0f0c!important;
  --popover:#ffffff!important;
  --popover-foreground:#0e0f0c!important;
  --primary:#9fe870!important;              /* 主按钮 = Wise Green */
  --primary-foreground:#163300!important;
  --primary-20:rgba(159,232,112,.2)!important;
  --primary-90:rgba(159,232,112,.9)!important;
  --primary-fg:#163300!important;
  --primary-hover:#cdffad!important;        /* Pastel Green */
  --secondary:#f2f4ef!important;
  --secondary-foreground:#0e0f0c!important;
  --secondary-80:rgba(242,244,239,.8)!important;
  --muted:#f2f4ef!important;
  --muted-foreground:#454745!important;
  --accent:#e2f6d5!important;
  --accent-foreground:#163300!important;
  --border:#e4e7e0!important;
  --input:#e4e7e0!important;
  --ring:#163300!important;
  --ring-50:rgba(22,51,0,.5)!important;
  --destructive:#d03238!important;
  --destructive-20:rgba(208,50,56,.2)!important;
  --destructive-90:rgba(208,50,56,.9)!important;
  --success:#054d28!important;
  --success-border:#9fe870!important;
  --success-soft:#e2f6d5!important;
  --warn:#8a6d1f!important;
  --warn-border:#ffd11a!important;
  --warn-soft:#fff8dd!important;
  --sidebar:#ffffff!important;
  --sidebar-foreground:#0e0f0c!important;
  --sidebar-primary:#163300!important;
  --sidebar-primary-foreground:#ffffff!important;
  --sidebar-accent:#f2f4ef!important;
  --sidebar-accent-foreground:#0e0f0c!important;
  --sidebar-border:#e4e7e0!important;
  --sidebar-ring:#163300!important;
  --sidebar-fg-70:rgba(14,15,12,.7)!important;
  --surface:#ffffff!important;

  --radius:16px!important;
  --radius-sm:10px!important;
  --radius-md:16px!important;
  --radius-lg:30px!important;
  --radius-xl:40px!important;

  --shadow-xs:0 0 0 1px rgba(14,15,12,.12)!important;
  --shadow-sm:0 0 0 1px rgba(14,15,12,.12)!important;
  --shadow-md:0 0 0 1px rgba(14,15,12,.16)!important;
  --shadow-lg:0 0 0 1px rgba(14,15,12,.2)!important;
  --shadow-xl:0 0 0 1px rgba(14,15,12,.24)!important;

  --font-sans:var(--w-font)!important;
  --font-mono:var(--w-mono)!important;
}

/* ---------------------------------------------------------------- 基础 */
html[data-skin="wise"] *{box-sizing:border-box}
html[data-skin="wise"] ::selection{background:#9fe870;color:#163300}
html[data-skin="wise"] body{
  background:#ffffff!important;
  color:#0e0f0c!important;
  font-family:var(--w-font)!important;
  /* 规范：所有文字都开 "calt"（上下文替代字形） */
  font-feature-settings:"calt" 1;
  -webkit-font-smoothing:antialiased;
}
html[data-skin="wise"] body.shell-pad{padding-top:var(--shell-h)}
html[data-skin="wise"] a{color:inherit}

/* ★ 自带底色的元素要放行 color
   ---------------------------------------------------------------------
   a{color:inherit} 会把所有链接压成 body 的近黑。这对普通文字链接是对的
   （干掉浏览器默认的蓝/紫），但**页面里那些自己带深色底的药丸**会因此变成
   深底深字 —— 实测 .a377-back（#18181b 底 + #fafafa 字）被压成
   #0e0f0c on #18181b，对比度 1.09，字直接看不见。
   CSS 没法表达「有自己底色的才放行」，所以这里显式列出。
   加新元素时记住：只要它自带深色 background，就得在这份名单里。 */
html[data-skin="wise"] .a377-back{color:#fafafa}

/* 正文默认字重 600 —— Wise 的「自信」阅读重量，不是 400 */
html[data-skin="wise"] p,
html[data-skin="wise"] li,
html[data-skin="wise"] .desc,
html[data-skin="wise"] .hint{font-weight:600}

/* 标题：900 + 紧行距，逼近 Wise Sans 的广告牌观感 */
html[data-skin="wise"] h1,
html[data-skin="wise"] h2,
html[data-skin="wise"] h3,
html[data-skin="wise"] h4,
html[data-skin="wise"] .logo,
html[data-skin="wise"] .hubhead h1,
html[data-skin="wise"] .tool h2,
html[data-skin="wise"] .name,
html[data-skin="wise"] .brand,
html[data-skin="wise"] .a377bar-brand{
  font-family:var(--w-font)!important;
  font-weight:900!important;
  line-height:.92!important;
  letter-spacing:-.025em!important;
  font-feature-settings:"calt" 1;
}
html[data-skin="wise"] h1,
html[data-skin="wise"] .hubhead h1{line-height:.88!important}

/* 顶栏 */
html[data-skin="wise"] .a377bar{
  background:rgba(255,255,255,.92)!important;
  color:#0e0f0c!important;
  border-bottom:1px solid #e4e7e0!important;
  font-family:var(--w-font)!important;
}
html[data-skin="wise"] .a377bar-brand i{color:#454745!important}
html[data-skin="wise"] .a377bar-crumb{color:var(--w-gray)!important}
html[data-skin="wise"] .a377bar-crumb b{color:#454745!important}
html[data-skin="wise"] .a377bar-crumb::before{background:#e4e7e0!important}
html[data-skin="wise"] .a377bar-nav a{color:#454745!important;font-weight:600!important}
html[data-skin="wise"] .a377bar-nav a:hover{background:#f2f4ef!important;color:#0e0f0c!important}
html[data-skin="wise"] .a377bar-nav a[aria-current="page"]{background:#9fe870!important;color:#163300!important}
html[data-skin="wise"] .a377bar-theme{
  background:#ffffff!important;color:#454745!important;
  border:1px solid #e4e7e0!important;border-radius:9999px!important;
}
html[data-skin="wise"] .a377bar-theme:hover{background:#f2f4ef!important;color:#0e0f0c!important}
/* SKIN 按钮：wise 下把「当前皮肤」显示成绿色药丸 */
html[data-skin="wise"] .a377bar-skin{
  border-radius:9999px!important;
  border-color:#9fe870!important;
  background:#9fe870!important;
  color:#163300!important;
  font-family:var(--w-font)!important;
  font-weight:700!important;
}

/* 无障碍跳转：shell.css 是 --ui-ink 底 + --ui-bg 字，wise 下都要能读 */
html[data-skin="wise"] .a377-skip{
  background:#0e0f0c!important;color:#ffffff!important;
  border-radius:9999px!important;padding:8px 18px!important;
}

/* ---------------------------------------------------------- 页面纸张 */
html[data-skin="wise"] .wrap,
html[data-skin="wise"] .hub,
html[data-skin="wise"] #tripview main,
html[data-skin="wise"] .sidebar-wrapper,
html[data-skin="wise"] .sidebar-inset,
html[data-skin="wise"] .sidebar,
html[data-skin="wise"] .wrap .inner{
  background:#ffffff!important;
  color:#0e0f0c!important;
  box-shadow:none!important;
}
html[data-skin="wise"] .wrap,
html[data-skin="wise"] .hub,
html[data-skin="wise"] #tripview main{
  border:1px solid #e4e7e0!important;
  border-radius:var(--w-r-lg)!important;
}
html[data-skin="wise"] header{background:#ffffff!important;border-bottom:1px solid #e4e7e0!important}
html[data-skin="wise"] header .logo,
html[data-skin="wise"] header .who,
html[data-skin="wise"] header .chip,
html[data-skin="wise"] header .iconbtn{color:#0e0f0c!important}
html[data-skin="wise"] .gatebox{
  background:#ffffff!important;border:1px solid #e4e7e0!important;
  border-radius:var(--w-r-lg)!important;box-shadow:var(--w-ring)!important;
}
html[data-skin="wise"] .gate{background:rgba(14,15,12,.42)!important}

/* ------------------------------------------------- 卡片 / 通用容器
   规范：卡片 30px 圆角，只有环形描边，没有投影。
   注意每一条都必须带 html[data-skin="wise"] 前缀 —— 漏了前缀又带
   !important 的规则会穿透到 classic / one 皮肤（这条坑踩过，见 AGENTS.md）。 */
html[data-skin="wise"] .card,
html[data-skin="wise"] .panel,
html[data-skin="wise"] .res,
html[data-skin="wise"] .opts,
html[data-skin="wise"] .drop,
html[data-skin="wise"] .fitem,
html[data-skin="wise"] .hcard,
html[data-skin="wise"] .tripbar,
html[data-skin="wise"] .lockzone,
html[data-skin="wise"] .wbox,
html[data-skin="wise"] .guide,
html[data-skin="wise"] .fold,
html[data-skin="wise"] .mbox,
html[data-skin="wise"] .drawer,
html[data-skin="wise"] .cmpbar,
html[data-skin="wise"] .syncbar,
html[data-skin="wise"] .toast,
html[data-skin="wise"] .tool,
html[data-skin="wise"] .hubsec,
html[data-skin="wise"] .hubhead,
html[data-skin="wise"] .trip,
html[data-skin="wise"] .foldbody,
html[data-skin="wise"] .foldinner,
html[data-skin="wise"] .inset-header,
html[data-skin="wise"] .sidebar-container,
html[data-skin="wise"] .sidebar-inner{
  border-radius:var(--w-r-lg)!important;
  box-shadow:var(--w-ring)!important;
}
html[data-skin="wise"] .card,
html[data-skin="wise"] .panel,
html[data-skin="wise"] .res,
html[data-skin="wise"] .opts,
html[data-skin="wise"] .drop,
html[data-skin="wise"] .fitem,
html[data-skin="wise"] .hcard,
html[data-skin="wise"] .tripbar,
html[data-skin="wise"] .lockzone,
html[data-skin="wise"] .wbox,
html[data-skin="wise"] .guide,
html[data-skin="wise"] .fold,
html[data-skin="wise"] .mbox,
html[data-skin="wise"] .drawer,
html[data-skin="wise"] .cmpbar,
html[data-skin="wise"] .syncbar,
html[data-skin="wise"] .toast,
html[data-skin="wise"] .tool,
html[data-skin="wise"] .hubsec,
html[data-skin="wise"] .hubhead,
html[data-skin="wise"] .trip{
  border:1px solid rgba(14,15,12,.12)!important;
  background:#ffffff!important;
  color:#0e0f0c!important;
}
/* 小一点的容器用 16px，别全都是 30px */
html[data-skin="wise"] .fitem,
html[data-skin="wise"] .foldbody,
html[data-skin="wise"] .foldinner,
html[data-skin="wise"] .sidebar-inner,
html[data-skin="wise"] .inset-header{border-radius:var(--w-r-md)!important}

/* ---------------------------------------------------------------- 按钮
   规范：药丸形；hover 时**物理变大** scale(1.05)，按下 scale(0.95)。
   主按钮 = 柠檬绿底 + 深绿字；次按钮 = 深绿 8% 透明底。            */
html[data-skin="wise"] .btn,
html[data-skin="wise"] .ui-btn,
html[data-skin="wise"] .miniBtn,
html[data-skin="wise"] .gsubmit,
html[data-skin="wise"] .newtrip,
html[data-skin="wise"] .act,
html[data-skin="wise"] .iconbtn,
html[data-skin="wise"] .gx,
html[data-skin="wise"] .foldhead,
html[data-skin="wise"] .hswitch,
html[data-skin="wise"] .hlink,
html[data-skin="wise"] .rail2,
html[data-skin="wise"] .go{
  border-radius:9999px!important;
  box-shadow:none!important;
  border:1px solid transparent!important;
  background:rgba(22,51,0,.08)!important;
  color:#0e0f0c!important;
  font-family:var(--w-font)!important;
  font-weight:600!important;
  text-transform:none!important;
  letter-spacing:0!important;
  transform-origin:center;
  transition:transform .14s var(--ui-ease, cubic-bezier(.16,1,.3,1)),
             background .14s ease,color .14s ease,border-color .14s ease!important;
}
html[data-skin="wise"] .btn.primary,
html[data-skin="wise"] .ui-btn.primary,
/* .btn-default 是 studio 页的主操作变体（开始生成 / 导入 / 导出 ZIP）。
   页面自己的规则是 background:var(--primary)（wise 下 = 柠檬绿），但没有 !important，
   会被上面那条通用的 .btn 规则压成「8% 深绿底 + 近黑字」的次按钮样式 ——
   实测 #btnRun 就是这么变成浅底的。主操作必须是绿药丸，所以在这里显式放行。 */
html[data-skin="wise"] .btn-default,
html[data-skin="wise"] .gsubmit,
html[data-skin="wise"] .newtrip,
html[data-skin="wise"] .impSave,
html[data-skin="wise"] .go{
  background:#9fe870!important;
  color:#163300!important;
  border-color:#9fe870!important;
  font-weight:700!important;
}
/* 激活页签也是「主操作」，不该是页面原来的近黑药丸 ——
   /file/ 的 .tabs 用 --ink（= --ui-ink = 近黑）当选中底色，
   在 Wise 里这是唯一一处还留着黑药丸的地方（对照图上一眼就看出来）。
   规范说「柠檬绿只给按钮用」，选中态正是该用它的地方。
   顺带把 10px 的方角改成药丸，否则和全站其它按钮不是一个语言。 */
html[data-skin="wise"] .tabs{
  border-radius:9999px!important;
  background:#f2f4ef!important;
  border-color:#e4e7e0!important;
}
html[data-skin="wise"] .tabs button{
  border-radius:9999px!important;
  color:#454745!important;
}
html[data-skin="wise"] .tabs button[aria-selected="true"]{
  background:#9fe870!important;
  color:#163300!important;
  font-weight:700!important;
}
@media (hover:hover){
  html[data-skin="wise"] .tabs button:hover:not([aria-selected="true"]){
    background:#e2f6d5!important;color:#163300!important;
  }
}
/* 规范的招牌交互：按钮在 hover 时长大 */
@media (hover:hover){
  html[data-skin="wise"] .btn:hover:not(:disabled),
  html[data-skin="wise"] .ui-btn:hover:not(:disabled),
  html[data-skin="wise"] .miniBtn:hover:not(:disabled),
  html[data-skin="wise"] .gsubmit:hover:not(:disabled),
  html[data-skin="wise"] .newtrip:hover:not(:disabled),
  html[data-skin="wise"] .act:hover:not(:disabled),
  html[data-skin="wise"] .gx:hover:not(:disabled),
  html[data-skin="wise"] .foldhead:hover:not(:disabled),
  html[data-skin="wise"] .hswitch:hover:not(:disabled),
  html[data-skin="wise"] .rail2:hover:not(:disabled),
  html[data-skin="wise"] .go:hover{
    transform:scale(1.05)!important;
  }
  html[data-skin="wise"] .btn.primary:hover:not(:disabled),
  html[data-skin="wise"] .ui-btn.primary:hover:not(:disabled),
  html[data-skin="wise"] .btn-default:hover:not(:disabled),
  html[data-skin="wise"] .gsubmit:hover:not(:disabled),
  html[data-skin="wise"] .newtrip:hover:not(:disabled),
  html[data-skin="wise"] .impSave:hover:not(:disabled),
  html[data-skin="wise"] .go:hover{
    background:#cdffad!important;   /* Pastel Green */
    border-color:#cdffad!important;
    color:#163300!important;
  }
}
/* 分段控件：页面自己的 .seg 是 6px 方角 + overflow:hidden，
   子按钮靠裁切跟着圆。wise 下把容器改成药丸，子按钮就自动跟着圆了。 */
html[data-skin="wise"] .seg{border-radius:9999px!important}
html[data-skin="wise"] .btn:active:not(:disabled),
html[data-skin="wise"] .ui-btn:active:not(:disabled),
html[data-skin="wise"] .gsubmit:active:not(:disabled),
html[data-skin="wise"] .newtrip:active:not(:disabled),
html[data-skin="wise"] .go:active:not(:disabled),
html[data-skin="wise"] .miniBtn:active:not(:disabled),
html[data-skin="wise"] .act:active:not(:disabled){
  transform:scale(.95)!important;
}
html[data-skin="wise"] .btn.ghost,
html[data-skin="wise"] .ui-btn.ghost{
  background:transparent!important;color:#0e0f0c!important;border-color:#e4e7e0!important;
}
html[data-skin="wise"] .ui-btn:disabled,
html[data-skin="wise"] .btn:disabled,
html[data-skin="wise"] button:disabled{opacity:.45!important;cursor:not-allowed!important}
/* 焦点环：Wise 用深绿描边 */
html[data-skin="wise"] button:focus-visible,
html[data-skin="wise"] a:focus-visible,
html[data-skin="wise"] input:focus-visible,
html[data-skin="wise"] select:focus-visible,
html[data-skin="wise"] textarea:focus-visible,
html[data-skin="wise"] [tabindex]:focus-visible{
  outline:2px solid #163300!important;
  outline-offset:2px!important;
}

/* ---------------------------------------------------------------- 输入 */
html[data-skin="wise"] input,
html[data-skin="wise"] select,
html[data-skin="wise"] textarea{
  border-radius:var(--w-r-sm)!important;
  border:1px solid #d3d8cd!important;
  background:#ffffff!important;
  color:#0e0f0c!important;
  box-shadow:none!important;
  font-family:var(--w-font)!important;
  font-weight:600!important;
}
html[data-skin="wise"] input:focus,
html[data-skin="wise"] select:focus,
html[data-skin="wise"] textarea:focus{
  border-color:#163300!important;
  box-shadow:0 0 0 1px #163300!important;
}
html[data-skin="wise"] input::placeholder,
html[data-skin="wise"] textarea::placeholder{color:var(--w-gray)!important;font-weight:500!important}
html[data-skin="wise"] input[type=range]{accent-color:#163300!important}
html[data-skin="wise"] input[type=checkbox],
html[data-skin="wise"] input[type=radio]{accent-color:#163300!important}

/* ------------------------------------------------ 标签 / 徽章 / 进度 */
html[data-skin="wise"] .tag,
html[data-skin="wise"] .badge,
html[data-skin="wise"] .pill,
html[data-skin="wise"] .chip,
html[data-skin="wise"] .wchip,
html[data-skin="wise"] .blchip{
  border-radius:9999px!important;
  border:1px solid transparent!important;
  background:#e2f6d5!important;
  color:#163300!important;
  font-weight:600!important;
}
html[data-skin="wise"] .bar,
html[data-skin="wise"] .pbar{
  border-radius:9999px!important;
  background:#e8ebe6!important;
}
html[data-skin="wise"] .bar i,
html[data-skin="wise"] .pbar>div{background:#9fe870!important;border-radius:9999px!important}
html[data-skin="wise"] .dot,
html[data-skin="wise"] .sw,
html[data-skin="wise"] .av,
html[data-skin="wise"] .no,
html[data-skin="wise"] .hnum,
html[data-skin="wise"] .bnum{border-radius:9999px!important}

/* Toast / 模态：shell.css 用 --ui-ink 底 + --ui-bg 字，wise 下要换成深绿底白字 */
html[data-skin="wise"] .a377-toast{
  background:#0e0f0c!important;color:#ffffff!important;
  border-radius:9999px!important;box-shadow:none!important;
  font-family:var(--w-font)!important;font-weight:600!important;
}
html[data-skin="wise"] .a377-toast.err{background:#d03238!important}
html[data-skin="wise"] .a377-toast.ok{background:#054d28!important}
html[data-skin="wise"] .a377-modal-box{
  border-radius:var(--w-r-lg)!important;
  border:1px solid rgba(14,15,12,.12)!important;
  box-shadow:none!important;
}

/* ------------------------------------------------- /trips/ 写死的强调色
   原色是按深色底调过的，wise 是浅色面，原色对比度不够，换同色相的深色版。 */
html[data-skin="wise"] .delta .d{color:#b8501c!important}
html[data-skin="wise"] .tag.ok{color:#054d28!important}
html[data-skin="wise"] .tag.worn{color:#8a4a12!important}
html[data-skin="wise"] .tag.rain{color:#163300!important}
html[data-skin="wise"] .iconbtn.accent{color:#163300!important}

/* ---------------------------------------------------------------- 滚动条 */
html[data-skin="wise"] *{scrollbar-color:#c6ccc0 #ffffff}
html[data-skin="wise"] *::-webkit-scrollbar{width:10px;height:10px}
html[data-skin="wise"] *::-webkit-scrollbar-track{background:#ffffff}
html[data-skin="wise"] *::-webkit-scrollbar-thumb{
  background:#c6ccc0;border-radius:9999px;border:2px solid #ffffff;
}

/* ---------------------------------------------------------------- 响应式 */
@media (max-width:640px){
  html[data-skin="wise"] .wrap,
  html[data-skin="wise"] .hub,
  html[data-skin="wise"] #tripview main{border-left:0!important;border-right:0!important;border-radius:0!important}
}

/* 用户系统里开了「减少动态效果」：Wise 的缩放动效全部关掉 */
@media (prefers-reduced-motion:reduce){
  html[data-skin="wise"] .btn,
  html[data-skin="wise"] .ui-btn,
  html[data-skin="wise"] .go,
  html[data-skin="wise"] .gsubmit,
  html[data-skin="wise"] .newtrip{transform:none!important;transition:none!important}
}