/* Local external stylesheet: no inline styles, script, or CSP changes. */
html, body { margin: 0 !important; width: 100%; height: 100%; }
body { display: flex !important; flex-direction: column; }
#nerdmania-apps-header { box-sizing: border-box; flex: 0 0 48px; height: 48px; width: 100%; display: flex; align-items: center; padding: 0 16px; background: #111827; color: #f9fafb; font: 600 14px/1.4 system-ui, sans-serif; position: relative; z-index: 1; }
#nerdmania-apps-header a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 8px; color: #f9fafb; text-decoration: none; border-radius: 4px; }
#nerdmania-apps-header a:hover { background: #374151; }
#nerdmania-apps-header a:focus-visible { outline: 2px solid #93c5fd; outline-offset: -2px; }
#root { flex: 1 1 auto; min-height: 0; height: calc(100vh - 48px); height: calc(100dvh - 48px); position: relative; overflow: auto; isolation: isolate; transform: translateZ(0); }
/* Authelia's main login container uses viewport-height inline styling. */
#root > div { min-height: 100% !important; }