:root {
  --bg:#0B1220; --panel:#111827; --line:#1F2937; --text:#E5E7EB; --muted:#9CA3AF;
  --accent:#3B82F6; --accent2:#60A5FA; --ok:#10B981; --radius:14px;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, sans-serif;
}
*{box-sizing:border-box} body{margin:0;background:radial-gradient(1200px 500px at 10% -10%,#172554 0%,transparent 55%),var(--bg);color:var(--text);line-height:1.55}
a{color:var(--accent2);text-decoration:none} a:hover{text-decoration:underline}
.wrap{width:min(1100px,100% - 2rem);margin:0 auto}
.top{position:sticky;top:0;backdrop-filter:blur(12px);background:rgba(11,18,32,.85);border-bottom:1px solid var(--line);z-index:10}
.nav{display:flex;align-items:center;justify-content:space-between;padding:0.9rem 0;gap:1rem}
.brand{display:flex;align-items:center;gap:.6rem;font-weight:700;color:#fff}
.logo{width:28px;height:28px;border-radius:8px;background:linear-gradient(135deg,#2563EB,#60A5FA)}
nav{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}
nav a{color:var(--muted);font-weight:600;font-size:.95rem}
.btn{display:inline-flex;align-items:center;border-radius:999px;padding:.65rem 1.1rem;font-weight:700;border:1px solid var(--line);color:#fff}
.btn.primary{background:var(--accent);border-color:transparent}
.btn.ghost{background:transparent}
.hero{padding:3.5rem 0 2rem}
.eyebrow{color:var(--accent2);font-weight:700;letter-spacing:.04em;text-transform:uppercase;font-size:.78rem}
.hero h1{font-size:clamp(2rem,4vw,3rem);letter-spacing:-.03em;margin:.4rem 0 1rem;line-height:1.15}
.lead{color:var(--muted);max-width:60ch;font-size:1.1rem}
.actions{display:flex;gap:.8rem;flex-wrap:wrap;margin:1.4rem 0}
.code{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:1rem 1.1rem;overflow:auto;color:#CBD5E1}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;padding:1rem 0 2rem}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:1.2rem}
.card h3{margin:.2rem 0 .5rem}
.card p{margin:0;color:var(--muted)}
.ep{width:100%;border-collapse:collapse;margin:1rem 0 2.5rem;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.ep th,.ep td{padding:.85rem 1rem;border-bottom:1px solid var(--line);text-align:left}
.ep th{color:var(--muted);font-size:.85rem}
.m{font-size:.72rem;font-weight:800;padding:.2rem .45rem;border-radius:6px}
.m.get{background:#064E3B;color:#6EE7B7}
.m.post{background:#1E3A8A;color:#93C5FD}
.foot{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:1.5rem 0 2.5rem;border-top:1px solid var(--line);color:var(--muted);font-size:.9rem}
@media(max-width:900px){.grid3{grid-template-columns:1fr}}

.banner.concept{
  background:linear-gradient(90deg,#1e3a8a,#312e81);
  color:#E0E7FF;
  border:1px solid #3730a3;
  border-radius:12px;
  padding:.9rem 1.1rem;
  margin:1rem 0 0;
  font-size:.95rem;
  line-height:1.45;
}
.banner.concept strong{color:#fff}
.hero .muted-note{color:var(--muted);font-size:.95rem;margin-top:.8rem}
