/* ============ 潮间 ChewLang - 公共样式 ============ */
:root{
  --paper:#f7f2e8;
  --paper2:#f1ead9;
  --ink:#26231d;
  --dim:#8a8172;
  --red:#b5432e;
  --red-deep:#9d3524;
  --teal:#3d5a57;
  --line:rgba(38,35,29,.14);
  --font-en:'Cormorant Garamond','Times New Roman','Noto Serif SC',serif;
  --font-cn:'Noto Serif SC','Songti SC','SimSun',serif;
  --font-brush:'Ma Shan Zheng','Kaiti SC','STKaiti',KaiTi,'Noto Serif SC',serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font:400 15px/1.9 var(--font-cn);overflow-x:hidden;-webkit-font-smoothing:antialiased}
body.lock{overflow:hidden}
::selection{background:var(--red);color:var(--paper)}
::-webkit-scrollbar{width:10px}
::-webkit-scrollbar-track{background:#f3edde}
::-webkit-scrollbar-thumb{background:#cfc4ab;border:3px solid #f3edde;border-radius:8px}
a{color:inherit;text-decoration:none}
button{font-family:inherit;color:inherit;background:none;border:none;cursor:pointer}
img{display:block}

/* 纸纹 */
.noise{position:fixed;inset:-60%;width:220%;height:220%;pointer-events:none;z-index:220;opacity:.04;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/><feColorMatrix type='saturate' values='0'/></filter><rect width='240' height='240' filter='url(%23n)'/></svg>");
  animation:grain 9s steps(10) infinite}
@keyframes grain{0%,100%{transform:translate(0,0)}10%{transform:translate(-2%,1%)}20%{transform:translate(1%,-2%)}30%{transform:translate(-1%,2%)}40%{transform:translate(2%,1%)}50%{transform:translate(-2%,-1%)}60%{transform:translate(1%,2%)}70%{transform:translate(2%,-2%)}80%{transform:translate(-1%,-1%)}90%{transform:translate(1%,1%)}}

/* 导航 */
.nav{position:fixed;left:0;top:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:20px 4vw;background:rgba(247,242,232,.85);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.logo{font:700 20px/1 var(--font-cn);letter-spacing:.04em}
.logo em{font-style:normal;color:var(--red)}
.nav-links{display:flex;gap:32px}
.nav-links a{position:relative;font:600 13px/1 var(--font-cn);letter-spacing:.35em;padding:6px 0}
.nav-links a::after{content:'';position:absolute;left:0;bottom:0;width:100%;height:1px;background:var(--red);transform:scaleX(0);transform-origin:right;transition:transform .4s cubic-bezier(.7,0,.2,1)}
.nav-links a:hover::after{transform:scaleX(1);transform-origin:left}
.nav-right{display:flex;align-items:center;gap:24px}
.menu-btn{display:none;font:600 13px/1 var(--font-cn);letter-spacing:.3em;color:var(--red);padding:6px 0}

/* 全屏菜单 */
.menu{position:fixed;inset:0;background:var(--red);color:var(--paper);z-index:300;transform:translateY(-102%);transition:transform .7s cubic-bezier(.85,0,.15,1);display:flex;flex-direction:column;padding:20px 6vw 5vw}
.menu.shown{transform:none}
.menu-head{display:flex;justify-content:space-between;align-items:center;padding:14px 0}
.menu-head .logo{color:var(--paper)}
.menu-close{font:600 13px/1 var(--font-cn);letter-spacing:.3em;color:var(--paper)}
.menu-nav{flex:1;display:flex;flex-direction:column;justify-content:center;gap:6px}
.menu-nav a{font:900 clamp(40px,10vw,72px)/1.25 var(--font-cn);display:flex;align-items:baseline;gap:18px}
.menu-nav a small{font:600 12px/1 var(--font-en);letter-spacing:.3em;color:rgba(247,242,232,.7)}
.menu-foot{display:flex;justify-content:space-between;font:500 12px/1.6 var(--font-cn);letter-spacing:.15em;color:rgba(247,242,232,.8)}

/* 通用 */
section{padding:14vh 4vw}
.eyebrow{font:600 11px/1 var(--font-en);letter-spacing:.3em;color:var(--dim);text-transform:uppercase;display:flex;align-items:center;gap:16px;margin-bottom:52px}
.eyebrow b{color:var(--red);font-weight:600;font-family:var(--font-brush);font-size:17px;letter-spacing:.2em}
.eyebrow::after{content:'';flex:1;height:1px;background:var(--line)}
.fade{opacity:0;transform:translateY(44px);transition:opacity .9s ease,transform .9s cubic-bezier(.16,1,.3,1)}
.fade.in{opacity:1;transform:none}

/* 页脚 */
footer{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding:26px 4vw;border-top:1px solid var(--line)}
footer p,footer a,footer button{font:500 12px/1.8 var(--font-cn);letter-spacing:.15em;color:var(--dim)}
.f-links{display:flex;gap:26px}
.f-links a:hover,footer button:hover{color:var(--red)}

/* 水波纹分隔 */
.wave{height:16px;margin:0 4vw;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='16' viewBox='0 0 40 16'><path d='M0 13 A20 11 0 0 1 40 13' fill='none' stroke='%2326231d' stroke-opacity='.32' stroke-width='1.2'/></svg>");
  background-repeat:repeat-x;background-position:center}

/* 章节页面专用 */
.chapter-hero{min-height:60svh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:120px 4vw 60px;background:linear-gradient(180deg,#f4efdf 0%,var(--paper) 55%,#e3e6df 100%);position:relative;overflow:hidden}
.chapter-hero .ch-icon{width:min(280px,60vw);height:auto;margin-bottom:40px;opacity:0;transform:translateY(30px);transition:opacity .9s .3s,transform .9s cubic-bezier(.16,1,.3,1) .3s}
.chapter-hero.ready .ch-icon{opacity:1;transform:none}
.chapter-hero h1{font:900 clamp(48px,10vw,120px)/1.1 var(--font-cn);letter-spacing:.08em;opacity:0;transform:translateY(30px);transition:opacity .9s .5s,transform .9s cubic-bezier(.16,1,.3,1) .5s}
.chapter-hero.ready h1{opacity:1;transform:none}
.chapter-hero .ch-subtitle{font:600 11px/1 var(--font-en);letter-spacing:.32em;color:var(--dim);text-transform:uppercase;margin-top:16px;opacity:0;transition:opacity .9s .7s}
.chapter-hero.ready .ch-subtitle{opacity:1}
.chapter-hero .ch-desc{max-width:46ch;font:400 15px/2 var(--font-cn);color:var(--dim);margin-top:30px;text-align:center;opacity:0;transition:opacity .9s .9s}
.chapter-hero.ready .ch-desc{opacity:1}

.chapter-content{max-width:900px;margin:0 auto;padding:8vh 4vw}
.chapter-content h2{font:700 clamp(28px,4vw,42px)/1.4 var(--font-cn);letter-spacing:.06em;margin:60px 0 24px;border-bottom:1px solid var(--line);padding-bottom:16px}
.chapter-content p{font:400 15px/2.2 var(--font-cn);color:var(--dim);margin-bottom:20px}
.chapter-content p strong{color:var(--ink);font-weight:700}
.chapter-content img{width:100%;border:1px solid var(--line);margin:30px 0}
.chapter-content blockquote{border-left:3px solid var(--red);padding-left:20px;margin:30px 0;font-style:italic;color:var(--dim)}

/* Toast */
.toast{position:fixed;right:24px;bottom:24px;z-index:400;background:var(--ink);border:1px solid var(--red);color:var(--paper);font:500 13px/1.6 var(--font-cn);letter-spacing:.08em;padding:16px 22px;opacity:0;transform:translateY(16px);pointer-events:none;transition:opacity .4s,transform .4s;max-width:min(80vw,360px)}
.toast.show{opacity:1;transform:none}

/* 响应式 */
@media (max-width:720px){
  .nav-links{display:none}
  .menu-btn{display:block}
  .chapter-hero{min-height:50svh;padding:100px 4vw 40px}
}
@media (prefers-reduced-motion:reduce){
  .noise,.ast,.stamp{animation:none}
  .fade{transform:none!important;opacity:1!important;transition:none!important}
}
