nav{z-index:9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:space-between;width:88vw;height:9vh;padding:20px;position:fixed;left:6vw;top:10px;background-color:#1a233b80;box-shadow:0 2px 10px #0005,0 -2px 10px #fff1;border-radius:10px;transition:.5s}nav .logo{display:flex;gap:10px;justify-content:center;align-items:center;font-size:16px;font-weight:500;letter-spacing:1px}nav .logo img{width:27px;aspect-ratio:1}nav .links{display:flex;gap:40px;position:absolute;right:50%;translate:50%}nav .links a{position:relative;transition:.3s ease}nav .links a:before{content:"";position:absolute;width:0;height:3px;left:100%;bottom:-5px;background:linear-gradient(-45deg,#00ffc8,#ff01ff);border-radius:4px;transition:.3s cubic-bezier(.82,.02,.13,1.6)}nav .links a:hover:before,nav .links a[aria-current=page]:before{width:70%;left:15%}nav .links a:hover,nav .links a[aria-current=page]{color:#00ffc8}nav .access{display:flex;align-items:center;gap:15px;height:100%}nav .access .user{cursor:pointer;display:flex;gap:25px;align-items:center;height:150%}nav .access .user .username{font-size:17px}nav .access .user .pfp{overflow:hidden;display:flex;align-items:center;justify-content:center;height:100%;aspect-ratio:1;outline:2px solid #00ffc8;border-radius:50%;transition:.1s}nav .access .user .pfp:hover{outline-offset:3px}nav .access .user .pfp s-icon{height:110%;fill:#fffa}nav .access .user .user-options{transform-origin:top;scale:1 0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;flex-direction:column;gap:10px;align-items:center;width:200px;padding:30px;position:absolute;top:calc(9vh + 10px);right:0;background-color:#1a233b80;box-shadow:0 2px 10px #0005,0 -2px 10px #fff1;border-radius:10px;transition:.4s}nav .access .user .user-options a{width:100%}nav .access .user .user-options button{width:100%;padding:10px}nav .access .user.active .user-options{scale:1}nav .access .log{display:flex;justify-content:center;align-items:center;padding:12px;background:linear-gradient(45deg,#00ffc8,#a2b7ff);border-radius:10px;color:#1a233b;font-size:14px;font-weight:600;transition:.2s}nav .access .log:hover{translate:0 3px;outline-width:4px}nav .access #link-toggle{display:none}@media (max-width: 1199px){nav .links{flex-direction:column;justify-content:center;gap:30px;width:400px;height:100vh;padding:60px;top:-10px;right:-6vw;translate:100%;background-image:linear-gradient(90deg,#1a233b,#0b1729);box-shadow:0 0 10px #0005;transition:.3s}nav .links a{padding:10px;border-radius:10px;text-align:center;font-size:clamp(20px,1vw,1vw);background-color:#1a233b}nav:has(#link-toggle:checked) .links{translate:0}nav .access #link-toggle{display:block;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;z-index:9;height:100%;aspect-ratio:1/1;position:relative;background-image:url(/imgs/icons/bars.svg);background-size:cover}nav .access #link-toggle:checked{background-image:url(/imgs/icons/x.svg)}}@media (max-width: 600px){nav{width:95vw;left:2.5vw}nav .links{width:100vw;right:-2.5vw}nav .access .log{display:none}}