/* --------------------------------------------------- per-indicator windows */

.ind-root .set-pane { padding: 4px 12px 12px; overflow-y: auto; }

/* ------------------------------------------------------------- key card */

.keys-root { padding: 12px 14px; overflow-y: auto; height: 100%; }
.keys-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 10px; }
.keys-group {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 10px 12px;
}
.keys-group h3 {
  margin: 0 0 8px;
  font-size: var(--t-xs);
  letter-spacing: .1em;
  color: var(--ink-faint);
  font-weight: 500;
}
.keys-row { display: grid; grid-template-columns: 120px 1fr auto; align-items: center; gap: 8px; padding: 3px 0; }
.keys-combo { display: flex; gap: 3px; align-items: center; flex-wrap: wrap; }
.keys-label { font-size: var(--t-md); color: var(--ink); }
.keys-or { font-style: normal; color: var(--ink-faint); font-size: var(--t-xs); margin: 0 2px; }
.keys-todo { font-size: var(--t-xs); color: var(--ink-faint); }
.keys-unbound .keys-label { color: var(--ink-faint); }
.keys-foot { margin-top: 12px; color: var(--ink-faint); font-size: var(--t-xs); }
kbd {
  font: var(--t-xs) var(--mono);
  color: var(--ink);
  background: var(--panel-3);
  border: 1px solid var(--line-2);
  border-bottom-width: 2px;
  border-radius: 3px;
  padding: 2px 6px;
  min-width: 12px;
  text-align: center;
}

/* --------------------------------------------------------- colour + hex */

.swatchwrap { display: inline-flex; align-items: center; gap: 5px; }
.hex {
  font: var(--t-xs) var(--mono);
  color: var(--ink-dim);
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: var(--r);
  padding: 3px 5px;
  width: 74px;
  text-transform: uppercase;
}
.hex:hover { border-color: var(--line-2); }
.hex:focus { border-color: var(--focus); color: var(--ink); outline: none; }
/* Wrong input is shown as wrong rather than silently ignored - a hex field that quietly does
   nothing when you mistype is worse than one that rejects you. */
.hex.bad { border-color: var(--sell); color: var(--sell-hi); }