/* Life home visual layer. Existing grid, module order and data calls are retained. */
.zl-life-home{--paper:#faf9f6;--nav:#faf9f6;--surface:#f1f2ec;--soft:#f5f5ef;--line:#e3e5dc;--ink:#28332d;--muted:#69746d;--terra:#456550;--sage:#526c58;--selected:#e8ede4;--edge:#a8b8a7;--zl-input:#fff;--on-accent:#fff;font-family:Geist,"PingFang SC","Microsoft YaHei",sans-serif}
.zl-life-home[data-theme="green"]{--paper:#f7faf5;--nav:#f7faf5;--line:#dce6d8;--terra:#3e694c;--zl-input:#fff}
.zl-life-home[data-theme="modern"]{--paper:#fafafa;--nav:#fafafa;--ink:#242729;--terra:#303b38;--sage:#57645f;--line:#e2e5e3;--zl-input:#fff}
.zl-life-home[data-theme="dark"]{--paper:#181818;--nav:#181818;--surface:#272727;--soft:#1f1f1f;--ink:#edece6;--muted:#b3b8af;--terra:#b4c9ae;--sage:#b4c9ae;--selected:#313131;--line:#383d38;--zl-input:#1f1f1f;--on-accent:#181818}
.zl-life-home .zl-header{background:var(--nav);box-shadow:none;border-bottom:1px solid var(--line)}
.zl-life-home .zl-header #zl-nav{background:transparent;border-color:transparent;box-shadow:none}
.zl-life-home .zl-header #zl-nav a{font-size:14px;font-weight:500;letter-spacing:0}
.zl-life-home .zl-header #zl-nav a[aria-current]{background:var(--selected);box-shadow:none;color:var(--terra)}
.zl-life-home .zl-edition-switch{background:var(--paper)}
.zl-life-home .zh-intro h1{font-size:30px;line-height:36px;font-weight:600;letter-spacing:-.02em;text-wrap:balance;background:linear-gradient(90deg,var(--ink),var(--muted));background-clip:text;-webkit-background-clip:text;color:transparent}
.zl-life-home .zh-intro p,.zl-life-home .zh-heading p{font-size:14px;line-height:20px;text-wrap:pretty}
.zl-life-home .zh-eyebrow{font-size:12px;line-height:16px;letter-spacing:.06em}
.zl-life-home .zh-panel{padding:24px;border-radius:16px;border:1px solid var(--line);background:var(--zl-input);box-shadow:0 4px 16px #25352b04}
.zl-life-home .zh-heading{margin-bottom:24px}
.zl-life-home .zh-heading h2,.zl-life-home .zh-side h2{font-size:18px;line-height:28px;font-weight:600}
.zl-life-home .zh-heading>a{font-size:12px;line-height:16px;color:var(--sage)}
.zl-life-home .zh-primary{padding:8px 12px;border-radius:8px;font-size:14px;line-height:24px;font-weight:600;background:var(--terra);color:var(--on-accent)!important;box-shadow:none}
.zl-life-home .zh-primary:hover{filter:brightness(.92)}
.zl-life-home .zh-primary:active{transform:scale(.98)}
.zl-life-home .zh-feature>img,.zl-life-home .zh-carousel{border-radius:8px}
.zl-life-home .zh-feature h3{font-size:18px;line-height:28px;font-weight:600}
.zl-life-home .zh-discussion h3,.zl-life-home .zh-journal h3{font-size:16px;line-height:24px;font-weight:500}
.zl-life-home .zh-discussion small,.zl-life-home .zh-person span,.zl-life-home .zh-journal-meta,.zl-life-home .zh-journal-author{font-size:12px;line-height:16px}
.zl-life-home .zh-person{gap:8px}
.zl-life-home .zh-person img,.zl-life-home .zh-writers img{box-shadow:0 0 0 4px var(--paper)}
.zl-life-home .zh-replies{background:var(--soft);border-radius:8px;padding:8px;font-size:12px;line-height:16px}
.zl-life-home .zh-journal{background:var(--paper);border-radius:8px;border-color:var(--line);padding:16px}
.zl-life-home .zh-articles h3{font-size:18px;line-height:28px;font-weight:500}
.zl-life-home .zh-articles p,.zl-life-home .zh-side .zh-panel>p,.zl-life-home .zh-topics{font-size:14px;line-height:24px;text-wrap:pretty}
.zl-life-home .zh-articles small,.zl-life-home .zh-feature small,.zl-life-home .zh-writers small{font-size:12px;line-height:16px}
.zl-life-home .zh-guidelines{color:var(--muted)}
.zl-life-home .zh-guidelines h2{font-size:14px;line-height:20px}
.zl-life-home .zh-guidelines p{font-size:12px;line-height:20px}
.zl-life-home a,.zl-life-home button{transition:color .7s cubic-bezier(.32,.72,0,1),background-color .7s cubic-bezier(.32,.72,0,1),transform .7s cubic-bezier(.32,.72,0,1)}
.zl-life-home a:focus-visible,.zl-life-home button:focus-visible,.zl-life-home select:focus-visible{outline:2px solid var(--terra);outline-offset:4px}
@media(max-width:960px){.zl-life-home .zh-panel{padding:16px}}
@media(max-width:760px){.zl-life-home .zh-intro h1{font-size:24px;line-height:32px}.zl-life-home .zh-heading{margin-bottom:16px}}
@media(max-width:440px){.zl-life-home .zh-heading h2{font-size:18px;line-height:28px}.zl-life-home .zh-heading p{font-size:12px;line-height:16px}.zl-life-home .zh-articles h3{font-size:16px;line-height:24px}}
@media(prefers-reduced-motion:reduce){.zl-life-home a,.zl-life-home button{transition:none}}
.zl-life-home .zl-edition-tabs a[aria-current="page"]{background:var(--terra);color:var(--on-accent);box-shadow:none}
/* Small, self-contained vector vignette; no external requests or animation library. */
.zl-life-home .zh-intro{position:relative;min-height:240px;isolation:isolate}
.zl-life-home .zh-intro>div:not(.zl-spring-scene):not(.zh-actions){position:relative;z-index:2;max-width:48%}
.zl-life-home .zh-intro .zh-actions{position:relative;z-index:2;align-self:flex-end;margin-bottom:24px}
.zl-spring-scene{position:absolute!important;right:0;top:0;width:52%;height:100%;z-index:0;overflow:hidden;pointer-events:none}
.zl-spring-scene svg{display:block;width:100%;height:100%;opacity:.92}
.zl-scene-control{position:absolute;right:8px;top:8px;z-index:2;pointer-events:auto;display:flex;gap:4px;align-items:center;font-size:12px;color:var(--muted);cursor:pointer}
.zl-scene-control input{accent-color:var(--terra);width:12px;height:12px}
.zl-bicycle{animation:zl-cycle-drift 12s cubic-bezier(.32,.72,0,1) infinite alternate}
.zl-wheel{transform-box:fill-box;transform-origin:center;animation:zl-wheel-turn 4s linear infinite}
.zl-willow{transform-origin:40px 0;animation:zl-spring-sway 7s cubic-bezier(.32,.72,0,1) infinite alternate}
.zl-hair,.zl-scarf{transform-box:fill-box;transform-origin:right center;animation:zl-spring-sway 3s cubic-bezier(.32,.72,0,1) infinite alternate}
.zl-water{animation:zl-water-glimmer 5s cubic-bezier(.32,.72,0,1) infinite alternate}
.zl-petals{animation:zl-petals-drift 9s cubic-bezier(.32,.72,0,1) infinite alternate}
.zl-spring-scene:has(input:checked) svg *{animation-play-state:paused!important}
.zl-life-home[data-theme="dark"] .zl-spring-scene svg{opacity:.65}
@keyframes zl-cycle-drift{from{transform:translateX(-8px)}to{transform:translateX(16px)}}
@keyframes zl-wheel-turn{to{transform:rotate(360deg)}}
@keyframes zl-spring-sway{from{transform:rotate(-3deg)}to{transform:rotate(3deg)}}
@keyframes zl-water-glimmer{from{opacity:.35;transform:translateX(-4px)}to{opacity:.9;transform:translateX(4px)}}
@keyframes zl-petals-drift{from{transform:translate(-8px,-6px);opacity:.3}to{transform:translate(16px,12px);opacity:.9}}
@media(max-width:760px){.zl-life-home .zh-intro{min-height:320px;justify-content:flex-start}.zl-life-home .zh-intro>div:not(.zl-spring-scene):not(.zh-actions){max-width:100%}.zl-life-home .zh-intro .zh-actions{align-self:flex-start;margin-bottom:0}.zl-spring-scene{width:64%;height:160px;top:auto;bottom:0;right:-16px}.zl-scene-control{top:auto;bottom:4px}.zl-willow,.zl-petals,.zl-hair,.zl-scarf{animation:none}}
@media(prefers-reduced-motion:reduce){.zl-spring-scene svg *{animation:none!important}.zl-scene-control{display:none}}
/* One full-bleed spring setting: live typography and a live article cinema. */
.zl-life-home{overflow-x:clip}
.zl-life-home .zl-spring-hero{position:relative;isolation:isolate;width:100vw;margin-left:calc(50% - 50vw);min-height:600px;background:#faf9f6 url('images/spring-lakeside-hero.webp') center bottom/cover no-repeat;margin-bottom:32px}
.zl-spring-inner{max-width:1180px;min-height:600px;margin:auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);gap:64px;padding:64px 24px 144px;align-items:start}
.zl-spring-copy{position:relative;z-index:1;padding-top:8px;color:#293e34}
.zl-spring-copy h1{font-family:Geist,"PingFang SC","Microsoft YaHei",sans-serif;font-size:48px;line-height:1.2;font-weight:600;letter-spacing:-.03em;margin:16px 0 24px!important;text-wrap:balance}
.zl-spring-copy>p{font-size:18px;line-height:28px;color:#4d6254;margin-bottom:24px!important}
.zl-spring-copy .zh-primary{gap:24px;box-shadow:0 4px 16px #2f493015}
.zl-spring-copy>small{display:block;font-size:12px;line-height:20px;letter-spacing:.08em;color:#61715e;margin-top:24px}
.zl-spring-cinema{position:relative;z-index:1;margin-top:16px;min-width:0}
.zl-cinema-label{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600;letter-spacing:.08em;color:#3d574a;padding:0 8px 12px}
.zl-cinema-label small{margin-left:auto;font-size:12px;font-weight:400;letter-spacing:0}
.zl-cinema-screen{position:relative;aspect-ratio:16/10;padding:8px;border-radius:8px;background:#f6f4e8;box-shadow:0 16px 40px #2a453126,0 0 0 1px #73857455}
.zl-cinema-screen .zl-hero-slides{height:100%;width:100%;border-radius:4px;overflow:hidden}
.zl-cinema-screen .zl-hero-slide{height:100%}
.zl-cinema-screen .zl-hero-slide>img{height:100%;width:100%;object-fit:cover}
.zl-cinema-screen .zl-slide-caption{left:24px;right:24px;bottom:64px}
.zl-cinema-screen .zl-slide-caption h2{font-family:inherit;font-size:24px;line-height:32px;font-weight:500;letter-spacing:0}
.zl-cinema-screen .zl-slide-caption small{font-size:12px}
.zl-cinema-screen .zl-slide-controls{left:24px;right:24px;bottom:16px}
.zl-cinema-feet{position:relative;height:48px;z-index:-1}
.zl-cinema-feet:before,.zl-cinema-feet:after{content:"";position:absolute;top:0;width:8px;height:48px;background:#7e8b77;box-shadow:4px 0 #adb59c}
.zl-cinema-feet:before{left:12%;transform:skew(-12deg)}.zl-cinema-feet:after{right:12%;transform:skew(12deg)}
.zl-spring-petals{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:2}
.zl-spring-petals i{position:absolute;left:46%;top:24%;width:8px;height:4px;border-radius:100% 0;background:#e6bcb3;opacity:.6;animation:zl-hero-petal 10s cubic-bezier(.32,.72,0,1) infinite alternate}
.zl-spring-petals i:nth-child(2){left:7%;top:56%;animation-delay:-4s}.zl-spring-petals i:nth-child(3){left:92%;top:72%;animation-delay:-7s}
@keyframes zl-hero-petal{from{transform:translate(0,0) rotate(0);opacity:.2}to{transform:translate(40px,64px) rotate(120deg);opacity:.7}}
.zl-life-home[data-theme="dark"] .zl-spring-hero{background-color:var(--paper)}
.zl-life-home[data-theme="dark"] .zl-spring-hero:after{content:"";position:absolute;inset:0;background:#1818183d;z-index:-1}
@media(min-width:1800px){.zl-life-home .zl-spring-hero{background-size:100% auto}}
@media(max-width:960px){.zl-spring-inner{gap:32px;padding-top:48px}.zl-spring-copy h1{font-size:36px;line-height:40px}.zl-cinema-screen .zl-slide-caption h2{font-size:20px;line-height:28px}.zl-cinema-label small{display:none}}
@media(max-width:760px){.zl-life-home .zl-spring-hero{min-height:0;background-position:36% bottom;background-size:auto 100%;margin-bottom:24px}.zl-spring-inner{grid-template-columns:minmax(0,1fr);gap:32px;min-height:0;padding:32px 24px 160px}.zl-spring-copy{padding-top:0}.zl-spring-copy h1{font-size:36px;line-height:40px;margin:12px 0 16px!important}.zl-spring-copy h1 br{display:none}.zl-spring-copy>p{font-size:16px;line-height:24px;margin-bottom:16px!important}.zl-spring-copy>p br{display:none}.zl-spring-copy>small{margin-top:16px}.zl-spring-cinema{margin-top:0}.zl-cinema-screen{aspect-ratio:16/11}.zl-cinema-screen .zl-slide-caption{left:16px;right:16px;bottom:56px}.zl-cinema-screen .zl-slide-caption h2{font-size:18px;line-height:28px}.zl-cinema-screen .zl-slide-controls{left:12px;right:12px}.zl-cinema-feet{height:32px}.zl-cinema-feet:before,.zl-cinema-feet:after{height:32px}.zl-spring-petals{display:none}}
@media(prefers-reduced-motion:reduce){.zl-spring-petals i{animation:none}}

.zl-spring-motion{position:absolute;right:24px;bottom:16px;display:flex;gap:4px;align-items:center;color:#52674f;font-size:12px;z-index:3;cursor:pointer}
.zl-spring-motion input{accent-color:#456550}
.zl-spring-hero:has(.zl-spring-motion input:checked) .zl-spring-petals i{animation-play-state:paused}
@media(max-width:760px){.zl-life-home .zl-spring-hero{background-color:#fcf8ed;background-size:auto 300px;background-position:33% bottom}.zl-spring-inner{padding-bottom:200px}.zl-spring-motion{display:none}}
@media(prefers-reduced-motion:reduce){.zl-spring-motion{display:none}}
/* An organic projection surface, floating in the landscape rather than on a stand. */
.zl-cinema-screen{padding:0;aspect-ratio:16/10;background:transparent;border-radius:45% 12% 36% 10% / 13% 27% 15% 30%;box-shadow:none;filter:drop-shadow(0 12px 16px #45634e18);overflow:hidden;isolation:isolate}
.zl-cinema-screen .zl-hero-slides{border-radius:inherit;overflow:hidden}
.zl-cinema-screen .zl-hero-slide{border-radius:inherit;overflow:hidden}
.zl-cinema-screen .zl-hero-slide>img{border-radius:inherit}
.zl-cinema-screen .zl-slide-caption{left:40px;right:40px;bottom:80px}
.zl-cinema-screen .zl-slide-caption h2{font-size:24px;line-height:32px;text-wrap:balance}
.zl-cinema-screen .zl-slide-controls{left:40px;right:48px;bottom:32px}
.zl-cinema-feet{display:none}
.zl-cinema-label{padding-left:40px;padding-right:40px}
@media(max-width:960px){.zl-cinema-screen .zl-slide-caption h2{font-size:20px;line-height:28px}}
@media(max-width:760px){.zl-cinema-screen{aspect-ratio:16/12;border-radius:38% 10% 30% 8% / 10% 24% 12% 22%}.zl-cinema-label{padding-left:24px;padding-right:24px}.zl-cinema-screen .zl-slide-caption{left:24px;right:24px;bottom:72px}.zl-cinema-screen .zl-slide-caption h2{font-size:18px;line-height:28px}.zl-cinema-screen .zl-slide-controls{left:24px;right:32px;bottom:24px}}
.zl-cinema-screen{border-radius:46% 54% 40% 60% / 25% 36% 64% 75%}
.zl-cinema-screen .zl-slide-caption{left:15%;right:12%;bottom:96px}
.zl-cinema-screen .zl-slide-controls{left:22%;right:20%;bottom:40px}
@media(max-width:760px){.zl-cinema-screen{border-radius:42% 58% 38% 62% / 24% 30% 70% 76%}.zl-cinema-screen .zl-slide-caption{left:14%;right:12%;bottom:88px}.zl-cinema-screen .zl-slide-controls{left:20%;right:18%;bottom:32px}}
.zl-cinema-screen .zl-slide-caption{background:transparent;box-shadow:none;text-shadow:0 2px 8px #0009}
.zl-cinema-screen .zl-slide-controls{left:30%;right:16%;bottom:48px}
@media(max-width:760px){.zl-cinema-screen .zl-slide-controls{left:28%;right:14%;bottom:40px}}
/* Frosted perimeter outside the projection; the live image remains crisp. */
.zl-spring-cinema:after{content:"";position:absolute;top:24px;right:-12px;bottom:-12px;left:-12px;z-index:0;pointer-events:none;border-radius:46% 54% 40% 60% / 25% 36% 64% 75%;background:rgba(255,255,255,.24);border:1px solid rgba(255,255,255,.58);box-shadow:inset 0 0 24px rgba(255,255,255,.28),0 12px 32px rgba(70,99,80,.12);-webkit-backdrop-filter:blur(12px) saturate(1.12);backdrop-filter:blur(12px) saturate(1.12)}
.zl-cinema-label,.zl-cinema-screen{position:relative;z-index:1}
.zl-life-home[data-theme="dark"] .zl-spring-cinema:after{background:rgba(235,244,231,.14);border-color:rgba(255,255,255,.32)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.zl-spring-cinema:after{background:rgba(247,248,237,.52)}}
@media(max-width:760px){.zl-spring-cinema:after{top:24px;left:-8px;right:-8px;bottom:-8px;border-radius:42% 58% 38% 62% / 24% 30% 70% 76%;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}}

/* Visible, staggered petals drift down instead of barely oscillating in place. */
.zl-spring-petals i{top:-24px;left:5%;width:14px;height:8px;border-radius:90% 10% 80% 20%;background:#ce8c85;box-shadow:0 1px 2px #694f4120;opacity:0;animation:zl-petal-fall 16s cubic-bezier(.3,.45,.7,.8) infinite;animation-delay:-3s;will-change:transform,opacity}
.zl-spring-petals i:nth-child(2){top:-24px;left:15%;animation-duration:19s;animation-delay:-13s}
.zl-spring-petals i:nth-child(3){top:-24px;left:26%;animation-duration:15s;animation-delay:-7s}
.zl-spring-petals i:nth-child(4){left:36%;animation-duration:21s;animation-delay:-17s;width:11px;height:7px}
.zl-spring-petals i:nth-child(5){left:47%;animation-duration:17s;animation-delay:-11s}
.zl-spring-petals i:nth-child(6){left:56%;animation-duration:20s;animation-delay:-4s;width:12px;height:8px}
.zl-spring-petals i:nth-child(7){left:66%;animation-duration:18s;animation-delay:-15s}
.zl-spring-petals i:nth-child(8){left:75%;animation-duration:22s;animation-delay:-8s;width:11px;height:7px}
.zl-spring-petals i:nth-child(9){left:84%;animation-duration:16s;animation-delay:-12s}
.zl-spring-petals i:nth-child(10){left:93%;animation-duration:19s;animation-delay:-6s;width:12px;height:8px}
@keyframes zl-petal-fall{0%{transform:translate3d(-24px,0,0) rotate(-30deg);opacity:0}12%{opacity:.85}48%{transform:translate3d(24px,300px,0) rotate(110deg);opacity:.85}88%{opacity:.65}100%{transform:translate3d(64px,660px,0) rotate(280deg);opacity:0}}
@media(prefers-reduced-motion:reduce){.zl-spring-petals{display:none}.zl-spring-petals i{animation:none;will-change:auto}}
