/* Site-wide top nav. Self-contained so it works on pages that don't use synth.css. */
@import url("https://fonts.googleapis.com/css2?family=Orbitron:wght@700;900&display=swap");

.tt-nav {
   position: sticky; top: 0; z-index: 1500;
   display: flex; align-items: center; gap: 6px;
   padding: 8px 14px;
   background: rgba(13, 2, 33, .94);
   border-bottom: 1px solid #ff3cac;
   box-shadow: 0 0 18px rgba(255, 60, 172, .4);
   font-family: "Orbitron", "Arial Black", sans-serif;
   -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
   text-align: left;
}
.tt-nav * { box-sizing: border-box; }
.tt-brand {
   margin-right: auto; flex: none;
   font: italic 900 17px/1 "Orbitron", sans-serif;
   color: #fff !important; text-decoration: none;
   text-shadow: 0 0 8px #ff3cac;
   white-space: nowrap;
}
.tt-brand span { color: #05d9e8; text-shadow: 0 0 8px #05d9e8; }
.tt-links { display: flex; gap: 2px; overflow-x: auto; scrollbar-width: none; }
.tt-links::-webkit-scrollbar { display: none; }
.tt-links a {
   padding: 10px 10px; border-radius: 3px;
   font: 700 11px/1 "Orbitron", sans-serif; letter-spacing: .1em; text-transform: uppercase;
   color: #f2e9ff !important; text-decoration: none; white-space: nowrap;
   border-bottom: 2px solid transparent;
}
.tt-links a:hover { color: #05d9e8 !important; background: rgba(5, 217, 232, .1); }
.tt-links a[aria-current="page"] { color: #05d9e8 !important; border-bottom-color: #05d9e8; }
.tt-signup {
   flex: none;
   padding: 10px 14px; border-radius: 3px;
   font: 700 11px/1 "Orbitron", sans-serif; letter-spacing: .1em; text-transform: uppercase;
   color: #fff !important; text-decoration: none; white-space: nowrap;
   background: linear-gradient(90deg, #ff3cac, #b967ff);
   box-shadow: 0 0 14px rgba(255, 60, 172, .6);
}
.tt-signup:hover { box-shadow: 0 0 24px rgba(255, 60, 172, .9); }
.tt-nav a:focus-visible { outline: 2px solid #fffb96; outline-offset: 2px; }

@media (max-width: 560px) {
   .tt-nav { padding: 6px 8px; gap: 2px; }
   .tt-brand { font-size: 14px; }
   .tt-links a { padding: 10px 7px; font-size: 10px; letter-spacing: .05em; }
   .tt-signup { padding: 10px 10px; font-size: 10px; letter-spacing: .05em; }
   .tt-home { display: none; }
}
