/* THE FORGE: Bootstrap & Cross-Validation. Additions to forge.css for this page's
   controls: selects, slider readouts, stat tiles, legends, and the coverage progress bar. */

.sidebar h2 { margin-bottom: 4px; }
.sidebar hr { border: none; border-top: 1px solid var(--border); margin: 18px 0 4px; }
.sidebar .note { color: #999; font-size: 0.8em; margin: 4px 0 0; }
.sidebar select {
  width: 100%; background: #404040; border: 1px solid #555; color: var(--warm-white);
  font: inherit; font-size: 0.9em; padding: 6px 8px; border-radius: 4px;
}
.sidebar select:focus { outline: 2px solid rgba(197,165,90,0.5); outline-offset: 0; }
.sidebar .ticks .now { color: var(--gold); font-weight: 700; font-size: 1.15em; }
.btn.block { width: 100%; margin-top: 14px; }
.btn:disabled { opacity: 0.55; cursor: progress; }
.hidden { display: none !important; }
.nocase { text-transform: none; }

.main.stack { padding-bottom: 80px; }
.main.stack .card { grid-column: span 12; }
.plot-box { min-height: 60px; }
.plot-box svg { display: block; width: 100%; }
.plot-box svg text { font-family: "Inter", sans-serif; }
.plot-empty { color: var(--muted); font-size: 0.85em; padding: 30px 4px; text-align: center; }

.legend { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 6px 0 0 4px; color: var(--warm-white); font-size: 0.78em; }
.legend span { display: inline-flex; align-items: center; gap: 6px; }
.legend svg { width: 22px; height: 12px; flex-shrink: 0; }

.tiles { grid-column: span 12; display: flex; gap: 12px; flex-wrap: wrap; }
.tile { flex: 1; min-width: 140px; padding: 12px; border-radius: 6px; background: var(--bg); border: 1px solid var(--c); }
.tile .lab { color: #999; font-size: 0.75em; text-transform: uppercase; }
.tile .v { font-size: 1.3em; font-weight: 700; color: var(--c); }
.tile .v.small { font-size: 0.9em; font-weight: 400; color: var(--warm-white); word-break: break-word; }
.tile .v.mid { font-size: 0.95em; }
.callout-row { grid-column: span 12; }
.callout-row .callout { margin: 0; }

.prompt { text-align: center; padding: 40px 20px; }
.prompt p { margin: 6px 0; }

.progress { height: 8px; background: #2a2a2a; border: 1px solid var(--border); border-radius: 4px; overflow: hidden; margin: 6px 0 4px; }
.progress div { height: 100%; width: 0; background: var(--ember); transition: width 0.1s linear; }
.progress-text { color: var(--muted); font-size: 0.8em; }

.blueprint-links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.app-link {
  display: inline-block; padding: 5px 12px; border-radius: 4px; background: rgba(197,165,90,0.12);
  border: 1px solid rgba(197,165,90,0.4); color: var(--gold); font-size: 0.85em; font-weight: 600;
  text-decoration: none; letter-spacing: 0.3px;
}
.app-link span { color: var(--muted); font-weight: 400; margin-left: 4px; }
.blueprint-content ol { padding-left: 20px; margin: 6px 0; }