:root{color-scheme:dark;font-family:system-ui,"Microsoft JhengHei",sans-serif;color:#dcebe6;background:#1d2021}*{box-sizing:border-box}body{margin:0}header{padding:20px 4%;border-bottom:1px solid #43504a;display:flex;justify-content:space-between}a{color:#7ed4bf}h1{font-size:28px}h2{font-size:22px}button,input,textarea,select{font:inherit;border:1px solid #52665f;border-radius:8px;color:inherit;background:#292f2d;padding:11px}button{cursor:pointer}button:hover{border-color:#7ed4bf}button:disabled{opacity:.5;cursor:wait}.workspace{max-width:1400px;margin:32px auto;padding:0 24px;display:grid;grid-template-columns:270px minmax(0,1fr);gap:36px}label{display:grid;gap:8px;margin:18px 0}textarea{resize:vertical;line-height:1.8;width:100%}input,select{width:100%}.toolbar,.actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.primary{background:#087e69}#posts{margin-top:20px;display:grid;gap:10px}#posts button{text-align:left;overflow-wrap:anywhere}#posts small{display:block;color:#a1b4ac;margin-top:8px}.hint{color:#a1b4ac;font-size:13px}#body.drag{outline:3px dashed #7ed4bf;background:#24493d}.reading{max-width:900px;margin:36px auto;padding:28px;line-height:1.9;overflow-wrap:anywhere}.reading img{max-width:100%;height:auto;display:block;margin:auto}.reading figure{margin:24px 0}.reading figcaption{color:#a1b4ac;font-size:14px;text-align:center}.reading p{white-space:pre-wrap}#previewPanel{background:#252829;border:1px solid #52665f;margin:20px 0}#status{color:#7ed4bf}button:focus-visible,a:focus-visible{outline:2px solid #7ed4bf;outline-offset:3px}@media(max-width:800px){.workspace{grid-template-columns:1fr;padding:0 16px}.reading{padding:18px}#posts{max-height:250px;overflow:auto}}[hidden]{display:none!important}
.article-page{max-width:1120px}.article-hero{margin:28px 0;padding:36px;border:1px solid #43594f;border-radius:20px;background:linear-gradient(130deg,#1c4438,#2b302a)}.article-hero h1{font-size:36px;line-height:1.4}.category-badge{display:inline-block;padding:4px 14px;border-radius:30px;background:#087e69;color:white;font-size:14px}.article-summary{color:#b9d1c7;font-size:18px}.article-content,.comments{background:#252829;border:1px solid #3b4441;border-radius:18px;padding:36px;margin:24px 0}.article-content h2,.article-content h3{border-left:4px solid #7ed4bf;padding-left:16px;margin-top:32px}.article-content img{border-radius:12px}.comment{padding:22px 0;border-bottom:1px solid #43504a}.comment small{margin-left:15px;color:#97b3a7}.comment p{white-space:pre-wrap}.comments form{margin-bottom:30px}.topbar{max-width:none!important;margin:0!important}html[data-theme=light]{color-scheme:light;background:#f4f8f6;color:#123d35}html[data-theme=light] .article-content,html[data-theme=light] .comments{background:white;border-color:#dce8e4}html[data-theme=light] .article-hero{background:linear-gradient(130deg,#dcefe5,#f4f4e7);border-color:#bdd8c9}html[data-theme=light] .article-summary{color:#48695d}html[data-theme=light] input,html[data-theme=light] textarea,html[data-theme=light] select,html[data-theme=light] button{background:#f0f6f2;color:#123d35}html[data-theme=light] .primary{background:#087e69;color:white}@media(max-width:650px){.article-hero,.article-content,.comments{padding:20px}.article-hero h1{font-size:28px}.article-page{margin-top:16px}}
.article-page .article-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px 20px;padding:20px 28px;margin:24px 0}.article-page .article-hero .category-badge{justify-self:start}.article-page .article-hero h1{grid-column:1;grid-row:2;margin:0;font-size:30px}.article-page .article-hero .article-summary{display:none}.article-page .article-hero small{grid-column:2;grid-row:1 / 3;text-align:right;white-space:nowrap}.article-page .article-content{min-height:100vh;min-height:100svh}@media(max-width:600px){.article-page .article-hero{padding:18px;gap:10px}.article-page .article-hero h1{font-size:26px;grid-column:1 / -1}.article-page .article-hero small{grid-row:1;font-size:11px}}

.article-page .article-content{font-size:20px;line-height:1.9}@media(max-width:600px){.article-page .article-content{font-size:18px}}
