:root{--bg:#0e0f14;--panel:#141a26;--panel2:#11151f;--bar:#151822;--text:#fff;--muted:#aeb4c4;--accent:#4f7cff}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:system-ui,Segoe UI,Arial}
header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;background:var(--bar);position:sticky;top:0;z-index:3}
.brand{font-weight:700;letter-spacing:.5px}
.nav a{color:var(--muted);text-decoration:none;margin-left:14px}
.nav a.btn{background:var(--accent);color:#fff;padding:8px 12px;border-radius:8px}
.wrap{max-width:1080px;margin:0 auto;padding:20px}
.card{background:var(--panel);border-radius:12px;padding:16px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.case{background:var(--panel);border-radius:12px;padding:14px;display:flex;flex-direction:column}
.case img{width:100%;height:180px;object-fit:cover;border-radius:10px;margin-bottom:10px;background:#0c0f16}
.btn{background:var(--accent);border:0;border-radius:10px;color:#fff;padding:12px;font-weight:600;cursor:pointer}
.feed{display:flex;gap:12px;overflow:auto;padding:12px;background:var(--panel2);border-radius:10px}
.drop{min-width:210px;background:#1a2030;border-radius:10px;padding:10px}
.drop img{width:100%;height:110px;object-fit:cover;border-radius:8px}
.muted{opacity:.8}
footer{opacity:.6;text-align:center;padding:30px 0}
.avatar{width:28px;height:28px;border-radius:50%;vertical-align:middle;margin-right:6px}

/* --- Auth buttons --- */
.btn { display:inline-flex; align-items:center; gap:.5rem; padding:.6rem 1rem; border-radius:10px; border:1px solid rgba(255,255,255,.08); text-decoration:none; font-weight:600; transition:.15s ease; }
.btn:hover { transform: translateY(-1px); }

.btn-ghost { background: transparent; }
.btn-ghost:hover { background: rgba(255,255,255,.06); }

.btn-steam {
  background: linear-gradient(180deg,#2b2f36,#1e232a);
  border: 1px solid #39404a;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 6px 16px rgba(0,0,0,.2);
}
.btn-steam:hover { filter: brightness(1.05); }

/* аватар */
.avatar { width:24px; height:24px; border-radius:50%; vertical-align:middle; margin-right:.5rem; }

/* лёгкий полиш хедера */
.site-top { position:sticky; top:0; backdrop-filter: blur(8px); background: rgba(10,12,14,.6); border-bottom:1px solid rgba(255,255,255,.06); z-index:10; }
.wrap.nav { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.8rem 1rem; }
.logo { font-weight:800; text-transform:uppercase; letter-spacing:.06em; }
.menu a { margin-right:1rem; }
.auth { display:flex; align-items:center; gap:.6rem; }

/* --- auth button colors --- */
.btn-green  { background:#16a34a; }  /* зелёная — вход через Steam */
.btn-purple { background:#7c3aed; }  /* фиолетовая — Мой профиль */

/* auth button colors */
.btn-green  { background:#16a34a; }  /* зелёная — войти */
.btn-purple { background:#7c3aed; }  /* фиолетовая — мой профиль */

/* === FIX: горизонтальная навигация в хедере === */
header .site-top{
  display:flex !important;
  align-items:center !important;
  gap:16px !important;
  padding:10px 14px !important;
}
header .site-top .brand{
  display:inline-flex !important;
  font-weight:800 !important;
  letter-spacing:.5px !important;
  text-decoration:none !important;
  color:#fff !important;
}
header .site-top .nav{
  display:flex !important;
  align-items:center !important;
  gap:18px !important;
  margin-left:12px !important;
}
header .site-top .nav a{
  display:inline-flex !important;
  text-decoration:none !important;
  white-space:nowrap !important;
}
header .site-top .right{
  margin-left:auto !important;
  display:flex !important;
  align-items:center !important;
}
header .site-top .btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:8px 14px !important;
  border-radius:10px !important;
  white-space:nowrap !important;
}

/* цвета для кнопок (на всякий) */
header .site-top .btn.btn-green  { background:#16a34a !important; }
header .site-top .btn.btn-purple { background:#7c3aed !important; }
