/* Barra del sito, footer e interruttore del tema: condivisi da tutte le pagine.
   La larghezza si allinea a quella della pagina con --sb-max, impostata su :root. */
.sitebar,.sitefoot{--sb-bg:#0F2530;--sb-fg:#E2EBEE;--sb-muted:#8FA6B0;--sb-accent:#F0683D;
  font:500 13px/1.4 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif}
.sitebar{background:var(--sb-bg);color:var(--sb-fg)}
.sitebar nav{max-width:var(--sb-max,1120px);margin:0 auto;padding:7px 20px;display:flex;flex-wrap:wrap;gap:4px 18px;align-items:center}
.sitebar a{color:var(--sb-fg);text-decoration:none;padding:2px 0;border-bottom:2px solid transparent}
.sitebar a:hover{border-bottom-color:var(--sb-muted)}
.sitebar a[aria-current="page"]{border-bottom-color:var(--sb-accent)}
.sitebar a.home{font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin-right:auto}
.sitebar a.home span{color:var(--sb-accent)}
.sitebar a:focus-visible,.sitebar button:focus-visible,.sitefoot a:focus-visible{outline:2px solid var(--sb-accent);outline-offset:2px}

/* interruttore chiaro/scuro: mostra l'icona del tema verso cui si passa */
.sitebar .theme{width:30px;height:30px;display:grid;place-items:center;padding:0;border:1px solid rgba(226,235,238,.22);border-radius:6px;background:transparent;color:var(--sb-fg);cursor:pointer}
.sitebar .theme:hover{border-color:var(--sb-muted)}
.sitebar .theme svg{width:16px;height:16px;display:block}
.sitebar .theme .sun{display:none}
:root[data-theme="dark"] .sitebar .theme .sun{display:block}
:root[data-theme="dark"] .sitebar .theme .moon{display:none}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .sitebar .theme .sun{display:block}
  :root:not([data-theme="light"]) .sitebar .theme .moon{display:none}
}

.sitefoot{max-width:var(--sb-max,1120px);margin:0 auto;padding:18px 20px 40px;color:#546C77;font-size:12.5px;line-height:1.55}
.sitefoot a{color:inherit}
.sitefoot .coffee{font-weight:600;text-underline-offset:3px}
.sitefoot p+p{margin-top:6px}
:root[data-theme="dark"] .sitefoot{color:#8FA6B0}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .sitefoot{color:#8FA6B0}}

@media (max-width:520px){
  .sitebar nav,.sitefoot{padding-inline:16px}
  .sitebar nav{gap:4px 14px}
}