/* Shared look for the simple pages (printables, credits, settings). */
:root { color-scheme: dark; }
* { box-sizing: border-box; }
body { margin: 0; background: #17171a; color: #e8e8e4; font: 14px/1.55 system-ui, sans-serif; }
main { padding: 22px 20px 48px; max-width: 980px; margin: 0 auto; }
h1 { font-size: 20px; font-weight: 600; margin: 0 0 4px; }
h2 { font-size: 15px; font-weight: 600; margin: 0 0 8px; }
.lead { color: #9a9a92; margin: 0 0 22px; }
.muted { color: #9a9a92; }
.hint { font-size: 12px; color: #6f6f68; }
a { color: #6aa9ff; }
.card { background: #1b1b1f; border: 1px solid #2c2c31; border-radius: 10px; padding: 14px 16px; margin: 0 0 14px; }
.card p { margin: 4px 0; }
.row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 10px; }
.btn, button, select { background: #26262b; color: #e8e8e4; border: 1px solid #3a3a41; border-radius: 6px; padding: 6px 12px; font: inherit; font-size: 13px; cursor: pointer; text-decoration: none; white-space: nowrap; }
.btn:hover, button:hover, select:hover { background: #303037; }
.btn.primary { background: #2c4a73; border-color: #3d6396; }
button.danger { border-color: #6b2e2e; color: #ef7070; }
.soon { display: inline-block; font-size: 11px; padding: 0 6px; border-radius: 9px; border: 1px solid #5f5a3b; color: #d8c66a; vertical-align: 2px; margin-left: 6px; }
label.field { display: grid; grid-template-columns: 160px 1fr; gap: 12px; align-items: center; margin: 8px 0; }
ul.plain { list-style: none; padding: 0; margin: 6px 0 0; }
ul.plain li { padding: 3px 0; }
.ok { color: #8fc98f; }