* { box-sizing: border-box; }
body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
       margin: 0; background: #f5f6f8; color: #222; }
header { background: #1877f2; color: white; padding: 1rem 2rem;
         display: flex; align-items: center; gap: 1rem; }
header h1 { margin: 0; font-size: 1.25rem; flex: 1; }
header button, header a.header-btn {
  background: white; color: #1877f2; border: 0;
  padding: .5rem 1rem; border-radius: 4px; font-weight: 600;
  cursor: pointer; text-decoration: none; display: inline-block;
  font-size: .9rem; font-family: inherit;
}
header a.header-btn { background: rgba(255,255,255,.18); color: white; }
header a.header-btn:hover { background: rgba(255,255,255,.3); }
header button:disabled { opacity: .6; cursor: wait; }
footer.app-footer { text-align: center; padding: 1.5rem 1rem 1rem;
                    color: #888; font-size: .8rem; letter-spacing: .02em; }
footer.app-footer strong { color: #555; }
.htmx-indicator { display: none; }
.htmx-request .htmx-indicator,
.htmx-indicator.htmx-request { display: block; }
form#filters { background: white; padding: 1rem 2rem;
               border-bottom: 1px solid #ddd; display: flex; gap: 2rem; }
fieldset { border: 0; margin: 0; padding: 0; }
fieldset label { margin-right: .75rem; }
main { padding: 1.5rem 2rem; }
.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
         gap: 1rem; margin-bottom: 2rem; }
.card { background: white; padding: 1rem; border-radius: 8px;
        box-shadow: 0 1px 2px rgba(0,0,0,.05); }
.card h3 { margin: 0 0 .5rem; font-size: .85rem; color: #666; font-weight: 500;
           text-transform: uppercase; letter-spacing: .03em; }
.big { font-size: 2rem; font-weight: 600; margin: 0; }
.sub { font-size: .8rem; color: #888; margin: .25rem 0 0; }
.banner { padding: .75rem 1rem; border-radius: 4px; margin: 1rem 2rem; }
.banner-error { background: #fde7e9; color: #a01020; }
.banner-info { background: #e7f3ff; color: #1877f2; }
table { width: 100%; background: white; border-collapse: collapse;
        border-radius: 8px; overflow: hidden;
        box-shadow: 0 1px 2px rgba(0,0,0,.05); }
th, td { padding: .75rem 1rem; text-align: left; border-bottom: 1px solid #eee; }
th { background: #fafafa; font-size: .85rem; color: #666; }