/* This file used to @import eleven other stylesheets, which hid the real load
   order behind a file named "header logo" and forced the browser into a second
   round trip to discover them. They are now plain <link> tags in index.html,
   placed immediately before this sheet so the cascade order is unchanged.
   Do not reintroduce @import here. */

/* Header branding only. Uses the latest transparent artwork supplied for CSGuessr.
   Keeps the existing home-button behavior and responsive sizing intact. */
.topbar .brand.brand-button{
  width:180px;
  height:58px;
  flex:none;
  overflow:hidden;
  background-color:transparent!important;
  background-image:url('/csguessr-header-logo-transparent.png?v=3905-user-logo')!important;
  background-position:center!important;
  background-size:contain!important;
  background-repeat:no-repeat!important;
  border:0;
  border-radius:0;
  padding:0;
  font-size:0;
  box-shadow:none!important;
}
.topbar .brand.brand-button > *{display:none!important}
@media(max-width:1000px){
  .topbar .brand.brand-button{width:160px;height:54px}
}
@media(max-width:680px){
  .topbar .brand.brand-button{width:132px;height:50px}
}
@media(max-width:430px){
  .topbar .brand.brand-button{width:112px;height:46px}
}

/* Final-state Leaderboard icon guarantee. These selectors intentionally beat
   older active/hover background shorthands that could erase the icon. */
.side-menu nav>button>.v33-nav-icon[data-v33-icon="leaderboard"],
.side-menu nav>button.active>.v33-nav-icon[data-v33-icon="leaderboard"],
.side-menu nav>button:hover>.v33-nav-icon[data-v33-icon="leaderboard"],
.page-home .home-tools>button>.v33-nav-icon[data-v33-icon="leaderboard"]{
  background-color:#101820!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='%23f6c945' d='M13 25 20 12l12 9 12-9 7 13-5 13H18z'/%3E%3Cpath fill='none' stroke='%23fff1ae' stroke-width='3' stroke-linejoin='round' d='M13 25 20 12l12 9 12-9 7 13-5 13H18z'/%3E%3Cpath fill='%23d8e5eb' d='M17 44h9v12h-9zM28 39h9v17h-9zM39 47h9v9h-9z'/%3E%3Cpath fill='%23f6c945' d='M12 57h40v3H12z'/%3E%3C/svg%3E")!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:80% 80%!important;
  filter:none!important;
  opacity:1!important;
}
.side-menu nav>button>.v33-nav-icon[data-v33-icon="leaderboard"]>*,
.page-home .home-tools>button>.v33-nav-icon[data-v33-icon="leaderboard"]>*{display:none!important;visibility:hidden!important}

/* First-visit starter choice previews the full scene before entering. */
.v33-intro-screen[data-v337-starter="theme-void"],
.v337-starter-gate[data-v337-starter="theme-void"]{
  background-image:linear-gradient(145deg,#03040bd9,#080a18df),url('/v33-theme-scenes/void.svg')!important;
  background-size:cover!important;background-position:center!important;
}
.v33-intro-screen[data-v337-starter="theme-chrome"],
.v337-starter-gate[data-v337-starter="theme-chrome"]{
  background-image:linear-gradient(145deg,#070b0ed2,#10171cde),url('/v33-theme-scenes/chrome.svg')!important;
  background-size:cover!important;background-position:center!important;
}
.v33-intro-screen[data-v337-starter="theme-lan-night"],
.v337-starter-gate[data-v337-starter="theme-lan-night"]{
  background-image:linear-gradient(145deg,#02070bd8,#07151dde),url('/v33-theme-scenes/lan-night.svg')!important;
  background-size:cover!important;background-position:center!important;
}
