/* SkillCraft desktop shell repair — headers + footers only.
   Loaded last so legacy page-specific brand overrides cannot distort desktop. */
@media (min-width:761px){
  html,body{max-width:100%;overflow-x:hidden}

  /* ---------- Header shells ---------- */
  .top,.topbar,.site-header,.sc-bs-ref-header{
    width:100%!important;
    max-width:100vw!important;
    box-sizing:border-box!important;
  }
  .top>.shell.top-inner,
  .topbar>.shell.nav,
  .site-header>.wrap.nav,
  .sc-bs-ref-header__inner{
    width:min(1180px,calc(100% - 48px))!important;
    max-width:1180px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:20px!important;
    min-width:0!important;
    box-sizing:border-box!important;
  }
  .top>.shell.top-inner,.topbar>.shell.nav{min-height:72px!important}
  .site-header>.wrap.nav{min-height:78px!important}
  .sc-bs-ref-header__inner{min-height:58px!important}

  .top .brand.sc-brand-link,
  .topbar .brand.sc-brand-link,
  .site-header .brand.sc-brand-link,
  .sc-bs-ref-header .sc-bs-ref-brand.sc-brand-link{
    display:flex!important;
    align-items:center!important;
    flex:0 1 auto!important;
    min-width:0!important;
    width:auto!important;
    margin:0!important;
    padding:0!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
  }
  .top .sc-brand-lockup-header,
  .topbar .sc-brand-lockup-header,
  .site-header .sc-brand-lockup-header,
  .sc-bs-ref-header .sc-brand-lockup-header{
    display:block!important;
    width:auto!important;
    height:40px!important;
    max-height:40px!important;
    max-width:235px!important;
    aspect-ratio:auto!important;
    object-fit:contain!important;
    object-position:left center!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    filter:none!important;
  }
  .top .top-actions,.topbar .nav-actions,.site-header .nav-actions,.sc-bs-ref-actions{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:9px!important;
    margin-left:auto!important;
    min-width:0!important;
    flex:0 0 auto!important;
  }
  .topbar .nav-actions{flex-wrap:nowrap!important}
  .topbar .sc-track-switch,.site-header .nav-links{min-width:0!important}

  /* Hub header should remain slim and symmetrical. */
  #appView>.top{padding:0!important;min-height:78px!important}
  #appView>.top>.shell{min-height:78px!important}
  #appView>.top .brand img{width:auto!important;height:40px!important;max-width:235px!important}
  #appView>.top .brand .hub-label,
  #appView>.top .sc-brand-context{
    min-height:30px!important;
    margin:0!important;
    padding:0 0 0 16px!important;
    border:0!important;
    border-left:1px solid rgba(255,255,255,.13)!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    color:#ff6b35!important;
    font-size:12px!important;
    letter-spacing:.18em!important;
  }

  /* Login/intro branding: never render the wordmark inside a square tile. */
  #loginView .login-card .brand{
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:18px!important;
    width:100%!important;
  }
  #loginView .login-card .brand img{
    display:block!important;
    width:auto!important;
    height:50px!important;
    max-width:280px!important;
    max-height:50px!important;
    aspect-ratio:auto!important;
    object-fit:contain!important;
    object-position:left center!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }

  /* ---------- Shared private footers ---------- */
  .hub-footer[data-skillcraft-footer],
  main>.hub-footer,
  .footer-private{
    clear:both!important;
    width:100%!important;
    max-width:none!important;
    box-sizing:border-box!important;
  }
  .hub-footer .sc-footer-shell{width:min(1180px,calc(100% - 48px))!important;max-width:1180px!important;margin:0 auto!important}
  .hub-footer-card{padding:34px 42px 0!important}
  .hub-footer-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1.35fr) minmax(180px,.72fr) minmax(220px,.9fr)!important;
    align-items:start!important;
    gap:52px!important;
    width:100%!important;
  }
  .hub-footer-brand{grid-column:auto!important;min-width:0!important}
  .hub-footer-logo,
  .hub-footer-logo.sc-brand-footer-row{
    display:flex!important;
    align-items:center!important;
    gap:16px!important;
    margin:0 0 20px!important;
  }
  .hub-footer-logo .sc-brand-lockup-footer,
  .hub-footer .sc-brand-lockup-footer{
    display:block!important;
    width:auto!important;
    height:54px!important;
    max-height:54px!important;
    max-width:300px!important;
    object-fit:contain!important;
    object-position:left center!important;
  }
  .hub-footer-description{max-width:520px!important}
  .hub-footer-bottom{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:18px!important}

  /* Hub's native footer (keeps translation hooks but restores correct grid). */
  #appView .hub-footer{
    margin:38px 0 18px!important;
    padding:0!important;
    overflow:hidden!important;
    border:1px solid rgba(255,255,255,.09)!important;
    border-radius:28px!important;
    background:linear-gradient(145deg,rgba(17,17,17,.98),rgba(5,5,5,.99))!important;
  }
  #appView .hub-footer .footer-main{
    display:grid!important;
    grid-template-columns:minmax(0,1.35fr) minmax(180px,.72fr) minmax(220px,.9fr)!important;
    gap:52px!important;
    align-items:start!important;
    padding:34px 42px!important;
    width:100%!important;
    box-sizing:border-box!important;
  }
  #appView .hub-footer .footer-main>*{min-width:0!important}
  #appView .hub-footer .footer-brand-row{
    display:flex!important;
    align-items:center!important;
    margin:0 0 20px!important;
  }
  #appView .hub-footer .footer-brand-row img{
    display:block!important;
    width:auto!important;
    height:54px!important;
    max-height:54px!important;
    max-width:300px!important;
    object-fit:contain!important;
  }
  #appView .hub-footer .footer-brand p{max-width:500px!important;margin:0!important;color:#a7a7a7!important;font-size:15px!important;line-height:1.6!important}
  #appView .hub-footer .footer-col{display:block!important;min-width:0!important}
  #appView .hub-footer .footer-col h4{margin:4px 0 18px!important}
  #appView .hub-footer .footer-list{display:grid!important;gap:12px!important;margin:0!important;padding:0!important;list-style:none!important}
  #appView .hub-footer .footer-list a,
  #appView .hub-footer .footer-list button{display:inline-block!important;width:auto!important;max-width:100%!important;font-size:15px!important;line-height:1.35!important}
  #appView .hub-footer .footer-bottom{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:18px!important;
    width:100%!important;
    padding:18px 42px!important;
    box-sizing:border-box!important;
  }

  /* Engine block private footer. */
  .footer-private{margin-top:48px!important;padding:32px 36px 22px!important}
  .footer-private-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1.35fr) minmax(180px,.72fr) minmax(220px,.9fr)!important;
    gap:48px!important;
    align-items:start!important;
    width:100%!important;
  }
  .footer-private-grid>*{min-width:0!important}
  .footer-private-brand,
  .footer-private-brand.sc-brand-footer-row{display:flex!important;align-items:center!important;gap:16px!important;margin:0 0 20px!important}
  .footer-private-brand .sc-brand-lockup-footer{width:auto!important;height:52px!important;max-height:52px!important;max-width:290px!important}
  .footer-private-bottom{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:18px!important}

  /* Landing/footer brand should not inherit square-icon sizing. */
  footer .footer-brand{display:block!important}
  footer .footer-brand .sc-brand-lockup-footer{width:auto!important;height:54px!important;max-height:54px!important;max-width:300px!important}

  /* Compact utility footer used on Drops & Rewards. */
  main>.footer{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:20px!important;width:100%!important}
}

/* Keep the same visual rules graceful on tablet/mobile without touching layout. */
@media (max-width:760px){
  #appView .hub-footer .footer-main{display:grid!important;grid-template-columns:1fr!important;gap:24px!important}
  #appView .hub-footer .footer-brand-row img{display:block!important;width:auto!important;height:46px!important;max-width:235px!important}
  #appView .hub-footer .footer-bottom{display:grid!important;gap:6px!important}
}