/* Now playing, stars, dossier, and recently played. Scoped so the console CSS stays put. */

#freq-content.aob-has-track > #track-title,
.mini-meta.aob-has-track > #mini-title { display: none; }
#freq-content.aob-has-track .band-label { display: none; }

.aob-now, .aob-mini-now {
  display: none;
  min-width: 0;
  flex-direction: column;
  gap: 1px;
}
#freq-content.aob-has-track .aob-now,
.mini-meta.aob-has-track .aob-mini-now { display: flex; }

.aob-kicker {
  font-size: 8px;
  letter-spacing: 0.16em;
  opacity: 0.72;
  line-height: 1.2;
}
.aob-now-artist, .aob-mini-artist, .aob-star, .aob-icon, .aob-back, .aob-who {
  appearance: none;
  background: none;
  border: 0;
  padding: 0;
  margin: 0;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.aob-now-artist, .aob-mini-artist, .aob-who, .aob-icon, .aob-back {
  text-decoration: none;
}
.aob-now-artist:hover, .aob-now-artist:focus-visible,
.aob-mini-artist:hover, .aob-mini-artist:focus-visible,
.aob-who:hover, .aob-who:focus-visible,
.aob-icon:hover, .aob-icon:focus-visible,
.aob-star:hover, .aob-star:focus-visible,
.aob-back:hover, .aob-back:focus-visible {
  text-shadow: 0 0 8px var(--phosphor-glow, rgba(51, 255, 102, 0.45));
}
.aob-now-artist {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: 0.01em;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.aob-now-title, .aob-mini-title {
  font-size: 10px;
  line-height: 1.2;
  opacity: 0.82;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.aob-now-line, .aob-mini-line {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.aob-now-line .aob-now-title,
.aob-mini-line .aob-mini-title { flex: 1 1 auto; min-width: 0; }
.cc-badge {
  flex: none;
  color: rgba(255, 176, 0, 0.78);
  border: 1px solid rgba(255, 176, 0, 0.45);
  background: transparent;
  padding: 0 4px;
  font: 600 9px/1.5 "Courier New", monospace;
  letter-spacing: 0.06em;
  text-decoration: none;
  border-radius: 2px;
}
.cc-badge:hover, .cc-badge:focus-visible {
  color: #ffb000;
  border-color: #ffb000;
}
.cc-badge[hidden] { display: none !important; }
.cc-badge-mark { display: none; }
#crt-signal .signal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  opacity: 1;
}
#crt-signal .signal-head > span { opacity: 0.7; }
.cc-badge-signal { position: static; z-index: 6; letter-spacing: 0.06em; }
.cc-badge-mini { display: none; margin-left: auto; }
.cc-badge-mini .cc-badge-word { display: none; }
.cc-badge-mini .cc-badge-mark { display: inline; font-size: 14px; line-height: 1; }
@media (max-width: 900px) {
  .cc-badge-mini:not([hidden]) { display: inline-flex; align-items: center; padding: 0 3px; }
}
.aob-now-row, .aob-mini-row {
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
}
.aob-stars { display: inline-flex; gap: 1px; }
.aob-star {
  width: 16px;
  height: 16px;
  font-size: 14px;
  line-height: 16px;
  color: rgba(51, 255, 102, 0.28);
  cursor: pointer;
}
.aob-star.is-on { color: var(--phosphor, #33ff66); }
@keyframes flight-shimmer {
  0%, 100% { color: rgba(255, 176, 0, 0.38); text-shadow: 0 0 0 transparent; }
  45% { color: #ffb000; text-shadow: 0 0 8px #ffb000, 0 0 14px rgba(255, 43, 214, 0.55); }
  72% { color: #ffe08a; text-shadow: 0 0 6px rgba(0, 229, 255, 0.65); }
}
.flight-stars.is-cue .aob-star:not(.is-on),
.aob-mini-now .aob-stars.is-cue .aob-star:not(.is-on) {
  animation: flight-shimmer 0.7s ease-in-out 3;
}
.flight-stars.is-cue-mid .aob-star:not(.is-on),
.aob-mini-now .aob-stars.is-cue-mid .aob-star:not(.is-on) {
  animation: flight-shimmer 0.9s ease-in-out 1;
}
@media (prefers-reduced-motion: reduce) {
  .flight-stars.is-cue .aob-star:not(.is-on),
  .flight-stars.is-cue-mid .aob-star:not(.is-on),
  .aob-mini-now .aob-stars.is-cue .aob-star:not(.is-on),
  .aob-mini-now .aob-stars.is-cue-mid .aob-star:not(.is-on) {
    animation: none;
    color: var(--accent-amber, #ffb000);
    text-shadow: 0 0 6px rgba(255, 176, 0, 0.7);
  }
}
.aob-avg {
  font-size: 9px;
  letter-spacing: 0.04em;
  opacity: 0.7;
  margin-left: 2px;
}
.aob-icon {
  font-size: 11px;
  letter-spacing: 0.08em;
  opacity: 0.8;
  margin-left: auto;
}
.aob-icon + .aob-icon { margin-left: 0; }
.aob-note {
  font-size: 9px;
  letter-spacing: 0.06em;
  opacity: 0.75;
}

.aob-mini-artist {
  font-size: 14px;
  font-weight: 700;
  line-height: 1.15;
  color: #f3e6c8;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.aob-mini-title { color: #c4b48a; font-size: 11px; }
.mini-meta .aob-star { color: rgba(243, 230, 200, 0.35); width: 18px; height: 18px; font-size: 16px; line-height: 18px; }
.mini-meta .aob-star.is-on { color: #fff6d0; text-shadow: 0 0 6px rgba(255, 214, 120, 0.9); }
.mini-meta .aob-kicker { color: #c4b48a; }
.mini-meta .aob-icon, .mini-meta .aob-avg, .mini-meta .aob-note { color: #c4b48a; }

.aob-sheet {
  position: fixed;
  inset: 0;
  z-index: 120;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  background: rgba(4, 6, 8, 0.72);
  padding: 12px 12px calc(18px + env(safe-area-inset-bottom, 0px));
}
.aob-sheet[hidden] { display: none; }
.aob-card {
  width: min(440px, 100%);
  max-height: min(82vh, 640px);
  overflow: auto;
  background: #10140f;
  color: var(--phosphor, #33ff66);
  border: 1px solid rgba(51, 255, 102, 0.35);
  box-shadow: 0 0 24px rgba(51, 255, 102, 0.12), inset 0 0 40px rgba(0, 0, 0, 0.45);
  border-radius: 6px;
  padding: 12px 14px 16px;
  font-family: "Courier New", "Lucida Console", monospace;
  text-shadow: 0 0 6px var(--phosphor-glow, rgba(51, 255, 102, 0.35));
}
.aob-back {
  font-size: 13px;
  letter-spacing: 0.08em;
  margin-bottom: 10px;
}
.aob-avatar {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  border: 1px solid rgba(51, 255, 102, 0.45);
  display: grid;
  place-items: center;
  position: relative;
  overflow: hidden;
  margin-bottom: 8px;
  background: #07140c;
}
.aob-initials { font-size: 22px; font-weight: 700; letter-spacing: 0.06em; }
.aob-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.aob-name { font-size: 22px; line-height: 1.15; margin: 0 0 6px; font-weight: 700; }
.aob-bio {
  margin: 0 0 8px;
  font-size: 13px;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.aob-links { display: flex; flex-wrap: wrap; gap: 8px 12px; margin: 0 0 8px; }
.aob-links a { color: inherit; }
.aob-links a:hover { text-shadow: 0 0 8px var(--phosphor-glow, rgba(51, 255, 102, 0.45)); }
.aob-badge {
  display: inline-block;
  border: 1px solid rgba(51, 255, 102, 0.45);
  border-radius: 99px;
  padding: 2px 8px;
  font-size: 11px;
  letter-spacing: 0.04em;
  margin: 0 6px 6px 0;
}
.aob-ai { font-size: 12px; opacity: 0.85; margin: 0 0 8px; }
.aob-tracks { list-style: none; margin: 8px 0 0; padding: 0; }
.aob-tracks li {
  font-size: 12px;
  padding: 4px 0;
  border-top: 1px solid rgba(51, 255, 102, 0.15);
  opacity: 0.9;
}
.aob-tracks li.is-current { opacity: 1; font-weight: 700; }
.aob-heard { list-style: none; margin: 8px 0 0; padding: 0; }
.aob-heard li {
  display: flex;
  gap: 8px;
  align-items: baseline;
  padding: 5px 0;
  border-top: 1px solid rgba(51, 255, 102, 0.15);
  font-size: 12px;
}
.aob-when { opacity: 0.65; min-width: 4.5em; }
.aob-song { opacity: 0.85; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.aob-empty { font-size: 13px; opacity: 0.8; }
.aob-copy-sink {
  position: fixed;
  left: -9999px;
  top: 0;
  width: 1px;
  height: 1px;
  opacity: 0;
}

@media (max-width: 399px) {
  .aob-now-artist { font-size: 13px; }
  .aob-star { width: 18px; height: 18px; font-size: 16px; }
}