/* =========================================================================
   Insights - the gallery and a visualization's page (session 103).
   The gallery's cards are the Catalog's (catalog.css, .hb-cat-*); the page
   is a news post's (news.css, .hb-nw-*) with the chart under its title and
   the box office page's band pieces (cards.css, boxoffice.css). Only what
   those do not have is here, all .hb-ins-*.
   ========================================================================= */

/* The gallery */
.hb-ins-card .hb-ins-teaser { margin: 6px 0 0; color: var(--t2); font-size: 14px; line-height: 1.45; }
.hb-ins-draft { outline: 1px dashed var(--orange); outline-offset: -1px; }
.hb-ins-draft .hb-cat-kicker { color: var(--orange); }
.hb-ins-empty { color: var(--t2); }

/* The band: a label stays with its pills when the row wraps */
.hb-ins-ctl { display: inline-flex; align-items: center; gap: 6px; flex-wrap: nowrap; }
.hb-ins-band { row-gap: 8px; }

/* The chart's panel */
.hb-ins-chart { margin: 18px 0 6px; }

/* The waves (static/js/waves.js): a row per band, its ridge a soft line in
   its own lighter hue (Bill: "a softer outline"); a row hovered is lit and
   the rest dim. */
.hb-wv-plot { position: relative; margin-top: 4px; }
.hb-wv-plot svg { display: block; width: 100%; overflow: visible; }
.hb-wv-plot text { font: 12px 'Raleway', sans-serif; fill: #c8c8c8; }
.hb-wv-plot .hb-wv-n, .hb-wv-plot .hb-wv-axis { fill: #8a8a8a; font-size: 11px; }
.hb-wv-grid { stroke: rgba(255,255,255,.06); }
.hb-wv-base { stroke: rgba(255,255,255,.12); }
.hb-wv-area { fill-opacity: .82; transition: opacity .1s; }
.hb-wv-ridge { stroke-width: 1.1; stroke-linejoin: round; transition: opacity .1s; }
.hb-wv-lit .hb-wv-area, .hb-wv-lit .hb-wv-ridge { opacity: .25; }
.hb-wv-lit .hb-wv-on .hb-wv-area, .hb-wv-lit .hb-wv-on .hb-wv-ridge { opacity: 1; }
.hb-wv-lit .hb-wv-on text { fill: #fff; }
.hb-wv-narrow .hb-wv-name { paint-order: stroke; stroke: #222; stroke-width: 3px; font-size: 11px; }
.hb-wv-tip { position: absolute; z-index: 5; pointer-events: none; background: #1c1c1c; border: 1px solid #565656;
  padding: 6px 9px; font-size: 12px; color: #eee; white-space: nowrap; }
.hb-wv-tip b { font-family: 'Oswald', sans-serif; letter-spacing: .5px; }

/* The card's picture, shown while editing only */
.hb-ins-pic { max-width: 320px; }