/* Case-local feedback. Content remains visible without JavaScript. */
.page-wl .wl-judge{position:relative}
.page-wl .wl-judge::after,.page-wl .wl-table .wl-row::after{
  content:'';position:absolute;inset:0;z-index:2;pointer-events:none;
  border:1px solid rgba(105,152,239,.55);opacity:0;transition:opacity .18s ease;
}
.page-wl .wl-judge .out,.page-wl .wl-table .wl-row .pill{transition:color .18s ease}
@media (hover:hover) and (pointer:fine){
  .page-wl .wl-judge:hover::after,.page-wl .wl-table .wl-row:hover::after{opacity:1}
  .page-wl .wl-judge:hover .out,.page-wl .wl-table .wl-row:hover .pill{color:var(--white)}
}
.page-wl .wl-pains .vline,.page-wl .wl-asks-line{transform-origin:top center}
.page-wl .hero-fixed-copy hr,.page-wl .wl-guar .gline{transform-origin:left center}
.page-wl .wl-diagram{position:relative;max-width:100%;min-width:0}
.page-wl .wl-diagram>img{display:block}
.page-wl .wl-flow{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:hidden;color:#adffe0}
.page-wl .wl-flow [data-node],.page-wl .wl-flow [data-route]{fill:none;stroke:currentColor;stroke-width:2;vector-effect:non-scaling-stroke;opacity:0}
.page-wl .wl-flow [data-route]{stroke-width:3;stroke-linecap:round;stroke-dasharray:90 2000;stroke-dashoffset:90}
@media (prefers-reduced-motion:reduce){
  .page-wl .wl-flow{display:none}
  .page-wl .wl-judge::after,.page-wl .wl-table .wl-row::after,
  .page-wl .wl-judge .out,.page-wl .wl-table .wl-row .pill{transition:none!important}
}

/* Preserve the original 2px border slot and responsive vline child positions. */
.page-wl .wl-pains{border-top-color:transparent}
.page-wl .wl-pains-rule{position:absolute;top:-2px;left:0;width:100%;height:2px;background:var(--green);transform-origin:left center;pointer-events:none}

/* Figma 529:6608. Native module coordinates map to the existing PNG footprint.
   Container units keep the diagram readable and aligned without a JS resizer.
   Only the decorative .wl-flow layer is animated; card geometry stays stable. */
.page-wl .wl-architecture{
  aspect-ratio:2048 / 971;container-type:inline-size;
  --wl-ax:calc(100cqw / 1588);--wl-ay:calc(var(--wl-ax) * .965921536744);
}
.page-wl .wl-architecture-wires{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.page-wl .wl-architecture-card{
  position:absolute;left:calc(var(--x) * var(--wl-ax));top:calc(var(--y) * var(--wl-ay));
  width:calc(var(--w) * var(--wl-ax));font-family:var(--sans);font-weight:400;
}
.page-wl .wl-architecture-card header{
  height:calc(54 * var(--wl-ay));padding:calc(8 * var(--wl-ay)) calc(4 * var(--wl-ax));
  display:flex;align-items:center;justify-content:space-between;background:#1a1a1a;
}
.page-wl .wl-architecture-card header i{display:block;flex:none;width:calc(6 * var(--wl-ax));height:calc(6 * var(--wl-ay));background:var(--green)}
.page-wl .wl-architecture-card h3{
  margin:0;font-size:calc(24 * var(--wl-ax));line-height:calc(38 * var(--wl-ay));font-weight:400;color:var(--t1);white-space:nowrap;
}
.page-wl .wl-architecture-card--processing h3{font-weight:500;color:var(--gold)}
.page-wl [data-architecture-node="dify"] h3{text-transform:capitalize}
.page-wl .wl-architecture-card p{
  margin:0;height:calc(var(--caption-h) * var(--wl-ay));padding:calc(12 * var(--wl-ay)) calc(12 * var(--wl-ax));
  background:#1a1a1a;color:var(--mut2);font-size:calc(16 * var(--wl-ax));line-height:calc(27 * var(--wl-ay));font-weight:400;
}
.page-wl .wl-architecture-crop{position:relative;overflow:hidden;height:calc(var(--image-h) * var(--wl-ay))}
.page-wl .wl-architecture .wl-architecture-crop>img{position:absolute;top:0;left:0;max-width:none;width:100%;height:100%;object-fit:fill;pointer-events:none}
.page-wl .wl-architecture .wl-architecture-crop--data>img{height:494.28%;top:-201.12%;left:0}
.page-wl .wl-architecture .wl-architecture-crop--photo>img{height:106%;width:108.23%;left:-8.25%;top:-5.96%}
.page-wl .wl-architecture-dify-images{display:flex;gap:calc(2 * var(--wl-ax))}
.page-wl .wl-architecture-crop--prompt{width:calc(228.07454 * var(--wl-ax));flex:none}
.page-wl .wl-architecture-crop--dify{width:calc(338.9335 * var(--wl-ax));flex:none}
.page-wl .wl-architecture .wl-architecture-crop--prompt>img{height:262.5%;width:148.15%;top:0;left:0}
.page-wl .wl-architecture .wl-architecture-crop--comfy>img{height:100%;width:117.53%;left:-6.85%;top:0}
/* A wider travelling mask selects the original SVG wire; it never redraws it. */
.page-wl .wl-architecture .wl-flow [data-route]{stroke-width:24}
.page-wl .wl-architecture .wl-flow [data-route],.page-wl .wl-architecture .wl-flow [data-pulse]{
  fill:none;stroke:#9bf6cc;stroke-width:24;stroke-linecap:butt;vector-effect:non-scaling-stroke;opacity:0;
}
.page-wl .wl-architecture .wl-flow [data-pulse="tip"]{stroke:#e1fff2}
.page-wl .wl-architecture .wl-flow-routes{filter:url(#wl-arch-pulse-glow)}
.page-wl .wl-architecture .wl-flow [data-node]{stroke:#a8ffdb;fill:rgba(168,255,219,.18)}

/* Preview triggers keep the original screenshot slots and crops unchanged. */
.page-wl .wl-mod button.shot{position:relative;padding:0;border:0;text-align:inherit;cursor:zoom-in}
.page-wl .wl-mod button.shot:disabled{cursor:default}
.page-wl .wl-mod button.shot:focus-visible{outline-offset:-3px}
.page-wl button.wl-architecture-crop{display:block;padding:0;border:0;text-align:inherit;cursor:zoom-in}
.page-wl .wl-architecture-card>button.wl-architecture-crop{width:100%}
.page-wl button.wl-architecture-crop:disabled{cursor:default}
.page-wl button.wl-architecture-crop:focus-visible{outline-offset:-3px}
/* Wanlian carousels share stepped depth and a synchronized cyclic phase. */
.page-wl .wl-cards-strip.is-depth-ready .wcard2{border-color:transparent;transition:border-color 160ms ease}
.page-wl .wl-cards-strip.is-depth-ready .wcard2.is-visual-current{border-color:rgba(216,162,74,.22)}
.page-wl .wl-cards-strip.is-depth-ready .wcard2.is-centered{border-color:rgba(216,162,74,.5)}
.page-wl .wl-axis.is-depth-ready .labs{left:50%;transform:translateX(-50%);transition:none}
.page-wl .wl-axis--weather.is-depth-ready .labs{width:960px;gap:24px}
.page-wl .wl-axis--date.is-depth-ready .labs{width:840px;gap:21px}
.page-wl .wl-axis.is-depth-ready .lab,
.page-wl .wl-axis.is-depth-ready .lab.is-cur{
  width:99px;flex:none;font-size:14px;line-height:22.4px;gap:18px;transition:color 160ms ease;
}
.page-wl .wl-axis--date.is-depth-ready .lab,.page-wl .wl-axis--date.is-depth-ready .lab.is-cur{width:102px}
.page-wl .wl-carousel-label-text{display:block;transform-origin:center top}
.page-wl .wl-axis.is-depth-ready .lab i{height:13px;transform-origin:center top;transition:background-color 160ms ease}
.page-wl .wl-axis.is-depth-ready.is-moving .lab{will-change:transform,opacity}
@media (prefers-reduced-motion:reduce){
  .page-wl .wl-cards-strip.is-depth-ready .wcard2,
  .page-wl .wl-axis.is-depth-ready .lab,
  .page-wl .wl-axis.is-depth-ready .lab i{transition:none!important;will-change:auto}
}

/* Figma 4140:1116. Keep the 1440px table on the existing desktop scale. */
.page-wl .wl-engineering-band{
  min-height:884px;background-image:url(assets/wanlian-engineering/background.svg);
  background-repeat:repeat-x;background-position:center top;
}
.page-wl .wl-guar{height:calc(450px * var(--wl-table-scale,1));overflow:visible}
.page-wl .wl-guar-stage{
  width:1440px;height:450px;display:grid;grid-template-rows:1px 223px 2px 223px 1px;
  transform:scale(var(--wl-table-scale,1));transform-origin:top left;
}
.page-wl .wl-guar .gline{
  height:1px;border:0;background:url(assets/wanlian-engineering/horizontal-line.svg) no-repeat;
}
.page-wl .wl-guar .gline:nth-child(3){align-self:end}
.page-wl .wl-guar .row{
  grid-template-columns:180px repeat(3,404px);gap:16px;padding:0;height:223px;
}
.page-wl .wl-guar .row>div{position:relative;min-width:0;padding:24px 16px;border:0}
.page-wl .wl-guar .row>div+div::before{
  content:'';position:absolute;left:-7.5px;top:-.5px;width:220px;height:1px;
  background:url(assets/wanlian-engineering/vertical-line.svg) no-repeat;
  transform:rotate(90deg);transform-origin:0 .5px;
}
.page-wl .wl-guar .row:nth-child(2)>div+div{height:210px}
.page-wl .wl-guar .row:nth-child(4)>div+div{padding-inline:12px}
.page-wl .wl-guar .row:nth-child(4)>div+div::before{top:1px}
.page-wl .wl-guar .lead-cell{padding:24px 16px!important}
.page-wl .wl-guar .lead-cell h4{line-height:24px}
.page-wl .wl-guar .row:nth-child(2) .lead-cell h4{color:#fff}
.page-wl .wl-guar .lead-cell p,
.page-wl .wl-guar .row>div>p.cell{margin:16px 0 0;font-size:16px;line-height:27px;color:var(--mut2)}
.page-wl .wl-guar .lead-cell .en{margin:0;color:var(--green);padding:0}
.page-wl .wl-guar h5{font-size:24px;line-height:24px;font-weight:400;white-space:nowrap}
.page-wl .wl-guar .hr{display:block;height:1px;width:374px;margin-top:17px;border:0;background:#212121}
.page-wl .wl-guar .tags{margin-top:15px;padding:0;display:flex;align-items:center;gap:8px}
.page-wl .wl-guar .tags span{
  flex:none;white-space:nowrap;line-height:27px;padding:3px 7px;
  border:1px solid rgba(36,199,137,.5);
}
.page-wl .wl-guar .row:nth-child(2)>div:nth-child(3) .tags span:first-child{min-width:80px}
.page-wl .wl-guar .row:nth-child(2)>div:nth-child(3) .tags span:last-child{min-width:119px}
.page-wl .wl-guar .row:nth-child(2)>div:nth-child(4) .tags span:last-child{min-width:117px}
.page-wl .wl-guar .row:nth-child(4)>div:nth-child(2) .tags span:first-child{min-width:121px}