/* --- Nearby alerts (police/fire dispatch) --------------------- */
  .al-lead { margin: -4px 0 10px; font: 400 0.82rem/1.5 var(--mono); color: var(--ink-dim); }

  /* calm empty/info state - the majority case for most visitors, since
     coverage is a small seed list of cities. Deliberately styled the
     same as a normal content bubble (not a warning/error color) so it
     reads as "expected", not "broken". */
  .al-empty {
    background: rgba(9, 20, 37, 0.24);
    border: 1px solid var(--panel-brd);
    border-radius: 14px;
    padding: 13px 15px;
  }
  @media (prefers-color-scheme: dark) {
    .al-empty { background: rgba(0, 0, 0, 0.22); }
  }
  .al-empty-line {
    margin: 0;
    font: 500 0.85rem/1.4 var(--sans);
    color: var(--ink-soft);
  }
  .al-empty-sub {
    margin: 6px 0 0;
    font: 400 0.76rem/1.5 var(--mono);
    color: var(--ink-dim);
  }
  .al-empty-calm .al-empty-line { color: var(--ink-dim); font-weight: 400; }

  .al-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  .al-item {
    background: rgba(9, 20, 37, 0.24);
    border: 1px solid var(--panel-brd);
    border-radius: 12px;
    padding: 11px 13px;
  }
  @media (prefers-color-scheme: dark) {
    .al-item { background: rgba(0, 0, 0, 0.22); }
  }
  .al-item-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
  }
  .al-type {
    font: 700 0.68rem/1.3 var(--mono);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--accent);
  }
  .al-ago {
    font: 400 0.68rem/1.3 var(--mono);
    color: var(--ink-dim);
    white-space: nowrap;
  }
  .al-desc {
    margin: 6px 0 0;
    font: 400 0.85rem/1.45 var(--sans);
    color: var(--ink-soft);
  }
  .al-meta {
    margin: 6px 0 0;
    font: 400 0.7rem/1.3 var(--mono);
    color: var(--ink-dim);
  }

  .al-src { margin: 8px 0 0; font: 400 0.68rem/1.4 var(--mono); color: var(--ink-dim); }
  .al-src[hidden] { display: none; }