.rm-cards-container { display: flex; gap: 15px; padding: 10px 0; overflow-x: auto; } .rm-card { min-width: 300px; max-width: 400px; border: 1px solid #ddd; border-radius: 8px; overflow: hidden; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); background: rgba(255, 255, 255, 0.0); } .rm-card.top-candidate { border: 3px solid #007bff; box-shadow: 0 4px 8px rgba(0, 0, 150, 0.2); } .rm-card-header { background: rgba(240, 240, 240, 0.3); padding: 10px 15px; font-weight: bold; border-bottom: 1px solid #ddd; display: flex; justify-content: space-between; align-items: center; } .top-candidate .rm-card-header { background: rgba(230, 242, 255, 0.3); } .reward-badge { background: #007bff; color: white; padding: 3px 8px; border-radius: 12px; font-size: 0.9em; } .rm-card-body { padding: 15px; background-color: rgba(240, 240, 240, 0.0); } .card-section { margin-bottom: 12px; } .card-section-title { font-weight: bold; margin-bottom: 5px; color: #555; } .thought-content { background: rgba(247, 247, 255, 0.3); border: 1px solid #d0d0ff; border-radius: 6px; padding: 8px; } .action-content { background: rgba(240, 255, 240, 0.3); border: 1px solid #d0ffd0; border-radius: 6px; padding: 8px; } .feedback-content { background: rgba(255, 247, 240, 0.3); border: 1px solid #ffd0a0; border-radius: 6px; padding: 8px; } .reward-content { background: rgba(240, 240, 255, 0.3); border: 1px solid #d0d0ff; border-radius: 6px; padding: 8px; } details { margin-top: 5px; } summary { cursor: pointer; font-weight: bold; color: #555; } summary:hover { color: #007bff; } pre { margin: 0; white-space: pre-wrap; word-break: break-word; }