.dashboard-v3-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: var(--z-modal, 1000);
  display: grid;
  place-items: center;
  padding: var(--space-4, 16px);
  overflow: auto;
  background: var(--overlay-scrim, rgba(15, 23, 42, 0.48));
}

.dashboard-v3-modal {
  width: min(calc(100vw - var(--space-6, 32px)), var(--layout-dashboard-modal-width, 720px));
  max-height: calc(100dvh - var(--space-6, 32px));
  overflow: hidden;
}

.dashboard-v3-modal-head {
  position: relative;
  z-index: 1;
}

.dashboard-v3-modal-body.dashboard-v3-activity-list {
  max-height: calc(100dvh - var(--layout-dashboard-modal-body-offset, 180px));
}

.dashboard-v3-modal-body .dashboard-v3-activity-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  min-height: auto;
  padding: var(--space-3, 10px) var(--space-3, 10px);
  gap: var(--space-1, 4px) var(--space-2, 8px);
}

.dashboard-v3-modal-body .dashboard-v3-activity-row::before {
  display: none;
}

.dashboard-v3-modal-body .dashboard-v3-activity-icon {
  flex: 0 0 32px;
}

.dashboard-v3-modal-body .dashboard-v3-activity-copy {
  flex: 1 1 0;
  display: grid;
  min-width: 0;
  align-self: flex-start;
  gap: var(--space-1, 4px);
}

.dashboard-v3-modal-body .dashboard-v3-activity-copy strong {
  display: block;
  -webkit-line-clamp: unset;
  overflow: visible;
  overflow-wrap: anywhere;
}

.dashboard-v3-modal-body > .dashboard-v3-activity-row > .dashboard-v3-activity-tag,
.dashboard-v3-modal-body > .dashboard-v3-activity-row > .dashboard-v3-activity-value {
  margin-left: 40px;
  max-width: calc(100% - 40px);
  white-space: normal;
}

@media (max-width: 620px) {
  .dashboard-v3-modal-backdrop {
    place-items: start center;
    padding: calc(env(safe-area-inset-top, 0px) + var(--space-3, 12px)) var(--space-2, 8px) calc(env(safe-area-inset-bottom, 0px) + var(--space-3, 12px));
  }

  .dashboard-v3-modal {
    width: min(calc(100vw - var(--space-4, 16px)), var(--layout-dashboard-modal-width-sm, 620px));
    max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - var(--space-6, 32px));
  }

  .dashboard-v3-modal-body.dashboard-v3-activity-list {
    max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - var(--layout-dashboard-modal-body-offset-sm, 170px));
    gap: 0;
    overflow: auto;
    border-radius: var(--cockpit-radius-lg, var(--radius, 18px));
  }

  .dashboard-v3-modal-body .dashboard-v3-activity-row {
    padding: var(--space-2, 8px) var(--space-2, 8px);
    gap: var(--space-1, 4px) var(--space-2, 8px);
    border-radius: 0;
    background: transparent;
  }

  .dashboard-v3-modal-body .dashboard-v3-activity-icon {
    width: 24px;
    height: 24px;
    min-width: 24px;
    flex-basis: 24px;
    border-radius: var(--radius-sm, 10px);
  }

  .dashboard-v3-modal-body .dashboard-v3-activity-copy strong {
    font-size: 12.5px;
    line-height: 1.35;
    font-weight: 800;
  }

  .dashboard-v3-modal-body .dashboard-v3-activity-copy small {
    font-size: 10.5px;
    line-height: 1.2;
  }

  .dashboard-v3-modal-body .dashboard-v3-activity-badges {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-1, 4px);
    margin-top: 0;
  }

  .dashboard-v3-modal-body .dashboard-v3-activity-entry,
  .dashboard-v3-modal-body .dashboard-v3-activity-side,
  .dashboard-v3-modal-body .dashboard-v3-activity-tag,
  .dashboard-v3-modal-body .dashboard-v3-activity-value {
    min-height: 20px;
    max-width: 100%;
    padding: 2px 6px;
    font-size: 9.5px !important;
    line-height: 1.15;
    white-space: normal;
  }

  .dashboard-v3-modal-body > .dashboard-v3-activity-row > .dashboard-v3-activity-tag,
  .dashboard-v3-modal-body > .dashboard-v3-activity-row > .dashboard-v3-activity-value {
    margin-left: 32px;
    max-width: calc(100% - 32px);
  }
}