:root{
  --bg:#faf9f6; --fg:#1c1c1c; --muted:#8b8578; --line:#dcd6c8; --accent:#2c4a5e;
  --serif:"Songti SC","SimSun","Source Han Serif SC","Noto Serif CJK SC",serif;
  --sans:-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;
  --mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  --lyric:-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;
}
[data-theme="dark"]{
  --bg:#131313; --fg:#e4e0d6; --muted:#8d887e; --line:#2f2f2f; --accent:#8fb4cb;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#131313; --fg:#e4e0d6; --muted:#8d887e; --line:#2f2f2f; --accent:#8fb4cb;
  }
}

*{ box-sizing:border-box; }
body{ margin:0; background:var(--bg); color:var(--fg); font-family:var(--sans); line-height:1.7; transition:background .25s,color .25s; }
a{ color:inherit; text-decoration:none; }

/* 页头 */
.site-head{ max-width:1060px; margin:0 auto; padding:2.5rem 1.5rem 1.5rem; display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; }
.brand h1{ margin:0; font-family:var(--serif); font-size:1.6rem; font-weight:600; letter-spacing:.06em; }
.tagline{ margin:.35rem 0 0; color:var(--muted); font-size:.85rem; letter-spacing:.08em; }
.theme-toggle{ border:1px solid var(--line); background:transparent; color:var(--muted); width:2.2rem; height:2.2rem; border-radius:50%; cursor:pointer; font-size:.95rem; }
.theme-toggle:hover{ color:var(--fg); border-color:var(--fg); }

/* 两栏 */
.layout{ max-width:1060px; margin:0 auto; padding:0 1.5rem 5rem; display:grid; grid-template-columns:220px minmax(0,1fr); gap:3rem; align-items:start; }

/* 左侧目录树 */
.toc{ position:sticky; top:2rem; max-height:calc(100vh - 4rem); overflow-y:auto; overscroll-behavior:contain; }
.toc-inner{ padding-bottom:2rem; }
.toc-year{ margin-bottom:1.6rem; }
.toc-year-title{ margin:0 0 .5rem; font-family:var(--mono); font-size:.8rem; font-weight:400; letter-spacing:.2em; color:var(--muted); }
.toc ul{ list-style:none; margin:0; padding:0; }
.toc li a{ display:flex; justify-content:space-between; align-items:baseline; padding:.32rem .4rem .32rem .9rem; margin-left:-.4rem; border-left:2px solid transparent; color:var(--fg); font-size:.9rem; }
.toc li a:hover{ color:var(--accent); }
.toc li a.active{ color:var(--accent); border-left-color:var(--accent); background:color-mix(in srgb, var(--accent) 8%, transparent); }
.toc-date{ font-family:var(--mono); font-size:.72rem; color:var(--muted); letter-spacing:.04em; white-space:nowrap; margin-left:.8rem; }

/* 右侧内容区 */
.stage{ min-height:60vh; }
.welcome{ display:flex; align-items:center; justify-content:center; min-height:50vh; }
.welcome-hint{ color:var(--muted); font-size:.9rem; letter-spacing:.1em; }

.lyric{ animation:fade-in .25s ease; }
@keyframes fade-in{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:none; } }
.lyric-title{ margin:0 0 .4rem; font-family:var(--serif); font-size:1.35rem; font-weight:600; letter-spacing:.04em; }
.alias{ font-size:.75rem; font-weight:400; color:var(--muted); letter-spacing:.08em; margin-left:.5rem; }
.lyric-meta{ margin:0 0 1.6rem; font-family:var(--mono); font-size:.72rem; color:var(--muted); letter-spacing:.08em; }
.lyric-body{ font-family:var(--sans); font-size:1rem; line-height:1.9; white-space:pre-line; max-width:34em; }

#site-name-link{ color:inherit; text-decoration:none; }
#site-name-link:hover #site-name{ color:var(--accent); }
.lyric-title{ margin:0 0 .4rem; font-family:var(--serif); font-size:1.35rem; font-weight:600; letter-spacing:.04em; }

.site-foot{ max-width:1060px; margin:0 auto; padding:1.5rem; border-top:1px solid var(--line); color:var(--muted); font-size:.78rem; letter-spacing:.05em; }

/* 移动端下拉 */
.mobile-toc{ display:none; }

@media (max-width:820px){
  .layout{ grid-template-columns:1fr; gap:1rem; }
  .toc{ display:none; }
  .mobile-toc{
    display:block;
    max-width:1060px; width:calc(100% - 3rem); margin:0 auto .5rem;
    padding:.6rem .5rem;
    background:var(--bg); color:var(--fg); border:1px solid var(--line); border-radius:4px;
    font-size:.9rem;
  }
  .lyric-body{ font-size:1rem; }
}
@media (prefers-reduced-motion:reduce){ *{ transition:none!important; animation:none!important; } }

/* ===== 滚动条 ===== */

/* Firefox */
*{ scrollbar-width:thin; scrollbar-color:var(--line) transparent; }

/* Chrome / Safari / Edge */
::-webkit-scrollbar{ width:6px; height:6px; }
::-webkit-scrollbar-track{ background:transparent; }
::-webkit-scrollbar-thumb{ background:var(--line); border-radius:3px; }
::-webkit-scrollbar-thumb:hover{ background:var(--muted); }
::-webkit-scrollbar-corner{ background:transparent; }

/* 左侧目录单独再细一点（可选） */
.toc::-webkit-scrollbar{ width:4px; }