body { font-family:sans-serif; background:#f2f2f2; margin:0; padding:20px; }
h1,h2 { text-align:center; }
form { display:flex; flex-wrap:wrap; gap:15px; background:#fff; padding:20px; border-radius:8px; max-width:600px; margin:0 auto; box-shadow:0 2px 10px rgba(0,0,0,0.1);}
form label { display:flex; flex-direction:column; flex:1 1 45%; min-width:140px; }
form button { flex:1 1 100%; padding:10px; background:#3498db; color:#fff; border:none; border-radius:4px; cursor:pointer; }
form button:hover { background:#2980b9; }
input[type="text"], input[type="number"], input[type="date"], input[type="time"], select { width:100%; box-sizing:border-box; padding:5px; }
input:focus { background-color:#eef6fc; border-color:#2980b9; }
table { width:100%; border-collapse:collapse; overflow-x:auto; }
table th, table td { padding:6px; font-size:14px; text-align:left; }
table th { background-color:#3498db; color:#fff; }
table tr:hover { background-color:#dfeef7; }
canvas { max-width:100%; margin:10px 0; }
@media(max-width:768px){ table th, table td{ font-size:12px; padding:4px; } form input, form select, form button{ flex:1 1 100%; } }
.dashboard-btn { display:block; text-align:center; margin-top:10px; font-weight:bold; text-decoration:none; color:#fff; background:#2ecc71; padding:10px 15px; border-radius:4px; }
.dashboard-btn:hover { background:#27ae60; }