/* NetGain NOW PLAYING strip — shared across intranet pages */
.ambience {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 9000;
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  margin: 0; padding: 3px 8px 3px 6px;
  border: none; border-top: 1px solid #444;
  background: #111; color: #0f0;
  font-family: "Courier New", Courier, monospace; font-size: 10px;
  line-height: 1.2; box-sizing: border-box; min-height: 0;
}
.ambience .np {
  flex: 1; min-width: 0; letter-spacing: 0.5px;
  display: flex; align-items: center; gap: 6px;
  overflow: hidden; white-space: nowrap;
}
.ambience .np .np-label { flex: 0 0 auto; color: #ffff00; font-weight: bold; }
.ambience .np .np-track { flex: 1; min-width: 0; overflow: hidden; }
.ambience .np .np-track marquee {
  display: block; width: 100%;
  font-family: "Courier New", Courier, monospace; font-size: 10px; color: #0f0;
}
.ambience .np .ch { color: #9f9; }
.mute-btn {
  flex: 0 0 auto;
  font-family: "Courier New", Courier, monospace; font-size: 13px; font-weight: bold;
  letter-spacing: 1.5px; background: #000; color: #0f0; border: 2px outset #666;
  padding: 6px 14px; cursor: pointer; white-space: nowrap; line-height: 1.2;
  min-width: 72px; box-shadow: 0 0 0 1px #222;
}
.mute-btn:active { border-style: inset; }
.mute-btn.is-muted { color: #f66; border-color: #a44; background: #1a0000; }
.ch-btn {
  flex: 0 0 auto;
  font-family: "Courier New", Courier, monospace; font-size: 12px; font-weight: bold;
  letter-spacing: 1px; background: #000; color: #ffff00; border: 2px outset #666;
  padding: 6px 10px; cursor: pointer; white-space: nowrap; line-height: 1.2;
}
.ch-btn:active, .ch-btn[aria-expanded="true"] { border-style: inset; color: #fff; }
.ch-panel {
  position: fixed; right: 6px; bottom: 40px; z-index: 9001;
  width: 300px; max-width: calc(100vw - 12px); box-sizing: border-box;
  background: #fff; border: 3px solid #b3121f; box-shadow: 3px 3px 0 #000;
  font-family: Arial, Helvetica, sans-serif; font-size: 11px; color: #000;
}
.ch-panel[hidden] { display: none; }
.ch-head { background: #b3121f; color: #fff; font-family: "Courier New", Courier, monospace; font-weight: bold; font-size: 11px; letter-spacing: 1px; padding: 4px 6px; }
.ch-close { float: right; cursor: pointer; color: #ffff00; }
.ch-sub { background: #fdedee; padding: 3px 6px; font-size: 10px; border-bottom: 1px solid #b3121f; }
.ch-list { list-style: none; margin: 0; padding: 0; }
.ch-list li { margin: 0; border-bottom: 1px dotted #999; }
.ch-list button {
  display: block; width: 100%; text-align: left; background: #fff; border: none;
  padding: 6px 8px; cursor: pointer; font-family: "Courier New", Courier, monospace; font-size: 11px; color: #000;
}
.ch-list button:hover { background: #f5f5f5; }
.ch-list button .chn { color: #000080; font-weight: bold; }
.ch-list button .note { display: block; color: #666; font-size: 9px; margin-top: 1px; }
.ch-list button.active { background: #000; color: #0f0; }
.ch-list button.active .chn { color: #ffff00; }
.ch-list button.active .note { color: #9f9; }
.ch-foot { padding: 3px 6px; font-size: 9px; color: #666; text-align: center; background: #f0f0f0; }
body.ng-has-ambience { padding-bottom: 44px; }

/* Return-visit glitch overlay — full-page corruption */
#ng-glitch {
  position: fixed; inset: 0; z-index: 10050; pointer-events: none;
  display: none; overflow: hidden;
}
#ng-glitch.on { display: block; }
#ng-glitch .g-red {
  position: absolute; inset: 0;
  background: rgba(120,0,10,0.42);
  mix-blend-mode: multiply;
  animation: ngGFlicker 0.12s steps(2) infinite;
}
#ng-glitch .g-scan {
  position: absolute; inset: 0;
  background: repeating-linear-gradient(
    to bottom,
    rgba(0,0,0,0) 0px,
    rgba(0,0,0,0) 2px,
    rgba(0,0,0,0.35) 3px,
    rgba(180,0,0,0.08) 4px
  );
  opacity: 0.85;
}
#ng-glitch .g-noise {
  position: absolute; inset: -10%;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");
  opacity: 0.35; mix-blend-mode: overlay;
  animation: ngGShake 0.08s steps(2) infinite;
}
#ng-glitch .g-tear {
  position: absolute; left: 0; right: 0; height: 18%;
  background: rgba(255,0,40,0.18);
  box-shadow: 0 0 0 2px rgba(0,255,80,0.25), 4px 0 0 rgba(255,0,0,0.4), -4px 0 0 rgba(0,80,255,0.35);
  animation: ngGTear 0.35s steps(3) infinite;
  transform: translateX(-6px);
}
#ng-glitch .g-rgb {
  position: absolute; inset: 0;
  box-shadow: inset 6px 0 0 rgba(255,0,0,0.25), inset -6px 0 0 rgba(0,120,255,0.25);
  animation: ngGRgb 0.15s steps(2) infinite;
}
#ng-glitch .g-copy {
  position: absolute; left: 50%; top: 42%; transform: translate(-50%,-50%);
  width: min(520px, 92vw);
  background: #000; border: 3px double #b3121f; color: #ff2222;
  font-family: "Courier New", Courier, monospace; font-size: 12px; font-weight: bold;
  letter-spacing: 1px; text-align: center; padding: 14px 12px;
  text-shadow: 2px 0 #0ff, -2px 0 #f00;
  animation: ngGFlicker 0.18s steps(2) infinite;
}
#ng-glitch .g-copy .tag { color: #ffff00; display: block; margin-bottom: 6px; letter-spacing: 2px; }
#ng-glitch .g-copy .sub { color: #ccc; font-size: 10px; font-weight: normal; margin-top: 8px; display: block; }
@keyframes ngGFlicker { 50% { opacity: 0.72; } }
@keyframes ngGShake { 50% { transform: translate(3px, -2px); } }
@keyframes ngGTear {
  0% { top: 18%; transform: translateX(-10px) skewX(-2deg); }
  50% { top: 55%; transform: translateX(12px) skewX(3deg); }
  100% { top: 72%; transform: translateX(-4px); }
}
@keyframes ngGRgb { 50% { box-shadow: inset -8px 0 0 rgba(255,0,0,0.3), inset 8px 0 0 rgba(0,120,255,0.3); } }
body.ng-glitching .ambience,
body.ng-glitching .ambience .np .ch,
body.ng-glitching .ambience .np-label {
  color: #f66 !important;
  text-shadow: 1px 0 #0ff, -1px 0 #f00;
}
body.ng-glitching .ambience { background: #1a0000; border-top-color: #b3121f; }
body.ng-glitching .mute-btn, body.ng-glitching .ch-btn {
  color: #f66; border-color: #a44; background: #100000;
}