/* La Contessa Arcade — professional dark system */
:root {
  --lca-bg: #09070d;
  --lca-surface: #121018;
  --lca-surface-raised: #18141f;
  --lca-border: rgba(255,255,255,.09);
  --lca-text: #f6f3fa;
  --lca-muted: #9d96a8;
  --lca-purple: #8b5cf6;
  --lca-magenta: #d946ef;
  --lca-pink: #ec4899;
}
html, body, #page-top, .site-content { background: var(--lca-bg)!important; color: var(--lca-text)!important; }
body { font-family: Montserrat, Arial, sans-serif; }
.site-container { width:100%!important; max-width:none!important; padding:0!important; }
.site-content { min-height:100vh; }
a { color:inherit; text-decoration:none; }
a:hover { color:inherit; text-decoration:none; }

/* Header */
#mainNav {
  min-height:76px;
  padding:10px 0;
  background:rgba(9,7,13,.96)!important;
  border-bottom:1px solid var(--lca-border);
  box-shadow:0 8px 28px rgba(0,0,0,.22);
  position:sticky;
  top:0;
  z-index:1030;
  backdrop-filter:blur(16px);
}
#mainNav .container { max-width:1600px; padding:0 36px; gap:24px; }
.navbar-brand { margin:0; flex:0 0 auto; }
.site-logo {
  width:54px!important;
  height:54px!important;
  max-height:none!important;
  object-fit:contain;
  border-radius:50%;
  filter:drop-shadow(0 0 9px rgba(217,70,239,.34));
}
#navb { flex:1; display:flex!important; align-items:center; gap:18px; }
.header-search { position:relative; flex:1 1 520px; max-width:760px; margin-left:14px; }
.header-search > i { position:absolute; left:17px; top:50%; transform:translateY(-50%); color:var(--lca-muted); z-index:2; }
.header-search input.form-control {
  width:100%;
  height:48px;
  padding:0 18px 0 44px;
  border-radius:10px!important;
  background:#15111c!important;
  border:1px solid rgba(255,255,255,.11)!important;
  color:var(--lca-text)!important;
  font-size:.94rem;
}
.header-search input.form-control:focus {
  border-color:rgba(139,92,246,.8)!important;
  box-shadow:0 0 0 3px rgba(139,92,246,.14)!important;
}
.header-search input::placeholder { color:#7f7889!important; }
.header-actions { margin-left:auto; display:flex; align-items:center; gap:5px; }
.header-action {
  height:46px;
  min-width:58px;
  padding:6px 9px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  border-radius:9px;
  color:var(--lca-muted)!important;
  font-size:.64rem;
  border:1px solid transparent;
}
.header-action i { font-size:1rem; margin-bottom:4px; }
.header-action:hover { color:var(--lca-text)!important; background:#17131e; border-color:var(--lca-border); }
.header-action.surprise { color:#c4b5fd!important; }

/* Category navigation */
.nav-categories {
  min-height:46px;
  background:#0d0a12!important;
  border-bottom:1px solid var(--lca-border);
  position:sticky;
  top:76px;
  z-index:1020;
}
.nav-categories .container { max-width:1600px; padding:0 36px; }
.lca-category-nav { display:flex; align-items:center; gap:4px; min-height:46px; overflow-x:auto; }
.lca-category-nav a {
  flex:0 0 auto;
  padding:14px 15px 12px;
  color:#a9a2b2!important;
  font-size:.84rem;
  font-weight:600;
  border-bottom:2px solid transparent;
}
.lca-category-nav a:hover { color:#fff!important; border-bottom-color:var(--lca-purple); }

/* Homepage structure */
.lca-home { max-width:1600px!important; padding:38px 40px 64px!important; }
.lca-block { margin:0 0 54px; }
.lca-section-head { display:flex; align-items:end; justify-content:space-between; gap:24px; margin:0 0 18px; }
.lca-section-head h1,.lca-section-head h2 { color:var(--lca-text); margin:2px 0 0; font-weight:700; letter-spacing:-.025em; }
.lca-section-head h1 { font-size:1.85rem; }
.lca-section-head h2 { font-size:1.45rem; }
.lca-section-head > p { margin:0 0 2px; color:var(--lca-muted); font-size:.9rem; }
.lca-kicker { display:block; color:#a78bfa; font-size:.65rem; font-weight:700; letter-spacing:.14em; }
.lca-view-link { color:#b4acbd!important; font-size:.82rem; }
.lca-view-link:hover { color:#fff!important; }
.featured-grid {
  padding:14px;
  border-radius:14px;
  background:var(--lca-surface);
  border:1px solid var(--lca-border);
}
.grid-item { margin-bottom:14px; }
.list-game {
  position:relative;
  overflow:hidden;
  border-radius:10px!important;
  border:1px solid var(--lca-border)!important;
  background:var(--lca-surface-raised);
  box-shadow:0 8px 20px rgba(0,0,0,.16)!important;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.list-game:hover {
  transform:translateY(-2px);
  border-color:rgba(139,92,246,.58)!important;
  box-shadow:0 12px 26px rgba(0,0,0,.28)!important;
}
.list-thumbnail { overflow:hidden; background:#17131e; }
.small-thumb { width:100%; height:100%; object-fit:cover; transition:transform .24s ease; }
.list-game:hover .small-thumb { transform:scale(1.025); }
.list-title {
  color:#fff!important;
  font-size:.82rem;
  font-weight:600;
  background:linear-gradient(transparent,rgba(5,4,8,.88))!important;
}
.star-rating { display:none!important; }
.item-title {
  display:inline-flex;
  align-items:center;
  padding:10px 14px!important;
  border-radius:9px!important;
  background:var(--lca-surface-raised)!important;
  color:var(--lca-text)!important;
  border:1px solid var(--lca-border);
  font-size:1.05rem!important;
  box-shadow:none!important;
}
.item-title i { color:var(--lca-purple); }

/* Category cards */
.lca-categories { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:14px; }
.lca-categories a {
  min-height:112px;
  padding:18px;
  display:flex;
  flex-direction:column;
  justify-content:end;
  border-radius:11px;
  background:linear-gradient(145deg,#18131f,#21152b);
  border:1px solid var(--lca-border);
  transition:transform .18s ease,border-color .18s ease,background .18s ease;
}
.lca-categories a:nth-child(2n) { background:linear-gradient(145deg,#15121f,#1b1730); }
.lca-categories a:hover { transform:translateY(-2px); border-color:rgba(217,70,239,.48); background:#201527; }
.lca-categories span { color:#fff; font-size:1rem; font-weight:700; }
.lca-categories small { color:var(--lca-muted); margin-top:5px; font-size:.75rem; }
.lca-editorial {
  margin:12px 0 24px;
  padding:28px 30px;
  border-radius:12px;
  background:var(--lca-surface);
  border:1px solid var(--lca-border);
}
.lca-editorial h2 { color:#fff; margin:0 0 9px; font-size:1.25rem; }
.lca-editorial p { color:var(--lca-muted); max-width:980px; margin:0; line-height:1.75; font-size:.9rem; }

/* Supporting pages and footer */
.footer,.copyright { background:#0d0a12!important; color:var(--lca-muted)!important; border-top:1px solid var(--lca-border); }
.footer a,.copyright a { color:#c2bbc9!important; }
.btn-primary,.btn-load-more-games,.btn-search {
  background:var(--lca-purple)!important;
  border-color:var(--lca-purple)!important;
  color:#fff!important;
  border-radius:9px!important;
}
.btn-primary:hover,.btn-load-more-games:hover,.btn-search:hover { background:#7c3aed!important; border-color:#7c3aed!important; }

/* Responsive */
@media (max-width:1199px) {
  .header-action span { display:none; }
  .header-action { min-width:42px; }
  .lca-categories { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:991px) {
  #mainNav { min-height:68px; }
  #mainNav .container,.nav-categories .container { padding-left:18px; padding-right:18px; }
  #navb { padding:14px 0; flex-direction:column; align-items:stretch; }
  .header-search { margin:0; max-width:none; flex-basis:auto; }
  .header-actions { margin:0; justify-content:space-between; }
  .header-action { flex:1; }
  .header-action span { display:block; }
  .nav-categories { top:68px; }
  .lca-home { padding:28px 20px 52px!important; }
}
@media (max-width:575px) {
  .lca-home { padding:24px 12px 44px!important; }
  .lca-block { margin-bottom:42px; }
  .lca-section-head { align-items:start; flex-direction:column; gap:6px; }
  .lca-categories { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .lca-categories a { min-height:96px; }
}

/* Footer */
.lca-footer { padding:48px 0 38px; }
.lca-footer .container,.lca-copyright { max-width:1600px; padding-left:40px; padding-right:40px; }
.lca-footer-grid { display:grid; grid-template-columns:2fr repeat(3,1fr); gap:46px; }
.lca-footer-brand img { width:50px; height:50px; object-fit:contain; border-radius:50%; margin-bottom:14px; filter:drop-shadow(0 0 8px rgba(217,70,239,.25)); }
.lca-footer h3 { color:#fff; font-size:1rem; margin:0 0 8px; }
.lca-footer h4 { color:#fff; font-size:.76rem; text-transform:uppercase; letter-spacing:.11em; margin:0 0 14px; }
.lca-footer p { color:var(--lca-muted); max-width:280px; font-size:.82rem; line-height:1.65; }
.lca-footer a { display:block; margin:0 0 9px; color:#9d96a8!important; font-size:.82rem; }
.lca-footer a:hover { color:#fff!important; }
.copyright { padding:18px 0!important; }
.lca-copyright { display:flex; justify-content:space-between; align-items:center; font-size:.75rem; }
@media (max-width:767px) {
  .lca-footer-grid { grid-template-columns:1fr 1fr; gap:30px; }
  .lca-footer-brand { grid-column:1/-1; }
  .lca-footer .container,.lca-copyright { padding-left:20px; padding-right:20px; }
}

/* Expanded brand header */
#mainNav { min-height:92px; padding:10px 0; }
#mainNav .container { max-width:none; padding-left:26px; padding-right:30px; }
.lca-brand { display:flex; align-items:center; gap:14px; min-width:255px; }
.lca-brand .site-logo { width:72px!important; height:72px!important; }
.lca-wordmark { display:flex; flex-direction:column; line-height:1; }
.lca-wordmark strong { color:#fff; font-size:1.12rem; font-weight:700; letter-spacing:-.02em; }
.lca-wordmark small { color:#bd8cff; margin-top:7px; font-size:.66rem; font-weight:700; letter-spacing:.24em; text-transform:uppercase; }
.lca-kicker { font-size:.76rem; letter-spacing:.15em; margin-bottom:3px; }

/* Custom neon navigation rail */
.nav-categories {
  position:fixed!important;
  top:92px!important;
  left:0;
  bottom:0;
  width:252px;
  min-height:0!important;
  background:#0b0810!important;
  border-right:1px solid rgba(255,255,255,.08);
  border-bottom:0;
  overflow:hidden;
  z-index:1020;
}
.nav-categories .container { width:100%; max-width:none; height:100%; padding:0!important; }
.lca-side-menu { width:100%; height:100%; }
.side-menu-inner { height:100%; overflow-y:auto; padding:24px 14px 28px; scrollbar-width:thin; scrollbar-color:#2b2136 transparent; }
.side-menu-brandline { padding:0 10px 20px; color:#fff; font-size:.98rem; font-weight:700; }
.side-menu-group { padding:0 0 18px; margin:0 0 18px; border-bottom:1px solid rgba(255,255,255,.07); }
.side-menu-group:last-child { border-bottom:0; }
.side-menu-label { display:block; padding:0 10px 8px; color:#716a7a; font-size:.62rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
.side-menu-group a {
  min-height:44px;
  margin:2px 0;
  padding:7px 9px;
  display:flex;
  align-items:center;
  gap:11px;
  border-radius:9px;
  color:#a9a2b2!important;
  font-size:.82rem;
  font-weight:600;
  border:1px solid transparent;
  transition:background .16s ease,color .16s ease,border-color .16s ease;
}
.side-menu-group a:hover,.side-menu-group a.active {
  color:#fff!important;
  background:linear-gradient(90deg,rgba(139,92,246,.15),rgba(217,70,239,.06));
  border-color:rgba(194,82,255,.18);
}
.brand-icon {
  width:28px;
  height:28px;
  flex:0 0 28px;
  display:grid;
  place-items:center;
  border-radius:8px;
  color:#cf72ff;
  background:rgba(142,58,201,.10);
  box-shadow:inset 0 0 0 1px rgba(217,70,239,.15),0 0 9px rgba(168,85,247,.08);
}
.brand-icon svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.65; stroke-linecap:round; stroke-linejoin:round; filter:drop-shadow(0 0 3px rgba(217,70,239,.42)); }
.side-menu-group a:nth-of-type(3n+2) .brand-icon { color:#a78bfa; }
.side-menu-group a:nth-of-type(3n) .brand-icon { color:#f472b6; }

/* Content alignment with navigation rail */
.site-content > .container { width:calc(100% - 252px)!important; max-width:1600px!important; margin-left:252px!important; margin-right:0!important; }
.lca-home { padding-left:38px!important; padding-right:38px!important; }
.footer,.copyright { margin-left:252px; }

/* Controlled logo-color card glow */
.list-game {
  box-shadow:0 8px 20px rgba(0,0,0,.18),0 0 11px rgba(180,64,255,.18)!important;
  border-color:rgba(209,106,255,.18)!important;
}
.list-game:hover {
  border-color:rgba(236,72,153,.56)!important;
  box-shadow:0 13px 28px rgba(0,0,0,.28),0 0 20px rgba(203,69,255,.32)!important;
}

/* Compact rail for medium screens */
@media (max-width:1199px) and (min-width:768px) {
  .lca-brand { min-width:210px; }
  .lca-wordmark strong { font-size:1rem; }
  .nav-categories { width:84px; }
  .side-menu-inner { padding-left:10px; padding-right:10px; }
  .side-menu-brandline,.side-menu-label,.side-menu-group a > span:last-child { display:none; }
  .side-menu-group a { justify-content:center; padding:7px; }
  .brand-icon { width:34px; height:34px; flex-basis:34px; }
  .site-content > .container { width:calc(100% - 84px)!important; margin-left:84px!important; }
  .footer,.copyright { margin-left:84px; }
}
/* Mobile horizontal icon navigation */
@media (max-width:767px) {
  #mainNav { min-height:76px; }
  .lca-brand { min-width:auto; }
  .lca-brand .site-logo { width:56px!important; height:56px!important; }
  .lca-wordmark strong { font-size:.9rem; }
  .lca-wordmark small { font-size:.55rem; }
  .nav-categories { top:76px!important; right:0; bottom:auto; width:100%; height:72px; border-right:0; border-bottom:1px solid rgba(255,255,255,.08); overflow-x:auto; }
  .side-menu-inner { display:flex; align-items:stretch; height:72px; padding:7px 10px; overflow-x:auto; overflow-y:hidden; }
  .side-menu-brandline,.side-menu-label { display:none; }
  .side-menu-group { display:contents; border:0; margin:0; padding:0; }
  .side-menu-group a { min-width:70px; margin:0 2px; padding:4px 7px; flex-direction:column; justify-content:center; gap:4px; font-size:.61rem; }
  .brand-icon { width:27px; height:27px; flex-basis:27px; }
  .brand-icon svg { width:15px; height:15px; }
  .site-content > .container { width:100%!important; max-width:100%!important; margin-left:0!important; padding-top:72px!important; }
  .footer,.copyright { margin-left:0; }
}


/* Expand the compact category rail on hover or keyboard focus */
@media (max-width:1199px) and (min-width:768px) {
  .nav-categories {
    z-index:1060;
    transition:width .22s cubic-bezier(.22,.61,.36,1), box-shadow .22s ease, border-color .22s ease;
  }
  .nav-categories:hover,
  .nav-categories:focus-within {
    width:252px;
    border-right-color:rgba(217,70,239,.22);
    box-shadow:18px 0 46px rgba(0,0,0,.44),8px 0 24px rgba(154,45,255,.10);
  }
  .nav-categories:hover .side-menu-inner,
  .nav-categories:focus-within .side-menu-inner {
    padding-left:14px;
    padding-right:14px;
  }
  .nav-categories:hover .side-menu-brandline,
  .nav-categories:focus-within .side-menu-brandline,
  .nav-categories:hover .side-menu-label,
  .nav-categories:focus-within .side-menu-label {
    display:block;
  }
  .nav-categories:hover .side-menu-group a > span:last-child,
  .nav-categories:focus-within .side-menu-group a > span:last-child {
    display:inline;
  }
  .nav-categories:hover .side-menu-group a,
  .nav-categories:focus-within .side-menu-group a {
    justify-content:flex-start;
    padding:7px 9px;
  }
  .nav-categories:hover .brand-icon,
  .nav-categories:focus-within .brand-icon {
    width:28px;
    height:28px;
    flex-basis:28px;
  }
}