/* Mevcut altın çerçeve ve parşömen menüsü için küçük düzenlemeler. */
#screen-menu { padding-bottom: 76px; }
#screen-mapselect { padding-bottom: 76px; }
#screen-menu .menuActions { max-width: 560px; }
#screen-menu .menuActions .btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 43px; }
#screen-menu .menuActions .btn::before, #btnPlay::before { content: ""; display: inline-block; width: 22px; height: 22px; flex: 0 0 22px; background: center / contain no-repeat; filter: brightness(.38); }
#screen-menu #btnPlay { display: inline-flex; align-items: center; justify-content: center; gap: 10px; }
#btnPlay::before { background-image: url("../assets/ui/icons/play.svg"); }
#screen-menu #btnAchievements::before { background-image: url("../assets/ui/icons/medal_gold.svg"); }
#screen-menu #btnPerks::before { background-image: url("../assets/ui/icons/book.svg"); }
#screen-menu #btnHowto::before { background-image: url("../assets/ui/icons/help.svg"); }
#screen-menu #btnBoard::before { background-image: url("../assets/ui/icons/trophy.svg"); }
#screen-menu #btnCoop::before { background-image: url("../assets/ui/icons/shieldwall.svg"); }
#screen-menu .menuHelp { order: 1; }
#screen-menu .menuHelp .btn { flex: 0 1 250px; font-size: 13px; }
#btnOnline[hidden], #navAdmin[hidden] { display: none; }

/* Sabit araçlar menü ve siteyi izler; maçın kendi ayarları üst oyun çubuğundadır. */
#quickTools { position: fixed; right: max(16px, env(safe-area-inset-right)); bottom: max(14px, env(safe-area-inset-bottom)); z-index: 45; display: flex; gap: 5px; padding: 3px; border-width: 7px; box-shadow: 0 4px 18px #0008; }
#quickTools .quickTool { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; min-width: 44px; padding: 0; border-width: 6px; font-size: 12px; }
.quickTool .gi { width: 21px; height: 21px; }
.quickTool[aria-pressed="false"] { opacity: .82; }
.quickTool::after { content: attr(data-hint); position: absolute; right: -5px; bottom: calc(100% + 15px); width: max-content; max-width: 230px; padding: 7px 10px; border: 1px solid #95753c; border-radius: 3px; background: #201725; color: #edddbc; font: 12px/1.4 "Segoe UI", sans-serif; opacity: 0; visibility: hidden; pointer-events: none; }
.quickTool:hover::after, .quickTool:focus-visible::after { opacity: 1; visibility: visible; }
body.playing #quickTools, html.site #btnLang { display: none; }
html.site body { overflow: visible; } /* sticky navbarın gerçek sayfa kaydırıcısını izlemesi */
#siteNav .navLinks { display: flex; align-items: center; gap: 18px; }
#navUser .gi { width: 18px; height: 18px; }
#siteNav button:focus-visible, #siteNav a:focus-visible, #quickTools button:focus-visible, #screen-menu button:focus-visible, .creditDetails summary:focus-visible, #siteFooter a:focus-visible, #siteFooter button:focus-visible { outline: 2px solid #f0c040; outline-offset: 3px; }

/* Kaynaklar tek tıkla açılır; lisanslar ve sanatçı adları erişilebilir kalır. */
.creditDetails { color: #a4957e; font-size: 11px; line-height: 1.8; text-align: left; }
.creditDetails summary { width: fit-content; padding: 7px 0; cursor: pointer; font-size: 11px; }
.creditDetails summary:hover { color: #dfc48e; }
.creditDetails > div { max-width: 700px; margin-top: 6px; padding: 12px 14px; border: 1px solid #4b3b2d; background: #1b1420; border-radius: 3px; }
.creditDetails a { color: #c8b18d; text-underline-offset: 3px; }
.offlineCredits { width: min(700px, 100%); flex: 0 0 auto; margin: 10px auto 0; }
.offlineCredits summary { margin: 0 auto; }
html.site .offlineCredits { display: none; }
#siteFooter { margin-top: 44px; padding: 26px 0 58px; border-top: 1px solid #57422d; }
.footerDev { margin: 18px 0 6px; text-align: center; color: #dfc48e; font-family: var(--serif); font-size: 13px; letter-spacing: .12em; text-transform: uppercase; }
.footerMain { display: flex; justify-content: space-between; align-items: center; gap: 24px; }
.footerBrand { display: flex; align-items: center; gap: 12px; }
.footerBrand > .gi { width: 27px; height: 27px; opacity: .65; }
.footerBrand b { color: #cbb180; font: 700 18px var(--serif); }
.footerBrand p { color: #948670; font-size: 11px; margin-top: 6px; line-height: 1.5; }
.footerLinks { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.footerLinks a, .footerLinks button { color: #b1a086; text-decoration: none; background: none; border: 0; padding: 8px 0; font: 12px "Segoe UI", sans-serif; cursor: pointer; }
.footerLinks a:hover, .footerLinks button:hover { color: #efca7e; }
#siteFooter .creditDetails { margin-top: 18px; padding-top: 10px; border-top: 1px solid #392b23; }
@media (max-width: 900px) {
  html.site { --nav-h: 92px; }
  #siteNav .navInner { display: grid; grid-template-columns: 1fr auto auto; grid-template-rows: 48px 42px; column-gap: 10px; }
  #siteNav .navBrand { grid-column: 1; grid-row: 1; font-size: 17px; }
  #siteNav #navLang { grid-column: 2; grid-row: 1; }
  #siteNav #navUser { grid-column: 3; grid-row: 1; font-size: 12px; }
  #siteNav .navLinks { grid-column: 1 / -1; grid-row: 2; justify-content: space-between; gap: 12px; min-width: 0; }
  #siteNav .spacer { display: none; }
  #siteNav .navLink { font-size: 12px; }
}
@media (max-width: 640px) {
  #screen-menu .menuActions .btn { flex: 1 1 calc(50% - 5px); min-height: 48px; padding: 2px 1px; font-size: 12px; gap: 6px; }
  #screen-menu .menuHelp .btn { flex: 0 1 220px; }
  #screen-menu .menuActions .btn::before { width: 18px; height: 18px; flex-basis: 18px; }
  #siteNav .navInner { padding: 0 10px; column-gap: 7px; }
  #siteNav .navBrand { font-size: 14px; white-space: normal; }
  #siteNav .navBrand .gi { display: none; }
  #siteNav #navUser { font-size: 11px; padding: 2px 4px; gap: 4px; max-width: 160px; white-space: normal; }
  #siteNav #navUser .gi { width: 15px; height: 15px; }
  #siteNav .navLink { font-size: 10.5px; }
  #siteNav .navLinks { gap: 8px; }
  #quickTools { right: max(10px, env(safe-area-inset-right)); bottom: max(10px, env(safe-area-inset-bottom)); }
  .footerMain { flex-direction: column; align-items: flex-start; gap: 14px; }
  .footerLinks { gap: 22px; }
}
@media (hover: none) { .quickTool:hover:not(:focus-visible)::after { visibility: hidden; } }
