:root{
  --bg:#0d1119; --bg2:#131a27; --panel:#161e2c; --ink:#eef1f6; --dim:#8f9cb4;
  --accent:#f0b881; --btnink:#1b1409; --line:rgba(238,241,246,.10);
  --wash:radial-gradient(120% 80% at 80% -10%, rgba(120,150,210,.18) 0%, rgba(0,0,0,0) 55%),
         radial-gradient(90% 60% at 10% 110%, rgba(240,184,129,.10) 0%, rgba(0,0,0,0) 60%);
  --veil:linear-gradient(to top, rgba(9,12,18,.94) 6%, rgba(9,12,18,.5) 44%, rgba(9,12,18,.04) 80%);
  --hero-veil:linear-gradient(to top, rgba(8,10,16,.97) 8%, rgba(8,10,16,.88) 30%, rgba(8,10,16,.55) 52%, rgba(8,10,16,.12) 78%, rgba(8,10,16,0) 94%);
  --shadow:0 24px 60px -30px rgba(0,0,0,.75);
  color-scheme:dark;
}
[data-theme="light"]{
  --bg:#f4efe6; --bg2:#eee7da; --panel:#fffdf8; --ink:#2b2621; --dim:#6f6659;
  --accent:#9c5b36; --btnink:#fff8f0; --line:rgba(43,38,33,.14);
  --wash:radial-gradient(100% 70% at 100% 0%, rgba(168,102,60,.07) 0%, rgba(0,0,0,0) 60%);
  --veil:linear-gradient(to top, rgba(244,239,230,.96) 6%, rgba(244,239,230,.5) 44%, rgba(244,239,230,.04) 80%);
  --shadow:0 24px 60px -34px rgba(60,40,20,.35);
  --hero-veil:linear-gradient(to top, rgba(8,10,16,.97) 8%, rgba(8,10,16,.88) 30%, rgba(8,10,16,.55) 52%, rgba(8,10,16,.12) 78%, rgba(8,10,16,0) 94%);
  color-scheme:light;}
@media (prefers-color-scheme:light){
 :root:not([data-theme="dark"]):not([data-theme="light"]){
   --bg:#f4efe6; --bg2:#eee7da; --panel:#fffdf8; --ink:#2b2621; --dim:#6f6659;
   --accent:#9c5b36; --btnink:#fff8f0; --line:rgba(43,38,33,.14);
   --wash:radial-gradient(100% 70% at 100% 0%, rgba(168,102,60,.07) 0%, rgba(0,0,0,0) 60%);
   --veil:linear-gradient(to top, rgba(244,239,230,.96) 6%, rgba(244,239,230,.5) 44%, rgba(244,239,230,.04) 80%);
   --shadow:0 24px 60px -34px rgba(60,40,20,.35);
   color-scheme:light;
   --hero-veil:linear-gradient(to top, rgba(8,10,16,.97) 8%, rgba(8,10,16,.88) 30%, rgba(8,10,16,.55) 52%, rgba(8,10,16,.12) 78%, rgba(8,10,16,0) 94%);
}
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;
 line-height:1.62;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;background:var(--wash)}
.wrap{max-width:1120px;margin:0 auto;padding:0 26px;position:relative;z-index:1}
a{color:inherit}
.serif{font-family:"Noto Serif SC","Songti SC",serif}
.lat{font-family:"Newsreader",Georgia,serif}

/* ---------- header ---------- */
.top{display:flex;align-items:center;gap:16px;padding:26px 0 22px;position:sticky;top:0;
 background:linear-gradient(var(--bg) 72%, rgba(0,0,0,0));z-index:5}
.mark{display:flex;align-items:center;gap:11px;text-decoration:none}
.glyph{width:34px;height:34px;border-radius:50%;background:var(--panel);border:1px solid var(--line);
 display:grid;place-items:center;font-family:"Newsreader",serif;font-size:16px;color:var(--accent);
 cursor:pointer;transition:transform .5s cubic-bezier(.22,1,.36,1),border-color .3s ease}
.glyph:hover{border-color:var(--accent);transform:rotate(8deg)}
.wordmark{font-family:"Newsreader",Georgia,serif;font-size:17px;letter-spacing:.05em}
.nav{margin-left:auto;display:flex;gap:24px;font-size:14px}
.nav a{color:var(--dim);text-decoration:none;transition:color .3s ease}
.nav a:hover{color:var(--ink)}
.nav a.on{color:var(--ink);border-bottom:1px solid var(--accent);padding-bottom:3px}
.tbtn{width:28px;height:28px;border-radius:50%;border:1px solid var(--line);background:var(--panel);
 color:var(--dim);cursor:pointer;font-size:13px;line-height:1;display:grid;place-items:center;
 transition:border-color .3s ease,color .3s ease}
.tbtn svg{width:15px;height:15px;display:block}
.tbtn:hover{border-color:var(--accent);color:var(--ink)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
.chip:focus-visible,.btn:focus-visible,.tbtn:focus-visible,.glyph:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ---------- hero（A 的柔光 + C 的期数感） ---------- */
.kicker{font-family:"Newsreader",Georgia,serif;font-size:12.5px;letter-spacing:.2em;color:var(--accent)}
.hero{padding:14px 0 8px}
.frame{position:relative;border-radius:20px;overflow:hidden;border:1px solid var(--line);
 box-shadow:var(--shadow);background:var(--bg2)}
.frame img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
.frame .veil{position:absolute;inset:0;background:var(--hero-veil, var(--veil))}
.frame .txt{position:absolute;left:0;right:0;bottom:0;padding:30px 30px 26px}
.hero h1{font-family:"Noto Serif SC","Songti SC",serif;font-weight:600;font-size:31px;line-height:1.3;
 letter-spacing:-.004em;text-wrap:balance;max-width:26ch;margin:12px 0 10px;color:#fff;
 text-shadow:0 2px 24px rgba(0,0,0,.55)}
.hero .meta{font-size:14px;color:rgba(255,255,255,.72)}
.hero .meta b{color:#fff;font-weight:500}
.hero .row{display:flex;align-items:center;gap:10px;margin-top:16px;flex-wrap:wrap}
.hero .row .tag{border-color:rgba(255,255,255,.28);color:rgba(255,255,255,.82);background:rgba(0,0,0,.18)}
.hero .row .tail{margin-left:auto;font-size:12.5px;color:rgba(255,255,255,.62)}
.hero .row .tail a{color:rgba(255,255,255,.86);text-decoration:none;border-bottom:1px solid rgba(255,255,255,.3)}
[data-theme="light"] .hero h1{color:#fff}
.credit{display:none;font-size:12.5px;color:var(--dim);margin-top:10px}
.acts{display:flex;gap:12px;align-items:center;margin-top:20px;flex-wrap:wrap}
.tag{display:inline-flex;align-items:center;height:23px;padding:0 10px;border-radius:999px;
 border:1px solid var(--line);font-size:12px;color:var(--dim);text-decoration:none;
 transition:border-color .3s ease,color .3s ease}
a.tag:hover{border-color:var(--accent);color:var(--ink)}
.btn{display:inline-flex;align-items:center;height:36px;padding:0 17px;border-radius:999px;
 background:var(--accent);color:var(--btnink);font-size:13.5px;font-weight:500;text-decoration:none;
 transition:transform .45s cubic-bezier(.22,1,.36,1),filter .3s ease}
.btn:hover{filter:brightness(1.06);transform:translateY(-1px)}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}

/* ---------- 工具条 ---------- */
.bar{display:flex;align-items:center;gap:12px;padding:34px 0 6px}
.chips{display:flex;align-items:center;gap:10px;flex-wrap:wrap;flex:1;min-width:0}
.tools{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.chip{height:29px;padding:0 13px;border-radius:999px;border:1px solid var(--line);background:var(--panel);
 font-size:13px;color:var(--dim);cursor:pointer;transition:border-color .3s ease,color .3s ease}
.chip:hover{color:var(--ink)}
.chip.on{color:var(--ink);border-color:var(--accent)}
.sep{width:1px;height:18px;background:var(--line);margin:0 4px}
.srch{display:flex;align-items:center;height:31px;padding:0 14px;border-radius:999px;
 border:1px solid var(--line);background:var(--panel)}
.srch input{background:none;border:0;outline:0;color:var(--ink);font-size:13px;width:190px;font-family:inherit}
.srch input::placeholder{color:var(--dim)}
.dice{border:1px solid var(--line);background:var(--panel);color:var(--ink);height:31px;padding:0 15px;
 border-radius:999px;font-size:13px;cursor:pointer;
 transition:border-color .3s ease}
.dice:hover{border-color:var(--accent)}
.dice svg{width:13px;height:13px;margin-right:7px;color:var(--accent);flex:0 0 auto}

/* ---------- 归档时间轴（C） ---------- */
.sect{display:flex;align-items:baseline;gap:12px;margin:26px 0 4px}
.sect h2{font-family:"Noto Serif SC",serif;font-size:16px;font-weight:600;letter-spacing:.02em}
.sect span{font-family:"Newsreader",serif;font-size:12px;color:var(--dim);letter-spacing:.14em}
.rule{height:1px;background:var(--line);flex:1}
.tl{padding-bottom:20px}
.node{display:grid;grid-template-columns:112px 236px minmax(0,1fr);gap:20px;align-items:center;
 padding:16px 0;position:relative;border-bottom:1px solid var(--line)}
.node::before{content:"";position:absolute;left:-14px;top:0;bottom:0;width:1px;background:var(--line)}
.node .dot{position:absolute;left:-18px;top:50%;width:9px;height:9px;border-radius:50%;
 background:var(--accent);transform:translateY(-50%)}
.node .when{font-family:"Newsreader",serif;font-size:13px;color:var(--dim);letter-spacing:.06em}
.node .when i{font-style:normal;display:block;font-size:11px;letter-spacing:.18em;opacity:.7;margin-top:2px}
.node .th{border-radius:12px;overflow:hidden;border:1px solid var(--line);background:var(--bg2)}
.node .th img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;
 transition:transform 1.2s cubic-bezier(.22,1,.36,1)}
.node:hover .th img{transform:scale(1.03)}
.node .t{font-family:"Noto Serif SC",serif;font-size:17px;font-weight:500;line-height:1.45;text-wrap:balance}
.node .t a{text-decoration:none;background-image:linear-gradient(var(--accent),var(--accent));
 background-size:0% 1px;background-position:0 100%;background-repeat:no-repeat;
 transition:background-size .55s cubic-bezier(.22,1,.36,1)}
.node:hover .t a,.node:focus-within .t a{background-size:100% 1px}
.node:hover .th{filter:brightness(1.06)}
.node .th{transition:filter .5s ease}
.node .m{font-size:12.5px;color:var(--dim);margin-top:7px}
.node .m b{color:var(--ink);font-weight:500}
.node .tags{margin-top:10px;display:flex;gap:6px;flex-wrap:wrap}
.node[hidden]{display:none}
.empty{padding:30px 0;color:var(--dim);font-size:13.5px}

/* ---------- 详情页 ---------- */
.crumb{font-family:"Newsreader",serif;font-size:12px;letter-spacing:.14em;color:var(--dim);padding:4px 0 14px}
.crumb a{color:inherit;text-decoration:none}
.crumb a:hover{color:var(--ink)}
.player{border-radius:16px;overflow:hidden;border:1px solid var(--line);background:#000;
 aspect-ratio:16/9;box-shadow:var(--shadow);max-width:920px;margin:0 auto}
.player iframe{width:100%;height:100%;border:0;display:block}
h1.dt{font-family:"Noto Serif SC",serif;font-size:27px;font-weight:600;line-height:1.34;
 margin:18px 0 12px;max-width:26ch;text-wrap:balance}
.dmeta{font-size:14px;color:var(--dim)}
.dtags{margin-top:12px}
.dmeta b{color:var(--ink);font-weight:500}
.dmeta a{color:var(--accent);text-decoration:none}
.nf{padding:46px 0 10px}
.nf h1{font-family:"Noto Serif SC",serif;font-size:28px;font-weight:600;margin:12px 0 10px;color:var(--ink)}
.nf p{color:var(--dim);font-size:14px}
.credits{border-left:2px solid var(--accent);padding:2px 0 2px 16px;font-size:13.5px;color:var(--dim);
 line-height:1.95;margin:32px 0 8px;max-width:66ch}
.credits b{color:var(--ink);font-weight:500}
.next{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:32px 0 12px}
.next a{display:block;border:1px solid var(--line);border-radius:14px;padding:16px 18px;background:var(--panel);
 text-decoration:none;transition:border-color .3s ease}
.next a:hover{border-color:var(--accent)}
.next .lab{font-family:"Newsreader",serif;font-size:11px;letter-spacing:.18em;color:var(--dim)}
.next .nm{font-family:"Noto Serif SC",serif;font-size:15px;margin-top:8px;line-height:1.45}
.next .off{opacity:.38;pointer-events:none}

/* ---------- 关于 ---------- */
.about{padding:12px 0 8px;max-width:62ch}
.about h1{font-family:"Noto Serif SC",serif;font-size:26px;font-weight:600;margin-bottom:18px}
.about p{font-size:14.5px;color:var(--dim);margin-bottom:16px}
.about p b{color:var(--ink);font-weight:500}

/* ---------- 页脚 ---------- */
.foot{border-top:1px solid var(--line);margin-top:44px;padding:26px 0 46px;font-size:12.5px;color:var(--dim)}
.foot .dis{max-width:66ch;line-height:1.85}
.foot a{border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}

/* ---------- 入场：位移衰减到零，不跳变 ---------- */
.js .rise{opacity:0;transform:translateY(9px);transition:opacity .45s ease,transform .95s cubic-bezier(.16,1,.3,1)}
.js .rise.in{opacity:1;transform:translateY(0)}
@media (prefers-reduced-motion:reduce){.js .rise{opacity:1;transform:none;transition:none}}

.tracks{width:100%;border-collapse:collapse;font-size:14px}
.tracks td{padding:11px 8px;border-bottom:1px solid var(--line);vertical-align:baseline}
.tracks .n{color:var(--dim);width:34px;font-size:12.5px;letter-spacing:.08em}
.tracks .g{font-family:"Noto Serif SC",serif;color:var(--ink)}
.tracks .a{color:var(--dim);font-size:13px;width:34%}
.tracks .t{color:var(--dim);text-align:right;white-space:nowrap;font-size:13px;width:64px}
.tk{display:inline-flex;align-items:center;height:20px;padding:0 8px;margin-left:8px;border-radius:999px;
 border:1px solid var(--line);font-size:11.5px;color:var(--dim);vertical-align:2px}

@media (max-width:820px){
 .wrap{padding:0 18px}
 .top{padding:18px 0 14px;gap:12px}
 .nav{gap:14px;font-size:13px}
 .hero h1{font-size:22px}
 .frame{border-radius:14px}
 .frame img{aspect-ratio:4/5;object-position:36% 50%}
 .frame .txt{padding:20px 16px 18px}
 .hero .row .tail{margin-left:0;width:100%}
 .node{grid-template-columns:minmax(0,1fr);gap:12px;padding:22px 0 20px}
 .node::before{left:0}
 .node .dot{left:-4.5px;top:26px;transform:none}
 .node .when{padding-left:20px;order:-1}
 .node .when i{display:inline;margin-left:10px}
 .node .th{margin-left:20px}
 .node .t{font-size:16.5px}
 .node .tags,.node .m{margin-left:20px}
 .bar{flex-wrap:wrap;padding-bottom:10px}
 .chips{flex-wrap:nowrap;overflow-x:auto;width:100%;padding-bottom:4px;
        scrollbar-width:none;-webkit-overflow-scrolling:touch;
        mask-image:linear-gradient(90deg,#000 88%,transparent)}
 .chips::-webkit-scrollbar{display:none}
 .chip{flex:0 0 auto}
 .sep{display:none}
 .tools{width:100%}
 .srch{flex:1;min-width:0}
 .dice{flex:0 0 auto}
 .srch input{width:100%}
 .next{grid-template-columns:1fr}
 h1.dt{font-size:21px}
}