:root {
  color-scheme:light;
  font-family:"Microsoft YaHei",system-ui,sans-serif;
  color:#fcf9e9;
  background:#366b70;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0}
button,input,select{font:inherit}
button,a,input,select{-webkit-tap-highlight-color:transparent}
button,a,select{cursor:pointer}
a{color:inherit;text-decoration:none}
#pond-background,#aquarium-canvas{position:fixed;inset:0;width:100%;height:100%;pointer-events:none}
#pond-background{z-index:0}
#aquarium-canvas{z-index:1}
main{position:relative;z-index:2;pointer-events:none}
main button,main a,main input,main select,main label{pointer-events:auto}
.topbar{width:min(1120px,82%);height:88px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:20px;text-shadow:0 1px 5px #24454a}
.brand{font-family:"Noto Serif SC","Songti SC",SimSun,serif;font-size:26px;font-weight:bold}
.brand span{font-family:Georgia,serif;font-size:21px;margin-left:6px}
.topbar nav{display:flex;align-items:center;gap:28px;font-size:12px}
#motion-toggle{color:inherit;border:1px solid #e5efd19c;border-radius:24px;padding:9px 16px;background:#27585173;text-shadow:0 1px 2px #19332f}
.hero{height:clamp(380px,35vw,600px);max-width:820px;width:65%;margin:auto;text-align:center;padding:clamp(42px,6vw,100px) 0 0;text-shadow:0 2px 7px #25494d,0 0 28px #174945}
.eyebrow{font-size:10px;letter-spacing:.23em;color:#f7e9bd}
h1{font-family:"Noto Serif SC","Songti SC",SimSun,serif;font-weight:400;font-size:clamp(36px,4.7vw,78px);letter-spacing:.06em;margin:22px 0 18px}
.hero-lede{font-size:14px;line-height:1.9;letter-spacing:.13em}
.hero-summary{display:flex;justify-content:center;gap:23px;margin-top:24px;font-size:11px}
.hero-summary b{font-family:Georgia,serif;font-size:27px;margin-right:6px;font-weight:400}
.library{width:min(1320px,90%);margin:auto;padding-bottom:60px;background:none;border:0;box-shadow:none}
.library-controls{display:flex;align-items:center;gap:14px;flex-wrap:wrap;width:94%;margin:auto;padding:11px 17px;background:#f4f4e4ed;color:#304d43;box-shadow:0 4px 20px #24474740;border-radius:9px;pointer-events:auto}
.search-shell{display:flex;align-items:center;gap:8px;flex:1 1 170px;min-width:120px}
.search-shell span{font-size:23px}
input{min-width:0;width:100%;outline:none;border:0;background:transparent;padding:9px 0;font-size:12px;color:#304d43}
.category-bar{display:flex;gap:3px;overflow:auto}
.category-bar button{white-space:nowrap;padding:9px 11px;font-size:11px;border:0;border-radius:4px;color:#446353;background:none}
.category-bar button[aria-pressed=true]{background:#446b55;color:#fffcea}
.sort-shell select{border:0;outline:none;background:none;color:#446353;font-size:11px}
.results-heading{width:93%;margin:20px auto 0;display:flex;justify-content:space-between;gap:10px;font-size:11px;color:#fffcec;text-shadow:0 1px 5px #173f3c}
.results-heading p{margin:0}
.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 18px;padding:20px 0 0}
.lotus-project{position:relative;aspect-ratio:1.08;min-width:0;display:grid;place-items:center;isolation:isolate;pointer-events:auto}
.lotus-project:nth-child(6n+2){transform:translateY(29px)}
.lotus-project:nth-child(6n+3){transform:translateY(-8px)}
.lotus-project:nth-child(6n+4){transform:translateX(12px)}
.lotus-project:nth-child(6n+5){transform:translateY(16px)}
.leaf-art{position:absolute;width:calc(100% * var(--leaf-scale,1));height:calc(100% * var(--leaf-scale,1));object-fit:contain;z-index:-1;transform:rotate(var(--turn));filter:drop-shadow(0 13px 11px #183f4670) brightness(.79) saturate(.82);transition:transform .3s,filter .3s;pointer-events:none}
.leaf-v-0 .leaf-art{filter:drop-shadow(0 13px 11px #183f4670) brightness(.80) saturate(.86)}
.leaf-v-1 .leaf-art{filter:drop-shadow(0 15px 12px #183f4670) brightness(.77) saturate(.88)}
.leaf-v-2 .leaf-art{filter:drop-shadow(0 11px 10px #183f4670) brightness(.84) saturate(.78)}
.leaf-v-3 .leaf-art{filter:drop-shadow(0 16px 14px #183f4670) brightness(.76) saturate(.90)}
.leaf-v-4 .leaf-art{filter:drop-shadow(0 18px 15px #183f4670) brightness(.72) saturate(.90)}
.leaf-v-5 .leaf-art{filter:drop-shadow(0 14px 13px #183f4670) brightness(.80) saturate(.84)}
.leaf-v-2 .leaf-content{width:58%}
.leaf-v-4 .leaf-content{width:54%}
.leaf-v-5 .leaf-content{width:58%}
.lotus-project:hover .leaf-art,.lotus-project:focus-within .leaf-art{transform:rotate(calc(var(--turn) + 2deg)) scale(1.025);filter:drop-shadow(0 16px 13px #183f4670) brightness(.86) saturate(.85)}
.leaf-content{width:60%;padding-top:5px;text-align:center;color:#fffde7;text-shadow:0 1px 3px #243c25,0 0 6px #284a2e}
.kind-label{font-size:10px;letter-spacing:.1em;color:#f1efd1}
.leaf-content h2{font-family:"Microsoft YaHei",sans-serif;font-size:clamp(15px,1.45vw,20px);font-weight:650;line-height:1.5;margin:9px 0 7px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.description{font-size:11px;line-height:1.7;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:0}
.leaf-meta{margin:10px 0 0;font-size:10px;color:#f1efd1}
.lotus-project:focus-visible{outline:2px solid #fff;outline-offset:8px;border-radius:50%}
.empty{grid-column:1/-1;text-align:center;min-height:330px;padding-top:100px;text-shadow:0 1px 6px #183e3a}
footer{padding:35px 25px 65px;text-align:center;font-size:13px;text-shadow:0 1px 5px #123d39}
footer span{margin-left:22px;font-size:11px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(min-width:1700px){.project-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.library{width:min(1640px,92%)}}
@media(max-width:900px){.topbar{width:88%}.hero{width:78%;height:390px}.project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}.leaf-content h2{font-size:18px}.hero-summary{gap:13px}.category-bar{order:3;width:100%;justify-content:center}.leaf-art{width:calc(105% * var(--leaf-scale,1));height:calc(105% * var(--leaf-scale,1))}.library{width:96%}}
@media(max-width:520px){.topbar{height:74px}.brand{font-size:21px}.brand span{font-size:16px}.topbar nav{gap:7px}.topbar nav>a{display:none}#motion-toggle{font-size:10px;padding:8px 10px}.hero{width:88%;height:365px;padding-top:40px}h1{font-size:34px;letter-spacing:0}.hero-lede{font-size:12px}.hero-summary{flex-wrap:wrap;font-size:10px;gap:12px}.hero-summary b{font-size:22px}.project-grid{grid-template-columns:1fr;padding:28px 22px 0}.lotus-project:nth-child(n){transform:none;aspect-ratio:1.05}.leaf-content{width:61%}.leaf-content h2{font-size:19px}.description{font-size:12px}.category-bar button{padding:9px 8px;font-size:10px}.library-controls{gap:2px}.results-heading p:last-child{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
