@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@300;400;500&display=swap');
:root{--purple:#5b3ff3;--ink:#252428;--muted:#88858e;--serif:'Noto Serif SC','Songti SC',SimSun,serif}*{box-sizing:border-box}body{margin:0;background:var(--purple);color:var(--ink);padding:100px 32px 60px;font-family:Arial,'Microsoft YaHei',sans-serif}.paper{max-width:1120px;margin:auto;background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 22px 70px #2d178225}a{color:inherit;text-decoration:none}header{height:72px;padding:0 62px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #f3f2f4;gap:24px}.logo{font:28px Georgia,serif;letter-spacing:-1px}.logo span{font:10px Arial;margin-left:12px;color:#999;letter-spacing:3px}nav{display:flex;gap:26px}button{font:inherit;cursor:pointer}nav button{border:0;background:none;color:#777;padding:10px 0;font-size:12px;position:relative}nav button.active{color:var(--purple)}nav button.active:after{content:'';position:absolute;bottom:2px;left:calc(50% - 2px);width:4px;height:4px;border-radius:50%;background:var(--purple)}.subscribe{background:var(--purple);color:white;font-size:10px;letter-spacing:1px;border-radius:24px;padding:11px 17px}.subscribe span{margin-left:10px}.hero{text-align:center;padding:66px 20px 68px;border-bottom:1px solid #f1f0f2}.hero p{font-size:9px;letter-spacing:3px;color:#aaa;margin:0 0 23px}.hero h1{font:300 clamp(28px,4vw,48px)/1.5 var(--serif);letter-spacing:1px;margin:0 0 17px}.hero div{color:#999;font-size:11px;letter-spacing:2px}.posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:52px 26px;padding:70px 62px 28px;align-items:start}.post{min-width:0}.cover{width:100%;aspect-ratio:1.5;object-fit:cover;display:block;background:#e6e4e0;transition:transform .6s,filter .6s}.post:nth-child(3n + 2) .cover{aspect-ratio:1}.image-wrap{overflow:hidden}.post a:hover .cover{transform:scale(1.04);filter:saturate(1.12)}.post h2{font:400 21px/1.6 var(--serif);margin:17px 0 12px;letter-spacing:-.5px}.post a:hover h2{color:var(--purple)}.meta{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:9px}.tag{color:#555;border:1px solid #f0f0f0;border-radius:20px;padding:4px 7px;display:flex;align-items:center;gap:5px}.dot{width:5px;height:5px;border-radius:50%;background:var(--dot)}.endnote{padding:66px 20px 58px;text-align:center;font:12px var(--serif);color:#aaa;letter-spacing:2px}.endnote span{display:block;color:var(--purple);font:28px Georgia;margin-top:22px}footer{border-top:1px solid #eee;margin:0 62px;padding:28px 0;display:flex;align-items:center;justify-content:space-between}footer .logo{font-size:23px}footer p,footer small{font-size:9px;color:#999;letter-spacing:1px}dialog{border:0;border-radius:14px;padding:60px;max-width:760px;width:calc(100% - 32px);max-height:90vh;box-shadow:0 24px 90px #0003}dialog::backdrop{background:#201341aa;backdrop-filter:blur(6px)}.close{position:absolute;right:20px;top:18px;border:0;background:#f5f4f8;border-radius:50%;width:34px;height:34px}.reading h1{font:400 32px/1.5 var(--serif)}.reading p{font:16px/2 var(--serif);color:#555}.reading img{width:100%;max-height:300px;object-fit:cover;margin:25px 0}.reading .sample{font:11px Arial;color:#999}button:focus-visible,a:focus-visible{outline:2px solid var(--purple);outline-offset:5px}@media(max-width:760px){body{padding:28px 14px}.paper{border-radius:12px}header{height:auto;min-height:76px;padding:20px 24px;flex-wrap:wrap;gap:18px}.logo span{display:none}nav{order:3;width:100%;justify-content:space-between;gap:12px}.hero{padding:45px 15px}.posts{padding:35px 24px;grid-template-columns:repeat(2,minmax(0,1fr));gap:34px 20px}.post h2{font-size:17px}.meta{flex-wrap:wrap;gap:6px}footer{margin:0 24px;gap:16px;flex-wrap:wrap}dialog{padding:45px 25px}}@media(max-width:450px){.posts{grid-template-columns:1fr}.post:nth-child(3n + 2) .cover{aspect-ratio:1.25}.hero h1{font-size:27px}.hero div{font-size:10px;letter-spacing:1px}.endnote{padding-top:20px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* Full-window layout for the blog and shared library. */
body{padding:0;background:#fff}
.paper{width:100%;max-width:none;min-height:100vh;margin:0;border-radius:0;box-shadow:none}

.home-header{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);height:auto;min-height:80px}.home-header nav{justify-content:center;gap:32px}.home-header nav button{font-size:16px;padding:16px 0}.home-header .account-nav{justify-self:end;justify-content:flex-end;font-size:14px}.home-header .account-nav button{font-size:14px}@media(max-width:1000px){.home-header{grid-template-columns:1fr 1fr;padding:20px 24px}.home-header nav{grid-column:1/-1;grid-row:2;justify-content:center;flex-wrap:wrap;width:100%;gap:26px}.home-header .account-nav{grid-column:2;grid-row:1}}

.home-header nav{align-items:center}.home-header .library-nav{font-size:16px;padding:16px 0;color:#777;white-space:nowrap}.home-header .library-nav:hover{color:var(--purple)}@media(min-width:1001px) and (max-width:1250px){.home-header{padding-left:28px;padding-right:28px;gap:18px}.home-header nav{gap:20px}.home-header .account-nav{gap:10px}}

/* Consistent article cards: crop covers without stretching. */
.posts{align-items:stretch}.post{display:flex;flex-direction:column}.post>a{display:block}.posts .post .image-wrap{aspect-ratio:3/2;overflow:hidden}.posts .post .cover{width:100%;height:100%;aspect-ratio:3/2;object-fit:cover;object-position:center}.post h2{min-height:3.2em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.post>.meta{margin-top:auto;flex-wrap:nowrap;min-height:32px}.post .card-like{margin-left:auto;display:inline-flex;align-items:center;gap:5px;background:#f4f4f5;border-radius:5px;padding:4px 7px;color:#939399;font:14px Arial;white-space:nowrap}.card-like svg{width:19px;height:19px;fill:currentColor}.post .card-like.is-liked{color:#ef4552}

.post .card-like{border:0;cursor:pointer}.post .card-like:disabled{cursor:wait;opacity:.65}

/* Article metadata uses one compact, aligned control height. */
.post>.meta{height:28px;min-height:28px;align-items:center}.post>.meta .tag,.post>.meta time,.post>.meta .card-like{height:28px;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;line-height:1;padding-top:0;padding-bottom:0}.post>.meta .tag{padding-left:8px;padding-right:8px}.post>.meta .card-like{min-height:28px;min-width:46px;padding-left:8px;padding-right:8px}.post>.meta .card-like svg{display:block;flex-shrink:0}

.post>.meta .card-reads{margin-left:auto;height:28px;display:inline-flex;align-items:center;gap:5px;padding:0 8px;background:#f4f4f5;border-radius:5px;color:#939399;font:14px Arial;white-space:nowrap}.card-reads svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7}.post>.meta .card-like{margin-left:0}