
/* Reconstructed fallback stylesheet based on the supplied HTML structure.
   This is not the original production CSS. */
:root { --brand-red:#b50918; --brand-red-dark:#76020c; --brand-gold:#e8a900; --page-bg:#f4f4f4; --text:#242424; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--text); background:var(--page-bg); font-family:Arial,Helvetica,sans-serif; font-size:14px; }
img { max-width:100%; }
a { color:inherit; text-decoration:none; }
button,input { font:inherit; }
.container { width:min(1180px, calc(100% - 28px)); margin-inline:auto; }
.row { display:flex; flex-wrap:wrap; align-items:center; }
.topbar-container { background:#eee; min-height:42px; border-bottom:1px solid #ddd; }
.topbar-left-container,.topbar-left-section,.topbar-right-container,.login-panel { display:flex; align-items:center; gap:10px; }
.topbar-left-section { min-height:42px; }
.topbar-item { display:flex; align-items:center; padding:6px; }
.topbar-item i { display:inline-block; width:22px; height:22px; background-position:center; background-repeat:no-repeat; background-size:contain; }
.topbar-container .row { justify-content:space-between; }
.login-panel-item a { display:inline-block; padding:8px 22px; border-radius:22px; color:#fff; background:#333; text-transform:uppercase; font-weight:bold; }
.login-panel-item .register-button { background:linear-gradient(#f8bd31,#b87800); color:#241900; }
.site-header { background:var(--brand-red); color:#fff; box-shadow:0 2px 5px #0003; }
.site-header > .container > .row { min-height:105px; gap:20px; }
.site-header .col-sm-3 { flex:0 0 230px; }
.site-header .col-sm-9 { flex:1; min-width:0; }
.logo { display:block; min-height:76px; background-position:center; background-size:contain; background-repeat:no-repeat; }
.logo img { max-height:75px; width:auto; object-fit:contain; }
.menu-slide { overflow:visible; }
.top-menu { list-style:none; display:flex; align-items:stretch; justify-content:flex-end; gap:4px; padding:0; margin:0; }
.top-menu > li { position:relative; }
.top-menu > li > a { min-width:64px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; padding:12px 8px; color:#fff; font-size:12px; text-transform:uppercase; }
.top-menu > li > a img { width:28px; height:28px; object-fit:contain; }
.top-menu > li:hover > a,.top-menu > li[data-active="true"] > a { background:#83000a; }
.game-list { display:none; position:absolute; z-index:30; top:100%; left:0; min-width:190px; max-height:65vh; overflow:auto; padding:8px; margin:0; background:#fff; box-shadow:0 5px 16px #0004; list-style:none; }
.top-menu > li:hover .game-list,.top-menu > li.open .game-list { display:block; }
.game-list li a { display:block; min-height:36px; padding:8px; border-bottom:1px solid #eee; color:#333; }
.game-list li a:hover { background:#f6e5e5; }
.home-banner,.banner-container { margin:12px auto; }
.home-banner img,.banner-container img { display:block; width:100%; height:auto; }
.home-content { width:min(1180px,calc(100% - 28px)); margin:18px auto; }
.game-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; }
.game-card { overflow:hidden; border-radius:8px; background:#fff; box-shadow:0 2px 8px #0001; }
.game-card img { display:block; width:100%; aspect-ratio:1.25; object-fit:cover; }
.game-card .caption { padding:8px; font-weight:bold; }
.modal { display:none; position:fixed; inset:0; z-index:1000; overflow:auto; padding:24px 12px; background:#0008; }
.modal.show,.modal.open { display:block; }
.modal-dialog { width:min(580px,100%); margin:20px auto; }
.modal-content { position:relative; background:#fff; border-radius:8px; box-shadow:0 10px 40px #0005; }
.modal-header,.modal-body { padding:18px 22px; }
.modal-header { border-bottom:1px solid #eee; }
.modal-title { margin:0; font-size:20px; }
.btn-close { float:right; border:0; background:transparent; font-size:25px; cursor:pointer; }
.popup-loader-container { padding:20px; text-align:center; }
.loader-spinner { width:28px; height:28px; margin:auto; border:3px solid #ddd; border-top-color:var(--brand-red); border-radius:50%; animation:spin .8s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
footer { padding:24px 12px; background:#222; color:#eee; text-align:center; }
@media(max-width:900px) {
  .site-header > .container > .row { padding:12px 0; }
  .site-header .col-sm-3,.site-header .col-sm-9 { flex:1 1 100%; }
  .logo { min-height:60px; text-align:center; }
  .logo img { max-height:60px; }
  .top-menu { justify-content:flex-start; overflow-x:auto; }
  .top-menu > li > a { min-width:65px; }
  .game-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media(max-width:560px) {
  .topbar-container .row { align-items:flex-start; gap:4px; padding:5px 0; }
  .topbar-left-section { gap:2px; }
  .topbar-item { padding:4px; }
  .login-panel-item a { padding:7px 12px; font-size:11px; }
  .site-header > .container > .row { gap:8px; }
  .top-menu > li > a { min-width:58px; padding:8px 5px; font-size:10px; }
  .top-menu > li > a img { width:24px; height:24px; }
  .game-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
