:root { color-scheme: light; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #17212b; background: #f7f9fb; }
* { box-sizing: border-box; }
body { margin: 0; padding: 64px 20px; }
.container { max-width: 520px; margin: 4vh auto; }
.hidden { display: none !important; }
.tabs { display: flex; padding: 4px; margin-bottom: 20px; border-radius: 12px; background: #e9eef3; }
.tabs button { flex: 1; min-width: 0; padding: 13px 8px; border: 0; border-radius: 9px; background: transparent; color: #627184; font: inherit; font-weight: 600; cursor: pointer; }
.tabs button[aria-selected="true"] { color: #1677d2; background: white; box-shadow: 0 1px 5px #14284112; }
textarea, input { display: block; width: 100%; padding: 16px; border: 1px solid #d9e2ea; border-radius: 12px; background: white; color: inherit; font: inherit; font-size: 16px; line-height: 1.6; }
textarea { min-height: 184px; resize: vertical; }
textarea::placeholder, input::placeholder { color: #8a97a6; }
.submit { display: block; width: 100%; margin-top: 18px; padding: 15px; border: 0; border-radius: 12px; background: #1689e8; color: white; font: inherit; font-weight: 600; cursor: pointer; }
.submit:hover { background: #087ad6; }
button:disabled { opacity: .55; cursor: default; }
textarea:disabled { color: #627184; }
:focus-visible { outline: 3px solid #90c8f7; outline-offset: 3px; }
#message { margin: 18px 2px 0; color: #627184; font-size: 14px; line-height: 1.7; overflow-wrap: anywhere; }
#message.error { color: #c43333; }
#message a { color: #1677d2; margin-left: 8px; }
@media (max-width: 480px) { body { padding: 36px 20px; } .container { margin-top: 3vh; } }