/* 大老李聊数学和天南海北 · shared styles for the site's own pages */
:root{
  --ground:#F7F4EE; --surface:#FFFFFF; --ink:#1F2328; --muted:#646B73; --rule:#DED8CC; --rule-soft:#ECE7DD;
  --accent:#B4452C; --accent-ink:#963620; --tint:#F6E4DC; --code:#EFEAE0;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ground:#15171A; --surface:#1D2024; --ink:#E7E4DE; --muted:#A0A6AD; --rule:#33373D; --rule-soft:#262A2F;
    --accent:#E6896F; --accent-ink:#F0A48F; --tint:#3A2620; --code:#262A2F;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --ground:#15171A; --surface:#1D2024; --ink:#E7E4DE; --muted:#A0A6AD; --rule:#33373D; --rule-soft:#262A2F;
  --accent:#E6896F; --accent-ink:#F0A48F; --tint:#3A2620; --code:#262A2F;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{font-size:17px; -webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--ground); color:var(--ink);
  font-family:"Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
  line-height:1.75;
}
h1,h2,h3,h4{font-family:"Noto Serif SC","Songti SC","STSong",Georgia,serif; font-weight:700; line-height:1.3; text-wrap:balance}
a{color:var(--accent-ink); text-underline-offset:.18em}
a:hover{color:var(--accent)}
img{max-width:100%; height:auto}
.wrap{max-width:1180px; margin-inline:auto; padding-inline:16px}
@media (min-width:640px){ .wrap{padding-inline:32px} }

/* home */
.hero{padding-block:3.5rem 2rem}
.hero h1{font-size:clamp(2rem,1.4rem + 3vw,3.2rem); margin:0 0 .6rem; letter-spacing:.02em}
.hero p{color:var(--muted); max-width:36em; margin:0; font-size:1.05rem}
.eyebrow{font-size:.8rem; letter-spacing:.12em; color:var(--accent-ink); font-weight:600; margin-bottom:.6rem}
.cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr)); gap:1.25rem; padding-block:1rem 3rem}
.card{display:flex; flex-direction:column; background:var(--surface); border:1px solid var(--rule); border-radius:10px; overflow:hidden; color:inherit; text-decoration:none; transition:border-color .15s, transform .15s}
.card:hover{border-color:var(--accent); transform:translateY(-2px)}
.card .art{aspect-ratio:16/9; background:var(--rule-soft); display:flex; align-items:center; justify-content:center; overflow:hidden; border-bottom:1px solid var(--rule)}
.card .art img{width:100%; height:100%; object-fit:contain; padding:1rem}
.card .art .big{font-family:"Noto Serif SC",Georgia,serif; font-size:clamp(1.3rem,1rem + 1.4vw,2rem); color:var(--ink); text-align:center; line-height:1.4; padding:1rem}
.card .art .big .num{display:block; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.76rem; margin-block:.4rem; overflow-wrap:anywhere}
.card .art .big mark{background:var(--tint); color:var(--accent-ink); border-radius:3px; padding-inline:.1em}
.card .art .big small{display:block; font-family:ui-monospace,Menlo,monospace; font-size:.55em; color:var(--muted); letter-spacing:.02em}
.card .body{padding:1.1rem 1.25rem 1.3rem}
.card h2{margin:0 0 .35rem; font-size:1.35rem}
.card p{margin:0; color:var(--muted); font-size:.95rem}
.card .tags{margin-top:.8rem; display:flex; gap:.4rem; flex-wrap:wrap}
.tag{font-size:.75rem; padding:.1rem .55rem; border-radius:99px; background:var(--tint); color:var(--accent-ink)}
.section-title{font-size:1.1rem; color:var(--muted); font-weight:600; margin:1.5rem 0 .7rem; font-family:inherit}
.ref{color:var(--muted); font-size:.85rem; margin:0}

/* section landing */
.links{display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr)); gap:1rem; padding-block:.5rem 2.5rem}
.link{display:block; background:var(--surface); border:1px solid var(--rule); border-radius:10px; padding:1.1rem 1.25rem; color:inherit; text-decoration:none}
.link:hover{border-color:var(--accent)}
.link h3{margin:0 0 .3rem; font-size:1.15rem; color:var(--accent-ink)}
.link p{margin:0; color:var(--muted); font-size:.93rem}
.facts{background:var(--surface); border:1px solid var(--rule); border-radius:10px; padding:1rem 1.25rem 1rem 2.4rem; margin:0 0 3rem}
.facts li{margin-block:.35rem}

/* article */
.article-layout{display:grid; grid-template-columns:minmax(0,1fr); gap:2rem; padding-block:2rem 4rem}
@media (min-width:1100px){
  .article-layout{grid-template-columns:minmax(0,1fr) 230px}
  .toc{position:sticky; top:1rem; align-self:start; max-height:calc(100vh - 2rem); overflow:auto; order:2}
}
.wrap.wide{max-width:1180px}
.toc{font-size:.88rem; border-left:2px solid var(--rule); padding-left:1rem}
.toc strong{display:block; color:var(--muted); margin-bottom:.4rem}
.toc ol{list-style:none; margin:0; padding:0}
.toc li{margin-block:.3rem}
.toc a{color:var(--muted); text-decoration:none}
.toc a:hover{color:var(--accent-ink)}
.prose{max-width:46em; min-width:0}
.prose h1.title{font-size:clamp(1.7rem,1.3rem + 2vw,2.5rem); margin:0 0 .4rem}
.prose .byline{color:var(--muted); margin:0 0 2rem; font-size:.95rem}
.prose h2{font-size:1.6rem; margin:3rem 0 1rem; padding-top:.5rem; border-top:1px solid var(--rule)}
.prose h3{font-size:1.3rem; margin:2.2rem 0 .8rem}
.prose h4{font-size:1.1rem; margin:1.8rem 0 .6rem}
.prose h5{font-size:1rem; margin:1.5rem 0 .5rem}
.prose p{margin:0 0 1.1rem}
.prose img{display:block; margin:1.2rem auto; border-radius:6px; background:#fff}
.prose blockquote{margin:1.2rem 0; padding:.6rem 1rem; border-left:3px solid var(--accent); background:var(--tint); border-radius:0 6px 6px 0}
.prose blockquote p{margin:0}
.prose hr{border:0; border-top:1px dashed var(--rule); margin:2rem 0}
.prose code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.88em; background:var(--code); padding:.08em .35em; border-radius:4px}
.prose pre{background:var(--code); padding:1rem; border-radius:8px; overflow-x:auto; line-height:1.5}
.prose pre code{background:none; padding:0}
.prose .tablewrap{overflow-x:auto; margin:1.2rem 0}
.prose table{border-collapse:collapse; font-size:.92rem; font-variant-numeric:tabular-nums}
.prose th,.prose td{border:1px solid var(--rule); padding:.35rem .65rem; text-align:center}
.prose th{background:var(--rule-soft)}
.prose .katex-display{overflow-x:auto; overflow-y:hidden; padding-block:.3rem}
.prose ul,.prose ol{padding-left:1.4em}
.prose li{margin-block:.3rem}
