:root{--ink:#1c2942;--muted:#68758c;--blue:#3159cb;--line:#e3e8f1;--paper:#f4f6fb}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:14px/1.5 "Microsoft YaHei","PingFang SC",system-ui,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #8aa7fb;outline-offset:4px}.header{height:76px;padding:0 max(5%,calc((100% - 1200px)/2));background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:64px}.brand{display:flex;align-items:center;gap:10px}.brand>span{font-size:22px;font-weight:700;letter-spacing:2px;white-space:nowrap}.brand-sub{display:block;font-size:9px;letter-spacing:1.5px;font-weight:400;color:var(--muted)}nav{height:100%;display:flex;align-items:center}nav a{height:100%;display:flex;align-items:center;color:var(--blue);font-weight:600;border-bottom:3px solid var(--blue);padding:3px 4px 0}.header-note{margin-left:auto;font-size:12px;color:#7e8ba1}main,footer{max-width:1200px;margin:auto}.page-intro{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:25px 0 25px}.eyebrow{color:#71809b;font-size:10px;letter-spacing:1.3px}h1{font-size:30px;letter-spacing:1px;margin:9px 0 10px;line-height:1.4}h1 span{color:var(--blue)}.page-intro p{margin:0;color:var(--muted);font-size:13px}.overview{display:flex;padding:20px 0;gap:30px}.stat{display:flex;flex-direction:column;gap:4px;min-width:68px}.stat+.stat{border-left:1px solid #dfe5ef;padding-left:30px}.stat strong{font-size:25px;font-weight:600;letter-spacing:1px;line-height:1.2}.stat span{font-size:11px;color:var(--muted);white-space:nowrap}.live-dot,.status i{display:inline-block;width:6px;height:6px;background:#28a875;border-radius:50%;margin-right:6px}.projects{scroll-margin-top:15px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}.heading-left{display:flex;align-items:center;gap:14px}h2{font-size:19px;margin:0;font-weight:600}.result-count{color:#7b879d;font-size:11px}.search{width:305px;background:#fff;display:flex;align-items:center;gap:10px;padding:10px 13px;border:1px solid var(--line);border-radius:8px;color:#7e8aa0}.search:focus-within{border-color:#7c9ae6;box-shadow:0 0 0 3px #3159cb09}.search input{border:0;outline:none;min-width:0;flex:1;color:var(--ink);background:none;font-size:12px}.search kbd{border:1px solid #e2e7f0;border-radius:3px;padding:0 5px;color:#8d98ac}.filter-row{display:flex;align-items:center;justify-content:space-between;margin:18px 0}.filters{display:flex;gap:6px}.filter{border:1px solid transparent;border-radius:6px;background:none;padding:8px 13px;font-size:12px;color:#6a7890}.filter.active{background:#e6edff;color:#2b50b5;font-weight:600}.filter span{margin-left:5px;font-size:10px;opacity:.75}.list-hint{font-size:11px;color:#8994a7}.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;align-items:start}.project-card{border:1px solid var(--line);border-radius:13px;overflow:hidden;background:#fff;transition:transform .2s,box-shadow .2s,border-color .2s;animation:appear .3s both}.project-card.is-live{border-color:#cedaf7;box-shadow:0 4px 18px #28478b07}.project-card:hover{transform:translateY(-3px);box-shadow:0 12px 28px #263f7710}.card-art{height:100px;position:relative;background:#e7eefb;overflow:hidden}.card-art>img{height:100%;width:100%;object-fit:cover;object-position:50% 47%;filter:saturate(.5);opacity:.45}.card-art:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#e7eefb 7%,#e7eefb80 55%,transparent)}.card-art.canal{background:#edf0f5}.card-art.canal:after{background:linear-gradient(90deg,#edf0f5 7%,#edf0f580 55%,transparent)}.art-top{position:absolute;z-index:1;top:17px;left:20px;right:17px;display:flex;justify-content:space-between;gap:12px;align-items:center}.category{font-size:10px;color:#47628f;letter-spacing:.5px}.status{font-size:10px;background:#ffffffde;color:#267954;padding:5px 9px;border-radius:20px;white-space:nowrap}.status.upcoming{color:#877044}.status.upcoming i{background:#b69a69}.art-label{position:absolute;z-index:1;left:20px;bottom:17px}.art-label>span{font-size:9px;letter-spacing:1.8px;color:#7283a2;display:block}.art-label strong{display:block;color:#375383;font-weight:500;font-size:12px;margin-top:4px}.card-content{padding:21px 20px 20px}.card-title{display:flex;justify-content:space-between;align-items:center;gap:8px}.card-title h3{font-size:23px;font-weight:650;letter-spacing:1px;margin:0}.card-title>span{display:flex;align-items:center;gap:3px;font-size:10px;color:#77849b;white-space:nowrap}.card-description{font-size:12px;color:#68758b;line-height:1.9;margin:13px 0 15px;min-height:46px}.tags{display:flex;gap:6px;flex-wrap:wrap}.tags span{font-size:10px;color:#627694;background:#f0f4fa;padding:4px 7px;border-radius:4px}.card-actions{border-top:1px solid #edf0f6;margin-top:20px;padding-top:18px;display:flex;gap:10px}.primary,.admin-link,.coming-button{min-height:42px;border-radius:7px;display:flex;align-items:center;justify-content:center;gap:17px;font-size:12px;font-weight:500}.primary{background:var(--blue);color:white;flex:1;box-shadow:0 3px 7px #3159cb1a;transition:background .2s}.primary:hover{background:#2446a8}.primary span{font-size:18px}.admin-link{padding:0 13px;border:1px solid #dce3ef;color:#4d6181;background:white}.admin-link:hover{background:#f1f5ff;border-color:#a9bdeb}.coming-button{border:1px solid #e4e8ef;background:#f3f5f8;color:#8e98a9;flex:1;cursor:default}.coming-caption{display:none}.is-upcoming .card-title h3{color:#57677f}.is-upcoming .card-art>img{filter:saturate(.1);opacity:.35}.is-upcoming .card-description{color:#7b879a}.access-help{font-size:11px;color:#7c899f;margin:20px 0 0;display:flex;gap:8px;align-items:center}.access-help>span{font-size:17px;color:#5b79bb}.platform-note{display:flex;align-items:center;gap:14px;border:1px dashed #d8e0ef;border-radius:9px;padding:18px 21px;margin:32px 0 0;background:#f7f9fd}.note-icon{display:grid;place-items:center;font-size:23px;color:#8295b6;width:34px;height:34px;background:#edf1f9;border-radius:9px}.platform-note strong{font-size:12px;font-weight:500;color:#657796}.platform-note p{font-size:11px;margin:4px 0 0;color:#8491a6}.note-decoration{margin-left:auto;font-size:9px;letter-spacing:2px;color:#a7b3c8}footer{display:flex;justify-content:space-between;padding:25px 0;margin-top:50px;border-top:1px solid var(--line);font-size:11px;color:#8b97ab}.footer-divider{margin:0 8px;color:#bac3d1}.empty{grid-column:1/-1;text-align:center;background:white;border:1px solid var(--line);border-radius:10px;padding:50px 20px}.empty>span{font-size:30px;color:#849ed4}.empty h3{font-size:17px;font-weight:500}.empty p{color:var(--muted);font-size:12px}.empty button{border:0;background:var(--blue);color:#fff;padding:10px 20px;border-radius:6px;margin-top:15px}.loading{color:var(--muted)}.noscript{padding:20px;text-align:center}.noscript a{text-decoration:underline}@keyframes appear{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@media(max-width:1300px){main,footer{margin-left:5%;margin-right:5%}}@media(max-width:1050px){.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.overview{gap:20px}.stat+.stat{padding-left:20px}.header{gap:40px}}@media(max-width:650px){.header{height:66px;gap:24px}.brand>span{font-size:20px}.brand img{width:31px;height:31px}.brand-sub{font-size:8px}.header-note{display:none}nav a{font-size:12px}.page-intro{padding:23px 0 19px;display:block}h1{font-size:25px;margin:6px 0 7px}.eyebrow{font-size:9px}.page-intro p{font-size:11px}.overview{display:flex;gap:0;padding:18px 0 0}.stat{flex:1;flex-direction:row;align-items:center;gap:8px;min-width:0}.stat strong{font-size:20px}.stat span{font-size:10px}.stat+.stat{padding-left:16px}.section-heading{gap:12px}.heading-left{gap:9px}h2{font-size:17px}.result-count{font-size:10px}.search{width:180px;padding:8px 9px;gap:7px}.search input{font-size:10px}.search svg{width:14px}.search kbd{display:none}.filter-row{margin:13px 0}.filters{gap:3px}.filter{font-size:11px;padding:7px 10px}.list-hint{font-size:9px}.project-grid{grid-template-columns:1fr;gap:18px}.card-art{height:78px}.art-top{left:18px;top:12px}.art-label{left:18px;bottom:12px}.art-label>span{font-size:8px}.art-label strong{display:none}.card-content{padding:17px 18px 18px}.card-title h3{font-size:23px}.card-description{margin:9px 0 11px;min-height:0;font-size:12px}.card-actions{margin-top:15px;padding-top:15px}.primary,.admin-link,.coming-button{min-height:43px;font-size:13px}.admin-link{padding:0 16px}.access-help{font-size:10px;align-items:flex-start;line-height:1.8;margin-top:16px}.platform-note{margin-top:24px;padding:16px}.note-decoration{display:none}.platform-note p{font-size:10px}footer{margin-top:30px;padding:20px 0;font-size:9px;gap:14px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.project-card{animation:none!important;transition:none!important}}

/* Readability and visual refinement */
:root{--ink:#172640;--muted:#52617a;--line:#e1e7f0;--paper:#f5f7fb;--blue:#3156c5}
body{background:radial-gradient(ellipse at 90% 0%,#eaf0fc66,transparent 44%),var(--paper)}
.header{height:76px;box-shadow:0 1px 9px #263c6203}.brand>span{letter-spacing:1px}.brand-sub{font-size:11px;letter-spacing:1px;color:#536179}nav a{font-size:13px}
.page-intro{padding:34px 0 31px}.page-intro h1{font-size:29px;letter-spacing:.4px;margin:0;font-weight:650}.heading-separator{color:#bac5d8!important;font-weight:300;margin:0 6px}.overview{gap:25px;padding:0}.stat strong{font-size:24px;font-variant-numeric:tabular-nums}.stat span{font-size:12px;color:#536179}.stat+.stat{padding-left:25px}
.heading-left h2{font-size:17px}.result-count{font-size:12px;color:#536179}.search{padding:11px 14px;border-color:#d7dfed;border-radius:9px;color:#536179}.search input{font-size:13px}.search input::placeholder{color:#5c6b83;opacity:1}.search kbd{color:#5c6b83}.filter-row{margin:19px 0 21px}.filter{font-size:13px;color:#52617a;padding:8px 15px}.filter.active{color:#2349af;background:#e6edff}.filter span{opacity:1;color:inherit}
.project-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:26px}.project-card{border-radius:15px;border:1px solid #dde4ef;box-shadow:0 4px 16px #243f6b05;transition:transform .2s,box-shadow .2s}.project-card.is-live{border-color:#cbd8f4;box-shadow:0 5px 20px #28478b08}.project-card:hover{box-shadow:0 14px 30px #243f6b10;transform:translateY(-3px)}
.card-art{height:115px;background:#edf2fc}.card-art>img{object-position:50% 40%;opacity:.65;filter:saturate(.65)}.card-art:after{background:linear-gradient(90deg,#e9effbd9,#e9effb33 80%)}.card-art.canal:after{background:linear-gradient(90deg,#edf0f5dd,#edf0f533 80%)}.art-top{top:20px;left:24px;right:24px}.category{font-size:12px;color:#3f567b;background:#ffffffd9;padding:4px 9px;border-radius:5px}.status{font-size:11px;padding:5px 10px;font-weight:500;color:#1f6c4d;background:#fffffff0}.status.upcoming{color:#765822}.status i{background:#23865e}.status.upcoming i{background:#9b773b}
.card-content{padding:24px}.card-title h3{font-size:25px;letter-spacing:.5px}.card-title>span{font-size:12px;color:#536179}.card-title>span svg{width:15px;height:15px}.card-description{font-size:13px;line-height:1.8;color:#52617a;min-height:0;margin:12px 0 17px}.tags{gap:7px}.tags span{font-size:11px;padding:4px 8px;color:#4d5e78;background:#edf2fa}.card-actions{margin-top:23px;padding-top:20px;gap:12px}.primary,.admin-link,.coming-button{min-height:45px;font-size:13px;border-radius:8px}.primary{font-weight:600;box-shadow:0 3px 8px #3156c522}.admin-link{padding:0 20px;color:#3e5274;border-color:#d5deed}.coming-button{background:#eef1f6;border-color:#dce3ed;color:#59677f}.is-upcoming .card-title h3{color:#3e4f69}.is-upcoming .card-description{color:#52617a}.is-upcoming .card-art>img{opacity:.52;filter:saturate(.3)}
footer{margin-top:43px;color:#607088;font-size:12px;padding:24px 0}.footer-divider{color:#73819a}.empty p,.loading{color:#52617a}.empty p{font-size:13px}
@media(max-width:1050px){.project-grid{gap:20px}.overview{gap:17px}.stat+.stat{padding-left:17px}}
@media(max-width:650px){.header{height:66px}.brand-sub{font-size:10px}.page-intro{padding:25px 0 22px}.page-intro h1{font-size:24px}.heading-separator{margin:0 1px}.overview{padding-top:19px;gap:0}.stat strong{font-size:21px}.stat span{font-size:11px}.stat+.stat{padding-left:15px}.search{width:181px;padding:9px 10px}.search input{font-size:12px}.heading-left{gap:8px}.heading-left h2{font-size:16px}.result-count{font-size:11px}.filter-row{margin:14px 0 18px}.filter{font-size:12px;padding:8px 13px}.project-grid{grid-template-columns:1fr;gap:20px}.card-art{height:86px}.art-top{top:17px;left:20px;right:20px}.category{font-size:11px}.card-content{padding:20px}.card-title h3{font-size:24px}.card-title>span{font-size:11px}.card-description{margin:10px 0 15px;font-size:13px}.card-actions{margin-top:19px;padding-top:18px}.admin-link{padding:0 17px}.primary,.admin-link,.coming-button{min-height:45px}footer{font-size:11px;margin-top:30px}}

/* Layered landscape, animated with transforms and opacity only. */
body{background:#f5f7fa;isolation:isolate}
.ambient-landscape{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;contain:strict;background:linear-gradient(155deg,#f7f8fc 8%,#f2f6fa 58%,#eef5f4 100%)}
.ambient-landscape svg{position:absolute;bottom:0;left:0;width:100%;height:min(76vh,760px);min-height:480px}
.ambient-glow{position:absolute;width:85vw;height:85vh;right:-38vw;top:-40vh;border-radius:50%;background:radial-gradient(ellipse,#dce5f7a6,transparent 65%);animation:ambient-glow 30s ease-in-out -8s infinite alternate}
.ambient-warmth{position:absolute;left:-20vw;top:8vh;width:65vw;height:70vh;background:radial-gradient(ellipse,#f1eadb57,transparent 65%)}
.bg-ridge-far{animation:ridge-drift 30s ease-in-out -8s infinite alternate;transform-origin:50% 100%}
.bg-ridge-mid{animation:ridge-drift 26s ease-in-out -15s infinite alternate-reverse;transform-origin:50% 100%}
.bg-ridge-near{animation:ridge-drift 24s ease-in-out -10s infinite alternate-reverse;transform-origin:50% 100%}
.bg-water{animation:water-drift 16s ease-in-out -6s infinite alternate}
.bg-mist{animation:mist-drift 32s ease-in-out -12s infinite alternate}
.bg-boat{animation:boat-drift 20s ease-in-out -6s infinite alternate}
.bg-birds{animation:bird-drift 28s ease-in-out -9s infinite alternate}
.motion-toggle{border:1px solid #d5dfe9;background:#ffffffcf;color:#465c76;display:inline-flex;align-items:center;justify-content:center;gap:7px;border-radius:20px;padding:6px 11px;font-size:11px;min-height:30px;white-space:nowrap}
.motion-toggle:hover{background:#fff;border-color:#a9bce0}.motion-toggle>span:first-child{width:11px;text-align:center;font-size:11px}
.motion-paused .ambient-landscape *,.page-hidden .ambient-landscape *{animation-play-state:paused!important}
footer{align-items:center;border-top-color:#d5dfea;color:#53657d}
@keyframes ridge-drift{from{transform:translate3d(-13px,4px,0)}to{transform:translate3d(14px,-4px,0)}}
@keyframes water-drift{from{transform:translate3d(-42px,3px,0)}to{transform:translate3d(42px,-3px,0)}}
@keyframes mist-drift{from{transform:translate3d(-36px,0,0);opacity:.6}to{transform:translate3d(36px,0,0);opacity:1}}
@keyframes boat-drift{from{transform:translate3d(-12px,1px,0)}to{transform:translate3d(12px,-2px,0)}}
@keyframes bird-drift{from{transform:translate3d(-10px,2px,0)}to{transform:translate3d(14px,-4px,0)}}
@keyframes ambient-glow{from{transform:translate3d(0,0,0);opacity:.65}to{transform:translate3d(-5vw,4vh,0);opacity:1}}
@media(max-width:650px){.ambient-landscape svg{width:190%;left:-73%;height:68vh;min-height:460px;opacity:.8}.ambient-glow{width:110vw;right:-45vw}.motion-toggle{font-size:10px;padding:5px 9px;min-height:30px}footer{gap:10px}}