#game-nav{position:fixed;top:0;left:0;right:0;z-index:1000;height:var(--nav-h);
  display:flex;align-items:center;gap:6px;padding:0 12px;
  background:rgba(18,64,39,.96);border-bottom:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(8px);}
.nav-brand{display:flex;align-items:center;gap:6px;text-decoration:none;color:#fff;
  font-family:'Righteous','Inter',sans-serif;font-size:15px;font-weight:700;flex-shrink:0;margin-right:4px;}
.nav-brand span{display:inline;}
.nav-controls{display:flex;gap:4px;flex-shrink:0;}
.nav-links{display:none;align-items:center;gap:2px;margin-left:auto;}
.nav-link-ohjeet,.nav-link-strategia{display:none !important;}
@media(min-width:760px){.nav-links{display:flex;}}
.nav-link{color:rgba(255,255,255,.85);text-decoration:none;font-size:13px;font-weight:500;
  padding:6px 10px;border-radius:20px;transition:background .15s;white-space:nowrap;
  background:none;border:none;cursor:pointer;font-family:'Righteous','Inter',sans-serif;}
.nav-link:hover{background:rgba(255,255,255,.12);color:#fff;}
.nav-right{display:flex;align-items:center;gap:4px;margin-left:auto;}
@media(min-width:760px){.nav-right{margin-left:6px;}}
.nav-btn{display:flex;align-items:center;gap:5px;background:rgba(0,0,0,.28);
  border:1px solid rgba(255,255,255,.16);color:rgba(255,255,255,.85);
  padding:6px 13px;border-radius:22px;font-size:13px;font-weight:500;cursor:pointer;
  font-family:'Righteous','Inter',sans-serif;transition:background .15s,transform .1s,opacity .2s,box-shadow .15s;white-space:nowrap;}
.nav-btn:hover{background:rgba(0,0,0,.42);}
.nav-btn:active{transform:scale(.95);}
.nav-btn:disabled{opacity:.35;cursor:default;transform:none;}
.nav-btn-primary{background:linear-gradient(135deg,rgba(240,192,64,.2),rgba(240,192,64,.1));
  border-color:rgba(240,192,64,.4);color:#f0c040;
  box-shadow:0 2px 8px rgba(240,192,64,.15);}
.nav-btn-primary:hover{background:linear-gradient(135deg,rgba(240,192,64,.3),rgba(240,192,64,.15));
  box-shadow:0 4px 16px rgba(240,192,64,.25);}
.nav-btn-icon{padding:6px 9px;transition:color .15s,transform .15s;}
.nav-btn-icon:hover{color:#f0c040;transform:scale(1.1);}
#hamburger-btn{display:flex;}
@media(min-width:760px){#hamburger-btn{display:none;}}
.nav-dropdown{position:relative;}
.nav-dropdown-menu{position:absolute;right:0;top:calc(100% + 6px);
  background:rgba(18,64,39,.98);border:1px solid rgba(255,255,255,.18);
  border-radius:10px;padding:6px;min-width:190px;box-shadow:0 8px 24px rgba(0,0,0,.5);z-index:100;}
.nav-dropdown-menu[hidden]{display:none;}
.nav-dropdown-item{display:block;padding:8px 12px;border-radius:6px;
  color:rgba(255,255,255,.85);text-decoration:none;font-size:13px;transition:background .15s;white-space:nowrap;}
.nav-dropdown-item:hover{background:rgba(255,255,255,.12);}
.nav-dropdown-item.active{color:#f0c040;font-weight:600;}
.nav-mobile-menu{position:fixed;top:var(--nav-h);left:0;right:0;
  background:rgba(18,64,39,.98);border-bottom:1px solid rgba(255,255,255,.15);
  padding:8px;z-index:999;display:flex;flex-direction:column;gap:2px;}
.nav-mobile-menu[hidden]{display:none;}
.nav-mobile-link{display:block;padding:10px 16px;border-radius:8px;
  color:rgba(255,255,255,.9);text-decoration:none;font-size:14px;transition:background .15s;}
.nav-mobile-link:hover{background:rgba(255,255,255,.1);}
.nav-mobile-link.active{color:#f0c040;font-weight:600;}
.nav-mobile-divider{padding:8px 16px 4px;font-size:11px;text-transform:uppercase;
  letter-spacing:.1em;color:rgba(255,255,255,.4);}

/* === NAV MOBIILI === */
@media(max-width:600px){
  #game-nav{height:40px;padding:0 6px;}
  .nav-controls{gap:3px;}
  .nav-desktop-only{display:none !important;}
  .nav-brand{font-size:13px;}
}
@media(max-width:420px){
  .nav-brand{font-size:12px;margin-right:2px;}
}
@media(min-width:601px){
  #mobile-bottom-bar{display:none !important;}
}

/* === MOBIILI ALAPALKKI === */
#mobile-bottom-bar{
  display:none;
  position:fixed;bottom:0;left:0;right:0;z-index:1000;
  height:48px;
  background:rgba(18,64,39,.97);
  border-top:1px solid rgba(255,255,255,.15);
  padding:0 6px;
  gap:4px;
  align-items:center;justify-content:center;
  -webkit-font-smoothing:antialiased;
  /* Jos napit eivät mahdu (pyramidissa/spiderissä on Taso-nappi lisää),
     salli vaakascroll kosketuksella. */
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
#mobile-bottom-bar::-webkit-scrollbar{display:none;}
@media(max-width:600px){
  #mobile-bottom-bar{display:flex;}
  body{padding-bottom:52px;} /* tee tilaa alapalkille */
}
.mbb-btn{
  display:flex;align-items:center;gap:3px;
  background:rgba(0,0,0,.3);
  border:1px solid rgba(255,255,255,.15);
  color:rgba(255,255,255,.85);
  padding:7px 10px;border-radius:20px;
  font-size:12px;font-weight:600;
  font-family:'Inter',sans-serif;
  cursor:pointer;white-space:nowrap;
  text-decoration:none;
  transition:background .15s;
  flex-shrink:0;
}
.mbb-btn:active{transform:scale(.95);}
.mbb-btn:disabled{opacity:.35;}
.mbb-primary{
  background:rgba(240,192,64,.15);
  border-color:rgba(240,192,64,.35);
  color:#f0c040;
}
.mbb-daily{
  background:rgba(239,83,80,.12);
  border-color:rgba(239,83,80,.3);
  color:#ef5350;
  font-size:11px;
}
/* Erittäin kapeilla näytöillä tiivistetään lisää */
@media(max-width:400px){
  #mobile-bottom-bar{gap:3px;padding:0 4px;}
  .mbb-btn{padding:6px 8px;font-size:11px;gap:2px;}
  .mbb-daily{font-size:10px;}
}