/* A deliberately small, readable stylesheet. */
* { box-sizing: border-box; }
body { margin: 0; font-family: Arial, sans-serif; color: #222; background: #fff; line-height: 1.6; transition: background .2s, color .2s; }
.container { width: min(900px, 92%); margin: 0 auto; }
header { background: #233b55; color: white; }
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 16px 0; flex-wrap: wrap; }
.logo { color: white; font-size: 22px; font-weight: bold; text-decoration: none; }
nav { display: flex; gap: 16px; flex-wrap: wrap; }
nav a { color: white; text-decoration: none; }
nav a:hover, nav a[aria-current="page"] { text-decoration: underline; }
main { padding-top: 36px; padding-bottom: 60px; min-height: 65vh; }
h1 { font-size: 30px; margin-top: 0; }
h2 { font-size: 21px; margin-top: 28px; }
.banner { display: block; width: 100%; max-width: 550px; height: auto; margin: 24px 0; border-radius: 8px; }
a { color: #175e9c; }
.button, button { background: #233b55; color: white; border: 0; border-radius: 4px; padding: 10px 15px; font: inherit; cursor: pointer; text-decoration: none; display: inline-block; }
.button:hover, button:hover { background: #365b80; }
footer { background: #eee; color: #555; padding: 22px 0; font-size: 14px; }
form { max-width: 520px; display: grid; gap: 8px; margin-top: 20px; }
input, textarea { width: 100%; padding: 9px; border: 1px solid #b8c2cc; border-radius: 4px; font: inherit; }
form button { justify-self: start; margin-top: 8px; }
.form-status { min-height: 1.6em; margin: 0; }
.form-status.error { color: #a12622; }
.form-status.success { color: #176b3a; }
.theme-toggle { padding: 7px 10px; font-size: 14px; }
body.dark-theme { color: #eee; background: #18232e; }
body.dark-theme footer { background: #243442; color: #d7e0e8; }
body.dark-theme input, body.dark-theme textarea { color: #eee; background: #243442; border-color: #607789; }
body.dark-theme a { color: #8bc7ff; }
@media (max-width: 600px) { .header-inner { align-items: flex-start; } nav { gap: 10px 14px; } h1 { font-size: 26px; } }