/* Shared frame for the market, account, supporters and legal pages. */
.site-app-shell,.market-app-shell { grid-template-columns: 205px minmax(0,1fr); }
.site-sidebar,.app-sidebar { width:205px; }
.site-navigation,.app-navigation { display:grid; align-content:start; flex:1 1 auto; min-height:0; overflow-x:hidden; overflow-y:auto; scrollbar-width:thin; scrollbar-color:#2d6962 transparent; }
.site-navigation a,.app-navigation a,.app-navigation button { min-height:48px; font-size:14px; font-style:normal; text-shadow:none; transform:none; }
.player-market-redesign .app-navigation span { display:block; }
.player-market-redesign .app-navigation a,.player-market-redesign .app-navigation button { grid-template-columns:46px minmax(0,1fr) auto; justify-items:stretch; padding:0 16px 0 20px; }
.player-market-redesign .app-navigation b { position:static; }
.site-navigation .nav-child,.app-navigation .nav-child { padding-left:30px; }
.player-market-redesign .app-navigation :is(a,button).nav-child,
body.player-market-redesign .app-navigation :is(a,button).nav-child {
  min-height: 43px; padding-left: 51px; padding-right: 7px;
  grid-template-columns: 25px minmax(0,1fr) auto; background: #0b2729;
}
.player-market-redesign .app-navigation .nav-child svg { width: 18px; height: 18px; }
.player-market-redesign .app-navigation .nav-child span { font-size: 13px; }
.site-navigation .nav-parent span::after,
.app-navigation .nav-parent span::after { content: " ▾"; color: #84b5a8; font-size: 11px; }
.site-sidebar-community,.sidebar-community { flex:0 0 140px; min-height:140px; margin-top:0; }
.player-market-redesign .sidebar-community { display:flex; }
.site-brand,.app-brand { min-height:84px; flex:0 0 84px; }
.site-brand img,.app-brand > img { width:188px; height:68px; object-fit:contain; object-position:center; }
.site-hero,.market-hero { min-height:106px; padding:14px 25px 14px 34px; }
.site-hero-heading,.market-hero-heading { gap:16px; }
.site-hero-title-row h1,.hero-title-row h1 { font-size:clamp(28px,2.4vw,38px); }
.site-footer,body.player-market-redesign .site-footer {
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;
  gap:14px 22px; width:min(1390px,calc(100% - 28px)); margin:20px auto 0;
  padding:18px 0 28px; border-top:1px solid #17504d; color:#9db2ae;
}
body.player-market-redesign.market-authenticated .site-footer { display:flex; }
.site-footer > b { color:#f4f8f4; white-space:nowrap; }
.site-footer > span { flex:1 1 190px; text-align:center; }
.site-footer .legal-links { display:flex; flex-wrap:wrap; gap:10px 16px; }
.site-footer a { color:#59dc48; text-decoration:none; }
.site-footer a:hover { text-decoration:underline; }
.site-footer .display-settings { display:flex; flex-wrap:wrap; align-items:center; gap:8px; width:100%; justify-content:flex-end; }
.site-menu-toggle { display:none; place-items:center; flex:0 0 39px; width:39px; height:39px; border:0; border-radius:7px; background:rgba(7,49,51,.82); color:#e7f2ee; cursor:pointer; }
.site-menu-toggle svg { width:21px; height:21px; }
.site-sidebar-overlay { display:none; }
body.site-guest .site-navigation > :not([data-public-market]):not([data-public-supporters]) { display:none; }
body.site-guest .site-sidebar-community { flex:1 1 auto; }

@media (max-width:900px) {
  .site-app-shell,.market-app-shell { display:block; }
  .site-sidebar,body.player-market-redesign .app-sidebar {
    position:fixed; top:0; left:-235px; z-index:80; display:flex; flex-direction:column;
    width:220px; height:100dvh; overflow:hidden; border-right:1px solid #164649;
    border-bottom:0; transition:left .2s ease;
  }
  body.site-sidebar-open .site-sidebar,body.site-sidebar-open.player-market-redesign .app-sidebar { left:0; }
  .site-navigation,body.player-market-redesign .app-navigation { display:grid; flex:1 1 auto; min-height:0; padding:0; overflow-x:hidden; overflow-y:auto; }
  body.player-market-redesign .app-navigation button,body.player-market-redesign .app-navigation a {
    display:grid; grid-template-columns:46px minmax(0,1fr) auto; justify-items:stretch;
    width:100%; min-height:48px; padding:0 16px 0 20px; border-radius:0;
  }
  body.player-market-redesign .app-navigation span { display:block; }
  body.player-market-redesign .app-navigation b { position:static; }
  body.player-market-redesign .app-brand { display:flex; justify-content:flex-start; padding:6px 7px 6px 10px; }
  body.player-market-redesign .app-brand > img { width:188px; height:68px; object-fit:contain; }
  body.player-market-redesign .sidebar-community { display:flex; }
  .site-sidebar-overlay,body.player-market-redesign .site-sidebar-overlay { position:fixed; inset:0; z-index:79; display:block; border:0; background:rgba(0,10,12,.7); opacity:0; visibility:hidden; transition:opacity .2s ease,visibility .2s ease; }
  body.site-sidebar-open .site-sidebar-overlay { opacity:1; visibility:visible; }
  .site-menu-toggle,body.player-market-redesign .site-menu-toggle { display:grid; }
  .site-hero,.market-hero { padding:16px; }
  .site-hero-heading,.market-hero-heading { gap:13px; }
}

@media (max-width:620px) {
  .site-hero,.market-hero { align-items:flex-start; flex-direction:column; gap:12px; min-height:120px; }
  .site-hero-heading,.market-hero-heading { width:100%; }
  .site-hero-actions,.hero-actions { width:100%; justify-content:flex-start; }
  .site-hero-title-row h1,.hero-title-row h1 { font-size:28px; }
  .site-footer,body.player-market-redesign .site-footer { width:calc(100% - 24px); justify-content:flex-start; }
  .site-footer > span { flex-basis:100%; text-align:left; }
  .site-footer .display-settings { justify-content:flex-start; }
  body.player-market-redesign .market-hero #logoutButton { display:flex; }
}
