/* zpew.net palette, Times New Roman for all text, a Nerd Font for numbers only. */
@font-face {
  font-family: "Nerd";
  src: local("Hack Nerd Font"), local("HackNerdFont-Regular"), local("JetBrainsMono Nerd Font"), local("JetBrainsMonoNerdFont-Regular"), local("FiraCode Nerd Font"), local("FiraCodeNerdFont-Regular"),
       url("https://cdn.jsdelivr.net/gh/ryanoasis/nerd-fonts@v3.2.1/patched-fonts/Hack/Regular/HackNerdFont-Regular.ttf") format("truetype");
  font-display: swap;
}
body { margin: 0; padding: 20px; background: #ece9d8; color: #000; font-family: "Times New Roman", Times, serif; font-size: 15px; line-height: 1.4; }
a { color: #00f; }
a:visited { color: #551a8b; }
h1, h2, h3 { font-weight: normal; margin: 0; }
h1 { font-size: 48px; text-align: center; }
h2 { font-size: 26px; margin: 18px 0 6px; }
h3 { font-size: 19px; margin: 12px 0 4px; }
hr { border: 0; border-top: 1px solid #b8b5a8; margin: 12px 0; }
p { margin: 4px 0; }
.box, .hero, .signin, dialog, .status { background: #f5f3ea; border: 1px solid #b8b5a8; padding: 12px 16px; }
.muted { color: #555; }
.small { font-size: 13px; }
.error { color: #a00; }
.flag { color: #7a5a00; }
.spacer { display: none; }
button, input, select, .primary, .ghost { font-family: "Times New Roman", Times, serif; font-size: 15px; color: #000; background: #ece9d8; border: 1px solid #b8b5a8; padding: 1px 6px; text-decoration: none; cursor: pointer; }
input, select { background: #fff; }
.bar { text-align: center; margin-bottom: 10px; }
.bar > * { margin: 0 4px; }
.brand { font-size: 48px; display: block; margin-bottom: 6px; }
.pickers { display: inline; }
#player-free { width: 110px; }
main { max-width: 960px; margin: 0 auto; }
.level { text-align: center; }
.level .num { font-size: 36px; margin: 2px 0; }
.level .num small { font-size: 16px; color: #555; }
/* numbers */
.level .num, td.num, th.num, .xp, .nums, .stages td, .stages th.num { font-family: "Nerd", "Courier New", monospace; }
.level .num { font-size: 32px; }
td.num, .xp, .nums, .stages td { font-size: 13px; }
table { border-collapse: collapse; margin: 6px 0 10px; width: 100%; background: #f5f3ea; }
th, td { border: 1px solid #b8b5a8; padding: 3px 7px; text-align: left; vertical-align: top; }
th { background: #e4e0cf; font-weight: bold; }
td.num, th.num { text-align: right; white-space: nowrap; }
tr.done td { color: #777; }
tr.current td { font-weight: bold; }
ol.queue { margin: 6px 0 6px 28px; padding: 0; }
ol.queue li { margin: 2px 0; }
ol.queue .sub { color: #444; }
ol.queue .xp { font-weight: bold; }
.hero { margin: 8px 0; }
.hero .title { font-weight: bold; margin: 0; }
.stage-group .tag { margin-left: 6px; color: #a00; }
details.cat { margin: 6px 0; }
details.cat > summary { cursor: pointer; background: #e4e0cf; border: 1px solid #b8b5a8; padding: 3px 8px; }
details.cat > summary .name { font-weight: bold; }
details.cat > summary .nums { margin-left: 10px; }
details.tasks > summary { cursor: pointer; color: #00f; text-decoration: underline; }
.chain.complete td { color: #777; }
.skip { color: #7a5a00; }
.linkish { background: none; border: 0; padding: 0; font: inherit; color: #00f; text-decoration: underline; cursor: pointer; }
.results { list-style: none; padding: 0; margin: 4px 0; }
.tree ul { margin: 0 0 0 18px; padding: 0; }
.tree .line > * { margin-right: 8px; }
.tree .how { color: #555; }
.tree .save { color: #060; }
.verdict { font-weight: bold; }
#settings-fields label { display: inline-block; width: 230px; }
#settings-fields input, #settings-fields select { margin-bottom: 3px; width: 130px; }
.row.end { margin-top: 8px; }
.status { position: fixed; bottom: 12px; left: 12px; }
.gaps { margin-top: 12px; }
.footer { color: #555; font-size: 13px; text-align: center; margin-top: 14px; }