/* List, sign-in and admin pages. Same palette as the form itself. */
:root{
  --maroon:#801D38;--maroon-ink:#5E1429;--maroon-wash:#F6EEF1;
  --ink:#1E1419;--muted:#6B5C62;--rule:#D8CFD3;--rule-soft:#E8E1E4;
  --paper:#FFFFFF;--ground:#EDE8EA;--band:#F2F2F2;
  --ok-bg:#EAF5DF;--ok-ink:#2F5512;--err-bg:#FDECEC;--err-ink:#8E1B1B;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --maroon:#C8698A;--maroon-ink:#E29DB4;--maroon-wash:#2A1A20;
    --ink:#EFE6E9;--muted:#B3A3A9;--rule:#4A3A40;--rule-soft:#3A2D32;
    --paper:#1A1316;--ground:#120D0F;--band:#241B1F;
    --ok-bg:#1F2E14;--ok-ink:#BFE39A;--err-bg:#3A1616;--err-ink:#F3B1B1;
  }
}
*{box-sizing:border-box}
body{margin:0;background:var(--ground);color:var(--ink);font:400 14px/1.45 Arial,"Helvetica Neue",Helvetica,sans-serif}
a{color:var(--maroon)}
.top{display:flex;flex-wrap:wrap;align-items:center;gap:10px 24px;padding:12px 20px;background:var(--paper);border-bottom:3px solid var(--maroon)}
.brand{display:flex;flex-direction:column;text-decoration:none;color:var(--ink)}
.brand b{font-size:17px}
.eyebrow{font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--maroon)}
.top nav{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;margin-left:auto;font-size:13px}
.top nav a{text-decoration:none;font-weight:600}
.top nav a:hover{text-decoration:underline}
.who{color:var(--muted)}
.top form{margin:0}
.link{background:none;border:0;padding:0;font:inherit;font-weight:600;color:var(--maroon);cursor:pointer}
.wrap{max-width:1180px;margin:0 auto;padding:22px 16px 60px;display:flex;flex-direction:column;gap:18px}
.card{background:var(--paper);border:1px solid var(--rule);padding:20px 22px;border-radius:3px}
.card.narrow{max-width:460px;width:100%;margin:0 auto}
h1{margin:0 0 12px;font-size:21px}
h2{margin:0 0 12px;font-size:16px}
.bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.bar h1{margin:0}
.muted{color:var(--muted);font-size:12px}
.ok,.err{padding:8px 11px;border-radius:3px;margin:0 0 12px}
.ok{background:var(--ok-bg);color:var(--ok-ink)}
.err{background:var(--err-bg);color:var(--err-ink)}
.empty{padding:30px;text-align:center;background:var(--band);border:1px dashed var(--rule);margin:0}
.stack{display:flex;flex-direction:column;gap:12px}
.stack label{display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:700;color:var(--muted)}
.stack label.check{flex-direction:row;align-items:center;gap:8px;font-weight:400;color:var(--ink)}
input[type=text],input[type=password],input:not([type]),input[name=q]{
  font:inherit;font-size:14px;padding:8px 10px;border:1px solid var(--rule);border-radius:3px;background:var(--paper);color:var(--ink);min-width:0
}
input:focus{outline:2px solid var(--maroon);outline-offset:0}
.btn{display:inline-block;font:inherit;font-size:12.5px;font-weight:600;padding:7px 12px;border:1px solid var(--rule);border-radius:3px;background:var(--paper);color:var(--ink);text-decoration:none;cursor:pointer;white-space:nowrap}
.btn:hover{border-color:var(--maroon);color:var(--maroon)}
.btn.primary{background:var(--maroon);border-color:var(--maroon);color:#fff;padding:9px 16px}
.btn.primary:hover{background:var(--maroon-ink);border-color:var(--maroon-ink);color:#fff}
.btn.danger:hover{border-color:#A81F1F;color:#A81F1F}
.search{display:flex;gap:8px;margin-bottom:14px}
.search input{flex:1}
.tablewrap{overflow-x:auto}
.list{width:100%;border-collapse:collapse;font-size:13px}
.list th{text-align:left;font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);background:var(--band);padding:7px 9px;border-bottom:1px solid var(--rule)}
.list td{padding:8px 9px;border-bottom:1px solid var(--rule-soft);vertical-align:top}
.list a{text-decoration:none}
.list tr:hover td{background:var(--maroon-wash)}
.list tr.off td{color:var(--muted)}
.list .num{text-align:right;font-variant-numeric:tabular-nums}
.acts{white-space:nowrap;text-align:right}
form.inline{display:inline-flex;gap:6px;margin:0 0 0 4px}
form.inline input{font-size:12px;padding:5px 8px;width:150px}
.remind{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;padding:12px 16px;border:1px solid #E0B44A;border-left:5px solid #E0B44A;background:#FFF6E0;color:#6B4E00;border-radius:3px}
.remind form{margin:0}

/* help page */
.help{max-width:860px;margin:0 auto;width:100%}
.help h2{color:var(--maroon);font-size:18px;margin:28px 0 8px;padding-bottom:4px;border-bottom:1px solid var(--rule-soft)}
.help h3{font-size:15px;margin:18px 0 6px}
.help p,.help li{line-height:1.55}
.help ol,.help ul{padding-left:22px}
.help li{margin:4px 0}
.help .toc{columns:2;background:var(--band);border:1px solid var(--rule-soft);padding:10px 16px 10px 32px;margin:0 0 6px}
.help .tip,.help .warnbox{padding:10px 13px;margin:12px 0;border-radius:3px}
.help .tip{background:var(--ok-bg);color:var(--ok-ink);border-left:4px solid currentColor}
.help .warnbox{background:#FFF6E0;color:#6B4E00;border-left:4px solid #E0B44A}
.help b.ui{background:var(--band);border:1px solid var(--rule);border-radius:3px;padding:0 5px;white-space:nowrap}
.help table{border-collapse:collapse;width:100%;font-size:13.5px;margin:8px 0}
.help th,.help td{border:1px solid var(--rule);padding:6px 9px;text-align:left;vertical-align:top}
.help th{background:var(--band)}
@media (max-width:620px){.help .toc{columns:1}}

/* front page */
.hello h1{margin:0 0 2px}
.hello p{margin:0}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.tile{display:flex;flex-direction:column;gap:12px;background:var(--paper);border:1px solid var(--rule);border-top:4px solid var(--maroon);border-radius:3px;padding:18px 20px}
.tile-main{display:flex;flex-direction:column;gap:6px;text-decoration:none;color:var(--ink);flex:1}
.tile-main b{font-size:19px;color:var(--maroon)}
.tile-main:hover b{text-decoration:underline}
.tile-blurb{font-size:13px;color:var(--muted);line-height:1.45}
.tile-count{font-size:12px;font-weight:700;color:var(--ink);margin-top:auto;padding-top:6px}
.tile .btn{align-self:flex-start}
.bar .eyebrow{display:block}