.na-navigation-progress { position: fixed; z-index: 2147483646; inset: 0 0 auto; height: 3px; overflow: hidden; background: transparent; pointer-events: none; }
.na-navigation-progress::after { content: ''; display: block; width: 35%; height: 100%; background: #ffcf00; animation: na-navigation-progress 1s ease-in-out infinite; }
.na-navigation-progress[hidden], .na-navigation-error[hidden] { display: none !important; }
.na-navigation-error { position: fixed; z-index: 2147483645; top: 80px; left: 50%; transform: translateX(-50%); width: min(92%, 540px); padding: 16px; border: 1px solid #d8cfe5; border-radius: 12px; background: #fff; color: #20152f; box-shadow: 0 8px 30px #20152f26; display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.na-navigation-error span { flex-basis: 100%; }
.na-navigation-error button, .na-navigation-error a { min-height: 44px; display: inline-flex; align-items: center; padding: 8px 14px; border-radius: 8px; border: 1px solid currentColor; font: inherit; color: inherit; cursor: pointer; }
html[data-na-theme="dark"] .na-navigation-error { background: #211c2b; color: #f5f1fa; }
.na-navigation-target { opacity: .65; }
.na-screen-enter { animation: na-screen-enter .16s ease-out; }
main[tabindex="-1"]:focus { outline: none; }
@keyframes na-screen-enter { from { opacity: .65; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
@keyframes na-navigation-progress { from { transform: translateX(-110%); } to { transform: translateX(390%); } }
@media (prefers-reduced-motion: reduce) { .na-screen-enter, .na-navigation-progress::after { animation: none; } .na-navigation-progress::after { width: 100%; } }