/* Visitor quote ticker — D_V only. A new file on purpose: index.html is fresh on
   every deploy but styles.css is cached 4h, so ticker rules living there would
   leave a returning visitor with an unstyled ticker for hours.
   Spec: docs/superpowers/specs/2026-09-24-visitor-quote-ticker-design.md */
.quote-ticker{ display:none; }
@media (min-width:992px){
  /* contain:inline-size: the nowrap crawl would otherwise hand its full width up the
     Explorer's flex column (measured: the panel grew to 40,802px). min-width:0 does not
     stop that; it limits shrinking, not the width a child reports upward. */
  .quote-ticker:not([hidden]){ display:flex; flex-direction:column; flex-shrink:0; contain:inline-size;
    background:var(--w95-bg); padding:var(--space-1) 4px 0; }
}
.quote-ticker-titlebar .game-win-title{ min-width:0; overflow:hidden; text-overflow:ellipsis; }
.quote-ticker-btn{ font-size:var(--text-sm); padding:0 var(--space-2); height:16px; line-height:1; }
.quote-ticker-well{ position:relative; overflow:hidden; white-space:nowrap;
  margin-top:var(--space-1); background:var(--w95-field); box-shadow:var(--shadow-sunken);
  font-family:var(--font-system); font-size:var(--text-base); color:var(--w95-text);
  padding:var(--space-6) 0; }   /* Tung 2026-09-24: A2, roomier strip */
.quote-ticker-track{ display:inline-flex; will-change:transform; }
.quote-ticker-run{ display:inline-flex; align-items:center; }
.quote-ticker-item{ padding:0; }
.quote-ticker-sep{ color:var(--w95-text-disabled); padding:0 var(--space-10); }   /* A2: 20px between quotes */
@media (prefers-reduced-motion: no-preference){
  .quote-ticker-track{ animation:quote-crawl var(--quote-ticker-dur, 60s) linear infinite; }
}
@media (prefers-reduced-motion: reduce){
  .quote-ticker-well{ overflow-x:auto; }
}
/* Pause is a POINTER affordance: a tap holds :hover on touch and would park the
   crawl for good (same bug as the booth suggestion ticker, fixed 2026-09-07). */
@media (hover:hover) and (pointer:fine){
  .quote-ticker-well:hover .quote-ticker-track{ animation-play-state:paused; }
}
.quote-ticker-well:focus-within .quote-ticker-track{ animation-play-state:paused; }
@keyframes quote-crawl{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

.quote-dialog-overlay{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; z-index:var(--z-fg); }
.quote-dialog{ width:min(360px, 90%); }
.quote-dialog-body{ display:flex; flex-direction:column; gap:var(--space-1); padding:var(--space-2);
  font-family:var(--font-system); font-size:var(--text-sm); color:var(--w95-text); }
.quote-dialog-field{ font-family:var(--font-system); font-size:var(--text-sm); background:var(--w95-field);
  border:none; box-shadow:var(--shadow-sunken); padding:var(--space-1); resize:none; color:var(--w95-text); }
.quote-dialog-count{ align-self:flex-end; color:var(--w95-text-disabled); }
.quote-dialog-msg{ min-height:1em; }
.quote-dialog-buttons{ display:flex; gap:var(--space-2); justify-content:flex-end; margin-top:var(--space-1); }

.quote-manage{ width:min(560px, 94%); max-height:80%; }
.quote-manage-list{ overflow-y:auto; background:var(--w95-field); box-shadow:var(--shadow-sunken);
  margin:var(--space-2); padding:var(--space-2); font-family:var(--font-system); font-size:var(--text-sm); color:var(--w95-text); }
.quote-manage-row{ padding:var(--space-2) 0; border-bottom:1px solid var(--w95-bg-dark); }
.quote-manage-meta{ display:flex; align-items:center; gap:var(--space-2); color:var(--w95-text-disabled); }
.quote-manage-meta .w95-btn{ margin-left:auto; font-size:var(--text-sm); }
.quote-manage-reaction{ color:var(--w95-text-disabled); font-style:italic; }