/* Yompster Developer Site Styles */
:root { --bg:#0b1220; --text:#e5e7eb; --muted:#9ca3af; --accent:#6b4eff; --border:#1f2937; }
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial}
.header{position:sticky;top:0;backdrop-filter:saturate(180%) blur(6px);background:rgba(11,18,32,0.75);padding:.75rem 1rem;border-bottom:1px solid rgba(255,255,255,.08)}
.header .inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;gap:1rem}
.logo{display:inline-flex;align-items:center;gap:.5rem;color:inherit;text-decoration:none;font-weight:700}
.logo .mark{width:28px;height:28px;border-radius:6px;background:linear-gradient(135deg,#6b4eff,#22c1c3)}
.nav{margin-left:auto;display:flex;gap:.75rem;flex-wrap:wrap}
.nav a{color:var(--text);text-decoration:none;padding:.35rem .6rem;border:1px solid var(--border);border-radius:8px}
.nav a:hover{background:#0e1627}
.container{max-width:1200px;margin:0 auto;padding:1rem}
.hero{padding:2rem 1rem;border:1px solid var(--border);border-radius:12px;background:#0e1627}
.hero h1{margin:.25rem 0;font-size:1.8rem}
.lead{color:var(--muted)}
.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem;margin-top:1rem}
.card{border:1px solid var(--border);border-radius:12px;padding:1rem;background:#0e1627}
.footer{border-top:1px solid rgba(255,255,255,.08);padding:2rem 1rem;color:#9ca3af;margin-top:2rem}
.link{color:#93c5fd}
pre{overflow:auto}