@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@400;500;600;700;800&display=swap');
:root { color-scheme: dark; }
body { font-family: Rubik, system-ui, sans-serif; background: radial-gradient(ellipse at 80% -20%, #163b81 0, transparent 45%), #071126 !important; }
nav { background: rgba(7, 17, 38, .86) !important; border-color: rgba(133, 177, 255, .12) !important; }
nav a { letter-spacing: -.04em; }
.brand-symbol { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; background: #4384ff; color: white; font-weight: 800; font-style: italic; }
.brand-accent { color: #7baaff; margin-left: -7px; }
main { padding-top: 2rem; }
h1, h2 { letter-spacing: -.035em; }
a:focus-visible, button:focus-visible, input:focus-visible { outline: 2px solid #87b5ff; outline-offset: 3px; }
@media (max-width: 640px) { main { padding-top: 1.25rem; padding-bottom: 5rem; } }
