:root{color-scheme:dark;--ink:#f2f4f5;--muted:#c1ced7;--line:rgba(221,235,245,.3);--accent:#a6dcf8;--display:"Bahnschrift","Avenir Next Condensed","DIN Alternate","Helvetica Neue",sans-serif;--body:"Microsoft YaHei UI","PingFang SC","Noto Sans CJK SC",sans-serif}
*{box-sizing:border-box}
body{margin:0;background:#172632;color:var(--ink);font-family:var(--body)}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
a,button{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:6px}
.showroom{position:relative;isolation:isolate;width:100%;min-height:max(900px,62.5vw);height:100svh;overflow:hidden}
.room-scene{position:absolute;inset:0;z-index:-1;background:#172632}
.room-scene picture,.room-scene img{display:block;width:100%;height:100%}
.room-scene img{object-fit:cover;object-position:center center}
.masthead{position:absolute;left:4.6%;right:4.6%;top:35px;display:flex;align-items:center;gap:36px;min-height:42px}
.brand{display:flex;align-items:center;gap:15px;flex-shrink:0}
.brand img{width:104px;height:auto}
.header-nav{display:flex;gap:36px;margin-left:auto;font-size:13px;letter-spacing:.06em}
.header-nav a{padding:10px 0;border-bottom:1px solid transparent;transition:border-color .18s ease,color .18s ease}
.header-nav a:hover{border-bottom-color:var(--accent);color:var(--accent)}
.experience-label{margin-left:22px;font-family:var(--display);font-size:9px;line-height:1.5;letter-spacing:.2em;color:#b6c7d4}
.intro{position:absolute;left:4.6%;top:19%;max-width:32.5vw}
.eyebrow{display:flex;align-items:center;gap:13px;margin:0 0 22px;font-size:12px;letter-spacing:.11em;color:#d4e1eb}
.slogan-title{font-size:clamp(48px,4.03vw,60px);font-weight:700;line-height:1.28;letter-spacing:.025em;margin:0}
.slogan-title>span{display:block;white-space:nowrap}
.slogan-gradient{color:#65bcf2;background:linear-gradient(180deg,#c8ebff 0%,#8fd4fa 42%,#299bef 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.product-controls{position:absolute;left:4.6%;top:55%;width:340px}
.product-switch{display:flex;gap:28px;width:max-content;border-bottom:1px solid var(--line)}
.product-switch button{position:relative;display:flex;align-items:center;gap:9px;appearance:none;border:0;background:transparent;min-height:44px;padding:10px 0 14px;cursor:pointer;color:#b1c3d0;white-space:nowrap;transition:color .18s ease}
.switch-model{font-family:var(--display);font-size:23px;font-weight:500;letter-spacing:-.035em;line-height:1}
.switch-index{font-family:var(--display);font-size:9px;letter-spacing:.04em;color:#a9bdcc;align-self:flex-start;margin-top:2px}
.switch-marker{width:4px;height:4px;border:1px solid #a9bdcc;border-radius:50%;margin-left:2px}
.product-switch button[aria-pressed="true"]{color:#f6f9fb}
.product-switch button[aria-pressed="true"] .switch-marker{background:var(--accent);border-color:var(--accent)}
.product-switch button[aria-pressed="true"]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--accent)}
.product-switch button:hover{color:var(--ink)}
.product-switch button[aria-disabled="true"]{cursor:progress}
.enter-link{display:inline-flex;align-items:center;justify-content:space-between;gap:36px;min-height:44px;margin-top:23px;padding:12px 0;font-size:14px;letter-spacing:.035em}
.enter-link strong{font-family:var(--display);font-size:16px;font-weight:500;letter-spacing:-.02em;margin:0 3px}
.enter-link svg{fill:none;stroke:currentColor;stroke-width:1.4;transition:transform .18s ease}
.enter-link:hover{color:var(--accent)}
.enter-link:hover svg{transform:translateX(4px)}
.scene-status{min-height:17px;font-size:12px;color:#c8d9e4;margin:9px 0 0;max-width:340px;line-height:1.6}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.collection-nav{position:absolute;left:4.6%;right:4.6%;bottom:31px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:50px}
.collection-nav>a{display:flex;flex-direction:column;gap:10px;padding-top:18px;border-top:1px solid var(--line);transition:border-color .18s ease}
.collection-index{display:flex;align-items:center;gap:13px;font-family:var(--display);font-size:9px;letter-spacing:.15em;color:#bacdd9}
.collection-index>span{font-size:11px;letter-spacing:.03em;color:var(--accent)}
.collection-title{font-size:17px;line-height:1.6;letter-spacing:.06em;display:flex;align-items:center;justify-content:space-between}
.collection-title>span{font-size:20px;font-weight:300;color:#bddff2;transition:transform .18s ease}
.collection-nav>a:hover{border-color:var(--accent)}
.collection-nav>a:hover .collection-title>span{transform:translate(2px,-2px)}
@keyframes reveal{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:no-preference){.masthead{animation:reveal .5s ease-out both}.eyebrow{animation:reveal .55s .08s ease-out both}.slogan-title{animation:reveal .55s .16s ease-out both}.product-controls{animation:reveal .55s .24s ease-out both}.collection-nav{animation:reveal .55s .32s ease-out both}}
@media(min-width:1056px) and (min-aspect-ratio:8/5) and (max-height:899px){.showroom{min-height:max(660px,62.5vw)}.intro{top:20%}.product-controls{top:56%}.collection-nav{bottom:26px}.collection-nav>a{padding-top:16px;gap:8px}.eyebrow{margin-bottom:17px}}
@media(min-width:1056px) and (min-aspect-ratio:8/5) and (max-width:1100px){.experience-label{display:none}.header-nav{gap:20px}.masthead{gap:22px}.product-controls{width:310px}.collection-nav{gap:28px}}
@media(width < 1056px), (aspect-ratio < 8/5){
  .showroom{height:auto;min-height:max(700px,100svh,216.4vw)}
  .masthead{left:22px;right:22px;top:max(25px,env(safe-area-inset-top));min-height:28px;gap:10px;justify-content:space-between}
  .brand{gap:0}.brand img{width:89px}  .header-nav,.experience-label{display:none}
  .intro{left:24px;right:24px;top:13%;max-width:none}
  .eyebrow{font-size:10px;letter-spacing:.07em;margin-bottom:17px}
  .slogan-title{font-size:clamp(42px,12.3vw,48px);line-height:1.25;letter-spacing:.025em}
  .product-controls{left:24px;right:24px;top:77%;width:auto;display:flex;flex-direction:column;align-items:center}
  .product-switch{gap:30px}.product-switch button{padding:8px 1px 11px;gap:7px}.switch-model{font-size:22px}.switch-index{font-size:8px}.switch-marker{width:3px;height:3px}
  .enter-link{margin-top:8px;padding:10px 0;gap:28px;font-size:13px}.enter-link strong{font-size:15px}.enter-link svg{width:18px;height:18px}
  .scene-status{position:absolute;top:-25px;text-align:center;max-width:100%;font-size:11px;margin:0}
  .collection-nav{left:24px;right:24px;bottom:max(19px,env(safe-area-inset-bottom));gap:15px}
  .collection-nav>a{gap:7px;padding-top:12px;min-height:56px}.collection-index{gap:5px;font-size:7px;letter-spacing:.02em;white-space:nowrap}.collection-index>span{font-size:8px}
  .collection-title{font-size:11px;letter-spacing:.015em;white-space:nowrap}.collection-title>span{font-size:13px;margin-left:3px}
}
@media(max-width:350px){.masthead{left:18px;right:18px}.brand img{width:78px}.intro{left:20px;right:20px}.eyebrow{font-size:9px}.collection-nav{left:20px;right:20px;gap:10px}.collection-title{font-size:10px}.collection-index{font-size:6px;gap:4px}.collection-index>span{font-size:7px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
