:root{
  --bg:#15100b; --bg2:#0e0a07; --panel:#1b140d; --panel2:#241a11;
  --brass:#c69c57; --brass-dk:#6e5228; --copper:#b87333; --teal:#2aa198;
  --text:#e9d8b5; --dim:#9a8460; --ink:#0e0a07;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; font-family:"Segoe UI",system-ui,sans-serif; color:var(--text);
  background:linear-gradient(180deg,var(--bg),var(--bg2)) fixed; line-height:1.6;
}
a{color:var(--brass); text-decoration:none}
a:hover{color:var(--copper); text-decoration:underline}
code{font-family:Consolas,monospace; color:var(--copper)}

.topbar{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:.8rem 1.2rem; border-bottom:2px solid var(--brass-dk);
  position:sticky; top:0; background:rgba(14,10,7,.92); backdrop-filter:blur(6px); z-index:10;
}
.brand{display:flex; align-items:center; gap:.6rem; font-family:Georgia,serif;
  font-weight:bold; font-size:1.2rem; color:var(--brass); letter-spacing:1px}
.topbar nav a{margin-left:1.1rem; font-size:.95rem}

main{max-width:860px; margin:0 auto; padding:0 1.2rem}
.hero{text-align:center; padding:3.2rem 0 2rem}
.hero h1{font-family:Georgia,serif; font-size:2.3rem; color:var(--brass); margin:.2rem 0 1rem}
.lead{font-size:1.15rem; color:var(--text); max-width:680px; margin:0 auto 1.6rem}
.cta{
  display:inline-block; background:linear-gradient(180deg,#d8a95e,#9c6f33);
  color:var(--ink); font-weight:bold; padding:.8rem 1.6rem; border-radius:8px;
  border:2px solid var(--brass); font-size:1.05rem;
}
.cta:hover{filter:brightness(1.08); text-decoration:none; color:var(--ink)}
.sub{color:var(--dim); font-size:.9rem; margin-top:.7rem}
.note{color:var(--dim); font-size:.9rem}

h2{font-family:Georgia,serif; color:var(--brass); border-bottom:1px solid var(--brass-dk);
  padding-bottom:.4rem; margin-top:2.6rem}
.grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:1rem; margin-top:1.2rem}
.grid article{background:var(--panel); border:1px solid var(--brass-dk); border-radius:10px; padding:1rem 1.1rem}
.grid h3{margin:.2rem 0 .4rem; color:var(--copper)}
.grid p{margin:0; color:var(--text); font-size:.97rem}

.term{
  background:var(--ink); border:1px solid var(--brass-dk); border-radius:8px;
  padding:.9rem 1rem; overflow-x:auto; color:var(--teal);
  font-family:Consolas,monospace; font-size:.92rem;
}
.checks{list-style:none; padding:0; columns:2; gap:1.4rem}
.checks li{margin:.35rem 0; break-inside:avoid}
@media(max-width:560px){.checks{columns:1}}

.download{text-align:center; background:var(--panel); border:1px solid var(--brass-dk);
  border-radius:12px; padding:2rem 1rem; margin:2.4rem 0}

.ad-wrap{max-width:860px; margin:1.4rem auto; padding:0 1.2rem; text-align:center; min-height:90px}
.ad-label{display:block; font-size:.7rem; letter-spacing:2px; color:var(--dim); text-transform:uppercase; margin-bottom:.3rem}
.adsbygoogle{background:var(--panel2); border:1px dashed var(--brass-dk); border-radius:6px; min-height:90px}

footer{border-top:2px solid var(--brass-dk); margin-top:3rem; padding:1.4rem 1.2rem;
  text-align:center; color:var(--dim)}
.tiny{font-size:.8rem; margin-top:.3rem}

/* leaderboard + account */
table.lb{width:100%; border-collapse:collapse; background:var(--panel); border:1px solid var(--brass-dk); border-radius:10px; overflow:hidden}
table.lb th{ text-align:left; padding:.6rem .8rem; color:var(--brass); border-bottom:1px solid var(--brass-dk); font-size:.85rem; letter-spacing:1px}
table.lb td{ padding:.55rem .8rem; border-bottom:1px solid rgba(110,82,40,.3)}
table.lb td.num{ text-align:right; font-family:Consolas,monospace; color:var(--text)}
table.lb td.rank{ color:var(--brass); font-weight:bold; width:2rem}
table.lb tr:hover td{ background:rgba(198,156,87,.06)}
form input{ display:block; width:100%; margin:.5rem 0; padding:.6rem .7rem; background:var(--ink);
  border:1px solid var(--brass-dk); border-radius:6px; color:var(--text); font-size:1rem}
form .cta{ width:100%; margin-top:.6rem; cursor:pointer}
.statrow{ display:flex; gap:1rem; flex-wrap:wrap; margin:1rem 0}
.stat{ background:var(--panel); border:1px solid var(--brass-dk); border-radius:10px; padding:1rem 1.3rem; text-align:center; min-width:7rem}
.stat b{ display:block; font-size:1.5rem; color:var(--brass); font-family:Georgia,serif}
.stat span{ color:var(--dim); font-size:.85rem}
.badges{ display:flex; gap:.6rem; flex-wrap:wrap}
.badge{ background:var(--panel2); border:1px solid var(--brass-dk); border-radius:20px; padding:.4rem .9rem; color:var(--text)}
.linkbtn{ background:none; border:none; color:var(--dim); cursor:pointer; font-size:.9rem; text-decoration:underline}
.lbtoggle{ display:flex; gap:.5rem; justify-content:center; margin:.5rem 0 1rem}
.tab{ background:var(--panel); color:var(--dim); border:1px solid var(--brass-dk); border-radius:20px;
  padding:.4rem 1.1rem; cursor:pointer; font-size:.95rem}
.tab.active{ background:linear-gradient(180deg,#d8a95e,#9c6f33); color:var(--ink); border-color:var(--brass); font-weight:bold}
#msg.ok{ color:#4ec96a } #msg.err{ color:#e74856 } #msg{ min-height:1.2rem }
.notice{ background:rgba(214,176,78,.12); border:1px solid var(--brass-dk); border-radius:8px;
  padding:.7rem 1rem; margin:.8rem 0; color:var(--text)}
