body { font: 16px/1.45 system-ui, sans-serif; margin: 0; color: #1d2a2a; background: #fbfaf6; }
nav { display: flex; flex-wrap: wrap; gap: .3rem .9rem; align-items: center; padding: .6rem 1rem; background: #1f4d4a; }
nav a { color: #fff; text-decoration: none; }
nav .search input { padding: .25rem .4rem; }
main { max-width: 70rem; margin: 0 auto; padding: 1rem; }
label { display: block; margin: .6rem 0; font-weight: 600; }
label small, legend small { font-weight: 400; color: #556; }
input, textarea, select { font: inherit; box-sizing: border-box; }
form.edit input:not([type=checkbox]), form.edit textarea { width: 100%; display: block; padding: .3rem; }
textarea.mono { font-family: ui-monospace, monospace; font-size: 14px; }
table { border-collapse: collapse; width: 100%; }
th, td { text-align: left; padding: .25rem .4rem; border-bottom: 1px solid #ddd; vertical-align: top; }
table.q input, table.q select { width: 100%; }
fieldset { border: 1px solid #ccc; margin: 1rem 0; }
button { font: inherit; padding: .35rem .8rem; cursor: pointer; }
button.big { font-size: 1.15rem; padding: .7rem 1.4rem; }
form.inline { display: inline; }
form.danger { margin-top: 2rem; }
.flash { background: #e3f4e6; padding: .5rem; }
.warn { background: #fdeccc; padding: .5rem; }
.problems .error { color: #9b1c1c; }
.problems .warning { color: #7a5200; }
.ok { color: #1c6b2e; }
.tracks h3 { margin-bottom: .2rem; }
.tracks .next { color: #556; font-size: .9rem; }
.filters { display: flex; flex-wrap: wrap; gap: .5rem; }
label.check { font-weight: 400; }