@echothink-ui/inbox 0.1.0

package/src/styles.css

@@ -0,0 +1,2523 @@
+@import "@echothink-ui/core/styles.css";
+
+.eth-inbox-shell {
+  background: var(--eth-color-background);
+  container-type: inline-size;
+  color: var(--eth-color-text-primary);
+  display: grid;
+  grid-template-rows: auto minmax(0, 1fr);
+  min-block-size: 0;
+}
+
+.eth-inbox-shell__header {
+  align-items: center;
+  background: var(--eth-color-layer-01);
+  border-bottom: 1px solid var(--eth-color-border-subtle);
+  display: flex;
+  gap: var(--eth-space-lg);
+  justify-content: space-between;
+  padding: var(--eth-space-lg);
+}
+
+.eth-inbox-shell__header h2,
+.eth-inbox-shell__header p {
+  margin: 0;
+}
+
+.eth-inbox-shell__header p {
+  color: var(--eth-color-text-secondary);
+  margin-block-start: var(--eth-space-xs);
+}
+
+.eth-inbox-shell__toolbar {
+  align-items: center;
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--eth-space-sm);
+}
+
+.eth-inbox-shell__layout {
+  display: grid;
+  grid-template-columns: minmax(8rem, 0.6fr) minmax(16rem, 1fr) minmax(24rem, 2.2fr);
+  min-block-size: 0;
+}
+
+.eth-inbox-shell__layout--has-inspector {
+  grid-template-columns:
+    minmax(8rem, 0.55fr) minmax(15rem, 0.95fr) minmax(22rem, 2.1fr)
+    minmax(13rem, 0.8fr);
+}
+
+.eth-inbox-shell__folders,
+.eth-inbox-shell__list,
+.eth-inbox-shell__thread,
+.eth-inbox-shell__inspector {
+  min-block-size: 0;
+  min-width: 0;
+  overflow: auto;
+}
+
+.eth-inbox-shell__folders,
+.eth-inbox-shell__list,
+.eth-inbox-shell__thread {
+  border-inline-end: 1px solid var(--eth-color-border-subtle);
+}
+
+.eth-inbox-shell__thread {
+  background: var(--eth-color-background);
+}
+
+.eth-inbox-shell__inspector {
+  background: var(--eth-color-layer-01);
+  padding: var(--eth-space-lg);
+}
+
+.eth-inbox-folder-list,
+.eth-inbox-folders {
+  background: var(--eth-color-layer-01);
+  block-size: 100%;
+  color: var(--eth-color-text-primary);
+  inline-size: 100%;
+  min-inline-size: 0;
+}
+
+.eth-inbox-folder-list__list,
+.eth-inbox-folders__list {
+  display: grid;
+  gap: 0;
+  list-style: none;
+  margin: 0;
+  padding: var(--eth-space-sm) 0;
+}
+
+.eth-inbox-folder-list__item,
+.eth-inbox-folders__item {
+  align-items: center;
+  background: transparent;
+  border: 0;
+  border-inline-start: 3px solid transparent;
+  color: var(--eth-color-text-primary);
+  cursor: pointer;
+  display: flex;
+  font: inherit;
+  font-size: calc(0.875rem * var(--eth-text-scale, 1));
+  gap: var(--eth-space-sm);
+  inline-size: 100%;
+  justify-content: flex-start;
+  line-height: 1.2857;
+  min-block-size: var(--eth-space-3xl);
+  min-inline-size: 0;
+  padding: var(--eth-space-sm) var(--eth-space-md);
+  text-align: start;
+  transition:
+    background-color 110ms cubic-bezier(0.2, 0, 0.38, 0.9),
+    border-color 110ms cubic-bezier(0.2, 0, 0.38, 0.9);
+}
+
+.eth-inbox-folder-list__item:hover,
+.eth-inbox-folders__item:hover {
+  background: var(--eth-color-layer-hover);
+}
+
+.eth-inbox-folder-list__item--active,
+.eth-inbox-folders__item--active {
+  background: var(--eth-color-layer-selected);
+  border-inline-start-color: var(--eth-color-interactive-primary);
+  font-weight: 600;
+}
+
+.eth-inbox-folder-list__item--active .eth-inbox-folders__icon,
+.eth-inbox-folders__item--active .eth-inbox-folders__icon {
+  color: var(--eth-color-text-primary);
+}
+
+.eth-inbox-folder-list__item:focus-visible,
+.eth-inbox-folders__item:focus-visible,
+.eth-inbox-message-list__row:focus-visible,
+.eth-inbox-filter-bar__chip:focus-visible,
+.eth-inbox-recipient-picker__suggestions button:focus-visible {
+  outline: 2px solid var(--eth-color-focus);
+  outline-offset: -2px;
+}
+
+.eth-inbox-folders__icon {
+  align-items: center;
+  block-size: 1rem;
+  color: var(--eth-color-text-secondary);
+  display: inline-flex;
+  flex: 0 0 auto;
+  inline-size: 1rem;
+  justify-content: center;
+}
+
+.eth-inbox-folders__icon svg {
+  block-size: 1rem;
+  inline-size: 1rem;
+}
+
+.eth-inbox-folders__item--smart .eth-inbox-folders__icon {
+  color: var(--eth-color-link);
+}
+
+.eth-inbox-folders__label {
+  flex: 1 1 auto;
+  min-inline-size: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.eth-inbox-folders__count {
+  flex: 0 0 auto;
+  margin-inline-start: auto;
+}
+
+.eth-inbox-message-list {
+  background: var(--eth-color-layer-01);
+  border: 1px solid var(--eth-color-border-subtle);
+  color: var(--eth-color-text-primary);
+  container-type: inline-size;
+  display: grid;
+  gap: 0;
+  inline-size: 100%;
+  min-inline-size: 0;
+  overflow: hidden;
+}
+
+.eth-inbox-message-list__row {
+  background: var(--eth-color-layer-01);
+  border: 0;
+  border-bottom: 1px solid var(--eth-color-border-subtle);
+  color: var(--eth-color-text-primary);
+  cursor: pointer;
+  display: grid;
+  font: inherit;
+  grid-template-columns: 0.25rem minmax(0, 1fr);
+  inline-size: 100%;
+  min-block-size: 5.5rem;
+  padding: 0;
+  text-align: start;
+  transition:
+    background-color 110ms cubic-bezier(0.2, 0, 0.38, 0.9),
+    color 110ms cubic-bezier(0.2, 0, 0.38, 0.9);
+}
+
+.eth-inbox-message-list__row:last-of-type {
+  border-bottom: 0;
+}
+
+.eth-inbox-message-list__row:hover {
+  background: var(--eth-color-layer-hover);
+}
+
+.eth-inbox-message-list__row[aria-selected="true"] {
+  background: var(--eth-color-layer-selected);
+}
+
+.eth-inbox-message-list__row[aria-selected="true"]:hover {
+  background: var(--eth-color-layer-selected);
+}
+
+.eth-inbox-message-list__selection {
+  background: transparent;
+  block-size: 100%;
+  grid-column: 1;
+  grid-row: 1;
+}
+
+.eth-inbox-message-list__row[aria-selected="true"] .eth-inbox-message-list__selection {
+  background: var(--eth-color-interactive-primary);
+}
+
+.eth-inbox-message-list__content {
+  display: grid;
+  gap: var(--eth-space-xs);
+  grid-column: 2;
+  min-inline-size: 0;
+  padding: var(--eth-space-md) var(--eth-space-lg);
+}
+
+.eth-inbox-message-list__header {
+  align-items: baseline;
+  display: flex;
+  gap: var(--eth-space-md);
+  justify-content: space-between;
+  min-inline-size: 0;
+}
+
+.eth-inbox-message-list__from-group {
+  align-items: center;
+  display: inline-flex;
+  flex: 1 1 auto;
+  gap: var(--eth-space-xs);
+  min-inline-size: 0;
+  overflow: hidden;
+}
+
+.eth-inbox-message-list__unread {
+  background: transparent;
+  border-radius: 50%;
+  block-size: 0.5rem;
+  flex: 0 0 0.5rem;
+  inline-size: 0.5rem;
+}
+
+.eth-inbox-message-list__row--unread .eth-inbox-message-list__unread {
+  background: var(--eth-color-interactive-primary);
+}
+
+.eth-inbox-message-list__row--unread .eth-inbox-message-list__subject,
+.eth-inbox-message-list__row--unread .eth-inbox-message-list__from {
+  font-weight: 600;
+}
+
+.eth-inbox-message-list__from,
+.eth-inbox-message-list__subject,
+.eth-inbox-message-list__preview {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.eth-inbox-message-list__from {
+  flex: 1 1 auto;
+  font-size: calc(0.875rem * var(--eth-text-scale, 1));
+  line-height: 1.2857;
+}
+
+.eth-inbox-message-list__subject {
+  font-size: calc(0.875rem * var(--eth-text-scale, 1));
+  line-height: 1.2857;
+}
+
+.eth-inbox-message-list__preview {
+  line-height: 1.2857;
+}
+
+.eth-inbox-message-list__preview,
+.eth-inbox-message-list__date {
+  color: var(--eth-color-text-secondary);
+  font-size: calc(0.875rem * var(--eth-text-scale, 1));
+  line-height: 1.2857;
+}
+
+.eth-inbox-message-list__date {
+  flex: 0 0 auto;
+  justify-self: end;
+  white-space: nowrap;
+}
+
+.eth-inbox-message-list__meta {
+  align-items: center;
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--eth-space-xs);
+  margin-block-start: var(--eth-space-2xs);
+  min-inline-size: 0;
+}
+
+.eth-inbox-message-list__empty {
+  align-items: center;
+  color: var(--eth-color-text-secondary);
+  display: flex;
+  font-size: calc(0.875rem * var(--eth-text-scale, 1));
+  justify-content: center;
+  line-height: 1.2857;
+  min-block-size: 8rem;
+  padding: var(--eth-space-xl);
+  text-align: center;
+}
+
+@container (inline-size <= 30rem) {
+  .eth-inbox-message-list__content {
+    padding-inline: var(--eth-space-md);
+  }
+
+  .eth-inbox-message-list__header {
+    align-items: flex-start;
+    display: grid;
+    gap: var(--eth-space-2xs);
+  }
+
+  .eth-inbox-message-list__date {
+    justify-self: start;
+  }
+}
+
+.eth-inbox-message-thread,
+.eth-inbox-thread {
+  max-inline-size: 56rem;
+}
+
+.eth-inbox-message-preview {
+  background: var(--eth-color-layer-01);
+  border: 1px solid var(--eth-color-border-subtle);
+  border-radius: 0;
+  display: grid;
+  gap: var(--eth-space-lg);
+  inline-size: min(100%, 52rem);
+  max-inline-size: 100%;
+  min-inline-size: 0;
+  padding: var(--eth-space-lg);
+}
+
+.eth-inbox-message-preview__header,
+.eth-inbox-thread__header,
+.eth-inbox-attachment-preview__header {
+  align-items: flex-start;
+  display: flex;
+  gap: var(--eth-space-md);
+  justify-content: space-between;
+}
+
+.eth-inbox-message-preview__heading,
+.eth-inbox-thread__heading {
+  display: grid;
+  min-inline-size: 0;
+}
+
+.eth-inbox-message-preview__heading {
+  gap: var(--eth-space-sm);
+}
+
+.eth-inbox-thread__heading {
+  gap: var(--eth-space-xs);
+}
+
+.eth-inbox-message-preview__header h3,
+.eth-inbox-thread__header h2 {
+  font-size: calc(1.25rem * var(--eth-text-scale, 1));
+  font-weight: 600;
+  line-height: 1.4;
+  margin: 0;
+  overflow-wrap: anywhere;
+}
+
+.eth-inbox-message-preview__header time,
+.eth-inbox-attachment-preview__summary span,
+.eth-inbox-thread__updated {
+  color: var(--eth-color-text-secondary);
+}
+
+.eth-inbox-message-preview__header time,
+.eth-inbox-thread__updated {
+  flex: 0 0 auto;
+  font-size: calc(0.875rem * var(--eth-text-scale, 1));
+  line-height: 1.2857;
+  white-space: nowrap;
+}
+
+.eth-inbox-message-preview__header time {
+  padding-block-start: var(--eth-space-2xs);
+}
+
+.eth-inbox-message-preview__recipients {
+  align-items: center;
+  color: var(--eth-color-text-secondary);
+  display: flex;
+  flex-wrap: wrap;
+  font-size: calc(0.875rem * var(--eth-text-scale, 1));
+  gap: var(--eth-space-xs) var(--eth-space-lg);
+  line-height: 1.2857;
+  margin: 0;
+  min-inline-size: 0;
+}
+
+.eth-inbox-message-preview__recipients div {
+  display: flex;
+  gap: var(--eth-space-xs);
+  min-inline-size: 0;
+}
+
+.eth-inbox-message-preview__recipients dt {
+  color: var(--eth-color-text-secondary);
+  font-weight: 600;
+}
+
+.eth-inbox-message-preview__recipients dd {
+  color: var(--eth-color-text-primary);
+  margin: 0;
+  min-inline-size: 0;
+  overflow-wrap: anywhere;
+}
+
+.eth-inbox-message-preview__body,
+.eth-inbox-thread {
+  line-height: 1.5;
+}
+
+.eth-inbox-message-preview__body {
+  color: var(--eth-color-text-primary);
+  font-size: calc(1rem * var(--eth-text-scale, 1));
+  line-height: 1.5;
+}
+
+.eth-inbox-message-preview__body p {
+  margin: 0;
+  max-inline-size: 72ch;
+  overflow-wrap: anywhere;
+  white-space: pre-wrap;
+}
+
+.eth-inbox-message-preview__attachments {
+  display: grid;
+  gap: var(--eth-space-sm);
+  min-inline-size: 0;
+}
+
+.eth-inbox-message-preview__attachments h4 {
+  color: var(--eth-color-text-secondary);
+  font-size: calc(0.75rem * var(--eth-text-scale, 1));
+  font-weight: 600;
+  line-height: 1.3333;
+  margin: 0;
+  text-transform: uppercase;
+}
+
+.eth-inbox-message-preview__attachments .eth-inbox-attachments {
+  inline-size: 100%;
+}
+
+.eth-inbox-thread {
+  background: var(--eth-color-layer-01);
+  border: 1px solid var(--eth-color-border-subtle);
+  display: grid;
+  gap: 0;
+  inline-size: min(100%, 56rem);
+  margin-inline: auto;
+  padding: 0;
+}
+
+.eth-inbox-thread__header {
+  background: var(--eth-color-layer-02);
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+  padding: var(--eth-space-lg);
+}
+
+.eth-inbox-thread__eyebrow,
+.eth-inbox-thread__summary-label {
+  color: var(--eth-color-text-secondary);
+  font-size: calc(0.75rem * var(--eth-text-scale, 1));
+  font-weight: 600;
+  line-height: 1.3333;
+}
+
+.eth-inbox-thread__meta,
+.eth-inbox-thread__actions {
+  align-items: center;
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--eth-space-sm);
+}
+
+.eth-inbox-thread__meta {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+
+.eth-inbox-thread__meta li {
+  align-items: center;
+  display: inline-flex;
+  min-inline-size: 0;
+}
+
+.eth-inbox-thread__actions {
+  justify-content: flex-end;
+  margin-inline-start: auto;
+}
+
+.eth-inbox-thread__summary {
+  background: var(--eth-color-layer-01);
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+  display: grid;
+  gap: var(--eth-space-sm);
+  padding: var(--eth-space-md) var(--eth-space-lg);
+}
+
+.eth-inbox-thread__summary-body {
+  color: var(--eth-color-text-primary);
+  font-size: calc(0.875rem * var(--eth-text-scale, 1));
+  line-height: 1.2857;
+}
+
+.eth-inbox-thread__summary-body > :first-child {
+  margin-block-start: 0;
+}
+
+.eth-inbox-thread__summary-body > :last-child {
+  margin-block-end: 0;
+}
+
+.eth-inbox-thread__empty {
+  background: var(--eth-color-layer-01);
+  color: var(--eth-color-text-secondary);
+  display: grid;
+  gap: var(--eth-space-xs);
+  padding: var(--eth-space-2xl);
+}
+
+.eth-inbox-thread__empty strong {
+  color: var(--eth-color-text-primary);
+}
+
+.eth-inbox-thread__messages,
+.eth-inbox-thread__older {
+  display: grid;
+  gap: 0;
+}
+
+.eth-inbox-thread__older {
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+}
+
+.eth-inbox-thread__older summary {
+  align-items: center;
+  background: var(--eth-color-layer-01);
+  color: var(--eth-color-text-secondary);
+  cursor: pointer;
+  display: flex;
+  font-size: calc(0.875rem * var(--eth-text-scale, 1));
+  font-weight: 600;
+  line-height: 1.2857;
+  min-block-size: var(--eth-space-3xl);
+  padding: var(--eth-space-sm) var(--eth-space-lg);
+}
+
+.eth-inbox-thread__older summary:hover {
+  background: var(--eth-color-layer-hover);
+  color: var(--eth-color-text-primary);
+}
+
+.eth-inbox-thread__older summary:focus-visible {
+  outline: 2px solid var(--eth-color-focus);
+  outline-offset: -2px;
+}
+
+.eth-inbox-thread__messages .eth-inbox-message-preview,
+.eth-inbox-thread__older .eth-inbox-message-preview {
+  border: 0;
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+  inline-size: 100%;
+  max-inline-size: none;
+  padding: var(--eth-space-lg);
+}
+
+.eth-inbox-thread__messages .eth-inbox-message-preview:last-child,
+.eth-inbox-thread__older .eth-inbox-message-preview:last-child {
+  border-block-end: 0;
+}
+
+.eth-inbox-message-composer,
+.eth-inbox-composer {
+  background: var(--eth-color-layer-01);
+  border: 1px solid var(--eth-color-border-subtle);
+  border-radius: 0;
+  display: grid;
+  gap: 0;
+  inline-size: min(100%, 58rem);
+  margin-inline: auto;
+  overflow: hidden;
+  padding: 0;
+}
+
+.eth-inbox-composer__fields,
+.eth-inbox-composer__address-fields {
+  display: grid;
+  gap: 0;
+}
+
+.eth-inbox-composer__field.eth-form-field {
+  align-items: center;
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+  column-gap: var(--eth-space-md);
+  display: grid;
+  grid-template-columns: minmax(4rem, 5rem) minmax(0, 1fr);
+  min-inline-size: 0;
+  padding: var(--eth-space-sm) var(--eth-space-lg);
+}
+
+.eth-inbox-composer__field.eth-form-field .cds--label {
+  margin: 0;
+}
+
+.eth-inbox-composer__field .cds--text-input-wrapper,
+.eth-inbox-composer__field .cds--text-area__wrapper,
+.eth-inbox-composer__field .cds--text-input,
+.eth-inbox-composer__field .cds--text-area {
+  inline-size: 100%;
+  max-inline-size: none;
+  min-inline-size: 0;
+}
+
+.eth-inbox-composer__field--address .cds--text-input,
+.eth-inbox-composer__field--subject .cds--text-input {
+  background: transparent;
+  border-block-end-color: transparent;
+  padding-inline: 0;
+}
+
+.eth-inbox-composer__field--address .cds--text-input:focus,
+.eth-inbox-composer__field--subject .cds--text-input:focus {
+  outline: 2px solid var(--eth-color-focus);
+  outline-offset: -2px;
+}
+
+.eth-inbox-composer__field--body.eth-form-field {
+  align-items: stretch;
+  gap: var(--eth-space-sm);
+  grid-template-columns: minmax(0, 1fr);
+  padding-block: var(--eth-space-md);
+}
+
+.eth-inbox-composer__field--body .cds--text-area {
+  min-block-size: 14rem;
+  resize: vertical;
+}
+
+.eth-inbox-composer__attachments {
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+  display: grid;
+  gap: 0;
+}
+
+.eth-inbox-composer__attachments-header {
+  align-items: center;
+  background: var(--eth-color-layer-02);
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+  color: var(--eth-color-text-primary);
+  display: flex;
+  flex-wrap: wrap;
+  font-size: calc(0.875rem * var(--eth-text-scale, 1));
+  font-weight: 600;
+  gap: var(--eth-space-sm);
+  justify-content: space-between;
+  line-height: 1.2857;
+  min-block-size: var(--eth-space-3xl);
+  padding: var(--eth-space-sm) var(--eth-space-lg);
+}
+
+.eth-inbox-composer__attachments .eth-inbox-attachments {
+  border: 0;
+}
+
+.eth-inbox-composer__empty-attachments,
+.eth-inbox-composer__status {
+  color: var(--eth-color-text-secondary);
+  font-size: calc(0.75rem * var(--eth-text-scale, 1));
+  line-height: 1.3333;
+  margin: 0;
+}
+
+.eth-inbox-composer__empty-attachments {
+  padding: var(--eth-space-md) var(--eth-space-lg);
+}
+
+.eth-inbox-composer__footer {
+  align-items: center;
+  background: var(--eth-color-layer-02);
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--eth-space-md);
+  justify-content: space-between;
+  min-block-size: 2.5rem;
+  padding: var(--eth-space-md) var(--eth-space-lg);
+}
+
+.eth-inbox-composer__actions,
+.eth-inbox-send-approval__actions,
+.eth-inbox-agent-draft__actions,
+.eth-inbox-attachments__actions {
+  align-items: center;
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--eth-space-sm);
+}
+
+.eth-inbox-composer__actions {
+  margin-inline-start: auto;
+}
+
+.eth-inbox-message-filter-bar,
+.eth-inbox-filter-bar {
+  align-items: center;
+  background: var(--eth-color-layer-01);
+  border: 1px solid var(--eth-color-border-subtle);
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--eth-space-xs);
+  inline-size: fit-content;
+  max-inline-size: 100%;
+  min-inline-size: 0;
+  padding: var(--eth-space-xs);
+}
+
+.eth-inbox-filter-bar__chip {
+  align-items: center;
+  appearance: none;
+  background: var(--eth-color-layer-02);
+  border: 1px solid var(--eth-color-border-subtle);
+  border-radius: 0;
+  color: var(--eth-color-text-primary);
+  cursor: pointer;
+  display: inline-flex;
+  font: inherit;
+  gap: var(--eth-space-sm);
+  min-block-size: var(--eth-space-2xl);
+  min-inline-size: 0;
+  padding: 0 var(--eth-space-md);
+  text-align: start;
+  transition:
+    background-color 110ms cubic-bezier(0.2, 0, 0.38, 0.9),
+    border-color 110ms cubic-bezier(0.2, 0, 0.38, 0.9),
+    box-shadow 110ms cubic-bezier(0.2, 0, 0.38, 0.9);
+}
+
+.eth-inbox-filter-bar__chip:hover {
+  background: var(--eth-color-layer-hover);
+}
+
+.eth-inbox-filter-bar__chip--active {
+  background: var(--eth-color-layer-selected);
+  border-color: var(--eth-color-interactive-primary);
+  box-shadow: inset 0 -2px 0 var(--eth-color-interactive-primary);
+}
+
+.eth-inbox-filter-bar__chip--active:hover {
+  background: var(--eth-color-layer-selected);
+}
+
+.eth-inbox-filter-bar__chip:disabled,
+.eth-inbox-filter-bar__chip--disabled {
+  color: #8d8d8d;
+  cursor: not-allowed;
+}
+
+.eth-inbox-filter-bar__chip:disabled {
+  background: var(--eth-color-layer-01);
+  border-color: var(--eth-color-border-subtle);
+  box-shadow: none;
+}
+
+.eth-inbox-filter-bar__kind {
+  color: var(--eth-color-text-secondary);
+  flex: 0 0 auto;
+  font-size: calc(0.75rem * var(--eth-text-scale, 1));
+  font-weight: 600;
+  line-height: 1.3333;
+  white-space: nowrap;
+}
+
+.eth-inbox-filter-bar__chip--active .eth-inbox-filter-bar__kind {
+  color: var(--eth-color-link);
+}
+
+.eth-inbox-filter-bar__chip:disabled .eth-inbox-filter-bar__kind,
+.eth-inbox-filter-bar__chip--disabled .eth-inbox-filter-bar__kind {
+  color: inherit;
+}
+
+.eth-inbox-filter-bar__label {
+  flex: 1 1 auto;
+  font-size: calc(0.875rem * var(--eth-text-scale, 1));
+  line-height: 1.2857;
+  min-inline-size: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.eth-inbox-filter-bar__chip--active .eth-inbox-filter-bar__label {
+  font-weight: 600;
+}
+
+.eth-inbox-recipient-picker {
+  background: var(--eth-color-layer-01);
+  border: 1px solid var(--eth-color-border-subtle);
+  border-radius: 0;
+  display: grid;
+  gap: 0;
+  inline-size: min(100%, 46rem);
+  margin-inline: auto;
+  overflow: hidden;
+  padding: 0;
+}
+
+.eth-inbox-recipient-picker__selected {
+  align-items: center;
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+  column-gap: var(--eth-space-md);
+  display: grid;
+  grid-template-columns: minmax(2.5rem, auto) minmax(0, 1fr);
+  min-block-size: 2.5rem;
+  min-inline-size: 0;
+  padding: var(--eth-space-sm) var(--eth-space-lg);
+}
+
+.eth-inbox-recipient-picker__label {
+  color: var(--eth-color-text-secondary);
+  font-size: calc(0.75rem * var(--eth-text-scale, 1));
+  font-weight: 600;
+  line-height: 1.3333;
+}
+
+.eth-inbox-recipient-picker__chips {
+  align-items: center;
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--eth-space-xs);
+  min-inline-size: 0;
+}
+
+.eth-inbox-recipient-picker__placeholder {
+  color: var(--eth-color-text-secondary);
+  font-size: calc(0.875rem * var(--eth-text-scale, 1));
+  line-height: 1.2857;
+}
+
+.eth-inbox-recipient-picker__search {
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+}
+
+.eth-inbox-recipient-picker__manual {
+  align-items: end;
+  background: var(--eth-color-layer-02);
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+  display: grid;
+  gap: var(--eth-space-sm);
+  grid-template-columns: minmax(12rem, 1fr) auto;
+  min-inline-size: 0;
+  padding: var(--eth-space-md) var(--eth-space-lg);
+}
+
+.eth-inbox-recipient-picker__manual-input,
+.eth-inbox-recipient-picker__manual-input .cds--text-input-wrapper,
+.eth-inbox-recipient-picker__manual-input .cds--text-input {
+  inline-size: 100%;
+  max-inline-size: none;
+  min-inline-size: 0;
+}
+
+.eth-inbox-recipient-picker__suggestions {
+  background: var(--eth-color-layer-01);
+  border: 0;
+  border-radius: 0;
+  display: grid;
+  gap: 0;
+  min-inline-size: 0;
+}
+
+.eth-inbox-recipient-picker__suggestions-header {
+  align-items: center;
+  background: var(--eth-color-layer-02);
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+  color: var(--eth-color-text-secondary);
+  display: flex;
+  flex-wrap: wrap;
+  font-size: calc(0.75rem * var(--eth-text-scale, 1));
+  gap: var(--eth-space-sm);
+  justify-content: space-between;
+  line-height: 1.3333;
+  min-block-size: var(--eth-space-2xl);
+  padding: var(--eth-space-sm) var(--eth-space-lg);
+}
+
+.eth-inbox-recipient-picker__suggestions-header strong {
+  color: var(--eth-color-text-primary);
+  font-weight: 600;
+}
+
+.eth-inbox-recipient-picker__suggestions-list {
+  list-style: none;
+  margin: 0;
+  max-block-size: 14rem;
+  overflow: auto;
+  padding: 0;
+}
+
+.eth-inbox-recipient-picker__suggestions-list li {
+  margin: 0;
+}
+
+.eth-inbox-recipient-picker__suggestions button {
+  background: transparent;
+  border: 0;
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+  color: var(--eth-color-text-primary);
+  cursor: pointer;
+  display: grid;
+  gap: var(--eth-space-md);
+  grid-template-columns: minmax(0, 1fr) auto;
+  inline-size: 100%;
+  min-block-size: 2.5rem;
+  padding: var(--eth-space-sm) var(--eth-space-lg);
+  text-align: start;
+}
+
+.eth-inbox-recipient-picker__suggestions li:last-child button {
+  border-block-end: 0;
+}
+
+.eth-inbox-recipient-picker__suggestions button:hover {
+  background: var(--eth-color-layer-hover);
+}
+
+.eth-inbox-recipient-picker__suggestions button[aria-selected="true"] {
+  background: var(--eth-color-layer-selected);
+  box-shadow: inset 3px 0 0 var(--eth-color-interactive-primary);
+}
+
+.eth-inbox-recipient-picker__suggestions button[aria-disabled="true"] {
+  cursor: default;
+}
+
+.eth-inbox-recipient-picker__suggestion-copy {
+  display: grid;
+  gap: var(--eth-space-2xs);
+  min-inline-size: 0;
+}
+
+.eth-inbox-recipient-picker__suggestion-copy strong {
+  font-size: calc(0.875rem * var(--eth-text-scale, 1));
+  font-weight: 600;
+  line-height: 1.2857;
+  min-inline-size: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.eth-inbox-recipient-picker__suggestion-copy span,
+.eth-inbox-recipient-picker__suggestion-status,
+.eth-inbox-recipient-picker__empty,
+.eth-inbox-attachments__meta {
+  color: var(--eth-color-text-secondary);
+}
+
+.eth-inbox-recipient-picker__suggestion-status {
+  align-self: center;
+  font-size: calc(0.75rem * var(--eth-text-scale, 1));
+  font-weight: 600;
+  line-height: 1.3333;
+}
+
+.eth-inbox-recipient-picker__empty {
+  font-size: calc(0.875rem * var(--eth-text-scale, 1));
+  line-height: 1.2857;
+  margin: 0;
+  padding: var(--eth-space-md) var(--eth-space-lg);
+}
+
+.eth-inbox-attachment-list,
+.eth-inbox-attachments {
+  background: var(--eth-color-layer-01);
+  border: 1px solid var(--eth-color-border-subtle);
+  display: grid;
+  gap: 0;
+}
+
+.eth-inbox-attachments__tile {
+  align-items: center;
+  background: var(--eth-color-layer-01);
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+  border-radius: 0;
+  display: grid;
+  gap: var(--eth-space-md);
+  grid-template-columns: auto minmax(0, 1fr) auto;
+  min-block-size: 4rem;
+  padding: var(--eth-space-md);
+  transition: background-color 110ms cubic-bezier(0.2, 0, 0.38, 0.9);
+}
+
+.eth-inbox-attachments__tile:last-child {
+  border-block-end: 0;
+}
+
+.eth-inbox-attachments__tile:hover {
+  background: var(--eth-color-layer-hover);
+}
+
+.eth-inbox-attachments__icon {
+  align-items: center;
+  background: var(--eth-color-layer-02);
+  border: 1px solid var(--eth-color-border-subtle);
+  color: var(--eth-color-text-secondary);
+  display: inline-flex;
+  justify-content: center;
+  block-size: 2.5rem;
+  inline-size: 2.5rem;
+}
+
+.eth-inbox-attachments__content {
+  display: grid;
+  gap: var(--eth-space-2xs);
+  min-width: 0;
+}
+
+.eth-inbox-attachments__content strong {
+  color: var(--eth-color-text-primary);
+  font-size: calc(0.875rem * var(--eth-text-scale, 1));
+  font-weight: 600;
+  line-height: 1.2857;
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.eth-inbox-attachments__meta {
+  align-items: center;
+  display: flex;
+  flex-wrap: wrap;
+  font-size: calc(0.75rem * var(--eth-text-scale, 1));
+  gap: var(--eth-space-sm);
+  line-height: 1.3333;
+  min-width: 0;
+}
+
+.eth-inbox-attachments__type {
+  border: 1px solid var(--eth-color-border-subtle);
+  color: var(--eth-color-text-primary);
+  font-weight: 600;
+  line-height: 1rem;
+  padding-inline: var(--eth-space-xs);
+}
+
+.eth-inbox-attachments__actions {
+  gap: var(--eth-space-2xs);
+  justify-content: flex-end;
+}
+
+.eth-inbox-attachment-preview {
+  background: var(--eth-color-layer-01);
+  border: 1px solid var(--eth-color-border-subtle);
+  border-radius: 0;
+  display: grid;
+  gap: 0;
+  inline-size: 100%;
+  margin-inline: auto;
+  max-inline-size: 56rem;
+  min-width: 0;
+  overflow: hidden;
+}
+
+.eth-inbox-attachment-preview__header {
+  align-items: center;
+  background: var(--eth-color-layer-02);
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+  flex-wrap: wrap;
+  padding: var(--eth-space-md);
+}
+
+.eth-inbox-attachment-preview__file {
+  align-items: center;
+  display: grid;
+  flex: 1 1 16rem;
+  gap: var(--eth-space-sm);
+  grid-template-columns: auto minmax(0, 1fr);
+  min-width: 0;
+}
+
+.eth-inbox-attachment-preview__glyph {
+  align-items: end;
+  background: var(--eth-color-layer-01);
+  block-size: 2.75rem;
+  border: 1px solid var(--eth-color-border-subtle);
+  border-block-end: 3px solid var(--eth-color-text-secondary);
+  color: var(--eth-color-text-secondary);
+  display: inline-flex;
+  font-size: calc(0.625rem * var(--eth-text-scale, 1));
+  font-weight: 600;
+  inline-size: 2.25rem;
+  justify-content: center;
+  line-height: 1;
+  padding: 0 0 var(--eth-space-xs);
+  position: relative;
+}
+
+.eth-inbox-attachment-preview__glyph::after {
+  border-block-start: 0.625rem solid var(--eth-color-layer-02);
+  border-inline-start: 0.625rem solid var(--eth-color-border-subtle);
+  content: "";
+  inset-block-start: -1px;
+  inset-inline-end: -1px;
+  position: absolute;
+}
+
+.eth-inbox-attachment-preview__glyph[data-kind="pdf"] {
+  border-block-end-color: var(--eth-color-danger);
+  color: var(--eth-color-danger);
+}
+
+.eth-inbox-attachment-preview__glyph[data-kind="image"],
+.eth-inbox-attachment-preview__glyph[data-kind="text"] {
+  border-block-end-color: var(--eth-color-info);
+  color: var(--eth-color-info);
+}
+
+.eth-inbox-attachment-preview__glyph[data-kind="spreadsheet"] {
+  border-block-end-color: var(--eth-color-success);
+  color: var(--eth-color-success);
+}
+
+.eth-inbox-attachment-preview__summary {
+  display: grid;
+  gap: var(--eth-space-2xs);
+  min-width: 0;
+}
+
+.eth-inbox-attachment-preview__summary strong {
+  line-height: 1.375;
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.eth-inbox-attachment-preview__summary span {
+  font-size: calc(0.875rem * var(--eth-text-scale, 1));
+  line-height: 1.2857;
+  overflow-wrap: anywhere;
+}
+
+.eth-inbox-attachment-preview__state {
+  background: var(--eth-color-layer-01);
+  border: 1px solid var(--eth-color-border-subtle);
+  color: var(--eth-color-text-secondary);
+  font-size: calc(0.75rem * var(--eth-text-scale, 1));
+  font-weight: 600;
+  line-height: 1.333;
+  padding: var(--eth-space-xs) var(--eth-space-sm);
+  white-space: nowrap;
+}
+
+.eth-inbox-attachment-preview__body {
+  background: var(--eth-color-background);
+  color: var(--eth-color-text-primary);
+  display: grid;
+  min-block-size: 18rem;
+  overflow: auto;
+  padding: var(--eth-space-lg);
+  place-items: center;
+}
+
+.eth-inbox-attachment-preview__body--archive,
+.eth-inbox-attachment-preview__body--empty,
+.eth-inbox-attachment-preview__body--file {
+  min-block-size: 9rem;
+}
+
+.eth-inbox-attachment-preview__image {
+  block-size: auto;
+  max-block-size: 28rem;
+  max-inline-size: 100%;
+  object-fit: contain;
+}
+
+.eth-inbox-attachment-preview__image-frame {
+  aspect-ratio: 16 / 9;
+  background:
+    linear-gradient(135deg, rgba(15, 98, 254, 0.08), transparent 52%),
+    linear-gradient(0deg, var(--eth-color-layer-02), var(--eth-color-layer-02));
+  border: 1px solid var(--eth-color-border-subtle);
+  inline-size: min(100%, 34rem);
+  overflow: hidden;
+  position: relative;
+}
+
+.eth-inbox-attachment-preview__image-frame span:first-child {
+  background: var(--eth-color-layer-01);
+  block-size: 52%;
+  border: 1px solid var(--eth-color-border-subtle);
+  inline-size: 42%;
+  inset-block-start: 18%;
+  inset-inline-start: 12%;
+  position: absolute;
+}
+
+.eth-inbox-attachment-preview__image-frame span:last-child {
+  background: var(--eth-color-border-subtle);
+  block-size: 38%;
+  clip-path: polygon(0 100%, 42% 35%, 64% 62%, 82% 28%, 100% 100%);
+  inline-size: 76%;
+  inset-block-end: 12%;
+  inset-inline-start: 12%;
+  position: absolute;
+}
+
+.eth-inbox-attachment-preview__document {
+  background: var(--eth-color-layer-01);
+  border: 1px solid var(--eth-color-border-subtle);
+  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
+  display: grid;
+  grid-template-rows: auto minmax(0, 1fr);
+  inline-size: min(100%, 40rem);
+  min-block-size: 15rem;
+}
+
+.eth-inbox-attachment-preview__document-bar {
+  align-items: center;
+  background: var(--eth-color-layer-02);
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+  color: var(--eth-color-text-secondary);
+  display: flex;
+  font-size: calc(0.75rem * var(--eth-text-scale, 1));
+  justify-content: space-between;
+  line-height: 1.333;
+  padding: var(--eth-space-sm) var(--eth-space-md);
+}
+
+.eth-inbox-attachment-preview__page {
+  align-content: start;
+  background: #ffffff;
+  border: 1px solid #e0e0e0;
+  color: #161616;
+  display: grid;
+  gap: var(--eth-space-sm);
+  inline-size: min(100%, 26rem);
+  margin: var(--eth-space-lg) auto;
+  min-block-size: 12rem;
+  padding: var(--eth-space-lg);
+}
+
+.eth-inbox-attachment-preview__page strong {
+  font-size: calc(1rem * var(--eth-text-scale, 1));
+  line-height: 1.375;
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.eth-inbox-attachment-preview__page span,
+.eth-inbox-attachment-preview__text span {
+  background: var(--eth-color-border-subtle);
+  block-size: 0.625rem;
+  display: block;
+}
+
+.eth-inbox-attachment-preview__page span:nth-child(2) {
+  inline-size: 92%;
+}
+
+.eth-inbox-attachment-preview__page span:nth-child(3) {
+  inline-size: 76%;
+}
+
+.eth-inbox-attachment-preview__page span:nth-child(4) {
+  inline-size: 88%;
+}
+
+.eth-inbox-attachment-preview__page span:nth-child(5) {
+  inline-size: 64%;
+}
+
+.eth-inbox-attachment-preview__page span:nth-child(6) {
+  inline-size: 82%;
+}
+
+.eth-inbox-attachment-preview__text {
+  background: var(--eth-color-layer-01);
+  border: 1px solid var(--eth-color-border-subtle);
+  display: grid;
+  gap: var(--eth-space-sm);
+  inline-size: min(100%, 36rem);
+  padding: var(--eth-space-lg);
+}
+
+.eth-inbox-attachment-preview__text span:nth-child(1),
+.eth-inbox-attachment-preview__text span:nth-child(5) {
+  inline-size: 88%;
+}
+
+.eth-inbox-attachment-preview__text span:nth-child(2),
+.eth-inbox-attachment-preview__text span:nth-child(7) {
+  inline-size: 72%;
+}
+
+.eth-inbox-attachment-preview__text span:nth-child(3),
+.eth-inbox-attachment-preview__text span:nth-child(6) {
+  inline-size: 95%;
+}
+
+.eth-inbox-attachment-preview__text span:nth-child(4),
+.eth-inbox-attachment-preview__text span:nth-child(8),
+.eth-inbox-attachment-preview__text span:nth-child(9) {
+  inline-size: 58%;
+}
+
+.eth-inbox-attachment-preview__sheet {
+  background: var(--eth-color-layer-01);
+  border-block-start: 1px solid var(--eth-color-border-subtle);
+  border-inline-start: 1px solid var(--eth-color-border-subtle);
+  display: grid;
+  grid-template-columns: repeat(5, minmax(0, 1fr));
+  inline-size: min(100%, 38rem);
+}
+
+.eth-inbox-attachment-preview__sheet span {
+  background: var(--eth-color-layer-01);
+  block-size: 2rem;
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+  border-inline-end: 1px solid var(--eth-color-border-subtle);
+}
+
+.eth-inbox-attachment-preview__sheet span:nth-child(-n + 5) {
+  background: var(--eth-color-layer-02);
+}
+
+.eth-inbox-attachment-preview__sheet span:nth-child(7),
+.eth-inbox-attachment-preview__sheet span:nth-child(13),
+.eth-inbox-attachment-preview__sheet span:nth-child(19) {
+  background: rgba(36, 161, 72, 0.1);
+}
+
+.eth-inbox-attachment-preview__empty {
+  color: var(--eth-color-text-secondary);
+  display: grid;
+  gap: var(--eth-space-xs);
+  max-inline-size: 28rem;
+  text-align: center;
+}
+
+.eth-inbox-attachment-preview__empty strong {
+  color: var(--eth-color-text-primary);
+}
+
+.eth-inbox-label-manager__list,
+.eth-inbox-rules__list,
+.eth-inbox-priority {
+  display: grid;
+  gap: var(--eth-space-sm);
+}
+
+.eth-inbox-label-manager {
+  background: var(--eth-color-layer-01);
+  border: 1px solid var(--eth-color-border-subtle);
+  border-radius: 0;
+  gap: 0;
+  inline-size: 100%;
+  max-inline-size: 64rem;
+}
+
+.eth-inbox-label-manager > .eth-panel__header {
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+  padding: var(--eth-space-lg);
+}
+
+.eth-inbox-label-manager > .eth-panel__header h3 {
+  font-size: calc(1.25rem * var(--eth-text-scale, 1));
+  line-height: 1.4;
+}
+
+.eth-inbox-label-manager > .eth-panel__body {
+  display: grid;
+  gap: var(--eth-space-lg);
+  min-width: 0;
+  padding: var(--eth-space-lg);
+}
+
+.eth-inbox-label-manager__list {
+  border: 1px solid var(--eth-color-border-subtle);
+  gap: 0;
+  min-width: 0;
+}
+
+.eth-inbox-label-manager__table-head,
+.eth-inbox-label-manager__row {
+  display: grid;
+  gap: var(--eth-space-md);
+  grid-template-columns: minmax(14rem, 1fr) minmax(7rem, 9rem) minmax(12rem, max-content);
+  min-width: 0;
+}
+
+.eth-inbox-label-manager__table-head {
+  background: var(--eth-color-layer-02);
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+  color: var(--eth-color-text-secondary);
+  font-size: calc(0.75rem * var(--eth-text-scale, 1));
+  font-weight: 600;
+  line-height: 1.333;
+  padding: var(--eth-space-sm) var(--eth-space-md);
+}
+
+.eth-inbox-label-manager__table-head span:last-child {
+  justify-self: end;
+}
+
+.eth-inbox-label-manager__row {
+  align-items: center;
+  background: var(--eth-color-layer-01);
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+  min-block-size: 4rem;
+  padding: var(--eth-space-sm) var(--eth-space-md);
+}
+
+.eth-inbox-label-manager__row:last-child {
+  border-block-end: 0;
+}
+
+.eth-inbox-label-manager__row:hover {
+  background: var(--eth-color-layer-hover);
+}
+
+.eth-inbox-label-manager__name-cell,
+.eth-inbox-label-manager__count-cell {
+  min-width: 0;
+}
+
+.eth-inbox-label-manager__name-cell .cds--form-item {
+  margin: 0;
+}
+
+.eth-inbox-label-manager__count-cell {
+  align-items: baseline;
+  color: var(--eth-color-text-secondary);
+  display: flex;
+  gap: var(--eth-space-xs);
+  white-space: nowrap;
+}
+
+.eth-inbox-label-manager__count-cell strong {
+  color: var(--eth-color-text-primary);
+  font-size: calc(1rem * var(--eth-text-scale, 1));
+  font-weight: 600;
+  line-height: 1.375;
+}
+
+.eth-inbox-label-manager__count-cell span,
+.eth-inbox-label-manager__count-muted {
+  font-size: calc(0.75rem * var(--eth-text-scale, 1));
+  line-height: 1.333;
+}
+
+.eth-inbox-label-manager__actions {
+  align-items: center;
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--eth-space-sm);
+  justify-content: flex-end;
+  min-width: 0;
+}
+
+.eth-inbox-label-manager__empty {
+  background: var(--eth-color-layer-02);
+  border: 1px dashed var(--eth-color-border-subtle);
+  color: var(--eth-color-text-secondary);
+  margin: 0;
+  padding: var(--eth-space-lg);
+}
+
+.eth-inbox-label-manager__create {
+  align-items: end;
+  background: var(--eth-color-layer-02);
+  border: 1px solid var(--eth-color-border-subtle);
+  display: grid;
+  gap: var(--eth-space-md);
+  grid-template-columns: minmax(14rem, 24rem) auto;
+  justify-content: start;
+  padding: var(--eth-space-md);
+}
+
+.eth-inbox-label-manager__create .eth-form-field {
+  margin: 0;
+}
+
+.eth-inbox-priority-view,
+.eth-inbox-priority {
+  container-type: inline-size;
+  display: grid;
+  gap: var(--eth-space-lg);
+  inline-size: min(100%, 72rem);
+  min-inline-size: 0;
+}
+
+.eth-inbox-priority__group {
+  background: var(--eth-color-layer-01);
+  border: 1px solid var(--eth-color-border-subtle);
+  border-radius: 0;
+  min-inline-size: 0;
+  overflow: hidden;
+}
+
+.eth-inbox-priority__group-header {
+  align-items: center;
+  background: var(--eth-color-layer-02);
+  border-bottom: 1px solid var(--eth-color-border-subtle);
+  display: grid;
+  gap: var(--eth-space-md);
+  grid-template-columns: minmax(0, 1fr) max-content;
+  min-block-size: var(--eth-space-3xl);
+  padding: var(--eth-space-md) var(--eth-space-lg);
+}
+
+.eth-inbox-priority__heading {
+  display: grid;
+  gap: var(--eth-space-2xs);
+  min-inline-size: 0;
+}
+
+.eth-inbox-priority__group h3 {
+  color: var(--eth-color-text-primary);
+  font-size: calc(1rem * var(--eth-text-scale, 1));
+  font-weight: 600;
+  line-height: 1.375;
+  margin: 0;
+  min-inline-size: 0;
+  overflow-wrap: anywhere;
+}
+
+.eth-inbox-priority__description {
+  color: var(--eth-color-text-secondary);
+  font-size: calc(0.75rem * var(--eth-text-scale, 1));
+  line-height: 1.333;
+  margin: 0;
+}
+
+.eth-inbox-priority__count {
+  align-items: center;
+  background: var(--eth-color-layer-01);
+  border: 1px solid var(--eth-color-border-subtle);
+  color: var(--eth-color-text-secondary);
+  display: inline-flex;
+  font-size: calc(0.75rem * var(--eth-text-scale, 1));
+  font-variant-numeric: tabular-nums;
+  font-weight: 600;
+  justify-content: center;
+  line-height: 1.333;
+  min-block-size: 1.5rem;
+  padding: 0 var(--eth-space-sm);
+  white-space: nowrap;
+}
+
+.eth-inbox-priority__group .eth-inbox-message-list {
+  border: 0;
+}
+
+.eth-inbox-priority__group .eth-inbox-message-list__row {
+  min-block-size: 5rem;
+}
+
+.eth-inbox-priority__empty {
+  align-items: center;
+  background: var(--eth-color-layer-02);
+  border: 1px dashed var(--eth-color-border-subtle);
+  color: var(--eth-color-text-secondary);
+  display: flex;
+  font-size: calc(0.875rem * var(--eth-text-scale, 1));
+  justify-content: center;
+  line-height: 1.2857;
+  min-block-size: 7rem;
+  padding: var(--eth-space-xl);
+  text-align: center;
+}
+
+@container (inline-size <= 34rem) {
+  .eth-inbox-priority__group-header {
+    align-items: start;
+    grid-template-columns: minmax(0, 1fr);
+  }
+
+  .eth-inbox-priority__count {
+    justify-self: start;
+  }
+}
+
+.eth-inbox-email-automation,
+.eth-inbox-rules {
+  display: grid;
+  gap: var(--eth-space-md);
+}
+
+.eth-inbox-rules {
+  background: var(--eth-color-layer-01);
+  border: 1px solid var(--eth-color-border-subtle);
+  gap: 0;
+  max-inline-size: 64rem;
+  padding: 0;
+}
+
+.eth-inbox-rules > .eth-panel__header {
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+  padding: var(--eth-space-lg);
+}
+
+.eth-inbox-rules > .eth-panel__header h3 {
+  font-size: calc(1.25rem * var(--eth-text-scale, 1));
+  line-height: 1.4;
+}
+
+.eth-inbox-rules > .eth-panel__body {
+  display: grid;
+  gap: var(--eth-space-md);
+  padding: var(--eth-space-lg);
+}
+
+.eth-inbox-rules__list {
+  border: 1px solid var(--eth-color-border-subtle);
+  gap: 0;
+}
+
+.eth-inbox-rules__item {
+  --eth-inbox-rule-accent: var(--eth-color-border-strong);
+
+  align-items: start;
+  background: var(--eth-color-layer-01);
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+  border-inline-start: 3px solid var(--eth-inbox-rule-accent);
+  border-radius: 0;
+  display: grid;
+  gap: var(--eth-space-lg);
+  grid-template-columns: minmax(0, 1fr) auto;
+  padding: var(--eth-space-lg);
+}
+
+.eth-inbox-rules__item:last-child {
+  border-block-end: 0;
+}
+
+.eth-inbox-rules__item--enabled {
+  --eth-inbox-rule-accent: var(--eth-color-interactive-primary);
+}
+
+.eth-inbox-rules__item--paused {
+  --eth-inbox-rule-accent: var(--eth-color-border-strong);
+  background: var(--eth-color-layer-02);
+}
+
+.eth-inbox-rules__content,
+.eth-inbox-rules__definition > div {
+  display: grid;
+  gap: var(--eth-space-sm);
+  min-width: 0;
+}
+
+.eth-inbox-rules__item-header,
+.eth-inbox-rules__controls {
+  align-items: center;
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--eth-space-sm);
+}
+
+.eth-inbox-rules__item-header h4 {
+  font-size: calc(1rem * var(--eth-text-scale, 1));
+  font-weight: 600;
+  line-height: 1.375;
+  margin: 0;
+}
+
+.eth-inbox-rules__definition {
+  background: var(--eth-color-layer-01);
+  border: 1px solid var(--eth-color-border-subtle);
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  margin: 0;
+  min-width: 0;
+}
+
+.eth-inbox-rules__definition > div {
+  padding: var(--eth-space-md);
+}
+
+.eth-inbox-rules__definition > div:not(:last-child) {
+  border-inline-end: 1px solid var(--eth-color-border-subtle);
+}
+
+.eth-inbox-rules__definition dt {
+  color: var(--eth-color-text-secondary);
+  font-size: calc(0.75rem * var(--eth-text-scale, 1));
+  font-weight: 600;
+  line-height: 1.333;
+}
+
+.eth-inbox-rules__definition dd {
+  line-height: 1.4286;
+  margin: 0;
+  min-width: 0;
+  overflow-wrap: anywhere;
+}
+
+.eth-inbox-rules__definition code {
+  background: var(--eth-color-layer-02);
+  border: 1px solid var(--eth-color-border-subtle);
+  color: var(--eth-color-text-primary);
+  font-family: var(--eth-font-mono);
+  font-size: 0.875em;
+  padding: 0 var(--eth-space-xs);
+}
+
+.eth-inbox-rules__controls {
+  justify-content: flex-end;
+  min-inline-size: 13rem;
+}
+
+.eth-inbox-rules__toggle {
+  flex: 0 0 auto;
+}
+
+.eth-inbox-rules__empty {
+  background: var(--eth-color-layer-02);
+  border: 1px dashed var(--eth-color-border-subtle);
+  color: var(--eth-color-text-secondary);
+  margin: 0;
+  padding: var(--eth-space-lg);
+}
+
+.eth-inbox-message-search,
+.eth-inbox-search {
+  align-items: stretch;
+  background: var(--eth-color-layer-01);
+  border: 1px solid var(--eth-color-border-subtle);
+  border-radius: 0;
+  display: grid;
+  grid-template-columns: minmax(12rem, 1fr) auto;
+  inline-size: min(100%, 48rem);
+  min-inline-size: 0;
+  overflow: hidden;
+}
+
+.eth-inbox-search__input {
+  min-inline-size: 0;
+}
+
+.eth-inbox-search__control,
+.eth-inbox-search__input .cds--search,
+.eth-inbox-search__input .cds--search-input {
+  inline-size: 100%;
+  min-inline-size: 0;
+}
+
+.eth-inbox-search__input .cds--search-input {
+  background: var(--eth-color-layer-01);
+  border-block-end: 0;
+}
+
+.eth-inbox-search__input:focus-within {
+  outline: 2px solid var(--eth-color-focus);
+  outline-offset: -2px;
+}
+
+.eth-inbox-search__input input:focus {
+  outline: 0;
+}
+
+.eth-inbox-search__results {
+  align-items: center;
+  background: var(--eth-color-layer-02);
+  border-inline-start: 1px solid var(--eth-color-border-subtle);
+  display: flex;
+  min-inline-size: max-content;
+}
+
+.eth-inbox-search__count {
+  color: var(--eth-color-text-secondary);
+  font-size: calc(0.875rem * var(--eth-text-scale, 1));
+  line-height: 1.2857;
+  padding-inline: var(--eth-space-md);
+  white-space: nowrap;
+}
+
+.eth-inbox-search__nav {
+  align-items: center;
+  border-inline-start: 1px solid var(--eth-color-border-subtle);
+  display: flex;
+}
+
+.eth-inbox-search__nav-button.eth-icon-button {
+  block-size: var(--eth-space-3xl);
+  inline-size: var(--eth-space-3xl);
+  min-block-size: var(--eth-space-3xl);
+  min-inline-size: var(--eth-space-3xl);
+}
+
+.eth-inbox-search__nav-button + .eth-inbox-search__nav-button {
+  border-inline-start: 1px solid var(--eth-color-border-subtle);
+}
+
+.eth-inbox-search__nav-button--previous svg {
+  transform: rotate(180deg);
+}
+
+.eth-inbox-approval-to-send,
+.eth-inbox-send-approval,
+.eth-inbox-agent-draft-review,
+.eth-inbox-agent-draft,
+.eth-inbox-thread-summary {
+  background: var(--eth-color-layer-01);
+  border: 1px solid var(--eth-color-border-subtle);
+  border-radius: 0;
+  display: grid;
+  gap: var(--eth-space-md);
+  padding: var(--eth-space-lg);
+}
+
+.eth-inbox-thread-summary {
+  gap: 0;
+  inline-size: 100%;
+  max-inline-size: 48rem;
+  padding: 0;
+}
+
+.eth-inbox-thread-summary > .eth-panel__header {
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+  padding: var(--eth-space-lg) var(--eth-space-lg) var(--eth-space-md);
+}
+
+.eth-inbox-thread-summary > .eth-panel__header h3 {
+  font-size: calc(1rem * var(--eth-text-scale, 1));
+  font-weight: 600;
+  line-height: 1.375;
+}
+
+.eth-inbox-thread-summary > .eth-panel__header p {
+  font-size: calc(0.875rem * var(--eth-text-scale, 1));
+  line-height: 1.2857;
+  max-inline-size: 34rem;
+}
+
+.eth-inbox-thread-summary > .eth-panel__body {
+  display: grid;
+  min-width: 0;
+  padding: var(--eth-space-lg);
+}
+
+.eth-inbox-thread-summary__content {
+  display: grid;
+  gap: var(--eth-space-md);
+  min-width: 0;
+}
+
+.eth-inbox-thread-summary__metadata {
+  align-items: center;
+  color: var(--eth-color-text-secondary);
+  display: flex;
+  flex-wrap: wrap;
+  font-size: calc(0.875rem * var(--eth-text-scale, 1));
+  gap: var(--eth-space-sm);
+  line-height: 1.2857;
+  min-width: 0;
+}
+
+.eth-inbox-thread-summary__summary,
+.eth-inbox-thread-summary__empty,
+.eth-inbox-thread-summary__no-sources {
+  background: var(--eth-color-layer-02);
+  border: 1px solid var(--eth-color-border-subtle);
+  display: grid;
+  gap: var(--eth-space-sm);
+  min-width: 0;
+  padding: var(--eth-space-md);
+}
+
+.eth-inbox-thread-summary__summary {
+  border-inline-start: 4px solid var(--eth-color-info);
+}
+
+.eth-inbox-thread-summary__section-label {
+  color: var(--eth-color-text-secondary);
+  font-size: calc(0.75rem * var(--eth-text-scale, 1));
+  font-weight: 600;
+  line-height: 1.333;
+}
+
+.eth-inbox-thread-summary__summary-body {
+  color: var(--eth-color-text-primary);
+  line-height: 1.5;
+  max-inline-size: 56rem;
+  min-width: 0;
+}
+
+.eth-inbox-thread-summary__summary-body > :first-child {
+  margin-block-start: 0;
+}
+
+.eth-inbox-thread-summary__summary-body > :last-child {
+  margin-block-end: 0;
+}
+
+.eth-inbox-thread-summary__sources {
+  display: grid;
+  gap: var(--eth-space-xs);
+  min-width: 0;
+}
+
+.eth-inbox-thread-summary__source-list {
+  align-items: center;
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--eth-space-xs);
+  list-style: none;
+  margin: 0;
+  min-width: 0;
+  padding: 0;
+}
+
+.eth-inbox-thread-summary__source-item {
+  display: flex;
+  min-width: 0;
+}
+
+.eth-inbox-thread-summary__source-link {
+  max-inline-size: 100%;
+  text-decoration: none;
+}
+
+.eth-inbox-thread-summary__source-link:focus-visible {
+  outline: 2px solid var(--eth-color-focus);
+  outline-offset: 2px;
+}
+
+.eth-inbox-thread-summary__source-link:hover .eth-inbox-thread-summary__source-token {
+  background: var(--eth-color-layer-hover);
+}
+
+.eth-inbox-thread-summary__source-reference {
+  max-inline-size: 100%;
+}
+
+.eth-inbox-thread-summary__no-sources {
+  border-style: dashed;
+  color: var(--eth-color-text-secondary);
+  font-size: calc(0.875rem * var(--eth-text-scale, 1));
+  line-height: 1.2857;
+}
+
+.eth-inbox-thread-summary__empty {
+  border-style: dashed;
+}
+
+.eth-inbox-thread-summary__empty strong {
+  color: var(--eth-color-text-primary);
+}
+
+.eth-inbox-thread-summary__empty p {
+  color: var(--eth-color-text-secondary);
+  margin: 0;
+  max-inline-size: 34rem;
+}
+
+.eth-inbox-send-approval {
+  --eth-inbox-send-approval-accent: var(--eth-color-info);
+
+  border-inline-start: 4px solid var(--eth-inbox-send-approval-accent);
+  gap: 0;
+  max-inline-size: 64rem;
+  padding: 0;
+}
+
+.eth-inbox-send-approval > .eth-panel__header {
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+  padding: var(--eth-space-lg);
+}
+
+.eth-inbox-send-approval > .eth-panel__body {
+  display: grid;
+  gap: var(--eth-space-lg);
+  padding: var(--eth-space-lg);
+}
+
+.eth-inbox-send-approval--low {
+  --eth-inbox-send-approval-accent: var(--eth-color-info);
+}
+
+.eth-inbox-send-approval--medium {
+  --eth-inbox-send-approval-accent: var(--eth-color-warning);
+}
+
+.eth-inbox-send-approval--high,
+.eth-inbox-send-approval--critical {
+  --eth-inbox-send-approval-accent: var(--eth-color-danger);
+}
+
+.eth-inbox-send-approval__status {
+  align-items: center;
+  background: var(--eth-color-layer-02);
+  border: 1px solid var(--eth-color-border-subtle);
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--eth-space-sm);
+  justify-content: space-between;
+  padding: var(--eth-space-md);
+}
+
+.eth-inbox-send-approval__summary,
+.eth-inbox-agent-draft__evidence-list {
+  align-items: center;
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--eth-space-sm);
+}
+
+.eth-inbox-send-approval__policy {
+  color: var(--eth-color-text-secondary);
+  font-family: var(--eth-font-mono);
+  font-size: calc(0.875rem * var(--eth-text-scale, 1));
+  line-height: 1.2857;
+}
+
+.eth-inbox-send-approval__state {
+  color: var(--eth-color-text-secondary);
+  font-size: calc(0.875rem * var(--eth-text-scale, 1));
+  line-height: 1.2857;
+}
+
+.eth-inbox-send-approval__message {
+  background: var(--eth-color-layer-01);
+  border: 1px solid var(--eth-color-border-subtle);
+  display: grid;
+  min-width: 0;
+}
+
+.eth-inbox-send-approval__message-header {
+  align-items: flex-start;
+  background: var(--eth-color-layer-02);
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+  display: flex;
+  gap: var(--eth-space-md);
+  justify-content: space-between;
+  padding: var(--eth-space-md);
+}
+
+.eth-inbox-send-approval__message-header h4,
+.eth-inbox-send-approval__message-header p,
+.eth-inbox-send-approval__message-body p {
+  margin: 0;
+}
+
+.eth-inbox-send-approval__message-header h4 {
+  font-size: calc(1rem * var(--eth-text-scale, 1));
+  font-weight: 600;
+  line-height: 1.375;
+}
+
+.eth-inbox-send-approval__message-header p {
+  color: var(--eth-color-text-secondary);
+  margin-block-start: var(--eth-space-xs);
+}
+
+.eth-inbox-send-approval__meta {
+  display: grid;
+  margin: 0;
+}
+
+.eth-inbox-send-approval__meta > div {
+  border-bottom: 1px solid var(--eth-color-border-subtle);
+  display: grid;
+  gap: var(--eth-space-sm);
+  grid-template-columns: minmax(7rem, 10rem) minmax(0, 1fr);
+  padding: var(--eth-space-sm);
+}
+
+.eth-inbox-send-approval__meta > div:last-child {
+  border-bottom: 0;
+}
+
+.eth-inbox-send-approval__meta dt {
+  color: var(--eth-color-text-secondary);
+  font-weight: 600;
+}
+
+.eth-inbox-send-approval__meta dd {
+  margin: 0;
+  min-width: 0;
+  overflow-wrap: anywhere;
+}
+
+.eth-inbox-send-approval__message-body {
+  border-block-start: 1px solid var(--eth-color-border-subtle);
+  display: grid;
+  gap: var(--eth-space-sm);
+  line-height: 1.5;
+  min-block-size: 7rem;
+  padding: var(--eth-space-md);
+  white-space: pre-wrap;
+}
+
+.eth-inbox-send-approval__message-body span {
+  color: var(--eth-color-text-secondary);
+  font-size: calc(0.75rem * var(--eth-text-scale, 1));
+  font-weight: 600;
+  line-height: 1.333;
+}
+
+.eth-inbox-send-approval__decision {
+  display: grid;
+  gap: var(--eth-space-sm);
+}
+
+.eth-inbox-send-approval__decision .cds--form-item,
+.eth-inbox-send-approval__decision .cds--text-area__wrapper {
+  max-inline-size: none;
+}
+
+.eth-inbox-send-approval__decision .cds--text-area {
+  min-block-size: 6rem;
+}
+
+.eth-inbox-send-approval__actions {
+  border-block-start: 1px solid var(--eth-color-border-subtle);
+  justify-content: flex-end;
+  padding-block-start: var(--eth-space-lg);
+}
+
+.eth-inbox-agent-draft {
+  grid-template-columns: minmax(0, 1fr);
+  max-inline-size: 58rem;
+}
+
+.eth-inbox-agent-draft > .eth-panel__body {
+  display: grid;
+  gap: var(--eth-space-lg);
+}
+
+.eth-inbox-agent-draft .eth-panel__header {
+  border-block-end: 1px solid var(--eth-color-border-subtle);
+  padding-block-end: var(--eth-space-md);
+}
+
+.eth-inbox-agent-draft__content {
+  display: grid;
+  gap: var(--eth-space-lg);
+}
+
+.eth-inbox-agent-draft__status {
+  align-items: center;
+  color: var(--eth-color-text-secondary);
+  display: flex;
+  flex-wrap: wrap;
+  font-size: calc(0.875rem * var(--eth-text-scale, 1));
+  gap: var(--eth-space-sm);
+  line-height: 1.2857;
+}
+
+.eth-inbox-agent-draft__status time {
+  color: var(--eth-color-text-secondary);
+}
+
+.eth-inbox-agent-draft__meta {
+  background: var(--eth-color-layer-01);
+  border: 1px solid var(--eth-color-border-subtle);
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  margin: 0;
+}
+
+.eth-inbox-agent-draft__meta > div {
+  display: grid;
+  gap: var(--eth-space-xs);
+  min-width: 0;
+  padding: var(--eth-space-sm) var(--eth-space-md);
+}
+
+.eth-inbox-agent-draft__meta > div:not(:last-child) {
+  border-inline-end: 1px solid var(--eth-color-border-subtle);
+}
+
+.eth-inbox-agent-draft__meta dt,
+.eth-inbox-agent-draft__section-header,
+.eth-inbox-agent-draft__rationale > span,
+.eth-inbox-agent-draft__evidence > span {
+  color: var(--eth-color-text-secondary);
+  font-size: calc(0.75rem * var(--eth-text-scale, 1));
+  font-weight: 600;
+  line-height: 1.333;
+}
+
+.eth-inbox-agent-draft__meta dd {
+  color: var(--eth-color-text-primary);
+  margin: 0;
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.eth-inbox-agent-draft__section,
+.eth-inbox-agent-draft__evidence {
+  display: grid;
+  gap: var(--eth-space-sm);
+}
+
+.eth-inbox-agent-draft__section-header {
+  align-items: center;
+  display: flex;
+  justify-content: space-between;
+}
+
+.eth-inbox-agent-draft__body {
+  background: var(--eth-color-layer-02);
+  border: 1px solid var(--eth-color-border-subtle);
+  border-inline-start: 4px solid var(--eth-color-interactive-primary);
+  color: var(--eth-color-text-primary);
+  line-height: 1.5;
+  padding: var(--eth-space-md);
+  white-space: pre-wrap;
+}
+
+.eth-inbox-agent-draft__rationale {
+  background: var(--eth-color-layer-02);
+  border: 1px solid var(--eth-color-border-subtle);
+  display: grid;
+  gap: var(--eth-space-xs);
+  padding: var(--eth-space-md);
+}
+
+.eth-inbox-agent-draft__rationale-body {
+  color: var(--eth-color-text-primary);
+  line-height: 1.5;
+  margin: 0;
+}
+
+.eth-inbox-agent-draft__rationale-body > :first-child {
+  margin-block-start: 0;
+}
+
+.eth-inbox-agent-draft__rationale-body > :last-child {
+  margin-block-end: 0;
+}
+
+.eth-inbox-agent-draft__evidence-list a {
+  text-decoration: none;
+}
+
+.eth-inbox-agent-draft__evidence-list a:focus-visible {
+  outline: 2px solid var(--eth-color-focus);
+  outline-offset: 2px;
+}
+
+.eth-inbox-agent-draft__empty {
+  background: var(--eth-color-layer-02);
+  border: 1px dashed var(--eth-color-border-subtle);
+  display: grid;
+  gap: var(--eth-space-xs);
+  padding: var(--eth-space-lg);
+}
+
+.eth-inbox-agent-draft__empty strong {
+  color: var(--eth-color-text-primary);
+}
+
+.eth-inbox-agent-draft__empty p {
+  color: var(--eth-color-text-secondary);
+  margin: 0;
+}
+
+.eth-inbox-agent-draft__actions {
+  border-block-start: 1px solid var(--eth-color-border-subtle);
+  justify-content: flex-end;
+  padding-block-start: var(--eth-space-lg);
+}
+
+.eth-inbox-thread-summary p {
+  margin: 0;
+}
+
+@media (width <= 72rem) {
+  .eth-inbox-shell__layout {
+    grid-template-columns: minmax(8rem, 0.6fr) minmax(15rem, 1fr) minmax(22rem, 2fr);
+  }
+
+  .eth-inbox-shell__inspector {
+    border-top: 1px solid var(--eth-color-border-subtle);
+    grid-column: 1 / -1;
+  }
+}
+
+@container (inline-size <= 72rem) {
+  .eth-inbox-shell__layout {
+    grid-template-columns: minmax(8rem, 0.6fr) minmax(15rem, 1fr) minmax(22rem, 2fr);
+  }
+
+  .eth-inbox-shell__inspector {
+    border-top: 1px solid var(--eth-color-border-subtle);
+    grid-column: 1 / -1;
+  }
+}
+
+@container (inline-size <= 54rem) {
+  .eth-inbox-shell__layout,
+  .eth-inbox-shell__layout--has-inspector {
+    grid-template-columns: minmax(10rem, 14rem) minmax(0, 1fr);
+  }
+
+  .eth-inbox-shell__thread,
+  .eth-inbox-shell__inspector {
+    border-top: 1px solid var(--eth-color-border-subtle);
+    grid-column: 1 / -1;
+  }
+}
+
+@container (inline-size <= 42rem) {
+  .eth-inbox-shell__layout,
+  .eth-inbox-shell__layout--has-inspector {
+    grid-template-columns: 1fr;
+  }
+
+  .eth-inbox-shell__folders,
+  .eth-inbox-shell__list,
+  .eth-inbox-shell__thread {
+    border-block-end: 1px solid var(--eth-color-border-subtle);
+    border-inline-end: 0;
+  }
+}
+
+@media (width <= 48rem) {
+  .eth-inbox-shell__layout,
+  .eth-inbox-label-manager__row,
+  .eth-inbox-label-manager__create,
+  .eth-inbox-recipient-picker__selected,
+  .eth-inbox-recipient-picker__manual,
+  .eth-inbox-recipient-picker__suggestions button,
+  .eth-inbox-rules__item,
+  .eth-inbox-rules__definition,
+  .eth-inbox-message-search,
+  .eth-inbox-search,
+  .eth-inbox-composer__field.eth-form-field,
+  .eth-inbox-attachments__tile,
+  .eth-inbox-agent-draft__meta,
+  .eth-inbox-send-approval__meta > div {
+    grid-template-columns: 1fr;
+  }
+
+  .eth-inbox-composer {
+    inline-size: 100%;
+  }
+
+  .eth-inbox-recipient-picker__selected,
+  .eth-inbox-recipient-picker__manual,
+  .eth-inbox-recipient-picker__suggestions button {
+    gap: var(--eth-space-xs);
+    padding-inline: var(--eth-space-md);
+  }
+
+  .eth-inbox-recipient-picker__manual {
+    align-items: stretch;
+  }
+
+  .eth-inbox-recipient-picker__manual .eth-button {
+    inline-size: 100%;
+    max-inline-size: none;
+  }
+
+  .eth-inbox-recipient-picker__suggestion-status {
+    justify-self: start;
+  }
+
+  .eth-inbox-composer__field.eth-form-field {
+    align-items: stretch;
+    gap: var(--eth-space-xs);
+  }
+
+  .eth-inbox-search__results {
+    border-block-start: 1px solid var(--eth-color-border-subtle);
+    border-inline-start: 0;
+    justify-content: space-between;
+  }
+
+  .eth-inbox-composer__footer {
+    align-items: stretch;
+    flex-direction: column;
+  }
+
+  .eth-inbox-composer__actions {
+    margin-inline-start: 0;
+  }
+
+  .eth-inbox-composer__actions .eth-button {
+    inline-size: 100%;
+    max-inline-size: none;
+  }
+
+  .eth-inbox-label-manager__table-head {
+    display: none;
+  }
+
+  .eth-inbox-label-manager__row {
+    align-items: start;
+  }
+
+  .eth-inbox-label-manager__count-cell,
+  .eth-inbox-label-manager__actions {
+    justify-content: flex-start;
+  }
+
+  .eth-inbox-agent-draft__meta > div:not(:last-child) {
+    border-block-end: 1px solid var(--eth-color-border-subtle);
+    border-inline-end: 0;
+  }
+
+  .eth-inbox-rules__definition > div:not(:last-child) {
+    border-block-end: 1px solid var(--eth-color-border-subtle);
+    border-inline-end: 0;
+  }
+
+  .eth-inbox-rules__controls {
+    justify-content: flex-start;
+    min-inline-size: 0;
+  }
+
+  .eth-inbox-send-approval__status,
+  .eth-inbox-send-approval__actions,
+  .eth-inbox-thread__header {
+    align-items: stretch;
+    flex-direction: column;
+  }
+
+  .eth-inbox-thread__actions {
+    justify-content: flex-start;
+    margin-inline-start: 0;
+  }
+
+  .eth-inbox-thread__actions .eth-button {
+    inline-size: 100%;
+    max-inline-size: none;
+  }
+
+  .eth-inbox-message-preview__header {
+    align-items: flex-start;
+    flex-direction: column;
+  }
+
+  .eth-inbox-attachments__tile {
+    align-items: start;
+    grid-template-columns: auto minmax(0, 1fr);
+  }
+
+  .eth-inbox-attachments__actions {
+    grid-column: 2;
+    justify-content: flex-start;
+  }
+
+  .eth-inbox-send-approval__actions .eth-button {
+    inline-size: 100%;
+    max-inline-size: none;
+  }
+
+  .eth-inbox-message-preview {
+    inline-size: 100%;
+    padding: var(--eth-space-md);
+  }
+
+  .eth-inbox-message-preview__header {
+    display: grid;
+  }
+
+  .eth-inbox-message-preview__header time {
+    justify-self: start;
+    padding-block-start: 0;
+  }
+
+  .eth-inbox-message-preview__recipients {
+    align-items: start;
+    display: grid;
+  }
+
+  .eth-inbox-shell__folders,
+  .eth-inbox-shell__list,
+  .eth-inbox-shell__thread {
+    border-block-end: 1px solid var(--eth-color-border-subtle);
+    border-inline-end: 0;
+  }
+}