:root{
  --bg:#0f1116;
  --panel:#161a22;
  --text:#f3f5f7;
  --muted:#aab0ba;
  --border:#2a3040;
  --primary:#2dc7ff;
  --radius:14px;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background:linear-gradient(180deg,#0f1116,#0b0d12);
  color:var(--text);
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  line-height:1.45;
}

.wrap{max-width:1100px;margin:0 auto;padding:0 16px}
.skip-link{position:absolute;left:-999px;top:auto}
.skip-link:focus{left:16px;top:16px;background:var(--panel);padding:10px 12px;border-radius:10px;z-index:50}

.site-header{
  position:sticky;top:0;z-index:20;
  background:rgba(22,26,34,.9);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
}
.header-row{display:flex;align-items:center;justify-content:space-between;min-height:58px;gap:12px}
.brand{display:flex;align-items:center;gap:10px;color:var(--text);text-decoration:none;font-weight:700}
.brand-dot{width:10px;height:10px;border-radius:999px;background:var(--primary);display:inline-block}

.nav-toggle{
  border:1px solid var(--border);
  background:transparent;
  color:var(--text);
  padding:10px 12px;
  border-radius:12px;
  font-weight:700;
}

.site-nav{
  width:100%;
  margin-top:10px;
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:10px 0 14px;
}
.site-nav a{
  color:var(--text);
  text-decoration:none;
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:12px;
  background:rgba(255,255,255,.02);
}
.site-nav a[aria-disabled="true"]{opacity:.6}

main{padding:18px 0 30px}
.card{
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:16px;
}

.site-footer{
  border-top:1px solid var(--border);
  padding:18px 0;
  color:var(--muted);
  text-align:center;
}

/* Desktop */
@media (min-width: 900px){
  .nav-toggle{display:none}
  .site-nav{
    width:auto;
    margin:0;
    padding:0;
    display:flex !important;
    flex-direction:row;
    align-items:center;
  }
  .site-nav a{padding:9px 12px}
}

.btn.neutral {
  background: rgba(255,255,255,0.06);
  border-color: rgba(255,255,255,0.12);
  color: rgba(255,255,255,0.92);
}
.btn.neutral:hover {
  background: rgba(255,255,255,0.09);
  border-color: rgba(255,255,255,0.18);
}