body { font-family: Arial, sans-serif; background: #f9f9f9; color: #333; margin: 0; padding: 20px; }
.container { max-width: 500px; margin: 0 auto; background: white; padding: 20px; border-radius: 8px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); }
h2 { text-align: center; color: #2c5aa0; }
.form-group { margin-bottom: 20px; }
label { display: block; margin-bottom: 5px; font-weight: bold; }
input, select, textarea { width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 4px; box-sizing: border-box; font-size: 16px; }
input:focus, select:focus, textarea:focus { border-color: #2c5aa0; outline: none; }
.total-field { font-size: 18px; font-weight: bold; color: #2c5aa0; padding: 10px; background: #f0f8ff; border: 1px solid #ddd; border-radius: 4px; text-align: right; }
button { width: 100%; padding: 12px; background: #2c5aa0; color: white; border: none; border-radius: 4px; font-size: 16px; cursor: pointer; }
button:hover { background: #1e3f70; }
.tooltip { display: none; color: #d32f2f; font-size: 12px; margin-top: 5px; }
.error .tooltip { display: block; }
@media (max-width: 600px) { .container { padding: 10px; } }