body.hud3 { --fak: var(--pv-color-faction-default); }  
body.hud3[data-faction="vallum"]    { --fak: var(--pv-color-faction-vallum); }
body.hud3[data-faction="skaravh"]   { --fak: var(--pv-color-faction-skaravh); }
body.hud3[data-faction="cognitax"]  { --fak: var(--pv-color-faction-cognitax); }
body.hud3[data-faction="helioth"]   { --fak: var(--pv-color-faction-helioth); }
body.hud3[data-faction="rakkhar"]   { --fak: var(--pv-color-faction-rakkhar); }
body.hud3[data-faction="umbrath"]   { --fak: var(--pv-color-faction-umbrath); }
body.hud3[data-faction="orremis"]   { --fak: var(--pv-color-faction-orremis); }
body.hud3[data-faction="nekhrion"]  { --fak: var(--pv-color-faction-nekhrion); }
body.hud3[data-faction="ignevra"]   { --fak: var(--pv-color-faction-ignevra); }
body.hud3[data-faction="tellurgia"] { --fak: var(--pv-color-faction-tellurgia); }
body.hud3[data-faction="concordat"] { --fak: var(--pv-color-faction-concordat); }
body.hud3[data-faction="pardus"]    { --fak: var(--pv-color-faction-pardus); }  


body.hud3 {
  --fak-dim:  color-mix(in srgb, var(--fak) 55%, var(--pv-color-hud2-plytaHi));
  --fak-glow: color-mix(in srgb, var(--fak) 32%, transparent);
  --fak-line: color-mix(in srgb, var(--fak) 38%, var(--pv-color-surface-line));
  --fak-ink:  color-mix(in srgb, var(--fak) 65%, var(--pv-color-hud-frostInk));
}


body.hud3 {
  --fak-neb:  color-mix(in srgb, var(--fak) 17%, transparent);
  --fak-neb2: color-mix(in srgb, var(--fak) 8%, transparent);
}
body.hud3 #topbar,
body.hud3 #pv-dock,
body.hud3 #footbar,
body.hud3 .pv-win,
body.hud3 #cpanel,
body.hud3 #fpanel {
  background-color: var(--pv-color-hud-navBg);                            
  background-image:
    radial-gradient(130% 90% at 12% -15%, var(--fak-neb) 0%, transparent 52%),
    radial-gradient(100% 70% at 92% 115%, var(--pv-color-hud-deepDarkA14) 0%, transparent 58%),
    radial-gradient(circle at 50% 50%, var(--pv-color-hud-navFrostA16) 0 0.7px, transparent 1px),
    radial-gradient(circle at 50% 50%, var(--pv-color-hud-navFrostA10) 0 0.6px, transparent 0.9px),
    radial-gradient(circle at 50% 50%, var(--fak-neb2) 0 1px, transparent 1.4px),
    linear-gradient(180deg, var(--pv-color-hud-navBgHi), var(--pv-color-hud-navBgLo));
  background-size: auto, auto, 67px 53px, 41px 71px, 173px 131px, auto;
  background-position: 0 0, 0 0, 7px 11px, 23px 5px, 51px 37px, 0 0;
  border: 1px solid var(--fak-line);
  box-shadow:
    inset 0 1px 0 var(--pv-color-hud3-reflectA08),
    inset 0 -1px 0 var(--pv-color-overlay-blackA450),
    0 0 22px -8px var(--fak-glow),
    0 18px 40px -28px var(--pv-color-overlay-black1000);
}

body.hud3 .pv-win {
  clip-path: polygon(0 14px, 14px 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 0 100%);
  border-radius: 0;
}
body.hud3 #sheet { border-color: var(--fak-line); box-shadow: 0 0 22px -8px var(--fak-glow); }


body.hud3 .pv-win header,
body.hud3 .sh-head {
  background: linear-gradient(90deg, color-mix(in srgb, var(--fak) 22%, transparent), transparent 68%);
  border-bottom: 1px solid var(--fak-line);
  position: relative;
}
body.hud3 .pv-win header::after,
body.hud3 .sh-head::after {
  content: '';
  position: absolute; left: 0; right: 30%; bottom: -1px; height: 1px;
  background: linear-gradient(90deg, var(--fak) 0%, var(--fak-dim) 55%, transparent 100%);
  box-shadow: 0 0 8px 0 var(--fak-glow);
  pointer-events: none;
}
body.hud3 .pv-win header h3,
body.hud3 .sh-head h3 {
  color: var(--fak-ink);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-shadow: 0 0 12px var(--fak-glow);
}
body.hud3 .sh-kicker { color: var(--fak-dim); letter-spacing: 0.18em; }


body.hud3 .pv-win { line-height: 1.5; }
body.hud3 .pv-empty { color: var(--pv-color-hud-frakcjaTextBaseA45); }
body.hud3 .pv-lv { color: var(--fak-ink); }


body.hud3 .btn {
  clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px);
  border: 1px solid var(--fak-line);
  transition: box-shadow 0.15s, border-color 0.15s;
}
body.hud3 .btn:hover { border-color: var(--fak); box-shadow: 0 0 14px -4px var(--fak-glow); }
body.hud3 .btn.prime {
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--fak) 34%, var(--pv-color-hud-primeInkAlt)),
    color-mix(in srgb, var(--fak) 16%, var(--pv-color-hud-navBg)));
  border-color: var(--fak);
  color: var(--pv-color-hud-primeTextAlt);
  box-shadow: 0 0 18px -6px var(--fak-glow), inset 0 1px 0 var(--pv-color-overlay-whiteA100);
}


body.hud3 #topbar { position: relative; }
body.hud3 #pv-dock { position: relative; }
body.hud3 #topbar::after,
body.hud3 #pv-dock::after {
  content: '';
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  border-radius: inherit;
  background-image:
    radial-gradient(circle at 18% 140%, transparent 117px, color-mix(in srgb, var(--fak) 26%, transparent) 119px, transparent 122px),
    radial-gradient(circle at 82% -40%, transparent 95px, color-mix(in srgb, var(--fak) 20%, transparent) 97px, transparent 100px),
    radial-gradient(circle at 45% 210%, transparent 178px, color-mix(in srgb, var(--fak) 12%, transparent) 180px, transparent 183px),
    radial-gradient(circle at 50% 50%, var(--pv-color-hud3-dotA10) 0 0.9px, transparent 1.15px),
    radial-gradient(circle at 50% 50%, color-mix(in srgb, var(--fak) 13%, transparent) 0 2.4px, transparent 3px);
  background-size: auto, auto, auto, 9px 15.588px, 96px 96px;
  background-position: 0 0, 0 0, 0 0, 0 0, 12px 8px;
  opacity: 0.95;
}
body.hud3 #topbar > *, body.hud3 #pv-dock > * { position: relative; z-index: 1; }


body.hud3 #pv-dock .on,
body.hud3 #pv-dock [aria-pressed="true"],
body.hud3 #pv-dock .active {
  color: var(--fak-ink);
  border-color: var(--fak);
  box-shadow: inset 0 -2px 0 var(--fak), 0 0 14px -6px var(--fak-glow);
}
body.hud3 .fab.on, body.hud3 .fab.active {
  border-color: var(--fak);
  box-shadow: 0 0 16px -6px var(--fak-glow), inset 0 1px 0 var(--pv-color-hud3-insetA07);
}
body.hud3 :focus-visible { outline: 1px solid var(--fak); outline-offset: 1px; }


body.hud3 #fab-tech, body.hud3 #fab-army { display: none !important; }


body.hud3 ::-webkit-scrollbar { width: 8px; height: 8px; }
body.hud3 ::-webkit-scrollbar-track { background: var(--pv-color-hud2-plytaLo); }
body.hud3 ::-webkit-scrollbar-thumb {
  background: var(--fak-dim);
  border-radius: 4px;
  border: 2px solid var(--pv-color-hud2-plytaLo);
}
body.hud3 ::-webkit-scrollbar-thumb:hover { background: var(--fak); }