:root{--site-nav-height:76px}html{scroll-padding-top:calc(var(--site-nav-height) + 16px)}
#site-nav.site-nav{position:fixed;inset:0 0 auto;width:100%;height:var(--site-nav-height);z-index:60000;display:flex;align-items:center;justify-content:space-between;gap:32px;padding:0 4vw;background:rgba(10,10,10,.93);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.14);color:#f0f0f0;transform:none;transition:opacity .3s,transform .3s;box-sizing:border-box}
#site-nav.site-nav-home{opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-100%)}#site-nav.site-nav-home.is-visible{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
#site-nav .site-nav-brand{flex-shrink:0;font-family:Arial,sans-serif;font-size:23px;font-weight:600;letter-spacing:-1px;text-decoration:none;color:inherit}
#site-nav .site-nav-links{display:flex;align-items:center;gap:clamp(16px,2.2vw,40px);height:100%;overflow-x:auto;scrollbar-width:none}#site-nav .site-nav-links::-webkit-scrollbar{display:none}
#site-nav .site-nav-links a{position:relative;display:flex;flex-direction:column;justify-content:center;flex-shrink:0;gap:5px;height:100%;font-family:Arial,'PingFang SC','Microsoft YaHei',sans-serif;font-size:13px;font-weight:400;line-height:1.2;text-decoration:none;color:#c6c6c6;white-space:nowrap;transition:color .2s}#site-nav .site-nav-links small{margin:0;font-size:8px;letter-spacing:.08em;color:inherit;opacity:.55}#site-nav a:hover,#site-nav a[aria-current="location"]{color:#ff4b35}#site-nav .site-nav-links a[aria-current="location"]:after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:#e53726}#site-nav a:focus-visible{outline:2px solid #ff4b35;outline-offset:4px}
body:has(.site-nav:not(.site-nav-home)){padding-top:var(--site-nav-height)}
#hero,#about,#projects,#circle-gallery,#skills,#awards,#contact{scroll-margin-top:var(--site-nav-height)}
@media(max-width:700px){:root{--site-nav-height:64px}#site-nav.site-nav{padding:0 5vw;gap:22px}#site-nav .site-nav-brand{font-size:19px}#site-nav .site-nav-links{gap:20px}#site-nav .site-nav-links a{font-size:12px}#site-nav .site-nav-links small{font-size:7px}}
@media(prefers-reduced-motion:reduce){#site-nav.site-nav{transition:none}}
@font-face{font-family:LusonMachine;src:url('../assets/fonts/Machine.otf') format('opentype');font-display:swap}
#site-nav .site-nav-brand{display:inline-flex;align-items:baseline;gap:0;font-size:28px;font-weight:300;line-height:1.2;letter-spacing:-.08em;white-space:nowrap}
#site-nav .brand-luson{font-family:LusonDisplay,Breton,sans-serif}#site-nav .brand-c{font-family:LusonMachine,sans-serif;font-weight:400;position:relative;top:.015em}
#site-nav .site-nav-links a{font-size:14px;gap:0}
@media(max-width:700px){#site-nav .site-nav-brand{font-size:24px}#site-nav .site-nav-links a{font-size:12px}}
#site-nav.site-nav{transition:opacity .3s ease,transform .35s cubic-bezier(.2,.7,.2,1)}
#site-nav.site-nav.is-idle{transform:translateY(-100%);opacity:0;visibility:hidden;pointer-events:none}
@media(prefers-reduced-motion:reduce){#site-nav.site-nav{transition:none}}
/* Delay visibility removal until the upward slide completes. */
#site-nav.site-nav.is-idle{transition:opacity .3s ease,transform .35s cubic-bezier(.2,.7,.2,1),visibility 0s linear .35s}
@media(prefers-reduced-motion:reduce){#site-nav.site-nav.is-idle{transition:none}}