@scope([data-example]){:scope:is([data-example=navigation-menu\/basic],[data-example=navigation-menu\/link-component],[data-example=navigation-menu\/rtl],[data-example=navigation-menu\/vertical],[data-example=navigation-menu\/click-only],[data-example=navigation-menu\/nested],[data-example=navigation-menu\/animation],[data-example=navigation-menu\/custom-rendering]){justify-content:flex-start;min-height:22rem}[data-slot=navigation-menu]{position:relative}[data-slot=navigation-menu]:not([data-nested]){border-radius:var(--radius-surface);background:var(--surface-1);box-shadow:var(--shadow-1);padding:3px}[data-slot=navigation-menu-list]{flex-flow:wrap;align-items:center;gap:2px;margin:0;padding:0;list-style:none;display:flex}[data-slot=navigation-menu-list][data-orientation=vertical]{flex-flow:column;align-items:stretch;width:12rem}[data-slot=navigation-menu-trigger],[data-slot=navigation-menu-link]:not([data-slot=navigation-menu-content] *){box-sizing:border-box;border-radius:var(--radius-row);height:30px;color:var(--ink);font:inherit;white-space:nowrap;cursor:default;-webkit-user-select:none;user-select:none;background:0 0;border:0;align-items:center;gap:6px;padding-inline:10px;font-weight:500;text-decoration:none;display:inline-flex}:is([data-slot=navigation-menu-trigger],[data-slot=navigation-menu-link]:not([data-slot=navigation-menu-content] *)):hover:not([data-disabled]){background:var(--tint)}:is([data-slot=navigation-menu-trigger],[data-slot=navigation-menu-link]:not([data-slot=navigation-menu-content] *)):focus-visible{outline-offset:0}:is([data-slot=navigation-menu-trigger],[data-slot=navigation-menu-link]:not([data-slot=navigation-menu-content] *))[data-open]{background:var(--tint);box-shadow:inset 0 0 0 1px var(--ink)}:is([data-slot=navigation-menu-trigger],[data-slot=navigation-menu-link]:not([data-slot=navigation-menu-content] *))[data-current]{background:var(--tint);font-weight:600}:is([data-slot=navigation-menu-trigger],[data-slot=navigation-menu-link]:not([data-slot=navigation-menu-content] *))[data-disabled]{color:var(--line-disabled)}:is([data-slot=navigation-menu-trigger],[data-slot=navigation-menu-link]:not([data-slot=navigation-menu-content] *))>svg{opacity:.7;width:14px;height:14px}[data-orientation=vertical] :is([data-slot=navigation-menu-trigger],[data-slot=navigation-menu-link]:not([data-slot=navigation-menu-content] *)){justify-content:space-between;width:100%}[data-orientation=vertical] :is([data-slot=navigation-menu-trigger],[data-slot=navigation-menu-link]:not([data-slot=navigation-menu-content] *))>svg:is([dir=rtl],[dir=rtl] *){rotate:180deg}[data-slot=navigation-menu-trigger][data-open]:not([data-orientation=vertical] *)>svg{rotate:180deg}[data-slot=navigation-menu-trigger]:not([data-disabled]) [data-show=disabled],[data-slot=navigation-menu-link]:not([data-current]) [data-show=current],[data-slot=navigation-menu-content][data-motion] [data-hide=motion],[data-slot=navigation-menu-content]:not([data-motion=from-end]) [data-show=from-end],[data-slot=navigation-menu-content]:not([data-motion=from-start]) [data-show=from-start]{display:none}[data-slot=navigation-menu-viewport]{width:var(--viewport-width);height:var(--viewport-height);border-radius:var(--radius-popup);background:var(--surface-2);box-shadow:var(--shadow-2);color:var(--ink);transform-origin:var(--transform-origin);border:0;outline:none;margin:0;padding:0;overflow:hidden}[data-slot=navigation-menu-viewport] [data-slot=navigation-menu-content]:not([popover]){position:absolute;inset-block-start:0;inset-inline-start:0}[data-slot=navigation-menu-content]{box-sizing:border-box;width:max-content;max-width:calc(100vw - 3rem);max-height:var(--available-height);color:var(--ink);outline:none;padding:5px;overflow-y:auto}[data-slot=navigation-menu-content][popover]{border-radius:var(--radius-popup);background:var(--surface-2);box-shadow:var(--shadow-2);transform-origin:var(--transform-origin);border:0;margin:0}[data-slot=navigation-menu-content]>[data-slot=hint]{padding:var(--space-1) 10px var(--space-2)}[data-slot=navigation-menu-content] ul{width:12rem;max-width:100%;margin:0;padding:0;list-style:none}[data-slot=navigation-menu-content] ul:has([data-slot=hint]):not([data-slot=grid]){width:18rem}[data-slot=navigation-menu-content] ul+ul{margin-top:var(--space-1);padding-top:var(--space-1);border-top:1px solid var(--line-faint)}[data-slot=navigation-menu-content] [data-slot=grid]{gap:2px;width:30rem}[data-slot=navigation-menu-content] [data-slot=grid]:has([data-variant=featured]){grid-template-columns:.8fr 1fr;width:26rem}[data-slot=navigation-menu-content] [data-slot=grid]>li:has([data-variant=featured]){grid-row:span 3}@media (width<40rem){:is([data-slot=navigation-menu-content] [data-slot=grid],[data-slot=navigation-menu-content] [data-slot=grid]:has([data-variant=featured])){grid-template-columns:minmax(0,1fr)}[data-slot=navigation-menu-content] [data-slot=grid]>li:has([data-variant=featured]){grid-row:auto}}[data-slot=navigation-menu-content] [data-slot=navigation-menu-link]{align-items:center;gap:var(--space-2);box-sizing:border-box;border-radius:var(--radius-row);min-height:32px;color:inherit;cursor:default;outline:none;padding:6px 10px;text-decoration:none;display:flex}[data-slot=navigation-menu-content] [data-slot=navigation-menu-link]:is(:hover,:focus-visible){background:var(--tint);box-shadow:inset 0 0 0 1px var(--ink)}[data-slot=navigation-menu-content] [data-slot=navigation-menu-link][data-current]:not(:hover,:focus-visible){background:var(--tint)}[data-slot=navigation-menu-content] [data-slot=navigation-menu-link][data-current]{font-weight:500}[data-slot=navigation-menu-content] [data-slot=navigation-menu-link]:has(>[data-slot=hint]:not([data-show])){padding:var(--space-2) 10px;flex-direction:column;align-items:stretch;gap:2px}[data-slot=navigation-menu-content] [data-slot=navigation-menu-link]:has(>[data-slot=hint]:not([data-show]))>:first-child{font-weight:500}[data-slot=navigation-menu-content] [data-slot=navigation-menu-link]:has(>[data-slot=hint]:not([data-show]))>[data-slot=hint]{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}[data-slot=navigation-menu-content] [data-slot=navigation-menu-link]:has(>[data-slot=hint]:not([data-show]))[data-variant=featured]{height:100%;padding:var(--space-4);border-radius:var(--radius-control);background:var(--tint);justify-content:flex-end}[data-slot=navigation-menu-content] [data-slot=navigation-menu-link]:has(>[data-slot=hint]:not([data-show]))[data-variant=featured]>:first-child{font-size:18px;font-weight:600;line-height:24px}[data-slot=navigation-menu-content] [data-slot=navigation-menu-link]:has(>[data-slot=hint]:not([data-show]))[data-variant=featured]>[data-slot=hint]{display:block}[data-slot=navigation-menu-link-icon]{color:var(--muted);display:flex}:is(:hover,:focus-visible)>[data-slot=navigation-menu-link-icon]{color:inherit}[data-slot=navigation-menu-link-icon] svg{width:14px;height:14px}:scope[data-example=navigation-menu\/animation] [data-slot=navigation-menu-trigger]>svg{transition:rotate var(--duration)}:scope[data-example=navigation-menu\/animation] :is([data-slot=navigation-menu-viewport],[data-slot=navigation-menu-content]){transition:opacity var(--duration)}:scope[data-example=navigation-menu\/animation] :is([data-slot=navigation-menu-viewport],[data-slot=navigation-menu-content]):is([data-starting-style],[data-ending-style]){opacity:0}:scope[data-example=navigation-menu\/animation] [data-slot=navigation-menu-viewport][data-variant=slide]{transition-property:opacity,width,height;transition-duration:calc(var(--duration) * 3)}:scope[data-example=navigation-menu\/animation] [data-slot=navigation-menu-viewport][data-variant=slide] [data-slot=navigation-menu-content]{transition-property:opacity,translate;transition-duration:calc(var(--duration) * 3)}:scope[data-example=navigation-menu\/animation] [data-slot=navigation-menu-viewport][data-variant=slide] [data-slot=navigation-menu-content]:is([data-motion=from-end][data-starting-style],[data-motion=to-end][data-ending-style]){translate:4rem}:scope[data-example=navigation-menu\/animation] [data-slot=navigation-menu-viewport][data-variant=slide] [data-slot=navigation-menu-content]:is([data-motion=from-start][data-starting-style],[data-motion=to-start][data-ending-style]),:scope[data-example=navigation-menu\/animation] [data-slot=navigation-menu-viewport][data-variant=slide] [data-slot=navigation-menu-content]:is([dir=rtl],[dir=rtl] *):is([data-motion=from-end][data-starting-style],[data-motion=to-end][data-ending-style]){translate:-4rem}:scope[data-example=navigation-menu\/animation] [data-slot=navigation-menu-viewport][data-variant=slide] [data-slot=navigation-menu-content]:is([dir=rtl],[dir=rtl] *):is([data-motion=from-start][data-starting-style],[data-motion=to-start][data-ending-style]){translate:4rem}}
