body { padding-top: 70px; background-color: #f4f7f6; }

.page { 
    display: none; 
    animation: fadeIn 0.3s ease;
}

.page.active { 
    display: block; 
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.card { border-radius: 16px; }
.res-box { padding: 20px; border-radius: 12px; }
.res-rot { border-left: 6px solid #0d6efd; background: #fff; }
.res-exc { border-left: 6px solid #198754; background: #fff; }
.res-ham { border-left: 6px solid #dc3545; background: #fff; }
.history-list { font-size: 0.9rem; max-height: 300px; overflow-y: auto; }

.history-list::-webkit-scrollbar { width: 0; }