/* source: assets/css/hanhai/prediction-static.css */
.hh-prediction-static { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(320px,.85fr); gap: 48px; align-items: center; padding-top: 30px; border-top: 1px solid #dce3ea; scroll-margin-top: 80px; }
.hh-prediction-overview { margin: 0; min-width: 0; }
.hh-prediction-scene { position: relative; }
.hh-scene-leaders { position: absolute; inset: 0; width: 100%; height: 100%; fill: none; stroke: #709ab6; stroke-width: 1; pointer-events: none; }
.hh-scene-leaders path { vector-effect: non-scaling-stroke; }
.hh-scene-leaders circle { fill: #f5f8fb; stroke-width: 1.5; }
.hh-scene-label { position: absolute; left: var(--sx); top: var(--sy); transform: translate(-50%,-50%); padding: 3px 6px; background: #f7f9fcf2; color: #3c6886; font-size: 13px; line-height: 1.5; letter-spacing: .04em; white-space: nowrap; pointer-events: none; }
.hh-prediction-overview figcaption { display: flex; justify-content: space-between; gap: 16px; margin-top: 14px; padding-top: 17px; border-top: 1px solid #dce5ec; color: #577d98; font-size: 15px; line-height: 1.6; letter-spacing: .03em; }
.hh-prediction-context { margin-left: auto; color: #708796; font-size: 12px; white-space: nowrap; }
.hh-prediction-overview img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: contain; -webkit-mask-image: linear-gradient(to right,transparent,#000 3%,#000 97%,transparent),linear-gradient(to bottom,transparent,#000 4%,#000 94%,transparent); mask-image: linear-gradient(to right,transparent,#000 3%,#000 97%,transparent),linear-gradient(to bottom,transparent,#000 4%,#000 94%,transparent); -webkit-mask-composite: source-in; mask-composite: intersect; }
.hh-content .hh-prediction-catalog h3 { font-size: 21px; margin: 0 0 20px; color: #203c50; font-weight: 500; }
.hh-content .hh-prediction-list { display: grid; grid-template-columns: 1fr; list-style: none; padding: 0; margin: 0; gap: 0; }
.hh-content .hh-prediction-list li { display: flex; align-items: baseline; gap: 17px; padding: 11px 0; margin: 0; border-bottom: 1px solid #dde5eb; color: #425c6e; font-size: 17px; line-height: 1.55; }
.hh-content .hh-prediction-list li:last-child { border-bottom: 0; }
.hh-content .hh-prediction-list li::before { display: none; }
.hh-prediction-list li > span:first-child { flex: 0 0 21px; color: #8ba1b0; font-size: 12px; font-variant-numeric: tabular-nums; }
@media (min-width:701px) and (max-width:1000px) {
  .hh-prediction-static { grid-template-columns: minmax(0,1fr) 320px; gap: 28px; }
  .hh-content .hh-prediction-list li { font-size: 16px; gap: 12px; padding: 10px 0; }
}
@media(max-width:700px) {
  .hh-prediction-static { display: flex; flex-direction: column; align-items: stretch; gap: 24px; padding-top: 24px; scroll-margin-top: 20px; }
  .hh-prediction-catalog { order: -1; }
  .hh-scene-label { padding: 2px 3px; font-size: 12px; letter-spacing: 0; }
  .hh-prediction-overview figcaption { margin-top: 16px; padding-top: 14px; font-size: 14px; }
  .hh-content .hh-prediction-catalog h3 { font-size: 20px; margin-bottom: 14px; }
  .hh-content .hh-prediction-list { grid-template-columns: 1fr; gap: 0; }
  .hh-content .hh-prediction-list li { gap: 12px; font-size: 15px; line-height: 1.55; padding: 9px 0; }
  .hh-prediction-list li > span:first-child { flex-basis: 17px; }
}


/* source: assets/css/hanhai/products.css */
.hh-product--refined .hh-feature-description { margin: 23px 0 12px; max-width: 430px; }
.hh-product--refined .hh-product-scope { margin: 0 0 26px; color: #577d98; font-size: 16px; line-height: 1.8; }
.hh-content.hh-product--refined .hh-capabilities { margin: 0; color: #36566d; }
.hh-content.hh-product--refined .hh-capabilities li { margin-top: 10px; }
.hh-product--refined .hh-feature-art { align-self: center; }
.hh-product--refined .hh-feature-art.hh-researched-art img { -webkit-mask-image: none; mask-image: none; }
.hh-product--refined .hh-feature-art img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: contain; -webkit-mask-image: linear-gradient(to right,transparent,#000 3%,#000 97%,transparent),linear-gradient(to bottom,transparent,#000 4%,#000 94%,transparent); mask-image: linear-gradient(to right,transparent,#000 3%,#000 97%,transparent),linear-gradient(to bottom,transparent,#000 4%,#000 94%,transparent); -webkit-mask-composite: source-in; mask-composite: intersect; }
.hh-product--refined .hh-feature-art figcaption { display: flex; justify-content: space-between; gap: 16px; margin-top: 14px; padding: 17px 0 0; border-top: 1px solid #dce5ec; color: #577d98; background: transparent; font-size: 15px; line-height: 1.6; letter-spacing: .03em; }
.hh-product--refined .hh-details-body { max-width: 900px; padding: 0 0 24px; }
.hh-product--refined .hh-details-body p { font-size: 16px; line-height: 1.9; margin: 0 0 12px; color: #596b7a; }
@media(max-width:700px) {
  .hh-product--refined .hh-feature-description { margin: 20px 0 10px; }
  .hh-product--refined .hh-product-scope { margin-bottom: 22px; }
  .hh-product--refined .hh-feature-art figcaption { font-size: 14px; gap: 10px; margin-top: 10px; padding-top: 14px; }
  .hh-product--refined .hh-feature-art { margin-top: 8px; }
}


/* source: assets/css/hanhai/model-diagrams.css */
/* Static explanatory visuals: typography, speech signals and a conceptual network. */
.hh-model-visual-v4 { min-width:0; }
.hh-model-visual-v4 .hh-visual-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; color:#385d76; font-size:16px; line-height:1.5; letter-spacing:.06em; }
.hh-model-visual-v4 .hh-visual-heading small { color:#8595a1; font-size:13px; font-weight:400; letter-spacing:.04em; }
.hh-speech-surface,.hh-network-surface { border:1px solid #e0e9ef; border-radius:14px; background:#fff; box-shadow:0 18px 50px -38px #52768c66; }
.hh-speech-surface { padding:28px 36px 32px; }
.hh-speech-input { padding:30px 0 28px; }
.hh-input-signal { color:#3d95cb; width:100%; margin:0 0 20px; }
.hh-input-signal svg { display:block; width:100%; height:76px; }
.hh-speech-input p { margin:0; color:#273943; font-size:clamp(22px,2.05vw,30px); line-height:1.6; font-weight:500; letter-spacing:.04em; }
.hh-spoken-term { color:#237dbc; border-bottom:1px solid #9fc9e5; padding-bottom:3px; }
.hh-speech-task { display:flex; align-items:center; gap:10px; padding:17px 0; border-block:1px solid #dfebf3; color:#33739e; font-size:15px; line-height:1.5; }
.hh-speech-task i { width:7px; height:7px; border:1px solid #498cba; background:#d5eafb; border-radius:50%; flex:none; }
.hh-speech-task small { margin-left:auto; color:#7c92a1; font-size:13px; }
.hh-speech-response { padding-top:28px; }
.hh-response-label { display:flex; align-items:center; gap:18px; color:#698294; font-size:14px; }
.hh-response-label div { width:90px; color:#559cc9; }
.hh-response-label svg { display:block; width:100%; }
.hh-speech-response p { margin:12px 0 0; font-size:clamp(17px,1.5vw,21px); line-height:1.65; color:#445e70; }
.hh-network-surface { overflow:hidden; }
.hh-network-surface .hh-visual-heading { padding:26px 28px 0; position:relative; z-index:1; }
.hh-network-canvas { position:relative; margin:6px 0 10px; }
.hh-content .hh-feature-art.hh-model-visual-v4 .hh-network-canvas img { display:block; width:100%; height:auto; aspect-ratio:720/460; object-fit:contain; -webkit-mask-image:none; mask-image:none; }
.hh-network-label { position:absolute; left:var(--nx); top:var(--ny); transform:translate(-50%,-50%); color:#4c718b; background:#ffffffed; padding:2px 5px; border-radius:3px; font-size:14px; line-height:1.5; white-space:nowrap; }
@media(max-width:700px) {
 .hh-speech-surface { padding:23px 22px 25px; }
 .hh-speech-input { padding-top:22px; padding-bottom:24px; }
 .hh-input-signal svg { height:60px; }
 .hh-speech-task { flex-wrap:wrap; gap:8px; }
 .hh-speech-task small { font-size:12px; }
 .hh-speech-response { padding-top:23px; }
 .hh-network-surface .hh-visual-heading { padding:22px 20px 0; }
 .hh-network-label { font-size:14px; padding-inline:3px; }
 .hh-network-canvas { margin-top:14px; }
}


/* source: assets/css/hanhai/content-directory.css */
/* Reading navigation begins after the hero and stays with the product content. */
.hh-content-directory {
  position: sticky;
  top: 60px;
  z-index: 90;
  background: rgba(255,255,255,.96);
  border-block: 1px solid #e4eaf0;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.hh-directory-inner { display: flex; align-items: center; justify-content: center; min-height: 42px; }
.hh-directory-links { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 12px; width: min(100%,568px); margin: 0; }
.hh-directory-links a { display: flex; align-items: center; justify-content: center; min-height: 32px; padding: 5px 14px; border-radius: 6px; color: #647583; font-size: 14px; line-height: 22px; white-space: nowrap; transition: background-color .18s, color .18s; }
.hh-directory-links a:hover { color: #226e9f; background: #f1f6fa; }
.hh-directory-links a[aria-current="location"] { color: #fff; background: #176a9f; font-weight: 600; }
.hh-directory-links a:focus-visible { outline: 2px solid #277bae; outline-offset: 2px; }
.hh-content-directory.is-pinned { box-shadow: 0 8px 24px -20px #42627999; }
.hh-model-content .hh-product .hanhai-heading { scroll-margin-top: 182px; }
#model-family #language-title { scroll-margin-top: 168px; }
.hh-model-content #prediction-explorer { scroll-margin-top: 126px; }
.hh-directory-short { display: none; }
/* Desktop chapter links sit in the outer gutter, clear of the primary header. */
@media(min-width:981px) {
  .hh-model-content > .hh-content-directory {
    position: fixed; top: 50%; right: max(12px,calc((100vw - 1240px)/2 - 116px)); transform: translateY(-50%);
    width: 92px; padding: 6px; border: 1px solid #d5e2ed; border-radius: 18px;
    background: #f8fbfe; box-shadow: 0 8px 28px rgba(32,73,104,.10);
    opacity: 0; visibility: hidden; pointer-events: none;
    transition: opacity .18s ease, visibility .18s;
  }
  .hh-model-content > .hh-content-directory.is-in-range {
    opacity: 1; visibility: visible; pointer-events: auto;
  }
  .hh-content-directory .hh-directory-inner { display: block; width: 100%; min-height: 0; }
  .hh-content-directory .hh-directory-links { display: flex; flex-direction: column; width: 100%; gap: 6px; }
  .hh-content-directory .hh-directory-links a { min-height: 42px; padding: 10px 4px; color: #46617a; font-size: 14px; font-weight: 500; line-height: 22px; border-radius: 11px; }
  .hh-content-directory .hh-directory-links a:hover { color: #155f91; background: #e2eff8; }
  .hh-content-directory .hh-directory-links a[aria-current="location"] { color: #fff; background: #176a9f; font-weight: 600; box-shadow: 0 3px 8px #176a9f26; }
  .hh-model-content .hh-product .hanhai-heading { scroll-margin-top: 138px; }
  #model-family #language-title { scroll-margin-top: 124px; }
  .hh-model-content #prediction-explorer { scroll-margin-top: 82px; }
}
@media(min-width:981px) and (max-width:1479px) {
  .hh-model-content > .hh-content-directory { right: 4px; width: 40px; padding: 6px 2px; border-radius: 14px; }
  .hh-content-directory .hh-directory-links a { padding-inline: 0; font-size: 13px; border-radius: 9px; }
  .hh-directory-long { display: none; }
  .hh-directory-short { display: inline; }
}
@media(max-width:700px) {
  .hh-content-directory { top: 60px; }
  .hh-directory-inner { width: calc(100% - 16px); padding: 0; }
  .hh-directory-links { width: min(100%,568px); gap: 3px; }
  .hh-directory-links a { padding: 5px 0; font-size: 13px; border-radius: 5px; }
  .hh-model-content .hh-product .hanhai-heading,
  #model-family #language-title { scroll-margin-top: 100px; }
  .hh-model-content #prediction-explorer { scroll-margin-top: 78px; }
}
@media(prefers-reduced-motion:reduce) { .hh-model-content > .hh-content-directory, .hh-directory-links a { transition: none; } }


/* source: assets/css/hanhai/closing.css */
/* Quiet closing, with a clear next action and the existing service boundary. */
.hanhai-closing.hh-closing-refined {
  min-height: 0;
  padding: 96px 0 76px;
  color: #111113;
  background: #f6f8fb;
  text-align: center;
}
.hh-closing-refined::before { content: none; }
.hh-closing-refined .hanhai-closing-inner {
  max-width: 1040px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.hh-closing-refined .hanhai-kicker { margin: 0 0 20px; color: #4380a5; font-size: 14px; font-weight: 500; }
.hh-closing-refined h2 { font-size: clamp(40px,4.8vw,68px); line-height: 1.16; letter-spacing: -.045em; }
.hh-closing-refined .hh-closing-scope { max-width: none; margin: 24px 0 0; color: #69717d; font-size: 18px; line-height: 1.8; }
.hh-closing-refined .hh-closing-contact {
  margin: 30px 0 0;
  padding: 13px 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 148px;
  gap: 0;
  color: #fff;
  background: #147cc1;
  border: 1px solid #147cc1;
  border-radius: 999px;
  font-size: 15px;
  font-weight: 500;
}
.hh-closing-refined .hh-closing-contact:hover { background: #096ba9; border-color: #096ba9; transform: none; }
.hh-closing-refined .hh-service-note { max-width: none; margin: 24px 0 0; color: #81909d; font-size: 13px; line-height: 1.7; }
@media(max-width:700px) {
  .hanhai-closing.hh-closing-refined { padding: 62px 0 50px; }
  .hh-closing-refined .hanhai-kicker { margin-bottom: 16px; font-size: 13px; }
  .hh-closing-refined h2 { font-size: 38px; }
  .hh-closing-refined .hh-closing-scope { margin-top: 18px; font-size: 15px; }
  .hh-closing-refined .hh-closing-contact { margin-top: 28px; padding: 12px 22px; gap: 0; }
  .hh-closing-refined .hh-service-note { margin-top: 22px; }
}


/* source: assets/css/hanhai/language-diagram.css */
/* Native task diagram: semantic labels remain readable as the layout narrows. */
.hh-language-surface { padding: 28px 32px 32px; border: 1px solid #dfe8ef; border-radius: 14px; background: #fff; box-shadow: 0 18px 50px -38px #52768c66; }
.hh-language-topline { display: flex; align-items: center; justify-content: space-between; gap: 16px; color: #385d76; font-size: 16px; line-height: 1.5; letter-spacing: .06em; }
.hh-language-topline small { color: #8595a1; font-size: 13px; font-weight: 400; }
.hh-language-request { margin: 26px 0 30px; padding-bottom: 26px; border-bottom: 1px solid #e2ebf1; font-size: clamp(22px,2vw,29px); line-height: 1.45; color: #273943; letter-spacing: .03em; font-weight: 500; }
.hh-language-graph { display: grid; grid-template-columns: minmax(0,1fr) 60px minmax(0,1fr); align-items: stretch; }
.hh-language-sources { display: grid; grid-template-rows: 1fr 1fr; gap: 18px; }
.hh-language-source { padding: 17px 18px 14px; border: 1px solid #e0e9ef; border-radius: 6px; background: #f8fafc; }
.hh-language-source > span { display: block; color: #526f83; font-size: 16px; line-height: 1.5; }
.hh-language-source svg { display: block; width: 100%; height: 44px; margin-top: 12px; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.hh-data-grid { stroke: #e4edf4; stroke-width: 1; }
.hh-data-context { stroke: #b4d2e7; stroke-width: 1.2; }
.hh-data-line { stroke: #4d96c5; stroke-width: 1.6; }
.hh-record-mark { stroke: #6ba1c6; stroke-width: 3; }
.hh-record-line { stroke: #b4c6d3; stroke-width: 3; }
.hh-record-secondary { stroke: #d7e1e9; stroke-width: 3; }
.hh-language-merge { display: block; width: 100%; height: 100%; fill: none; stroke: #8cb4cf; stroke-width: 1.2; }
.hh-language-merge circle { fill: #fff; }
.hh-language-report { display: flex; flex-direction: column; justify-content: center; padding: 20px 24px; background: #f5f9fc; border: 1px solid #d9e6ef; border-radius: 6px; min-width: 0; }
.hh-report-stage { color: #6a8aa2; font-size: 14px; line-height: 1.5; }
.hh-report-title { margin-top: 9px; color: #305d7b; font-size: 23px; line-height: 1.4; font-weight: 500; }
.hh-language-report svg { display: block; width: 100%; height: auto; max-height: 130px; margin-top: 24px; fill: none; }
.hh-report-copy { stroke: #c3d4e0; stroke-width: 4; stroke-linecap: round; }
.hh-report-divider { stroke: #dbe7ef; stroke-width: 1; }
.hh-report-bars { stroke: #79add0; stroke-width: 8; }
@media(max-width:1000px) and (min-width:701px) {
 .hh-language-surface { padding: 24px; }
 .hh-language-graph { grid-template-columns: minmax(0,1fr) 32px minmax(0,1fr); }
 .hh-language-source { padding-inline: 12px; }
 .hh-language-report { padding-inline: 16px; }
}
@media(max-width:700px) {
 .hh-language-surface { padding: 23px 22px 25px; }
 .hh-language-request { margin: 24px 0; padding-bottom: 23px; font-size: 23px; }
 .hh-language-graph { grid-template-columns: minmax(0,1fr) 28px minmax(0,1fr); }
 .hh-language-sources { gap: 16px; }
 .hh-language-source { padding: 14px 10px 12px; }
 .hh-language-source > span { font-size: 14px; }
 .hh-language-source svg { height: 34px; margin-top: 10px; }
 .hh-language-report { padding: 18px 12px; }
 .hh-report-stage { font-size: 14px; }
 .hh-report-title { font-size: 20px; margin-top: 10px; white-space: nowrap; }
 .hh-language-report svg { margin-top: 24px; }
}


/* source: assets/css/hanhai/content-audit.css */
/* Product meaning: sourced capabilities and clearly marked illustrative scenes. */
.hh-model-content .hh-feature-description { text-wrap: pretty; }
.hh-art-note { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; margin: 0 0 18px; color: #385d76; font-size: 16px; line-height: 1.5; }
.hh-art-note small { color: #8595a1; font-size: 12px; font-weight: 400; }
.hh-product[aria-labelledby="simulation-title"] .hh-feature { align-items: start; }
.hh-product--refined .hh-feature-art.hh-simulation-model-v10 { align-self: start; }
.hh-sim-surface { padding: 28px 30px 30px; border: 1px solid #dfe8ef; border-radius: 14px; background: #fff; box-shadow: 0 18px 50px -38px #52768c66; }
.hh-sim-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; color: #385d76; font-size: 16px; line-height: 1.5; }
.hh-sim-heading small { color: #8595a1; font-size: 12px; }
.hh-sim-title { margin: 24px 0 14px; color: #273943; font-size: clamp(23px,2vw,29px); line-height: 1.45; font-weight: 500; }
.hh-sim-network { position: relative; height: 260px; margin: 8px 0 10px; }
.hh-sim-connections { position: absolute; width: 100%; height: 100%; inset: 0; fill: none; stroke: #88adc6; stroke-width: 1.5; }
.hh-sim-connections path { vector-effect: non-scaling-stroke; }
.hh-sim-object { position: absolute; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 28%; height: 24.6153846%; padding: 8px 4px; border: 1px solid #dce7ef; border-radius: 6px; background: #f8fafc; color: #526f83; font-size: 15px; line-height: 1.5; text-align: center; }
.hh-sim-object small { color: #8297a6; font-size: 11px; margin-bottom: 3px; }
.hh-sim-object--source { left: 0; }
.hh-sim-object--grid { left: 36%; border-color: #bad4e6; background: #f1f7fb; color: #397699; }
.hh-sim-object--load { left: 72%; }
.hh-sim-object--upper { top: 8.46153846%; }
.hh-sim-object--lower { top: 63.8461538%; }
.hh-sim-intertie { position: absolute; left: calc(50% + 13px); top: 43.8461538%; color: #7b96aa; font-size: 12px; line-height: 1.5; }
.hh-sim-compute { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 24px 0 0; border-top: 1px solid #dfe9f0; color: #376b8e; font-size: 17px; line-height: 1.6; }
.hh-sim-compute svg { width: 36px; height: 18px; flex: 1 1 30px; max-width: 80px; fill: none; stroke: #7ca9c6; stroke-width: 1.4; }
.hh-sim-compute span:last-child { color: #255e85; font-weight: 500; }
@media(max-width:700px) {
  .hh-art-note { font-size: 14px; margin-bottom: 14px; }
  .hh-sim-surface { padding: 22px 17px 24px; border-radius: 10px; }
  .hh-sim-heading { font-size: 14px; gap: 10px; }
  .hh-sim-heading small { font-size: 11px; }
  .hh-sim-title { margin-top: 24px; font-size: 23px; }
  .hh-sim-network { height: 220px; }
  .hh-sim-object { font-size: 13px; }
  .hh-sim-object small { font-size: 10px; }
  .hh-sim-intertie { font-size: 11px; left: calc(50% + 9px); }
  .hh-sim-compute { padding-top: 20px; padding-right: 46px; font-size: 13px; gap: 8px; }
  .hh-sim-compute svg { max-width: 30px; }
}


/* source: assets/css/hanhai/scenes.css */
/* Silver-white engineering scenes. Motion is explanatory, scoped and pausable. */
[data-hh-motion] { --hh-cycle: 9s; position: relative; }
.hh-motion-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; color: #385d76; font-size: 16px; line-height: 1.5; }
.hh-motion-tools { display: inline-flex; align-items: center; gap: 12px; flex: none; }
.hh-motion-heading small { color: #8195a4; font-size: 12px; font-weight: 400; }
.hh-motion-toggle { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; padding: 6px; border: 1px solid #dfe8ef; border-radius: 50%; background: #ffffffb8; color: #5a819e; cursor: pointer; }
.hh-motion-toggle::before { content: ''; position: absolute; inset: -6px; }
.hh-motion-toggle:hover { color: #286c9a; border-color: #9dbdd4; background: #f1f7fb; }
.hh-motion-toggle:focus-visible { outline: 2px solid #3887be; outline-offset: 3px; }
.hh-motion-toggle svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.hh-motion-toggle .hh-play-icon { display: none; }
.hh-scene-paused .hh-motion-toggle .hh-pause-icon { display: none; }
.hh-scene-paused .hh-motion-toggle .hh-play-icon { display: block; }
.hh-motion-toggle[hidden] { display: none; }
.hh-motion-canvas { position: relative; width: 100%; aspect-ratio: 3 / 2; isolation: isolate; overflow: hidden; }
.hh-content .hh-feature-art .hh-motion-canvas > img { display: block; width: 100%; height: 100%; aspect-ratio: 3/2; object-fit: contain; -webkit-mask-image: none; mask-image: none; }
.hh-motion-overlay { position: absolute; inset: 0; width: 100%; height: 100%; fill: none; pointer-events: none; z-index: 2; }
.hh-motion-overlay path,.hh-motion-overlay line,.hh-motion-overlay circle,.hh-motion-overlay rect { vector-effect: non-scaling-stroke; }
.hh-motion-label { position: absolute; z-index: 3; color: #527a96; background: #ffffffdc; padding: 4px 8px; border-radius: 3px; font-size: 14px; line-height: 1.5; white-space: nowrap; pointer-events: none; }

[data-hh-motion]{--hh-cycle:12s;}
[data-hh-motion] [data-hh-animate]{animation-play-state:paused!important;}
[data-hh-motion].hh-scene-playing [data-hh-animate]{animation-play-state:running!important;}
.hh-vision-motion{--hh-cycle:9s;}
.hh-route-reveal { stroke: #4595c9; stroke-width: 1.45; stroke-dasharray: 1; stroke-dashoffset: 1; animation: hh-route-reveal var(--hh-cycle) ease-in-out infinite; }
@keyframes hh-route-reveal { 0%,8% { opacity:0; stroke-dashoffset:1; } 18% {opacity:.75;} 58%,78% {opacity:.75;stroke-dashoffset:0;} 92%,100% {opacity:0;stroke-dashoffset:0;} }
/* Vision: image acquisition, defect localization, then close-view assessment. */
.hh-vision-scan { fill: url(#hh-vision-scan-gradient-v11); opacity: 0; animation: hh-vision-scan var(--hh-cycle) ease-in-out infinite; }
@keyframes hh-vision-scan { 0%,6% {opacity:0;transform:translateY(0);} 14%{opacity:.42;} 41%{opacity:.42;transform:translateY(430px);} 48%,100%{opacity:0;transform:translateY(430px);} }
.hh-vision-target { stroke: #579fd0; stroke-width: 1.6; opacity: 0; animation: hh-vision-target var(--hh-cycle) ease-in-out infinite; }
@keyframes hh-vision-target {0%,35%{opacity:0;}47%,72%{opacity:.78;}90%,100%{opacity:0;}}
.hh-vision-inset { stroke: #66a7d2; stroke-width: 1.7; opacity: 0; animation: hh-vision-inset var(--hh-cycle) ease-in-out infinite; }
@keyframes hh-vision-inset {0%,46%{opacity:0;}60%,78%{opacity:.85;}93%,100%{opacity:0;}}

/* 01: a task passes through the existing workflow, then the report resolves. */
.hh-language-motion .hh-motion-label{transform:translateX(-50%);}
.hh-language-source-label{left:15%;top:13%;}
.hh-language-plan-label{left:47%;top:10%;}
.hh-language-report-label{left:79%;top:5%;}
.hh-task-signal{fill:none;stroke:#408fc2;stroke-width:2.6;stroke-linecap:round;stroke-dasharray:.12 .88;stroke-dashoffset:1;opacity:0;}
.hh-task-input{animation:hh-task-input var(--hh-cycle) ease-in-out infinite;}
.hh-task-reason{animation:hh-task-reason var(--hh-cycle) ease-in-out infinite;}
.hh-task-output{animation:hh-task-output var(--hh-cycle) ease-in-out infinite;}
@keyframes hh-task-input{0%,8%{opacity:0;stroke-dashoffset:1;}12%{opacity:.9;}28%{opacity:.9;stroke-dashoffset:0;}34%,100%{opacity:0;stroke-dashoffset:0;}}
@keyframes hh-task-reason{0%,26%{opacity:0;stroke-dashoffset:1;}30%{opacity:.9;}47%{opacity:.9;stroke-dashoffset:0;}53%,100%{opacity:0;stroke-dashoffset:0;}}
@keyframes hh-task-output{0%,45%{opacity:0;stroke-dashoffset:1;}49%{opacity:.9;}64%{opacity:.9;stroke-dashoffset:0;}70%,100%{opacity:0;stroke-dashoffset:0;}}
.hh-task-report{stroke:#75add1;stroke-width:2;stroke-linecap:round;opacity:0;animation:hh-task-report var(--hh-cycle) ease-in-out infinite;}
@keyframes hh-task-report{0%,59%{opacity:0;}70%,88%{opacity:.7;}100%{opacity:0;}}
/* 03: temporal voice progress, not scaling the whole waveform up and down. */
.hh-voice-base{opacity:.25;}
.hh-voice-trace{clip-path:inset(0 100% 0 0);}
.hh-listening-trace,.hh-recognition-progress{animation:hh-listening var(--hh-cycle) linear infinite;}
.hh-readback-trace,.hh-readback-progress{animation:hh-readback var(--hh-cycle) linear infinite;}
@keyframes hh-listening{0%,5%{clip-path:inset(0 100% 0 0);opacity:1;}36%,88%{clip-path:inset(0 0 0 0);opacity:1;}99%,100%{clip-path:inset(0 0 0 0);opacity:0;}}
@keyframes hh-readback{0%,48%{clip-path:inset(0 100% 0 0);opacity:1;}79%,90%{clip-path:inset(0 0 0 0);opacity:1;}99%,100%{clip-path:inset(0 0 0 0);opacity:0;}}
.hh-speech-progress-line{position:relative;color:#91a1ad!important;}
.hh-speech-progress{position:absolute;inset:0;color:#2c668e;clip-path:inset(0 100% 0 0);pointer-events:none;}
.hh-speech-progress-line .hh-spoken-term{color:inherit;border:0;padding:0;}
/* 04: a history-to-future time-series hint. No values, claim or click interaction. */
.hh-prediction-overview[data-hh-motion] .hh-prediction-scene{isolation:isolate;}
.hh-forecast-window{position:absolute;left:39%;bottom:4%;width:32%;z-index:4;padding:7px 9px 5px;background:linear-gradient(90deg,#fff0,#ffffffec 10%,#ffffffec 90%,#fff0);pointer-events:none;}
.hh-forecast-caption{display:flex;justify-content:space-between;color:#7a94a7;font-size:11px;line-height:1.5;padding:0 3px;}
.hh-forecast-caption span:last-child{color:#3782b5;}
.hh-forecast-window svg{display:block;width:100%;height:auto;fill:none;overflow:visible;}
.hh-forecast-axis{stroke:#b3c8d680;stroke-width:1;stroke-dasharray:2 4;}
.hh-history-line{stroke:#91aebe;stroke-width:1.7;}
.hh-forecast-ghost{stroke:#c5deed;stroke-width:1.3;stroke-dasharray:3 4;}
.hh-forecast-line{stroke:#338abe;stroke-width:2;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;animation:hh-forecast var(--hh-cycle) ease-in-out infinite;}
@keyframes hh-forecast{0%,12%{stroke-dashoffset:1;opacity:0;}17%{opacity:1;}59%,87%{stroke-dashoffset:0;opacity:1;}100%{stroke-dashoffset:0;opacity:0;}}
.hh-prediction-overview .hh-scene-label{z-index:3;}
/* 05: projected white city, feeder flows, fault isolation and alternate restoration. */
.hh-city-scene{--hh-grid-cycle:24s;}
.hh-city-map{position:relative;}
.hh-city-status{position:absolute;top:6px;left:2px;z-index:4;display:grid;min-width:76px;padding:5px 10px;background:#f5f8fbe6;border:1px solid #e4ecf2;border-radius:5px;font-size:12px;line-height:1.5;color:#64879f;}
.hh-city-phase{grid-area:1/1;opacity:0;white-space:nowrap;}
.hh-city-phase-normal{animation:hh-city-normal var(--hh-grid-cycle) linear infinite;}
.hh-city-phase-fault{color:#be5151;animation:hh-city-fault var(--hh-grid-cycle) linear infinite;}
.hh-city-phase-switch{color:#a57c22;animation:hh-city-switch var(--hh-grid-cycle) linear infinite;}
.hh-city-phase-restored{animation:hh-city-restored var(--hh-grid-cycle) linear infinite;}
@keyframes hh-city-normal{0%,19%{opacity:1;}21%,95%{opacity:0;}98%,100%{opacity:1;}}
@keyframes hh-city-fault{0%,19%{opacity:0;}21%,32%{opacity:1;}34%,100%{opacity:0;}}
@keyframes hh-city-switch{0%,32%{opacity:0;}34%,46%{opacity:1;}48%,100%{opacity:0;}}
@keyframes hh-city-restored{0%,46%{opacity:0;}48%,93%{opacity:1;}95%,100%{opacity:0;}}
.hh-city-scene .hh-motion-canvas{overflow:hidden;}
.hh-content .hh-city-scene .hh-motion-canvas>img{mask-image:none;}
.hh-city-network{stroke-linecap:round;stroke-linejoin:round;}
.hh-grid-track,.hh-grid-original{stroke:#689fc8;stroke-width:1.45;}
.hh-grid-service{stroke:#87b5d7;stroke-width:.7;opacity:.75;}
.hh-grid-load-track{stroke:#77a9cf;stroke-width:1.35;animation:hh-grid-load-visibility var(--hh-grid-cycle) linear infinite;}
.hh-grid-load-service{stroke:#87b5d7;stroke-width:.7;animation:hh-grid-load-visibility var(--hh-grid-cycle) linear infinite;}
.hh-grid-original-base{stroke:#d3dce3;stroke-width:1.1;}
.hh-grid-original{animation:hh-grid-original-visibility var(--hh-grid-cycle) linear infinite;}
.hh-grid-backup-base{stroke:#c7d4df;stroke-width:1.2;stroke-dasharray:3 4;}
.hh-grid-flow{stroke:#3587c1;stroke-width:2;stroke-dasharray:3 29;animation:hh-grid-drift 2.8s linear infinite;}
.hh-grid-load-flow{animation:hh-grid-drift 2.8s linear infinite,hh-grid-load-flow-visibility var(--hh-grid-cycle) linear infinite;}
.hh-grid-original-flow{animation:hh-grid-drift 2.8s linear infinite,hh-grid-original-visibility var(--hh-grid-cycle) linear infinite;}
.hh-grid-alternate{stroke:#d4a530;stroke-width:2.1;stroke-dasharray:1;stroke-dashoffset:1;animation:hh-grid-connect var(--hh-grid-cycle) ease-in-out infinite;}
.hh-grid-alternate-flow{stroke:#e6b840;stroke-width:2.6;animation:hh-grid-drift 2.8s linear infinite,hh-grid-alternate-visibility var(--hh-grid-cycle) linear infinite;}
@keyframes hh-grid-drift{to{stroke-dashoffset:-64;}}
@keyframes hh-grid-original-visibility{0%,19%{opacity:1;}21%,95%{opacity:0;}98%,100%{opacity:1;}}
@keyframes hh-grid-load-visibility{0%,19%{opacity:.9;}21%,45%{opacity:.18;}48%,100%{opacity:.9;}}
@keyframes hh-grid-load-flow-visibility{0%,19%{opacity:1;}21%,45%{opacity:0;}48%,100%{opacity:1;}}
@keyframes hh-grid-connect{0%,32%{opacity:0;stroke-dashoffset:1;}34%{opacity:1;stroke-dashoffset:1;}46%,93%{opacity:1;stroke-dashoffset:0;}95%,100%{opacity:0;stroke-dashoffset:0;}}
@keyframes hh-grid-alternate-visibility{0%,45%{opacity:0;}48%,93%{opacity:1;}95%,100%{opacity:0;}}
.hh-grid-junction{fill:#fff;stroke:#79a9ca;stroke-width:1;}
.hh-grid-source-halo{fill:#f0f7fc;stroke:#b8d7ee;stroke-width:1;}
.hh-grid-source{fill:#398cc6;stroke:#fff;stroke-width:1.5;}
.hh-grid-fault{animation:hh-grid-fault-visibility var(--hh-grid-cycle) linear infinite;}
@keyframes hh-grid-fault-visibility{0%,19%{opacity:0;}21%,93%{opacity:1;}96%,100%{opacity:0;}}
.hh-grid-switch{fill:#fff;stroke:#8dacbf;stroke-width:1.6;}
.hh-grid-isolate-closed{stroke:#6b9fc3;animation:hh-grid-original-visibility var(--hh-grid-cycle) linear infinite;}
.hh-grid-isolate-open{stroke:#cf9e29;animation:hh-grid-fault-visibility var(--hh-grid-cycle) linear infinite;}
.hh-grid-tie-open{stroke:#a9bccb;animation:hh-grid-tie-open var(--hh-grid-cycle) linear infinite;}
.hh-grid-tie-closed{stroke:#d4a530;animation:hh-grid-alternate-visibility var(--hh-grid-cycle) linear infinite;}
@keyframes hh-grid-tie-open{0%,44%{opacity:1;}47%,94%{opacity:0;}97%,100%{opacity:1;}}
.hh-city-legend{position:relative;z-index:3;display:flex;align-items:center;gap:22px;padding-top:9px;margin-top:0;border-top:1px solid #e7eef3;color:#68879c;font-size:12px;line-height:1.5;}
.hh-city-legend>span{display:flex;align-items:center;gap:7px;white-space:nowrap;}
.hh-city-legend i{width:7px;height:7px;display:block;border-radius:50%;}
.hh-city-key-flow{background:#398cc6;}
.hh-city-key-fault{background:#df5050;}
.hh-city-key-change{background:#d4a530;}
.hh-city-legend small{margin-left:auto;font-size:11px;color:#8d9fab;}
@media(max-width:700px){
 .hh-city-status{font-size:11px;padding:3px 7px;top:0;}
 .hh-city-legend{gap:15px;font-size:11px;margin-top:0;padding-top:7px;}
 .hh-city-legend>span{gap:5px;}
 .hh-city-legend small{font-size:10px;}
 .hh-grid-flow{stroke-width:1.6;}
 .hh-grid-alternate,.hh-grid-alternate-flow{stroke-width:1.9;}
 .hh-grid-fault>circle:first-child{r:32;}
 .hh-grid-fault>circle:last-child{r:14;}
}

/* Do not keep composited hero decoration and blur running behind the product page. */
.hanhai-hero.hh-hero-idle *,.hanhai-hero.hh-hero-idle *::before,.hanhai-hero.hh-hero-idle *::after{animation-play-state:paused!important;will-change:auto!important;}
.hh-content-directory{background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none;}
@media(max-width:700px){
 .hh-motion-heading{gap:10px;margin-bottom:12px;font-size:14px;}
 .hh-motion-tools{gap:8px;}
 .hh-motion-heading small{font-size:11px;}
 .hh-motion-toggle{width:28px;height:28px;padding:5px;}
 .hh-motion-label{padding:2px 4px;font-size:12px;}
 .hh-sandbox-object{padding:2px 3px;font-size:11px;}
 .hh-sandbox-object--low{top:auto!important;bottom:4px;transform:translateX(-50%);}
 .hh-forecast-window{left:38%;bottom:3%;width:34%;padding:2px 4px;}
 .hh-forecast-caption{font-size:10px;}
}

/* V17: equipment-ended cable feeders; keep topology visible in every state. */
.hh-distribution-v17 .hh-v17-trunk,.hh-distribution-v17 .hh-grid-original{stroke:#679bc0;stroke-width:2.6;}
.hh-distribution-v17 .hh-v17-branch{stroke:#76a4c5;stroke-width:1.65;}
.hh-distribution-v17 .hh-v17-lateral{stroke:#91b0c7;stroke-width:1.1;}
.hh-distribution-v17 .hh-grid-original-base{stroke:#839bab;stroke-width:2.3;}
.hh-distribution-v17 .hh-grid-backup-base{stroke:#9bafbd;stroke-width:2;stroke-dasharray:none;}
.hh-distribution-v17 .hh-grid-flow{stroke:#267eb9;stroke-width:2.1;}
.hh-distribution-v17 .hh-grid-alternate{stroke:#d4a530;stroke-width:2.8;}
.hh-distribution-v17 .hh-grid-alternate-flow{stroke:#e0ad2f;stroke-width:3;}
.hh-v17-load-base{animation:hh-v17-load-base var(--hh-grid-cycle) linear infinite;}
@keyframes hh-v17-load-base{0%,19%{opacity:1;}21%,45%{opacity:.55;}48%,100%{opacity:1;}}
.hh-v17-normal-load-flow{animation:hh-grid-drift 2.8s linear infinite,hh-grid-original-visibility var(--hh-grid-cycle) linear infinite;}
.hh-v17-restored-load-flow{animation:hh-grid-drift 2.8s linear infinite,hh-grid-alternate-visibility var(--hh-grid-cycle) linear infinite;}
.hh-v17-cabinet{fill:#fff;stroke:#668faa;stroke-width:1.6;}
.hh-v17-transformer{fill:#fff;stroke:#789bb3;stroke-width:1.15;}
.hh-v17-transformer path{fill:none;}
.hh-v17-substation{fill:#f4f9fc;stroke:#508bb5;stroke-width:1.8;}
.hh-v17-map-label{fill:#64859e;stroke:#fff;stroke-width:5px;paint-order:stroke;stroke-linejoin:round;font-size:20px;letter-spacing:1px;font-family:"Microsoft YaHei",sans-serif;}
@media(max-width:700px){.hh-v17-map-label{font-size:25px;}.hh-v17-tie-label{font-size:23px;}}

/* V18: task progress integrated into the source illustration. */
.hh-language-v18{--hh-task18-cycle:16s;}
.hh-language-v18 .hh-motion-heading>span{color:#334f65;font-size:15px;font-weight:500;letter-spacing:.06em;}
.hh-task-scene-v18{stroke-linecap:round;stroke-linejoin:round;}
.hh-task18-record{fill:#71acd4;fill-opacity:.13;stroke:#78a6c7;stroke-width:.7;opacity:0;animation:hh-task18-record var(--hh-task18-cycle) ease-in-out infinite;}
@keyframes hh-task18-record{0%,4%{opacity:0;}10%,22%{opacity:1;}33%,100%{opacity:0;}}
.hh-task18-link{fill:none;stroke:#3b8dbf;stroke-width:1.35;stroke-dasharray:1;stroke-dashoffset:1;opacity:0;}
.hh-task18-intake{animation:hh-task18-intake var(--hh-task18-cycle) ease-in-out infinite;}
@keyframes hh-task18-intake{0%,9%{opacity:0;stroke-dashoffset:1;}12%{opacity:.8;}23%{opacity:.8;stroke-dashoffset:0;}32%,100%{opacity:0;stroke-dashoffset:0;}}
.hh-task18-node{fill:#62a5d3;fill-opacity:.15;stroke:#4f90bb;stroke-width:1.1;opacity:0;}
.hh-task18-step-link{stroke-width:1.6;}
.hh-task18-execution{animation:hh-task18-execution var(--hh-task18-cycle) ease-in-out infinite;}
@keyframes hh-task18-execution{0%,29%{opacity:0;stroke-dashoffset:1;}34%{opacity:.75;}60%{opacity:.75;stroke-dashoffset:0;}70%,100%{opacity:0;stroke-dashoffset:0;}}
.hh-task18-card{fill:#61a1cc;fill-opacity:.12;stroke:#8bb2cd;stroke-width:.7;opacity:0;}
.hh-task18-report-cover{fill:#f8fafc;stroke:none;}
.hh-task18-node-0{animation:hh-task18-node-0 var(--hh-task18-cycle) ease-in-out infinite;}
@keyframes hh-task18-node-0{0%,17%{opacity:0;}21%,28%{opacity:1;}35%,100%{opacity:0;}}
.hh-task18-node-1{animation:hh-task18-node-1 var(--hh-task18-cycle) ease-in-out infinite;}
@keyframes hh-task18-node-1{0%,26%{opacity:0;}30%,37%{opacity:1;}44%,100%{opacity:0;}}
.hh-task18-node-2{animation:hh-task18-node-2 var(--hh-task18-cycle) ease-in-out infinite;}
@keyframes hh-task18-node-2{0%,35%{opacity:0;}39%,46%{opacity:1;}53%,100%{opacity:0;}}
.hh-task18-node-3{animation:hh-task18-node-3 var(--hh-task18-cycle) ease-in-out infinite;}
@keyframes hh-task18-node-3{0%,44%{opacity:0;}48%,55%{opacity:1;}62%,100%{opacity:0;}}
.hh-task18-node-4{animation:hh-task18-node-4 var(--hh-task18-cycle) ease-in-out infinite;}
@keyframes hh-task18-node-4{0%,53%{opacity:0;}57%,64%{opacity:1;}71%,100%{opacity:0;}}
.hh-task18-step-0{animation:hh-task18-step-0 var(--hh-task18-cycle) ease-in-out infinite;}
@keyframes hh-task18-step-0{0%,23%{opacity:0;stroke-dashoffset:1;}24%{opacity:1;}29%{opacity:1;stroke-dashoffset:0;}34%,100%{opacity:0;stroke-dashoffset:0;}}
.hh-task18-card-0{animation:hh-task18-card-0 var(--hh-task18-cycle) ease-in-out infinite;}
@keyframes hh-task18-card-0{0%,30%{opacity:0;}33%,38%{opacity:1;}44%,100%{opacity:0;}}
.hh-task18-step-1{animation:hh-task18-step-1 var(--hh-task18-cycle) ease-in-out infinite;}
@keyframes hh-task18-step-1{0%,32%{opacity:0;stroke-dashoffset:1;}33%{opacity:1;}38%{opacity:1;stroke-dashoffset:0;}43%,100%{opacity:0;stroke-dashoffset:0;}}
.hh-task18-card-1{animation:hh-task18-card-1 var(--hh-task18-cycle) ease-in-out infinite;}
@keyframes hh-task18-card-1{0%,36%{opacity:0;}39%,44%{opacity:1;}50%,100%{opacity:0;}}
.hh-task18-step-2{animation:hh-task18-step-2 var(--hh-task18-cycle) ease-in-out infinite;}
@keyframes hh-task18-step-2{0%,41%{opacity:0;stroke-dashoffset:1;}42%{opacity:1;}47%{opacity:1;stroke-dashoffset:0;}52%,100%{opacity:0;stroke-dashoffset:0;}}
.hh-task18-card-2{animation:hh-task18-card-2 var(--hh-task18-cycle) ease-in-out infinite;}
@keyframes hh-task18-card-2{0%,42%{opacity:0;}45%,50%{opacity:1;}56%,100%{opacity:0;}}
.hh-task18-step-3{animation:hh-task18-step-3 var(--hh-task18-cycle) ease-in-out infinite;}
@keyframes hh-task18-step-3{0%,50%{opacity:0;stroke-dashoffset:1;}51%{opacity:1;}56%{opacity:1;stroke-dashoffset:0;}61%,100%{opacity:0;stroke-dashoffset:0;}}
.hh-task18-card-3{animation:hh-task18-card-3 var(--hh-task18-cycle) ease-in-out infinite;}
@keyframes hh-task18-card-3{0%,48%{opacity:0;}51%,56%{opacity:1;}62%,100%{opacity:0;}}
.hh-task18-report-0{animation:hh-task18-report-0 var(--hh-task18-cycle) ease-in-out infinite;}
@keyframes hh-task18-report-0{0%,57%{opacity:.96;}63%,91%{opacity:0;}99%,100%{opacity:.96;}}
.hh-task18-report-1{animation:hh-task18-report-1 var(--hh-task18-cycle) ease-in-out infinite;}
@keyframes hh-task18-report-1{0%,61%{opacity:.96;}67%,91%{opacity:0;}99%,100%{opacity:.96;}}
.hh-task18-report-2{animation:hh-task18-report-2 var(--hh-task18-cycle) ease-in-out infinite;}
@keyframes hh-task18-report-2{0%,65%{opacity:.96;}71%,91%{opacity:0;}99%,100%{opacity:.96;}}
.hh-task18-report-3{animation:hh-task18-report-3 var(--hh-task18-cycle) ease-in-out infinite;}
@keyframes hh-task18-report-3{0%,69%{opacity:.96;}75%,91%{opacity:0;}99%,100%{opacity:.96;}}
.hh-task18-report-4{animation:hh-task18-report-4 var(--hh-task18-cycle) ease-in-out infinite;}
@keyframes hh-task18-report-4{0%,73%{opacity:.96;}79%,91%{opacity:0;}99%,100%{opacity:.96;}}

/* V19: connectivity controls the outage indication, not proximity to the fault. */
.hh-distribution-v17 .hh-v17-trunk{--hh-v19-live-stroke:#679bc0;}
.hh-distribution-v17 .hh-v17-branch{--hh-v19-live-stroke:#76a4c5;}
.hh-distribution-v17 .hh-v17-lateral{--hh-v19-live-stroke:#91b0c7;}
.hh-distribution-v17 .hh-v17-load-base{animation:hh-v19-load-lines var(--hh-grid-cycle) linear infinite;}
@keyframes hh-v19-load-lines{0%,19%{stroke:var(--hh-v19-live-stroke);opacity:1;}21%,45%{stroke:#a3abb3;opacity:1;}48%,100%{stroke:var(--hh-v19-live-stroke);opacity:1;}}
.hh-distribution-v17 .hh-grid-original-base{stroke:#a3abb3;}
.hh-v19-outage-device{animation:hh-v19-outage-device var(--hh-grid-cycle) linear infinite;}
@keyframes hh-v19-outage-device{0%,19%{stroke:#789bb3;fill:#fff;}21%,45%{stroke:#a3abb3;fill:#eef0f2;}48%,100%{stroke:#789bb3;fill:#fff;}}
.hh-v19-outage-symbol{opacity:0;pointer-events:none;}
.hh-v19-load-outage{animation:hh-v19-load-outage var(--hh-grid-cycle) linear infinite;}
.hh-v19-fault-outage{animation:hh-grid-fault-visibility var(--hh-grid-cycle) linear infinite;}
@keyframes hh-v19-load-outage{0%,19%{opacity:0;}22%,44%{opacity:1;}48%,100%{opacity:0;}}
.hh-v19-symbol-disc{fill:#ffffffed;stroke:#d2d8de;stroke-width:.8;}
.hh-v19-plug,.hh-v19-slash{fill:none;stroke:#8795a1;stroke-width:1.25;}
.hh-v19-slash-under{fill:none;stroke:#fff;stroke-width:3.5;}
.hh-city-key-outage{background:#a3abb3;}
@media(max-width:700px){.hh-v19-symbol-disc{r:27;}.hh-v19-plug,.hh-v19-slash,.hh-v19-slash-under{transform:scale(1.35);transform-origin:0 0;}.hh-city-legend{gap:12px;}}

/* V20: electricity unavailable, with a compact ten-second demonstration. */
.hh-city-scene{--hh-grid-cycle:10s;}
.hh-distribution-v17 .hh-grid-flow{animation-duration:1.8s;}
.hh-distribution-v17 :is(.hh-grid-original-flow,.hh-v17-normal-load-flow,.hh-v17-restored-load-flow,.hh-grid-alternate-flow){animation-duration:1.8s,var(--hh-grid-cycle);}
.hh-v20-bolt{fill:#7c8e9d;stroke:none;}
.hh-v20-cut{fill:none;stroke:#fff;stroke-width:1.8;}
.hh-v20-strike{fill:none;stroke:#7c8e9d;stroke-width:1.1;stroke-linecap:round;}
.hh-city-legend .hh-city-key-outage{width:12px;height:12px;background:none;border-radius:0;}
.hh-city-key-outage svg{display:block;width:100%;height:100%;overflow:visible;}
@media(max-width:700px){.hh-v19-outage-symbol :is(.hh-v20-bolt,.hh-v20-cut,.hh-v20-strike){transform:scale(1.35);transform-origin:0 0;}}

/* V21: a compact typographic hierarchy for scientific simulation. */
.hh-simulation-copy-v21{padding:0;max-width:430px;}
.hh-simulation-copy-v21 .hanhai-kicker{font-size:14px;letter-spacing:.08em;margin:0 0 18px;}
.hh-product .hh-simulation-copy-v21 .hanhai-heading{font-size:clamp(38px,3.75vw,54px);line-height:1.16;letter-spacing:-.035em;margin:0;}
.hh-product .hh-simulation-copy-v21 .hh-feature-description{font-size:18px;line-height:1.75;margin:22px 0 0;max-width:none;}
.hh-simulation-copy-v21 .hh-product-scope{font-size:14px;line-height:1.75;color:#758e9f;margin:9px 0 0;}
.hh-content .hh-simulation-copy-v21 .hh-capabilities{font-size:16px;line-height:1.65;color:#3f5e73;border-left:2px solid #dce8f0;margin:26px 0 0;padding:0 0 0 18px;}
.hh-content .hh-simulation-copy-v21 .hh-capabilities li{padding:0;margin:0;}
.hh-content .hh-simulation-copy-v21 .hh-capabilities li+li{margin-top:10px;}
.hh-content .hh-simulation-copy-v21 .hh-capabilities li::before{display:none;}
@media(max-width:700px){
 .hh-simulation-copy-v21{max-width:none;}
 .hh-simulation-copy-v21 .hanhai-kicker{font-size:13px;margin-bottom:15px;}
 .hh-product .hh-simulation-copy-v21 .hanhai-heading{font-size:34px;line-height:1.2;}
 .hh-product .hh-simulation-copy-v21 .hh-feature-description{font-size:17px;margin-top:16px;}
 .hh-simulation-copy-v21 .hh-product-scope{font-size:13px;margin-top:7px;}
 .hh-content .hh-simulation-copy-v21 .hh-capabilities{font-size:16px;margin-top:21px;padding-left:14px;}
 .hh-content .hh-simulation-copy-v21 .hh-capabilities li+li{margin-top:8px;}
}

/* V22: hold the reasoning stage before any transfer is made. */
.hh-city-scene{--hh-grid-cycle:16s;}
.hh-city-phase-decision{color:#587b94;animation:hh-city-decision var(--hh-grid-cycle) linear infinite;}
@keyframes hh-city-normal{0%,11%{opacity:1;}13%,96%{opacity:0;}99%,100%{opacity:1;}}
@keyframes hh-city-fault{0%,11%{opacity:0;}13%,24%{opacity:1;}26%,100%{opacity:0;}}
@keyframes hh-city-decision{0%,24%{opacity:0;}26%,55%{opacity:1;}57%,100%{opacity:0;}}
@keyframes hh-city-switch{0%,55%{opacity:0;}57%,68%{opacity:1;}70%,100%{opacity:0;}}
@keyframes hh-city-restored{0%,68%{opacity:0;}70%,94%{opacity:1;}96%,100%{opacity:0;}}
@keyframes hh-grid-original-visibility{0%,11%{opacity:1;}13%,96%{opacity:0;}99%,100%{opacity:1;}}
@keyframes hh-grid-fault-visibility{0%,11%{opacity:0;}13%,94%{opacity:1;}97%,100%{opacity:0;}}
@keyframes hh-v19-load-lines{0%,11%{stroke:var(--hh-v19-live-stroke);opacity:1;}13%,68%{stroke:#a3abb3;opacity:1;}70%,100%{stroke:var(--hh-v19-live-stroke);opacity:1;}}
@keyframes hh-v19-outage-device{0%,11%{stroke:#789bb3;fill:#fff;}13%,68%{stroke:#a3abb3;fill:#eef0f2;}70%,100%{stroke:#789bb3;fill:#fff;}}
@keyframes hh-v19-load-outage{0%,11%{opacity:0;}14%,67%{opacity:1;}70%,100%{opacity:0;}}
@keyframes hh-grid-connect{0%,55%{opacity:0;stroke-dashoffset:1;}57%{opacity:1;stroke-dashoffset:1;}68%,94%{opacity:1;stroke-dashoffset:0;}97%,100%{opacity:0;stroke-dashoffset:0;}}
@keyframes hh-grid-alternate-visibility{0%,68%{opacity:0;}70%,94%{opacity:1;}97%,100%{opacity:0;}}
@keyframes hh-grid-tie-open{0%,67%{opacity:1;}70%,95%{opacity:0;}98%,100%{opacity:1;}}
.hh-v22-review-outage{fill:none;stroke:#7e8d9a;stroke-width:5;opacity:0;animation:hh-v22-review-outage var(--hh-grid-cycle) ease-in-out infinite;}
@keyframes hh-v22-review-outage{0%,25%{opacity:0;}29%,38%{opacity:.32;}43%,100%{opacity:0;}}
.hh-v22-proposed-route{fill:none;stroke:#d3aa47;stroke-width:3;stroke-dasharray:1;stroke-dashoffset:1;opacity:0;animation:hh-v22-propose var(--hh-grid-cycle) ease-in-out infinite;}
@keyframes hh-v22-propose{0%,40%{opacity:0;stroke-dashoffset:1;}43%{opacity:.6;stroke-dashoffset:1;}52%,66%{opacity:.6;stroke-dashoffset:0;}69%,100%{opacity:0;stroke-dashoffset:0;}}
.hh-v22-review-endpoint{fill:#fff;fill-opacity:.15;stroke:#9db4c5;stroke-width:1.3;opacity:0;animation:hh-v22-endpoint var(--hh-grid-cycle) ease-in-out infinite;}
@keyframes hh-v22-endpoint{0%,39%{opacity:0;}43%,56%{opacity:1;}60%,100%{opacity:0;}}
.hh-v22-decision-focus{fill:none;stroke:#d1a943;stroke-width:1.4;opacity:0;animation:hh-v22-focus var(--hh-grid-cycle) ease-in-out infinite;}
@keyframes hh-v22-focus{0%,48%{opacity:0;}53%,66%{opacity:.9;}70%,100%{opacity:0;}}


/* source: assets/css/hanhai/simulation-timeline.css */
/* Keep all five stages visible while the active marker follows the map cycle. */
.hh-city-scene .hh-city-timeline68 {
  position:relative; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px;
  list-style:none; margin:4px 0 26px; padding:0; isolation:isolate;
}
.hh-city-timeline68::before,.hh-city-timeline68::after {
  content:""; position:absolute; left:10%; right:10%; top:11px; height:2px;
  background:#d7e4ed; pointer-events:none; z-index:-1;
}
.hh-city-timeline68::after {
  background:#338ec3; transform-origin:left;
  animation:hh-time68-progress var(--hh-grid-cycle) linear infinite; animation-play-state:inherit;
}
.hh-city-scene .hh-city-timeline68>li { position:relative; min-width:0; padding:0; margin:0; text-align:center; }
.hh-city-scene .hh-city-timeline68>li::before { content:none; }
.hh-time68-dot,.hh-time68-active>i {
  display:grid; place-items:center; width:24px; height:24px; box-sizing:border-box; margin:0 auto 10px;
  border:1px solid #cfdfeb; border-radius:50%; background:#fff; color:#7390a5;
  font-size:10px; line-height:1; font-weight:500; font-style:normal;
}
.hh-time68-label,.hh-time68-active>b {
  display:block; border-radius:8px; padding:9px 2px; font-size:14px; font-weight:500;
  line-height:22px; white-space:nowrap; color:#607c91;
}
.hh-city-scene .hh-time68-active { position:absolute; inset:0; opacity:0; color:var(--hh-time-ink,#fff); pointer-events:none; }
.hh-time68-active>i { color:inherit; background:var(--hh-time-color); border-color:var(--hh-time-color); box-shadow:0 0 0 4px #fff; }
.hh-time68-active>b { background:var(--hh-time-color); color:inherit; font-weight:600; box-shadow:0 4px 10px #244f7314; }
.hh-time68-active.hh-city-phase-normal { --hh-time-color:#147eb9; }
.hh-time68-active.hh-city-phase-fault { --hh-time-color:#c94345; }
.hh-time68-active.hh-city-phase-decision { --hh-time-color:#17836b; }
.hh-time68-active.hh-city-phase-switch { --hh-time-color:#f1bd45; --hh-time-ink:#49370d; }
.hh-time68-active.hh-city-phase-restored { --hh-time-color:#147eb9; }
/* Restore the blue feeder and retain the operated switches in yellow. */
.hh-city-scene .hh-v17-load-base { animation-name:hh-recovery77-lines; }
.hh-city-scene .hh-v17-restored-load-flow,
.hh-city-scene .hh-grid-alternate-flow { stroke:#267eb9; }
.hh-city-scene .hh-grid-alternate { animation-name:hh-recovery77-connect; }
.hh-city-scene .hh-grid-isolate-open,
.hh-city-scene .hh-grid-tie-closed { stroke:#e2a61b; stroke-width:3.5; }
.hh-city-scene .hh-grid-isolate-open { animation-name:hh-recovery77-isolate; }
.hh-city-scene .hh-recovery77-marker {
  fill:#f7bf39; fill-opacity:.2; stroke:#e3a91e; stroke-width:2.2;
  opacity:0; animation:hh-recovery77-isolate var(--hh-grid-cycle) linear infinite;
}
.hh-city-scene .hh-recovery77-marker--tie { animation-name:hh-recovery77-tie; }
.hh-city-scene .hh-v22-proposed-route { stroke:#15956e; animation-name:hh-recovery77-propose; }
.hh-city-scene .hh-v22-decision-focus { stroke:#15956e; animation-name:hh-recovery77-focus; }
/* One travelling segment traces the candidate supply route during decision. */
.hh-city-scene .hh-decision78-pulse {
  fill:none; stroke:#13a875; stroke-width:7; stroke-linecap:round; stroke-linejoin:round; vector-effect:none;
  stroke-dasharray:7 110; stroke-dashoffset:7; opacity:0;
  animation:hh-decision78-travel var(--hh-grid-cycle) linear infinite;
}
.hh-city-scene .hh-decision78-glow { stroke-width:16; stroke-opacity:.2; }
@keyframes hh-decision78-travel {
  0%,26%{opacity:0;stroke-dashoffset:7}
  28%{opacity:1;stroke-dashoffset:7}
  53%{opacity:1;stroke-dashoffset:-100}
  55%,100%{opacity:0;stroke-dashoffset:-100}
}
.hh-city-legend { flex-wrap:wrap; row-gap:8px; }
.hh-city-key-decision { background:#13a875; }
@keyframes hh-recovery77-lines {
  0%,11%,70%,100%{stroke:var(--hh-v19-live-stroke);opacity:1}
  13%,68%{stroke:#a3abb3;opacity:1}
}
@keyframes hh-recovery77-connect {
  0%,55%{opacity:0;stroke-dashoffset:1;stroke:#e2a61b}
  57%{opacity:1;stroke-dashoffset:1}
  59.5%,64.5%{opacity:.22}
  62%,67%{opacity:1}
  68%{opacity:1;stroke-dashoffset:0;stroke:#e2a61b}
  70%,94%{opacity:1;stroke-dashoffset:0;stroke:#679bc0}
  97%,100%{opacity:0;stroke-dashoffset:0;stroke:#679bc0}
}
@keyframes hh-recovery77-isolate {
  0%,11%,97%,100%{opacity:0}
  13%,18%,23%,94%{opacity:1}
  15.5%,20.5%{opacity:.22}
}
@keyframes hh-recovery77-tie {
  0%,55%,97%,100%{opacity:0}
  57%,62%,67%,94%{opacity:1}
  59.5%,64.5%{opacity:.22}
}
@keyframes hh-recovery77-propose {
  0%,40%{opacity:0;stroke-dashoffset:1}
  43%{opacity:.6;stroke-dashoffset:1}
  52%,55%{opacity:.6;stroke-dashoffset:0}
  57%,100%{opacity:0;stroke-dashoffset:0}
}
@keyframes hh-recovery77-focus {
  0%,48%{opacity:0}
  53%,55%{opacity:.9}
  57%,100%{opacity:0}
}
@keyframes hh-time68-progress {
  0%,11%{transform:scaleX(0);opacity:1}
  13%,24%{transform:scaleX(.25);opacity:1}
  26%,55%{transform:scaleX(.5);opacity:1}
  57%,68%{transform:scaleX(.75);opacity:1}
  70%,94%{transform:scaleX(1);opacity:1}
  96%{transform:scaleX(1);opacity:0}
  98%{transform:scaleX(0);opacity:0}
  99%,100%{transform:scaleX(0);opacity:1}
}
@media(max-width:700px) {
  .hh-city-scene .hh-city-timeline68 { gap:4px; margin:2px 0 18px; }
  .hh-time68-dot,.hh-time68-active>i { margin-bottom:8px; }
  .hh-time68-label,.hh-time68-active>b { font-size:11px; line-height:18px; padding:8px 1px; border-radius:6px; }
}


/* source: assets/css/hanhai/simulation.css */
/* Full candidate network, with decision shortened from 4.64s to 2.24s.
   Other phase durations stay unchanged; one complete cycle is 13.6s. */
.hh-city-scene{--hh-grid-cycle:13.6s}
.hh-city-scene{--hh-switch82-width:5;--hh-switch82-rest-width:2.8}
.hh-city-scene .hh-grid-alternate{stroke-dasharray:none;stroke-dashoffset:0}
.hh-city-scene .hh-switch82-glow{
  fill:none;stroke:#f3b520;stroke-width:12;stroke-linecap:round;stroke-linejoin:round;
  opacity:0;animation:hh-switch82-glow var(--hh-grid-cycle) linear infinite;
}
.hh-city-scene .hh-recovery77-marker--tie{animation-name:hh-switch82-marker}
@media(max-width:700px){.hh-city-scene{--hh-switch82-width:4;--hh-switch82-rest-width:1.9}}
/* Keep the full green network visible while highlights flow along every branch. */
.hh-city-scene .hh-decision81-flow{
  opacity:0;animation:hh-city-decision var(--hh-grid-cycle) linear infinite;
}
.hh-city-scene .hh-decision81-stream{
  fill:none;stroke:#adffda;stroke-width:4.5;stroke-linecap:round;stroke-linejoin:round;
  vector-effect:none;stroke-dasharray:20 50;
  animation:hh-decision81-stream .7s linear infinite;
}
@keyframes hh-decision81-stream{from{stroke-dashoffset:0}to{stroke-dashoffset:-70}}
@media(max-width:700px){.hh-city-scene .hh-decision81-stream{stroke-width:7}}
.hh-city-scene .hh-v22-proposed-route,
.hh-city-scene .hh-decision79-source{
  fill:none;stroke:#15956e;stroke-width:3;stroke-dasharray:none;stroke-dashoffset:0;opacity:0;
  animation:hh-recovery77-propose var(--hh-grid-cycle) linear infinite;
}
.hh-city-scene .hh-v22-review-outage,
.hh-city-scene .hh-v22-review-endpoint,
.hh-city-scene .hh-v22-decision-focus{animation:none;opacity:0}
@keyframes hh-time68-progress{
  0%,12.941176%{transform:scaleX(0);opacity:1}
  15.294118%,28.235294%{transform:scaleX(.25);opacity:1}
  30.588235%,47.058824%{transform:scaleX(.5);opacity:1}
  49.411765%,62.352941%{transform:scaleX(.75);opacity:1}
  64.705882%,92.941176%{transform:scaleX(1);opacity:1}
  95.294118%{transform:scaleX(1);opacity:0}
  97.647059%{transform:scaleX(0);opacity:0}
  98.823529%,100%{transform:scaleX(0);opacity:1}
}
@keyframes hh-city-normal{0%,12.941176%{opacity:1;}15.294118%,95.294118%{opacity:0;}98.823529%,100%{opacity:1;}}
@keyframes hh-city-fault{0%,12.941176%{opacity:0;}15.294118%,28.235294%{opacity:1;}30.588235%,100%{opacity:0;}}
@keyframes hh-city-decision{0%,28.235294%{opacity:0;}30.588235%,47.058824%{opacity:1;}49.411765%,100%{opacity:0;}}
@keyframes hh-city-switch{0%,47.058824%{opacity:0;}49.411765%,62.352941%{opacity:1;}64.705882%,100%{opacity:0;}}
@keyframes hh-city-restored{0%,62.352941%{opacity:0;}64.705882%,92.941176%{opacity:1;}95.294118%,100%{opacity:0;}}
@keyframes hh-recovery77-lines{0%,12.941176%,64.705882%,100%{stroke:var(--hh-v19-live-stroke);opacity:1}15.294118%,28.235294%,49.411765%,62.352941%{stroke:#a3abb3;opacity:1}30.588235%,47.058824%{stroke:#15956e;opacity:1}}
@keyframes hh-grid-original-visibility{0%,12.941176%{opacity:1;}15.294118%,95.294118%{opacity:0;}98.823529%,100%{opacity:1;}}
@keyframes hh-grid-alternate-visibility{0%,62.352941%{opacity:0;}64.705882%,92.941176%{opacity:1;}96.470588%,100%{opacity:0;}}
@keyframes hh-recovery77-connect{
  0%,47.058824%{opacity:0;stroke:#e2a61b;stroke-width:var(--hh-switch82-width)}
  49.411765%,55.294118%,61.176471%,62.352941%{opacity:1;stroke:#e2a61b;stroke-width:var(--hh-switch82-width)}
  52.352941%,58.235294%{opacity:.55;stroke:#e2a61b;stroke-width:var(--hh-switch82-width)}
  64.705882%,92.941176%{opacity:1;stroke:#679bc0;stroke-width:var(--hh-switch82-rest-width)}
  96.470588%,100%{opacity:0;stroke:#679bc0;stroke-width:var(--hh-switch82-rest-width)}
}
@keyframes hh-switch82-glow{
  0%,47.058824%,64.705882%,100%{opacity:0;stroke-width:12}
  49.411765%,55.294118%,61.176471%{opacity:.36;stroke-width:16}
  52.352941%,58.235294%{opacity:.12;stroke-width:10}
  62.352941%{opacity:.25;stroke-width:12}
}
@keyframes hh-switch82-marker{
  0%,47.058824%,96.470588%,100%{opacity:0;r:19;stroke-width:2.2;fill-opacity:.2}
  49.411765%,55.294118%,61.176471%{opacity:1;r:28;stroke-width:3.5;fill-opacity:.35}
  52.352941%,58.235294%{opacity:.55;r:23;stroke-width:2.5;fill-opacity:.2}
  62.352941%{opacity:1;r:28;stroke-width:3.5;fill-opacity:.35}
  64.705882%,92.941176%{opacity:1;r:19;stroke-width:2.2;fill-opacity:.2}
}
@keyframes hh-v19-outage-device{0%,12.941176%{stroke:#789bb3;fill:#fff;}15.294118%,62.352941%{stroke:#a3abb3;fill:#eef0f2;}64.705882%,100%{stroke:#789bb3;fill:#fff;}}
@keyframes hh-grid-fault-visibility{0%,12.941176%{opacity:0;}15.294118%,92.941176%{opacity:1;}96.470588%,100%{opacity:0;}}
@keyframes hh-recovery77-propose{0%,28.235294%,49.411765%,100%{opacity:0}30.588235%,47.058824%{opacity:1}}
@keyframes hh-recovery77-isolate{
  0%,12.941176%,96.470588%,100%{opacity:0}
  15.294118%,21.176471%,27.058824%,92.941176%{opacity:1}
  18.235294%,24.117647%{opacity:.22}
}
@keyframes hh-recovery77-tie{
  0%,47.058824%,96.470588%,100%{opacity:0}
  49.411765%,55.294118%,61.176471%,92.941176%{opacity:1}
  52.352941%,58.235294%{opacity:.22}
}
@keyframes hh-grid-tie-open{0%,61.176471%{opacity:1;}64.705882%,94.117647%{opacity:0;}97.647059%,100%{opacity:1;}}
@keyframes hh-v19-load-outage{0%,12.941176%{opacity:0;}16.470588%,61.176471%{opacity:1;}64.705882%,100%{opacity:0;}}


/* source: assets/css/hanhai/language.css */
/* V24: clean plate + one authoritative layer of progressive SVG wires.
   Deliberately use scaling strokes with pathLength-normalized dashes:
   non-scaling-stroke would disturb normalized dash reveals at some scales. */
.hh-language-v24 .hh-task24-route{fill:none;stroke:#4c97c6;stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round;vector-effect:none;stroke-dasharray:1;stroke-dashoffset:1;opacity:0}
.hh-language-v24 .hh-task24-intake{animation:hh-task24-intake var(--hh-task18-cycle) ease-in-out infinite}
@keyframes hh-task24-intake{0%,9%{opacity:0;stroke-dashoffset:1}10%{opacity:.86;stroke-dashoffset:1}23%,90%{opacity:.86;stroke-dashoffset:0}98%,100%{opacity:0;stroke-dashoffset:0}}
.hh-language-v24 .hh-task24-step0{animation:hh-task24-step0 var(--hh-task18-cycle) ease-in-out infinite}
@keyframes hh-task24-step0{0%,23%{opacity:0;stroke-dashoffset:1}24%{opacity:.86;stroke-dashoffset:1}29%,90%{opacity:.86;stroke-dashoffset:0}98%,100%{opacity:0;stroke-dashoffset:0}}
.hh-language-v24 .hh-task24-step1{animation:hh-task24-step1 var(--hh-task18-cycle) ease-in-out infinite}
@keyframes hh-task24-step1{0%,32%{opacity:0;stroke-dashoffset:1}33%{opacity:.86;stroke-dashoffset:1}38%,90%{opacity:.86;stroke-dashoffset:0}98%,100%{opacity:0;stroke-dashoffset:0}}
.hh-language-v24 .hh-task24-step2{animation:hh-task24-step2 var(--hh-task18-cycle) ease-in-out infinite}
@keyframes hh-task24-step2{0%,41%{opacity:0;stroke-dashoffset:1}42%{opacity:.86;stroke-dashoffset:1}47%,90%{opacity:.86;stroke-dashoffset:0}98%,100%{opacity:0;stroke-dashoffset:0}}
.hh-language-v24 .hh-task24-step3{animation:hh-task24-step3 var(--hh-task18-cycle) ease-in-out infinite}
@keyframes hh-task24-step3{0%,50%{opacity:0;stroke-dashoffset:1}51%{opacity:.86;stroke-dashoffset:1}56%,90%{opacity:.86;stroke-dashoffset:0}98%,100%{opacity:0;stroke-dashoffset:0}}
.hh-language-v24 .hh-task24-merge{animation:hh-task24-merge var(--hh-task18-cycle) ease-in-out infinite}
@keyframes hh-task24-merge{0%,29%{opacity:0;stroke-dashoffset:1}30%{opacity:.86;stroke-dashoffset:1}43%,90%{opacity:.86;stroke-dashoffset:0}98%,100%{opacity:0;stroke-dashoffset:0}}
.hh-language-v24 .hh-task24-chain{animation:hh-task24-chain var(--hh-task18-cycle) ease-in-out infinite}
@keyframes hh-task24-chain{0%,36%{opacity:0;stroke-dashoffset:1}37%{opacity:.86;stroke-dashoffset:1}57%,90%{opacity:.86;stroke-dashoffset:0}98%,100%{opacity:0;stroke-dashoffset:0}}
.hh-language-v24 .hh-task24-branch{animation:hh-task24-branch var(--hh-task18-cycle) ease-in-out infinite}
@keyframes hh-task24-branch{0%,50%{opacity:0;stroke-dashoffset:1}51%{opacity:.86;stroke-dashoffset:1}66%,90%{opacity:.86;stroke-dashoffset:0}98%,100%{opacity:0;stroke-dashoffset:0}}
.hh-language-v24 .hh-task24-result{animation:hh-task24-result var(--hh-task18-cycle) ease-in-out infinite}
@keyframes hh-task24-result{0%,60%{opacity:0;stroke-dashoffset:1}61%{opacity:.86;stroke-dashoffset:1}70%,90%{opacity:.86;stroke-dashoffset:0}98%,100%{opacity:0;stroke-dashoffset:0}}
@media(max-width:700px){.hh-language-v24 .hh-task24-route{stroke-width:4.2}}


/* source: assets/css/hanhai/language-flow.css */
/* A task is understood by the model, executed by the digital employee, then returned to the conversation. */
.hh-language-v40{container-type:inline-size;--task-cycle:12s}
.hh-language-v40 .hh-task40-board{border:1px solid #dce7ef;border-radius:14px;background:#fff;box-shadow:0 18px 42px -35px #46698366;overflow:hidden;color:#36566d;font-family:inherit}
.hh-task40-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:17px 22px;border-bottom:1px solid #e5edf3;background:#f8fbfd;font-size:14px;color:#385b72}
.hh-task40-bar small{font-size:11px;color:#7d95a6}
.hh-task40-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:'request model' 'reply tools';gap:24px 30px;padding:24px}
.hh-task40-request{grid-area:request;min-width:0;position:relative}
.hh-task40-model{grid-area:model;min-width:0}
.hh-task40-tools{grid-area:tools;min-width:0;position:relative}
.hh-task40-reply{grid-area:reply;min-width:0;align-self:end}
.hh-task40-label{display:flex;align-items:center;gap:8px;margin:0 0 12px;color:#587b94;font-size:12px;line-height:1.5}
.hh-task40-label strong{font-weight:500;color:#306b91;font-size:14px}
.hh-task40-emblem{display:inline-grid;place-items:center;width:23px;height:23px;border:1px solid #b9d5e7;border-radius:6px;color:#3180b1;background:#edf6fc}
.hh-task40-emblem svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.3}
.hh-content .hh-task40-message{font-size:15px;line-height:1.9;margin:0;padding:15px 16px;background:#edf6fc;border:1px solid #d6e9f5;border-radius:10px 2px 10px 10px;color:#315e7b}
.hh-task40-attachment{display:flex;align-items:center;gap:8px;margin-top:12px;padding:10px 11px;border:1px solid #e0eaf1;border-radius:7px;font-size:12px;color:#728b9d;background:#fff}
.hh-task40-attachment svg,.hh-task40-report svg{flex:none;width:19px;height:23px;fill:none;stroke:#6c9cb9;stroke-width:1.2}
.hh-task40-plan{position:relative;padding-left:19px;border-left:1px solid #dce9f2}
.hh-task40-plan+.hh-task40-plan{padding-top:22px}
.hh-task40-plan::before{content:'';position:absolute;left:-4px;top:7px;width:7px;height:7px;border-radius:50%;background:#82b4d3;box-shadow:0 0 0 4px #f4f9fc}
.hh-task40-plan+.hh-task40-plan::before{top:29px}
.hh-task40-plan h4{font-size:15px;font-weight:500;line-height:1.5;margin:0 0 9px;color:#345b76}
.hh-content .hh-task40-plan p{font-size:13px;line-height:1.8;margin:0;color:#627f94}
.hh-task40-tags{display:flex;flex-wrap:wrap;gap:6px}
.hh-task40-tags span{font-size:12px;line-height:1.5;padding:4px 8px;border-radius:4px;background:#eef5fa;color:#467b9d}
.hh-task40-tool-list{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.hh-task40-tool{display:flex;align-items:center;gap:7px;border:1px solid #dce8f0;border-radius:7px;padding:12px 9px;font-size:12px;background:#f8fbfd;white-space:nowrap}
.hh-task40-tool svg{width:16px;height:16px;fill:none;stroke:#5c92b5;stroke-width:1.2;flex:none}
.hh-content .hh-task40-return{font-size:12px;line-height:1.8;color:#7690a3;margin:13px 0 0}
.hh-task40-report{position:relative;display:flex;align-items:center;gap:11px;padding:15px 13px;border:1px solid #cde3ef;border-radius:8px;background:linear-gradient(120deg,#f7fbfe,#fff)}
.hh-task40-report strong{display:block;font-size:14px;font-weight:500;color:#3e7190;line-height:1.6}
.hh-task40-report small{display:block;font-size:11px;color:#8198a8;line-height:1.7;margin-top:3px}
.hh-task40-done{width:18px;height:18px;position:absolute;right:10px;top:10px;border-radius:50%;background:#e1f0f5;color:#3d8a99;font-size:12px;text-align:center;line-height:18px}
.hh-task40-response{display:grid}
.hh-task40-response>*{grid-area:1/1}
.hh-task40-wait{align-self:center;display:flex;align-items:center;gap:10px;padding:15px 13px;color:#7392a7;font-size:13px;animation:hh-task40-wait var(--task-cycle) ease-in-out infinite}
.hh-task40-wait i{width:6px;height:6px;border-radius:50%;background:#77a8c7;box-shadow:0 0 0 4px #eef6fb}
.hh-task40-bridge{position:absolute;top:73px;right:-29px;width:28px;height:16px;fill:none;stroke:#78a9c7;stroke-width:1.2}
.hh-task40-tools .hh-task40-bridge{top:61px;left:-29px;right:auto}
.hh-task40-footer{display:flex;justify-content:space-between;gap:12px;padding:13px 22px;border-top:1px solid #e9eff4;font-size:11px;color:#8da2b1;background:#fbfdfe}
.hh-task40-footer span:last-child{color:#628ba5}
.hh-task40-understand{animation:hh-task40-understand var(--task-cycle) ease-in-out infinite}
.hh-task40-arrange{animation:hh-task40-arrange var(--task-cycle) ease-in-out infinite}
.hh-task40-execute{animation:hh-task40-execute var(--task-cycle) ease-in-out infinite}
.hh-task40-answer{animation:hh-task40-answer var(--task-cycle) ease-in-out infinite}
@keyframes hh-task40-understand{0%,5%{opacity:.35}15%,90%{opacity:1}100%{opacity:.35}}
@keyframes hh-task40-arrange{0%,22%{opacity:.3}32%,90%{opacity:1}100%{opacity:.3}}
@keyframes hh-task40-execute{0%,40%{opacity:.3}51%,90%{opacity:1}100%{opacity:.3}}
@keyframes hh-task40-answer{0%,60%{opacity:0;transform:translateY(5px)}70%,90%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(5px)}}
@keyframes hh-task40-wait{0%,60%{opacity:1}67%,90%{opacity:0}100%{opacity:1}}
@container(max-width:580px){
 .hh-task40-body{grid-template-columns:1fr;grid-template-areas:'request' 'model' 'tools' 'reply';gap:23px;padding:20px}
 .hh-task40-bar{padding:15px 20px}
 .hh-task40-request .hh-task40-message{font-size:14px;padding:12px 14px}
 .hh-task40-attachment{padding:8px 10px;margin-top:8px}
 .hh-task40-model{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
 .hh-task40-model>.hh-task40-label{grid-column:1/-1}
 .hh-task40-plan+.hh-task40-plan{padding-top:0}
 .hh-task40-plan+.hh-task40-plan::before{top:7px}
 .hh-task40-plan{padding-left:12px}
 .hh-task40-plan h4{font-size:14px}
 .hh-content .hh-task40-plan p{font-size:12px}
 .hh-task40-bridge{display:none}
 .hh-task40-tags span{font-size:11px;padding:3px 5px}
 .hh-task40-footer{padding:12px 20px}
}
/* Preserve the requested automatic sequence with opacity alone when reduced motion is enabled. */
@media(prefers-reduced-motion:reduce){.hh-language-v40 .hh-task40-answer{animation-name:hh-task40-answer-still;transform:none}}
@keyframes hh-task40-answer-still{0%,60%,100%{opacity:0}70%,90%{opacity:1}}


/* source: assets/css/hanhai/language-density.css */
/* All three stages belong to the language model, with no external product actor. */
.hh-language-v41 .hh-task40-tools{padding-left:0}
.hh-language-v41 .hh-task40-tools::before{content:'';position:absolute;left:0;top:-24px;height:24px;border-left:1px solid #dce9f2}
.hh-language-v41 .hh-task40-tools .hh-task40-plan{padding-bottom:10px}
.hh-language-v41 .hh-task40-tools .hh-task40-bridge{top:38px}
@container(max-width:580px){
 .hh-language-v41 .hh-task40-tools::before{display:none}
 .hh-language-v41 .hh-task40-tools .hh-task40-plan{padding-bottom:0}
}


/* source: assets/css/hanhai/language-card.css */
/* Deliver a readable answer in the conversation; the supplied record makes the answer checkable. */
.hh-language-v42{container-type:inline-size;--hh-dialog-cycle:16s}
.hh-chat42{background:#fff;border:1px solid #dce7ef;border-radius:14px;overflow:hidden;box-shadow:0 18px 42px -35px #46698366;color:#36566d}
.hh-chat42-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;background:#f8fbfd;border-bottom:1px solid #e3edf3;padding:16px 24px;font-size:14px;color:#3d6079}
.hh-chat42-bar small{font-size:11px;color:#8299aa}
.hh-chat42-conversation{padding:22px 24px 26px}
.hh-chat42-user{max-width:90%;margin-left:auto}
.hh-chat42-author{display:flex;align-items:center;gap:8px;margin:0 0 10px;font-size:12px;color:#7a94a6;line-height:1.5}
.hh-chat42-user>.hh-chat42-author{justify-content:flex-end}
.hh-chat42-prompt{background:#edf6fc;border:1px solid #d9eaf5;border-radius:10px 2px 10px 10px;padding:14px 16px}
.hh-content .hh-chat42-question{font-size:15px;line-height:1.8;color:#315e7b;margin:0}
.hh-chat42-record{margin-top:12px;padding:12px 13px;border:1px solid #dfe9f0;border-radius:7px;background:#ffffffd9}
.hh-chat42-record-title{display:flex;align-items:center;gap:8px;color:#60849d;font-size:12px;margin-bottom:8px}
.hh-chat42-record-title svg{width:15px;height:18px;fill:none;stroke:currentColor;stroke-width:1.15}
.hh-chat42-record dl{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px 16px;margin:0}
.hh-chat42-record dl>div{display:flex;flex-direction:column;gap:3px;min-width:0}
.hh-chat42-record dt,.hh-chat42-record dd{margin:0;font-size:12px;line-height:1.5;font-weight:400}
.hh-chat42-record dt{color:#8299aa}.hh-chat42-record dd{color:#476e89}
.hh-chat42-assistant{margin-top:22px;max-width:96%}
.hh-chat42-assistant>.hh-chat42-author{color:#3a749a;font-size:14px}
.hh-chat42-emblem{display:inline-grid;place-items:center;width:24px;height:24px;border:1px solid #b9d5e7;border-radius:7px;background:#edf6fc}
.hh-chat42-emblem svg{width:15px;height:15px;fill:none;stroke:#4388b3;stroke-width:1.2}
.hh-chat42-answer{position:relative;padding-left:32px}
.hh-content .hh-chat42-answer p{font-size:14px;line-height:1.85;color:#46677f;margin:0}
.hh-content .hh-chat42-answer blockquote{margin:10px 0 12px;padding:11px 15px;border-left:2px solid #76acd0;border-radius:0 5px 5px 0;background:#f3f8fc;color:#315f7f;font-size:15px;line-height:1.85}
.hh-chat42-answer strong{font-weight:500;color:#286b99}
.hh-chat42-reading{position:absolute;left:32px;top:4px;display:flex;align-items:center;gap:8px;font-size:12px;color:#83a0b3;animation:hh-chat42-reading var(--hh-dialog-cycle) linear infinite}
.hh-chat42-reading i{display:block;width:5px;height:5px;background:#7baac7;border-radius:50%;box-shadow:9px 0 #b5d0e2,18px 0 #d6e6f0;margin-right:20px}
.hh-chat42-opening{animation:hh-chat42-opening var(--hh-dialog-cycle) ease-in-out infinite}
.hh-chat42-draft{animation:hh-chat42-draft var(--hh-dialog-cycle) ease-in-out infinite}
.hh-chat42-followup{animation:hh-chat42-followup var(--hh-dialog-cycle) ease-in-out infinite}
@keyframes hh-chat42-reading{0%,7%{opacity:1}11%,92%{opacity:0}100%{opacity:1}}
@keyframes hh-chat42-opening{0%,7%{opacity:0}12%,92%{opacity:1}100%{opacity:0}}
@keyframes hh-chat42-draft{0%,14%{opacity:0}22%,92%{opacity:1}100%{opacity:0}}
@keyframes hh-chat42-followup{0%,27%{opacity:0}35%,92%{opacity:1}100%{opacity:0}}
@container(max-width:580px){
 .hh-chat42-conversation{padding:18px 16px 22px}
 .hh-chat42-bar{padding:15px 16px}
 .hh-chat42-user,.hh-chat42-assistant{max-width:100%}
 .hh-chat42-prompt{padding:12px}
 .hh-content .hh-chat42-question{font-size:14px}
 .hh-chat42-record{padding:10px}
 .hh-chat42-record dl{gap:7px 12px}
 .hh-chat42-record dt,.hh-chat42-record dd{font-size:11px}
 .hh-chat42-answer{padding-left:0}
 .hh-chat42-reading{left:0}
 .hh-content .hh-chat42-answer p{font-size:13px}
 .hh-content .hh-chat42-answer blockquote{font-size:14px;padding:10px 12px}
}


/* source: assets/css/hanhai/language-layout.css */
/* A continuous language-to-answer process, without an application window. */
.hh-language-v43{container-type:inline-size;--hh-process-cycle:12s}
.hh-language-v43 .hh-motion-heading{padding-right:6px}
@media(min-width:701px){
 .hh-product[aria-labelledby="language-title"] .hh-feature{align-items:start}
 #language-title{scroll-margin-top:228px}
}
.hh-process43{padding:20px 26px 30px;background:radial-gradient(ellipse at 52% 48%,#e9f4fc99 0,transparent 64%);color:#365e79}
.hh-process43-input{padding:0 14px 27px;position:relative}
.hh-process43-label{display:block;font-size:12px;letter-spacing:.09em;color:#6b8da4;margin-bottom:12px}
.hh-content .hh-process43-input>p{font-size:23px;line-height:1.6;font-weight:500;letter-spacing:.01em;color:#254a65;margin:0 0 17px}
.hh-process43-source{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:12px;line-height:1.7;color:#7493a8}
.hh-process43-source svg{width:14px;height:18px;fill:none;stroke:currentColor;stroke-width:1.2;flex:none}
.hh-process43-source>span:first-of-type{color:#436f8c;margin-right:7px}
.hh-process43-stages{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));position:relative;padding:8px 0 28px}
.hh-process43-track{position:absolute;left:16.66%;right:16.66%;top:35px;height:2px;background:#c6dfef;overflow:hidden}
.hh-process43-track>i{display:block;width:23%;height:100%;background:linear-gradient(90deg,transparent,#349edf 65%,#006daf);animation:hh-process43-flow 2.8s linear infinite}
.hh-process43-step{min-width:0;text-align:center;position:relative}
.hh-process43-node{display:grid;place-items:center;position:relative;width:56px;height:56px;margin:0 auto 16px;background:#edf7fe;border:1px solid #acd1eb;border-radius:50%;color:#217aaf}
.hh-process43-node svg{width:29px;height:29px;fill:none;stroke:currentColor;stroke-width:1.45;position:relative}
.hh-process43-mark{stroke-width:3;stroke:#188ed3}
.hh-process43-pulse{position:absolute;inset:-1px;border:2px solid #329ada;border-radius:50%;animation:hh-process43-pulse 2.8s ease-out infinite}
.hh-process43-step:nth-child(3) .hh-process43-pulse{animation-delay:.85s}
.hh-process43-step:nth-child(4) .hh-process43-pulse{animation-delay:1.7s}
.hh-content .hh-process43-step h3{font-size:16px;line-height:1.5;font-weight:500;color:#2c5876;margin:0 0 8px}
.hh-content .hh-process43-step p{font-size:13px;line-height:1.75;color:#7b97aa;margin:0}
.hh-process43-result{position:relative;padding:22px 14px 4px;border-top:1px solid #d6e5ef}
.hh-process43-result:before{content:'';position:absolute;right:16.66%;top:-16px;width:1px;height:15px;background:#9cc9e6}
.hh-process43-result:after{content:'';position:absolute;right:calc(16.66% - 3px);top:-6px;width:6px;height:6px;border-right:1px solid #6aaccf;border-bottom:1px solid #6aaccf;transform:rotate(45deg)}
.hh-process43-result-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:13px;font-size:12px;color:#7191a6;letter-spacing:.08em}
.hh-process43-signature{color:#277dad;font-weight:500;letter-spacing:.16em}
.hh-content .hh-process43-answer{font-size:21px;line-height:1.75;letter-spacing:.005em;color:#285979;font-weight:400;margin:0;min-height:74px}
.hh-process43-sentence{display:block;animation:hh-process43-sentence-one var(--hh-process-cycle) linear infinite}
.hh-process43-sentence-two{animation-name:hh-process43-sentence-two}
.hh-process43-progress{height:2px;position:relative;overflow:hidden;width:70px;background:#dceaf3;margin-top:18px}
.hh-process43-progress i{display:block;height:100%;width:24px;background:#2c94d0;animation:hh-process43-flow 1.4s linear infinite}
@keyframes hh-process43-flow{from{transform:translateX(-100%)}to{transform:translateX(535%)}}
@keyframes hh-process43-pulse{0%{transform:scale(1);opacity:.85}52%,100%{transform:scale(1.38);opacity:0}}
@keyframes hh-process43-sentence-one{0%{clip-path:inset(0 100% 0 0);opacity:1}20%,93%{clip-path:inset(0);opacity:1}100%{clip-path:inset(0);opacity:0}}
@keyframes hh-process43-sentence-two{0%,16%{clip-path:inset(0 100% 0 0);opacity:1}34%,93%{clip-path:inset(0);opacity:1}100%{clip-path:inset(0);opacity:0}}
@container(max-width:580px){
 .hh-process43{padding:14px 10px 20px}
 .hh-process43-input{padding:0 5px 25px}
 .hh-content .hh-process43-input>p{font-size:20px}
 .hh-process43-source{font-size:11px;gap:6px}
 .hh-process43-result{padding:20px 5px 4px}
 .hh-content .hh-process43-answer{font-size:18px;min-height:64px}
 .hh-content .hh-process43-step h3{font-size:14px}
 .hh-content .hh-process43-step p{font-size:11px}
}
@container(max-width:370px){
 .hh-language-v43 .hh-motion-heading{font-size:14px;gap:8px}
 .hh-language-v43 .hh-motion-tools small{display:none}
 .hh-process43{padding:14px 0 20px}
 .hh-process43-source>span:last-child{flex-basis:100%;padding-left:20px}
 .hh-content .hh-process43-input>p{font-size:19px}
 .hh-process43-node{width:46px;height:46px;margin-bottom:14px}
 .hh-process43-node svg{width:25px;height:25px}
 .hh-process43-track{top:30px}
 .hh-content .hh-process43-step h3{font-size:13px}
 .hh-content .hh-process43-step p{font-size:10.5px}
 .hh-content .hh-process43-answer{font-size:16px;min-height:84px}
}


/* source: assets/css/hanhai/language-detail.css */
/* One readable process: input, three connected stages, natural-language result. */
.hh-language-v49{container-type:inline-size;--hh-process-cycle:15s}
.hh-language-v49 .hh-process43{padding:22px 18px 20px;background:none;color:#344f64}
.hh-language-v49 .hh-process43-input{padding:0;border:0}
.hh-language-v49 .hh-process43-label{font-size:12px;letter-spacing:.08em;font-weight:500;color:#41708e;margin-bottom:12px}
.hh-content .hh-language-v49 .hh-process43-input>p{width:100%;max-width:100%;box-sizing:border-box;padding:22px 28px;border:1px solid #cce2f2;border-radius:22px 22px 22px 5px;background:#eaf4fc;box-shadow:0 7px 20px #255d8208;font-size:22px;font-weight:500;line-height:1.65;letter-spacing:.01em;color:#203a50;margin:0 0 18px}
.hh-language-v49 .hh-process43-input em{font-style:normal;font-weight:600;color:#137fbe}
.hh-input55-action{white-space:nowrap}
.hh-language-v49 .hh-process43-source{gap:8px;font-size:12px;line-height:1.6;color:#607a8c}
.hh-language-v49 .hh-process43-source>span:first-of-type{color:#3f617b;margin-right:6px;font-weight:500}
.hh-language-v49 .hh-process43-source>span:last-child{display:flex;flex-wrap:wrap;gap:6px}
.hh-language-v49 .hh-process43-source b{padding:4px 8px;border-radius:4px;background:#edf3f7;font-weight:400}
.hh-language-v49 .hh-process43-stages{padding:38px 0 34px}
.hh-language-v49 .hh-process43-track{top:73px;height:3px;background:#d6e4ee;overflow:visible}
.hh-language-v49 .hh-process43-track>i{position:absolute;inset:0;width:100%;height:100%;background:#1888cc;transform-origin:left;animation:hh-process49-track var(--hh-process-cycle) linear infinite}
.hh-language-v49 .hh-process43-track>i.hh-process49-spark{background:none;animation-name:hh-process49-spark}
.hh-process49-spark b{position:absolute;left:-6px;top:-5px;width:13px;height:13px;border-radius:50%;background:#138ad5;box-shadow:0 0 0 5px #179bdd24}
.hh-language-v49 .hh-process43-node{width:72px;height:72px;border-radius:22px;border:1px solid #c2deee;background:#e9f4fb;color:#147bb9;margin:0 auto 18px;box-shadow:0 6px 15px #237ab70b;animation:hh-process49-first var(--hh-process-cycle) linear infinite}
.hh-language-v49 .hh-process43-node svg{width:33px;height:33px;stroke-width:1.65}
.hh-language-v49 .hh-process43-mark{stroke:currentColor;stroke-width:2.5}
.hh-language-v49 .hh-process43-step:nth-child(3) .hh-process43-node{animation-name:hh-process49-second}
.hh-language-v49 .hh-process43-step:nth-child(4) .hh-process43-node{animation-name:hh-process49-third}
.hh-language-v49 .hh-process43-pulse{inset:-2px;border-radius:23px;border:2px solid #1995d7;opacity:0;animation:hh-process49-pulse var(--hh-process-cycle) ease-out infinite}
.hh-language-v49 .hh-process43-step:nth-child(3) .hh-process43-pulse{animation-delay:1.5s}
.hh-language-v49 .hh-process43-step:nth-child(4) .hh-process43-pulse{animation-delay:3s}
.hh-content .hh-language-v49 .hh-process43-step h3{font-size:17px;font-weight:600;line-height:1.5;color:#25485f;margin-bottom:9px}
.hh-process49-number{display:inline-block;font-size:11px;letter-spacing:.04em;font-weight:500;color:#7292a7;margin-right:7px;vertical-align:2px}
.hh-content .hh-language-v49 .hh-process43-step p{font-size:13px;line-height:1.8;color:#637e90;white-space:normal;overflow-wrap:anywhere;padding-inline:4px;box-sizing:border-box}
.hh-language-v49 .hh-process43-step strong{white-space:normal}
.hh-language-v49 .hh-process43-step strong{font-weight:500;color:#176da1}
.hh-language-v49 .hh-process43-result{padding:0;border:0;background:none}
.hh-language-v49 .hh-process43-result:before,.hh-language-v49 .hh-process43-result:after{content:none}
.hh-language-v49 .hh-process43-result-heading{justify-content:flex-start;gap:12px;color:#7a8e9c;margin-bottom:12px;font-size:12px}
.hh-language-v49 .hh-process43-signature{order:-1;font-size:15px;font-weight:600;letter-spacing:.03em;color:#1379b5;padding-right:12px;border-right:1px solid #dbe5ec}
.hh-content .hh-language-v49 .hh-process43-answer{position:relative;width:100%;max-width:100%;box-sizing:border-box;padding:22px 26px;border:1px solid #dce6ed;border-radius:5px 22px 22px 22px;background:#f4f7fa;color:#294c65;font-size:18px;line-height:1.8;font-weight:400;min-height:0}
.hh-content .hh-language-v49 .hh-process43-answer p{font-size:inherit;line-height:inherit;color:inherit;margin:0}
.hh-content .hh-language-v49 .hh-process43-answer .hh-reply55-intro{font-size:14px;color:#5e7b90;margin-bottom:8px}
.hh-content .hh-language-v49 .hh-process43-answer .hh-reply55-brief{font-size:19px;color:#23475e;font-weight:500}
.hh-content .hh-language-v49 .hh-process43-answer>.hh-process43-sentence-two{margin-top:14px;padding-top:14px;border-top:1px solid #e1e9ef;font-size:16px;color:#587387}
.hh-language-v49 .hh-process43-sentence{display:block;animation:hh-reply54-first var(--hh-process-cycle) linear infinite}
.hh-language-v49 .hh-process43-sentence-two{animation-name:hh-reply54-second}
.hh-language-v49 .hh-process43-answer strong{font-weight:500;color:#087dbc}
.hh-reply54-typing{position:absolute;left:26px;top:29px;display:flex;gap:6px;animation:hh-reply54-wait var(--hh-process-cycle) linear infinite}
.hh-reply54-typing i{display:block;width:6px;height:6px;border-radius:50%;background:#3786b4;animation:hh-reply54-dot 1.2s ease-in-out infinite}
.hh-reply54-typing i:nth-child(2){animation-delay:.16s}
.hh-reply54-typing i:nth-child(3){animation-delay:.32s}
.hh-language-v49 .hh-process43-progress{display:none}
@keyframes hh-process49-track{0%{transform:scaleX(0);opacity:1}10%{transform:scaleX(.5)}20%,92%{transform:scaleX(1);opacity:1}98%,100%{transform:scaleX(1);opacity:0}}
@keyframes hh-process49-spark{0%{transform:translateX(0);opacity:1}10%{transform:translateX(50%);opacity:1}20%{transform:translateX(100%);opacity:1}23%,100%{transform:translateX(100%);opacity:0}}
@keyframes hh-process49-first{0%,92%,100%{background-color:#157fbd;color:#fff;border-color:#157fbd}98%{background-color:#e9f4fb;color:#147bb9;border-color:#c2deee}}
@keyframes hh-process49-second{0%,9%,98%,100%{background-color:#e9f4fb;color:#147bb9;border-color:#c2deee}11%,92%{background-color:#157fbd;color:#fff;border-color:#157fbd}}
@keyframes hh-process49-third{0%,19%,98%,100%{background-color:#e9f4fb;color:#147bb9;border-color:#c2deee}21%,92%{background-color:#157fbd;color:#fff;border-color:#157fbd}}
@keyframes hh-process49-pulse{0%{transform:scale(1);opacity:.75}9%,100%{transform:scale(1.27);opacity:0}}
@keyframes hh-reply54-first{0%,20%{opacity:0;transform:translateY(4px)}27%,92%{opacity:1;transform:translateY(0)}98%,100%{opacity:0;transform:translateY(0)}}
@keyframes hh-reply54-second{0%,27%{opacity:0;transform:translateY(4px)}35%,92%{opacity:1;transform:translateY(0)}98%,100%{opacity:0;transform:translateY(0)}}
@keyframes hh-reply54-wait{0%,18%,99%,100%{opacity:1}20%,98%{opacity:0}}
@keyframes hh-reply54-dot{0%,70%,100%{opacity:.3;transform:translateY(0)}35%{opacity:1;transform:translateY(-3px)}}
@container(max-width:600px){
 .hh-language-v49 .hh-process43{padding:18px 8px 16px}
 .hh-language-v49 .hh-process43-input{padding:0}
 .hh-content .hh-language-v49 .hh-process43-input>p{font-size:20px;padding:18px 22px;border-radius:19px 19px 19px 4px}
 .hh-language-v49 .hh-process43-source{font-size:11px}
 .hh-language-v49 .hh-process43-source>span:last-child{flex-basis:100%;padding-left:0}
 .hh-language-v49 .hh-process43-stages{padding:32px 0 30px}
 .hh-language-v49 .hh-process43-track{top:61px}
 .hh-language-v49 .hh-process43-node{width:60px;height:60px;border-radius:18px;margin-bottom:16px}
 .hh-language-v49 .hh-process43-pulse{border-radius:19px}
 .hh-content .hh-language-v49 .hh-process43-step h3{font-size:15px}
 .hh-content .hh-language-v49 .hh-process43-step p{font-size:12px}
 .hh-language-v49 .hh-process43-result{padding:0}
 .hh-content .hh-language-v49 .hh-process43-answer{font-size:18px;padding:18px 20px;border-radius:4px 19px 19px 19px}
 .hh-content .hh-language-v49 .hh-process43-answer .hh-reply55-brief{font-size:18px}
 .hh-content .hh-language-v49 .hh-process43-answer>.hh-process43-sentence-two{font-size:15px}
 .hh-reply54-typing{left:20px;top:26px}
 .hh-process49-number{display:block;margin:0 0 5px;font-size:10px}
}
@container(max-width:370px){
 .hh-language-v49 .hh-process43{padding-inline:0}
 .hh-content .hh-language-v49 .hh-process43-input>p{font-size:18px;padding:16px 18px}
 .hh-language-v49 .hh-process43-source{gap:5px;font-size:10px}
 .hh-language-v49 .hh-process43-source b{padding:3px 5px}
 .hh-content .hh-language-v49 .hh-process43-step h3{font-size:13px}
 .hh-content .hh-language-v49 .hh-process43-step p{font-size:10.5px}
 .hh-language-v49 .hh-process43-node{width:52px;height:52px;border-radius:16px}
 .hh-language-v49 .hh-process43-node svg{width:27px;height:27px}
 .hh-language-v49 .hh-process43-pulse{border-radius:17px}
 .hh-language-v49 .hh-process43-track{top:57px}
 .hh-content .hh-language-v49 .hh-process43-answer{font-size:16px;padding:16px 14px}
 .hh-content .hh-language-v49 .hh-process43-answer .hh-reply55-brief{font-size:16px}
 .hh-content .hh-language-v49 .hh-process43-answer>.hh-process43-sentence-two{font-size:14px}
 .hh-language-v49 .hh-process43-result{padding:0}
 .hh-reply54-typing{left:14px;top:24px}
}
@media(prefers-reduced-motion:reduce){
 .hh-language-v49 .hh-process43-pulse,.hh-language-v49 .hh-process49-spark{visibility:hidden}
 .hh-language-v49 .hh-process43-sentence,.hh-reply54-typing i{transform:none!important}
}


/* source: assets/css/hanhai/language-compact.css */
/* Keep the complete language example together at common desktop heights. */
.hh-content .hh-language-v49 .hh-process43-answer.hh-notice57>.hh-process43-sentence{display:inline;margin:0;padding:0;border:0;font:inherit;color:inherit}
@media(min-width:1001px){
 #language-title{scroll-margin-top:190px}
 .hh-language-v49 .hh-motion-heading{margin-bottom:10px}
 .hh-language-v49 .hh-process43{padding:8px 18px 4px}
 .hh-language-v49 .hh-process43-label{margin-bottom:8px}
 .hh-content .hh-language-v49 .hh-process43-input>p{font-size:20px;line-height:1.5;padding:14px 22px;margin-bottom:12px;border-radius:18px 18px 18px 4px}
 .hh-language-v49 .hh-process43-source{font-size:11px;gap:6px}
 .hh-language-v49 .hh-process43-stages{padding:22px 0 20px}
 .hh-language-v49 .hh-process43-track{top:51px}
 .hh-language-v49 .hh-process43-node{width:60px;height:60px;border-radius:18px;margin-bottom:10px}
 .hh-language-v49 .hh-process43-node svg{width:29px;height:29px}
 .hh-language-v49 .hh-process43-pulse{border-radius:19px}
 .hh-content .hh-language-v49 .hh-process43-step h3{font-size:16px;margin-bottom:5px}
 .hh-content .hh-language-v49 .hh-process43-step p{font-size:12px;line-height:1.65}
 .hh-language-v49 .hh-process43-result-heading{margin-bottom:8px}
 .hh-content .hh-language-v49 .hh-process43-answer{padding:14px 22px;border-radius:4px 18px 18px 18px;line-height:1.65}
 .hh-content .hh-language-v49 .hh-process43-answer .hh-reply55-intro{margin-bottom:5px}
 .hh-content .hh-language-v49 .hh-process43-answer .hh-reply55-brief{font-size:18px}
 .hh-content .hh-language-v49 .hh-process43-answer>.hh-process43-sentence-two{margin-top:8px;padding-top:8px;font-size:15px}
 .hh-reply54-typing{left:22px;top:23px}
}
@media(max-width:700px){
 .hh-language-v49 .hh-process43{padding-top:12px;padding-bottom:12px}
 .hh-content .hh-language-v49 .hh-process43-input>p{margin-bottom:12px}
 .hh-language-v49 .hh-process43-stages{padding-bottom:20px}
}


/* source: assets/css/hanhai/language-core.css */
/* The three processing stages carry the visual emphasis. */
.hh-content .hh-language-core58 .hh-process43-input>p{font-size:17px;font-weight:400;line-height:1.65;padding:12px 18px;margin-bottom:0;border-color:#e0e9f1;background:#f4f8fc;box-shadow:none;border-radius:14px 14px 14px 4px;color:#557084}
.hh-language-core58 .hh-process43-label{font-size:11px;margin-bottom:7px;color:#738b9e}
.hh-language-core58 .hh-process43-stages{gap:14px;padding:24px 0;isolation:isolate}
.hh-language-core58 .hh-process43-track{top:69px;z-index:2;height:2px;background:#b9d8eb}
.hh-language-core58 .hh-process43-step{position:relative;min-width:0;padding:16px 8px 20px;border:1px solid #cee0ed;border-radius:16px;background:#edf5fb;color:#315b76;animation:hh-core58-first var(--hh-process-cycle) linear infinite}
.hh-language-core58 .hh-process43-step:nth-child(3){animation-name:hh-core58-second}
.hh-language-core58 .hh-process43-step:nth-child(4){animation-name:hh-core58-third}
.hh-language-core58 .hh-process43-step>*{position:relative;z-index:3}
.hh-language-core58 .hh-process43-node{width:60px;height:60px;margin-bottom:12px;background:inherit!important;color:inherit!important;border:0;box-shadow:none;animation:none}
.hh-language-core58 .hh-process43-node svg{width:34px;height:34px}
.hh-language-core58 .hh-process43-pulse{border-color:currentColor;border-radius:50%}
.hh-content .hh-language-core58 .hh-process43-step h3{font-size:18px;line-height:1.45;font-weight:600;color:inherit;margin-bottom:10px}
.hh-language-core58 .hh-process49-number{color:inherit;opacity:.65;font-size:11px}
.hh-content .hh-language-core58 .hh-process43-step p{font-size:14px;line-height:1.7;color:inherit;padding:0;opacity:.9}
.hh-language-core58 .hh-process43-step strong{color:inherit;font-weight:600}
.hh-language-core58 .hh-process43-result-heading{font-size:11px;margin-bottom:7px;color:#8193a0}
.hh-language-core58 .hh-process43-signature{font-size:13px}
.hh-content .hh-language-core58 .hh-process43-answer{font-size:16px;line-height:1.7;padding:12px 18px;background:#f8fafc;border-color:#e3eaf0;border-radius:4px 14px 14px 14px;color:#577286}
.hh-language-core58 .hh-reply54-typing{left:18px;top:22px}
@keyframes hh-core58-first{0%,8%,100%{background:#176fa9;color:#fff;border-color:#176fa9}11%,97%{background:#edf5fb;color:#315b76;border-color:#cee0ed}}
@keyframes hh-core58-second{0%,8%,22%,100%{background:#edf5fb;color:#315b76;border-color:#cee0ed}11%,19%{background:#176fa9;color:#fff;border-color:#176fa9}}
@keyframes hh-core58-third{0%,19%,98%,100%{background:#edf5fb;color:#315b76;border-color:#cee0ed}22%,92%{background:#176fa9;color:#fff;border-color:#176fa9}}
@container(max-width:600px){
 .hh-content .hh-language-core58 .hh-process43-input>p{font-size:16px;padding:12px 14px}
 .hh-language-core58 .hh-process43-stages{gap:8px;padding:20px 0}
 .hh-language-core58 .hh-process43-track{top:61px}
 .hh-language-core58 .hh-process43-step{padding:14px 5px 16px;border-radius:13px}
 .hh-language-core58 .hh-process43-node{width:52px;height:52px;margin-bottom:10px}
 .hh-content .hh-language-core58 .hh-process43-step h3{font-size:15px;margin-bottom:8px}
 .hh-content .hh-language-core58 .hh-process43-step p{font-size:12px}
 .hh-language-core58 .hh-process49-number{display:block;margin:0 0 5px}
 .hh-content .hh-language-core58 .hh-process43-answer{font-size:15px;padding:12px 14px}
 .hh-language-core58 .hh-reply54-typing{left:14px}
}
@container(max-width:370px){
 .hh-language-core58 .hh-process43-stages{gap:6px}
 .hh-language-core58 .hh-process43-step{padding-inline:4px}
 .hh-content .hh-language-core58 .hh-process43-step h3{font-size:13px}
 .hh-content .hh-language-core58 .hh-process43-step p{font-size:10.5px;line-height:1.8}
 .hh-language-core58 .hh-process43-node svg{width:30px;height:30px}
}


/* source: assets/css/hanhai/language-timeline.css */
/* One horizontal narrative; the active event follows the language process. */
.hh-language-timeline70 .hh-process43 { background:none; }
.hh-language-timeline70 .hh-process43-label { color:#47748f; font-size:11px; letter-spacing:.12em; }
.hh-content .hh-language-timeline70 .hh-process43-input>p {
  color:#47657b; background:linear-gradient(115deg,#fff,#f0f8ff); border-color:#cddfeb;
  box-shadow:inset 0 1px 0 #fff,0 5px 16px #306a9606;
}
.hh-language-timeline70 .hh-process43-stages { gap:20px; padding:30px 0 28px; }
.hh-language-timeline70 .hh-process43-stages::before {
  content:""; position:absolute; inset:9px -12px 7px; z-index:-1; pointer-events:none;
  background:radial-gradient(ellipse at 50% 20%,#dff1ff80,transparent 73%);
}
.hh-language-timeline70 .hh-process43-step {
  --hh-time70-light:hh-time70-first; --hh-time70-ink:hh-time70-ink-first;
  padding:0 4px; border:0; border-radius:0; background:none; box-shadow:none; color:#315b76; animation:none;
}
.hh-language-timeline70 .hh-process43-step:nth-child(3) { --hh-time70-light:hh-time70-second; --hh-time70-ink:hh-time70-ink-second; animation:none; }
.hh-language-timeline70 .hh-process43-step:nth-child(4) { --hh-time70-light:hh-time70-third; --hh-time70-ink:hh-time70-ink-third; animation:none; }
.hh-language-timeline70 .hh-process43-node {
  position:relative; width:36px; height:36px; margin:0 auto 16px; border:1px solid #bfd8e8;
  border-radius:50%; background:#f8fcff!important; box-shadow:0 0 0 5px #f6fbff; animation:none;
}
.hh-language-timeline70 .hh-process43-node::before {
  content:""; position:absolute; inset:-1px; border-radius:50%;
  background:linear-gradient(140deg,#25a9e8,#1167a5); box-shadow:0 0 0 4px #55baf11a,0 3px 12px #1387cc40;
  animation:var(--hh-time70-light) var(--hh-process-cycle) linear infinite; animation-play-state:inherit;
}
.hh-language-timeline70 .hh-process43-node>span {
  position:relative; z-index:1; font-size:12px; font-weight:600; letter-spacing:.04em;
  animation:var(--hh-time70-ink) var(--hh-process-cycle) linear infinite; animation-play-state:inherit;
}
.hh-content .hh-language-timeline70 .hh-process43-step h3 {
  position:relative; padding:8px 2px; margin:0 0 9px; font-size:18px; line-height:24px; font-weight:600;
  animation:var(--hh-time70-ink) var(--hh-process-cycle) linear infinite; animation-play-state:inherit;
}
.hh-language-timeline70 .hh-process43-step h3::before {
  content:""; position:absolute; inset:0; z-index:-1; border-radius:8px;
  background:linear-gradient(115deg,#1787c7,#146ba8); box-shadow:0 4px 13px #157fbd22;
  animation:var(--hh-time70-light) var(--hh-process-cycle) linear infinite; animation-play-state:inherit;
}
.hh-content .hh-language-timeline70 .hh-process43-step p { color:#56758c; font-size:14px; line-height:1.75; opacity:1; }
.hh-language-timeline70 .hh-process43-step strong { color:#087bb9; font-weight:600; }
.hh-language-timeline70 .hh-condition75-value { display:inline-block; white-space:nowrap; }
.hh-language-timeline70 .hh-process43-track { top:47px; height:3px; z-index:2; border-radius:3px; background:#cbdfea; box-shadow:0 1px 0 #fff; }
.hh-language-timeline70 .hh-process43-track>i:first-child { border-radius:3px; background:linear-gradient(90deg,#187db9,#2cb5e6); }
.hh-language-timeline70 .hh-process49-spark b { width:8px; height:8px; top:-3px; background:#f1fcff; box-shadow:0 0 0 3px #23a8e599,0 0 12px #27affc66; }
.hh-language-timeline70 .hh-process43-track>i.hh-timeline70-stream {
  inset:0 auto; width:18%; height:3px; border-radius:3px;
  background:linear-gradient(90deg,transparent,#6ce0ff,#fff,transparent);
  animation:hh-time70-stream 3s linear infinite;
}
.hh-language-timeline70 .hh-process43-result-heading { color:#336483; font-size:13px; font-weight:500; margin-bottom:10px; }
.hh-language-timeline70 .hh-process43-signature { font-size:15px; }
.hh-content .hh-language-timeline70 .hh-process43-answer {
  color:#234a65; background:linear-gradient(115deg,#e5f3ff,#f0f9ff); border-color:#9fcce7;
  box-shadow:inset 0 1px 0 #fff,0 5px 18px #1c7eba0a;
  font-size:18px; line-height:1.8; font-weight:500; padding:18px 22px;
}
.hh-language-timeline70 .hh-process43-answer strong { color:#0677b9; font-weight:700; white-space:nowrap; }
.hh-language-timeline70 .hh-reply54-typing { top:29px; left:22px; }
/* Reveal the delivery once, then keep it readable while the process loops. */
.hh-language-timeline70 .hh-process43-sentence { animation-name:hh-time74-answer-one; animation-iteration-count:1; animation-fill-mode:both; }
.hh-language-timeline70 .hh-process43-sentence-two { animation-name:hh-time74-answer-two; }
.hh-language-timeline70 .hh-reply54-typing { animation-name:hh-time74-wait; animation-iteration-count:1; animation-fill-mode:both; }
@keyframes hh-time74-answer-one {0%,20%{opacity:0;transform:translateY(4px)}27%,100%{opacity:1;transform:translateY(0)}}
@keyframes hh-time74-answer-two {0%,27%{opacity:0;transform:translateY(4px)}35%,100%{opacity:1;transform:translateY(0)}}
@keyframes hh-time74-wait {0%,18%{opacity:1}20%,100%{opacity:0}}
@media(min-width:701px) {
  .hh-product[aria-labelledby="language-title"] .hh-feature { align-items:stretch; }
  .hh-product[aria-labelledby="language-title"] .hh-feature-copy { display:flex; flex-direction:column; align-items:flex-start; }
  .hh-product[aria-labelledby="language-title"] .hh-capabilities { margin-bottom:20px; }
  .hh-product[aria-labelledby="language-title"] .hh-research-status { margin-top:auto; }
  .hh-product .hh-language-timeline70 { display:flex; flex-direction:column; align-self:stretch; margin:12px 0; }
  .hh-language-timeline70 .hh-motion-heading { align-items:flex-start; margin-bottom:12px; }
  .hh-language-timeline70 .hh-motion-heading>span { line-height:19px; }
  .hh-language-timeline70 .hh-process43 { flex:1; display:flex; flex-direction:column; padding:0 18px; }
  .hh-language-timeline70 .hh-process43-stages { margin-block:auto; }
}
@keyframes hh-time70-first {0%,8%,100%{opacity:1}11%,97%{opacity:0}}
@keyframes hh-time70-second {0%,8%,22%,100%{opacity:0}11%,19%{opacity:1}}
@keyframes hh-time70-third {0%,19%,98%,100%{opacity:0}22%,92%{opacity:1}}
@keyframes hh-time70-ink-first {0%,8%,100%{color:#fff}11%,97%{color:#315b76}}
@keyframes hh-time70-ink-second {0%,8%,22%,100%{color:#315b76}11%,19%{color:#fff}}
@keyframes hh-time70-ink-third {0%,19%,98%,100%{color:#315b76}22%,92%{color:#fff}}
@keyframes hh-time70-stream {from{transform:translateX(-100%);opacity:0}12%,85%{opacity:1}to{transform:translateX(555%);opacity:0}}
@container(max-width:600px) {
  .hh-language-timeline70 .hh-process43-stages { gap:10px; padding:26px 0; }
  .hh-language-timeline70 .hh-process43-step { padding:0 2px; }
  .hh-language-timeline70 .hh-process43-node { width:32px; height:32px; margin-bottom:12px; }
  .hh-language-timeline70 .hh-process43-node>span { font-size:11px; }
  .hh-language-timeline70 .hh-process43-track { top:41px; }
  .hh-content .hh-language-timeline70 .hh-process43-step h3 { font-size:15px; line-height:22px; padding:7px 0; margin-bottom:8px; }
  .hh-content .hh-language-timeline70 .hh-process43-step p { font-size:12px; }
  .hh-content .hh-language-timeline70 .hh-process43-answer { font-size:16px; padding:15px 16px; }
  .hh-language-timeline70 .hh-reply54-typing { top:24px; left:16px; }
}
@container(max-width:370px) {
  .hh-language-timeline70 .hh-process43-stages { gap:6px; }
  .hh-language-timeline70 .hh-process43-step { padding:0; }
  .hh-content .hh-language-timeline70 .hh-process43-step h3 { font-size:13px; }
  .hh-content .hh-language-timeline70 .hh-process43-step p { font-size:10.5px; }
  .hh-language-timeline70 .hh-process43-result-heading { font-size:11px; gap:8px; }
  .hh-content .hh-language-timeline70 .hh-process43-answer { font-size:15px; padding:14px; }
  .hh-language-timeline70 .hh-reply54-typing { top:23px; left:14px; }
}
@media(prefers-reduced-motion:reduce) { .hh-language-timeline70 .hh-timeline70-stream { display:none!important; } }


/* source: assets/css/hanhai/related.css */
/* Related products complete the model page; no additional animation runtime. */
.hh-related44{padding:76px 0 80px;background:#eef3f7;border-top:1px solid #dbe5ed;color:#172a38}
.hh-related44 .hanhai-shell{min-width:0}
#related-products-title{scroll-margin-top:160px}
.hh-related44-header{display:flex;justify-content:space-between;align-items:baseline;gap:24px;margin-bottom:28px}
.hh-related44-header h2{font-size:28px;line-height:1.4;font-weight:500;letter-spacing:.01em;margin:0;color:#20282f}
.hh-related44-header p{font-size:15px;line-height:1.6;margin:0;color:#747d86}
.hh-related44-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.hh-related44-card{position:relative;min-width:0;display:flex;flex-direction:column;overflow:hidden;border-radius:24px;border:1px solid #2333420d;box-shadow:0 14px 38px #1924320d;text-decoration:none;color:#20282f;cursor:pointer;isolation:isolate;transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease}
.hh-related44-card--hardware{background:linear-gradient(155deg,#f1ede7 0%,#e3dcd2 100%)}
.hh-related44-card--employee{background:linear-gradient(180deg,#dce7ef 0%,#e8eff5 28%,#f6f8fa 56%,#f6f8fa 100%)}
.hh-related44-copy{padding:34px 36px 0}
.hh-related44-copy h3{font-size:34px;line-height:1.3;font-weight:600;letter-spacing:.015em;margin:0 0 13px;color:#20282f}
.hh-related44-lead{font-size:22px;line-height:1.5;color:#46525c;margin:0 0 12px;font-weight:400}
.hh-related44-description{font-size:16px;line-height:1.85;color:#5d6973;max-width:25em;min-height:60px;margin:0}
.hh-related44-link{display:inline-flex;align-items:center;justify-content:center;gap:0;margin-top:20px;min-width:148px;min-height:44px;padding:10px 20px;box-sizing:border-box;border:1px solid transparent;border-radius:999px;background:#253e51;color:#fff;font-size:15px;font-weight:500;text-decoration:none;line-height:1.5;transition:background-color .25s ease}
.hh-related44-card:focus-visible{outline:3px solid #207caf;outline-offset:5px;box-shadow:0 20px 44px #19243220}
.hh-related44-visual{height:282px;display:flex;justify-content:center;align-items:center;padding:14px 30px 24px;margin:0;margin-top:auto}
.hh-related44-visual img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;max-width:400px;transform-origin:50% 70%;transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.hh-related44-card--hardware .hh-related44-visual img{max-width:520px}
.hh-related44-card--employee .hh-related44-visual img{max-width:520px;mask-image:linear-gradient(to bottom,transparent,#000 4%,#000 96%,transparent)}
@media(hover:hover) and (pointer:fine){
 .hh-related44-card:hover{transform:translateY(-6px);border-color:#23334220;box-shadow:0 24px 54px #19243224}
 .hh-related44-card:hover .hh-related44-visual img{transform:translateY(-3px) scale(1.055)}
 .hh-related44-card:hover .hh-related44-link{background:#17679a}
}
.hh-related44-card:active{transform:translateY(-2px)}
.hh-related44-card:focus-visible .hh-related44-link{background:#17679a}
@media(prefers-reduced-motion:reduce){.hh-related44-card{transition-duration:.18s}.hh-related44-visual img{transition-duration:.22s}}
@media(max-width:1100px){
 .hh-related44-copy{padding:28px 28px 0}
 .hh-related44-copy h3{font-size:30px}
 .hh-related44-lead{font-size:20px}
 .hh-related44-visual{height:230px;padding-inline:20px}
}
@media(max-width:700px){
 #related-products-title{scroll-margin-top:96px}
 .hh-related44{padding:40px 0 42px}
 .hh-related44-header{display:block;margin-bottom:20px}
 .hh-related44-header h2{font-size:25px}
 .hh-related44-header p{margin-top:8px;font-size:14px}
 .hh-related44-grid{grid-template-columns:1fr;gap:18px}
 .hh-related44-copy{padding:26px 24px 0}
 .hh-related44-copy h3{font-size:28px}
 .hh-related44-lead{font-size:20px}
 .hh-related44-description{font-size:15px;min-height:0}
 .hh-related44-link{margin-top:14px;min-height:40px}
 .hh-related44-visual{height:230px;padding:10px 22px 24px}
 .hh-related44-card--hardware .hh-related44-visual{height:195px}
}


/* source: assets/css/hanhai/scroll.css */
/* Keep SVG repaint inside its existing clipped canvas and separate from the artwork. */
.hh-motion-canvas { contain: paint; }
.hh-motion-overlay { transform: translateZ(0); }


/* source: assets/css/hanhai/scroll-fixes.css */
/* Pause during scrolling without repeatedly dropping the visible hero's layers. */
.hanhai-hero.hh-hero-scrolling *,
.hanhai-hero.hh-hero-scrolling *::before,
.hanhai-hero.hh-hero-scrolling *::after { animation-play-state: paused !important; }


/* source: assets/css/hanhai/prediction.css */
/* One continuous energy scene; one actual-to-forecast animation. */
.hh-p33[data-hh-motion]{--hh-cycle:14s;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);gap:64px;align-items:center;margin-top:30px;padding-top:32px;border-top:1px solid #d8e5ed;min-width:0}
.hh-p33-scene{position:relative;min-width:0;margin:0;align-self:center}
.hh-p33-art{display:block;width:100%;height:auto;mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent),linear-gradient(transparent,#000 8%,#000 85%,transparent);mask-composite:intersect}
.hh-p33-tools{position:absolute;z-index:1;right:0;top:0}
.hh-p33-plot{position:relative;margin:-48px 12px 0}
.hh-p33-legend{display:grid;grid-template-columns:1fr 1fr;margin:0 2.3%;font-size:13px;line-height:1.5;color:#8299aa}
.hh-p33-legend span:last-child{color:#3089c0;padding-left:8px}
.hh-p33-chart{display:block;width:100%;height:auto;fill:none;overflow:visible}
.hh-p33-chart path,.hh-p33-chart circle{vector-effect:non-scaling-stroke}
.hh-p33-grid{stroke:#e0e9f1;stroke-width:.65}
.hh-p33-boundary{stroke:#b5d1e5;stroke-width:.9}
.hh-p33-actual{stroke:#869faf;stroke-width:1.8;stroke-dasharray:none;stroke-linejoin:round;stroke-linecap:round}
.hh-p33-forecast{stroke:#2685bc;stroke-width:2;stroke-dasharray:6 4;stroke-linejoin:round;stroke-linecap:butt}
.hh-p33-origin{fill:#f6f8fb;stroke:#709ebc;stroke-width:1.2}
.hh-p33-end{fill:#2685bc;stroke:#f6f8fb;stroke-width:1.2}
.hh-p33-future{clip-path:inset(0);animation:hh-p33-reveal var(--hh-cycle) linear infinite;transform-box:fill-box}
@keyframes hh-p33-reveal{0%,7%{clip-path:inset(0 100% 0 0)}42%,94%{clip-path:inset(0);opacity:1}100%{clip-path:inset(0);opacity:0}}
.hh-p33-ranges{min-width:0;padding:0 0 0 6px}
.hh-p33-ranges h3{margin:0 0 9px;font-size:21px;line-height:1.5;font-weight:500;color:#294e66}
.hh-p33-group{display:grid;grid-template-columns:25px minmax(0,1fr);gap:14px;padding:20px 0;border-bottom:1px solid #d8e5ed}
.hh-p33-index{padding-top:5px;font-size:12px;line-height:1.5;color:#8fa6b8;font-variant-numeric:tabular-nums}
.hh-p33-ranges h4{margin:0;font-size:19px;font-weight:500;line-height:1.5;color:#365f7a}
.hh-content .hh-p33-ranges ul{margin:10px 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;column-gap:24px;row-gap:5px;color:#6d879b;font-size:16px;line-height:1.75}
.hh-content .hh-p33-ranges li{margin:0;padding:0}
.hh-p33-weather{padding:20px 0 0 39px}
.hh-p33-weather h4{font-size:16px;color:#6d879b;font-weight:400}
@media(min-width:701px) and (max-width:1150px){
 .hh-p33[data-hh-motion]{gap:34px;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}
 .hh-p33-group{padding:16px 0;gap:10px;grid-template-columns:20px minmax(0,1fr)}
 .hh-p33-ranges h4{font-size:18px}
 .hh-content .hh-p33-ranges ul{font-size:15px;column-gap:16px}
 .hh-p33-weather{padding-left:30px}
 .hh-p33-plot{margin-top:-24px}
}
@media(max-width:700px){
 .hh-p33[data-hh-motion]{grid-template-columns:1fr;gap:30px;margin-top:22px;padding-top:18px}
 .hh-p33-plot{margin:-20px 0 0}
 .hh-p33-legend{font-size:12px}
 .hh-p33-ranges{padding:0}
 .hh-p33-ranges h3{font-size:19px;margin-bottom:3px}
 .hh-p33-ranges h4{font-size:17px}
 .hh-p33-group{padding:17px 0;grid-template-columns:20px minmax(0,1fr);gap:10px}
 .hh-p33-index{padding-top:4px}
 .hh-content .hh-p33-ranges ul{font-size:14px;margin-top:7px;column-gap:16px;row-gap:4px}
 .hh-p33-weather{padding:17px 0 0 30px}
 .hh-p33-weather h4{font-size:14px}
}
@media(prefers-reduced-motion:reduce){.hh-p33-future{animation:none;clip-path:inset(0);opacity:1}}


/* source: assets/css/hanhai/prediction-panel.css */
/* Four simultaneous chart rows with matching scope text; no scene artwork. */
.hh-p36[data-hh-motion]{display:block;position:relative;padding-top:24px}
.hh-p36-defs{position:absolute;width:0;height:0;overflow:hidden}
.hh-p36-header,.hh-p36-row,.hh-p36-text-row{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);column-gap:64px;align-items:center}
.hh-p36-header{padding-bottom:7px}
.hh-p36-header h3{margin:0;font-size:21px;line-height:1.5;font-weight:500;color:#294e66}
.hh-p36-chart-header{display:flex;align-items:center;justify-content:space-between;padding-left:14px}
.hh-p36-legend{display:flex;gap:25px;font-size:12px;line-height:1.5;color:#718c9f}
.hh-p36-legend span{display:flex;align-items:center;gap:8px}
.hh-p36-legend i{display:block;width:23px;border-top:1.8px solid #869faf}
.hh-p36-legend span:last-child i{border-top:2px dashed #2685bc}
.hh-p36-row{padding:11px 0;border-bottom:1px solid #d8e5ed}
.hh-p36-plot{min-width:0;margin:0}
.hh-p36-plot figcaption{padding-left:14px;margin:0 0 2px;font-size:15px;line-height:1.5;color:#3e6a87;font-weight:500}
.hh-p36-scope{min-width:0;display:grid;grid-template-columns:25px minmax(0,1fr);gap:14px;align-items:baseline}
.hh-p36-scope h4{margin:0;font-size:19px;font-weight:500;line-height:1.5;color:#365f7a}
.hh-content .hh-p36-scope ul{margin:10px 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;column-gap:24px;row-gap:5px;color:#6d879b;font-size:16px;line-height:1.75}
.hh-content .hh-p36-scope li{margin:0;padding:0}
.hh-p36-text-row{padding-top:19px}
.hh-p36-weather{grid-column:2;padding-left:39px}
.hh-p36-weather h4{margin:0;font-size:16px;line-height:1.5;color:#6d879b;font-weight:400}
@media(min-width:701px) and (max-width:1150px){
 .hh-p36-header,.hh-p36-row,.hh-p36-text-row{column-gap:34px;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}
 .hh-p36-row{padding:16px 0}
 .hh-p36-scope{grid-template-columns:20px minmax(0,1fr);gap:10px}
 .hh-p36-scope h4{font-size:18px}
 .hh-content .hh-p36-scope ul{font-size:15px;column-gap:16px}
 .hh-p36-weather{padding-left:30px}
}
@media(max-width:700px){
 .hh-p36[data-hh-motion]{padding-top:16px}
 .hh-p36-header{display:block;padding-bottom:0}
 .hh-p36-header h3{display:none}
 .hh-p36-chart-header{padding-left:0}
 .hh-p36-legend{gap:19px;font-size:12px}
 .hh-p36-row{grid-template-columns:1fr;row-gap:13px;padding:22px 0}
 .hh-p36-scope{grid-row:1;grid-template-columns:20px minmax(0,1fr);gap:10px}
 .hh-p36-scope h4{font-size:17px}
 .hh-content .hh-p36-scope ul{font-size:14px;column-gap:16px;row-gap:4px;margin-top:7px}
 .hh-p36-plot{grid-row:2}
 .hh-p36-plot figcaption{font-size:12px;line-height:1.5;margin:0 0 5px;padding-left:7px;color:#708b9f}
 .hh-p36-plot svg{height:80px}
 .hh-p36-text-row{display:block;padding-top:17px}
 .hh-p36-weather{padding-left:30px}
 .hh-p36-weather h4{font-size:14px}
}


/* source: assets/css/hanhai/prediction-layout.css */
/* Four simultaneous rows fit the desktop viewport below the sticky navigation. */
.hh-p37[data-hh-motion]{padding-top:16px}
.hh-p37 .hh-p36-header,.hh-p37 .hh-p36-row{grid-template-columns:minmax(0,1fr) minmax(0,1.08fr)}
.hh-p37 .hh-p36-header{padding-bottom:6px}
.hh-p37 .hh-p36-row{padding-block:10px}
.hh-p37 .hh-p36-plot{padding-right:24px}
.hh-p37 .hh-p36-plot svg{height:clamp(64px,calc((100svh - 300px)/4),104px)}
@media(min-width:701px) and (max-width:1150px){
 .hh-p37 .hh-p36-header,.hh-p37 .hh-p36-row{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr)}
}
@media(min-width:701px) and (max-height:700px){
 .hh-p37[data-hh-motion]{padding-top:12px}
 .hh-p37 .hh-p36-header h3{font-size:19px}
 .hh-p37 .hh-p36-row{padding-block:8px}
 .hh-p37 .hh-p36-scope h4{font-size:17px}
 .hh-content .hh-p37 .hh-p36-scope ul{font-size:14px;line-height:1.65;margin-top:7px;row-gap:3px;column-gap:20px}
}
@media(max-width:700px){
 .hh-p37[data-hh-motion]{padding-top:16px}
 .hh-p37 .hh-p36-header{display:block;padding-bottom:0}
 .hh-p37 .hh-p36-row{grid-template-columns:1fr;padding-block:20px;row-gap:12px}
 .hh-p37 .hh-p36-plot{padding-right:46px}
 .hh-p37 .hh-p36-plot svg{height:80px}
}


/* source: assets/css/hanhai/prediction-detail.css */
/* Keep the product introduction and its four charts in the same frame as the adjacent scenes. */
.hh-p38[data-hh-motion]{margin-top:0;padding-top:0;border-top:0}
.hh-p38 .hh-p36-header{padding-bottom:12px;border-bottom:1px solid #d8e5ed}
.hh-p38 .hh-p36-header,.hh-p38 .hh-p36-row{grid-template-columns:minmax(0,218px) minmax(0,1fr);column-gap:22px}
.hh-p38 .hh-p36-header h3{font-size:18px}
.hh-p38 .hh-p36-chart-header{padding-left:0;gap:12px}
.hh-p38 .hh-p36-legend{gap:16px;font-size:11px;white-space:nowrap}
.hh-p38 .hh-p36-legend span{gap:6px}
.hh-p38 .hh-p36-legend i{width:20px}
.hh-p38 .hh-p36-row{min-height:112px;padding-block:14px}
.hh-p38 .hh-p36-scope{grid-template-columns:20px minmax(0,1fr);gap:8px}
.hh-p38 .hh-p36-scope h4{font-size:17px;line-height:1.5}
.hh-content .hh-p38 .hh-p36-scope ul{display:block;font-size:14px;line-height:1.7;margin-top:7px;color:#627f94}
.hh-p38 .hh-p36-plot{padding-right:24px}
.hh-p38 .hh-p36-plot svg{height:82px}
/* Draw the forecast visibly, with a moving time cursor and flowing dashes. */
.hh-p38[data-hh-motion]{--hh-cycle:8s}
/* Explicitly requested product demo motion; the scene pause control remains available. */
.hh-p38 .hh-p33-future{animation:hh-p76-reveal var(--hh-cycle) linear infinite}
.hh-p38 .hh-p33-forecast{stroke-width:2.2;animation:hh-p76-dashes 1.6s linear infinite;animation-play-state:inherit}
.hh-p38 .hh-p76-scan{stroke:#229bd3;stroke-width:1.3;transform-box:view-box;animation:hh-p76-scan var(--hh-cycle) linear infinite}
@keyframes hh-p76-reveal{0%{clip-path:inset(0 100% 0 0);opacity:1}65%,92%{clip-path:inset(0);opacity:1}100%{clip-path:inset(0);opacity:0}}
@keyframes hh-p76-scan{0%{transform:translateX(0);opacity:.8}65%{transform:translateX(var(--hh-p76-travel));opacity:.8}80%,100%{transform:translateX(var(--hh-p76-travel));opacity:0}}
@keyframes hh-p76-dashes{from{stroke-dashoffset:0}to{stroke-dashoffset:-20}}

@media(min-width:1101px){
 .hh-prediction-section:has(.hh-p38)>.hanhai-shell{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:clamp(32px,5vw,76px);align-items:start}
 .hh-prediction-section:has(.hh-p38) .hh-prediction-intro{grid-column:2;grid-row:1;display:block;margin:0;padding:12px 0;min-width:0}
 .hh-prediction-section .hh-p38{grid-column:1;grid-row:1}
 .hh-prediction-section:has(.hh-p38) .hh-feature-description{margin:23px 0 12px;max-width:430px}
 .hh-prediction-section:has(.hh-p38) .hh-scope-note{margin:0;color:#577d98;font-size:16px;line-height:1.8}
}
@media(min-width:701px) and (max-width:1100px){
 .hh-prediction-section:has(.hh-p38) .hh-prediction-intro{grid-template-columns:280px minmax(0,1fr);gap:28px}
 .hh-p38 .hh-p36-header,.hh-p38 .hh-p36-row{grid-template-columns:280px minmax(0,1fr);column-gap:28px}
 .hh-content .hh-p38 .hh-p36-scope ul{display:flex;font-size:14px;column-gap:16px;row-gap:2px}
 .hh-p38 .hh-p36-plot{padding-right:20px}
}
@media(min-width:701px) and (max-height:700px){
 .hh-p38 .hh-p36-row{min-height:84px;padding-block:9px}
 .hh-p38 .hh-p36-plot svg{height:64px}
 .hh-content .hh-p38 .hh-p36-scope ul{font-size:13px;line-height:1.6;margin-top:5px}
}
@media(max-width:700px){
 .hh-p38[data-hh-motion]{padding-top:0}
 .hh-p38 .hh-p36-header{display:block;padding-bottom:12px}
 .hh-p38 .hh-p36-legend{font-size:12px}
 .hh-p38 .hh-p36-row{grid-template-columns:1fr;padding-block:20px;row-gap:12px;min-height:0}
 .hh-content .hh-p38 .hh-p36-scope ul{display:flex;font-size:14px;column-gap:16px;row-gap:4px}
 .hh-p38 .hh-p36-plot{padding-right:46px}
 .hh-p38 .hh-p36-plot svg{height:80px}
}