*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:85px}body{margin:0;background:var(--bg);color:var(--ink);font-family:Arial,"Microsoft YaHei","PingFang SC",sans-serif;--bg:#f7f8f4;--ink:#232820;--muted:#62675e;--accent:#c4f45c;--line:#d8ddd1;--surface:#eef1e8}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:3px solid var(--ink);outline-offset:5px}button{border:0}button:hover,a:hover{filter:brightness(.93)}.wrap{width:min(1240px,88%);margin:auto}.preview{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;align-items:center;gap:18px;padding:10px 24px;background:#fff;border-bottom:1px solid #ddd;color:#343731;font-size:12px;min-height:58px}.preview small{color:#686d64}.preview nav{display:flex;gap:6px}.preview a{padding:12px 18px;border-radius:5px;white-space:nowrap}.preview a[aria-current]{background:#252b25;color:#fff}.preview-end{color:#686d64}.header{height:104px;display:flex;align-items:center;justify-content:space-between}.brand{font-size:23px;font-weight:800;letter-spacing:-1px;display:inline-flex;align-items:center;gap:8px}.brand-mark{font-size:36px}.brand-dot{color:#597a19}.header nav{display:flex;gap:38px;align-items:center;font-size:14px}.header nav a{padding:14px 0}.active{border-bottom:2px solid var(--ink)}.hero{display:grid;grid-template-columns:1.06fr 1fr;gap:52px;align-items:center;padding-top:42px;padding-bottom:70px}.eyebrow{font-family:Consolas,monospace;font-size:11px;letter-spacing:1.8px;display:flex;align-items:center;gap:9px}.status-dot{width:7px;height:7px;border-radius:50%;background:#5d8427;box-shadow:0 0 0 4px #8fae5620}h1{font-size:clamp(42px,4.8vw,70px);line-height:1.23;letter-spacing:-3px;margin:30px 0 22px;font-weight:750}h1 span{position:relative}body[data-version=a] h1 span:after{content:'';position:absolute;background:var(--accent);height:13px;bottom:2px;left:0;right:0;z-index:-1}.hero-copy>p{font-size:15px;line-height:1.95;color:var(--muted);margin-bottom:28px}.primary{display:inline-flex;align-items:center;justify-content:space-between;gap:36px;padding:16px 22px;background:var(--accent);font-size:14px;font-weight:600;min-height:50px}.primary span{font-size:22px}.hero-note{display:flex;gap:14px;align-items:center;font-size:11px;color:var(--muted);margin-top:38px}.tiny-cross{font-size:19px}.line{height:1px;width:60px;background:var(--line)}.hero-art{position:relative;min-width:0}.art{position:relative;overflow:hidden;isolation:isolate;background:var(--surface);height:240px}.hero-art>.art{height:440px;background-color:#edf1e5;background-image:linear-gradient(#cbd3bf70 1px,transparent 1px),linear-gradient(90deg,#cbd3bf70 1px,transparent 1px);background-size:40px 40px}.art-label,.art-coordinate{position:absolute;font:10px Consolas,monospace;letter-spacing:1px;left:22px;top:20px;z-index:2}.art-coordinate{top:auto;bottom:20px;font-size:9px}.art-plus{position:absolute;right:20px;top:15px;font:26px Consolas,monospace}.shape{position:absolute;width:260px;height:260px;left:50%;top:50%;transform:translate(-50%,-50%)}.orbit .shape{border-radius:50%;background:radial-gradient(circle at 32% 28%,#ecffa4 0%,#b7e458 34%,#6d912c 70%,#3c5621 100%);box-shadow:20px 34px 50px #4b691e25;transform:translate(-50%,-50%) rotate(-30deg)}.orbit .shape i{position:absolute;border:1px solid #50701b99;inset:0 35%;border-radius:50%}.orbit .shape i:nth-child(2){inset:0 22%}.orbit .shape i:nth-child(3){inset:0 7%}.orbit .shape i:nth-child(4){inset:25% -15%;border:1px solid #688334;transform:rotate(20deg)}.orbit .shape i:nth-child(5){inset:40% -20%;border:1px solid #688334;transform:rotate(20deg)}.hero-art .orbit .shape{width:285px;height:285px}.floating-tag{position:absolute;right:-15px;bottom:65px;background:#ffffffdc;border:1px solid var(--line);padding:16px 21px;font:11px Consolas,"Microsoft YaHei",monospace;box-shadow:0 10px 25px #24301309;transform:rotate(-4deg)}.art-caption{display:flex;justify-content:space-between;font:9px Consolas,monospace;letter-spacing:1px;margin-top:13px}.ticker{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.ticker .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 0;font:11px Consolas,monospace;letter-spacing:2px}.ticker b{font-size:19px;font-weight:400}.articles{padding-top:62px;padding-bottom:55px}.section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:28px}h2{font-size:30px;letter-spacing:-1px;margin:14px 0 0;line-height:1.4}.count{font:12px Consolas,monospace;vertical-align:top;margin-left:15px;color:var(--muted)}.filters{display:flex;gap:8px}.filters button{padding:12px 18px;background:transparent;border:1px solid transparent;border-radius:30px;font-size:12px;min-height:44px}.filters button[aria-pressed=true]{border-color:var(--ink);background:var(--ink);color:var(--bg)}.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}.post{min-width:0}.post[hidden]{display:none}.cover-button{display:block;padding:0;width:100%;text-align:left;overflow:hidden}.cover-button .shape{transition:scale .35s}.cover-button:hover .shape{scale:1.05}.post .shape{width:150px;height:150px}.meta{display:flex;justify-content:space-between;color:var(--muted);font-size:10px;letter-spacing:.4px;margin:22px 0 12px}h3{font-size:18px;line-height:1.6;margin:0}.post h3 button{padding:0;background:transparent;text-align:left;display:flex;justify-content:space-between;gap:15px;width:100%}.post h3 button span{font-size:23px;font-weight:400}.post p{font-size:12px;line-height:1.9;color:var(--muted);margin-top:10px}.steps{background:#eee9e0}.steps .shape{transform:translate(-50%,-50%) rotate(-28deg);width:210px;height:170px}.steps .shape i{position:absolute;width:65%;height:37%;left:10%;top:0;background:linear-gradient(135deg,#fff8e7,#e79b5a);box-shadow:12px 14px 0 #bd703b;transform:skewY(15deg)}.steps .shape i:nth-child(2){left:20%;top:20%}.steps .shape i:nth-child(3){left:30%;top:40%}.steps .shape i:nth-child(4){left:40%;top:60%}.steps .shape i:nth-child(5){display:none}.wave{background:#e3ece7}.wave .shape{width:230px;height:190px;transform:translate(-50%,-50%) rotate(-30deg)}.wave .shape i{position:absolute;left:0;top:0;width:160px;height:160px;border:20px solid #82ac93;border-radius:45%;box-shadow:inset 5px 5px 10px #fff9,9px 12px 20px #28583c18;background:#c1d9c340}.wave .shape i:nth-child(2){left:22px;top:12px;border-color:#94bca2}.wave .shape i:nth-child(3){left:44px;top:24px;border-color:#a8ccb3}.wave .shape i:nth-child(4){left:66px;top:36px;border-color:#bbdac1}.wave .shape i:nth-child(5){left:88px;top:48px;border-color:#d4e8d7}.demo-note{color:var(--muted);font-size:11px;margin-top:24px}.about{display:flex;align-items:center;gap:38px;border-top:1px solid var(--line);padding:44px 0 54px}.about-symbol{font-size:80px;width:125px;height:125px;display:grid;place-items:center;background:var(--accent);flex-shrink:0}.about h2{font-size:27px}.about p{font-size:13px;line-height:1.9;color:var(--muted)}.back-top{margin-left:auto;width:48px;height:48px;border:1px solid var(--line);display:grid;place-items:center;font-size:24px;flex-shrink:0}footer{display:flex;justify-content:space-between;align-items:center;gap:24px;border-top:1px solid var(--line);padding:28px 0 36px}footer .brand{font-size:16px}footer span,footer small{font-size:11px;color:var(--muted)}dialog{border:1px solid var(--line);padding:50px;width:min(690px,92%);max-height:85vh;background:var(--bg);color:var(--ink)}dialog::backdrop{background:#17251ecc;backdrop-filter:blur(5px)}dialog h2{margin-bottom:30px}dialog p{font-size:15px;line-height:2}dialog .close{position:absolute;right:12px;top:10px;background:transparent;font-size:30px;width:44px;height:44px}.muted{color:var(--muted)}.skip{position:fixed;left:10px;top:-100px;background:white;padding:14px;z-index:50}.skip:focus{top:10px}
body[data-version=b]{--bg:#faf7f0;--ink:#302b25;--muted:#70675c;--accent:#ff6a30;--surface:#f1e9de;--line:#ddd4c6}body[data-version=b] .brand{letter-spacing:-1.3px}body[data-version=b] .brand-mark{color:#cf4820}body[data-version=b] .hero{grid-template-columns:1.1fr 1fr;padding-top:25px;padding-bottom:55px;gap:30px}body[data-version=b] h1{font-size:clamp(50px,5.8vw,86px);letter-spacing:-4px;line-height:1.2}body[data-version=b] h1 span{color:#cf4820}body[data-version=b] .hero-art>.art{background:#f26633;height:430px;border-radius:50% 50% 0 0}body[data-version=b] .hero-art .steps .shape{width:300px;height:240px}body[data-version=b] .hero-art .steps .shape i{background:linear-gradient(135deg,#fff6e3,#e8bd8a);box-shadow:18px 18px 0 #a6411c}body[data-version=b] .floating-tag{right:-10px;bottom:40px;background:#fff9ed;transform:rotate(5deg);font-size:10px}body[data-version=b] .primary{background:var(--ink);color:#fff}body[data-version=b] .ticker{background:var(--accent);border:none;color:#302318}body[data-version=b] .posts{grid-template-columns:1.3fr 1fr}body[data-version=b] .post:first-child{grid-row:span 2}body[data-version=b] .post:first-child .art{height:354px}body[data-version=b] .post:first-child .shape{width:230px;height:230px}body[data-version=b] .post:not(:first-child){display:grid;grid-template-columns:180px 1fr;gap:22px;border-bottom:1px solid var(--line);padding-bottom:24px}body[data-version=b] .post[hidden]{display:none}body[data-version=b] .post:not(:first-child) .art{height:180px}body[data-version=b] .post:not(:first-child) .meta{margin-top:5px;gap:8px}body[data-version=b] .post:not(:first-child) .art-coordinate{display:none}body[data-version=b] .post:first-child h3{font-size:25px}body[data-version=b] .about-symbol{border-radius:50%;color:#302318}
body[data-version=c]{--bg:#f2f7f3;--ink:#214d3c;--muted:#567366;--accent:#d9edab;--line:#ccddd2;--surface:#e0eee5}body[data-version=c] .wrap{width:min(1170px,88%)}body[data-version=c] .header{height:95px}body[data-version=c] .brand{font-weight:500;letter-spacing:2px}body[data-version=c] .hero{position:relative;grid-template-columns:1.2fr 1fr;background:linear-gradient(120deg,#e3efe5,#f4f8ef 60%,#d6e8da);border:1px solid #d6e3d7;border-radius:28px;padding:54px;gap:10px;margin-top:20px;margin-bottom:42px}body[data-version=c] h1{font-size:clamp(36px,3.8vw,56px);letter-spacing:-2px}body[data-version=c] h1 span{color:#557a40}body[data-version=c] .hero-art>.art{height:350px;background:transparent;overflow:visible}body[data-version=c] .hero-art .wave .shape{scale:1.3}body[data-version=c] .hero-art .art-label,body[data-version=c] .hero-art .art-coordinate,body[data-version=c] .hero-art .art-plus{display:none}body[data-version=c] .floating-tag{border-radius:40px;right:-8px;bottom:28px;backdrop-filter:blur(10px);transform:rotate(-6deg)}body[data-version=c] .art-caption{font-size:8px}body[data-version=c] .primary{background:#285640;color:white;border-radius:40px}body[data-version=c] .ticker{border:0}body[data-version=c] .ticker .wrap{border-bottom:1px solid var(--line);padding-bottom:28px}body[data-version=c] .articles{padding-top:38px}body[data-version=c] .post{padding:10px;background:#ffffffc9;border:1px solid #dce6de;border-radius:18px;transition:transform .25s,box-shadow .25s}body[data-version=c] .post:hover{transform:translateY(-4px);box-shadow:0 14px 30px #244f3910}body[data-version=c] .cover-button,body[data-version=c] .art{border-radius:11px}body[data-version=c] .post-body{padding:0 12px 10px}body[data-version=c] .post h3{font-size:17px}body[data-version=c] .meta{font-size:9px}body[data-version=c] .about{margin-bottom:30px;padding:30px;border:1px solid var(--line);border-radius:20px}body[data-version=c] .about-symbol{border-radius:50%;font-size:90px;background:transparent}
@media(min-width:900px){.hero-copy{animation:enter .65s ease-out}.hero-art{animation:enter .9s ease-out}@keyframes enter{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}}
@media(max-width:1050px){.preview-end{display:none}.hero{gap:25px}.hero-art>.art{height:390px}body[data-version=b] .post:not(:first-child){grid-template-columns:130px 1fr;gap:16px}body[data-version=c] .hero{padding:35px}.hero-art .orbit .shape{width:230px;height:230px}.posts{gap:18px}.art{height:205px}}
@media(max-width:760px){.preview{padding:8px 15px;flex-wrap:wrap;justify-content:center;gap:3px}.preview>span{font-size:10px}.preview nav{justify-content:center}.preview a{padding:12px;font-size:10px}.wrap,body[data-version=c] .wrap{width:90%}.header,body[data-version=c] .header{height:85px}.brand{font-size:19px}.brand-mark{font-size:28px}.header nav{gap:18px;font-size:12px}.hero,body[data-version=b] .hero,body[data-version=c] .hero{grid-template-columns:1fr;padding-top:20px;gap:35px;padding-bottom:40px}h1,body[data-version=b] h1{font-size:54px;letter-spacing:-2px}.hero-copy>p{font-size:14px}.hero-note{margin-top:25px}.hero-art>.art,body[data-version=b] .hero-art>.art{height:330px}.floating-tag{right:5px}.ticker .wrap{font-size:9px;letter-spacing:.5px;gap:8px}.ticker .wrap span:nth-last-child(2),.ticker .wrap b:last-child{display:none}.articles{padding-top:40px}.section-heading{display:block}.filters{margin-top:20px}.posts,body[data-version=b] .posts{grid-template-columns:1fr}.art{height:250px}.post{margin-bottom:16px}.post p{font-size:14px}.meta{font-size:11px}.post h3{font-size:20px}.about,body[data-version=c] .about{gap:20px;flex-wrap:wrap}.about-symbol{height:75px;width:75px;font-size:50px}.about h2{font-size:25px}.back-top{align-self:flex-end}.about p br{display:none}footer{flex-wrap:wrap}footer small{width:100%}body[data-version=b] .post:not(:first-child){grid-template-columns:1fr;gap:0}body[data-version=b] .post:not(:first-child) .art{height:250px}body[data-version=b] .post:not(:first-child) .meta{margin-top:22px}body[data-version=b] .post:first-child .art{height:290px}body[data-version=c] .hero{padding:28px 22px;margin-top:10px}body[data-version=c] h1{font-size:38px}body[data-version=c] .hero-art>.art{height:270px}body[data-version=c] .hero-art .wave .shape{scale:1}body[data-version=c] .about{padding:25px}dialog{padding:48px 25px 25px}.preview small{display:none}html{scroll-padding-top:115px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}