/* =====================================================================
   WAKAMIZU BUNKA · wk-detail.css  (v20 细节动效)
   放在主样式之后加载。配合 js/wk-detail.js 使用。
   原则：
   - 「进场前隐藏」的状态全部挂在 html.wk-fx 下。JS 没跑、或系统开了
     「减少动态」时，没有 wk-fx，页面照常完整显示。
   - 每个动作只播一次；循环的只有：底色光斑漂移、营业中呼吸点、
     下一家虚线行进、品牌字带。它们都只在可见时运行。
   - 只用两条缓动：--wk-fx-ease（出）、--wk-fx-io（进出）。
   ===================================================================== */

@property --wk-c1 { syntax: '<color>'; inherits: true; initial-value: #fbf3c4; }
@property --wk-c2 { syntax: '<color>'; inherits: true; initial-value: #f9cedc; }
@property --wk-c3 { syntax: '<color>'; inherits: true; initial-value: #dcd2f7; }

:root {
  --wk-fx-ease: cubic-bezier(.22, .61, .36, 1);
  --wk-fx-io: cubic-bezier(.65, 0, .35, 1);
  --wk-fx-tape: rgba(242, 232, 142, .88);
  --wk-fx-tape-thin: rgba(242, 232, 142, .78);
  --wk-fx-gold: var(--wk-gold, #a07a50);
}

/* ---------------------------------------------------------------------
   04 标签胶带（定稿 4b：胶带贴上）
   静态样式对所有人生效；旧的 .eyebrow__ja 背景渐变由这里取代。
   --------------------------------------------------------------------- */
html .eyebrow__ja {
  position: relative;
  isolation: isolate;
  display: inline-block;
  background: none;
  padding-inline: .32em;
}
html .eyebrow__ja::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: -.18em;
  right: -.18em;
  top: 44%;
  height: 56%;
  background:
    repeating-linear-gradient(90deg, rgba(255, 255, 255, .22) 0 1px, rgba(255, 255, 255, 0) 1px 5px),
    var(--wk-fx-tape);
  /* 两端撕开的锯齿 */
  clip-path: polygon(0 0, 100% 0, calc(100% - 3px) 22%, 100% 44%, calc(100% - 3px) 66%, 100% 86%,
                     calc(100% - 2px) 100%, 0 100%, 3px 80%, 0 58%, 3px 36%, 0 16%);
  rotate: -1.6deg;
  transform-origin: 0 50%;
  box-shadow: 0 1px 0 rgba(160, 122, 80, .12);
}

@keyframes wk-tape-press {
  0%   { scale: 0 1.3; opacity: .5; }
  65%  { scale: 1.03 1.12; opacity: 1; }
  100% { scale: 1 1; opacity: 1; }
}
@keyframes wk-tape-rewipe {
  0%    { transform-origin: 100% 50%; scale: 1 1; }
  44%   { transform-origin: 100% 50%; scale: 0 1; }
  44.1% { transform-origin: 0 50%;    scale: 0 1; }
  100%  { transform-origin: 0 50%;    scale: 1 1; }
}

@media (prefers-reduced-motion: no-preference) {
  /* 顺序：英文 0s → 汉字 .18s → 胶带 .5s → 标题逐行 .7s 起 */
  html.wk-fx .wk-head:not(.is-wk-in) .eyebrow__latin { opacity: 0; transform: translateX(-12px); }
  html.wk-fx .wk-head:not(.is-wk-in) .eyebrow__ja { opacity: 0; }
  html.wk-fx .wk-head:not(.is-wk-in) .eyebrow__ja::before { scale: 0 1; }
  html.wk-fx .wk-head.is-wk-in .eyebrow__latin {
    transition: opacity .7s var(--wk-fx-ease), transform .9s var(--wk-fx-ease);
  }
  html.wk-fx .wk-head.is-wk-in .eyebrow__ja { transition: opacity .6s var(--wk-fx-ease) .18s; }
  html.wk-fx .wk-head.is-wk-in .eyebrow__ja::before {
    animation: wk-tape-press .9s var(--wk-fx-ease) .5s both;
  }
}
/* 电脑：鼠标移到标签上，胶带从右收回、再从左贴上一次（press 保持不重播） */
@media (prefers-reduced-motion: no-preference) and (hover: hover) and (pointer: fine) {
  html.wk-fx .wk-head.is-wk-in .eyebrow:hover .eyebrow__ja::before,
  html.wk-fx .eyebrow.wk-head.is-wk-in:hover .eyebrow__ja::before {
    animation: wk-tape-press .9s var(--wk-fx-ease) .5s both, wk-tape-rewipe .95s var(--wk-fx-io);
  }
}

/* ---------------------------------------------------------------------
   05 标题逐行上浮（定稿 5a）
   JS 把每个 [data-title-line] 的内容包进 .wk-tl；接管 motion.js 原来的
   clip-path 擦出。首屏（.hero/.phead/.c-hero）不动，交给入场动画。
   --------------------------------------------------------------------- */
@media (prefers-reduced-motion: no-preference) {
  html.wk-fx .wk-title > [data-title-line],
  html.wk-fx .wk-title.motion-title-single {
    opacity: 1 !important;
    clip-path: none !important;
    transition: none !important;
  }
  html.wk-fx .wk-title > [data-title-line],
  html.wk-fx .wk-title.wk-title-single {
    overflow: hidden;
    padding: 0 .04em .14em;
    margin: 0 -.04em -.14em;
  }
  html.wk-fx .wk-tl { display: inline-block; will-change: transform; }
  html.wk-fx .wk-title:not(.is-wk-in) .wk-tl { transform: translateY(115%); }
  html.wk-fx .wk-title.is-wk-in .wk-tl {
    transition: transform 1s var(--wk-fx-ease) calc(var(--wk-title-base, .25s) + var(--wk-i, 0) * .12s);
  }
  html.wk-fx .wk-title.is-wk-in .wk-tl.wk-tl-done { will-change: auto; }
  /* 跟在英文标签后面的标题，等胶带贴好再上来 */
  html.wk-fx .sec-head .wk-title,
  html.wk-fx .eyebrow ~ .wk-title { --wk-title-base: .7s; }
  /* motion.js 给整个 .sec-head 的淡入不再需要 */
  html.wk-fx .sec-head.motion-reveal-heading { opacity: 1 !important; }
}

/* ---------------------------------------------------------------------
   01 导航胶带（电脑导航 ≥1008px）+ 手机菜单当前项胶带
   --------------------------------------------------------------------- */
.site-nav { position: relative; isolation: isolate; }
html.wk-ready .site-nav a[aria-current="page"],
html.wk-ready .site-nav a:hover { background: transparent; box-shadow: none; }
.wk-navtape {
  position: absolute;
  z-index: -1;
  left: 0;
  top: 0;
  height: 7px;
  width: var(--w, 0px);
  translate: var(--x, 0px) var(--y, 0px);
  background: var(--wk-fx-tape);
  border-radius: 1px;
  rotate: -1deg;
  transform-origin: 0 50%;
  scale: 0 1;
  pointer-events: none;
}
.wk-navtape.is-on { scale: 1 1; }
@media (prefers-reduced-motion: no-preference) {
  .wk-navtape.is-ready {
    transition: translate .5s var(--wk-fx-io), width .5s var(--wk-fx-io), scale .6s var(--wk-fx-io);
  }
}
.wk-mlabel { position: relative; isolation: isolate; }
.wk-current .wk-mlabel::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: -.15em;
  right: -.15em;
  top: 52%;
  height: 46%;
  background: var(--wk-fx-tape);
  rotate: -1.2deg;
  transform-origin: 0 50%;
}
@media (prefers-reduced-motion: no-preference) {
  html.wk-fx .menu:not([hidden]) .wk-current .wk-mlabel::before {
    animation: wk-tape-press .8s var(--wk-fx-ease) .25s both;
  }
}

/* ---------------------------------------------------------------------
   02 顶部进度条
   --------------------------------------------------------------------- */
.wk-progress {
  position: fixed;
  z-index: 120;
  left: 0;
  right: 0;
  top: 0;
  height: 2px;
  pointer-events: none;
  background: linear-gradient(90deg, #e9d77a, #f3b3c8 35%, #cabdf0 65%, #8fd0c6);
  transform-origin: 0 50%;
  transform: scaleX(var(--wk-p, 0));
  transition: opacity .4s var(--wk-fx-ease);
}
.wk-progress[hidden],
html.wk-intro-active .wk-progress { opacity: 0; }

/* ---------------------------------------------------------------------
   03 板块底色光（每个 .sec 里一层，颜色随当前板块慢慢换）
   --------------------------------------------------------------------- */
.wk-has-aura { position: relative; isolation: isolate; }
.wk-aura {
  position: absolute;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
  contain: layout paint;
  --wk-c1: #fbf3c4; --wk-c2: #f9cedc; --wk-c3: #dcd2f7;
  transition: --wk-c1 1.6s var(--wk-fx-ease), --wk-c2 1.6s var(--wk-fx-ease), --wk-c3 1.6s var(--wk-fx-ease);
}
html[data-wk-tint="dawn"]  .wk-aura { --wk-c1: #fbf3c4; --wk-c2: #f9cedc; --wk-c3: #dcd2f7; }
html[data-wk-tint="mint"]  .wk-aura { --wk-c1: #c3eae4; --wk-c2: #d5f1ec; --wk-c3: #fbf3c4; }
html[data-wk-tint="petal"] .wk-aura { --wk-c1: #f9cedc; --wk-c2: #fde0ea; --wk-c3: #fbf3c4; }
html[data-wk-tint="lilac"] .wk-aura { --wk-c1: #dcd2f7; --wk-c2: #e8e1fa; --wk-c3: #c3eae4; }
html[data-wk-tint="lemon"] .wk-aura { --wk-c1: #fbf3c4; --wk-c2: #fbf6d0; --wk-c3: #f9cedc; }
.wk-aura i {
  position: absolute;
  border-radius: 50%;
  opacity: .6;
  will-change: transform;
  animation: 36s ease-in-out infinite alternate paused;
}
.wk-aura i:nth-child(1) {
  width: 72vmax; height: 72vmax; left: -26vmax; top: -28vmax;
  background: radial-gradient(circle closest-side, var(--wk-c1), rgba(255, 255, 255, 0));
  animation-name: wk-drift-a;
}
.wk-aura i:nth-child(2) {
  width: 64vmax; height: 64vmax; right: -28vmax; top: 22%;
  background: radial-gradient(circle closest-side, var(--wk-c2), rgba(255, 255, 255, 0));
  animation-name: wk-drift-b; animation-duration: 43s;
}
.wk-aura i:nth-child(3) {
  width: 60vmax; height: 60vmax; left: 8%; bottom: -34vmax;
  background: radial-gradient(circle closest-side, var(--wk-c3), rgba(255, 255, 255, 0));
  animation-name: wk-drift-c; animation-duration: 49s;
}
html.wk-fx .wk-has-aura.is-wk-inview .wk-aura i { animation-play-state: running; }
html:not(.wk-fx) .wk-aura { display: none; }
@keyframes wk-drift-a { to { transform: translate(9vw, 6vh) scale(1.12); } }
@keyframes wk-drift-b { to { transform: translate(-8vw, -5vh) scale(1.08); } }
@keyframes wk-drift-c { to { transform: translate(6vw, -8vh) scale(1.15); } }

/* ---------------------------------------------------------------------
   06 照片在框里慢一拍（错层视差）
   --------------------------------------------------------------------- */
@media (prefers-reduced-motion: no-preference) {
  html.wk-fx .wk-plx img {
    scale: 1.1;
    translate: 0 calc(var(--wk-pv, 0) * -4.5%);
  }
}

/* ---------------------------------------------------------------------
   07 营业中呼吸点 / 下一家虚线行进 / 品牌树竖线生长
   --------------------------------------------------------------------- */
.road__item--open .road__state::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 6px;
  border-radius: 50%;
  background: var(--wk-aqua-500, #4fa9a2);
  vertical-align: .12em;
}
.road__item--next .road__state::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 6px;
  border-radius: 50%;
  border: 1px solid var(--wk-fx-gold);
  box-sizing: border-box;
  vertical-align: .12em;
}
.road__item--next .road__state { color: var(--wk-gold-deep, #84623d); }
html.wk-ready .wk-dashed { border-color: transparent !important; }
.wk-dash { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.wk-dash rect {
  fill: none;
  stroke: var(--wk-fx-gold);
  stroke-opacity: .6;
  stroke-width: 1;
  stroke-dasharray: 5 5;
}
@keyframes wk-breathe {
  0% { box-shadow: 0 0 0 0 rgba(79, 169, 162, .5); }
  70%, 100% { box-shadow: 0 0 0 8px rgba(79, 169, 162, 0); }
}
@keyframes wk-blink { 50% { opacity: .25; } }
@keyframes wk-march { to { stroke-dashoffset: -40; } }
@media (prefers-reduced-motion: no-preference) {
  html.wk-fx .road.is-wk-inview .road__item--open .road__state::before { animation: wk-breathe 3.2s ease-out infinite; }
  html.wk-fx .road.is-wk-inview .road__item--open:nth-child(2) .road__state::before { animation-delay: .5s; }
  html.wk-fx .road.is-wk-inview .road__item--open:nth-child(3) .road__state::before { animation-delay: 1s; }
  html.wk-fx .road.is-wk-inview .road__item--next .road__state::before { animation: wk-blink 2.4s ease-in-out infinite; }
  html.wk-fx .is-wk-inview .wk-dash rect { animation: wk-march 6s linear infinite; }
  html.wk-fx .name__tree::before { transform-origin: 50% 0; }
  html.wk-fx .name__tree:not(.is-wk-in)::before { scale: 1 0; }
  html.wk-fx .name__tree.is-wk-in::before { transition: scale 1.4s var(--wk-fx-ease) .15s; }
}

/* ---------------------------------------------------------------------
   08 作品揭开 + 珠光扫一次 / 09 跟手倾斜
   --------------------------------------------------------------------- */
.wk-work .photo__frame { position: relative; }
.wk-sheen, .wk-glare { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.wk-sheen {
  background: linear-gradient(112deg,
    rgba(255, 255, 255, 0) 34%, rgba(251, 243, 196, .45) 43%, rgba(255, 255, 255, .7) 48%,
    rgba(249, 206, 220, .45) 53%, rgba(220, 210, 247, .4) 58%, rgba(255, 255, 255, 0) 68%);
  transform: translateX(-140%);
}
.wk-glare {
  background: radial-gradient(circle at var(--mx, 50%) var(--my, 30%), rgba(255, 255, 255, .5), rgba(255, 255, 255, 0) 45%);
  opacity: 0;
  transition: opacity .4s var(--wk-fx-ease);
}
@keyframes wk-sheen { from { transform: translateX(-140%); } to { transform: translateX(140%); } }
@media (prefers-reduced-motion: no-preference) {
  html.wk-fx .wk-work .photo__frame {
    transform: perspective(800px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) scale(var(--ps, 1));
    transition: transform .5s var(--wk-fx-ease);
  }
  html.wk-fx .wk-work.is-wk-hov .photo__frame { transition: transform .12s linear, clip-path 1.15s var(--wk-fx-io); }
  html.wk-fx .wk-work.is-wk-hov .wk-glare { opacity: 1; }

  html.wk-fx .wk-work:not(.is-wk-in) .photo__frame { clip-path: inset(100% 0 0 0 round var(--wk-r, 14px)); }
  html.wk-fx .wk-work:not(.is-wk-in) .photo__frame img { scale: 1.18; }
  html.wk-fx .wk-work:not(.is-wk-in) .photo__cap { opacity: 0; transform: translateX(-8px); }
  html.wk-fx .wk-work.is-wk-in .photo__frame {
    clip-path: inset(0 0 0 0 round var(--wk-r, 14px));
    transition: clip-path 1.15s var(--wk-fx-io) calc(var(--wk-i, 0) * .14s), transform .5s var(--wk-fx-ease);
  }
  html.wk-fx .wk-work.is-wk-in .photo__frame img {
    transition: scale 1.6s var(--wk-fx-ease) calc(var(--wk-i, 0) * .14s), opacity .6s var(--wk-fx-ease);
  }
  html.wk-fx .wk-work.is-wk-in .wk-sheen {
    animation: wk-sheen 1.4s var(--wk-fx-ease) calc(1.05s + var(--wk-i, 0) * .14s) both;
  }
  html.wk-fx .wk-work.is-wk-in .photo__cap {
    transition: opacity .6s var(--wk-fx-ease) calc(1.15s + var(--wk-i, 0) * .14s),
                transform .6s var(--wk-fx-ease) calc(1.15s + var(--wk-i, 0) * .14s);
  }
}

/* ---------------------------------------------------------------------
   10 中标题：序号从缝里升起 + 金线 + 细胶带（比大标签轻一级）
   --------------------------------------------------------------------- */
.pillar__number.wk-numline { display: flex; align-items: center; gap: 14px; overflow: hidden; }
.pillar__number.wk-numline::after {
  content: "";
  flex: none;
  width: 40px;
  height: 1px;
  background: currentColor;
  opacity: .7;
  transform-origin: 0 50%;
}
.wk-num { display: inline-block; }
.wk-mid { position: relative; isolation: isolate; padding-inline: .15em; }
.wk-mid::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 0;
  right: 0;
  top: 66%;
  height: 28%;
  background: var(--wk-fx-tape-thin);
  transform-origin: 0 50%;
}
@media (prefers-reduced-motion: no-preference) {
  html.wk-fx .wk-midgroup:not(.is-wk-in) .wk-num { transform: translateY(110%); }
  html.wk-fx .wk-midgroup:not(.is-wk-in) .wk-numline::after { scale: 0 1; }
  html.wk-fx .wk-midgroup:not(.is-wk-in) .wk-mid::before { scale: 0 1; }
  html.wk-fx .wk-midgroup.is-wk-in .wk-num { transition: transform .7s var(--wk-fx-ease) calc(.15s + var(--wk-i, 0) * .13s); }
  html.wk-fx .wk-midgroup.is-wk-in .wk-numline::after { transition: scale .9s var(--wk-fx-io) calc(.35s + var(--wk-i, 0) * .13s); }
  html.wk-fx .wk-midgroup.is-wk-in .wk-mid::before { transition: scale .7s var(--wk-fx-io) calc(.85s + var(--wk-i, 0) * .13s); }
}

/* ---------------------------------------------------------------------
   11 数字：停下那一刻闪一下金色，下面长出一根金线
   （motion.js 数完会写 data-count-complete="true"）
   --------------------------------------------------------------------- */
.proof__num { position: relative; }
.proof__num::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -8px;
  width: 48px;
  margin-left: -24px;
  height: 1px;
  background: linear-gradient(90deg, rgba(160, 122, 80, 0), var(--wk-fx-gold) 22% 78%, rgba(160, 122, 80, 0));
}
@keyframes wk-gleam { 40% { color: var(--wk-fx-gold); } }
@media (prefers-reduced-motion: no-preference) {
  html.wk-fx .proof__item:not(:has([data-count-complete="true"])) .proof__num::after { scale: 0 1; }
  html.wk-fx .proof__num::after { transition: scale .9s var(--wk-fx-io) .1s; }
  html.wk-fx [data-count-to][data-count-complete="true"] { animation: wk-gleam 1.2s var(--wk-fx-ease) both; }
}

/* ---------------------------------------------------------------------
   12 问答 / 课程模块：抽屉式展开 + 打开那题下面划一条胶带
   --------------------------------------------------------------------- */
.qa__q > span:not(.qa__mark) { position: relative; isolation: isolate; justify-self: start; }
.qa__q > span:not(.qa__mark)::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: -.1em;
  right: -.1em;
  top: 64%;
  height: 30%;
  background: var(--wk-fx-tape-thin);
  transform-origin: 0 50%;
  scale: 0 1;
}
.qa[open] .qa__q > span:not(.qa__mark)::before { scale: 1 1; }
@keyframes wk-acc-in { from { opacity: 0; transform: translateY(-6px); } }
@media (prefers-reduced-motion: no-preference) {
  html.wk-fx .qa__q > span:not(.qa__mark)::before { transition: scale .6s var(--wk-fx-io); }
  html.wk-fx .qa[open] .qa__q > span:not(.qa__mark)::before { transition-delay: .12s; }
  html.wk-fx details.wk-acc[open] > :not(summary) { animation: wk-acc-in .45s var(--wk-fx-ease) .08s both; }
  html.wk-fx details.wk-acc.is-wk-closing > :not(summary) { animation: none; opacity: 0; transition: opacity .2s; }
}

/* ---------------------------------------------------------------------
   14 按钮：珠光慢慢流 + 箭头前探 + 点下去一圈水波
   --------------------------------------------------------------------- */
.btn { isolation: isolate; }
.btn .ico { transition: transform .35s var(--wk-fx-ease); }
@media (prefers-reduced-motion: no-preference) and (hover: hover) and (pointer: fine) {
  html.wk-fx .btn--primary {
    transition: transform .28s var(--wk-fx-ease), box-shadow .28s var(--wk-fx-ease), background-position 1.1s var(--wk-fx-ease);
  }
  html.wk-fx .btn--primary:hover { background-position: 100% 0; }
  html.wk-fx .btn:hover .ico { transform: translateX(4px); }
}
.wk-ripple {
  position: absolute;
  z-index: -1;
  width: 16px;
  height: 16px;
  margin: -8px 0 0 -8px;
  border-radius: 50%;
  pointer-events: none;
  border: 1px solid rgba(255, 255, 255, .95);
  box-shadow: 0 0 0 .5px rgba(106, 88, 168, .22), inset 0 0 0 .5px rgba(106, 88, 168, .12);
  background: radial-gradient(circle, rgba(255, 255, 255, .6), rgba(255, 255, 255, 0) 72%);
  animation: wk-ripple .8s cubic-bezier(.2, .7, .3, 1) forwards;
}
.wk-work .wk-ripple { z-index: 3; }
@keyframes wk-ripple { from { transform: scale(0); opacity: 1; } to { transform: scale(var(--rs, 14)); opacity: 0; } }

/* ---------------------------------------------------------------------
   15 输入框：珠光细边 + 淡紫雾 + 标签名下划出胶带
   --------------------------------------------------------------------- */
html.wk-ready .field input:focus,
html.wk-ready .field select:focus,
html.wk-ready .field textarea:focus {
  outline: 2px solid transparent;            /* 高对比模式下仍有轮廓 */
  border-color: transparent;
  background:
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(100deg, #d9c35c, #e895b3, #a99be0, #6fbfb3) border-box;
  box-shadow: 0 0 0 5px rgba(220, 210, 247, .38);
}
.field input, .field select, .field textarea { transition: box-shadow .4s var(--wk-fx-ease); }
.wk-lbl { position: relative; isolation: isolate; padding-inline: .1em; }
.wk-lbl::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 0;
  right: 0;
  top: 62%;
  height: 32%;
  background: var(--wk-fx-tape-thin);
  transform-origin: 0 50%;
  scale: 0 1;
}
.field:focus-within .wk-lbl::before { scale: 1 1; }
@media (prefers-reduced-motion: no-preference) {
  .wk-lbl::before { transition: scale .5s var(--wk-fx-io); }
}

/* ---------------------------------------------------------------------
   16 品牌字带：JS 接管后关掉原来的 CSS 动画
   --------------------------------------------------------------------- */
html.wk-fx .brand-marquee__track.wk-js { animation: none !important; will-change: transform; }

/* ---------------------------------------------------------------------
   追加 A｜图片加载占位：先显示珠光底，清晰图再淡进来
   --------------------------------------------------------------------- */
@keyframes wk-shimmer { from { background-position: 130% 0, 0 0; } to { background-position: -130% 0, 0 0; } }
html.wk-fx .wk-loading {
  background:
    linear-gradient(110deg, rgba(255, 255, 255, 0) 30%, rgba(255, 255, 255, .55) 50%, rgba(255, 255, 255, 0) 70%) 0 0 / 220% 100% no-repeat,
    var(--wk-iris-soft, linear-gradient(120deg, rgba(251, 243, 196, .6), rgba(249, 206, 220, .6) 38%, rgba(220, 210, 247, .55) 68%, rgba(195, 234, 228, .6)));
  animation: wk-shimmer 1.6s linear infinite;
}
html.wk-fx .wk-loading img { opacity: 0; }
html.wk-fx .wk-img-fade { transition: opacity .6s var(--wk-fx-ease); }

/* ---------------------------------------------------------------------
   追加 B｜邮箱、电话旁的「复制」
   --------------------------------------------------------------------- */
.wk-copy {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  margin-left: 8px;
  padding: 2px 11px;
  border-radius: 999px;
  border: 1px solid var(--wk-line, rgba(34, 48, 58, .12));
  background: rgba(255, 255, 255, .72);
  font: inherit;
  font-size: 11px;
  line-height: 1.5;
  letter-spacing: .06em;
  color: var(--wk-ink-3, #66727c);
  cursor: pointer;
  vertical-align: middle;
  white-space: nowrap;
  -webkit-tap-highlight-color: transparent;
}
.wk-copy:hover { color: var(--wk-ink, #22303a); border-color: var(--wk-line-strong, rgba(34, 48, 58, .22)); }
.wk-copy:focus-visible { outline: 2px solid var(--wk-aqua-700, #236864); outline-offset: 2px; }
.wk-copy span { position: relative; padding-inline: .1em; }
.wk-copy span::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: -.15em;
  right: -.15em;
  top: 55%;
  height: 40%;
  background: var(--wk-fx-tape);
  transform-origin: 0 50%;
  scale: 0 1;
}
.wk-copy.is-done { color: var(--wk-ink, #22303a); }
.wk-copy.is-done span::before { scale: 1 1; }
@media (prefers-reduced-motion: no-preference) {
  .wk-copy span::before { transition: scale .45s var(--wk-fx-io); }
}

/* ---------------------------------------------------------------------
   追加 C｜车站名前的小点（门店详情页首屏那一个会呼吸）
   --------------------------------------------------------------------- */
.wk-station::before {
  content: "";
  display: inline-block;
  width: 5px;
  height: 5px;
  margin-right: 6px;
  border-radius: 50%;
  background: currentColor;
  opacity: .75;
  vertical-align: .2em;
}
@media (prefers-reduced-motion: no-preference) {
  html.wk-fx [data-wk-station].wk-station::before { animation: wk-breathe 3.2s ease-out infinite; opacity: 1; }
}

/* 打印时全部还原 */
@media print {
  .wk-aura, .wk-progress, .wk-navtape, .wk-copy, .wk-sheen, .wk-glare, .wk-dash { display: none !important; }
}