@layer components{.bar{font-weight:var(--font-weight-medium);& .bar-list{align-items:center;gap:var(--spacing-xs);margin:0;padding:0;list-style:none;display:flex}& .nav-list{margin:0;padding:0;list-style:none}& .nav-item{position:relative}& .nav-item>a,& .nav-item>.nav-item-trigger{border-radius:var(--radius-none);color:var(--color-text-strong);cursor:pointer;font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);letter-spacing:.08em;padding:var(--spacing-xs) var(--spacing-sm);text-transform:uppercase;transition:background-color var(--animation-normal) var(--ease-out-expo);white-space:nowrap;text-decoration:none;display:block;&:hover{background:var(--color-state-hover)}}& .nav-item-split{border-radius:var(--radius-none);min-width:0;transition:background-color var(--animation-normal) var(--ease-out-expo);flex-wrap:nowrap;align-items:center;display:flex;& .nav-item-link{color:var(--color-text-strong);cursor:pointer;font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);letter-spacing:.08em;min-width:0;padding:var(--spacing-xs) var(--spacing-xs) var(--spacing-xs) var(--spacing-sm);text-transform:uppercase;transition:background-color var(--animation-normal) var(--ease-out-expo);white-space:nowrap;flex:auto;text-decoration:none;display:block}& .nav-item-toggle-btn{aspect-ratio:1;border-radius:var(--radius-none);box-sizing:border-box;cursor:pointer;width:1.75em;height:1.75em;transition:background-color var(--animation-normal) var(--ease-out-expo), border-color var(--animation-normal) var(--ease-out-expo);border-left:1px solid #0000;flex:none;justify-content:center;align-items:center;margin-inline-end:4px;padding:0;display:flex}&:hover{background:var(--color-state-hover);& .nav-item-toggle-btn{background:color-mix(in srgb, var(--color-state-hover), var(--color-text) 3%)}}& .nav-item-toggle-btn:hover{background:color-mix(in srgb, var(--color-state-hover), var(--color-text) 8%);border-left-color:var(--color-border)}& .nav-item-toggle-btn .nav-item-icon{justify-content:center;align-items:center;line-height:0;display:flex;top:0}}& .nav-item>a[aria-current=page],& .nav-item>.nav-item-trigger[aria-current=page],& .nav-item-split .nav-item-link[aria-current=page]{box-shadow:inset 0 -1px 0 color-mix(in srgb, var(--color-text-strong) 55%, transparent);text-decoration:none}& .nav-item-trigger{align-items:center;gap:var(--spacing-xs);display:flex}& .nav-item-icon{color:var(--color-text-muted);transition:color var(--animation-normal) var(--ease-out-expo), transform var(--animation-normal) var(--ease-out-expo);width:.8rem;display:inline-block;position:relative;top:.2rem}& .nav-item-trigger:hover .nav-item-icon{color:var(--color-text-strong)}& .nav-item-toggle:checked~.nav-item-trigger .nav-item-icon,& .nav-item-toggle:checked~.nav-item-split .nav-item-icon{transform:rotate(90deg)}& .nav-item-toggle,& .nav-item-toggle~.nav-item-content,& .nav-item-toggle~.nav-item-nested{display:none}& .nav-item-toggle:checked~.nav-item-content{animation:grow-out-centered var(--animation-normal) ease-out forwards;display:block}& .nav-item-toggle:checked~.nav-item-nested{animation:grow-out var(--animation-normal) ease-out forwards;display:block}@media (hover:hover) and (pointer:fine){& .nav-item.has-children:hover>.nav-item-content,& .nav-item.has-children:focus-within>.nav-item-content{animation:grow-out-centered var(--animation-normal) ease-out forwards;display:block}& .nav-item.has-children:hover>.nav-item-trigger .nav-item-icon,& .nav-item.has-children:hover>.nav-item-split .nav-item-icon,& .nav-item.has-children:focus-within>.nav-item-trigger .nav-item-icon,& .nav-item.has-children:focus-within>.nav-item-split .nav-item-icon{transform:rotate(90deg)}}& .nav-item>.nav-item-content{background:var(--color-bg);border:1px solid var(--color-border-subtle);border-radius:var(--radius-none);margin-top:var(--spacing-xs);width:max-content;min-width:200px;z-index:var(--layer-3);position:absolute;top:100%;left:50%;transform:translate(-50%)}& .nav-item-content .nav-item>a,& .nav-item-content .nav-item>.nav-item-trigger,& .nav-item-content .nav-item-split .nav-item-link{letter-spacing:.04em;text-transform:none}& .nav-item-content .nav-item{display:block}& .nav-item-content .nav-item>a,& .nav-item-content .nav-item>.nav-item-trigger,& .nav-item-content .nav-item-split{border-radius:0}& .nav-item-content .nav-item>.nav-item-trigger,& .nav-item-nested .nav-item>.nav-item-trigger{justify-content:space-between;padding-inline-end:calc(var(--spacing-sm) + 2px);display:flex}& .nav-item-nested .nav-item>a{font-size:var(--font-size-sm);font-weight:var(--font-weight-normal);padding-inline-end:4px;padding-left:var(--spacing-xl);border-radius:0}& .nav-item-nested .nav-item>.nav-item-trigger,& .nav-item-nested .nav-item-split .nav-item-link{font-weight:var(--font-weight-normal)}}}