:root{--container: 1200px;--gutter-desktop: 24px;--gutter-mobile: 16px;--bg:#0b0f0c;--panel:#111512;--edge:#1a201b;--text:#eaf3ed;--muted:#a8b8ad;--accent:#39d26b;--accent-2:#2a6a44;--ring:rgba(57,210,107,.35);--shadow:0 10px 30px rgba(0,0,0,.35);--card-radius:16px;--pod-radius:14px;--hero-max-width: 620px;--hero-pad: 12px;--module-gap: 12px;--module-pad: 28px;--pod-media-ratio: 4/3}:root[data-theme=light]{--bg:#f8fbf8;--panel:#ffffff;--edge:#e4efe7;--text:#0b120d;--muted:#62756a;--accent:#2fb861;--accent-2:#7de7a9;--ring:rgba(47,184,97,.28);--shadow:0 10px 28px rgba(24,60,38,.08)}@media (prefers-color-scheme: light){:root:not([data-theme=dark]){color-scheme:light}}@media (prefers-color-scheme: dark){:root:not([data-theme=light]){color-scheme:dark}}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Arial,sans-serif;color:var(--text);background:radial-gradient(1200px 700px at 70% -10%,rgba(57,210,107,.12),transparent 60%),radial-gradient(900px 600px at -20% 30%,rgba(159,242,193,.12),transparent 60%),var(--bg);overflow-x:hidden}a{color:inherit;text-decoration:none}img{image-rendering:auto}.skip{position:absolute;left:-9999px}.skip:focus{left:12px;top:12px;background:var(--panel);padding:8px 12px;border-radius:8px;border:1px solid var(--edge)}:where(a,button,.button,select,.toggle):focus-visible{outline:2px solid var(--accent);outline-offset:2px;box-shadow:0 0 0 4px var(--ring);border-radius:12px}.bi-title .zh{font-weight:700;margin-right:6px}.bi-title .en{font-weight:500;color:var(--muted);font-size:13px}.bi-desc{margin-top:4px;display:flex;flex-direction:column;gap:2px}.bi-desc .zh{color:var(--text);font-size:13px}.bi-desc .en{color:var(--muted);font-size:12px}.container{max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter-desktop)}.section{padding:72px 0}.section-title{margin:0 0 10px;font-size:28px}.section-sub{margin:0 0 24px;color:var(--muted)}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.app{position:relative;isolation:isolate}.bg-aura{position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(1200px 1200px at 50% -20%,rgba(57,210,107,.08),transparent 60%);filter:saturate(110%)}header.site-header{position:sticky;top:0;z-index:10;background:linear-gradient(to bottom,color-mix(in oklab,var(--bg),transparent 90%),transparent);border-bottom:1 solid color-mix(in oklab,var(--edge),transparent 70%);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.nav{display:flex;align-items:center;justify-content:space-between;padding:14px 0;gap:12px}.brand{display:flex;align-items:center;gap:12px}.brand span{font-weight:700;letter-spacing:.5px}.links a{color:var(--muted);margin:0 8px;font-size:14px}.links a:hover{color:var(--text)}.nav-chunks{display:flex;flex-wrap:wrap;gap:.5rem}.nav-chunks .chunk{display:inline-block;white-space:nowrap}.hex-logo{flex:0 0 auto;width:60px;height:60px;background:#fff;-webkit-clip-path:polygon(25% 6.7%,75% 6.7%,100% 50%,75% 93.3%,25% 93.3%,0 50%);clip-path:polygon(25% 6.7%,75% 6.7%,100% 50%,75% 93.3%,25% 93.3%,0 50%);display:flex;align-items:center;justify-content:center;padding:5px}.hex-logo img{width:100%;height:100%;object-fit:contain}.controls{display:flex;gap:8px;align-items:center}select,.button,.toggle{border:1px solid var(--edge);background:var(--panel);color:var(--text);padding:10px 12px;border-radius:12px;font-weight:600}@supports (color: color-mix(in oklab,white,black)){select,.button,.toggle{border:1px solid color-mix(in oklab,var(--edge),transparent 40%)}}.button{appearance:none;padding:12px 18px;border-radius:12px;border:1px solid var(--edge);cursor:pointer;will-change:transform}@supports (color: color-mix(in oklab,white,black)){.button{border:1px solid color-mix(in oklab,var(--edge),transparent 35%)}}.button.primary{background:linear-gradient(180deg,var(--accent),color-mix(in oklab,var(--accent),black 12%));color:#061209;border:none;box-shadow:0 6px 18px var(--ring)}.button.ghost{background:transparent;color:var(--text)}.button:hover{transform:translateY(-1px)}.toggle{cursor:pointer;background:linear-gradient(180deg,var(--accent),color-mix(in oklab,var(--accent),black 12%));color:#061209;border:none;box-shadow:0 6px 18px var(--ring)}.hero{scroll-margin-top:80px;display:grid;grid-template-columns:1.1fr .9fr;gap:20px;align-items:center;padding:10px 0 80px}.tag{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;border:1px solid var(--edge);color:var(--accent-2);background:color-mix(in oklab,var(--accent),transparent 85%);font-size:12px;letter-spacing:.6px;text-transform:uppercase}@supports (color: color-mix(in oklab,white,black)){.tag{border:1px solid color-mix(in oklab,var(--edge),transparent 30%)}}.hero h1{font-size:45px;line-height:1.08;margin:10px 0}、 .hero p{color:var(--muted);margin:12px 0 22px}.hero-visual{position:relative;border-radius:20px;max-width:var(--hero-max-width);background:linear-gradient(160deg,color-mix(in oklab,var(--panel),black 6%),var(--panel));border:1px solid var(--edge);box-shadow:var(--shadow);padding:var(--hero-pad);overflow:visible;will-change:transform}.hero-visual .glow{position:absolute;inset:0;background:radial-gradient(500px 280px at 70% 10%,color-mix(in oklab,var(--accent),transparent 78%),transparent 50%),radial-gradient(400px 300px at 30% 90%,color-mix(in oklab,var(--accent-2),transparent 78%),transparent 60%);filter:blur(10px);pointer-events:none}.mesh{position:absolute;inset:0;background:linear-gradient(transparent 49%,color-mix(in oklab,white,transparent 94%) 50%,transparent 51%) 0 0/100% 28px,linear-gradient(90deg,transparent 49%,color-mix(in oklab,white,transparent 94%) 50%,transparent 51%) 0 0/28px 100%;opacity:.35;pointer-events:none}.module{position:relative;inset:auto;border-radius:14px;border:1px solid color-mix(in oklab,white,transparent 92%);background:linear-gradient(180deg,color-mix(in oklab,var(--panel),black 4%),color-mix(in oklab,var(--panel),black 8%));display:grid;grid-template-columns:1fr;gap:var(--module-gap);padding:var(--module-pad)}.pod-tabs{position:absolute;top:10px;left:12px;display:flex;gap:8px;z-index:2}.pod-tab{appearance:none;cursor:pointer;font-weight:700;width:42px;border:1px solid var(--edge);background:var(--panel);color:var(--text);padding:6px 10px;border-radius:10px}.form .label{display:block;font-weight:700;margin-bottom:6px}.form .input{width:100%;padding:10px 12px;border-radius:10px;border:1px solid var(--edge);background:var(--panel);color:var(--text)}.form textarea.input{resize:vertical}.error{color:#ff7a7a;margin-top:6px;font-size:13px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}@media (max-width: 800px){.grid2{grid-template-columns:1fr}}.quote-a4{padding:24px;background:#fff;color:#111;position:relative}.letterhead{display:grid;grid-template-columns:150px 1fr auto;align-items:center;gap:12px}.letterhead .lh-left img{max-height:72px;max-width:150px;object-fit:contain}.letterhead .company-name{font-size:20px;font-weight:800;margin-bottom:4px}.letterhead .company-info{font-size:12px;color:#555}.letterhead .lh-right{text-align:right;font-size:12px;color:#333}@media print{header.site-header,.button,.nav,.cta,.hero,.bg-aura,.preview-toolbar{display:none!important}.container{padding:0!important}section.container{margin:0!important}.quote-a4{page-break-inside:avoid;break-inside:avoid-page;box-shadow:none;border:none;margin:0!important;padding:12mm;break-before:auto;page-break-before:auto}@page{size:A4;margin:12mm}}.top-grid{display:grid;grid-template-columns:1fr 200px;gap:12px;align-items:start}.product-hero{text-align:center}.product-hero img{width:100%;height:120px;object-fit:contain;border:1px solid #e3e3e3;border-radius:8px;background:#fafafa}.product-hero .ph-caption{font-size:12px;color:#444;margin-top:6px}@media print{.top-grid{grid-template-columns:1fr 40mm;gap:6mm}.product-hero img{height:28mm}}.quote-terms{font-size:12px;line-height:1.35;color:#333}.quote-terms ol{margin-top:6px;padding-left:16px}.quote-terms li{margin:0 0 2px}@media print{.quote-terms{font-size:11px;line-height:1.32}}@supports (color: color-mix(in oklab,white,black)){.pod-tab{border:1px solid color-mix(in oklab,var(--edge),transparent 35%)}}.pod-tab.active{background:linear-gradient(180deg,var(--accent),color-mix(in oklab,var(--accent),black 12%));color:#061209;border:none;box-shadow:0 4px 12px var(--ring)}.pod-arw{position:absolute;top:50%;transform:translateY(-50%);z-index:2}.pod-arw.left{left:10px}.pod-arw.right{right:10px}.pod-dots{position:absolute;bottom:10px;left:50%;transform:translate(-50%);display:flex;gap:6px;z-index:2}.dot{width:6px;height:6px;border-radius:50%;background:color-mix(in oklab,var(--text),transparent 70%)}.dot.on{background:var(--accent)}.pod-card{border-radius:var(--pod-radius);border:1px solid var(--edge);background:transparent;box-shadow:var(--shadow);padding:0;transition:transform .15s ease,box-shadow .2s ease,filter .2s ease;animation:floatY 6s ease-in-out infinite;will-change:transform}@supports (color: color-mix(in oklab,white,black)){.pod-card{border:1px solid color-mix(in oklab,var(--edge),transparent 20%)}}.pod-card:hover{transform:translateY(-2px)}.pod-media{position:relative;overflow:hidden;border-radius:10px;aspect-ratio:var(--pod-media-ratio);border:1px solid var(--edge);background:transparent;min-height:20px}@supports (color: color-mix(in oklab,white,black)){.pod-media{border:1px solid color-mix(in oklab,var(--edge),transparent 10%)}}.zoom-wrap{position:relative;width:100%;height:100%;overflow:hidden;border-radius:10px;display:flex;align-items:center;justify-content:center}.zoom-wrap img{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;display:block;transform:translate(var(--panX,0),var(--panY,0)) scale(1);transition:transform .18s ease;cursor:pointer;filter:drop-shadow(0 10px 24px rgba(0,0,0,.25))}.zoom-wrap.zoomed img{transform:translate(var(--panX,0),var(--panY,0)) scale(1.8);cursor:grabbing}.pod-title{position:absolute;left:35px;bottom:8px;background:green;border:none;-webkit-backdrop-filter:none;backdrop-filter:none;font-weight:200;letter-spacing:.5px;font-size:15px;padding:2px 6px;border-radius:6px;transition:color .3s ease,text-shadow .3s ease}:root .pod-title{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.7)}:root[data-theme=light] .pod-title{color:#0b120d;text-shadow:0 1px 1px rgba(255,255,255,.9),0 0 1px rgba(255,255,255,.4)}.pod-title .zh{font-weight:800;margin-right:6px}.pod-title .en{font-weight:600;opacity:.9}.pod-badges{position:absolute;right:15px;top:35px;display:flex;gap:6px;flex-wrap:wrap}.pod-badges span{font-size:15px;padding:6px 18px;border-radius:999px;background:transparent;border:1px solid rgba(36,216,135,.816);color:var(--accent-2)}.pod-badges span+span:before{content:"•";margin-right:6px;opacity:.6}.pod-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px;list-style:none;margin:10px 0 0;padding:0}.pod-stats li{font-size:12px;padding:8px;border-radius:8px;background:linear-gradient(180deg,#ffffff0a,#0000000d);border:1px solid rgba(255,255,255,.08);color:var(--muted)}.pod-stats li strong{display:block;color:var(--text);font-size:12px}.pod-stat-item{display:flex;align-items:center;justify-content:space-between;gap:8px}.pod-stat-text{display:flex;flex-direction:column;gap:2px}.pod-stat-text strong{color:var(--text);font-size:12px}.sparkline{width:150px;height:28px}.pod-chart{width:100%;height:140px;margin-top:10px}.stats{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}.stat{padding:18px;border-radius:var(--card-radius);background:linear-gradient(180deg,color-mix(in oklab,white,transparent 96%),color-mix(in oklab,black,transparent 94%));border:1px solid var(--edge);box-shadow:var(--shadow)}@supports (color: color-mix(in oklab,white,black)){.stat{border:1px solid color-mix(in oklab,var(--edge),transparent 20%)}}.stat h3{margin:2px 0 6px;font-size:32px;color:var(--accent)}.stat p{margin:0;color:var(--muted);font-size:14px}.title-with-icon{display:inline-flex;align-items:center;gap:16px}.card{padding:18px;border-radius:var(--card-radius);background:linear-gradient(180deg,color-mix(in oklab,white,transparent 96%),color-mix(in oklab,black,transparent 94%));border:1px solid var(--edge);box-shadow:var(--shadow);position:relative;overflow:hidden}@supports (color: color-mix(in oklab,white,black)){.card{border:1px solid color-mix(in oklab,var(--edge),transparent 20%)}}.card .corner{position:absolute;inset:auto 12px 12px auto;width:80px;height:80px;border-radius:12px;background:radial-gradient(120px 120px at 50% 50%,color-mix(in oklab,var(--accent),transparent 80%),transparent 70%);filter:blur(6px)}.card h4{margin:0 0 8px}.card p{margin:0;color:var(--muted);font-size:14px}.tech-item{scroll-margin-top:80px;padding:18px;border-radius:12px;border:1px dashed color-mix(in oklab,var(--edge),transparent 10%);display:flex;flex-direction:column;align-items:flex-start;text-align:left}.tech-item .title-with-icon{display:inline-flex;align-items:center;gap:8px}.tech-item strong{display:block;color:var(--text);margin-bottom:4px}.tech-item span{color:var(--muted);font-size:12px}@keyframes floatY{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes fadeSwap{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}.fade-swap{animation:fadeSwap .6s ease both}@media (prefers-reduced-motion: reduce){.pod-card,.fade-swap{animation:none}}footer{border-top:1px solid var(--edge);padding:32px 0;color:var(--muted)}@supports (color: color-mix(in oklab,white,black)){footer{border-top:1px solid color-mix(in oklab,var(--edge),transparent 20%)}}@supports not (color: color-mix(in oklab,white,black)){.button{border:1px solid var(--edge)}}footer .container{max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter-desktop)}@media (max-width: 980px){.container{padding-inline:var(--gutter-mobile)}.hero{grid-template-columns:1fr;gap:24px}.grid{grid-template-columns:repeat(2,1fr)}.stats{grid-template-columns:1fr 1fr}.hero h1{font-size:38px}.hex-logo{width:64px;height:64px;padding:8px}:root{--hero-max-width: 100% }}@media (max-width: 640px){.sparkline{width:56px;height:26px}.container{padding-inline:var(--gutter-mobile)}.grid,.stats{grid-template-columns:1fr}.hero h1{font-size:34px}.hero{display:flex;flex-direction:column}.hex-logo{width:56px;height:56px;padding:8px}}
