.puzzle-card-box {
     background-color: #a0cfef !important;
     border-radius: 16px;
     padding: 2rem;
     box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
 }

 .puzzle-board {
     background-color: #fff;
     border: 2px dashed #dee2e6;
     border-radius: 12px;
     font-size: 1.6rem;
     font-weight: 700;
     letter-spacing: 1px;
 }


 /* Action Buttons */
 .action-buttons {
     display: flex;
     gap: 15px;
     width: 100%;
 }

 /* Generate Next Pattern */
 .sample-resume-btn {
     background: var(--accent-color);
     color: #fff;
     border: none;
     border-radius: 50px;
     padding: 12px 20px;
     font-size: 14px;
     font-weight: 600;
     white-space: nowrap;
     flex: 1;
 }

 .sample-resume-btn:hover {
     opacity: 0.8;
     color: #fff;
     background: var(--accent-color);
 }

 /* WhatsApp Button */
 .btn-share-whatsapp {
     background: #25D366;
     color: #fff;
     border: none;
     border-radius: 50px;
     padding: 12px 20px;
     font-size: 14px;
     font-weight: 600;
     white-space: nowrap;
     flex: 1;
 }

 .btn-share-whatsapp:hover {
     background: #128C7E;
     color: #fff;
 }

 /* Mobile */
 @media (max-width: 576px) {

     .action-buttons {
         flex-direction: column;
         gap: 12px;
     }

     .sample-resume-btn,
     .btn-share-whatsapp {
         width: 100%;
     }
 }



 .option-btn {
     text-align: left;
     border: 2px solid #dee2e6;
     background-color: #f8f9fa;
     color: #333;
     font-weight: 500;
     transition: all 0.2s ease;
 }

 .option-btn:hover {
     background-color: #e9ecef;
     border-color: #ced4da;
 }

 .option-btn.correct {
     background-color: #d1e7dd !important;
     border-color: #0f5132 !important;
     color: #0f5132 !important;
 }

 .option-btn.incorrect {
     background-color: #f8d7da !important;
     border-color: #842029 !important;
     color: #842029 !important;
 }