/* ZhuXiang V10: original ornamental glass-fiber textures, bamboo, white-gold cloud, and lightweight motion. */
:root{--zx-ivory:#fbf8f0;--zx-warmgold:#d4b47c;--zx-dark:#0d3432}
html{scroll-behavior:smooth}body{background:radial-gradient(ellipse at 86% 7%,#fffaf1 0%,#f5f8f3 55%,#f6f4ed 100%)}
body:before{content:"";pointer-events:none;position:fixed;inset:0;background:repeating-linear-gradient(95deg,rgba(195,158,104,.012) 0 1px,transparent 1px 8px),repeating-linear-gradient(2deg,rgba(255,255,255,.14) 0 1px,transparent 1px 9px);z-index:0}
.zx-ambience{position:fixed;inset:0;z-index:7;pointer-events:none;overflow:hidden}
.zx-fall{position:absolute;inset:0;overflow:hidden}
.zx-speck{position:absolute;top:-8vh;left:var(--x);width:var(--size);height:var(--size);border-radius:55% 4% 55% 4%;opacity:0;background:linear-gradient(138deg,#fffefa 0%,#f3d8a1 50%,#b48855 100%);box-shadow:0 0 11px rgba(248,223,165,.3);transform:rotate(22deg);animation:zx-fall var(--duration) linear var(--delay) infinite}
.zx-speck.pearl{border-radius:50%;background:radial-gradient(circle at 27% 25%,#fff,#fcf5de 44%,#d6b177 100%)}
@keyframes zx-fall{0%{opacity:0;transform:translate3d(0,-30px,0) rotate(0deg)}14%{opacity:.52}85%{opacity:.35}100%{opacity:0;transform:translate3d(var(--drift),108vh,0) rotate(390deg)}}
.zx-top-cloud{position:absolute;top:0;right:0;width:48%;height:150px;background:url('assets/ornaments/clouds.svg') center / 100% 100% no-repeat;opacity:.25}
.app-shell{position:relative;z-index:1;box-shadow:0 20px 80px rgba(26,57,50,.07)}
.sidebar{background:linear-gradient(150deg,#0a2c31 0%,#123f3d 64%,#0e3430 100%);border-right:1px solid rgba(224,192,130,.24);color:#f6eee0;overflow:hidden}
.sidebar:before{content:"";position:absolute;inset:auto -55px 25px -30px;height:340px;background:url('assets/ornaments/bamboo.svg') center bottom/260px auto no-repeat;opacity:.22;transform:rotate(-9deg);pointer-events:none}
.sidebar:after{content:"";position:absolute;inset:auto -10px 3px 8px;height:54px;background:url('assets/ornaments/clouds.svg') center bottom / 100% auto no-repeat;opacity:.45;pointer-events:none}
.sidebar>*{position:relative;z-index:1}.brand-lockup{margin-bottom:56px}.brand-sigil{background:rgba(250,239,205,.12);border:1px solid rgba(237,218,180,.52);color:#f9e5b9;box-shadow:0 0 18px rgba(243,217,157,.08)}
.brand-lockup b{color:#fff8eb}.brand-lockup small,.side-caption,.sidebar-bottom small{color:#c0cec6}.side-caption{color:#c6bb9c}.nav-btn{color:#bfd5d0;transition:color .25s,background .25s,transform .25s}.nav-btn:hover{background:rgba(253,248,231,.1);color:#fff2d7;transform:translateX(3px)}.nav-btn.active{background:linear-gradient(99deg,rgba(236,214,166,.18),rgba(240,251,245,.06));border:1px solid rgba(234,211,160,.17);color:#ffebc1}.nav-count{background:rgba(239,213,164,.17);color:#f9e3bd}.side-divider{background:rgba(255,249,230,.19)}.side-assistant{border-color:rgba(251,243,225,.21);background:rgba(255,255,255,.065);color:#e8e8d8;backdrop-filter:blur(12px)}.assistant-mark{background:rgba(226,200,156,.18);color:#ebcc8e}.side-assistant small{color:#afc6bf}.sidebar-bottom{border-top-color:rgba(255,247,227,.17);color:#efdab4}.version-indicator{background:#ecc987;box-shadow:0 0 7px #dbbb87}
.topbar{background:rgba(252,250,245,.70);backdrop-filter:blur(20px) saturate(1.2);-webkit-backdrop-filter:blur(20px) saturate(1.2);border-bottom:1px solid rgba(208,191,151,.36)}
.page{position:relative}.page-intro{position:relative;isolation:isolate}.page-intro:after{content:"";position:absolute;top:-10px;right:0;width:210px;height:110px;background:url('assets/ornaments/clouds.svg') center /cover no-repeat;opacity:.32;z-index:-1}
.hero-shell{background:#153d36;isolation:isolate;border-radius:26px;box-shadow:0 32px 60px rgba(26,48,43,.17),inset 0 0 0 1px rgba(248,225,175,.3);border:1px solid rgba(247,217,163,.4)}
.hero-shell:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(100deg,rgba(9,39,40,.96) 0%,rgba(11,48,47,.89) 40%,rgba(20,50,43,.40) 72%,rgba(22,40,32,.48) 100%),url('assets/rites/stages/rite-09-02.webp') center 45% / cover no-repeat;transform:scale(1.01);z-index:-2}
.hero-shell:after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:repeating-linear-gradient(100deg,rgba(255,255,255,.045) 0 1px,transparent 1px 7px),radial-gradient(circle at 68% 17%,rgba(240,208,134,.3),transparent 47%);mix-blend-mode:screen;opacity:.7;z-index:-1}
.zx-hero-waves{position:absolute;inset:auto 0 -8px 0;height:134px;background:url('assets/ornaments/clouds.svg') center / cover no-repeat;z-index:1;opacity:.81;animation:zx-cloud-breathe 9s ease-in-out infinite;pointer-events:none}
@keyframes zx-cloud-breathe{50%{transform:translateX(12px);opacity:.43}}
.hero-copy{z-index:3}.hero-copy h1{text-shadow:0 8px 35px rgba(2,19,16,.4)}.hero-copy h1 em{color:#ffe2a1}.hero-description{color:#f0ebe2}.btn-gold{background:linear-gradient(115deg,#fff9ea,#e6c27e 66%,#cf9a53);color:#244136;border:1px solid rgba(255,255,255,.55);box-shadow:0 8px 20px rgba(209,156,77,.20);border-radius:99px;transition:transform .23s,box-shadow .23s}.btn-gold:hover{transform:translateY(-3px);box-shadow:0 13px 30px rgba(247,204,129,.33)}.btn-ghost-light{border-radius:99px;background:rgba(255,255,255,.09);backdrop-filter:blur(10px)}
.hero-illustration{z-index:2;background:linear-gradient(135deg,rgba(255,255,255,.065),rgba(217,180,111,.11));border-left:1px solid rgba(246,225,178,.16);backdrop-filter:blur(5px)}
.zx-hero-city{position:absolute;right:25px;bottom:18px;z-index:4;display:flex;gap:8px;font-size:10px;letter-spacing:1px;color:#f9e4b9;opacity:.84}
.zx-hero-city span{border:1px solid rgba(242,211,151,.33);background:rgba(11,46,42,.3);border-radius:100px;padding:4px 9px;backdrop-filter:blur(9px)}
.hero-shell .glass-halo{opacity:.65}.stats-row{border-bottom:1px solid rgba(197,157,94,.22)}
.feature-card,.zx-rite-card,.story-card,.zxv9-story-panel,.source-card,.evidence-box,.lookup-panel{backdrop-filter:blur(13px) saturate(1.18);-webkit-backdrop-filter:blur(13px) saturate(1.18);box-shadow:inset 0 1px 0 rgba(255,255,255,.72),0 12px 30px rgba(18,57,48,.06);border:1px solid rgba(202,183,144,.37)!important}
.feature-card{border-radius:22px;min-height:287px;overflow:hidden;transition:transform .4s cubic-bezier(.2,.8,.1,1),box-shadow .4s}.feature-card:hover{transform:translateY(-7px) scale(1.01);box-shadow:0 26px 40px rgba(31,54,45,.18)}
.feature-card:after{content:"";position:absolute;inset:auto -15% -45% 18%;height:180px;transform:rotate(-12deg);border:1px solid rgba(254,253,243,.4);border-radius:50%;box-shadow:0 -20px 40px rgba(250,238,217,.08);pointer-events:none}
.feature-dark{background:linear-gradient(135deg,rgba(16,71,66,.94),rgba(12,48,52,.96));color:#fffbec}.feature-clay{background:linear-gradient(145deg,rgba(255,250,241,.94),rgba(226,218,191,.86));color:#493e31}.feature-sand{background:linear-gradient(145deg,rgba(253,247,233,.93),rgba(222,237,222,.75));color:#375046}
.rites-grid{gap:20px}.zx-rite-card.zx-photo-card{border-radius:22px!important;background:linear-gradient(160deg,rgba(255,254,250,.94),rgba(249,248,241,.92));transition:transform .38s,box-shadow .38s,filter .38s}.zx-rite-card.zx-photo-card:hover{transform:translateY(-6px);box-shadow:0 24px 45px rgba(20,56,49,.12);filter:saturate(1.08)}
.zx-photo-thumb{overflow:hidden;border-radius:16px}.zx-photo-thumb img{transition:transform .8s cubic-bezier(.21,.7,.14,1),filter .5s;filter:contrast(1.02) saturate(.98)}.zx-photo-card:hover .zx-photo-thumb img{transform:scale(1.072);filter:contrast(1.06) saturate(1.04)}
.zxv9-story-panel{border-radius:26px;background:linear-gradient(120deg,rgba(255,253,246,.89),rgba(242,240,228,.75))}.zxv9-link-card{transition:transform .3s,box-shadow .3s}.zxv9-link-card:hover{transform:translateY(-5px) rotate(-.3deg)}
.zxv9-story-panel .zxv9-story-head h2{font-size:clamp(22px,2.8vw,31px)}
.zxv9-story-shell{position:relative}.zxv9-story-shell:before{content:"";position:absolute;width:225px;height:370px;right:-65px;top:-145px;background:url('assets/ornaments/bamboo.svg') center/contain no-repeat;pointer-events:none;opacity:.38;z-index:1}
.detail-modal{background:linear-gradient(135deg,rgba(255,254,251,.96),rgba(252,249,240,.94));backdrop-filter:blur(22px);border:1px solid rgba(214,186,132,.5);box-shadow:0 36px 80px rgba(7,26,24,.25);border-radius:22px}
.zx-source-figure{overflow:hidden;border-radius:17px}.zx-source-figure img{transition:opacity .23s ease,transform .6s ease;object-fit:cover}.zx-source-figure img.zx-switching{opacity:.30;transform:scale(1.018)}
.zx-step-choice{transition:transform .25s,box-shadow .25s}.zx-step-choice:hover{transform:translateY(-2px)}
.zx-reveal{opacity:0;transform:translateY(24px);transition:opacity .68s ease,transform .68s cubic-bezier(.18,.72,.16,1)}.zx-reveal.zx-inview{opacity:1;transform:translateY(0)}
.zx-photo-card .zx-photo-thumb img{aspect-ratio:1.7;object-fit:cover}
.zx-v10-city-banner{display:flex;align-items:center;gap:15px;margin:16px 0 24px;padding:13px 24px;background:linear-gradient(100deg,rgba(253,248,231,.75),rgba(232,245,239,.64));border:1px solid rgba(206,181,132,.4);border-radius:14px;color:#6e6b5d;font-size:11px;letter-spacing:1px}.zx-v10-city-banner img{width:150px;opacity:.86}.zx-v10-city-banner strong{font-family:serif;color:#806343}
@media(max-width:1150px){.hero-copy{padding-left:42px}.zx-hero-city{font-size:9px}.feature-card{min-height:270px}}
@media(max-width:720px){.sidebar{display:none}.hero-shell{border-radius:20px;min-height:700px}.hero-copy{padding:32px 24px 16px}.hero-copy h1{font-size:clamp(35px,11vw,47px)}.hero-copy .hero-description{max-width:300px}.hero-illustration{background:transparent;border-left:0;backdrop-filter:none;bottom:20px;max-height:230px}.zx-hero-city{bottom:13px;left:12px;right:auto;gap:4px}.zx-hero-city span{font-size:8px;padding:3px 5px}.zx-hero-waves{height:90px}.feature-card{border-radius:17px}.zx-v10-city-banner{gap:6px;padding:12px;font-size:9px}.zx-v10-city-banner img{width:90px}.mobile-dock{grid-template-columns:repeat(6,minmax(0,1fr));backdrop-filter:blur(20px);background:rgba(255,252,246,.95)}.mobile-dock .dock-btn small{font-size:9px}.zx-speck{opacity:.25}.zxv9-story-shell:before{opacity:.12}.zx-rite-card.zx-photo-card{border-radius:15px!important}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.zx-speck{display:none}.zx-reveal{opacity:1;transform:none}}
@media print{.zx-ambience,.zx-hero-city,.zx-v10-city-banner{display:none!important}}