/* Project Haystack desk extras. Live only under html.ph-fx.
   UNDO: PH_FX=False in generate.py + republish, or ?nofx=1, or footer toggle. */

html.ph-fx .ph-stack{
  display:flex;align-items:flex-end;gap:3px;height:72px;
  margin:0 0 10px;padding:8px 8px 6px;
  border:1px solid var(--line);background:#0b120e;
  box-shadow:inset 0 0 14px rgba(43,255,93,.05);
}
html.ph-fx .ph-stack[hidden]{display:none}
html.ph-fx .ph-bar{
  flex:1 1 0;min-width:0;height:auto;background:transparent;
  position:relative;cursor:pointer;align-self:stretch;
  display:flex;align-items:flex-end;
  padding:0;border:0;appearance:none;font:inherit;color:inherit;
}
html.ph-fx .ph-bar>i{
  display:block;width:100%;background:var(--green);
  box-shadow:0 0 8px rgba(43,255,93,.35);
}
html.ph-fx .ph-bar.is-neg>i{background:var(--mag);box-shadow:0 0 8px rgba(255,0,60,.35)}
html.ph-fx .ph-bar:hover>i,html.ph-fx .ph-bar.is-on>i{outline:1px solid var(--cyan)}
html.ph-fx .ph-bar[title]{font-size:0}

html.ph-fx .ph-inspect{
  border:1px solid var(--cyan);background:#0b120e;
  padding:8px 12px;margin:0 0 10px;font-size:.78rem;letter-spacing:.06em;
  box-shadow:0 0 14px rgba(0,240,255,.12);
}
html.ph-fx .ph-inspect[hidden]{display:none}
html.ph-fx .ph-inspect b{color:var(--cyan)}

html.ph-fx .ph-rail{
  position:fixed;left:10px;top:22%;z-index:40;
  display:flex;flex-direction:column;gap:3px;
  font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;
}
html.ph-fx .ph-rail a{
  color:var(--dim);text-decoration:none;padding:3px 6px;
  border:1px solid transparent;
}
html.ph-fx .ph-rail a:hover,html.ph-fx .ph-rail a.is-here{
  color:var(--cyan);border-color:var(--line);background:#0b120e;
  text-shadow:0 0 8px rgba(0,240,255,.5);
}
@media (max-width:1180px){html.ph-fx .ph-rail{display:none}}

html.ph-fx.ph-standby{--green:#b7e05a;--dim:#6d8a3a}
html.ph-fx.ph-standby .boot span:last-child::after{
  content:"  ::  MARKET SESSION ... CLOSED";
  color:var(--yel);
}

html.ph-fx .ph-tick{
  animation:ph-tick .7s ease-out;
}
@keyframes ph-tick{
  0%{color:var(--cyan);text-shadow:0 0 10px rgba(0,240,255,.8)}
  100%{text-shadow:0 0 6px rgba(43,255,93,.4)}
}

html.ph-fx tr[data-ticker]{cursor:pointer}
html.ph-fx tr[data-ticker].is-on td{background:rgba(0,240,255,.06)}

html.ph-fx .boot.is-typing span{visibility:hidden}
html.ph-fx .boot.is-typing span.is-on{visibility:visible}

html.ph-fx .ph-help{
  position:fixed;right:14px;bottom:14px;z-index:45;
  border:1px solid var(--line);background:#0b120e;
  padding:10px 12px;font-size:.72rem;color:var(--dim);
  box-shadow:0 0 18px rgba(0,0,0,.4);
}
html.ph-fx .ph-help[hidden]{display:none}
html.ph-fx .ph-help b{color:var(--cyan)}

.ph-fx-bar{margin:16px 0 0;display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.ph-fx-toggle{
  appearance:none;background:#0b120e;border:1px solid var(--line);
  color:var(--dim);font:inherit;font-size:.72rem;letter-spacing:.1em;
  text-transform:uppercase;padding:4px 10px;cursor:pointer;
}
.ph-fx-toggle:hover{color:var(--cyan);border-color:var(--cyan)}

@media (prefers-reduced-motion:reduce){
  html.ph-fx .ph-tick{animation:none}
  html.ph-fx .boot.is-typing span{visibility:visible}
}