:root{--navy:#0b2855;--blue:#1378f5;--muted:#6c829d}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#eaf2fb;color:var(--navy);font-family:Inter,-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif}.app{max-width:480px;margin:auto;min-height:100vh;background:linear-gradient(160deg,#e9f5ff 0,#f8fbff 360px,#f3f8fe 100%);padding-bottom:90px;box-shadow:0 0 60px #b9cde449}.header{height:80px;display:flex;align-items:center;justify-content:space-between;padding:12px 20px}.brand{display:flex;align-items:center;gap:8px;text-decoration:none;color:#0c316c}.brandmark{width:45px;height:45px;color:#167df1;background:linear-gradient(135deg,#fff,#d0ecff);border-radius:15px;display:grid;place-items:center;box-shadow:0 7px 16px #3489dc24}.brandmark svg{width:36px}.brand b{display:block;font-size:22px;letter-spacing:1px}.brand small{font-size:8px;letter-spacing:1.4px;font-weight:700;color:#4e80b8}.notify{border:1px solid #e1ecf9;background:#ffffffa8;border-radius:50%;width:43px;height:43px;display:grid;place-items:center;position:relative;color:#143966}.notify svg{width:23px}.notify i{position:absolute;width:8px;height:8px;border-radius:50%;background:#ff6372;right:9px;top:7px}.hero{margin:0 15px;border-radius:21px;overflow:hidden;position:relative;box-shadow:0 15px 32px #1478e71c}.slides{position:relative;height:240px}.slide{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity .55s;background:radial-gradient(circle at 77% 34%,#60b6ff 0,#1769d4 34%,#083778 72%,#061f49 100%);overflow:hidden}.slide.active{opacity:1;pointer-events:auto}.slide:before{content:"";position:absolute;inset:0;background-image:linear-gradient(#ffffff12 1px,transparent 1px),linear-gradient(90deg,#ffffff12 1px,transparent 1px);background-size:25px 25px;transform:perspective(150px) rotateX(12deg) scale(1.4);opacity:.3}.hero-copy{position:relative;z-index:3;padding:30px 0 0 23px;color:white;width:75%}.eyebrow{font-size:9px;letter-spacing:1.6px;color:#9fdcff;font-weight:700}.hero h1{font-size:28px;line-height:1.27;margin:11px 0 9px;letter-spacing:-.5px}.hero p{font-size:12px;color:#c8eaff;margin:0 0 17px}.primary{display:inline-flex;align-items:center;gap:18px;border-radius:50px;background:linear-gradient(110deg,#13baff,#0968f5);box-shadow:0 8px 17px #00336a60;color:white;text-decoration:none;font-size:12px;padding:10px 17px;font-weight:700}.hero-art{position:absolute;right:-10px;bottom:3px;width:53%;height:87%;filter:drop-shadow(0 10px 15px #00265b80)}.orbit{position:absolute;border:1px solid #b6f2ff8a;border-radius:50%;width:190px;height:75px;right:0;top:73px;transform:rotate(-24deg);box-shadow:0 0 13px #54d9ff55}.orbit2{transform:rotate(31deg);top:93px}.server{position:absolute;bottom:24px;width:72px;height:118px;border-radius:10px;background:linear-gradient(120deg,#69caff,#1568d3 38%,#07336e);border:1px solid #a4eaff;box-shadow:inset -9px 0 18px #0323539c,0 0 30px #35c3ff66;padding:13px 8px;transform:skewY(-5deg)}.server i{display:block;height:19px;border:1px solid #76d9ff9c;border-radius:4px;margin:5px 0;background:linear-gradient(90deg,#0a3874,#3189e9)}.server i:after{content:"";display:block;width:5px;height:5px;background:#8af9ff;border-radius:50%;margin:6px}.s1{right:70px}.s2{right:8px;bottom:18px;height:143px}.cloud{position:absolute;font-size:89px;top:-3px;right:33px;color:#c6f0ff;text-shadow:0 0 15px #8ce6ff,0 10px 12px #0664ca}.chip-art .chip{position:absolute;right:27px;top:57px;width:133px;height:133px;border:8px solid #8be5ff;border-radius:25px;background:linear-gradient(145deg,#8bddff,#145fe6 65%,#0a2f88);box-shadow:0 0 35px #a6efff;display:flex;flex-direction:column;align-items:center;justify-content:center;color:white;font-size:38px;font-weight:900;transform:rotate(-12deg)}.chip span{font-size:9px;letter-spacing:2px}.dots{position:absolute;z-index:5;bottom:10px;left:0;right:0;display:flex;justify-content:center;gap:6px}.dots button{width:7px;height:7px;border:0;background:#ffffff91;border-radius:10px;padding:0;cursor:pointer}.dots button.on{width:22px;background:#fff}.shortcuts{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;padding:26px 12px 23px}.shortcuts a{display:flex;flex-direction:column;align-items:center;gap:9px;text-decoration:none;color:#1a3559;font-size:11px;text-align:center;white-space:nowrap}.shortcuts a:active,.primary:active{transform:scale(.94)}.icon-bg{height:56px;width:56px;display:grid;place-items:center;border-radius:19px;box-shadow:inset 0 2px 2px #ffffffb5,0 9px 17px #5388bf16}.icon-bg svg{width:32px;height:32px;stroke:currentColor;stroke-width:2.7;stroke-linecap:round;stroke-linejoin:round}.blue{background:linear-gradient(145deg,#effaff,#bbdcff);color:#1677e8}.purple{background:linear-gradient(145deg,#f4f1ff,#dcd3ff);color:#7661e9}.cyan{background:linear-gradient(145deg,#ecfdff,#c5edff);color:#1595dc}.orange{background:linear-gradient(145deg,#fff7eb,#ffe0b9);color:#e9973e}.feature{margin:0 15px 17px;border-radius:21px;background:linear-gradient(110deg,#e4f3ff,#c1dfff 70%,#98c9ff);min-height:191px;position:relative;overflow:hidden;display:flex;align-items:center;padding:21px;box-shadow:0 8px 24px #347cce14}.feature-text{position:relative;z-index:2;width:72%}.section-kicker{font-size:9px;letter-spacing:1.5px;font-weight:800;color:#287fcf}.feature h2{font-size:22px;line-height:1.35;margin:9px 0}.feature p{font-size:11px;line-height:1.7;color:#466987;margin:0 0 12px}.feature a{font-size:11px;font-weight:700;color:#116bd5;text-decoration:none}.feature-visual{position:absolute;right:-34px;bottom:7px;width:175px;height:145px;transform:rotate(-17deg)}.tile{position:absolute;width:75px;height:70px;background:linear-gradient(145deg,#8ddaff,#096ad4);border:1px solid #a8e9ff;box-shadow:8px 10px 15px #3b78b449;border-radius:12px}.tile1{top:20px;left:15px}.tile2{top:4px;right:10px}.tile3{bottom:3px;left:32px}.tile4{bottom:15px;right:0}.core{position:absolute;top:42px;left:58px;width:72px;height:65px;border-radius:15px;background:linear-gradient(145deg,#d8faff,#2981f4);box-shadow:0 0 25px #ffffff,0 8px 15px #0653a48c;color:#fff;display:grid;place-items:center;font-size:28px;font-weight:900}.news{margin:0 15px 17px;padding:18px 16px 12px;background:#fff;border-radius:21px;box-shadow:0 8px 23px #3875ad0d}.section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.section-head h2{font-size:18px;margin:0}.section-head span{font-size:9px;color:#81a4c9;letter-spacing:1px}.news-row{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid #eaf1f9}.news-thumb{width:88px;height:66px;flex:none;border-radius:11px;display:grid;place-items:center;overflow:hidden;color:#e1faff;font-weight:900;letter-spacing:2px;font-size:14px;background:radial-gradient(circle at 75% 15%,#50ccff,#1564bc 60%,#09285d)}.thumb2{background:radial-gradient(circle at 65% 20%,#98eaff,#4195ed 40%,#123c87)}.news-row>div:nth-child(2){flex:1;min-width:0}.news-row b{font-size:13px}.news-row p{font-size:11px;color:#70859e;margin:5px 0;line-height:1.4}.news-row small{font-size:10px;color:#a0aec1}.arrow{font-size:25px;color:#b0c0d4}.news-note{font-size:10px;color:#9badc1;margin:10px 0 0}.about{margin:0 15px;padding:20px;border-radius:21px;background:linear-gradient(130deg,#fff,#e5f3ff);border:1px solid white}.about h2{font-size:20px;margin:8px 0}.about p{font-size:12px;line-height:1.85;color:#55718c;margin:0}.about-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:17px;font-size:11px;color:#4988c3}.about-bottom a{color:#1975e9;text-decoration:none}.bottom{position:fixed;bottom:0;left:50%;transform:translateX(-50%);max-width:480px;width:100%;display:grid;grid-template-columns:repeat(4,1fr);padding:10px 10px calc(10px + env(safe-area-inset-bottom));background:#fffffff0;backdrop-filter:blur(16px);box-shadow:0 -8px 28px #6a95c51a;border-radius:19px 19px 0 0;z-index:30}.bottom a{display:flex;flex-direction:column;align-items:center;gap:2px;text-decoration:none;color:#96a7bb;font-size:10px}.bottom a span{font-size:24px;line-height:26px}.bottom a.selected{color:#1478f5;font-weight:800}@media(max-width:380px){.hero h1{font-size:25px}.feature h2{font-size:19px}.feature-text{width:77%}.shortcuts a{font-size:10px}}

/* PHP integration */
.notify{text-decoration:none}.all-news{font-size:12px;color:#1975e9;text-decoration:none;font-weight:600}.news-link{text-decoration:none;color:inherit}.news-link img.news-thumb{object-fit:cover}.news-empty{font-size:12px;color:#8094aa;padding:20px 0}.wx-notice{margin:14px 15px 0;display:flex;align-items:center;gap:10px;border-radius:12px;background:#ffffffb8;padding:11px 14px;box-shadow:0 3px 12px #2c7fcb12}.wx-notice span{font-size:11px;font-weight:700;color:#1478f5}.wx-notice a{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-decoration:none;color:#3c6084;font-size:11px}.wx-notice button{border:0;background:none;color:#488ad0;font-size:20px;cursor:pointer}.news-row{cursor:pointer}.news-row:hover{background:#f8fbff}

/* Wanxiang v2: shortcuts and corporate introduction */
.shortcuts{padding:23px 12px 22px;gap:4px}.shortcuts a{gap:8px}.shortcuts .icon-bg{width:58px;height:58px;border-radius:20px}.shortcuts .icon-bg svg{width:30px;height:30px;stroke-width:2.25}.shortcuts b{font-weight:650}
.about{padding:22px 19px 20px;background:linear-gradient(145deg,#fff 0%,#f5faff 48%,#eaf5ff 100%);box-shadow:0 10px 28px #4e86bb12}.about-lead{margin-top:10px!important;font-size:12px!important;line-height:1.9!important}.about-lead strong{color:#163e72}.about-heading{display:flex;align-items:center;justify-content:space-between;margin:20px 0 10px}.about-heading span{font-size:14px;font-weight:800;color:#133866}.about-heading small{font-size:8px;letter-spacing:1.1px;color:#8ba9c7}.about-service-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.about-service{background:#fff;border:1px solid #e8f1fb;border-radius:14px;padding:12px 10px;display:grid;grid-template-columns:32px 1fr;column-gap:7px;row-gap:3px;align-items:center;box-shadow:0 5px 13px #3a84d20b}.about-service-icon{grid-row:span 2;width:32px;height:32px;border-radius:10px;background:linear-gradient(145deg,#eaf8ff,#c9e6ff);color:#2079df;display:grid;place-items:center;font-size:19px}.about-service b{font-size:12px;color:#173d6a}.about-service small{font-size:9px;color:#7791ad;white-space:nowrap}.about-benefits{display:grid;gap:7px}.about-benefits>div{background:#f6faff;border:1px solid #e6f1fc;border-radius:12px;padding:11px 12px;display:flex;align-items:center;justify-content:space-between;gap:10px}.about-benefits b{font-size:12px;color:#174473;flex:none}.about-benefits small{font-size:10px;color:#7893ac;text-align:right}.about-mission{margin-top:18px;padding:16px;border-radius:15px;background:linear-gradient(110deg,#e6f4ff,#d4eaff);border:1px solid #e5f4ff}.about-mission span{display:block;color:#498bc7;font-size:10px;letter-spacing:1px;margin-bottom:5px}.about-mission strong{font-size:18px;color:#0c4488}.about-mission p{margin-top:6px;font-size:11px;line-height:1.7}.about-bottom{gap:8px}.about-bottom span{font-size:8px;letter-spacing:.4px}@media(max-width:360px){.about-service{padding:10px 7px;grid-template-columns:27px 1fr;column-gap:5px}.about-service-icon{width:27px;height:27px}.about-service small{font-size:8px}.about-benefits small{font-size:9px}}

/* Official SVG logo replacement */
.header .brand-custom{display:flex;align-items:center;flex:1;min-width:0;max-width:calc(100% - 57px)}
.header .brand-logo{display:block;width:min(245px,100%);height:auto;max-height:58px;object-fit:contain;object-position:left center}
.header .notify{flex:none}
@media(max-width:360px){.header .brand-logo{width:min(220px,100%)}}


/* 万象云 V15 响应式布局：以 480px 的字号与视觉密度为基准，而非最大宽度。 */
:root{--wx-content-max:1180px;--wx-mobile-design:480px}
html{width:100%;min-width:0;-webkit-text-size-adjust:100%}
body{min-width:0}
.app,body.wx-page.app-page,.about-app{
  width:100%!important;max-width:var(--wx-content-max)!important;
  margin-inline:auto!important;min-width:0!important;
}
.app,.about-app{overflow-x:clip}
body.wx-page.app-page{overflow-x:clip}
.app .bottom,body.wx-page.app-page .mobile-bottom-nav,.about-app .bottom{
  width:100%!important;max-width:var(--wx-content-max)!important;
  left:50%!important;right:auto!important;transform:translateX(-50%)!important;
}
/* 移动端严格保留原 480px 设计密度，边距随屏幕变窄 */
@media(max-width:480px){
 .app,.about-app,body.wx-page.app-page{max-width:100%!important}
 .app .bottom,body.wx-page.app-page .mobile-bottom-nav,.about-app .bottom{max-width:100%!important}
 .app .header,.wx-topbar,.about-app .topbar{max-width:100%}
 .catalog-grid,.owned-grid,.profile-layout,.about-app .service-grid{min-width:0}
 .catalog-card,.owned-card,.account-card,.profile-section,.wallet-card{min-width:0}
 .app img,.about-app img,.wx-page img{max-width:100%}
}
/* 中屏不放大字号，只合理使用新增空间 */
@media(min-width:481px){
 .app .header,.wx-topbar,.about-app .topbar{padding-inline:clamp(20px,3vw,36px)}
 .app .hero,.app .feature,.app .news,.app .about{margin-inline:clamp(18px,3vw,36px)}
 .app .shortcuts{padding-inline:clamp(18px,3vw,36px)}
 .app .wx-notice{margin-inline:clamp(18px,3vw,36px)}
 body.wx-page.app-page .container{width:100%;max-width:100%;padding-inline:clamp(20px,3vw,36px)}
 .about-app .hero,.about-app .section{margin-inline:clamp(20px,3vw,36px)}
 .about-app .hero{padding-inline:clamp(26px,4vw,52px)}
 .about-app .section h2{font-size:clamp(23px,2.4vw,28px)}
 .app .shortcuts{gap:clamp(8px,2vw,20px)}
 .catalog-grid,.owned-grid,.profile-layout{min-width:0}
}
/* 商品卡片：中屏沿用手机熟悉的左右结构，但解除早期固定宽度 */
@media(min-width:481px) and (max-width:899px){
 body.wx-page.app-page .catalog-grid{grid-template-columns:minmax(0,1fr)!important}
 body.wx-page.app-page .catalog-grid>.wx-server-card{grid-template-columns:minmax(0,34%) minmax(0,66%)!important}
}
/* 桌面卡片分栏；不使用整站缩放，保留可读字号 */
@media(min-width:900px){
 body.wx-page.app-page .catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:20px}
 body.wx-page.app-page .catalog-grid>.wx-server-card{grid-template-columns:minmax(0,34%) minmax(0,66%)!important}
 body.wx-page.app-page .catalog-grid>.wx-server-card .spec-row{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 body.wx-page.app-page .catalog-grid>.wx-server-card .yield-row{grid-template-columns:repeat(3,minmax(0,1fr))!important}
 body.wx-page.app-page .owned-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
 body.wx-page.app-page .profile-layout{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:stretch}
 body.wx-page.app-page .profile-layout>.wallet-card,body.wx-page.app-page .profile-layout>.account-card{height:100%;min-width:0}
 .about-app .service-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
 .about-app .service-card:last-child{grid-column:auto}
 .app .news-row{gap:16px}
 .app .news-thumb{width:112px;height:80px}
}
/* 电脑上底部导航不遮住正文，保持统一宽度与可点击区域 */
@media(min-width:769px){
 .app .bottom,body.wx-page.app-page .mobile-bottom-nav,.about-app .bottom{border-radius:16px 16px 0 0}
 .app .bottom a,body.wx-page.app-page .mobile-bottom-nav a,.about-app .bottom a{min-width:0}
}
/* Banner 依据容器宽度变动高度；真实图片按原有 contain 逻辑显示 */
.app .slides{height:clamp(210px,calc(240px + (100vw - 480px)*.22),420px)}
@media(max-width:480px){.app .slides{height:240px}}
@media(max-width:360px){.app .slides{height:210px}}
.app .hero-copy{max-width:680px}
@media(min-width:769px){.app .hero-copy{padding:clamp(28px,4vw,54px)}.app .hero h1{font-size:clamp(28px,3vw,38px)}}
/* 强制避免商品信息因文字较长导致整页横向滚动 */
.wx-server-card,.wx-server-card .catalog-body,.wx-server-card .catalog-footer,.owned-card,.owned-title,.profile-main .wx-quick-grid>a{min-width:0}
.wx-server-card .catalog-desc,.owned-title h2,.account-name-line{overflow-wrap:anywhere}
@media(max-width:359px){
 .app .shortcuts .icon-bg{width:clamp(44px,14vw,56px);height:clamp(44px,14vw,56px)}
 .wx-server-card .catalog-footer .btn{white-space:normal!important}
 .wx-invite-action strong{overflow-wrap:anywhere;white-space:normal}
}


/* V16: 480px 为排版基准，不是固定页面宽度 */
html{min-width:0;-webkit-text-size-adjust:100%}
body{min-width:0}
.app,.about-app,body.wx-page.app-page{width:100%;max-width:1180px;margin-inline:auto;min-width:0}
.app .bottom,.about-app .bottom,body.wx-page.app-page .mobile-bottom-nav{width:100%;max-width:min(100%,1180px);left:50%;right:auto;transform:translateX(-50%)}
@media(max-width:480px){.app,.about-app,body.wx-page.app-page{max-width:100%}.app .bottom,.about-app .bottom,body.wx-page.app-page .mobile-bottom-nav{max-width:100%}}


/* V16 首页：保持手机字体大小，平板/电脑自适应间距和卡片 */
.app{overflow-x:clip}
.app .header,.app .hero,.app .shortcuts,.app .feature,.app .news,.app .about,.app .wx-notice{min-width:0}
.app .hero,.app .feature,.app .news,.app .about{margin-left:clamp(12px,3vw,36px);margin-right:clamp(12px,3vw,36px)}
.app .wx-notice{margin-left:clamp(12px,3vw,36px);margin-right:clamp(12px,3vw,36px)}
.app .header{padding-inline:clamp(14px,3vw,36px)}
.app .shortcuts{padding-inline:clamp(12px,3vw,36px)}
.app .slides{height:clamp(210px,50vw,430px)}
@media(max-width:480px){.app .slides{height:240px}.app .shortcuts{gap:4px}}
@media(max-width:360px){.app .slides{height:210px}.app .shortcuts .icon-bg{width:clamp(42px,14vw,56px);height:clamp(42px,14vw,56px)}}
@media(min-width:769px){.app .hero-copy{width:min(70%,660px)}.app .hero h1{font-size:clamp(28px,3vw,38px)}.app .news-thumb{width:110px;height:82px}}



/* V18: compact homepage images, maintain visible image art and CTA spacing */
.app { padding-bottom:calc(108px + env(safe-area-inset-bottom, 0px)) !important; }
.app .hero .slides { height:clamp(270px, 28vw, 380px) !important; min-height:0 !important; }
.app .hero .hero-copy { width:min(82%,490px); padding:22px 18px 42px 22px !important; box-sizing:border-box; }
.app .hero h1 { font-size:clamp(24px, 3vw, 36px); line-height:1.22; margin:9px 0 8px; }
.app .hero p { margin-bottom:13px; line-height:1.5; }
.app .hero .primary { position:relative; z-index:5; }
.app .hero .dots { bottom:9px; }
.app .bottom { padding-bottom:calc(10px + env(safe-area-inset-bottom, 0px)); }
@media(max-width:480px){
 .app .hero .slides { height:280px !important; }
 .app .hero .hero-copy { padding:20px 12px 40px 20px !important; width:87%; }
 .app .hero h1 { font-size:clamp(23px, 6.3vw, 28px); }
 .app .hero p { font-size:11px; }
}
@media(max-width:360px){
 .app .hero .slides { height:270px !important; }
 .app .hero .hero-copy { width:90%; padding-left:17px !important; }
}

/* V20: CTA stays with the copy, never pushed to the bottom of the artwork. */
.app .hero .slides > .slide .hero-copy {
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  justify-content:flex-start !important;
  height:auto !important;
  min-height:0 !important;
  padding-bottom:30px !important;
}
.app .hero .slides > .slide .hero-copy > .primary {
  margin:14px 0 0 !important;
  flex-shrink:0 !important;
  align-self:flex-start !important;
}
.app .hero .slides > .slide .hero-copy > p { margin-bottom:0 !important; }
/* Do not let the fixed navigation cover the last page section. */
.app { padding-bottom:calc(125px + env(safe-area-inset-bottom, 0px)) !important; }
@media(max-width:480px){
  .app .hero .slides > .slide .hero-copy {padding-bottom:32px !important;}
}

/* V21: image controls the banner dimensions, never a hardcoded height. */
.app .hero .slides, .app .hero .slides:not(.unused) {
 height:auto !important; min-height:0 !important; aspect-ratio:var(--wx-banner-ratio, 2 / 1) !important;
}
.app .hero .slides > .slide.wx-managed-banner .wx-banner-photo {
 width:100% !important; height:100% !important; object-fit:contain !important;
}