/* WARFRONT v4.97.3 — desktop Army Builder follow-up for approved Design 1.
   This does not alter unit data, saved armies, auth, or combat event handlers. */
@media(min-width:701px){
  html body #wf394[data-page="army"] .wf-shell{
    max-width:1320px!important;
    padding:16px clamp(12px,2vw,26px) 32px!important;
    gap:16px!important;
  }
  html body #wf394[data-page="army"] .wf-head{
    display:grid!important;
    grid-template-columns:minmax(180px,1fr) minmax(0,2fr)!important;
    grid-template-rows:auto auto!important;align-items:center!important;
    gap:4px 18px!important;padding:16px!important;
  }
  html body #wf394[data-page="army"] .wf489-headtitle{
    grid-column:1!important;grid-row:1!important;text-align:left!important;
    font-size:clamp(24px,2.6vw,36px)!important;
  }
  html body #wf394[data-page="army"] .wf489-subbrand{
    grid-column:1!important;grid-row:2!important;text-align:left!important;
    font-size:12px!important;
  }
  html body #wf394[data-page="army"] .wf489-quickbar{
    grid-column:2!important;grid-row:1 / span 2!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    align-self:center!important;
  }
  html body #wf394[data-page="army"] .wf-unitgrid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:15px!important;
  }
  html body #wf394[data-page="army"] .wf-unitinfo b{
    font-size:clamp(13px,1.4vw,18px)!important;
  }
  html body #wf394[data-page="army"] .wf-unitinfo small{font-size:12px!important}
  html body #wf394[data-page="army"] .wf-unit{
    grid-template-rows:minmax(125px,1fr) 53px!important;
    min-height:190px!important;
  }
  /* Legacy native builder (the older screen still used by some actions):
     keep its ORIGINAL header, buttons and player toolbar in normal flow. */
  html:has(body.ui-build){
    height:auto!important;max-height:none!important;
    overflow-x:hidden!important;overflow-y:auto!important;
  }
  html body.ui-build{
    position:relative!important;min-width:0!important;max-width:100vw!important;
    min-height:100dvh!important;height:auto!important;max-height:none!important;
    overflow-x:hidden!important;overflow-y:auto!important;
    background:linear-gradient(#180e29db,#100b1ef0),
      url('/wf487-citadel-background.webp') center top/cover no-repeat #120b20!important;
  }
  html body.ui-build #uiBuildNav{
    position:relative!important;inset:auto!important;transform:none!important;
    display:grid!important;grid-template-columns:110px minmax(0,1fr)!important;
    grid-template-rows:auto auto!important;align-items:center!important;
    width:100%!important;max-width:none!important;height:auto!important;
    min-height:0!important;max-height:none!important;gap:12px!important;
    margin:0 0 16px!important;padding:15px max(16px,calc((100vw - 1280px)/2))!important;
    background:linear-gradient(130deg,#2e1844ed,#171023ed)!important;
    border-bottom:2px solid #d9b479!important;color:#ffe2aa!important;
    box-sizing:border-box!important;
  }
  html body.ui-build #uiBuildNav #uiBackHome{
    grid-column:1!important;grid-row:1!important;position:relative!important;
    inset:auto!important;transform:none!important;display:flex!important;
    align-items:center!important;justify-content:center!important;
    width:100%!important;min-width:0!important;height:auto!important;
    min-height:50px!important;margin:0!important;padding:9px!important;
    border:1px solid #ddb16b!important;border-radius:10px!important;
    background:linear-gradient(#315b78,#17374f)!important;color:#ffe3ae!important;
  }
  html body.ui-build #uiBuildNav>strong{
    grid-column:2!important;grid-row:1!important;text-align:left!important;
    position:relative!important;inset:auto!important;
    font:700 clamp(23px,2.8vw,38px)/1.15 Georgia,serif!important;
    color:#ffe1a9!important;
  }
  html body.ui-build #uiBuildNav>.wf359-header-info{
    grid-column:1/-1!important;grid-row:2!important;
    position:relative!important;inset:auto!important;transform:none!important;
    display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;
    grid-template-areas:"faction gold save settings"!important;
    width:100%!important;max-width:100%!important;min-width:0!important;
    height:auto!important;gap:12px!important;margin:0!important;
  }
  html body.ui-build #uiBuildNav :is(.wf359-faction,.wf359-budget,
    .wf359-save-top,.wf4891-settings){
    position:relative!important;inset:auto!important;transform:none!important;
    display:flex!important;align-items:center!important;justify-content:center!important;
    width:100%!important;min-width:0!important;height:auto!important;
    min-height:48px!important;margin:0!important;padding:8px!important;
    border:1px solid #d5ac70!important;border-radius:10px!important;
    background:linear-gradient(130deg,#382047,#1b132d)!important;
    color:#ffe2b3!important;overflow-wrap:anywhere!important;
    text-align:center!important;
  }
  html body.ui-build #uiBuildNav .wf359-faction{grid-area:faction!important}
  html body.ui-build #uiBuildNav .wf359-budget{grid-area:gold!important}
  html body.ui-build #uiBuildNav .wf359-save-top{
    grid-area:save!important;background:linear-gradient(#8040a1,#3d215a)!important;
  }
  html body.ui-build #uiBuildNav .wf4891-settings{
    grid-area:settings!important;background:linear-gradient(#5d3674,#2a1940)!important;
  }
  html body.ui-build #uiBuildNav .wf4891-settings[hidden]{display:none!important}
  html body.ui-build #wf144SettingsOpen{
    display:none!important;pointer-events:none!important;
  }
  html body.ui-build #builder{
    position:relative!important;inset:auto!important;transform:none!important;
    width:min(1280px,calc(100vw - 28px))!important;max-width:1280px!important;
    min-width:0!important;height:auto!important;min-height:0!important;
    max-height:none!important;overflow:visible!important;
    margin:0 auto 16px!important;padding:0!important;
  }
  html body.ui-build #builder>.layout{
    grid-template-columns:minmax(0,1fr) minmax(250px,330px)!important;
    min-width:0!important;max-width:100%!important;gap:15px!important;
  }
  html body.ui-build #wf348Toolbar{
    display:flex!important;position:relative!important;inset:auto!important;
    transform:none!important;flex-wrap:wrap!important;align-items:center!important;
    justify-content:center!important;width:min(1280px,calc(100vw - 28px))!important;
    height:auto!important;max-width:1280px!important;min-height:0!important;
    max-height:none!important;gap:9px!important;
    margin:10px auto 25px!important;padding:10px!important;
    border:1px solid #d6ab73!important;border-radius:12px!important;
    background:linear-gradient(120deg,#30203f,#171025)!important;
  }
  html body.ui-build #wf348Toolbar[hidden]{display:none!important}
  html body.ui-build #wf348Toolbar :is(button,input,select){
    min-height:44px!important;max-width:100%!important;min-width:0!important;
  }
  html body.ui-build :is(#uiBuildNav,#builder,#wf348Toolbar) :is(button,input,select){
    box-sizing:border-box!important;touch-action:manipulation!important;
  }
  html body.ui-build #builder #fightBtn{
    position:relative!important;inset:auto!important;transform:none!important;
    min-height:50px!important;max-width:100%!important;
  }
}
@media(min-width:1100px) and (min-height:550px){
  html body #wf394[data-page="army"] .wf-unitgrid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}
@media(min-width:701px) and (max-width:980px){
  html body.ui-build #uiBuildNav>.wf359-header-info{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    grid-template-areas:"faction gold" "save settings"!important;
  }
  html body.ui-build #builder>.layout{grid-template-columns:minmax(0,1fr)!important}
}
