:root {
  --bg:#191B1F; --panel:#212326; --text:#E6E7E9; --muted:#A5ABB3;
  --accent:#E2A93B; --btn-bg:#2A2D32; --btn-border:#3A3F45; --btn-hover:#34393F; --focus:#6AE2FF;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
.container{max-width:940px;margin:0 auto;padding:28px 20px 56px}
.header{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.logo{width:28px;height:28px}
.title{font-weight:750;letter-spacing:.02em;font-size:28px}
.hero{background:var(--panel);border:1px solid var(--btn-border);border-radius:12px;padding:20px;line-height:1.55}
.hero p{margin:0 0 10px;color:var(--muted)}
.hero p.lead{color:var(--text);font-size:17px}
.section-title{margin:26px 0 8px;font-size:20px;font-weight:700}
.section-sub{margin:0 0 18px;color:var(--muted);font-size:14px}
.list{display:grid;gap:10px}

/* 3-column grid: index | text | button (right) */
.card{
  display:grid;
  grid-template-columns:36px 1fr auto;
  align-items:center; gap:16px;
  padding:14px; background:var(--panel);
  border:1px solid var(--btn-border); border-radius:10px;
}
.idx{color:var(--muted);font-variant-numeric:tabular-nums}
.card h3{margin:0;font-size:16px;letter-spacing:.01em}
.card p{margin:2px 0 0;color:var(--muted);font-size:13px}
.action{display:block}

/* Button */
.btn{
  display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:10px;
  background:var(--btn-bg);border:1px solid var(--btn-border);color:var(--text);
  text-decoration:none;font-weight:600;white-space:nowrap
}
.btn:hover{background:var(--btn-hover)}
.btn:focus{outline:2px solid var(--focus);outline-offset:2px}

.badge{display:inline-block;padding:2px 8px;border-radius:999px;background:rgba(226,169,59,.15);color:var(--accent);font-size:12px;margin-left:6px}
.footer{margin-top:26px;color:var(--muted);font-size:12px;border-top:1px solid var(--btn-border);padding-top:16px}

/* Mobile: button drops under text */
@media (max-width:640px){
  .card{grid-template-columns:28px 1fr;grid-auto-rows:auto}
  .action{margin-top:10px}
}