/* Quiet translucent fragments share the meadow and the site typography. */
#wind{display:grid;grid-template-columns:minmax(240px,.9fr) minmax(0,1.1fr);gap:clamp(40px,7vw,110px)}
.wind-copy{max-width:420px}
.wind-copy h2{white-space:nowrap}
.wind-copy .wind-intro{font-size:15px;line-height:2.2;opacity:.8}




.wind-copy .wind-footnote{font-size:11px;opacity:.5;letter-spacing:1px;margin-top:28px}
.wind-object{min-width:0;width:100%;max-width:490px;justify-self:center;text-align:center}
.leaf-stage{display:grid;align-items:center;min-height:400px;position:relative}
.leaf-waiting{display:grid;justify-items:center;gap:24px;color:#f1ecd7b3;font-size:13px;letter-spacing:3px}
.leaf-waiting svg{width:94px;height:94px;stroke-width:.65;animation:leaf-hover 7s ease-in-out infinite}
.leaf-waiting p{margin:0;line-height:2}
.leaf-card{text-align:left;position:relative;width:100%;padding:32px 38px 26px;color:#f1ecd7;background:linear-gradient(145deg,#253b2fc9,#14271fba);border:1px solid #e3e9cf26;border-radius:14px;box-shadow:0 16px 48px #07130e18;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);animation:leaf-land 420ms cubic-bezier(.22,.61,.36,1) both;overflow-wrap:anywhere}

.leaf-meta{display:flex;justify-content:space-between;font:10px/1.5 'Segoe UI','Microsoft YaHei',sans-serif;letter-spacing:2px;color:#d9e2c99c}
.leaf-card h3{font-weight:400;font-size:24px;letter-spacing:2px;line-height:1.6;margin:34px 0 24px}
.leaf-words{font-size:15px;line-height:2.3;letter-spacing:.5px;color:#f1ecd7d6;white-space:pre-line;margin:0 0 34px}
.leaf-caption{font-size:10px;letter-spacing:1px;line-height:1.8;color:#d9e2c98c;margin:18px 0 0;padding-top:14px;border-top:1px solid #dce5cc1c}
.leaf-image{display:block;width:100%;height:230px;object-fit:contain;background:#12231b40;border-radius:6px}
.leaf-card--image h3{font-size:19px;margin:16px 0}
.leaf-waves{height:55px;display:flex;align-items:center;justify-content:center;gap:4px;opacity:.45}
.leaf-waves i{width:2px;background:#ccd8b8}
.leaf-placeholder,.leaf-empty-media{font-size:12px;line-height:1.9;color:#d9e2c9b3;text-align:center}
.leaf-card audio{width:100%;margin-top:15px}
.pick-leaf{display:inline-flex;align-items:center;justify-content:center;gap:16px;min-width:164px;min-height:48px;padding:12px 25px;border:1px solid #eee9d570;border-radius:28px;margin:18px 0 0;background:#1c322540;backdrop-filter:blur(8px);font-size:14px;letter-spacing:3px;transition:background .25s,transform .25s}
.pick-leaf svg{width:20px;height:20px}
.pick-leaf:hover{background:#425840aa}.pick-leaf:active:not(:disabled){scale:1;background:#4a6050aa}
.pick-leaf:disabled{opacity:.55;cursor:default;transform:none;background:#1c322570}
.leaf-status{min-height:20px;font-size:10px;line-height:1.8;letter-spacing:1px;color:#f1ecd7aa;margin:14px 0 0}
@keyframes leaf-land{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
@keyframes leaf-hover{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@media(min-width:761px) and (max-width:1100px){header nav{gap:14px}header nav button{font-size:12px;letter-spacing:1px}.music-dock{left:46%;width:260px}.music-dock .music{width:250px}}
@media(max-width:760px){header{flex-wrap:wrap}header nav{width:100%;justify-content:center;gap:22px;margin-top:12px}.music-dock{left:auto;right:0;transform:none;width:40px}.music-dock .music{left:auto;right:0;transform:translateY(-12px)}.music-dock.expanded .music{transform:translateY(0)}#wind{grid-template-columns:minmax(0,1fr);gap:32px;padding:140px 32px 100px}.wind-copy{max-width:none;text-align:center}.wind-copy h2{font-size:29px;margin-bottom:16px}.wind-copy .section-number{margin-bottom:12px}.wind-copy .wind-intro{font-size:13px}.wind-copy .wind-footnote{display:none}.leaf-stage{min-height:325px}.leaf-card{padding:26px 24px 22px}.leaf-card h3{font-size:21px}.leaf-words{font-size:14px}.leaf-image{height:220px}.wind-object{max-width:420px}.pick-leaf{margin-top:26px}}
@media(prefers-reduced-motion:reduce){.leaf-card{animation:none;transform:none}.leaf-waiting svg{animation:none}}
/* Leave the narrow-screen picking area clear of the fixed social shortcuts. */
@media(max-width:760px){body:has(#wind.is-current) .social{visibility:hidden}}



.leaf-browse{display:flex;align-items:center;justify-content:center;gap:18px;margin:12px 0 0;font-size:11px;letter-spacing:1px;color:#f1ecd7b3}
.leaf-browse[hidden]{display:none}.leaf-browse button{min-height:44px;padding:8px}.leaf-browse button:disabled{opacity:.25;cursor:default}.leaf-browse button:active:not(:disabled){scale:1}.leaf-browse span{font-size:10px;font-variant-numeric:tabular-nums}

/* Stable display area: the controls never move when image proportions change. */
#wind{grid-template-columns:minmax(240px,.65fr) minmax(0,1.65fr);gap:clamp(28px,4vw,70px);padding:110px max(var(--edge),5vw) 75px;overflow-anchor:none}
.wind-object{max-width:100%;min-width:0}
.leaf-stage{height:clamp(360px,calc(100svh - 295px),760px);min-height:0;align-items:stretch}
.leaf-card{height:100%;min-height:0;overflow:auto}
.leaf-card--image{display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;padding:18px 20px 12px;overflow:hidden}
.leaf-card--image h3{font-size:16px;margin:8px 0 12px;line-height:1.5}
.leaf-card--image .leaf-caption{margin:8px 0 0;padding-top:8px}
.leaf-image-button{display:block;width:100%;height:100%;min-height:0;padding:0;cursor:zoom-in;border-radius:6px}
.leaf-image-button:active:not(:disabled){scale:1}
.leaf-image{width:100%;height:100%;object-fit:contain;background:transparent}
.leaf-browse{display:grid;grid-template-columns:100px 150px 100px;gap:6px;height:44px;margin-top:10px}
.leaf-browse[hidden]{display:grid;visibility:hidden}
.leaf-browse button{width:100%;height:44px}
.pick-leaf{margin-top:10px}
.leaf-status{height:36px;margin:8px 0 0;overflow:hidden}
.leaf-viewer{position:fixed;inset:0;width:94vw;max-width:1800px;height:92svh;max-height:92svh;padding:0;border:1px solid #eee9d530;border-radius:12px;background:#12221ef5;color:#f1ecd7;overflow:hidden}
.leaf-viewer::backdrop{background:#06100cda;backdrop-filter:blur(8px)}
.leaf-viewer-bar{height:56px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;border-bottom:1px solid #eee9d51c}
.leaf-viewer-bar button{min-height:44px;padding:8px 14px;font-size:13px}
.leaf-viewer-viewport{height:calc(100% - 56px);width:100%;overflow:auto;overscroll-behavior:contain}
.leaf-viewer-viewport img{display:block;width:100%;height:100%;object-fit:contain}
.leaf-viewer.is-zoomed .leaf-viewer-viewport img{width:auto;height:auto;max-width:none;max-height:none;margin:auto}
@media(max-width:760px){#wind{grid-template-columns:minmax(0,1fr);padding:125px 20px 85px;gap:24px}.wind-object{max-width:100%}.leaf-stage{height:clamp(370px,60svh,640px);min-height:0}.leaf-card--image{padding:14px 12px 10px}.leaf-image{height:100%}.leaf-browse{grid-template-columns:90px minmax(100px,140px) 90px;gap:0}.wind-copy .wind-intro{line-height:1.9}.leaf-viewer{width:98vw;height:94svh;max-height:94svh}.leaf-viewer-bar{padding:0 6px}}
/* Longer notes scroll inside the fixed card without moving the browsing controls. */
.leaf-card--text{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#dce5cc55 transparent;padding:28px clamp(24px,4vw,64px)}
.leaf-card--text .leaf-words{max-width:42em;margin:0 auto 24px;line-height:2.15;white-space:pre-wrap}
.leaf-card--text h3{margin:24px 0;font-size:22px}
.leaf-card--text:focus-visible{outline:1px solid #eee9d580;outline-offset:3px}
/* Keep mixed Chinese, Latin text and numerals on a consistent baseline. */
.leaf-card--text .leaf-words{font-family:'Microsoft YaHei','PingFang SC','Noto Sans CJK SC',sans-serif;font-variant-numeric:lining-nums proportional-nums;letter-spacing:.2px;margin-top:26px;font-size:15px;font-weight:400}
@media(max-width:760px){.leaf-card--text .leaf-words{font-size:14px;margin-top:22px}}
/* Center short notes in the available space; long notes retain a reachable start. */
.leaf-card--text{display:flex;flex-direction:column}
.leaf-card--text .leaf-meta,.leaf-card--text .leaf-caption{flex-shrink:0}
.leaf-card--text .leaf-words{flex:0 0 auto;width:100%;max-width:42em;text-align:center;margin: auto; padding:28px 0;}
.leaf-card--text .leaf-caption{margin-top:0}
@media(max-width:760px){.leaf-card--text .leaf-words{margin:auto;padding:24px 0}}