/* ── HAMBURGER - visible dark button ─── */
.hamburger-btn {
  background: #0F172A !important;
  border: none !important;
  border-radius: 10px !important;
  width: 40px !important;
  height: 40px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
  padding: 9px !important;
}
.hamburger-btn span {
  display: block !important;
  width: 20px !important;
  height: 2.5px !important;
  background: #fff !important;
  border-radius: 2px !important;
}

/* ── BANNER ──────────────────────────── */
.banner-wrap { padding:14px 16px 0; }
.banner-slider { position:relative;border-radius:20px;overflow:hidden;box-shadow:0 8px 24px rgba(15,23,42,.1); }
.banner-track { display:flex;transition:transform .45s cubic-bezier(.4,0,.2,1); }
.banner-slide { min-width:100%;flex-shrink:0;min-height:200px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:32px 24px;position:relative;overflow:hidden; }
.banner-slide-bg { position:absolute;inset:0;width:100%;height:100%;object-fit:cover; }
.banner-slide-overlay { position:absolute;inset:0;background:rgba(0,0,0,.3);z-index:1; }
.banner-slide-content { position:relative;z-index:2;display:flex;flex-direction:column;align-items:center; }
.banner-emoji { font-size:46px;margin-bottom:10px;display:block; }
.banner-title { font-size:22px;font-weight:900;color:#fff;margin-bottom:6px; }
.banner-sub   { font-size:13px;color:rgba(255,255,255,.9);margin-bottom:16px; }
.banner-btn   { background:rgba(255,255,255,.95);color:#1D4ED8;font-weight:800;font-size:13px;padding:10px 26px;border-radius:24px;text-decoration:none;display:inline-block; }
.banner-dots  { display:flex;justify-content:center;gap:6px;padding:12px 0 2px; }
.banner-dot   { width:6px;height:6px;border-radius:50%;background:#CBD5E1;cursor:pointer;transition:all .3s; }
.banner-dot.active { background:#2563EB;width:20px;border-radius:4px; }

/* ── GAME GRID ───────────────────────── */
.game-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:0 16px 8px; }
.game-card { background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 1px 3px rgba(15,23,42,.07);cursor:pointer;text-decoration:none; }
.game-card-img { height:96px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden; }
.game-card-badge { position:absolute;top:6px;left:6px;font-size:8px;font-weight:800;padding:2px 7px;border-radius:6px;color:#fff;text-transform:uppercase;background:rgba(0,0,0,.4); }
.game-card-body { padding:9px 8px 11px;text-align:center; }
.game-card-title { font-size:12px;font-weight:800;color:#1E293B;margin-bottom:6px;line-height:1.2;min-height:28px;display:flex;align-items:center;justify-content:center; }
.game-card-btn { background:#EFF6FF;color:#2563EB;font-size:10px;font-weight:800;padding:6px 4px;border-radius:18px; }

/* ── SIDE MENU ───────────────────────── */
.menu-overlay { position:fixed;inset:0;background:rgba(15,23,42,.45);backdrop-filter:blur(2px);z-index:400;opacity:0;pointer-events:none;transition:opacity .3s; }
.menu-overlay.open { opacity:1;pointer-events:all; }
.side-menu { position:fixed;top:0;left:0;bottom:0;width:290px;background:#fff;z-index:500;transform:translateX(-100%);transition:transform .3s cubic-bezier(.4,0,.2,1);overflow-y:auto;box-shadow:8px 0 30px rgba(0,0,0,.15); }
.side-menu.open { transform:translateX(0); }