/* Sky Events: calendar feed of astronomy events */
.ssc-events { margin: 1rem 0; }
.ssc-events__head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; margin: 1rem 0 .5rem; }
.ssc-events__loc { font-size: 1.05rem; font-weight: 600; color: #e2e8f0; }
.ssc-events__loading, .ssc-events__empty { opacity: .7; padding: 1.5rem 0; }

.ssc-events__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.1rem; margin-top: 1.25rem; }

/* Every event card is styled the same. There used to be a blue outline on
   high-scoring events, which just read as an inconsistency. */
.ssc-ev { background: rgba(22, 33, 60, .55); border: 1px solid rgba(148, 163, 184, .45);
  border-radius: 14px; overflow: hidden; display: flex; flex-direction: column; }
.ssc-ev__img { position: relative; aspect-ratio: 16 / 10; background: #0b1120; overflow: hidden; }
.ssc-ev__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ssc-ev__type { position: absolute; top: .5rem; left: .5rem; background: rgba(11, 17, 32, .82);
  color: #e2e8f0; font-size: .72rem; font-weight: 600; padding: .25rem .55rem; border-radius: 999px;
  backdrop-filter: blur(4px); }
.ssc-ev__body { padding: .9rem 1rem 1rem; display: flex; flex-direction: column; gap: .35rem; }
.ssc-ev__when { font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: #7dd3fc; font-weight: 700; }
.ssc-ev__name { margin: 0; font-size: 1.12rem; line-height: 1.25; }
.ssc-ev__headline { margin: 0; font-weight: 600; color: #cbd5e1; }
.ssc-ev__desc { margin: .1rem 0 0; font-size: .92rem; opacity: .85; }
.ssc-ev__vis { margin: .35rem 0 0; font-size: .88rem; opacity: .9; }
.ssc-ev__vis strong { color: #7dd3fc; }
.ssc-ev__credit { margin: .5rem 0 0; font-size: .75rem; opacity: .85; }