:root{
  --bg:#141619; --panel:#1c1f24; --line:#2e333b;
  --text:#d6d9de; --muted:#8f96a1; --accent:#a3b6c9;
  color-scheme:dark;
}
*{box-sizing:border-box;}
body{margin:0; background:var(--bg); color:var(--text);
  font:16px/1.55 "Segoe UI", system-ui, sans-serif;}
a{color:var(--accent); text-decoration:none;}
.site-header{display:flex; flex-wrap:wrap; gap:16px; align-items:center;
  justify-content:space-between; padding:18px max(16px,4vw);
  border-bottom:1px solid var(--line);}
.wordmark{font-weight:700; letter-spacing:.34em; color:var(--accent);}
nav{display:flex; flex-wrap:wrap; gap:20px; font-size:.92rem;}
nav a{color:var(--muted);}
nav a:hover{color:var(--text);}
nav a.login{color:var(--accent); border:1px solid var(--line);
  border-radius:4px; padding:4px 14px;}
main{max-width:880px; margin:0 auto; padding:0 16px 80px;}
.hero{padding:90px 0 40px;}
.eyebrow{font-size:.75rem; letter-spacing:.22em; text-transform:uppercase; color:var(--muted);}
.hero h1{font-size:3.4rem; letter-spacing:.18em; margin:8px 0 12px;}
.lede{max-width:56ch; color:var(--muted); font-size:1.12rem;}
.btn{display:inline-block; background:var(--accent); color:#14161a;
  font-weight:600; border-radius:4px; padding:10px 26px; margin-top:14px;}
.notice{background:var(--panel); border:1px solid var(--line);
  border-radius:6px; padding:6px 18px; color:var(--muted); font-size:.9rem;}
.site-footer{border-top:1px solid var(--line); color:var(--muted);
  font-size:.82rem; text-align:center; padding:22px 16px;}

/* components */
h1{margin-top:40px;}
h3{color:var(--accent); margin:18px 0 8px;}
.muted{color:var(--muted);}
.error{color:#d08a8a;}
.card{background:var(--panel); border:1px solid var(--line); border-radius:6px;
  padding:16px 20px; margin:16px 0;}
.grid2{display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:16px;}
.pill{display:inline-block; border:1px solid var(--line); border-radius:12px;
  padding:1px 10px; font-size:.78rem; color:var(--accent);}
.pill.warn{color:#c9a86a; border-color:#c9a86a;}
.steps{padding-left:22px;} .steps li{margin:6px 0;}
.steps li.done{color:var(--muted); text-decoration:line-through;}
.notice{margin:16px 0;}
label{display:block; margin:10px 0; color:var(--muted); font-size:.92rem;}
label.inline{display:inline-flex; align-items:center; gap:6px; margin-right:16px;}
input:not([type=checkbox]), select, textarea{display:block; width:100%; margin-top:4px;
  background:#101216; color:var(--text); border:1px solid var(--line);
  border-radius:4px; padding:8px 10px; font:inherit;}
.grid2 label{margin:4px 0;}
button.btn{border:0; cursor:pointer; font:inherit;}
.btn.ghost{background:transparent; color:var(--accent); border:1px solid var(--line);}
.btn.danger{background:#7e3b3b; color:#f0dede;}
.authbox{max-width:380px; margin:60px auto;}
.bigform{max-width:640px;}
.inlineform{display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-top:10px;}
.inlineform input{width:auto; flex:1; min-width:140px; margin:0;}
.inlineform .btn{margin:0; padding:8px 14px;}
.tablewrap{overflow-x:auto;}
table{border-collapse:collapse; width:100%; font-size:.93rem;}
th{font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted);
  text-align:left; padding:8px 14px 8px 0; border-bottom:1px solid var(--line);}
td{padding:8px 14px 8px 0; border-bottom:1px solid var(--line);}
.stats{display:flex; flex-wrap:wrap; gap:14px; margin:20px 0;}
.stat{background:var(--panel); border:1px solid var(--line); border-radius:6px;
  padding:14px 22px; min-width:130px;}
.stat b{display:block; font-size:1.7rem;}
.stat span{color:var(--muted); font-size:.82rem;}
.adminnav{display:flex; flex-wrap:wrap; gap:16px; margin:10px 0 20px;}
.adminnav a{border:1px solid var(--line); border-radius:4px; padding:6px 14px;}
.rankrow{display:flex; flex-wrap:wrap; gap:12px; align-items:center;
  border-bottom:1px solid var(--line); padding:10px 0;}
.rankrow input[name=name]{width:220px; margin:0;}
.ranknum{color:var(--muted); width:24px; text-align:right;}
.rankrow .btn{margin:0; padding:6px 14px;}
.inlinecheck{display:inline;}
.checkbtn{background:none; border:1px solid var(--line); border-radius:50%;
  color:var(--accent); cursor:pointer; width:26px; height:26px; margin-right:6px;}
.prose{line-height:1.7;}
.subnav{display:flex; flex-wrap:wrap; gap:18px; padding:10px max(16px,4vw);
  border-bottom:1px solid var(--line); background:var(--panel); font-size:.86rem;}
.subnav a{color:var(--muted);}
.subnav a:hover{color:var(--text);}
