body { font-family: 'Inter', sans-serif; background-color: #f8fafc; }
        .loader { border: 4px solid #f3f3f3; border-top: 4px solid #3b82f6; border-radius: 50%; width: 40px; height: 40px; animation: spin 1s linear infinite; }
        @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
        .fade-in { animation: fadeIn 0.5s ease-in-out; }
        @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
        .teacher-stat-card { background-color: #f0fdf4; border: 1px solid #bbf7d0; padding: 1.5rem; border-radius: 0.75rem; display: flex; justify-content: space-between; align-items: center; }
        .teacher-stat-card i { font-size: 2rem; color: #16a34a; }
        .student-stat-card { background-color: #ffffff; border: 1px solid #e5e7eb; padding: 1rem 1.5rem; border-radius: 0.75rem; display: flex; justify-content: space-between; align-items: center; }
        .student-stat-card i { font-size: 1.75rem; color: #16a34a; }
        .achievement-badge img { width: 48px; height: 48px; object-fit: cover; border-radius: 50%; }
        .achievement-badge .emoji { font-size: 2.5rem; }
        .expandable-content { max-height: 0; overflow: hidden; transition: max-height 0.5s ease-in-out; }
        .expandable-content.show { max-height: 500px; }
        .tab-btn.active { background-color: white; color: #2563eb; font-weight: 600; box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); }
        #book-suggestions { position: absolute; background-color: white; border: 1px solid #d1d5db; border-top: none; z-index: 10; width: 100%; max-height: 150px; overflow-y: auto; border-bottom-left-radius: 0.5rem; border-bottom-right-radius: 0.5rem; }
        .suggestion-item { padding: 0.75rem; cursor: pointer; }
        .suggestion-item:hover { background-color: #f3f4f6; }
        .star-rating-input { display: none; }
        .star-rating-label { color: #d1d5db; cursor: pointer; font-size: 1.75rem; transition: color 0.2s; }
        .star-rating-input:checked ~ .star-rating-label,
        .star-rating-input:hover ~ .star-rating-label,
        .star-rating-label:hover,
        .star-rating-label:hover ~ .star-rating-label { color: #f59e0b; }
        .star-rating-container { display: flex; flex-direction: row-reverse; justify-content: center; }