/* Shared styles for the secondary pages. Same tokens as the home page. */
:root{
  --bg:#F4F6FA; --surface:#FFFFFF; --surface-2:#EBF0F7;
  --fg:#0B2242; --fg-soft:#1C3155; --muted:#3D4F6B;
  --accent:#8A6520; --rule:#D5DEEA; --focus:#0B2242;
  --display:"Lora",Georgia,"Times New Roman",serif;
  --sans:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --measure:68ch; --radius:4px;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#09203D; --surface:#0E2A4C; --surface-2:#0C2645;
    --fg:#F2F5FA; --fg-soft:#DEE7F3; --muted:#C3D0E2;
    --accent:#D7AE68; --rule:#1D3C64; --focus:#D7AE68;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#09203D; --surface:#0E2A4C; --surface-2:#0C2645;
  --fg:#F2F5FA; --fg-soft:#DEE7F3; --muted:#C3D0E2;
  --accent:#D7AE68; --rule:#1D3C64; --focus:#D7AE68;
  color-scheme:dark;
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--bg); color:var(--fg);
  font-family:var(--sans); font-weight:300; line-height:1.65;
  -webkit-text-size-adjust:100%;
}
.wrap{max-width:46rem; margin:0 auto; padding:0 16px}
.skip{
  position:absolute; left:-999px; top:0; background:var(--surface);
  color:var(--fg); padding:.75rem 1rem; z-index:10;
}
.skip:focus{left:0}
:focus-visible{outline:2px solid var(--focus); outline-offset:3px}
header{border-bottom:1px solid var(--rule); padding:1.5rem 0; background:var(--surface)}
header .wrap{display:flex; align-items:center; gap:.9rem; flex-wrap:wrap}
header img{width:40px; height:40px; border-radius:50%}
header a{color:inherit; text-decoration:none; font-family:var(--display); font-size:1.05rem}
header nav{margin-left:auto; font-size:.9rem}
header nav a{text-decoration:underline; font-family:var(--sans)}
main{padding:3rem 0 4rem}
h1{font-family:var(--display); font-weight:500; font-size:clamp(1.7rem,4vw,2.3rem); line-height:1.2; margin:0 0 .4rem}
h2{font-family:var(--display); font-weight:500; font-size:1.2rem; margin:2.4rem 0 .6rem; color:var(--fg)}
h2::before{content:""; display:block; width:40px; height:2px; background:var(--accent); margin-bottom:.9rem}
p,li{color:var(--fg-soft); max-width:var(--measure)}
p{margin:0 0 1rem}
ul{padding-left:1.15rem}
li{margin-bottom:.5rem}
a{color:var(--fg)}
.updated{color:var(--muted); font-size:.88rem; margin-bottom:2rem}
.note{
  background:var(--surface); border:1px solid var(--rule);
  border-left:3px solid var(--accent); border-radius:var(--radius);
  padding:1.1rem 1.2rem; margin:1.6rem 0;
}
.note p:last-child{margin-bottom:0}
.note strong{color:var(--fg)}
footer{border-top:1px solid var(--rule); padding:2rem 0 3rem; background:var(--surface)}
footer p{color:var(--muted); font-size:.85rem; margin:0 0 .5rem}
@media (prefers-reduced-motion:reduce){*{animation:none!important; transition:none!important}}