:root{
  --bg:#0d1117;            /* dark page background (homepage) */
  --fg:#f5f6f7;            /* main text */
  --muted:#9ba1a6;         /* secondary text */
  --card:#161b22;          /* card background */
  --primary:#00aaff;       /* bright cyan/blue button like homepage */
  --primary-contrast:#ffffff;
  --shadow:0 8px 24px rgba(0,0,0,.5);
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
a{color:inherit}
.btn{display:inline-block;padding:10px 14px;border-radius:10px;background:var(--primary);color:var(--primary-contrast);text-decoration:none}
.btn:hover{opacity:.95}
.card{background:var(--card);border-radius:14px;box-shadow:var(--shadow)}
.muted{color:var(--muted)}

/* Header + cart badge */
header.l3d{background:transparent; position: sticky; top:0; z-index: 10;}
.head{max-width:1100px;margin:0 auto;padding:16px 24px; display:flex; align-items:center; justify-content:space-between}
.brand{font-weight:700; text-decoration:none}
.nav a{margin-left:16px; text-decoration:none}
.badge{min-width:20px; height:20px; border-radius:999px; padding:0 6px; font-size:12px; align-items:center; justify-content:center; background:var(--primary); color:var(--primary-contrast); display:inline-flex}