:root { font: 16px system-ui, sans-serif; color: #15283f; background: #eef3f9; }
* { box-sizing: border-box; }
main { width: min(96%, 85rem); margin: 2rem auto; }
main.login { max-width: 30rem; }
header, form { display: flex; align-items: end; gap: 1rem; flex-wrap: wrap; }
header { justify-content: space-between; align-items: center; }
h2 { font-size: 1.2rem; margin-top: 0; }
#stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr)); gap: .75rem; }
.panel, .card, .login { background: white; border-radius: .65rem; padding: 1rem; }
.panel { margin-top: 1rem; }
.card strong { display: block; font-size: 1.6rem; }
label { display: grid; gap: .35rem; }
input, button { font: inherit; padding: .5rem .65rem; border-radius: .35rem; }
input { border: 1px solid #8999af; max-width: 100%; }
button { background: #164477; color: white; border: 0; cursor: pointer; }
button:disabled { opacity: .5; cursor: default; }
.scroll { overflow: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: .6rem; text-align: left; border-bottom: 1px solid #dae4ef; }
td { overflow-wrap: anywhere; }
td button { margin: .15rem; }
output { display: block; margin-top: .5rem; overflow-wrap: anywhere; }