/* NOVAIS energy loader. Import after the action styles. No application data or JS required. */
.login-card .nf-loading-message::after{width:100%;height:8px}
.nf-energy {
  --energy-blue: #0b587c;
  --energy-amber: #e9ad24;
  position: relative;
  display: block;
  flex: none;
  width: 220px;
  max-width: 100%;
  height: 8px;
  overflow: hidden;
  border: 1px solid #191d20;
  border-radius: 999px;
  background: linear-gradient(90deg, #093b51, var(--energy-blue));
  box-shadow: inset 0 1px 2px #0003;
}
.nf-energy.large { width: 420px; height: 10px; }
.nf-energy.small { width: 200px; height: 6px; }
.nf-energy > span {
  position: absolute;
  inset: 0 auto 0 0;
  display: block;
  width: 38%;
  border-radius: inherit;
  background: linear-gradient(90deg, #e9ad2400, var(--energy-amber) 30%, #ffe9a7 57%, #fff8dc 65%, var(--energy-amber) 77%, #e9ad2400);
  box-shadow: 0 0 12px #e9ad2450;
  transform: translateX(-115%);
  animation: nf-energy-travel 1.75s linear infinite;
}
.nf-energy[hidden] { display: none; }
button[aria-busy="true"] { position: relative; overflow: hidden; cursor: wait; }
button[aria-busy="true"]::before { content: none; display: none; animation: none; }
button[aria-busy="true"]::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 3px;
  border-radius: 0 0 5px 5px;
  pointer-events: none;
  background-color: #0b587c;
  background-image: linear-gradient(90deg, #e9ad2400 25%, #e9ad24 43%, #fff6ce 50%, #e9ad24 57%, #e9ad2400 75%);
  background-size: 260% 100%;
  background-repeat: no-repeat;
  animation: nf-energy-button 1.75s linear infinite;
}
@keyframes nf-energy-travel {
  from { transform: translateX(-115%); }
  to { transform: translateX(365%); }
}
@keyframes nf-energy-button {
  from { background-position: 100% 0; }
  to { background-position: 0% 0; }
}
.reduce-motion .nf-energy > span,
.nf-energy.reduce-motion > span {
  animation: none;
  transform: translateX(85%);
  box-shadow: none;
}
.reduce-motion button[aria-busy="true"]::after,
button.reduce-motion[aria-busy="true"]::after {
  animation: none;
  background-position: 50% 0;
  background-size: 100% 100%;
}
@media (prefers-reduced-motion: reduce) {
  .nf-energy > span { animation: none; transform: translateX(85%); box-shadow: none; }
  button[aria-busy="true"]::after { animation: none; background-position: 50% 0; background-size: 100% 100%; }
}

.nf-network-loading{position:fixed;top:0;left:0;right:0;z-index:2147483000;pointer-events:none}.nf-network-loading[hidden]{display:none}.nf-network-loading .nf-energy{width:100%;max-width:none;height:5px;border:0;border-radius:0}.nf-loading-message::after{content:'';display:block;width:200px;max-width:100%;height:6px;margin-top:10px;border:1px solid #191d20;border-radius:999px;background:#0b587c linear-gradient(90deg,transparent 25%,#e9ad24 43%,#fff6ce 50%,#e9ad24 57%,transparent 75%) no-repeat;background-size:260% 100%;animation:nf-energy-button 1.75s linear infinite}@media(prefers-reduced-motion:reduce){.nf-loading-message::after{animation:none;background-position:50% 0}}

/* The module panel owns its loading animation; do not draw the generic ones too. */
.module-loading-title.nf-loading-message::after{content:none}
body:has(.module-loading)>.nf-network-loading{display:none}

/* The login message owns the only visible progress bar until the app shell mounts. */
body:has(#app > .login-layout) > .nf-network-loading{display:none!important}
body:has(#app > .login-layout) > .cloud-bar{display:none}
body:has(#app > .dock-wrap) > .cloud-bar{display:none}
#app:has(> .login-layout) .login-header-mark{display:none}
#app .login-layout button[aria-busy="true"]::after{display:none!important}

/* Single authenticated header. Keep the original session controls in the DOM for their security handlers. */
body.nf-header-ready > .cloud-bar{display:none}
body.nf-header-ready > .nf-network-loading{display:none!important}
#app > .topbar.nf-merged-topbar{
  position:sticky;top:0;z-index:60;
  box-sizing:border-box;display:grid;grid-template-columns:clamp(206px,13.5vw,256px) minmax(0,1fr) minmax(220px,265px) minmax(0,1fr) clamp(206px,13.5vw,256px);
  min-height:69px;height:auto;padding:2px 16px;gap:16px;align-items:center;
  background:#e8decc;color:#263139;border:2px solid #17212b;
}
.nf-header-left{grid-column:1/3;min-width:0;display:block}
.nf-merged-topbar .brand{min-width:0;width:100%;display:grid;grid-template-columns:clamp(206px,13.5vw,256px) minmax(0,1fr);grid-template-rows:auto auto;align-items:center;column-gap:16px;row-gap:2px;color:#263139;text-align:left}
.nf-merged-topbar .brand img{display:block;grid-column:1;grid-row:1/3;justify-self:center;width:153px;height:auto;max-height:58px;object-fit:contain}
.nf-merged-topbar .brand span:not(.nf-header-identity){display:block;grid-column:2;grid-row:1;color:#263139;font-size:11px;font-weight:700;letter-spacing:.12em;line-height:1.3;white-space:nowrap}
.nf-merged-topbar .brand .nf-header-identity{display:block;grid-column:2;grid-row:2;color:#58666d;font-size:10px;font-weight:400;letter-spacing:0;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:270px}
.nf-header-progress{grid-column:3;justify-self:center;align-self:center;width:100%;max-width:265px;text-align:center}
.nf-header-status{display:block;min-height:18px;color:#263139;font-size:12px;font-weight:700;line-height:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nf-header-status.nf-loading-message::after{content:none;display:none}
.nf-header-status::before{content:'';display:inline-block;width:7px;height:7px;margin-right:6px;vertical-align:1px;border-radius:50%;background:#80d69d;box-shadow:0 0 0 3px #80d69d22}
.nf-header-track{position:relative;display:block;height:12px;margin-top:4px;overflow:hidden;border:2px solid #17212b;border-radius:20px;background:#acd5b6}
.nf-header-track i{position:absolute;inset:0 auto 0 0;display:block;width:28%;border-radius:inherit;background:linear-gradient(90deg,transparent,#72b98c 45%,#c5e9ce 55%,transparent);animation:nf-header-idle 3.6s linear infinite}
.nf-header-track b{position:absolute;inset:0;display:block;border-radius:inherit;overflow:hidden;background:#0b587c;opacity:0;transition:opacity 1.2s ease-in-out;pointer-events:none}
.nf-header-track b::before{content:"";position:absolute;inset:0 auto 0 0;width:38%;border-radius:inherit;background:linear-gradient(90deg,transparent,#e9ad24 30%,#fff8dc 60%,#e9ad24 78%,transparent);animation:nf-energy-travel 1.75s linear infinite}
.nf-header-progress[data-mode="loading"] .nf-header-track b{opacity:1;transition-duration:.7s}
@starting-style{.nf-header-progress[data-mode="loading"] .nf-header-track b{opacity:0}}
.nf-header-track::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(90deg,#179b50,#38cc72 55%,#24b75f);opacity:0;transition:opacity 1.2s ease-out;pointer-events:none}
.nf-header-progress[data-mode="success"] .nf-header-track::after{opacity:1;transition-duration:1.2s;transition-timing-function:ease-in-out}
.nf-header-progress[data-mode="loading"] .nf-header-track::after{opacity:0;transition-duration:.7s}
@media(prefers-reduced-motion:reduce){.nf-header-track::after,.nf-header-track b{transition:none!important}.nf-header-track b::before{animation:none!important;width:100%}}
@keyframes nf-header-idle{from{transform:translateX(-110%)}to{transform:translateX(460%)}}
.nf-merged-topbar .topright{grid-column:4/6;min-width:0;display:grid;grid-template-columns:minmax(0,1fr) clamp(206px,13.5vw,256px);align-items:center;column-gap:16px}
.nf-header-actions{grid-column:1;display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:3px 6px;min-width:0}
.nf-merged-topbar .topright .person{display:block;color:#263139;font-weight:400;line-height:1.3;white-space:nowrap}
.nf-merged-topbar .topright .person strong{font-weight:700}
.nf-merged-topbar .topright .person small{display:block;color:#58666d;font-weight:400}
.nf-merged-topbar .topright button{color:#263139;background:#ffffff80;border:2px solid #263139;border-radius:9px;white-space:nowrap}
.nf-merged-topbar .topright .play-access-button{font-weight:800}
.nf-merged-topbar .topright .nf-header-exit{font-size:12px;font-weight:700;padding:5px 12px}
.nf-header-mark{display:block;grid-column:2;justify-self:center;width:59px;height:auto;max-height:59px;object-fit:contain}
body.nf-header-ready .module-loading{display:none}
body.nf-header-ready .module-loading>img,
body.nf-header-ready .module-loading-track{display:none}
#nf-logout-choice{width:min(440px,calc(100vw - 32px));padding:28px;border:2px solid #17212b;border-radius:14px;background:#fff;color:#263139;box-shadow:0 20px 70px #11182755}
#nf-logout-choice::backdrop{background:#17212b99}
#nf-logout-choice h2{margin:0 0 10px}
.nf-logout-options{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.nf-logout-options button{border:2px solid #17212b;border-radius:9px}
@media(max-width:1100px){
  #app > .topbar.nf-merged-topbar{grid-template-columns:minmax(120px,1fr) minmax(100px,150px) minmax(0,1.4fr);gap:10px}
  .nf-header-left{grid-column:1}
  .nf-header-progress{grid-column:2}
  .nf-merged-topbar .topright{grid-column:3;grid-template-columns:minmax(0,1fr) 44px;gap:8px}
  .nf-merged-topbar .brand span:not(.nf-header-identity){display:none}
  .nf-merged-topbar .brand .nf-header-identity{display:none}
  .nf-merged-topbar .brand{grid-template-columns:minmax(0,1fr)}
  .nf-merged-topbar .brand img{width:110px}
  .nf-header-mark{width:38px}
}
@media(max-width:700px){
  #app > .topbar.nf-merged-topbar{grid-template-columns:1fr auto;gap:4px 10px;padding:6px 12px}
  .nf-header-progress{grid-column:1/-1;grid-row:2;max-width:100%}
  .nf-merged-topbar .topright{grid-column:2;grid-row:1}
  .nf-header-actions{flex-wrap:wrap}
  .nf-merged-topbar .topright .person{display:none}
  .nf-merged-topbar .brand img{width:100px}
  .nf-header-mark{width:36px}
}
@media(prefers-reduced-motion:reduce){.nf-header-track i{animation:none!important;transform:none!important}}

/* One proportional scale covers the authenticated shell and body-sibling
   dialogs/popovers. Mobile and login keep their existing responsive layout. */
html[data-nf-desktop-density]{zoom:var(--nf-ui-scale,1)}
/* Align every module's outer cards with the visible header logos. The same
   spare columns position the NOVAIS logo and the isolated N. */
html[data-nf-desktop-density]{
  --nf-header-logo-space:clamp(153px,calc(var(--nf-viewport-width,100vw) - 1560px),256px);
  --nf-header-mark-space:clamp(59px,calc(var(--nf-viewport-width,100vw) - 1560px),256px);
  --nf-content-left:calc(18px + (var(--nf-header-logo-space) - 153px)/2);
  --nf-content-right:calc(18px + (var(--nf-header-mark-space) - 59px)/2);
}
html[data-nf-desktop-density] #app>.shell{
  padding-inline:var(--nf-content-left) var(--nf-content-right);
}
/* Restore the original desktop composition. Spare logo columns can narrow
   before any label is clipped; controls and the profile stay on one row. */
html[data-nf-desktop-density] #app>.topbar.nf-merged-topbar{
  grid-template-columns:clamp(206px,calc(var(--nf-viewport-width,100vw)*.135),256px) minmax(0,1fr) minmax(220px,265px) minmax(0,1fr) clamp(206px,calc(var(--nf-viewport-width,100vw)*.135),256px);
  padding:2px 16px;gap:16px;min-height:69px;height:auto;
}
html[data-nf-desktop-density] .nf-header-left{grid-column:1/3;grid-row:1}
html[data-nf-desktop-density] .nf-header-progress{grid-column:3;grid-row:1;max-width:265px}
html[data-nf-desktop-density] .nf-merged-topbar .brand{
  grid-template-columns:var(--nf-header-logo-space) minmax(0,1fr);grid-template-rows:auto auto;column-gap:16px;row-gap:2px;
}
html[data-nf-desktop-density] .nf-merged-topbar .brand img{width:153px}
html[data-nf-desktop-density] .nf-merged-topbar .brand span:not(.nf-header-identity){
  display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
html[data-nf-desktop-density] .nf-merged-topbar .brand .nf-header-identity{display:block}
html[data-nf-desktop-density] .nf-merged-topbar .topright{
  grid-column:4/6;grid-row:1;grid-template-columns:minmax(0,1fr) var(--nf-header-mark-space);column-gap:16px;
}
html[data-nf-desktop-density] .nf-header-actions{gap:3px 6px;flex-wrap:nowrap}
html[data-nf-desktop-density] .nf-header-actions>button{flex-shrink:0;white-space:nowrap}
html[data-nf-desktop-density] .nf-header-actions>.play-access-button{font-size:12px;padding:13px 18px}
html[data-nf-desktop-density] .nf-merged-topbar .topright .person{
  display:block;min-width:0;flex-shrink:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
html[data-nf-desktop-density] .nf-merged-topbar .topright .person small{overflow:hidden;text-overflow:ellipsis}
html[data-nf-desktop-density] .nf-header-mark{width:59px}
/* On scaled laptop screens the profile and exit control must not create a
   second header row. The status remains centred between brand and actions. */
@media(max-width:900px){
  #app>.topbar.nf-merged-topbar{min-height:64px;padding:4px 12px;gap:8px}
  .nf-merged-topbar .topright .person{display:none}
  .nf-header-actions{flex-wrap:nowrap}
  .nf-merged-topbar .topright .play-access-button{padding:9px 11px;font-size:11px}
  html[data-nf-desktop-density] .nf-header-left{grid-column:1}
  html[data-nf-desktop-density] .nf-header-progress{grid-column:2}
  html[data-nf-desktop-density] .nf-merged-topbar .brand{grid-template-columns:minmax(0,1fr)}
  html[data-nf-desktop-density] .nf-merged-topbar .brand img{width:110px}
  html[data-nf-desktop-density] .nf-merged-topbar .brand span{display:none!important}
  html[data-nf-desktop-density] .nf-merged-topbar .topright{grid-column:3;grid-template-columns:minmax(0,1fr) 42px;gap:8px}
  html[data-nf-desktop-density] .nf-header-mark{width:38px}
}
@media(min-width:701px) and (max-width:900px){
  #app>.topbar.nf-merged-topbar{grid-template-columns:minmax(0,1fr) minmax(130px,190px) minmax(0,1fr)}
  .nf-header-left{grid-column:1}
  .nf-header-progress{grid-column:2}
  .nf-merged-topbar .topright{grid-column:3}
}
@media print{html[data-nf-desktop-density]{zoom:1}}

