/* "Chain, from Hal": the live strip's block tile, its compact panel, and
   the Chain board. Uses the dashboard's colour tokens and its .stat tile
   style (dashboard-*.css loads first). */
.live-tile-block {
  font: inherit;
  color: inherit;
  background: none;
  border: 1px dashed transparent;
  border-radius: 4px;
  padding: 2px 6px;
  margin: -3px -6px;
  cursor: pointer;
}
.live-tile-block:hover,
.live-tile-block:focus-visible,
.live-tile-block[aria-expanded="true"] { border-color: #4d3a1a; }
.live-tile-block .live-tile-date.stale,
.chain-asof.stale { color: var(--accent-warn); }

.chain-pop {
  margin: -10px 0 18px;
  padding: 10px 14px;
  background: var(--panel);
  border: 1px solid #4d3a1a;
  border-radius: 6px;
  font-size: 12.5px;
  max-width: 560px;
}
.chain-pop[hidden] { display: none; }
.chain-pop-list {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 3px 14px;
  margin: 0 0 6px;
}
.chain-pop-list dt { color: var(--muted); }
.chain-pop-list dd { margin: 0; color: var(--text); font-variant-numeric: tabular-nums; }
.chain-pop-source { margin: 0; color: var(--muted); font-size: 11px; }

.panel-chain .chain-says { margin: 4px 0 10px; color: var(--text); font-size: 13px; }
.chain-bar { margin: 8px 0 12px; }
.chain-bar-head { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; font-size: 12.5px; }
.chain-bar-label { color: var(--text); font-weight: 600; }
.chain-bar-track {
  height: 8px;
  margin: 5px 0 4px;
  background: var(--panel-2);
  border: 1px solid var(--line);
  border-radius: 4px;
  overflow: hidden;
}
.chain-bar-fill { height: 100%; width: 0; background: var(--accent-btc); }
.chain-bar-sub { color: var(--muted); font-size: 11.5px; }
.chain-stat .value.missing { color: var(--muted); font-weight: 400; }
.chain-stat .sub { overflow-wrap: anywhere; }
.chain-source { margin: 8px 0 0; color: var(--muted); font-size: 11.5px; }