/* ===========================================================
   NUMBER BASES STYLES
=========================================================== */
.nb-root .nb-body { flex-direction: column; gap: 4px; overflow-y: auto; }
.nb-bases {
  background: #ffffff; padding: 8px;
  border: 2px inset #ffffff; flex-shrink: 0;
}
.nb-row {
  display: flex; align-items: center;
  padding: 4px 0; gap: 8px;
}
.nb-row-label {
  flex: 0 0 180px;
  font-family: Verdana, sans-serif; font-size: 11px; color: #404040;
}
.nb-row-base {
  font-family: "Courier New", monospace; font-size: 10px; color: #808080;
}
.nb-row input[type=text] {
  flex: 1; border: 2px inset #ffffff; background: #ffffe1;
  padding: 3px 6px; font-family: "Courier New", monospace;
  font-size: 13px; color: #000080;
}
.nb-row input[type=text]:focus { background: #ffff80; }
.nb-row input[type=number] {
  border: 2px inset #ffffff; background: #ffffff;
  padding: 2px 4px; font-family: Verdana, sans-serif; font-size: 11px;
}

.nb-bits-pane { flex-shrink: 0; }
.nb-bit-summary {
  font-family: "Courier New", monospace; font-size: 10px;
  color: #cce4ff; font-weight: normal;
}
.nb-bits-body {
  display: flex; flex-wrap: wrap; gap: 1px;
  padding: 8px; background: #ffffff;
  font-family: "Courier New", monospace;
  max-height: 200px; overflow: auto;
}
.nb-bit {
  display: flex; flex-direction: column; align-items: center;
  width: 24px; cursor: pointer; user-select: none;
  background: #e8e8e8; border: 1px solid #c0c0c0;
  font-size: 10px;
}
.nb-bit:hover { background: #ffffe1; border-color: #000080; }
.nb-bit.set {
  background: #4080ff; color: #ffffff; border-color: #002060;
}
.nb-bit.set:hover { background: #6098ff; }
.nb-bit.sign { border-color: #ff4040; border-width: 2px; }
.nb-bit-val { font-weight: bold; font-size: 13px; padding-top: 2px; }
.nb-bit-num { color: #606060; font-size: 9px; padding-bottom: 1px; }
.nb-bit.set .nb-bit-num { color: #c0d0ff; }
.nb-bit-sep { width: 8px; }

.nb-bitwise-pane { flex-shrink: 0; }
.nb-bitwise-body { background: #ffffff; padding: 8px; }
.nb-bw-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.nb-bw-row input[type=text] {
  border: 2px inset #ffffff; background: #ffffff;
  padding: 3px 6px; font-family: "Courier New", monospace;
  font-size: 12px; width: 180px;
}
.nb-bw-result {
  margin-top: 8px; padding: 6px;
  background: #ffffe1; border: 1px solid #d8d8a0;
}
.nb-bw-line {
  font-family: "Courier New", monospace; font-size: 12px;
  padding: 1px 0;
}
.nb-bw-line .lbl { display: inline-block; width: 36px; color: #808080; }
.nb-bw-line code { color: #000080; }