body { font-family: Arial, sans-serif; margin: 0; background: #f5f7fb; color: #222; }
.wrap { max-width: 1000px; margin: 0 auto; padding: 1rem; }
.topbar, .footer { background: #243447; color: #fff; }
.topbar a, .footer a { color: #fff; margin-left: 1rem; text-decoration: none; }
.card { background: #fff; border-radius: 10px; padding: 1rem; margin: 1rem 0; box-shadow: 0 2px 10px rgba(0,0,0,.08); }
.narrow { max-width: 480px; }
label { display: block; margin-bottom: .75rem; }
input, textarea, select { width: 100%; padding: .65rem; box-sizing: border-box; margin-top: .25rem; }
button, .button-link { display: inline-block; background: #0d6efd; color: #fff; border: 0; padding: .65rem 1rem; border-radius: 6px; text-decoration: none; cursor: pointer; }
.button-link.danger { background: #b42318; }
.alert { padding: .75rem 1rem; border-radius: 6px; margin: .75rem 0; }
.alert.success { background: #e7f6ec; color: #1e6b34; }
.alert.error { background: #fdecea; color: #9b1c1c; }
.inline { display: flex; gap: .5rem; align-items: center; }
.inline input { width: auto; margin-top: 0; }
table { width: 100%; border-collapse: collapse; background: #fff; }
th, td { padding: .75rem; border-bottom: 1px solid #ddd; text-align: left; }
@media (max-width: 640px) { .topbar .wrap { display: block; } table, thead, tbody, tr, td, th { font-size: .9rem; } }