/* ============================================================
   BLADE RUNNER NAVIGATION — NOSTROMO green phosphor
   ============================================================ */

body[data-view="bladerunner"] .fn-key {
  background: rgba(2, 6, 4, 0.85);
  border: 1px solid rgba(255, 176, 64, 0.2);
  border-radius: 2px;
  color: rgba(255, 176, 64, 0.7);
  font-family: 'VT323', 'IBM Plex Mono', monospace;
  font-size: clamp(9px, 1vw, 13px);
  letter-spacing: 0.06em;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

body[data-view="bladerunner"] .fn-key:hover {
  background: rgba(255, 176, 64, 0.08);
  color: var(--br-grn-hi, #ffd790);
  border-color: rgba(255, 176, 64, 0.4);
  text-shadow: 0 0 6px rgba(255, 176, 64, 0.4);
}

body[data-view="bladerunner"] .fn-key:focus-visible {
  background: rgba(255, 176, 64, 0.08);
  color: var(--br-grn-hi, #ffd790);
  border-color: rgba(255, 176, 64, 0.4);
  outline: 2px dashed var(--br-grn, #ffc567);
  outline-offset: 2px;
}

body[data-view="bladerunner"] .fn-key:active {
  transform: translateY(1px);
}

body[data-view="bladerunner"] .fn-key.active {
  background: rgba(255, 176, 64, 0.1);
  color: var(--br-grn-hi, #ffd790);
  border-color: rgba(255, 176, 64, 0.45);
  box-shadow: 0 0 8px rgba(255, 176, 64, 0.08);
}

body[data-view="bladerunner"] .keyboard-hints {
  background: rgba(2, 6, 4, 0.96);
  border: 1px solid rgba(255, 176, 64, 0.35);
  color: rgba(204, 255, 221, 0.7);
}

body[data-view="bladerunner"] .keyboard-hints .hint-key {
  color: var(--br-grn-hi, #ffd790);
}

body[data-view="bladerunner"] .keyboard-hints .hint-action {
  color: var(--br-grn, #ffc567);
}

/* Function-key bar retired for the primary terminal (screens carry their own key row). */
body[data-view="bladerunner"] #br-nav,
body[data-view="bladerunner"] .function-keys { display: none !important; }