/* v0.5.6 – persistent TV-style command feed. */
.ref-app-main { grid-template-rows:60px minmax(0,1fr) 32px; }
.ref-live-ticker {
  min-width:0;
  height:32px;
  display:grid;
  grid-template-columns:72px minmax(0,1fr);
  align-items:center;
  border-top:1px solid rgba(94,203,255,.16);
  background:linear-gradient(90deg,rgba(4,14,25,.98),rgba(6,18,31,.96));
  overflow:hidden;
  z-index:18;
}
.ref-live-ticker-label {
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  color:#f1f8ff;
  background:linear-gradient(90deg,rgba(9,50,73,.96),rgba(7,31,49,.95));
  box-shadow:8px 0 22px rgba(0,0,0,.32);
  font-size:13px;
  letter-spacing:.14em;
}
.ref-live-ticker-label i { width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px var(--cyan);animation:refTickerPulse 1.2s ease-in-out infinite; }
.ref-live-ticker-window { min-width:0;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 2%,#000 98%,transparent); }
.ref-live-ticker-track { width:max-content;display:flex;align-items:center;gap:34px;padding-left:24px;animation:refTickerMove 54s linear infinite;will-change:transform; }
.ref-live-ticker:hover .ref-live-ticker-track { animation-play-state:running; }
.ref-live-ticker-item { display:inline-flex;align-items:center;gap:7px;white-space:nowrap;color:#b9cad8;font-size:13px; }
.ref-live-ticker-item i { width:6px;height:6px;border-radius:50%;background:#7f93a6;box-shadow:0 0 8px currentColor; }
.ref-live-ticker-item strong { color:#e8f5ff;font-size:13px; }
.ref-live-ticker-item small { color:#8195a7;font-size:13px; }
.ref-live-ticker-item.good i{background:var(--green)}
.ref-live-ticker-item.info i{background:var(--cyan)}
.ref-live-ticker-item.warning i{background:var(--amber)}
.ref-live-ticker-item.danger i{background:var(--red)}
@keyframes refTickerMove { from{transform:translateX(0)} to{transform:translateX(-50%)} }
@keyframes refTickerPulse { 0%,100%{opacity:.55} 50%{opacity:1} }
@media(max-width:820px){.ref-live-ticker{grid-template-columns:56px}.ref-live-ticker-label{font-size:13px}.ref-live-ticker-track{gap:24px}}
@media(prefers-reduced-motion:reduce){.ref-live-ticker-track{animation:none;transform:none}.ref-live-ticker-window{overflow:auto}}

/* Keep the alert control above embedded WebGL surfaces. */
.ref-commandbar{position:relative}.ref-alert-toggle{position:relative;z-index:82;pointer-events:auto}.ref-alert-popover{pointer-events:auto;isolation:isolate}

/* v0.5.7 – full-width, readable command ticker including the sidebar column. */
.ref-app-shell {
  grid-template-rows: minmax(0, 1fr) 40px;
}
.ref-sidebar {
  grid-column: 1;
  grid-row: 1;
  height: auto;
  min-height: 0;
}
.ref-app-main {
  grid-column: 2;
  grid-row: 1;
  height: auto;
  min-height: 0;
  grid-template-rows: 60px minmax(0, 1fr);
}
.ref-live-ticker {
  grid-column: 1 / -1;
  grid-row: 2;
  width: 100%;
  height: 40px;
  grid-template-columns: 88px minmax(0, 1fr);
  border-top-color: rgba(94,203,255,.24);
  box-shadow: 0 -10px 28px rgba(0,0,0,.24);
  z-index: 40;
}
.ref-live-ticker-label {
  font-size: 13px;
  letter-spacing: .15em;
}
.ref-live-ticker-track {
  gap: 42px;
  padding-left: 30px;
  animation-duration: 62s;
}
.ref-live-ticker-item {
  gap: 9px;
  font-size: 13px;
  line-height: 1;
}
.ref-live-ticker-item i {
  width: 7px;
  height: 7px;
}
.ref-live-ticker-item strong {
  font-size: 13px;
  letter-spacing: .01em;
}
.ref-live-ticker-item small {
  font-size: 13px;
  color: #91a6b8;
}
@media(max-width:820px){
  .ref-live-ticker{grid-template-columns:68px}
  .ref-live-ticker-label{font-size:13px}
  .ref-live-ticker-track{gap:30px;padding-left:20px}
  .ref-live-ticker-item,.ref-live-ticker-item strong{font-size:13px}
  .ref-live-ticker-item small{font-size:13px}
}




/* v0.12.9 – stable two-lane ticker. Equal-width groups remove the seam jump,
   and a global negative delay resumes the same phase after real content changes. */
.ref-live-ticker-track {
  gap: 0;
  padding-left: 0;
  animation-duration: var(--ticker-duration, 62s);
  animation-delay: var(--ticker-delay, 0ms);
  animation-fill-mode: both;
}
.ref-live-ticker-set {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 42px;
  padding-left: 30px;
  padding-right: 42px;
}
@media(max-width:820px){
  .ref-live-ticker-set{gap:30px;padding-left:20px;padding-right:30px}
}


/* v0.12.11 – calm, user-controlled ticker. */
.ref-live-ticker-label {
  appearance: none;
  border: 0;
  border-right: 1px solid rgba(94,203,255,.18);
  cursor: pointer;
  background: linear-gradient(90deg, rgba(9,50,73,.96), rgba(7,31,49,.95));
  box-shadow: 8px 0 22px rgba(0,0,0,.24);
}
.ref-live-ticker-label:hover,
.ref-live-ticker-label:focus-visible {
  background: linear-gradient(90deg, rgba(13,67,94,.98), rgba(8,39,61,.98));
  outline: none;
}
.ref-live-ticker-label i {
  background: var(--cyan);
  box-shadow: 0 0 10px var(--cyan);
}
.ref-live-ticker:hover .ref-live-ticker-track {
  animation-play-state: running;
}
.ref-live-ticker.is-paused .ref-live-ticker-track {
  animation-play-state: paused;
}
.ref-live-ticker.is-paused .ref-live-ticker-label {
  color: #ffe2a2;
  background: linear-gradient(90deg, rgba(83,57,15,.94), rgba(45,34,13,.94));
  border-right-color: rgba(244,189,88,.26);
}
.ref-live-ticker.is-paused .ref-live-ticker-label i {
  background: var(--amber);
  box-shadow: 0 0 10px var(--amber);
  animation: none;
}
