/* Shared top navigation and motion, matching the portfolio's ink/linen palette. */
body>header>nav.primary-nav{display:flex;align-items:center;gap:3px;padding:4px;border:1px solid #91aaa32b;border-radius:12px;background:#0b1618b8;box-shadow:inset 0 1px 0 #ffffff04}
body>header>nav.primary-nav>a{display:flex;align-items:center;justify-content:center;gap:8px;position:relative;padding:8px 15px;min-height:34px;border-radius:8px;color:#aebeba;font-size:12px;line-height:1.3;letter-spacing:.04em;white-space:nowrap;transition:color .2s,background .2s,box-shadow .2s}
body>header>nav.primary-nav>a:hover,body>header>nav.primary-nav>a:focus-visible{background:#213438;color:#ead2a9}
body>header>nav.primary-nav>a[aria-current]{color:#e4c99d;background:#1d3033;box-shadow:inset 0 0 0 1px #cbb38925}
body>header>nav.primary-nav>a.nav-contact{color:#d6bd94;margin-left:3px;border:1px solid #d3ba8e3b;background:#142529}
body>header>nav.primary-nav>a.nav-contact[aria-expanded="true"]{color:#f0d7b3;border-color:#d3ba8e;background:#284246}
.primary-nav .nav-icon{display:inline-flex;flex-shrink:0;color:currentColor;transition:transform .25s}
.primary-nav .nav-icon svg{display:block;width:15px;height:15px}.primary-nav>a:hover .nav-icon{transform:translateY(-2px)}
.primary-nav>a:active{transform:translateY(1px)}
html.project-arriving::before{background:#0b1618}
.project-transition{background:radial-gradient(ellipse at 70% 40%,#2b46484f,transparent 65%),#0b1618;color:#ede8dd;transition:transform .32s cubic-bezier(.76,0,.24,1),visibility .32s}
.project-transition p,.project-transition>span{color:#c5b18e}.project-transition .transition-rule{background:#b6a27e55;width:min(46%,420px)}
.project-transition strong{font-size:clamp(40px,6vw,80px);letter-spacing:.12em}
.project-transition.is-arriving.is-revealing{transition:transform .48s cubic-bezier(.76,0,.24,1)}
.chapter-curtain{background:#0b1618!important;color:#eee9df!important}.chapter-curtain small,.chapter-curtain em{color:#cbb58d!important}
@keyframes nav-panel-enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.home-panel.is-panel-entering{animation:nav-panel-enter .45s ease both}
@keyframes contact-reveal{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
#contact-dialog[open]{animation:contact-reveal .28s cubic-bezier(.2,.7,.3,1)}
#contact-dialog[open]::backdrop{animation:nav-backdrop .25s ease both}
@keyframes nav-backdrop{from{opacity:0}to{opacity:1}}
.work-strip[data-project="archive"] img{object-position:53% center}
@media(max-width:760px){body>header{padding-inline:10px;gap:9px}body>header>nav.primary-nav{padding:3px;gap:1px;border-radius:10px}body>header>nav.primary-nav>a{gap:5px;padding:7px 8px;min-height:32px;font-size:10px;border-radius:7px}.primary-nav .nav-icon svg{width:13px;height:13px}body>header>nav.primary-nav>a.nav-contact{margin-left:1px}body>header .brand{font-size:12px;letter-spacing:1.5px}}
@media(max-width:370px){.primary-nav .nav-icon{display:none}body>header>nav.primary-nav>a{padding-inline:7px}.directory-toggle{padding-inline:7px}body>header{gap:7px}}
@media(prefers-reduced-motion:reduce){body>header>nav.primary-nav>a,.primary-nav .nav-icon,.project-transition,.project-transition.is-arriving.is-revealing{transition:none}.home-panel.is-panel-entering,#contact-dialog[open],#contact-dialog[open]::backdrop{animation:none}}