:root { --ink:#172235; --muted:#667083; --paper:#f4f5f6; --line:#dfe3e8; --card-w: 360px; --font-sans:"PingFang SC", "PingFang TC", "Hiragino Sans GB", "Microsoft YaHei", Arial, sans-serif; }
* { box-sizing:border-box; }
html { background:var(--paper); }
body { margin:0; min-width:320px; color:var(--ink); font-family:var(--font-sans); background:radial-gradient(circle at 50% 29%, #fff 0, #f7f8f9 28rem, var(--paper) 57rem); }
a { color:inherit; text-decoration:none; }
.site-header, footer { width:min(1180px, calc(100% - 48px)); margin:auto; display:flex; justify-content:space-between; align-items:center; }
.site-header { height:84px; }
.wordmark, .eyebrow, .card-index, footer { font-family:var(--font-sans); letter-spacing:.055em; }
.wordmark { font-size:14px; font-weight:500; }.wordmark span { color:#f05b42; }
.contact-link { font-size:14px; border-bottom:1px solid var(--ink); padding-bottom:3px; }.contact-link span { margin-left:5px; }
main { overflow:hidden; }.intro { width:min(1180px, calc(100% - 48px)); margin:90px auto 0; }
.eyebrow { color:#778294; font-size:11px; margin:0 0 22px; }
h1 { max-width:780px; font-size:clamp(46px, 6.1vw, 86px); line-height:1.11; letter-spacing:-.065em; margin:0; font-weight:600; }
.intro-copy { margin:35px 0 0; color:#536073; font-size:15px; line-height:1.9; }
.work { width:min(1180px, calc(100% - 48px)); margin:110px auto 0; }.section-heading { display:flex; justify-content:space-between; align-items:baseline; border-top:1px solid var(--line); padding-top:18px; }.section-heading .eyebrow { margin:0; }.section-heading > p:last-child { color:var(--muted); font-size:13px; margin:0; }
.case-deck { height:575px; max-width:900px; margin:36px auto 0; position:relative; isolation:isolate; }
.case-card { --x:0px; --r:0deg; width:var(--card-w); height:450px; position:absolute; left:50%; top:46px; transform:translateX(calc(-50% + var(--x))) rotate(var(--r)); transform-origin:center bottom; border-radius:17px; overflow:hidden; box-shadow:0 19px 30px #1520341c; background:#fff; transition:transform 240ms cubic-bezier(.2,.75,.25,1), box-shadow 240ms ease; outline-offset:7px; }
.case-card:hover, .case-card:focus-visible, .case-card.is-open { transform:translateX(calc(-50% + var(--x))) translateY(-20px) scale(1.035) rotate(0deg); box-shadow:0 29px 42px #15203436; z-index:10 !important; }
.case-card:focus-visible { outline:2px solid #172235; }
.card-1 { --x:-210px; --r:-8deg; z-index:1; }.card-2 { --x:-74px; --r:-3deg; z-index:2; }.card-3 { --x:72px; --r:3deg; z-index:3; }.card-4 { --x:212px; --r:8deg; z-index:4; }
.case-deck:has(.case-card:hover) .case-card:not(:hover) { filter:saturate(.82); }.case-deck:has(.case-card:focus-visible) .case-card:not(:focus-visible) { filter:saturate(.82); }
.card-visual { height:100%; padding:24px; color:#fff; position:relative; overflow:hidden; }.visual-kicker { font:11px var(--font-sans); letter-spacing:.1em; }.visual-1 { background:#243855; }.visual-2 { background:#d8a12d; }.visual-3 { background:#db5d47; }.visual-4 { background:#3c857f; }.k1-card-cover { padding:0; background:#132439; }.k1-card-cover img { width:100%; height:100%; display:block; object-fit:cover; }.k1-card-cover .visual-kicker { position:absolute; z-index:1; top:24px; left:24px; text-shadow:0 1px 8px #0009; }
.dashboard,.flow,.chart,.customer-grid { position:absolute; left:22px; right:22px; bottom:22px; height:300px; border:1px solid #ffffff7a; border-radius:8px; background:#ffffffd9; overflow:hidden; }.dash-nav { width:56px; height:100%; background:#dfe5ef; float:left; }.dash-main { margin-left:75px; padding:25px 18px; }.dash-main i { display:block; height:8px; border-radius:10px; background:#b8c5d9; margin-bottom:15px; }.dash-main i:nth-child(2) { width:74%; }.dash-main i:nth-child(3) { width:44%; }.dash-main b { display:block; background:#4269a4; height:118px; margin-top:30px; border-radius:3px 3px 0 0; }
.flow { background:#fff6dd; }.flow i { position:absolute; width:35px; height:35px; border-radius:50%; border:3px solid #d8a12d; }.flow i:nth-child(1){left:35px;top:58px}.flow i:nth-child(2){right:38px;top:85px}.flow i:nth-child(3){left:75px;bottom:49px}.flow i:nth-child(4){right:68px;bottom:38px}.flow b { position:absolute; height:2px; background:#d8a12d; transform-origin:left; width:148px; left:64px; top:77px; transform:rotate(11deg); }.flow b:last-child { left:103px; top:222px; transform:rotate(-8deg); }
.chart { background:#fff6f2; display:flex; align-items:end; gap:13px; padding:34px 26px; }.chart i { flex:1; background:#db5d47; border-radius:5px 5px 0 0; }.chart i:nth-child(1){height:39%}.chart i:nth-child(2){height:62%}.chart i:nth-child(3){height:47%}.chart i:nth-child(4){height:82%}.chart i:nth-child(5){height:70%}.chart b { position:absolute; left:25px; right:25px; top:67px; border-top:3px solid #172235; transform:rotate(-20deg); }
.customer-grid { background:#e6f3f0; display:grid; grid-template-columns:1fr 1fr; gap:10px; padding:18px; }.customer-grid i { border-radius:6px; background:#8cc5bc; }.customer-grid i:nth-child(2) { background:#62a69b; }.customer-grid i:nth-child(3) { background:#bbdfd8; }.customer-grid i:nth-child(4) { background:#377f75; }.customer-grid b { position:absolute; width:60%; height:60%; left:20%; top:20%; border:2px solid #fff; border-radius:50%; }
.card-detail { position:absolute; left:0; right:0; bottom:0; padding:24px; color:#fff; background:linear-gradient(0deg,#101b2dec 0%,#101b2ec7 58%,transparent 100%); opacity:0; transform:translateY(12px); transition:opacity 180ms ease, transform 180ms ease; }.case-card:hover .card-detail,.case-card:focus-visible .card-detail,.case-card.is-open .card-detail { opacity:1; transform:translateY(0); }.card-index { font-size:10px; margin:0 0 7px; color:#c8d2de; }.card-detail h2 { margin:0; font-size:23px; letter-spacing:-.04em; }.card-detail > p:not(.card-index) { margin:8px 0 16px; font-size:13px; line-height:1.65; }.card-detail span { font-size:12px; border-bottom:1px solid #ffffffb2; padding-bottom:2px; }.card-detail b { margin-left:5px; }
.about { max-width:680px; margin:24px auto 130px; padding-top:40px; border-top:1px solid var(--line); }.about > p:last-child { margin:0; font-size:25px; line-height:1.7; letter-spacing:-.035em; } footer { border-top:1px solid var(--line); height:70px; color:#657084; font-size:10px; } footer a { font-size:12px; text-decoration:underline; text-underline-offset:4px; }
.case-page { background:#f6f7f8; }.case-main { width:min(940px, calc(100% - 48px)); margin:92px auto 130px; }.back-link { display:inline-block; font-size:13px; color:var(--muted); margin-bottom:66px; }.case-label { font:11px var(--font-sans); color:#687589; letter-spacing:.08em; margin:0 0 20px; }.case-main h1 { font-size:clamp(44px, 6vw, 74px); }.case-lead { max-width:650px; margin:25px 0 70px; color:#526073; font-size:18px; line-height:1.75; }.case-hero { min-height:430px; border-radius:16px; margin-bottom:75px; }.video-showcase { margin-bottom:75px; overflow:hidden; border-radius:16px; background:#d8a12d; }.case-video { display:block; width:100%; aspect-ratio:16 / 9; background:#172235; object-fit:cover; }.case-content { display:grid; grid-template-columns:180px 1fr; gap:30px; padding:34px 0; border-top:1px solid var(--line); }.case-content h2 { margin:0; font-size:14px; }.case-content p,.case-content li { color:#536073; font-size:15px; line-height:1.9; }.case-content p { margin:0; }.case-content ul { margin:0; padding-left:20px; }.case-result { color:var(--ink) !important; font-size:22px !important; font-weight:600; letter-spacing:-.03em; }.diagnostic-hero { aspect-ratio:16 / 9; min-height:0; overflow:hidden; border:1px solid #0c718d; border-radius:16px; color:#e5fbff; background:radial-gradient(circle at 38% 42%,#12364c 0,#05131d 38%,#03070b 100%); box-shadow:0 18px 40px #03192338; }.diagnostic-topbar { height:44px; padding:0 18px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #1b7591; color:#c7f7ff; font:600 10px var(--font-sans); letter-spacing:.14em; }.live-dot { display:inline-block; width:7px; height:7px; margin-right:5px; border-radius:50%; background:#1ce6b8; box-shadow:0 0 0 0 #1ce6b87a; animation:statusPulse 1.8s infinite; }.diagnostic-main { height:calc(100% - 44px); display:grid; grid-template-columns:41% 59%; }.machine-zone { position:relative; overflow:hidden; border-right:1px solid #15506a; background:linear-gradient(130deg,#101f2a 0%,#061018 100%); }.machine-rotation { width:100%; height:100%; display:block; object-fit:cover; opacity:.95; }.device-info-card,.health-summary { position:absolute; left:14px; width:46%; padding:11px 12px; border:1px solid #1686a6; background:#07131dd9; box-shadow:0 8px 20px #0006; }.device-info-card { top:14px; }.health-summary { bottom:14px; }.device-info-card p,.health-summary p { margin:0 0 8px; color:#d8faff; font-size:10px; font-weight:600; }.device-info-card dl { margin:0; }.device-info-card dl div { display:flex; justify-content:space-between; gap:8px; padding:4px 0; font-size:9px; }.device-info-card dt { color:#8faebb; }.device-info-card dd { margin:0; color:#e5fbff; text-align:right; }.device-info-card dd b { color:#f4c84b; }.health-summary span { display:block; margin:4px 0; font-size:8px; }.health-good { color:#22dda2; }.health-watch { color:#f5c75e; }.health-alert { color:#ff615e; }.analytics-zone { display:grid; grid-template-rows:auto auto 1fr; gap:9px; padding:12px; min-width:0; }.metric-strip,.scatter-row { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }.metric-strip > div,.scatter-panel,.trend-panel { border:1px solid #0a5a73; background:#07131ebf; }.metric-strip > div { padding:9px; }.metric-strip span { display:block; color:#85a9b7; font-size:8px; }.metric-strip strong { margin-top:4px; color:#6ee9ff; font:600 clamp(16px,2vw,25px) var(--font-sans); letter-spacing:-.04em; }.metric-strip strong.warning { color:#ffc94c; }.metric-strip em { margin-left:3px; color:#91aeba; font-size:8px; font-style:normal; }.scatter-panel { padding:6px; }.scatter-panel b { color:#c5f4fa; font-size:8px; }.scatter-canvas { position:relative; height:62px; margin-top:5px; overflow:hidden; background-image:linear-gradient(#18516666 1px,transparent 1px),linear-gradient(90deg,#18516666 1px,transparent 1px); background-size:25% 33%; }.scatter-canvas i { position:absolute; width:5px; height:5px; border-radius:50%; background:#10c9ed; box-shadow:0 0 7px #10c9ed; animation:dotPulse 2.4s infinite alternate; }.scatter-canvas i:nth-child(1){left:18%;top:42%}.scatter-canvas i:nth-child(2){left:45%;top:22%;background:#ff5353;animation-delay:-1s}.scatter-canvas i:nth-child(3){left:70%;top:56%;background:#ffc94c;animation-delay:-.4s}.scatter-canvas i:nth-child(4){left:83%;top:31%;animation-delay:-1.5s}.scatter-canvas i:nth-child(5){left:32%;top:74%;background:#ff5353;animation-delay:-.7s}.scatter-canvas.alt i:nth-child(1){left:12%;top:25%}.scatter-canvas.alt i:nth-child(2){left:63%;top:38%}.scatter-canvas.alt i:nth-child(3){left:44%;top:70%}.scatter-canvas.warm i:nth-child(1){left:25%;top:64%}.scatter-canvas.warm i:nth-child(2){left:72%;top:18%}.scatter-canvas.warm i:nth-child(3){left:51%;top:42%}.trend-panel { position:relative; min-height:0; padding:9px; overflow:hidden; }.trend-heading { display:flex; justify-content:space-between; color:#c5f4fa; font-size:9px; }.trend-heading span { color:#52d4ef; }.trend-panel svg { width:100%; height:calc(100% - 18px); margin-top:4px; overflow:visible; }.grid-line { stroke:#236077; stroke-width:1; }.trend-line { fill:none; stroke:#16c2ed; stroke-width:2; stroke-dasharray:750; stroke-dashoffset:750; animation:traceDraw 3.4s ease-in-out infinite alternate; }.anomaly-dot { fill:#ffc94c; filter:drop-shadow(0 0 3px #ffc94c); animation:dotPulse 1.7s infinite alternate; }.anomaly-dot.delay { animation-delay:-.8s; }.trend-callout { position:absolute; left:39%; top:50%; padding:7px 9px; border-radius:3px; color:#5d4500; background:#fff8e6; font-size:8px; box-shadow:0 7px 16px #0008; }.trend-callout span { color:#6f6f6f; font-size:7px; }.design-showcase { padding:68px 0 74px; border-top:1px solid var(--line); }.showcase-heading { max-width:610px; }.showcase-heading .case-label { margin-bottom:14px; }.showcase-heading h2 { margin:0; font-size:clamp(26px, 3.3vw, 40px); line-height:1.35; letter-spacing:-.045em; }.design-tabs { display:flex; gap:8px; margin:32px 0 22px; overflow-x:auto; padding-bottom:2px; }.design-tab { appearance:none; flex:0 0 auto; border:1px solid #d7dde4; border-radius:999px; padding:10px 16px; color:#687589; background:#fff; font:500 14px var(--font-sans); cursor:pointer; transition:background-color 180ms ease,color 180ms ease,border-color 180ms ease; }.design-tab:hover,.design-tab:focus-visible { border-color:#172235; color:#172235; outline:none; }.design-tab:focus-visible { box-shadow:0 0 0 3px #1722352b; }.design-tab.is-active { border-color:#172235; color:#fff; background:#172235; }.design-stage { border:1px solid #dce1e6; border-radius:18px; overflow:hidden; background:#fff; }.design-image-frame { aspect-ratio:16 / 9; display:grid; place-items:center; padding:16px; background:#e8edf1; }.design-image { display:block; width:100%; height:100%; object-fit:contain; transition:opacity 180ms ease; }.design-image.is-fading { opacity:0; }.design-copy { display:grid; grid-template-columns:180px 1fr; gap:30px; padding:28px 32px 31px; }.design-copy .case-label { margin:3px 0 0; }.design-copy h3 { margin:0 0 8px; font-size:20px; letter-spacing:-.03em; }.design-copy > p:not(.case-label) { grid-column:2; margin:0; color:#536073; font-size:14px; line-height:1.8; }
@media (max-width:760px) { :root{--card-w:min(75vw, 300px)} .site-header,footer,.intro,.work,.case-main { width:calc(100% - 32px); }.site-header { height:68px; }.intro { margin-top:62px; }.work { margin-top:82px; }.section-heading { display:block; }.section-heading > p:last-child { margin-top:12px; line-height:1.6; }.case-deck { height:465px; margin-top:25px; }.case-card { height:370px; top:30px; }.card-1 {--x:-31vw;--r:-7deg}.card-2 {--x:-10vw;--r:-2deg}.card-3 {--x:10vw;--r:2deg}.card-4 {--x:31vw;--r:7deg}.card-visual { padding:17px; }.dashboard,.flow,.chart,.customer-grid { height:245px; left:16px;right:16px;bottom:16px; }.about { margin:0 16px 90px; }.about > p:last-child {font-size:20px}.case-main { margin-top:55px; }.case-content { grid-template-columns:1fr; gap:13px; }.case-hero { min-height:340px; }.diagnostic-hero { aspect-ratio:auto; min-height:710px; }.diagnostic-main { height:calc(100% - 44px); grid-template-columns:1fr; grid-template-rows:310px 1fr; }.machine-zone { border-right:0; border-bottom:1px solid #15506a; }.analytics-zone { padding:10px; }.device-info-card,.health-summary { width:44%; }.design-showcase { padding:52px 0 58px; }.design-image-frame { padding:8px; }.design-copy { grid-template-columns:1fr; gap:10px; padding:22px; }.design-copy .case-label { margin:0; }.design-copy > p:not(.case-label) { grid-column:auto; } }
@keyframes statusPulse { 70% { box-shadow:0 0 0 6px transparent; } 100% { box-shadow:0 0 0 0 transparent; } }
@keyframes dotPulse { to { transform:scale(1.65); opacity:.58; } }
@keyframes traceDraw { to { stroke-dashoffset:0; } }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { scroll-behavior:auto !important; transition-duration:.01ms !important; animation-duration:.01ms !important; } }

.diagnostic-v2 { --cyan:#16c8ee; --panel:#07131dd9; min-height:0; aspect-ratio:16 / 9; display:grid; grid-template-rows:9% 64% 27%; overflow:hidden; border:1px solid #126d87; border-radius:4px; color:#e6f8fc; background:radial-gradient(circle at 31% 42%,#24313a 0,#090e13 44%,#030507 100%); box-shadow:0 16px 38px #03192330; }
.diagnostic-v2 h2,.diagnostic-v2 h3,.diagnostic-v2 p { margin:0; font-family:var(--font-sans); }.diagnostic-v2-header { display:flex; align-items:center; justify-content:space-between; padding:0 18px; border-bottom:2px solid #152a36; background:#05080b; }.diagnostic-v2-header h2 { color:#f3f9fa; font-size:clamp(15px,2.4vw,28px); letter-spacing:-.035em; }.diagnostic-v2-header time { color:#b5dfff; font:600 clamp(7px,.85vw,11px) var(--font-sans); letter-spacing:.08em; }
.diagnostic-v2-main { display:grid; grid-template-columns:52% 48%; min-height:0; }.diagnostic-v2-machine { position:relative; overflow:hidden; border-right:1px solid #27424f; }.diagnostic-v2-rotation { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; opacity:.9; }.diagnostic-info-panel,.diagnostic-health-panel { position:absolute; left:14px; z-index:1; width:38%; padding:9px 11px; border:1px solid #0f9fc5; background:#07111bdc; box-shadow:0 8px 20px #0008; }.diagnostic-info-panel { top:14px; }.diagnostic-health-panel { bottom:12px; }.diagnostic-info-panel h3,.diagnostic-health-panel h3,.diagnostic-analysis-panel h3,.diagnostic-model-panel h3 { color:#e6f8fc; font-size:clamp(8px,1vw,12px); font-weight:600; }.diagnostic-info-panel h3 i,.diagnostic-health-panel h3 i,.diagnostic-analysis-panel h3 i,.diagnostic-model-panel h3 i { display:inline-block; width:8px; height:8px; margin-right:6px; border-radius:2px; background:var(--cyan); box-shadow:0 0 8px #16c8ee; }.diagnostic-info-panel dl { margin:8px 0 0; }.diagnostic-info-panel dl div { display:grid; grid-template-columns:1fr auto; gap:6px; padding:4px 0; font-size:clamp(6px,.72vw,9px); }.diagnostic-info-panel dt { color:#b7cbd2; }.diagnostic-info-panel dd { margin:0; color:#edf9fa; text-align:right; }.diagnostic-info-panel dd b { padding:2px 8px; border-radius:2px; color:#382a00; background:#f1ba00; }.diagnostic-health-panel p { margin-top:5px; font-size:clamp(6px,.7vw,9px); }.diagnostic-health-panel .health-good { color:#21e39d; }.diagnostic-health-panel .health-watch { color:#f7c94d; }.diagnostic-health-panel .health-alert { color:#ff5a57; }
.diagnostic-v2-analysis { display:grid; grid-template-rows:43% 57%; gap:12px; padding:12px; min-width:0; }.diagnostic-analysis-panel { position:relative; overflow:hidden; padding:9px 10px; border:1px solid #0c5b72; background:#040a0ed6; }.diagnostic-analysis-panel h3 { margin-bottom:8px; }.diagnostic-v2 .scatter-row { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }.diagnostic-v2 .scatter-panel { padding:0; border:0; background:transparent; }.diagnostic-v2 .scatter-panel b { color:#d8f7fa; font-size:clamp(6px,.72vw,9px); }.diagnostic-v2 .scatter-canvas { height:calc(100% - 15px); min-height:50px; margin-top:4px; background-size:25% 33%; }.diagnostic-v2 .scatter-canvas i,.diagnostic-v2 .anomaly-dot,.diagnostic-v2 .trend-line { animation:none; }.diagnostic-trend-panel { min-height:0; }.diagnostic-trend-heading { display:grid; grid-template-columns:1fr 66px 76px; gap:8px; align-items:center; }.diagnostic-trend-heading h3 { margin:0; }.diagnostic-trend-heading span { padding:5px 7px; border-radius:2px; color:#d7eef4; background:#0c2530; font-size:clamp(6px,.66vw,8px); }.diagnostic-trend-panel svg { width:100%; height:calc(100% - 27px); margin-top:5px; overflow:visible; }.diagnostic-v2 .grid-line { stroke:#16546a; }.diagnostic-v2 .trend-line { stroke:#1bc5ef; stroke-dasharray:none; stroke-dashoffset:0; }.diagnostic-v2 .anomaly-dot { fill:#f6cc4c; filter:none; }.diagnostic-v2 .trend-callout { left:38%; top:52%; padding:7px 9px; border-radius:2px; color:#795500; background:#fff8df; font-size:clamp(6px,.68vw,8px); box-shadow:0 5px 12px #0008; }.diagnostic-v2 .trend-callout span { color:#707070; font-size:clamp(5px,.56vw,7px); }
.diagnostic-model-panel { overflow:hidden; padding:9px 12px 12px; border-top:1px solid #0f7b98; background:linear-gradient(180deg,#0b1820 0%,#05090c 100%); }.diagnostic-model-panel h3 { margin-bottom:8px; }.diagnostic-table-wrap { overflow:hidden; border:1px solid #115368; }.diagnostic-model-panel table { width:100%; border-collapse:collapse; table-layout:fixed; color:#d2e2e5; font-size:clamp(5px,.57vw,7px); text-align:center; }.diagnostic-model-panel th { padding:6px 2px; color:#d8f6fa; background:#087297; font-weight:500; }.diagnostic-model-panel td { padding:5px 2px; border-top:1px solid #26363e; background:#15191d; }.diagnostic-model-panel tbody tr:nth-child(even) td { background:#202327; }
@media (max-width:760px) { .diagnostic-v2 { aspect-ratio:auto; min-height:750px; grid-template-rows:58px 470px 1fr; }.diagnostic-v2-main { grid-template-columns:1fr; grid-template-rows:230px 240px; }.diagnostic-v2-machine { border-right:0; border-bottom:1px solid #27424f; }.diagnostic-v2-analysis { gap:8px; padding:8px; }.diagnostic-info-panel,.diagnostic-health-panel { width:43%; }.diagnostic-model-panel { padding:8px; }.diagnostic-table-wrap { overflow-x:auto; }.diagnostic-model-panel table { min-width:670px; font-size:7px; }.diagnostic-model-panel th,.diagnostic-model-panel td { padding:6px 3px; } }

.diagnostic-v2 { border-color:#229db833; box-shadow:0 0 0 1px #54d8ed21,0 0 22px #1199bc30,inset 0 0 32px #18c9e30d; }
.diagnostic-v2-header h2 { font-size:clamp(13px,2.2vw,26px); }
.diagnostic-v2-rotation { object-fit:contain; object-position:center; }
.diagnostic-info-panel,.diagnostic-health-panel { border-color:#109dc3; background:linear-gradient(135deg,#0b1a25ee 0%,#061018df 100%); box-shadow:inset 0 0 20px #17c8ef0d,0 8px 20px #0006; }
.diagnostic-info-panel::before,.diagnostic-health-panel::before,.diagnostic-info-panel::after,.diagnostic-health-panel::after { content:""; position:absolute; width:17px; height:11px; pointer-events:none; }
.diagnostic-info-panel::before,.diagnostic-health-panel::before { top:-1px; left:-1px; border-top:2px solid #26cff2; border-left:2px solid #26cff2; }
.diagnostic-info-panel::after,.diagnostic-health-panel::after { right:-1px; bottom:-1px; border-right:2px solid #26cff2; border-bottom:2px solid #26cff2; }
.diagnostic-info-panel h3,.diagnostic-health-panel h3 { display:flex; align-items:center; gap:6px; }
.diagnostic-info-panel h3 i.v2-panel-icon,.diagnostic-health-panel h3 i.v2-panel-icon { width:18px; height:18px; margin:0; display:inline-grid; place-items:center; border-radius:2px; color:#fff; background:#04a9d4; box-shadow:0 0 10px #05bceb88; font:700 14px/1 Arial,sans-serif; }
.diagnostic-info-panel h3 i.v2-health-icon,.diagnostic-health-panel h3 i.v2-health-icon { background:#06bddd; font-size:16px; }

.diagnostic-info-panel,.diagnostic-health-panel { border-color:rgb(16 157 195 / 30%); }
.diagnostic-info-panel::before,.diagnostic-health-panel::before,.diagnostic-info-panel::after,.diagnostic-health-panel::after { opacity:.3; }
.diagnostic-v2 .scatter-canvas { height:76px; min-height:76px; padding:0 8px 11px 22px; background-image:linear-gradient(#18516699 1px,transparent 1px),linear-gradient(90deg,#18516699 1px,transparent 1px); background-position:22px 0,22px 0; background-size:calc((100% - 22px) / 4) 25%; }
.diagnostic-v2 .scatter-canvas .axis-y,.diagnostic-v2 .scatter-canvas .axis-x { position:absolute; color:#8ba6ae; font-size:5px; line-height:1; }.diagnostic-v2 .scatter-canvas .axis-y { left:1px; }.diagnostic-v2 .scatter-canvas .axis-1000 { top:1px; }.diagnostic-v2 .scatter-canvas .axis-0 { bottom:11px; }.diagnostic-v2 .scatter-canvas .axis-x { bottom:1px; }.diagnostic-v2 .scatter-canvas .axis-x0 { left:22px; }.diagnostic-v2 .scatter-canvas .axis-x5 { left:39%; }.diagnostic-v2 .scatter-canvas .axis-x10 { left:57%; }.diagnostic-v2 .scatter-canvas .axis-x15 { left:75%; }.diagnostic-v2 .scatter-canvas .axis-x20 { right:2px; }
.diagnostic-v2 .scatter-canvas i { width:4px; height:4px; animation:none; box-shadow:none; }.diagnostic-v2 .scatter-canvas i:nth-of-type(1){left:29%;top:23%;background:#1cc8ef}.diagnostic-v2 .scatter-canvas i:nth-of-type(2){left:41%;top:61%;background:#ff4d4d}.diagnostic-v2 .scatter-canvas i:nth-of-type(3){left:47%;top:38%;background:#f4c447}.diagnostic-v2 .scatter-canvas i:nth-of-type(4){left:58%;top:18%;background:#ff4d4d}.diagnostic-v2 .scatter-canvas i:nth-of-type(5){left:62%;top:54%;background:#1cc8ef}.diagnostic-v2 .scatter-canvas i:nth-of-type(6){left:69%;top:31%;background:#f4c447}.diagnostic-v2 .scatter-canvas i:nth-of-type(7){left:75%;top:65%;background:#ff4d4d}.diagnostic-v2 .scatter-canvas i:nth-of-type(8){left:80%;top:42%;background:#1cc8ef}.diagnostic-v2 .scatter-canvas i:nth-of-type(9){left:85%;top:19%;background:#f4c447}.diagnostic-v2 .scatter-canvas i:nth-of-type(10){left:89%;top:58%;background:#ff4d4d}.diagnostic-v2 .scatter-canvas i:nth-of-type(11){left:35%;top:45%;background:#f4c447}.diagnostic-v2 .scatter-canvas i:nth-of-type(12){left:92%;top:32%;background:#1cc8ef}
.diagnostic-v2 .scatter-canvas.alt i:nth-of-type(1){left:25%;top:59%}.diagnostic-v2 .scatter-canvas.alt i:nth-of-type(2){left:38%;top:30%}.diagnostic-v2 .scatter-canvas.alt i:nth-of-type(3){left:53%;top:66%}.diagnostic-v2 .scatter-canvas.alt i:nth-of-type(4){left:60%;top:21%}.diagnostic-v2 .scatter-canvas.alt i:nth-of-type(5){left:67%;top:45%}.diagnostic-v2 .scatter-canvas.warm i:nth-of-type(1){left:31%;top:43%}.diagnostic-v2 .scatter-canvas.warm i:nth-of-type(2){left:43%;top:22%}.diagnostic-v2 .scatter-canvas.warm i:nth-of-type(3){left:56%;top:54%}.diagnostic-v2 .scatter-canvas.warm i:nth-of-type(4){left:64%;top:33%}.diagnostic-v2 .scatter-canvas.warm i:nth-of-type(5){left:72%;top:70%}
.diagnostic-v2 .trend-axis text { fill:#819da6; font:5px var(--font-sans); }.diagnostic-v2 .trend-panel svg { overflow:visible; }

/* 设备诊断看板：按原始大屏保留轻边框与固定坐标，动效仅用于数据流动。 */
.diagnostic-v2-machine { border-right:0; }
.diagnostic-v2-header { position:relative; border-bottom:1px solid rgb(34 157 184 / 18%); }
.diagnostic-v2-header::before { content:""; position:absolute; bottom:-2px; left:9px; width:34px; height:3px; background:#eef6f7; box-shadow:42px 0 0 -1px #159fc2; }
.diagnostic-v2-header::after { content:""; position:absolute; bottom:-2px; left:75px; width:235px; height:3px; background:linear-gradient(90deg,#12c9ed 0 2px,transparent 2px 88px,#12c9ed 88px 91px,transparent 91px 100%); opacity:.8; }
.diagnostic-analysis-panel { border-color:rgb(22 150 181 / 30%); box-shadow:inset 0 0 22px rgb(15 156 192 / 4%); }
.diagnostic-analysis-panel::before,.diagnostic-analysis-panel::after { content:""; position:absolute; top:-1px; width:16px; height:12px; border-top:2px solid rgb(31 195 230 / 70%); pointer-events:none; }
.diagnostic-analysis-panel::before { left:-1px; border-left:2px solid rgb(31 195 230 / 70%); }
.diagnostic-analysis-panel::after { right:-1px; border-right:2px solid rgb(31 195 230 / 70%); }
.diagnostic-model-panel { border-top-color:rgb(19 164 199 / 30%); }
.diagnostic-table-wrap { border-color:rgb(23 150 183 / 45%); }
.diagnostic-v2 .scatter-canvas::after { content:""; position:absolute; inset:0 2px 11px 22px; pointer-events:none; background:radial-gradient(circle at 9% 69%,#f4c447 0 1.7px,transparent 2.2px),radial-gradient(circle at 17% 37%,#1cc8ef 0 1.7px,transparent 2.2px),radial-gradient(circle at 23% 54%,#ff4d4d 0 1.7px,transparent 2.2px),radial-gradient(circle at 34% 17%,#f4c447 0 1.7px,transparent 2.2px),radial-gradient(circle at 52% 76%,#1cc8ef 0 1.7px,transparent 2.2px),radial-gradient(circle at 66% 12%,#ff4d4d 0 1.7px,transparent 2.2px),radial-gradient(circle at 73% 48%,#f4c447 0 1.7px,transparent 2.2px),radial-gradient(circle at 96% 72%,#1cc8ef 0 1.7px,transparent 2.2px); }
.diagnostic-v2 .scatter-canvas.alt::after { background:radial-gradient(circle at 8% 25%,#1cc8ef 0 1.7px,transparent 2.2px),radial-gradient(circle at 18% 66%,#ff4d4d 0 1.7px,transparent 2.2px),radial-gradient(circle at 29% 12%,#f4c447 0 1.7px,transparent 2.2px),radial-gradient(circle at 46% 49%,#1cc8ef 0 1.7px,transparent 2.2px),radial-gradient(circle at 56% 27%,#ff4d4d 0 1.7px,transparent 2.2px),radial-gradient(circle at 72% 71%,#f4c447 0 1.7px,transparent 2.2px),radial-gradient(circle at 84% 39%,#1cc8ef 0 1.7px,transparent 2.2px),radial-gradient(circle at 95% 17%,#ff4d4d 0 1.7px,transparent 2.2px); }
.diagnostic-v2 .scatter-canvas.warm::after { background:radial-gradient(circle at 9% 47%,#f4c447 0 1.7px,transparent 2.2px),radial-gradient(circle at 19% 73%,#1cc8ef 0 1.7px,transparent 2.2px),radial-gradient(circle at 32% 19%,#ff4d4d 0 1.7px,transparent 2.2px),radial-gradient(circle at 47% 65%,#f4c447 0 1.7px,transparent 2.2px),radial-gradient(circle at 59% 14%,#1cc8ef 0 1.7px,transparent 2.2px),radial-gradient(circle at 76% 52%,#ff4d4d 0 1.7px,transparent 2.2px),radial-gradient(circle at 87% 28%,#f4c447 0 1.7px,transparent 2.2px),radial-gradient(circle at 97% 68%,#1cc8ef 0 1.7px,transparent 2.2px); }
.diagnostic-v2 .trend-axis text { font-size:5px; }
.diagnostic-v2 .trend-wave { transform-box:fill-box; transform-origin:center; }
.diagnostic-v2 .diagnostic-v2-machine { border-right:0 !important; }
.diagnostic-v2-header h2 { font-size:clamp(11px,2vw,24px); }
.design-image-frame { overflow:hidden; transition:opacity 180ms ease; }
.design-image-frame.is-fading { opacity:0; }
.workflow-carousel { position:relative; width:100%; height:100%; }
.workflow-carousel .workflow-image { display:block; width:100%; height:100%; object-fit:contain; }
.workflow-nav { box-sizing:border-box; display:grid; place-items:center; position:absolute; z-index:2; top:50%; width:38px; height:38px; padding:0; border:1px solid #cfd8e3; border-radius:50%; color:#172235; background:#fffffff0; font-size:0; box-shadow:0 5px 15px #15223524; cursor:pointer; transform:translateY(-50%); transition:opacity 160ms ease,transform 160ms ease; }
.workflow-nav::before { content:"‹"; font:30px/1 Arial,sans-serif; transform:translateY(-2px); }.workflow-next::before { content:"›"; }
.card-cover { padding:0; background:#172235; }.card-cover::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,#0c17262e 0%,#101b2d22 48%,#101b2dda 100%); pointer-events:none; }.card-cover img { display:block; width:100%; height:100%; object-fit:cover; }.card-cover .visual-kicker { position:absolute; z-index:1; top:23px; left:23px; padding:6px 8px; border:1px solid #ffffff3d; border-radius:999px; color:#fff; background:#111b2a82; font-size:10px; text-shadow:0 1px 7px #0009; }.card-darl img { object-position:60% center; }.card-epms img { object-position:53% center; }.card-ai img { object-position:66% center; }.k1-card-cover .visual-kicker { top:23px; left:23px; }
.wordmark { display:inline-flex; align-items:center; }.txin-logo { display:block; width:82px; height:auto; mix-blend-mode:multiply; }
#page-title { letter-spacing:-.035em; }
.back-link { font-size:15px; }
#page-title.is-typing span:last-child::after { content:""; display:inline-block; width:.065em; height:.8em; margin-left:.08em; background:currentColor; vertical-align:-.04em; animation:titleCaret .7s steps(1) infinite; }
@keyframes titleCaret { 50% { opacity:0; } }
.design-copy { row-gap:16px; }
.back-link { animation:backLinkHint 1.15s ease-in-out .7s 2; transition:transform 180ms ease,color 180ms ease; }
.back-link:hover,.back-link:focus-visible { color:var(--ink); outline:none; transform:translateX(-4px); }
@keyframes backLinkHint { 0%,100% { transform:translateX(0); } 38% { transform:translateX(-4px); } 68% { transform:translateX(1px); } }
@media (prefers-reduced-motion: reduce) { .back-link { animation:none; } }
.darl-gallery { margin:0 0 75px; }.darl-gallery-frame { position:relative; aspect-ratio:16 / 9; overflow:hidden; border-radius:16px; background:#101b2d; box-shadow:0 14px 30px #1520341c; }.darl-gallery-image { display:block; width:100%; height:100%; object-fit:cover; transition:opacity 180ms ease; }.darl-gallery-image.is-fading { opacity:0; }.darl-gallery-nav { position:absolute; top:50%; z-index:1; width:42px; height:42px; padding:0 0 2px; border:1px solid #ffffff73; border-radius:50%; color:#fff; background:#101b2da6; font:32px/1 Arial,sans-serif; cursor:pointer; transform:translateY(-50%); transition:background-color 180ms ease,opacity 180ms ease; }.darl-gallery-nav:hover:not(:disabled),.darl-gallery-nav:focus-visible { background:#101b2de0; outline:none; }.darl-gallery-nav:disabled { opacity:.28; cursor:default; }.darl-gallery-prev { left:18px; }.darl-gallery-next { right:18px; }.darl-gallery-count { position:absolute; right:20px; bottom:18px; margin:0; padding:5px 8px; border-radius:999px; color:#fff; background:#101b2da8; font-size:11px; letter-spacing:.08em; }
.workflow-nav:hover:not(:disabled),.workflow-nav:focus-visible { transform:translateY(-50%) scale(1.06); outline:none; }
.workflow-nav:disabled { opacity:.35; cursor:default; }
.workflow-prev { left:18px; }.workflow-next { right:18px; }
.diagnostic-v2 .scatter-row { align-items:start; transform:translateY(-6px); }
.diagnostic-v2 .scatter-canvas { height:68px; min-height:68px; }
.diagnostic-v2 .scatter-canvas::before { content:""; position:absolute; inset:0 2px 11px 22px; z-index:1; pointer-events:none; background:radial-gradient(circle at 5% 45%,#1cc8ef 0 1.5px,transparent 2px),radial-gradient(circle at 13% 16%,#ff4d4d 0 1.5px,transparent 2px),radial-gradient(circle at 21% 82%,#f4c447 0 1.5px,transparent 2px),radial-gradient(circle at 38% 55%,#1cc8ef 0 1.5px,transparent 2px),radial-gradient(circle at 44% 29%,#ff4d4d 0 1.5px,transparent 2px),radial-gradient(circle at 57% 43%,#f4c447 0 1.5px,transparent 2px),radial-gradient(circle at 69% 79%,#1cc8ef 0 1.5px,transparent 2px),radial-gradient(circle at 78% 9%,#ff4d4d 0 1.5px,transparent 2px),radial-gradient(circle at 89% 51%,#f4c447 0 1.5px,transparent 2px),radial-gradient(circle at 98% 35%,#1cc8ef 0 1.5px,transparent 2px); }
.diagnostic-v2 .scatter-canvas::after { z-index:1; }
.diagnostic-v2 .scatter-canvas i { z-index:2; }
.diagnostic-v2 .scatter-canvas .axis-y,.diagnostic-v2 .scatter-canvas .axis-x { z-index:3; }
.diagnostic-v2 .diagnostic-trend-panel svg { overflow:hidden; }
