body { font-family: 'Anuphan', sans-serif; }
.status-card-gradient { background: linear-gradient(135deg, #064e3b 0%, #022c22 100%); }
.custom-scroll::-webkit-scrollbar { width: 4px; }
.custom-scroll::-webkit-scrollbar-track { background: #f1f5f9; }
.custom-scroll::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 10px; }
#loading-overlay { position: fixed; inset: 0; background: rgba(255, 255, 255, 0.9); z-index: 9999; display: flex; align-items: center; justify-content: center; backdrop-filter: blur(4px); }
.active-nav { color: #064e3b !important; }
#nav-record.active-nav { color: #059669 !important; }
#nav-dashboard.active-nav { color: #2563eb !important; }
#nav-monthly.active-nav { color: #7c3aed !important; }
#nav-report.active-nav { color: #d97706 !important; }
#nav-admin.active-nav { color: #475569 !important; }
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
.view-section { animation: fadeIn 0.3s ease-out forwards; }
#pdf-report-template { width: 210mm; min-height: 360mm; padding: 15mm 18mm; background: white; position: fixed; left: -10000px; top: 0; color: black; line-height: 1.25; }
.report-header { text-align: center; margin-bottom: 8px; }
.report-header h1 { font-size: 18px; font-weight: bold; margin-bottom: 1px; }
.report-header h2 { font-size: 14px; font-weight: bold; margin-bottom: 1px; }
.report-header p { font-size: 10px; margin-bottom: 1px; }
.report-summary-box { display: flex; justify-content: space-around; border: 1px solid #000; padding: 6px; margin-bottom: 8px; border-radius: 4px; }
.summary-item { text-align: center; }.summary-item p { font-size: 9px; margin: 0; }.summary-item b { font-size: 12px; }
.report-table { width: 100%; border-collapse: collapse; margin-bottom: 15px; }.report-table th, .report-table td { border: 0.5px solid #000; padding: 8px 6px; text-align: center; font-size: 9.5px; }.report-table th { background-color: #f2f2f2; font-weight: bold; }
.signature-section { margin-top: 30px; display: grid; grid-template-columns: 1fr 1fr; gap: 30px 20px; }.sig-box { text-align: center; font-size: 10px; }.sig-box p { margin: 1px 0; }.sig-full { grid-column: span 2; margin-top: 5px; }