.topbar nav{display:flex;gap:7px;align-items:center;justify-content:flex-end}
.nav-icon{position:relative!important;display:grid!important;place-items:center;width:40px;height:40px;padding:0!important;border:1px solid transparent;border-radius:50%;font-size:0!important;color:var(--muted);text-decoration:none;transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease}
.nav-icon:hover,.nav-icon:focus-visible{color:var(--ink);background:rgba(255,249,240,.74);border-color:rgba(76,58,44,.2);transform:translateY(-2px);outline:0}
.nav-icon::before{content:'';width:18px;height:18px;background:currentColor;mask-position:center;mask-repeat:no-repeat;mask-size:contain;-webkit-mask-position:center;-webkit-mask-repeat:no-repeat;-webkit-mask-size:contain}
.nav-icon::after{content:attr(data-tip);position:absolute;left:50%;bottom:-29px;transform:translateX(-50%) translateY(-3px);padding:5px 8px;background:var(--ink);color:var(--paper2);border-radius:4px;opacity:0;pointer-events:none;white-space:nowrap;font:600 10px/1 var(--sans);z-index:80;transition:opacity .15s ease,transform .15s ease}
.nav-icon:hover::after,.nav-icon:focus-visible::after{opacity:1;transform:translateX(-50%) translateY(0)}
.i-home::before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 11l8-7 8 7v9H5v-9M9 20v-6h6v6' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 11l8-7 8 7v9H5v-9M9 20v-6h6v6' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.i-shelf::before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 5h6v6H4zM14 5h6v6h-6zM4 15h6v5H4zM14 15h6v5h-6z' fill='none' stroke='black' stroke-width='1.8'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 5h6v6H4zM14 5h6v6h-6zM4 15h6v5H4zM14 15h6v5h-6z' fill='none' stroke='black' stroke-width='1.8'/%3E%3C/svg%3E")}
.i-lab::before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 3h6M10 3v5l-5 9a2 2 0 0 0 2 3h10a2 2 0 0 0 2-3l-5-9V3M7.5 15h9' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 3h6M10 3v5l-5 9a2 2 0 0 0 2 3h10a2 2 0 0 0 2-3l-5-9V3M7.5 15h9' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.i-work::before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 8h16v11H4zM9 8V5h6v3M4 12h16M10 12v2h4v-2' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 8h16v11H4zM9 8V5h6v3M4 12h16M10 12v2h4v-2' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'/%3E%3C/svg%3E")}
.i-note::before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 4h12v16H6zM9 8h6M9 12h6M9 16h4' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 4h12v16H6zM9 8h6M9 12h6M9 16h4' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E")}
.i-github::before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 17V7h8M9 3h10v10M19 3L9 13' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 17V7h8M9 3h10v10M19 3L9 13' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
@media(max-width:560px){.topbar{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}.topbar nav{position:fixed!important;top:auto!important;right:auto!important;left:50%!important;bottom:max(12px,env(safe-area-inset-bottom))!important;z-index:120;transform:translateX(-50%);gap:3px!important;padding:6px 8px;border:1px solid rgba(70,51,38,.18);border-radius:999px;background:color-mix(in srgb,var(--paper2) 86%,transparent);backdrop-filter:blur(18px) saturate(.9);-webkit-backdrop-filter:blur(18px) saturate(.9);box-shadow:0 10px 32px rgba(44,32,23,.14)}.nav-icon{width:43px;height:43px}.nav-icon::after{display:none}}