
:root {
  --ink:#0a2540;
  --muted:#666;
  --rule:#ddd;
  --link:#0a4fb3;
  --bg:#fff;
  --max:920px;
}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;}
a{color:var(--link);text-decoration:underline;}
header,main,footer{max-width:var(--max);margin:0 auto;padding:16px 20px;}
.nav{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center;justify-content:flex-start;margin:4px 0 0 0}
.nav a{text-decoration:none;color:var(--link);font-weight:500}
.rule{max-width:var(--max);margin:12px auto;border:0;border-top:1px solid var(--rule);position:relative}
.aster{position:relative;text-align:center;color:var(--muted);font-size:.9rem;margin:0 0 16px 0}
.aster::before{content:"* * *";letter-spacing:.35rem}
h1{font-size:1.9rem;line-height:1.25;margin:.25rem 0 .5rem}
h2{font-size:1.3rem;margin:1rem 0 .25rem}
ul{margin:.25rem 0 1rem 1.25rem}
.lead{color:var(--muted);margin-top:.25rem}
.panel{background:#f8fafc;border:1px solid #e5e7eb;border-radius:8px;padding:12px 14px;margin:12px 0}
.grid{display:grid;grid-template-columns:1fr;gap:12px}
footer{font-size:.9rem;color:var(--muted);text-align:left}
kbd{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;background:#eef2f7;border:1px solid #e1e7ef;border-radius:4px;padding:.05rem .35rem}
@media (min-width: 800px){
  .grid{grid-template-columns:1fr 1fr}
}
@media (prefers-color-scheme: dark){
  :root{--bg:#0b0c10;--ink:#e5e7eb;--muted:#a1a1aa;--rule:#2a2a2a;--link:#8ab4ff;}
  .panel{background:#101218;border-color:#1e2430}
  kbd{background:#161a22;border-color:#242b38}
}
