:root { color-scheme: light dark; --bg:#f4f2ec; --card:#fffefa; --text:#20231f; --muted:#697067; --line:#d9dbd2; --accent:#365f4b; }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--text); font-family:ui-serif,"Noto Serif SC","Source Han Serif SC",serif; line-height:1.75; }
header, main, footer { width:min(92vw, 860px); margin-inline:auto; }
header { padding:4.5rem 0 2rem; border-bottom:1px solid var(--line); }
.eyebrow { font:600 .72rem/1.2 ui-sans-serif,sans-serif; letter-spacing:.16em; color:var(--accent); }
h1 { margin:.35rem 0; font-size:clamp(2.4rem,8vw,4.8rem); line-height:1; letter-spacing:-.04em; }
header > p:last-child { color:var(--muted); }
main { padding:1.5rem 0 4rem; display:grid; gap:1rem; }
article { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:1.4rem 1.55rem; }
.meta { display:flex; justify-content:space-between; gap:1rem; color:var(--muted); font:500 .78rem/1.3 ui-sans-serif,sans-serif; }
h2 { margin:.65rem 0 .3rem; font-size:clamp(1.25rem,3vw,1.65rem); line-height:1.45; }
a { color:inherit; text-decoration-color:color-mix(in srgb,var(--accent) 45%,transparent); text-underline-offset:.18em; }
.original { margin:.15rem 0 .75rem; color:var(--muted); font:italic .9rem/1.5 ui-serif,serif; }
article > p:not(.original) { max-width:68ch; }
.read { color:var(--accent); font:600 .86rem/1.4 ui-sans-serif,sans-serif; }
footer { padding:2rem 0 3rem; border-top:1px solid var(--line); color:var(--muted); text-align:center; font-size:.8rem; }
.empty { padding:4rem 0; text-align:center; color:var(--muted); }
@media (prefers-color-scheme:dark) { :root { --bg:#121512; --card:#1a1e1a; --text:#e5e8df; --muted:#a5ada3; --line:#343a34; --accent:#99c9af; } }