/* An unmarked signal: small visual glyph, generous touch target. */
.madrigal-discovery[hidden], .madrigal-panel[hidden] { display: none !important; }
.top-nav { position: relative; z-index: 3; }
.madrigal-discovery { position: relative; margin-left: auto; flex: 0 0 48px; }
.madrigal-trigger {
  display: grid; place-items: center; width: 48px; height: 48px;
  padding: 0; border: 1px solid transparent; border-radius: 50%;
  background: transparent; color: #b4e9f3; cursor: pointer;
  -webkit-appearance: none; appearance: none; -webkit-tap-highlight-color: transparent;
}
.madrigal-glyph {
  width: 25px; height: 25px; opacity: .48;
  fill: none; stroke: currentColor; stroke-width: 1.2;
  stroke-linejoin: miter; stroke-linecap: square;
  filter: drop-shadow(0 0 4px #5adaff80);
  animation: madrigal-glimmer 7s ease-in-out infinite;
  transition: opacity 220ms ease, filter 220ms ease;
}
.madrigal-trigger:hover .madrigal-glyph,
.madrigal-trigger:focus-visible .madrigal-glyph,
.madrigal-discovery.is-open .madrigal-glyph {
  opacity: 1; animation: none;
  filter: drop-shadow(0 0 7px #7ee9ff);
}
.madrigal-trigger:focus-visible {
  outline: 2px solid #a7f2ec; outline-offset: 3px;
  background: #04101de6;
}
.madrigal-discovery.is-discovered .madrigal-glyph { animation: none; opacity: .7; }
.madrigal-discovery.is-open .madrigal-glyph { opacity: 1; }
.madrigal-discovery.is-paused .madrigal-glyph { animation-play-state: paused; }
.madrigal-panel {
  position: absolute; right: 0; top: calc(100% + 12px); z-index: 5;
  width: min(19rem, calc(100vw - 2rem)); padding: 22px 22px 18px;
  color: #eaf6ff; border: 1px solid #87dbea55; border-radius: 16px;
  background: linear-gradient(145deg, #06141cf5, #020710fa);
  box-shadow: 0 12px 42px #0009, inset 0 1px 16px #70d9f00a, 0 0 22px #6edbfa12;
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  animation: madrigal-reveal 320ms ease-out both;
  text-align: left;
}
.madrigal-panel::before {
  content: ''; position: absolute; right: 19px; top: -7px;
  width: 12px; height: 12px; transform: rotate(45deg);
  background: #06121b; border-left: 1px solid #87dbea55; border-top: 1px solid #87dbea55;
}
.madrigal-label { margin: 0 30px 10px 0; color: #94d9df; font-size: .65rem; letter-spacing: .18em; text-transform: uppercase; }
.madrigal-panel h2 { margin: 0 0 9px; font-size: 1.45rem; font-weight: 400; letter-spacing: .06em; }
.madrigal-copy { margin: 0; color: #d0e2e9; font-size: .91rem; line-height: 1.5; }
.madrigal-status { margin: 18px 0 0; color: #99b4c0; font-size: .75rem; letter-spacing: .04em; }
.madrigal-dismiss {
  position: absolute; top: 4px; right: 4px; width: 44px; height: 44px;
  display: grid; place-items: center; padding: 0; border: 0; border-radius: 50%;
  background: transparent; color: #b9d3dd; font: 300 1.4rem/1 system-ui, sans-serif; cursor: pointer;
  -webkit-appearance: none; appearance: none;
}
.madrigal-dismiss:hover { color: white; }
.madrigal-dismiss:focus-visible { outline: 2px solid #a7f2ec; outline-offset: -5px; }
@keyframes madrigal-glimmer { 0%, 100% { opacity: .34; } 50% { opacity: .72; } }
@keyframes madrigal-reveal { from { opacity: 0; transform: translateY(-5px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) {
  .madrigal-glyph, .madrigal-panel { animation: none; transition: none; }
}