.wagle-translation { margin-block-start: var(--space-2); }
.wagle-translation-controls { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-2); min-width: 0; }
.wagle-translation .wagle-translation-trigger,
.wagle-translation .wagle-translation-original { display: inline-flex; align-items: center; gap: var(--space-1); min-height: var(--button-height); padding: var(--space-0) var(--space-2); font-size: var(--text-xs); font-weight: var(--weight-medium); color: var(--text-secondary); background: transparent; border-color: transparent; }
.wagle-translation .wagle-translation-trigger:hover,
.wagle-translation .wagle-translation-original:hover { color: var(--brand); background: var(--surface-hover); }
.wagle-translation-panel { margin-block: var(--space-2); padding: var(--space-3); max-width: 100%; width: fit-content; border: var(--stroke-thin) solid var(--border); border-radius: var(--radius-card); background: var(--surface-raised); }
.wagle-translation-panel > p { margin: var(--space-0) var(--space-0) var(--space-2); font-size: var(--text-xs); line-height: var(--leading-body); color: var(--text-secondary); }
.wagle-translation-choices { display: flex; flex-wrap: wrap; gap: var(--chip-row-gap) var(--space-2); }
.wagle-translation [hidden] { display: none; }
.wagle-translation > [role="status"] { font-size: var(--text-xs); line-height: var(--leading-body); color: var(--text-secondary); }
.wagle-translation > [role="status"]:empty { display: none; }
.wagle-translation > div p { overflow-wrap: anywhere; }
.wagle-translation-attribution { display: inline-block; font-size: var(--text-xs); color: var(--text-muted); text-decoration: none; }
.wagle-translation-attribution:hover { color: var(--text-secondary); }
.wagle-translation details { margin-block-start: var(--space-3); }
.wagle-translation details p { font-size: var(--text-sm); }