/* FLUX canonical navigation — self-contained, namespaced .fn-*  (no dependency on style.css) */
#flux-nav { min-height: 46px; }
.fn { font-family: 'Courier New', Courier, monospace; display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; padding: 0.55rem 1.1rem; border-bottom: 2px solid #000; background: #fff; color: #000; position: relative; }
.fn * { box-sizing: border-box; }
.fn-brand { font-weight: bold; letter-spacing: 0.14em; font-size: 13px; text-decoration: none; color: #000; margin-right: 0.6rem; }
.fn-burger { display: none; font-family: inherit; font-size: 11px; background: none; border: 1px solid #000; padding: 5px 9px; cursor: pointer; color: #000; }
.fn-bar { list-style: none; display: flex; align-items: center; gap: 4px; margin: 0; padding: 0; flex-wrap: wrap; }
.fn-bar > li { position: relative; }
.fn-bar a, .fn-top { font-family: inherit; font-size: 11px; letter-spacing: 0.08em; text-decoration: none; color: #000; background: none; border: 1px solid #ccc; padding: 5px 9px; cursor: pointer; white-space: nowrap; display: inline-block; }
.fn-bar a:hover, .fn-top:hover { border-color: #000; }
.fn-bar a.fn-on, .fn-top.fn-on { background: #000; color: #fff; border-color: #000; }
.fn-top[aria-expanded="true"] { border-color: #000; }
.fn-drop { list-style: none; margin: 0; padding: 0; position: absolute; top: 100%; left: 0; min-width: 190px; background: #fff; border: 1px solid #000; border-top: none; z-index: 60; display: none; }
.fn-has.fn-open .fn-drop { display: block; }
.fn-drop a { display: block; border: none; font-size: 11.5px; padding: 9px 12px; letter-spacing: 0.04em; white-space: nowrap; }
.fn-drop li + li a { border-top: 1px solid #eee; }
.fn-drop a:hover, .fn-drop a:focus { background: #000; color: #fff; outline: none; }

@media (max-width: 719px) {
  .fn { flex-wrap: wrap; }
  .fn-brand { margin-right: auto; }
  .fn-burger { display: inline-block; }
  .fn-bar { display: none; width: 100%; flex-direction: column; align-items: stretch; gap: 0; margin-top: 0.5rem; }
  .fn.fn-mobile-open .fn-bar { display: flex; }
  .fn-bar > li { width: 100%; }
  .fn-bar a, .fn-top { width: 100%; border: none; border-top: 1px solid #eee; padding: 13px 10px; font-size: 12px; text-align: left; }
  .fn-bar a.fn-on, .fn-top.fn-on { background: #000; color: #fff; }
  .fn-drop { position: static; border: none; min-width: 0; }
  .fn-drop a { padding: 12px 10px 12px 26px; background: #fafafa; }
  .fn-drop a:hover, .fn-drop a:focus { background: #000; color: #fff; }
}