*{box-sizing:border-box;margin:0;padding:0}body{color:#1f2937;background-color:#f4f6f9;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;line-height:1.6}a{color:inherit;text-decoration:none}button{font-family:inherit}img{max-width:100%;display:block}.navbar{color:#fff;background:linear-gradient(135deg,#2563eb,#1d4ed8);border-radius:14px;margin-bottom:35px;padding:22px 30px;box-shadow:0 8px 20px #2563eb33}.navbar-content{flex-direction:column;align-items:center;display:flex}.logo{letter-spacing:.5px;margin:0;font-size:2rem;font-weight:700}.tagline{color:#dbeafe;margin-top:8px;font-size:1rem;font-weight:400}@media (width<=768px){.navbar{padding:18px}.logo{text-align:center;font-size:1.5rem}.tagline{text-align:center;font-size:.9rem}}.student-form{background-color:#fff;border:1px solid #e5e7eb;border-radius:14px;margin:30px 0;padding:28px;box-shadow:0 6px 18px #0f172a14}.student-form h2{color:#1f2937;margin-bottom:22px;font-size:1.6rem}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;display:grid}.form-group{flex-direction:column;gap:7px;display:flex}.form-group label{color:#374151;font-size:.95rem;font-weight:600}.form-group input,.form-group select{color:#1f2937;background-color:#fff;border:1px solid #cbd5e1;border-radius:8px;width:100%;padding:12px 14px;font-size:1rem;transition:border-color .2s,box-shadow .2s}.form-group input:focus,.form-group select:focus{border-color:#2563eb;outline:none;box-shadow:0 0 0 3px #2563eb26}.form-actions{gap:12px;margin-top:22px;display:flex}.form-actions button{color:#fff;cursor:pointer;background-color:#2563eb;border:none;border-radius:8px;padding:12px 20px;font-size:1rem;font-weight:600;transition:background-color .2s,transform .2s}.form-actions button:hover:not(:disabled){background-color:#1d4ed8;transform:translateY(-1px)}.form-actions button:disabled{cursor:not-allowed;opacity:.65}.form-actions .cancel-button{background-color:#64748b}.form-actions .cancel-button:hover{background-color:#475569}.form-message{border-radius:8px;margin-bottom:18px;padding:12px 14px;font-weight:600}.success-message{color:#166534;background-color:#dcfce7;border:1px solid #86efac}.error-message{color:#b91c1c;background-color:#fee2e2;border:1px solid #fecaca}@media (width<=768px){.student-form{padding:20px}.form-grid{grid-template-columns:1fr}.form-actions{flex-direction:column}.form-actions button{width:100%}}.student-table{background-color:#fff;border:1px solid #e5e7eb;border-radius:14px;margin:30px 0;padding:24px;box-shadow:0 6px 18px #0f172a14}.table-header{justify-content:space-between;align-items:center;gap:15px;margin-bottom:20px;display:flex}.table-header h2{color:#1f2937;font-size:1.6rem}.student-count{color:#1d4ed8;background-color:#eff6ff;border-radius:20px;padding:7px 12px;font-size:.9rem;font-weight:600}.table-wrapper{width:100%;overflow-x:auto}.student-table table{border-collapse:collapse;width:100%;min-width:1050px}.student-table th,.student-table td{text-align:left;border-bottom:1px solid #e5e7eb;padding:13px 12px}.student-table th{color:#fff;white-space:nowrap;background-color:#2563eb;font-size:.9rem;font-weight:600}.student-table th:first-child{border-top-left-radius:8px}.student-table th:last-child{border-top-right-radius:8px}.student-table td{color:#374151;font-size:.92rem}.student-table tbody tr:nth-child(2n){background-color:#f8fafc}.student-table tbody tr:hover{background-color:#eff6ff}.action-buttons{gap:8px;display:flex}.action-buttons button{color:#fff;cursor:pointer;border:none;border-radius:6px;padding:7px 12px;font-size:.85rem;font-weight:600;transition:background-color .2s,transform .2s}.action-buttons button:hover{transform:translateY(-1px)}.edit-button{background-color:#f59e0b}.edit-button:hover{background-color:#d97706}.delete-button{background-color:#dc2626}.delete-button:hover{background-color:#b91c1c}.empty-message{color:#64748b;text-align:center;background-color:#f8fafc;border:1px dashed #cbd5e1;border-radius:8px;padding:28px}@media (width<=768px){.student-table{padding:18px}.table-header{flex-direction:column;align-items:flex-start}}.app{width:90%;max-width:1200px;margin:40px auto;padding:20px}.title{text-align:center;color:#1f2937;margin-bottom:30px;font-size:2.3rem;font-weight:700}.status-message{text-align:center;color:#1d4ed8;background-color:#eff6ff;border-radius:8px;margin:20px 0;padding:12px;font-weight:600}.error-message{color:#b91c1c;background-color:#fee2e2}@media (width<=768px){.app{width:95%;padding:10px}.title{font-size:1.8rem}}
