.access-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3, 12px);
  margin: 0 0 var(--space-4, 16px);
  padding: 12px 14px;
  border: 1px solid color-mix(in srgb, var(--accent, #f5b800) 45%, transparent);
  border-left-width: 4px;
  background: color-mix(in srgb, var(--accent, #f5b800) 8%, var(--surface, #222));
  color: var(--text-primary, #f5f5f5);
  font-size: 0.9rem;
  font-weight: 650;
}

.access-banner.is-read-only {
  border-color: color-mix(in srgb, #e45d68 55%, transparent);
  background: color-mix(in srgb, #e45d68 8%, var(--surface, #222));
}

.access-banner .ghost-button {
  flex: 0 0 auto;
  min-height: 36px;
  padding: 0 12px;
}

.access-notice-sheet {
  display: grid;
  gap: 12px;
}

@media (max-width: 520px) {
  .access-banner {
    align-items: flex-start;
  }

  .access-banner span {
    line-height: 1.45;
  }
}