/* — a single header icon-button + popover. Kept visually quiet (no border/fill until interacted with) so it reads as chrome, not another nav item. Button is sized to the same touch-target floor as the shared `ui/` kit (2.75em ≈ 44px, WCAG 2.5.5) even though it isn't built from that kit — a bespoke icon trigger, not a form control, but the floor applies regardless of which component drew it. */ .links-menu { position: relative; margin-left: auto; } .links-menu-button { display: flex; align-items: center; justify-content: center; width: 2.75em; height: 2.75em; padding: 0; border: 1px solid transparent; border-radius: 0.4em; background: none; color: var(--fg); font-size: 1em; line-height: 1; cursor: pointer; } .links-menu-button:hover, .links-menu-button[aria-expanded='true'] { border-color: var(--border); background: var(--bg-elev); } .links-menu-popover { position: absolute; top: calc(100% + 0.4em); right: 0; z-index: 10; display: flex; flex-direction: column; min-width: 10em; padding: 0.4em; border: 1px solid var(--border); border-radius: 0.5em; background: var(--bg-elev); box-shadow: 0 0.25em 0.75em rgba(0, 0, 0, 0.3); } .links-menu-item { display: flex; align-items: center; gap: 0.5em; min-height: 2.75em; padding: 0.4em 0.6em; border-radius: 0.35em; color: var(--fg); text-decoration: none; white-space: nowrap; } .links-menu-item:hover { background: var(--bg); }