:root{--ink:#26362f;--paper:#f5efe2;--red:#a13e30;--line:#d7cab6}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.8 'Noto Sans','Segoe UI',Arial,sans-serif}header,footer{max-width:1200px;margin:auto;padding:22px 30px;display:flex;gap:25px;align-items:center;border-bottom:1px solid var(--line)}header>a{font:700 20px 'Noto Serif','Times New Roman',serif;color:var(--ink);text-decoration:none}nav{flex:1;display:flex;justify-content:center;gap:20px}nav a{font-size:13px;color:var(--ink);text-decoration:none}nav a.active,nav a:hover{color:var(--red)}button{font-family:inherit;padding:7px 12px;background:transparent;border:1px solid #bcae99;border-radius:20px;cursor:pointer}#lang{display:flex;align-items:center;gap:6px;padding:6px 9px}#lang span{display:block;line-height:0}#lang .flag{width:24px;height:16px;border-radius:2px;opacity:.3;transition:opacity .2s;box-shadow:0 0 0 1px rgba(0,0,0,.15)}#lang .on .flag{opacity:1}.hero{min-height:400px;display:grid;place-items:center;text-align:center;padding:35px;background:linear-gradient(#f5efe2d9,#f5efe2e8),var(--bg) center/cover}.hero h1,.article h1{font:italic 600 62px/1.25 'Noto Serif','Times New Roman',serif;margin:10px;color:var(--red)}.hero h1,.article h1{font-size:clamp(44px,6vw,62px)}.eyebrow,.story-number{font-size:11px;color:var(--red);letter-spacing:.15em;font-weight:700}.hero p{max-width:620px}.hero-desc{text-align:left;margin:10px auto;font-weight:600}.reading{max-width:1020px;margin:76px auto 100px;padding:0 25px;display:grid;grid-template-columns:240px minmax(0,1fr);gap:60px}.article-nav{height:max-content;position:sticky;top:28px;background:#f2ebdd;border:1px solid var(--line);border-left:3px solid var(--red);border-radius:8px;padding:20px 20px 16px;display:grid;gap:4px;box-shadow:0 2px 8px rgba(38,54,47,.05)}.article-nav p{font-size:11px;letter-spacing:.14em;color:var(--red);font-weight:700;margin:0 0 10px}.article-nav a{color:#4a574e;font-size:13px;line-height:1.5;text-decoration:none;padding:8px 12px;border-radius:6px;transition:background .15s,color .15s}.article-nav a:hover{color:var(--red);background:#fff9ef}.article-nav a span{font-size:10px;color:#a08a69;margin-right:8px;font-variant-numeric:tabular-nums}.story-article{scroll-margin-top:30px;padding-bottom:68px;margin-bottom:65px;border-bottom:1px solid var(--line)}.story-article:last-child{border-bottom:0;margin-bottom:0}.story-article h2{font:500 34px/1.3 'Noto Serif','Times New Roman',serif;margin:8px 0 18px;color:var(--ink);letter-spacing:-.01em}.story-article a{text-decoration:none}.story-article a:hover h2{color:var(--red)}.story-article .lead{font:600 21px/1.55 'Noto Serif','Times New Roman',serif;color:#405448}.story-article>img{width:100%;max-height:430px;object-fit:cover;margin:16px 0}.article{max-width:800px;margin:60px auto;padding:0 20px}.article>img{width:100%;max-height:420px;object-fit:cover}.content{font-size:17px;text-align:justify;text-justify:inter-word;hyphens:auto}.content p{margin:0 0 23px}.audio{display:flex;gap:12px;align-items:center;background:var(--ink);padding:15px;margin:0;color:white}.audio-box{margin:25px 0}.srt-seg{transition:color .2s,background .2s}.srt-seg.srt-on{color:var(--red)!important;background:rgba(161,62,48,.09);border-radius:3px}.audio audio{width:100%}#top-btn{position:fixed;right:24px;bottom:24px;width:46px;height:46px;border-radius:50%;background:#fff;border:1px solid #bcae99;display:flex;align-items:center;justify-content:center;padding:0;z-index:30;box-shadow:0 3px 10px rgba(0,0,0,.16);opacity:0;pointer-events:none;transform:translateY(10px);transition:opacity .25s,transform .25s}#top-btn svg{width:22px;height:22px}#top-btn.show{opacity:1;pointer-events:auto;transform:translateY(0)}#top-btn:hover{background:var(--red);border-color:var(--red)}#top-btn:hover svg{stroke:#fff}footer{border-top:1px solid var(--line);border-bottom:0;font-size:12px;color:#65746a;justify-content:center}@media(max-width:700px){header{flex-wrap:wrap;padding:17px}nav{order:3;width:100%;justify-content:space-between}.hero h1,.article h1{font-size:42px}.reading{display:block;margin:52px auto;padding:0 20px}.article-nav{position:static;margin-bottom:45px}.story-article h2{font-size:26px}}
