/* Staging L&D lab v1 */
.ld-lab { margin: 2.5rem 0 3rem; padding: 1.75rem; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 0.75rem; }
.ld-lab h2 { font-weight: 700; margin-bottom: 0.4rem; }
.ld-lab-lead { color: #475569; max-width: 40rem; margin-bottom: 1.25rem; }
.ld-lab-tabs { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-bottom: 1rem; }
.ld-lab-tabs [role="tab"] {
  border: 1px solid #cbd5e1; background: #fff; color: #0f172a;
  border-radius: 999px; padding: 0.4rem 0.9rem; font-weight: 600; font-size: 0.9rem;
}
.ld-lab-tabs [role="tab"][aria-selected="true"] { background: #1e4d8c; color: #fff; border-color: #1e4d8c; }
.ld-lab-tabs [role="tab"]:focus-visible { outline: 3px solid #0d9488; outline-offset: 2px; }
.ld-lab-panel { display: none; background: #fff; border: 1px solid #e2e8f0; border-radius: 0.75rem; padding: 1.25rem; }
.ld-lab-panel.active { display: block; }
.ld-lab-note { font-size: 0.9rem; color: #64748b; margin: 0.5rem 0 1rem; }
.ld-story-frame { width: 100%; min-height: 620px; border: 0; border-radius: 0.5rem; background: #0f172a; }
.ld-path { font-size: 0.85rem; color: #334155; margin-bottom: 0.75rem; }
.ld-choices { display: flex; flex-direction: column; gap: 0.5rem; }
.ld-choices button {
  text-align: left; border: 1px solid #cbd5e1; background: #fff; border-radius: 0.5rem;
  padding: 0.7rem 0.9rem; font-weight: 600;
}
.ld-choices button:hover, .ld-choices button:focus-visible { border-color: #1e4d8c; }
.ld-feedback { margin-top: 0.85rem; padding: 0.75rem; border-radius: 0.5rem; display: none; }
.ld-feedback.show { display: block; }
.ld-feedback.ok { background: #ccfbf1; }
.ld-feedback.warn { background: #fef3c7; }
.ld-feedback.bad { background: #fee2e2; }
.ld-zone[aria-pressed="true"] { outline: 3px solid #0d9488; }
.ld-choices button:disabled { cursor: default; }
.ld-match { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 700px) { .ld-match { grid-template-columns: 1fr; } }
.ld-chip-list { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.ld-chip, .ld-zone {
  border: 1px solid #cbd5e1; background: #fff; border-radius: 0.5rem; padding: 0.55rem 0.75rem; font-weight: 600;
}
.ld-chip[aria-pressed="true"], .ld-zone.waiting { outline: 3px solid #0d9488; }
.ld-chip.used { opacity: 0.45; }
.ld-zone.ok { background: #ccfbf1; }
.ld-zone.bad { background: #fee2e2; }
.ld-card { border: 1px solid #cbd5e1; border-radius: 0.75rem; min-height: 8rem; display: flex; align-items: center; justify-content: center; padding: 1.25rem; cursor: pointer; background: #fff; font-size: 1.1rem; font-weight: 600; }
.ld-card.flipped { background: #1e4d8c; color: #fff; }
.ld-actions { display: flex; gap: 0.5rem; margin-top: 0.75rem; }
.ld-xapi { font-family: ui-monospace, monospace; font-size: 0.8rem; background: #0f172a; color: #e2e8f0; border-radius: 0.5rem; padding: 0.85rem; min-height: 8rem; }
.ld-xapi .verb { color: #5eead4; }
.ld-status { font-size: 0.85rem; color: #64748b; margin-left: auto; }