/* Shared navigation and editorial page patterns. Page-specific designs remain scoped locally. */
body.sp-index-page { margin:0; background:#fdfdfc; color:#1a1a1a; font-family:"Iowan Old Style","Source Serif Pro","Source Serif",Georgia,"Times New Roman","Songti SC","STSong",serif; font-size:18px; line-height:1.7; }
.sp-index-page * { box-sizing:border-box; }
@media (prefers-color-scheme:dark) { body.sp-index-page { background:#1a1a1a; color:#e8e6e1; } }
.sp-skip { position:absolute; top:-5rem; left:1rem; z-index:100; padding:.5rem .8rem; background:#fdfdfc; color:#1a1a1a; font:600 .9rem/1.5 system-ui,sans-serif; }
.sp-skip:focus { top:1rem; }
.sp-header, .sp-footer { --sp-accent:#3157c8; color:inherit; font-family:"Iowan Old Style","Source Serif Pro","Source Serif",Georgia,"Times New Roman","Songti SC","STSong",serif; }
.sp-header--dark, .sp-footer--dark { --sp-accent:#9ab2ff; }
body.light .sp-header--dark, body.light .sp-footer--dark, :root[data-theme="light"] .sp-header--dark, :root[data-theme="light"] .sp-footer--dark { --sp-accent:#3157c8; }
.sp-header { width:min(100% - 3rem,1100px); margin-inline:auto; border-bottom:1px solid rgba(128,128,128,.28); }
.sp-header__inner { display:flex; align-items:center; justify-content:space-between; gap:1.5rem; min-height:88px; }
.sp-header .sp-brand { flex:none; color:inherit; font-size:1.42rem; font-weight:600; letter-spacing:-.025em; text-decoration:none; border:0; opacity:1; }
.sp-nav { display:flex; flex-wrap:wrap; align-items:center; gap:.25rem 1.45rem; font:600 1.06rem/1.5 system-ui,sans-serif; }
.sp-nav a { display:inline-block; padding:.55rem .08rem; color:inherit; opacity:.95; text-decoration:none; border:0; border-bottom:2px solid rgba(128,128,128,.35); border-radius:0; }
.sp-nav a:hover, .sp-nav a[aria-current] { color:var(--sp-accent); opacity:1; border-bottom-color:var(--sp-accent); }
.sp-header a:focus-visible, .sp-footer a:focus-visible { outline:2px solid var(--sp-accent); outline-offset:4px; }
.sp-footer { width:min(100% - 3rem,1100px); margin-inline:auto; padding:1.5rem 0 2.5rem; border-top:1px solid rgba(128,128,128,.28); font:400 .8rem/1.6 system-ui,sans-serif; opacity:.75; }
.sp-footer__inner { display:flex; justify-content:space-between; flex-wrap:wrap; gap:.5rem 2rem; }
.sp-footer p { margin:0; color:inherit; font:inherit; opacity:1; letter-spacing:0; }
@media (prefers-color-scheme:dark) { .sp-header, .sp-footer { --sp-accent:#9ab2ff; } }
@media (max-width:640px) {
  .sp-header__inner { align-items:stretch; flex-direction:column; gap:.5rem; padding:1.2rem 0 1rem; }
  .sp-nav { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.55rem; }
  .sp-nav a { margin:0; padding:.55rem .7rem; border:1px solid rgba(128,128,128,.3); border-radius:4px; }
  .sp-nav a:hover, .sp-nav a[aria-current] { border-color:var(--sp-accent); }
}

.sp-index { width:min(100% - 3rem,1100px); margin-inline:auto; padding:clamp(3rem,7vw,6.5rem) 0 5rem; color:inherit; }
.sp-index .sp-kicker { margin:0 0 1rem; color:#3157c8; font:600 .76rem/1.5 system-ui,sans-serif; letter-spacing:.15em; text-transform:uppercase; }
.sp-index h1 { max-width:900px; margin:0 0 1.2rem; font-size:clamp(2.8rem,6vw,5rem); font-weight:500; letter-spacing:-.05em; line-height:1.14; }
.sp-index .sp-intro { max-width:680px; margin:0 0 4.5rem; color:inherit; opacity:.7; font-size:clamp(1.05rem,2vw,1.22rem); line-height:1.85; }
.sp-index-section { border-top:1px solid rgba(128,128,128,.28); padding:1.6rem 0 2.5rem; }
.sp-index-label { margin:0 0 1.4rem; color:inherit; opacity:.65; font:600 .75rem/1.5 system-ui,sans-serif; letter-spacing:.14em; text-transform:uppercase; }
.sp-context { max-width:720px; margin:0; color:inherit; opacity:.7; font-size:.96rem; }
.sp-list { list-style:none; margin:0; padding:0; }
.sp-entry { display:grid; grid-template-columns:minmax(0,1fr) 170px; gap:1rem 2rem; padding:1.5rem 0; border-top:1px solid rgba(128,128,128,.28); }
.sp-entry:first-child { border-top:0; padding-top:0; }
.sp-entry h2, .sp-entry h3 { margin:0 0 .4rem; font-size:clamp(1.28rem,2.3vw,1.7rem); font-weight:500; line-height:1.4; letter-spacing:-.02em; opacity:1; text-transform:none; }
.sp-entry h2 a, .sp-entry h3 a { color:inherit; text-decoration:none; opacity:1; }
.sp-entry h2 a:hover, .sp-entry h3 a:hover { color:#3157c8; }
.sp-entry p { max-width:690px; margin:0; color:inherit; opacity:.7; font-size:.96rem; }
.sp-entry .sp-entry__meta { color:inherit; opacity:.58; font:.8rem/1.6 system-ui,sans-serif; }
.sp-entry__links { display:flex; flex-wrap:wrap; gap:.3rem 1rem; margin-top:.75rem; font:.82rem/1.6 system-ui,sans-serif; }
.sp-entry__links a { color:#3157c8; opacity:1; }
.sp-card-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.2rem; }
.sp-card { padding:1.5rem; border:1px solid rgba(128,128,128,.28); border-radius:5px; }
.sp-card .sp-entry__meta { display:block; margin-bottom:.8rem; color:inherit; opacity:.55; font:.75rem/1.5 system-ui,sans-serif; }
.sp-card h2 { margin:0 0 .65rem; font-size:1.45rem; font-weight:500; line-height:1.4; }
.sp-card h2 a { color:inherit; text-decoration:none; opacity:1; }
.sp-card h2 a:hover { color:#3157c8; }
.sp-card p { margin:0; color:inherit; opacity:.7; font-size:.95rem; }
.sp-reading h1 { font-size:clamp(2.1rem,5vw,3.2rem); line-height:1.2; letter-spacing:-.035em; }
.sp-reading main { width:min(100% - 3rem,820px); max-width:none; margin-inline:auto; padding:3.7rem 0 5rem; }
.sp-reading main .back { margin-bottom:1.35rem; }
.sp-reading main h2 { font-size:1.35rem; line-height:1.35; letter-spacing:-.02em; text-transform:none; opacity:1; }
.sp-reading main a { opacity:1; }
.sp-reading main a:hover { color:#3157c8; }
.sp-scaling .topbar { top:105px; }
@media (prefers-color-scheme:dark) {
  .sp-index .sp-kicker, .sp-entry h2 a:hover, .sp-entry h3 a:hover, .sp-entry__links a, .sp-card h2 a:hover, .sp-reading main a:hover { color:#9ab2ff; }
}
@media (max-width:700px) {
  .sp-index { padding-top:3.4rem; }
  .sp-index .sp-intro { margin-bottom:3rem; }
  .sp-entry { grid-template-columns:1fr; gap:.25rem; }
  .sp-entry .sp-entry__meta { grid-row:1; }
  .sp-card-grid { grid-template-columns:1fr; }
  .sp-reading main { padding-top:2.8rem; }
  .sp-scaling .topbar { top:190px; }
}

/* Site identity shared with the Astro index pages. Individual reading layouts
   keep their own measure, diagrams, and article palettes. */
.sp-header, .sp-footer { width:min(100% - 3rem,1160px); --sp-accent:#205e76; }
.sp-header__inner { min-height:86px; }
.sp-header .sp-brand { font-size:1.48rem; letter-spacing:-.055em; }
.sp-header .sp-brand span { color:#b87638; }
.sp-nav { font:550 .91rem/1.5 "Segoe UI","Microsoft YaHei",system-ui,sans-serif; }
.sp-nav a { border-bottom-color:transparent; }
.sp-footer { font-family:"Segoe UI","Microsoft YaHei",system-ui,sans-serif; }
:root[data-theme="dark"] .sp-header,
:root[data-theme="dark"] .sp-footer,
.sp-header--dark, .sp-footer--dark { --sp-accent:#98d5e5; }
@media (max-width:640px) {
  .sp-header__inner { flex-direction:row; flex-wrap:wrap; align-items:center; gap:0 .8rem; padding:.85rem 0; }
  .sp-nav { order:3; width:100%; display:flex; justify-content:space-between; gap:.3rem; margin-top:.4rem; font-size:.8rem; }
  .sp-nav a { padding:.5rem 0; border:0; border-bottom:2px solid transparent; border-radius:0; }
  .sp-header__inner > .sp-theme-toggle { align-self:auto; }
}
