* { box-sizing: border-box; }
body { margin: 0; font-family: Arial, Helvetica, sans-serif; background: #f4f6f8; color: #1c2733; direction: ltr; }
header { background: #0b3d2e; color: #fff; padding: 24px 16px; text-align: center; }
header h1 { margin: 0 0 6px 0; font-size: 30px; }
header p { margin: 0; opacity: 0.9; }
main { max-width: 860px; margin: 0 auto; padding: 20px 16px 40px 16px; }
.card { background: #fff; border: 1px solid #dde3e8; border-radius: 12px; padding: 20px; margin-bottom: 18px; }
h2 { margin-top: 0; font-size: 20px; }
label { display: block; margin: 12px 0 4px 0; font-weight: bold; }
input, select, textarea { width: 100%; padding: 10px; border: 1px solid #c6cdd4; border-radius: 8px; font-size: 15px; font-family: inherit; }
textarea { min-height: 110px; }
button { background: #0b7a4b; color: #fff; border: 0; border-radius: 8px; padding: 12px 20px; font-size: 16px; cursor: pointer; margin-top: 14px; }
button:hover { background: #095f3a; }
.success { background: #e6f4ea; border: 1px solid #7cb98f; border-radius: 10px; padding: 14px; margin-bottom: 18px; }
.error { background: #fdecea; border: 1px solid #e0a09a; border-radius: 10px; padding: 14px; margin-bottom: 18px; }
.muted { color: #5c6b78; font-size: 14px; }
.chat { background: #f8fafb; border: 1px solid #dde3e8; border-radius: 10px; padding: 14px; }
.chat-msg { margin: 0 0 12px 0; padding: 10px 12px; border-radius: 10px; max-width: 92%; }
.chat-client { background: #e8eef5; margin-right: auto; }
.chat-team { background: #e6f4ea; margin-left: auto; }
.chat-label { font-size: 12px; font-weight: bold; color: #5c6b78; display: block; margin-bottom: 4px; }
.timeline { list-style: none; padding: 0; }
.timeline li { padding: 10px; border-left: 4px solid #c6cdd4; margin-bottom: 8px; background: #f8fafb; }
.timeline li.done { border-color: #0b7a4b; background: #eef7f1; font-weight: bold; }
a { color: #0b5f8a; }
@media (max-width: 600px) { header h1 { font-size: 24px; } }