:root{--black:#101010;--white:#f4f3ef;--yellow:#ffdf35;--silver:#d7d7d4;--muted:#aaa;--line:#444;--font:Arial,"PingFang SC","Microsoft YaHei",sans-serif;--mono:ui-monospace,SFMono-Regular,Consolas,monospace;color-scheme:dark}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--black);color:var(--white);font-family:var(--font);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}a:focus-visible,button:focus-visible{outline:3px solid var(--yellow);outline-offset:5px}::selection{background:var(--yellow);color:var(--black)}.wrap{width:min(1360px,calc(100% - 112px));margin-inline:auto}.skip-link{position:fixed;left:12px;top:0;z-index:10;background:var(--yellow);color:var(--black);padding:12px;clip-path:inset(100%)}.skip-link:focus{clip-path:none}.site-header{height:88px;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:2}.brand{display:inline-flex;align-items:center;gap:11px;white-space:nowrap}.brand strong{font-size:24px;letter-spacing:-.04em}.brand-sign{width:32px;height:32px;border:2px solid currentColor;border-radius:6px;color:var(--yellow);font-size:27px;line-height:25px;text-align:center;font-weight:700}.brand-caption{border-left:1px solid #555;padding-left:14px;margin-left:4px;color:#b7b7b7;font-size:12px}.site-header nav{display:flex;gap:38px;align-items:center;font-size:14px}.site-header nav a{padding:12px 0;border-bottom:1px solid transparent}.site-header nav a:hover{border-color:var(--yellow)}.home-hero{position:relative;min-height:560px;overflow:hidden;isolation:isolate}.hero-image{position:absolute;inset:0 0 0 auto;width:77%;height:100%;object-fit:cover;object-position:center;z-index:-1}.home-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--black) 0%,rgba(16,16,16,.96) 24%,rgba(16,16,16,.2) 62%,transparent 100%);z-index:-1}.hero-content{min-height:560px;display:flex;align-items:flex-start;position:relative}.hero-copy{position:relative;z-index:1;padding:35px 0 55px;max-width:800px}.hero-copy h1{font-size:clamp(56px,6.4vw,102px);letter-spacing:-.075em;line-height:1.18;margin:0 0 31px;font-weight:850}.hero-copy h1 span{color:var(--yellow)}.hero-copy p{font-size:18px;line-height:1.8;color:#ccc;margin:0 0 34px}.button{min-height:58px;display:inline-flex;align-items:center;justify-content:space-between;gap:36px;padding:14px 24px;font-size:16px;font-weight:750;transition:transform .2s,background .2s}.button:hover{transform:translateY(-3px)}.button-yellow{background:var(--yellow);color:var(--black)}.button-yellow:hover{background:#ffe862}.button-dark{background:var(--black);color:var(--white)}.button-dark:hover{background:#2a2a2a}.hero-index{position:absolute;right:0;bottom:44px;color:#aaa;border-left:1px solid #777;padding-left:17px;font:11px/1.6 var(--mono);letter-spacing:.15em}.collection{background:var(--white);color:var(--black);padding:35px 0 62px}.section-line{display:flex;align-items:center;gap:28px;border-top:1px solid currentColor;padding:22px 0 28px}.section-line h2{font-size:23px;margin:0;letter-spacing:-.04em;white-space:nowrap}.section-line:after{content:"";height:1px;flex:1;background:currentColor;opacity:.28}.section-line>span{order:2;font:11px var(--mono);letter-spacing:.1em;white-space:nowrap}.collection .section-line{border:0}.collection-list{display:grid;grid-template-columns:1fr 1fr;gap:0}.collection-item{display:grid;grid-template-columns:180px 1fr;gap:34px;min-width:0;padding-right:38px}.collection-item+.collection-item{border-left:1px solid #ccc;padding-left:38px;padding-right:0}.tile{width:180px;height:180px;border-radius:10px;padding:18px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:inset 0 1px 1px #fff8}.tile-yellow{background:var(--yellow)}.tile-silver{background:linear-gradient(130deg,#eee,#bdbdbb 70%,#eee)}.tile-symbol{font-size:90px;line-height:1;font-weight:300}.tile>span:last-child{align-self:flex-end;font:12px var(--mono)}.item-label,.small-label{font:11px var(--mono);letter-spacing:.13em;text-transform:uppercase}.item-label{color:#777;margin:0 0 12px}.item-content h3{font-size:29px;line-height:1.2;margin:0 0 13px;letter-spacing:-.05em}.item-content h3 small{font-size:18px}.item-content>p:not(.item-label){font-size:15px;line-height:1.7;color:#555;min-height:78px;margin:0 0 17px}.text-arrow{font-size:14px;font-weight:700;border-bottom:1px solid;display:inline-flex;gap:15px;padding:0 0 6px}.text-arrow:hover{color:#a28000}.update-band{background:#202020;padding:65px 0 72px}.update-layout{display:grid;grid-template-columns:1fr 1.1fr;gap:90px}.update-layout .small-label{color:var(--yellow)}.update-layout h2{font-size:clamp(40px,4.5vw,72px);line-height:1.2;letter-spacing:-.06em;margin:27px 0 0}.update-links a{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #666;padding:24px 0;font-size:25px;transition:color .2s}.update-links a:hover{color:var(--yellow)}.update-links a:last-of-type{border-bottom:1px solid #666}.update-links a>span:last-child{font-size:25px}.update-links small{display:block;font:12px var(--mono);color:#aaa;margin-top:8px}.update-links p{font-size:13px;color:#aaa;line-height:1.7}.about{padding-top:110px;padding-bottom:115px}.about .small-label{color:var(--yellow)}.about h2{font-size:clamp(46px,6vw,90px);line-height:1.18;letter-spacing:-.06em;margin:30px 0}.about p{max-width:590px;font-size:18px;line-height:1.8;color:#aaa}.site-footer{border-top:1px solid #555;min-height:100px;display:flex;align-items:center;justify-content:space-between;gap:25px;color:#aaa;font-size:13px}.site-footer .brand{color:var(--white)}.site-footer .brand strong{font-size:20px}.site-footer a:hover{color:var(--yellow)}
.detail-hero{padding-top:32px;padding-bottom:100px}.back-link{font-size:13px;color:#aaa}.back-link:hover{color:var(--yellow)}.detail-hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:80px;align-items:center;margin-top:75px}.detail-hero .small-label{color:var(--yellow)}.detail-hero h1{font-size:clamp(58px,6.3vw,105px);line-height:1.12;letter-spacing:-.075em;margin:25px 0 25px}.detail-hero h1 span{color:var(--yellow)}.detail-lead{font-size:29px;font-weight:700;margin:0 0 18px}.detail-summary{font-size:17px;line-height:1.85;color:#bbb;max-width:600px}.detail-actions{display:flex;gap:26px;align-items:center;flex-wrap:wrap;margin-top:30px}.inline-link{display:inline-block;border-bottom:1px solid;padding:7px 0;font-size:14px}.inline-link:hover{color:var(--yellow)}.detail-art{aspect-ratio:1/1;max-width:490px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:22px 22px 0 #292929;transform:rotate(4deg);padding:35px}.insta-art{background:var(--yellow);color:var(--black)}.dianping-art{background:linear-gradient(135deg,#eee,#adadad 75%,#eee);color:var(--black);transform:rotate(-4deg)}.art-arrow{font-size:clamp(170px,22vw,360px);line-height:.9;font-weight:200}.art-pencil{font-size:clamp(150px,20vw,320px);line-height:1}.detail-art>span:last-child{font:17px/1.3 var(--mono);letter-spacing:.13em}.feature-section{background:var(--white);color:var(--black);padding:45px 0 90px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:45px;margin:20px 0 0;padding:0;list-style:none}.steps li{border-top:1px solid #999;padding-top:17px}.steps li>span{font:13px var(--mono)}.steps h3{font-size:28px;margin:33px 0 12px}.steps p{font-size:15px;color:#555;line-height:1.8;margin:0}.install-section{background:var(--yellow);color:var(--black);padding:75px 0}.install-layout{display:grid;grid-template-columns:1fr 1fr;gap:80px}.install-layout h2{font-size:clamp(50px,5vw,78px);line-height:1.16;letter-spacing:-.06em;margin:20px 0}.install-layout>div:first-child>p:last-child{max-width:470px;font-size:17px;line-height:1.8}.install-panel{border-top:1px solid #7e6a16;padding-top:22px}.version-line{font:13px var(--mono);display:flex;justify-content:space-between;gap:20px;margin:0 0 20px}.download{width:100%;font-size:20px}.compact-steps{counter-reset:step;list-style:none;padding:0;margin:26px 0}.compact-steps li{counter-increment:step;display:grid;grid-template-columns:32px 1fr;gap:11px;border-top:1px solid #8d791d;padding:16px 0;font-size:15px;line-height:1.7}.compact-steps li:before{content:counter(step,decimal-leading-zero);font:12px/2 var(--mono)}.fine-print{font-size:12px;line-height:1.8;opacity:.75}.guide-section{padding-top:75px;padding-bottom:85px}.guide-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px}.guide-grid .large-copy{font-size:clamp(27px,3.1vw,45px);line-height:1.4;font-weight:700;margin:25px 0}.guide-grid .compact-steps li{border-color:#555}.guide-grid .fine-print{max-width:550px;color:#aaa}.notes-section{padding-bottom:100px}.notes-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;color:#aaa;font-size:15px;line-height:1.8}.notes-grid p{max-width:550px}
@media(max-width:1100px){.wrap{width:calc(100% - 72px)}.collection-item{grid-template-columns:120px 1fr;gap:22px;padding-right:22px}.collection-item+.collection-item{padding-left:22px}.tile{width:120px;height:120px}.tile-symbol{font-size:65px}.item-content h3{font-size:24px}.hero-image{width:90%}.detail-hero-grid{gap:40px}.update-layout{gap:50px}}
@media(max-width:700px){.wrap{width:calc(100% - 40px)}.site-header{height:72px}.brand strong{font-size:19px}.brand-sign{width:28px;height:28px;font-size:23px;line-height:21px}.brand-caption{display:none}.site-header nav{gap:18px;font-size:12px}.home-hero,.hero-content{min-height:710px}.hero-content{align-items:flex-start}.hero-copy{padding-top:43px}.hero-copy h1{font-size:clamp(46px,11vw,75px);line-height:1.18;margin-bottom:23px}.hero-copy p{font-size:15px;line-height:1.7;margin-bottom:23px}.hero-image{width:135%;height:65%;top:auto;bottom:0;right:-33%;object-position:center}.home-hero:after{background:linear-gradient(180deg,var(--black) 0%,var(--black) 30%,transparent 68%)}.hero-index{display:none}.collection{padding:18px 0 50px}.section-line{gap:12px;padding:19px 0}.section-line h2{font-size:20px}.section-line>span{font-size:9px}.collection-list{grid-template-columns:1fr}.collection-item,.collection-item+.collection-item{grid-template-columns:110px 1fr;gap:18px;padding:20px 0;border:0;border-top:1px solid #ccc}.tile{width:110px;height:110px}.tile-symbol{font-size:55px}.item-content h3{font-size:23px}.item-content h3 small{font-size:16px}.item-content>p:not(.item-label){font-size:13px;min-height:0;margin-bottom:12px}.text-arrow{font-size:12px}.update-band{padding:45px 0 50px}.update-layout{grid-template-columns:1fr;gap:25px}.update-layout h2{font-size:50px;margin:18px 0 0}.update-links a{font-size:20px;padding:18px 0}.about{padding-top:72px;padding-bottom:80px}.about h2{font-size:50px}.about p{font-size:15px}.site-footer{display:grid;grid-template-columns:1fr auto;padding:20px 0;font-size:11px}.site-footer>span{grid-row:2;grid-column:1/-1}.detail-hero{padding-top:16px;padding-bottom:70px}.detail-hero-grid{grid-template-columns:1fr;margin-top:40px;gap:55px}.detail-hero h1{font-size:clamp(58px,13vw,82px)}.detail-lead{font-size:23px}.detail-summary{font-size:15px}.detail-art{max-width:360px;width:85%;margin-inline:auto}.feature-section{padding:25px 0 60px}.steps{grid-template-columns:1fr;gap:15px}.steps h3{font-size:23px;margin:15px 0 8px}.steps p{font-size:14px}.install-section{padding:52px 0}.install-layout{grid-template-columns:1fr;gap:30px}.install-layout h2{font-size:52px}.install-layout>div:first-child>p:last-child{font-size:15px}.download{font-size:16px}.compact-steps li{font-size:13px}.guide-section{padding-top:53px;padding-bottom:55px}.guide-grid{grid-template-columns:1fr;gap:5px}.guide-grid .large-copy{font-size:32px}.notes-section{padding-bottom:60px}.notes-grid{grid-template-columns:1fr;gap:0;font-size:13px}}
@media(max-width:370px){.wrap{width:calc(100% - 32px)}.site-header nav{gap:11px}.brand strong{font-size:17px}.hero-copy h1{font-size:44px}.home-hero,.hero-content{min-height:670px}.collection-item,.collection-item+.collection-item{grid-template-columns:88px 1fr;gap:13px}.tile{width:88px;height:88px;padding:11px}.tile-symbol{font-size:48px}.item-content h3{font-size:20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
.collection-item:nth-child(3){grid-column:1/-1;border-left:0;border-top:1px solid #ccc;padding:32px 0 0;margin-top:35px;grid-template-columns:180px 1fr}
.collection-item:nth-child(3) .item-content>p:not(.item-label){min-height:0;max-width:620px}
.tile-dark{background:#242424;color:var(--yellow);border:1px solid #555}
.trip-art{background:#292929;color:var(--white);transform:rotate(3deg);border:1px solid #666}
.trip-receipt{display:flex;flex-direction:column;justify-content:space-between;background:#e7e4dc;color:#171717;min-height:70%;padding:26px;box-shadow:10px 10px 0 #151515;transform:rotate(-7deg);font-style:normal}
.trip-receipt i,.trip-receipt em{font:12px var(--mono);font-style:normal;letter-spacing:.11em}
.trip-receipt b{font-size:clamp(35px,5vw,72px);letter-spacing:-.07em;white-space:nowrap}
.trip-receipt strong{font-size:48px;line-height:1;color:#bd9800;align-self:flex-end}
.detail-business-trip code{font:inherit;overflow-wrap:anywhere}
@media(max-width:700px){.collection-item:nth-child(3){grid-column:auto;grid-template-columns:110px 1fr;padding:20px 0;margin-top:0}.trip-receipt{padding:18px}.trip-receipt b{font-size:40px}}
@media(max-width:370px){.collection-item:nth-child(3){grid-template-columns:88px 1fr}.detail-business-trip .notes-section .section-line{flex-wrap:wrap}.detail-business-trip .notes-section .section-line:after{display:none}}
/* Distinct editorial identities, with fixed vector artwork instead of font glyphs. */
.ui-icon{display:inline-block;width:1.15em;height:1.15em;vertical-align:-.18em;object-fit:contain;filter:brightness(0) invert(1)}
.button-yellow .ui-icon,.button-dark .ui-icon,.collection .ui-icon,.install-section .ui-icon{filter:brightness(0)}
.brand-sign{display:grid;place-items:center}.brand-sign .ui-icon{width:20px;height:20px;filter:none;color:var(--yellow)}
.tile-symbol{display:grid;place-items:center;width:94px;height:94px}.tile-icon{width:78px;height:78px;object-fit:contain;filter:brightness(0)}.tile-dark .tile-icon{filter:invert(82%) sepia(64%) saturate(472%) hue-rotate(347deg) brightness(108%)}
.detail-art{padding:0;overflow:hidden;transform:none;box-shadow:none;aspect-ratio:1/1}.detail-art img{display:block;width:100%;height:100%;object-fit:contain}.insta-art{background:radial-gradient(circle at 70% 20%,#373737 0,#171717 58%,#101010 100%);border:1px solid #5c5c5c}.dianping-art{background:#dad9d4;border:1px solid #a6a6a0}.business-trip .trip-art,.trip-art{background:#242424;border:1px solid #666}
.story-band{border-top:1px solid #555;overflow:hidden}.story-inner{min-height:170px;display:flex;align-items:center;gap:40px;position:relative}.story-index{font:12px var(--mono);white-space:nowrap}.story-inner p{font-size:clamp(22px,3vw,39px);font-weight:750;letter-spacing:-.05em;line-height:1.35;max-width:650px;position:relative;z-index:1}.story-word{position:absolute;right:0;bottom:-.23em;font:900 clamp(90px,16vw,230px)/1 Arial,sans-serif;letter-spacing:-.09em;opacity:.12;white-space:nowrap}.story-insta{background:#ffdf35;color:#101010;border-color:#ffdf35}.story-dianping{background:#d6d6d2;color:#151515;border-color:#d6d6d2}.story-business-trip{background:#252525;color:#f4f3ef}
.detail-insta .detail-hero{background:linear-gradient(120deg,#101010 35%,#25201a 100%)}.detail-insta .detail-hero h1{font-style:italic}.detail-insta .feature-section{background:#efeee9}.detail-insta .steps li{border-top:3px solid #171717}.detail-insta .install-section{background:#ffdf35}
.detail-dianping{--yellow:#e9e7dc}.detail-dianping .detail-hero{background:#dcdad3;color:#161616}.detail-dianping .site-header{background:#dcdad3;color:#161616}.detail-dianping .site-header nav a:hover{border-color:#161616}.detail-dianping .brand-sign{color:#161616}.detail-dianping .brand-sign .ui-icon,.detail-dianping .detail-hero .ui-icon{filter:brightness(0)}.detail-dianping .brand-caption,.detail-dianping .back-link,.detail-dianping .detail-summary{color:#4e4d48}.detail-dianping .detail-hero .small-label,.detail-dianping .detail-hero h1 span{color:#a17f00}.detail-dianping .button-yellow{background:#151515;color:#f4f3ef}.detail-dianping .button-yellow .ui-icon{filter:brightness(0) invert(1)}.detail-dianping .feature-section{background:#f6f4ec}.detail-dianping .steps li{border-top:3px solid #ab9b70}.detail-dianping .install-section{background:#d6d6d2}
.detail-business-trip .detail-hero{background:linear-gradient(110deg,#101010 45%,#343434)}.detail-business-trip .detail-hero h1{font-family:var(--mono);font-weight:750;font-size:clamp(52px,6vw,96px)}.detail-business-trip .feature-section{background:#e9e7e0}.detail-business-trip .steps li{border-top:3px dashed #76736c}.detail-business-trip .install-section{background:#e8e5d9}.detail-business-trip .install-panel{border-color:#827e71}.detail-business-trip .compact-steps li{border-color:#aba698}
@media(max-width:700px){.tile-symbol{width:65px;height:65px}.tile-icon{width:54px;height:54px}.detail-art{width:100%;max-width:390px;margin-inline:auto}.detail-hero-grid{gap:30px}.story-inner{min-height:125px;gap:15px}.story-inner p{font-size:23px}.story-word{font-size:90px}.detail-business-trip .detail-hero h1{font-size:clamp(48px,11vw,70px)}}
@media(max-width:370px){.tile-symbol{width:52px;height:52px}.tile-icon{width:44px;height:44px}.story-inner p{font-size:20px}}
.walkthrough{padding-top:76px;padding-bottom:95px}.walk-disclaimer{font-size:13px;color:#aaa;line-height:1.7;margin:0 0 32px}.walk-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:34px}.walk-step{min-width:0;border-top:1px solid #555;padding-top:24px}.phone{width:min(100%,235px);height:350px;border:7px solid #333;border-radius:34px;background:#101010;margin:0 auto 26px;padding:9px;box-shadow:12px 16px 0 #242424}.phone-bar{width:72px;height:15px;border-radius:0 0 12px 12px;background:#101010;margin:-9px auto 4px;position:relative;z-index:1}.phone-screen{height:100%;border-radius:21px;background:#f6f5f2;color:#161616;padding:32px 15px 16px;overflow:hidden}.phone-app{font-size:11px;font-weight:700;color:#6a6a66}.phone-action{font-size:23px;font-weight:750;letter-spacing:-.04em;line-height:1.2;margin:28px 0 34px}.phone-target{display:flex;align-items:center;gap:9px;padding:12px 8px;border:2px solid #b39300;border-radius:10px;background:#ffed8c;font-size:14px;min-height:62px}.target-ring{width:26px;height:26px;flex:none;display:grid;place-items:center;border-radius:50%;background:#161616;color:#fff;font:700 12px var(--mono)}.phone-row{height:10px;width:85%;background:#deddd8;border-radius:5px;margin:25px 0 0 8px}.phone-row.short{width:60%;margin-top:14px}.walk-copy{display:grid;grid-template-columns:42px 1fr;column-gap:12px}.walk-number{font:13px var(--mono);color:#ffdf35;grid-row:1/3;padding-top:6px}.walk-copy h3{font-size:22px;margin:0 0 8px}.walk-copy p{font-size:14px;line-height:1.7;color:#aaa;margin:0}.detail-dianping .walkthrough{background:#171717}.detail-business-trip .walkthrough{background:#171717}
@media(max-width:700px){.walkthrough{padding-top:54px;padding-bottom:65px}.walk-grid{grid-template-columns:1fr;gap:36px}.walk-step{display:grid;grid-template-columns:minmax(130px,170px) 1fr;align-items:center;gap:22px}.phone{height:260px;width:170px;margin:0;transform:none}.phone-screen{padding:20px 9px 10px}.phone-action{font-size:17px;margin:15px 0 20px}.phone-target{font-size:11px;min-height:50px;padding:7px 4px;gap:4px}.target-ring{width:20px;height:20px;font-size:10px}.phone-row{margin-top:18px}.walk-copy{display:block}.walk-number{display:block;margin-bottom:9px}.walk-copy h3{font-size:19px}.walk-copy p{font-size:12px}}
@media(max-width:370px){.walk-step{grid-template-columns:128px 1fr;gap:13px}.phone{width:128px;height:240px;border-width:5px}.phone-action{font-size:15px}.phone-target{font-size:10px}.walk-copy h3{font-size:17px}}
@media(max-width:700px){.story-word{opacity:.055;right:-10px;bottom:-.15em}.story-inner p{max-width:300px}.detail-dianping .site-header .brand-sign .ui-icon{filter:brightness(0)}}
.detail-dianping .brand-sign .ui-icon{filter:brightness(0)}
/* Image-generated campaign artwork and a cinematic walkthrough treatment. */
.tile{overflow:hidden;position:relative;isolation:isolate}.tile:after{content:"";position:absolute;inset:auto -20% -45% -20%;height:70%;background:radial-gradient(ellipse,rgba(255,255,255,.4),transparent 70%);z-index:-1}.tile-symbol{width:100%;height:100%;place-items:center}.tile-icon{width:110%;height:110%;filter:none;object-fit:contain}.tile-yellow{background:#171717}.tile-silver{background:#33312c}.tile-dark{background:#191919}.tile-dark .tile-icon{filter:none}
.detail-art{border:0;position:relative;background:#141414;box-shadow:0 26px 80px #0008}.detail-art img{object-fit:cover}.detail-insta .detail-art{border-radius:2px 84px 2px 2px}.detail-dianping .detail-art{background:#111;border-radius:2px 2px 84px 2px}.detail-business-trip .detail-art{border-radius:84px 2px 2px 2px}
.detail-hero-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}.detail-hero .small-label{letter-spacing:.22em}.detail-hero h1{max-width:780px}.detail-art:after{content:"";position:absolute;inset:0;border:1px solid #fff5;pointer-events:none;border-radius:inherit}.detail-dianping .detail-hero{background:#dcdad3}.detail-dianping .detail-art{border:1px solid #74726e}
.walkthrough{position:relative;isolation:isolate}.walkthrough:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 20%,#464034 0,transparent 42%);opacity:.27;z-index:-1;pointer-events:none}.walk-grid{gap:18px}.walk-step{border:0;background:#1f1f1f;position:relative;isolation:isolate;overflow:hidden;padding:0 0 30px}.walk-step:before{content:"";display:block;position:absolute;inset:0 0 115px;background-image:linear-gradient(180deg,#1113 0,#1119 72%,#1f1f1f 100%),var(--walk-art);background-size:cover;background-position:var(--walk-position,center);opacity:.74;z-index:-1}.walk-step:nth-child(1){--walk-position:10% 50%}.walk-step:nth-child(2){--walk-position:50% 50%}.walk-step:nth-child(3){--walk-position:90% 50%}.detail-insta{--walk-art:url('/assets/hero-insta.webp')}.detail-dianping{--walk-art:url('/assets/hero-dianping.webp')}.detail-business-trip{--walk-art:url('/assets/hero-business-trip.webp')}.phone{position:relative;margin:34px auto 30px;box-shadow:0 22px 44px #000a,0 0 0 1px #ffd93c66;transform:rotate(-4deg);transition:transform .3s}.walk-step:nth-child(2) .phone{transform:rotate(3deg)}.walk-step:nth-child(3) .phone{transform:rotate(-2deg)}.walk-step:hover .phone{transform:rotate(0) translateY(-5px)}.walk-copy{margin:0 24px}.walk-number{font-weight:800;color:#ffdf35}.walk-copy h3{font-size:24px}.walk-step:after{content:counter(walk-step,decimal-leading-zero);counter-increment:walk-step;position:absolute;top:14px;left:20px;font:900 68px/1 var(--mono);color:#ffdf3580;z-index:-1}.walk-grid{counter-reset:walk-step}.phone-target{background:#ffdf35;border-color:#141414;box-shadow:0 0 0 4px #ffdf3590}.target-ring{background:#151515}.walk-disclaimer{border-left:2px solid #ffdf35;padding-left:12px}
@media(max-width:700px){.tile-icon{width:118%;height:118%}.detail-art{width:100%}.walk-grid{gap:20px}.walk-step{padding:0 12px 0 0}.walk-step:before{inset:0 40% 0 0;background-image:linear-gradient(90deg,#1112,#1f1f1f),var(--walk-art)}.phone,.walk-step:nth-child(2) .phone,.walk-step:nth-child(3) .phone{transform:rotate(-3deg);margin:18px 0 18px 18px}.walk-step:hover .phone{transform:rotate(-3deg)}.walk-copy{margin:0}.walk-step:after{display:none}.walk-copy h3{font-size:18px}}
@media(prefers-reduced-motion:reduce){.phone{transition:none}}
@media(max-width:700px){.detail-hero-grid{grid-template-columns:minmax(0,1fr)}.detail-art{max-width:390px;aspect-ratio:1/1;margin:6px auto 0}.detail-hero{padding-bottom:56px}.story-inner{min-height:120px}.story-inner p{padding-right:10px}}
.journey-visual{margin:0 0 42px;position:relative;overflow:hidden;background:#141414}.journey-visual img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}.journey-visual:after{content:"";position:absolute;inset:55% 0 0;background:linear-gradient(transparent,#070707bd);pointer-events:none}.journey-visual figcaption{position:absolute;top:18px;left:20px;color:#fff;background:#111b;border:1px solid #fff6;padding:8px 12px;font:11px var(--mono);z-index:1}.journey-labels{position:absolute;inset:auto 0 0;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:0;padding:0 16px 18px;list-style:none}.journey-labels li{border-top:1px solid #ffffff8c;padding:13px 12px 0;font-size:17px;font-weight:750;display:flex;align-items:center;gap:10px}.journey-labels li span{font:12px var(--mono);color:#ffdf35}.journey-labels li+li{border-left:1px solid #ffffff4d}
@media(max-width:700px){.journey-visual{margin-bottom:28px}.journey-visual img{aspect-ratio:1/1;object-fit:cover}.journey-visual figcaption{font-size:10px;top:10px;left:10px;padding:6px 8px}.journey-labels{padding:0 5px 10px}.journey-labels li{font-size:11px;line-height:1.3;display:block;padding:7px 5px 0}.journey-labels li span{display:block;font-size:10px;margin-bottom:3px}}
/* Hero colour belongs to the full-width section; only its content is constrained. */
.detail-hero{width:100%;box-sizing:border-box}
.detail-dianping .site-header{background:transparent;isolation:isolate}
.detail-dianping .site-header:before{content:"";position:absolute;inset-block:0;left:50%;width:100vw;transform:translateX(-50%);background:#dcdad3;z-index:-1}
/* Keep tutorial atmosphere full bleed and remove decorative image outlines. */
.walkthrough{width:100%;background:#171717}
.detail-art:after{display:none}
.detail-dianping .detail-art{border:0}
.journey-visual figcaption{border:0}
/* The cinematic path image reaches both viewport edges; text remains aligned to the grid. */
.journey-visual{width:100vw;max-width:none;left:50%;transform:translateX(-50%)}
.journey-visual figcaption{left:max(20px,calc((100vw - 1328px)/2))}
.journey-labels{padding-inline:max(20px,calc((100vw - 1328px)/2))}
@media(max-width:700px){.journey-visual figcaption{left:10px}.journey-labels{padding-inline:10px}}
/* Four-item collection and National Day portrait preview. */
@media(min-width:701px){.collection-item:nth-child(3){grid-column:auto;border-top:1px solid #ccc;border-left:0;padding:32px 38px 0 0;margin-top:34px;grid-template-columns:180px 1fr}.collection-item:nth-child(4){border-top:1px solid #ccc;border-left:1px solid #ccc;padding:32px 0 0 38px;margin-top:34px}}
.tile-red{background:#c91420;color:#ffde31}.tile-star{font-size:105px;line-height:1}.detail-national-avatar .detail-hero{background:linear-gradient(110deg,#151515 48%,#3b1016)}.detail-national-avatar .detail-hero h1 span{color:#f5cf31}.detail-national-avatar .feature-section{background:#f1eee8}.detail-national-avatar .steps li{border-top:3px solid #be1824}.detail-national-avatar .install-section{background:#f1d445}.avatar-preview{width:min(100%,450px);aspect-ratio:1;background:linear-gradient(135deg,#5f6365,#202326);position:relative;overflow:hidden;box-shadow:0 28px 70px #0009}.avatar-head{position:absolute;width:37%;height:43%;border-radius:50% 50% 45% 45%;background:linear-gradient(120deg,#d7c0a6,#8c7462);left:43%;top:19%;transform:rotate(-6deg)}.avatar-body{position:absolute;width:76%;height:58%;background:linear-gradient(120deg,#c1b8ac,#282d31);border-radius:43% 43% 0 0;left:27%;top:60%}.avatar-preview img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.avatar-preview-note{font:11px var(--mono);letter-spacing:.1em;color:#bbb;margin:14px 0 0}.avatar-example{display:flex;justify-content:center;align-items:center;flex-direction:column}.detail-national-avatar .story-band{background:#be1421;color:#fff;border:0}.detail-national-avatar .story-word{color:#fff}
@media(max-width:1100px) and (min-width:701px){.collection-item:nth-child(3){grid-template-columns:120px 1fr;padding-right:22px}.collection-item:nth-child(4){grid-template-columns:120px 1fr;padding-left:22px}}
@media(max-width:700px){.collection-item:nth-child(3),.collection-item:nth-child(4){grid-column:auto;grid-template-columns:110px 1fr;padding:20px 0;margin-top:0;border-top:1px solid #ccc;border-left:0}.tile-star{font-size:67px}.avatar-preview{max-width:390px}}
@media(max-width:370px){.collection-item:nth-child(3),.collection-item:nth-child(4){grid-template-columns:88px 1fr}.tile-star{font-size:53px}}
.variant-section{background:#171717;padding:60px 0 80px}.variant-intro{font-size:15px;color:#aaa;line-height:1.7;margin:0 0 30px}.variant-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}.variant-grid figure{margin:0;min-width:0}.variant-grid .avatar-preview{width:100%;box-shadow:none}.variant-grid figcaption{display:flex;flex-direction:column;gap:8px;border-top:1px solid #777;margin-top:16px;padding-top:14px}.variant-grid figcaption strong{font-size:20px}.variant-grid figcaption span{color:#aaa;font-size:14px;line-height:1.6}
@media(max-width:700px){.variant-section{padding:45px 0 60px}.variant-grid{grid-template-columns:1fr;gap:34px}.variant-grid .avatar-preview{max-width:360px}.variant-grid figcaption{margin-top:12px}}
@media(max-width:370px){.variant-section .section-line{flex-wrap:wrap}.variant-section .section-line:after{display:none}.variant-section .section-line>span{margin-left:auto}}
/* Avatar Studio: a portrait led tool within the Shunshou visual system. */
.detail-avatar-studio .detail-hero{background:linear-gradient(115deg,#141414 40%,#303033)}
.detail-avatar-studio .detail-hero h1 span{color:#ffdf35}
.detail-avatar-studio .story-band{background:#262626;color:#f5f3ea}
.detail-avatar-studio .feature-section{background:#eeeae1}
.detail-avatar-studio .steps li{border-top:3px solid #c9a827}
.detail-avatar-studio .install-section{background:#ffdf35}
.detail-avatar-studio .button-dark .ui-icon{filter:brightness(0) invert(1)}
.avatar-category{margin:42px 0 22px;font-size:26px}.avatar-category small{font:11px var(--mono);color:#aaa;letter-spacing:.18em;margin-left:12px}
.avatar-grid-two{grid-template-columns:repeat(2,minmax(0,360px))}
.avatar-grid-status{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.avatar-grid-status figcaption strong{font-size:17px}.avatar-grid-status figcaption span{font-size:12px}
@media(max-width:900px){.avatar-grid-status{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.avatar-grid-two{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.avatar-grid-status{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.avatar-category{font-size:21px}.avatar-grid-two figcaption strong,.avatar-grid-status figcaption strong{font-size:16px}}

/* Avatar Studio collection artwork. */
.tile-avatar{background:#1b1b1b;color:#ffdf35}
.tile-avatar .tile-icon{width:125%;height:125%}

/* A concise illustrated first-run guide. */
.avatar-tutorial{padding-top:64px;padding-bottom:20px}.tutorial-caption{font:11px var(--mono);color:#aaa;margin:0 0 25px}.avatar-tutorial-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;padding:0;list-style:none}.avatar-tutorial-steps li{min-width:0}.tutorial-visual{position:relative;aspect-ratio:1/1;overflow:hidden;background:#252525;display:flex;align-items:center;justify-content:center;margin-bottom:22px}.tutorial-control{position:absolute;bottom:16px;left:12px;right:12px;background:#ffdf35;color:#151515;padding:11px 5px;text-align:center;font-size:12px;font-weight:700}.tutorial-file{border:1px solid #aaa;background:#eae7df;color:#222;padding:40px 18px;font:18px var(--mono);transform:rotate(-7deg);margin-top:-20px}.tutorial-crop>img,.tutorial-result>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.tutorial-crop>img{opacity:.65}.tutorial-crop-frame{position:absolute;inset:14px;border:2px solid #ffdf35;box-shadow:0 0 0 1px #111}.tutorial-avatar{position:relative;width:60%;aspect-ratio:1;margin-top:-25px;overflow:hidden;border-radius:8px}.tutorial-avatar img{position:absolute;inset:0;width:100%;height:100%}.tutorial-number{font:12px var(--mono);color:#ffdf35}.avatar-tutorial-steps h3{font-size:21px;margin:10px 0}.avatar-tutorial-steps p{font-size:14px;line-height:1.7;color:#aaa;margin:0}.install-panel>.inline-link{margin-top:14px;color:#171717}.install-panel>.inline-link .ui-icon{filter:brightness(0)}
@media(max-width:900px){.avatar-tutorial-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 20px}}
@media(max-width:500px){.avatar-tutorial{padding-top:42px}.avatar-tutorial .section-line{flex-wrap:wrap}.avatar-tutorial .section-line:after{display:none}.avatar-tutorial-steps{grid-template-columns:1fr}.avatar-tutorial-steps li{display:grid;grid-template-columns:125px 1fr;column-gap:18px;align-content:start}.tutorial-visual{grid-row:1/4;margin:0}.tutorial-number{padding-top:3px}.avatar-tutorial-steps h3{font-size:18px;margin:6px 0}.avatar-tutorial-steps p{font-size:12px}.tutorial-control{font-size:9px;bottom:8px;left:5px;right:5px;padding:7px 2px}.tutorial-file{font-size:12px;padding:23px 8px}.tutorial-crop-frame{inset:8px}.tutorial-avatar{margin-top:-15px}}