/* Learn tab (3D, scenario, drill) */
.l3d-labels { position: absolute; top: 0; left: 0; pointer-events: none; }
.l3d { font-size: 11px; color: var(--lav-d); background: rgba(255, 255, 255, .82); border-radius: 8px; padding: 1px 7px; white-space: nowrap; }
.l3d.soil { color: var(--muted); }
.l3d.gauge { color: var(--mint-d); font-weight: 600; }
.l3d.defect { color: var(--rose-d); font-weight: 600; }
.view3d .overlay, .view3d .readout, .view3d .legend { z-index: 2; }
.l-pill { background: rgba(255, 255, 255, .85); border-radius: 9px; padding: 2px 8px; }
.l-sliders { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 12px; margin-top: 10px; }
.l-sliders > label.row { grid-column: 1 / -1; }
#tab-learn .bad, #lDrill .bad { color: var(--rose-d); }
#tab-learn .ok { color: var(--mint-d); }
#lDrill .seg { flex-wrap: wrap; margin: 4px 0 2px; }
#lDrill .stack > div { font-size: 13px; }
@media (max-width: 900px) { .l-sliders { grid-template-columns: minmax(0, 1fr); } }
.l3d.part { color: #4b3f8f; font-weight: 600; border: 1px solid rgba(143, 135, 168, .35); }
.l3d-note { position: absolute; right: 8px; bottom: 8px; z-index: 2; max-width: 60%; font-size: 11px; color: var(--peach-d); background: var(--peach-l); border-radius: 8px; padding: 1px 7px; pointer-events: none; }
@media (max-width: 600px) { .l3d-note { left: 10px; right: auto; bottom: 48px; max-width: calc(100% - 20px); } }
#lView .readout { max-width: 30%; }
#lView .overlay { max-width: 64%; }
@media (max-width: 600px) { #lView .overlay { max-width: calc(100% - 20px); } #lView .readout { top: auto; bottom: 76px; max-width: 70%; } }