/* Barra in cima a tutti i siti di THETA DIVISION: un logo per gioco, porta al suo sito. */
:root { --switch-h: 56px; }
/* La barra resta in cima: i link interni (#demo...) si fermano sotto di lei. */
html { scroll-padding-top: var(--switch-h); }
.switch { position: sticky; top: 0; z-index: 20; height: var(--switch-h); background: #000; display: flex; justify-content: center; align-items: stretch; border-bottom: 1px solid rgba(255,255,255,0.08); }
.switch a { position: relative; display: flex; align-items: center; justify-content: center; padding: 0 30px; opacity: 0.45; transition: opacity .2s, background-color .2s; }
.switch a + a { border-left: 1px solid rgba(255,255,255,0.08); }
.switch img { display: block; width: auto; transition: filter .2s; }
.switch .ntb img { height: 22px; }
.switch .vv img { height: 38px; }
.switch a:hover, .switch a:focus-visible { opacity: 1; background-color: rgba(255,255,255,0.07); outline: none; }
.switch .ntb:hover img, .switch .ntb:focus-visible img { filter: brightness(1.25) drop-shadow(0 0 6px rgba(143,220,255,0.7)); }
.switch .vv:hover img, .switch .vv:focus-visible img { filter: brightness(1.15) drop-shadow(0 0 6px rgba(255,47,208,0.7)); }
.switch a[aria-current="page"] { opacity: 1; }
.switch a[aria-current="page"]::after { content: ""; position: absolute; left: 30px; right: 30px; bottom: 0; height: 2px; }
.switch .ntb[aria-current="page"]::after { background: #8fdcff; }
.switch .vv[aria-current="page"]::after { background: #ff2fd0; }
@media (max-width: 480px) {
  :root { --switch-h: 48px; }
  .switch a { padding: 0 16px; }
  .switch a[aria-current="page"]::after { left: 16px; right: 16px; }
  .switch .ntb img { height: 15px; }
  .switch .vv img { height: 30px; }
}