/* Shared site header and footer for every page (prefixed .oc- so it never clashes with page styles). */
.oc-bar{
  --oc-ink:#1c2a3a;--oc-muted:#5b6878;--oc-bg:#ffffff;--oc-rule:#d8dfe7;--oc-accent:#1f5fa8;--oc-flame:#c7791a;
  background:var(--oc-bg);border-bottom:1px solid var(--oc-rule);
  font-family:"Noto Sans JP","Hiragino Sans","Yu Gothic",sans-serif;
}
.oc-foot{
  --oc-ink:#1c2a3a;--oc-muted:#5b6878;--oc-bg:#ffffff;--oc-rule:#d8dfe7;--oc-accent:#1f5fa8;
  background:var(--oc-bg);border-top:1px solid var(--oc-rule);color:var(--oc-muted);
  font-family:"Noto Sans JP","Hiragino Sans","Yu Gothic",sans-serif;font-size:13px;line-height:1.7;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .oc-bar,:root:not([data-theme="light"]) .oc-foot{
    --oc-ink:#e4eaf1;--oc-muted:#9aa8b8;--oc-bg:#18212b;--oc-rule:#2b3846;--oc-accent:#7fb2ec;--oc-flame:#f0b866;
  }
}
:root[data-theme="dark"] .oc-bar,:root[data-theme="dark"] .oc-foot{
  --oc-ink:#e4eaf1;--oc-muted:#9aa8b8;--oc-bg:#18212b;--oc-rule:#2b3846;--oc-accent:#7fb2ec;--oc-flame:#f0b866;
}
.oc-bar-in,.oc-foot-in{max-width:1120px;margin:0 auto;padding:0 18px}
.oc-bar-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 20px;padding-top:10px;padding-bottom:10px}
.oc-logo{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--oc-ink);font-family:"Zen Kaku Gothic New","Hiragino Sans",sans-serif;font-weight:700;font-size:17px}
.oc-logo svg{flex:none}
.oc-logo small{font-family:"Noto Sans JP",sans-serif;font-weight:400;font-size:12px;color:var(--oc-muted)}
.oc-nav{display:flex;flex-wrap:wrap;gap:2px 4px}
.oc-nav a{color:var(--oc-ink);text-decoration:none;font-size:14px;padding:6px 10px;border-radius:6px}
.oc-nav a:hover{background:rgba(31,95,168,.08);color:var(--oc-accent)}
.oc-nav a[aria-current="page"]{color:var(--oc-accent);font-weight:700}
.oc-nav a:focus-visible,.oc-logo:focus-visible{outline:2px solid var(--oc-accent);outline-offset:2px}
.oc-foot-in{padding-top:22px;padding-bottom:34px}
.oc-foot p{margin:4px 0;max-width:62em}
.oc-foot a{color:var(--oc-accent)}
.oc-foot .oc-foot-name{color:var(--oc-ink);font-weight:700}
@media (max-width:640px){
  .oc-nav a{padding:6px 8px;font-size:13.5px}
  .oc-logo small{display:none}
}