.mail-workspace {
 --mail-preview-offset: 8px;
 --mail-reader-width: 0px;
 display: grid;
 row-gap: 16px;
 column-gap: 0;
 width: 100%;
 grid-template-columns: minmax(0, calc(100% - var(--mail-reader-width))) minmax(0, var(--mail-reader-width));
 grid-template-rows: 1fr;
 align-items: stretch;
 align-content: stretch;
 min-height: 100%;
 height: 100%;
 flex: 1;
 padding: 0;
 min-width: 0;
 overflow: hidden;
 position: relative;
 transition: grid-template-columns 240ms ease;
}

.mail-workspace::before {
 content: "";
 position: absolute;
 top: 0;
 bottom: 0;
 left: calc(100% - var(--mail-reader-width));
 width: 1px;
 background: var(--stroke);
 transform: translateX(-0.5px);
 opacity: 0;
 pointer-events: none;
 z-index: 2;
 transition: opacity 160ms ease;
}

.mail-workspace.is-reading:not(.is-full)::before {
 opacity: 1;
}

.mail-workspace.is-full::before,
.mail-workspace:not(.is-reading)::before {
 opacity: 0;
}

.mail-workspace.is-full {
 grid-template-columns: 1fr;
}

.mail-workspace.is-full .mail-inbox {
 display: none;
}

.mail-workspace.is-full .mail-reader {
 padding-top: 0;
}

.mail-workspace.is-full .mail-reader__divider {
 display: none;
}

.mail-inbox {
 display: flex;
 flex-direction: column;
 gap: 0;
 min-width: 0;
 min-height: 0;
 height: 100%;
 overflow: hidden;
 container-type: inline-size;
 container-name: mail-list-pane;
}

.panel[data-panel="mail"] {
 max-width: none;
 min-height: 0;
 height: 100%;
}

.panel[data-panel="mail-settings"] {
 min-height: 0;
 max-width: none;
 width: 100%;
 margin: 0;
}

.panel[data-panel="mail"].is-visible {
 display: flex;
 flex-direction: column;
 flex: 1 1 auto;
 min-height: 0;
 height: 100%;
 margin: 0;
}

.mail-topbar {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 1rem;
}

.mail-controls {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 16px;
 margin-bottom: 16px;
}

.main__search.mail-controls {
 margin-bottom: 0;
 justify-content: center;
 flex: 1;
}

.main__search .mail-search {
 max-width: 460px;
}

.pigeon-channel-switcher {
 display: inline-flex;
 align-items: stretch;
 gap: 2px;
 padding: 0;
 max-width: min(100%, 760px);
 overflow-x: auto;
}

.pigeon-channel-switcher[hidden] {
 display: none;
}

.pigeon-channel-switcher__tab {
 border: none;
 border-radius: 8px;
 background: transparent;
 color: var(--ink-muted);
 font: inherit;
 font-family: var(--font-sans);
 font-size: 0.8rem;
 font-weight: 500;
 letter-spacing: var(--tracking-ui, -0.015em);
 line-height: 1;
 padding: 8px 10px;
 white-space: nowrap;
 cursor: pointer;
 transition: background 0.16s ease, color 0.16s ease;
 position: relative;
}

.pigeon-channel-switcher__tab:hover,
.pigeon-channel-switcher__tab:focus-visible {
 background: rgba(15, 23, 42, 0.06);
 color: var(--ink-strong);
 outline: none;
}

.pigeon-channel-switcher__tab.is-active {
 background: rgba(15, 23, 42, 0.08);
 color: var(--ink-strong);
}

.pigeon-channel-switcher__tab.is-active::after {
 content: "";
 position: absolute;
 left: 10px;
 right: 10px;
 bottom: 2px;
 height: 2px;
 border-radius: 999px;
 background: currentColor;
 opacity: 0.45;
}

.mail-mailboxes {
 display: flex;
 align-items: center;
 gap: 10px;
 flex-wrap: nowrap;
 position: relative;
}

.main__actions--mail {
 gap: 10px;
}

.main__actions--mail:not([hidden]) {
 margin-left: auto;
}

.main__actions--mail:not([hidden]) ~ .main__actions--reporter {
 margin-left: 0;
}

.mail-mailboxes[hidden] {
 display: none;
}

.mail-mailboxes--header {
 padding-bottom: 0;
 border-bottom: none;
}

.mail-mailboxes__label {
 font-size: 0.72rem;
 font-weight: 600;
 letter-spacing: 0.04em;
 text-transform: uppercase;
 color: var(--ink-muted);
 white-space: nowrap;
}

.main__actions--mail .mail-mailboxes__label {
 letter-spacing: 0.03em;
}

.mail-mailboxes__toggle {
 border: 1px solid var(--stroke);
 background: #fff;
 color: var(--ink-strong);
 border-radius: 999px;
 padding: 6px 10px;
 display: inline-flex;
 align-items: center;
 gap: 8px;
 font-size: 0.84rem;
 line-height: 1;
 cursor: pointer;
 transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
 min-width: 160px;
 justify-content: space-between;
}

.mail-mailboxes__toggle:hover,
.mail-mailboxes__toggle:focus-visible {
 border-color: rgba(15, 23, 42, 0.2);
 background: rgba(15, 23, 42, 0.04);
 color: var(--ink-strong);
 outline: none;
}

.mail-mailboxes__toggle-text {
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
 max-width: 170px;
 text-align: left;
 font-weight: 500;
}

.mail-mailboxes__toggle-icon {
 width: 14px;
 height: 14px;
 stroke: currentColor;
 stroke-width: 1.8;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
 flex: 0 0 auto;
}

.mail-mailboxes__menu {
 position: absolute;
 top: calc(100% + 8px);
 left: 0;
 min-width: 230px;
 max-width: min(340px, 90vw);
 background: #fff;
 border: 1px solid var(--stroke);
 border-radius: 12px;
 box-shadow: 0 18px 36px rgba(15, 23, 42, 0.12);
 padding: 10px;
 display: grid;
 gap: 6px;
 z-index: 12;
}

.mail-mailboxes__menu[hidden] {
 display: none;
}

.mail-mailboxes__option {
 display: inline-flex;
 align-items: center;
 gap: 8px;
 font-size: 0.84rem;
 color: var(--ink-strong);
 cursor: pointer;
 padding: 4px 2px;
 border-radius: 8px;
}

.mail-mailboxes__option:hover {
 background: rgba(15, 23, 42, 0.04);
}

.mail-mailboxes__option.is-placeholder {
 cursor: default;
 color: var(--ink-muted);
}

.mail-mailboxes__option.is-placeholder:hover {
 background: transparent;
}

.mail-mailboxes__option input {
 margin: 0;
 width: 14px;
 height: 14px;
 accent-color: rgb(var(--accent));
}

.mail-mailboxes__option-text {
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.pigeon-channel-placeholder-view {
 display: flex;
 flex-direction: column;
 gap: 12px;
 padding: 24px 4px 0;
}

.pigeon-channel-placeholder-view[hidden] {
 display: none;
}

.pigeon-channel-placeholder {
 max-width: 760px;
}

.pigeon-channel-placeholder h2 {
 margin: 0 0 6px;
 font-size: 1.25rem;
 font-weight: 700;
 color: var(--ink-strong);
}

.pigeon-channel-placeholder .muted {
 margin: 0;
}

.pigeon-calls-view {
 display: flex;
 flex: 1;
 min-height: 0;
 width: 100%;
 overflow: hidden;
}

.pigeon-calls-view[hidden] {
 display: none;
}

.pigeon-calls-layout {
 display: grid;
 grid-template-columns: minmax(0, 1fr) 0;
 min-height: 0;
 width: 100%;
 align-items: stretch;
 transition: grid-template-columns 220ms ease;
}

.pigeon-calls-layout.is-details-open {
 grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
}

.pigeon-calls-inbox {
 display: grid;
 gap: 0;
 min-width: 0;
 min-height: 0;
 height: 100%;
 align-content: start;
}

.pigeon-calls-list {
 min-height: 0;
 height: auto;
}

.mail-list.pigeon-calls-list {
 overflow: visible;
 min-height: 300px;
}

.pigeon-calls-list__rows {
 min-height: 320px;
 display: flex;
 flex-direction: column;
 align-items: stretch;
 justify-content: flex-start;
 gap: 4px;
 padding: 0 0 8px;
 min-width: 0;
}

.pigeon-calls-tabs {
 margin-bottom: 2px;
}

.pigeon-calls-tabs .mail-tab--add {
 margin-left: 2px;
}

.pigeon-calls-details {
 border-left: 1px solid var(--stroke);
 background: rgba(248, 250, 252, 0.55);
 min-height: 0;
 overflow-y: auto;
 padding: 18px 16px;
 display: grid;
 align-content: start;
 gap: 14px;
}

.pigeon-calls-details__header h2 {
 margin: 0 0 6px;
 font-size: 1.02rem;
 line-height: 1.2;
}

.pigeon-calls-details__header p {
 margin: 0;
}

.pigeon-calls-details__summary {
 border: 1px solid var(--stroke);
 border-radius: 10px;
 background: #fff;
 padding: 10px 12px;
 display: grid;
 gap: 3px;
}

.pigeon-calls-details__summary-label {
 font-size: 0.74rem;
 letter-spacing: 0.03em;
 text-transform: uppercase;
 color: var(--ink-muted);
}

.pigeon-calls-details__summary strong {
 font-size: 0.96rem;
 font-weight: 700;
 color: var(--ink-strong);
}

.pigeon-calls-details__actions {
 display: flex;
 align-items: center;
 gap: 8px;
 flex-wrap: wrap;
}

.pigeon-calls-details__section {
 border-top: 1px solid rgba(15, 23, 42, 0.08);
 padding-top: 12px;
 display: grid;
 gap: 4px;
}

.pigeon-calls-details__section h3 {
 margin: 0;
 font-size: 0.84rem;
 font-weight: 700;
 color: var(--ink-strong);
 text-transform: uppercase;
 letter-spacing: 0.04em;
}

.pigeon-calls-details__section p {
 margin: 0;
}

.pigeon-call-modal {
 z-index: 70;
}

.pigeon-call-modal__panel {
 width: min(420px, 94vw);
}

.pigeon-call-modal__incoming {
 display: grid;
 gap: 6px;
 padding: 14px 16px;
 border-radius: 16px;
 background: linear-gradient(135deg, rgba(50, 120, 255, 0.08), rgba(16, 121, 75, 0.08));
 border: 1px solid rgba(50, 120, 255, 0.16);
 margin-bottom: 10px;
}

.pigeon-call-modal__incoming-kicker {
 margin: 0;
 font-size: 0.76rem;
 font-weight: 700;
 letter-spacing: 0.08em;
 text-transform: uppercase;
 color: #3278FF;
}

.pigeon-call-modal__incoming-name {
 font-size: 1.2rem;
 line-height: 1.25;
 color: var(--ink-strong);
}

.pigeon-call-modal__incoming-number {
 font-size: 0.92rem;
 color: var(--ink-muted);
}

.pigeon-call-modal__panel--contacts {
 width: min(460px, 94vw);
 max-height: min(72vh, 560px);
 overflow: hidden;
}

.pigeon-call-modal__pad {
 display: grid;
 grid-template-columns: repeat(3, minmax(0, 1fr));
 gap: 8px;
}

.pigeon-call-modal__digit {
 border: 1px solid rgba(15, 23, 42, 0.18);
 border-radius: 10px;
 background: #fff;
 color: var(--ink-strong);
 height: 42px;
 font-size: 1rem;
 font-weight: 600;
 cursor: pointer;
 transition: border-color 0.18s ease, background 0.18s ease;
}

.pigeon-call-modal__digit:hover,
.pigeon-call-modal__digit:focus-visible {
 border-color: rgba(15, 23, 42, 0.28);
 background: rgba(15, 23, 42, 0.05);
 outline: none;
}

.pigeon-call-modal__contacts-list {
 display: grid;
 gap: 8px;
 max-height: min(42vh, 340px);
 overflow-y: auto;
 align-content: start;
}

.pigeon-call-contact {
 width: 100%;
 border: 1px solid rgba(15, 23, 42, 0.1);
 border-radius: 10px;
 background: #fff;
 padding: 9px 10px;
 display: grid;
 gap: 2px;
 text-align: left;
 cursor: pointer;
 color: var(--ink-strong);
 transition: border-color 0.18s ease, background 0.18s ease;
}

.pigeon-call-contact:hover,
.pigeon-call-contact:focus-visible {
 border-color: rgba(15, 23, 42, 0.22);
 background: rgba(15, 23, 42, 0.04);
 outline: none;
}

.pigeon-call-contact span {
 font-size: 0.8rem;
 color: var(--ink-muted);
}

.mail-search {
 position: relative;
 flex: 1;
 max-width: 520px;
}

.mail-search__box {
 display: flex;
 align-items: center;
 gap: 8px;
 padding: 6px 12px;
 border-radius: 999px;
 border: 1px solid var(--stroke);
 background: #f8f9fb;
}

.mail-search__icon {
 width: 16px;
 height: 16px;
 stroke: var(--ink-muted);
 stroke-width: 1.8;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
}

.mail-search__input {
 border: none;
 background: transparent;
 color: var(--ink-strong);
 font-size: 0.9rem;
 flex: 1;
 min-width: 0;
 outline: none;
}

.mail-search__options {
 border: none;
 background: transparent;
 color: var(--ink-muted);
 width: 28px;
 height: 28px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 border-radius: 8px;
 cursor: pointer;
}

.mail-search__options svg {
 width: 18px;
 height: 18px;
 stroke: currentColor;
 stroke-width: 1.6;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
}

.mail-search__options:hover {
 background: rgba(15, 23, 42, 0.06);
 color: var(--ink-strong);
}

.mail-search__panel {
 position: absolute;
 top: calc(100% + 8px);
 left: 0;
 width: min(420px, 90vw);
 background: #fff;
 border: 1px solid var(--stroke);
 border-radius: 16px;
 padding: 14px;
 box-shadow: 0 18px 36px rgba(15, 23, 42, 0.12);
 display: grid;
 gap: 10px;
 z-index: 6;
}

.mail-search__panel[hidden] {
 display: none;
}

.mail-search__panel label {
 display: grid;
 gap: 6px;
 font-size: 0.75rem;
 color: var(--ink-muted);
}

.mail-search__panel input[type="text"],
.mail-search__panel input[type="search"] {
 border: 1px solid var(--stroke);
 border-radius: 10px;
 padding: 8px 10px;
 font-size: 0.85rem;
 color: var(--ink-strong);
}

.mail-search__row {
 display: flex;
 gap: 12px;
 align-items: center;
 flex-wrap: wrap;
}

.mail-search__check {
 display: inline-flex;
 align-items: center;
 gap: 8px;
 font-size: 0.8rem;
 color: var(--ink-strong);
}

.mail-search__actions {
 display: flex;
 justify-content: flex-end;
 gap: 10px;
}

.mail-accounts {
 position: relative;
}

.mail-accounts__toggle {
 display: inline-flex;
 align-items: center;
 gap: 8px;
 padding: 6px 12px;
 border-radius: 999px;
 border: 1px solid var(--stroke);
 background: #fff;
 color: var(--ink-strong);
 font-size: 0.85rem;
 cursor: pointer;
}

.mail-accounts__toggle svg {
 width: 14px;
 height: 14px;
 stroke: currentColor;
 stroke-width: 1.8;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
}

.mail-accounts__menu {
 position: absolute;
 right: 0;
 top: calc(100% + 8px);
 background: #fff;
 border: 1px solid var(--stroke);
 border-radius: 12px;
 padding: 10px;
 display: grid;
 gap: 8px;
 min-width: 200px;
 box-shadow: 0 18px 36px rgba(15, 23, 42, 0.12);
 z-index: 6;
 font-size: 0.85rem;
 color: var(--ink-strong);
}

.mail-accounts__menu label {
 display: inline-flex;
 align-items: center;
 gap: 8px;
}

.mail-topbar__spacer {
 flex: 1;
}

.mail-topbar__actions {
 display: flex;
 align-items: center;
 gap: 12px;
}

.mail-topbar__settings {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 padding: 4px 6px;
 border-radius: 8px;
 border: none;
 background: transparent;
 color: var(--ink-muted);
 text-decoration: none;
 font-size: 1.1rem;
}

.mail-topbar__settings:hover {
 color: var(--ink-strong);
 background: rgba(15, 23, 42, 0.06);
}

.mail-tab-breadcrumbs {
 display: flex;
 align-items: center;
 gap: 8px;
 padding: 0 0 2px;
 min-height: 28px;
 color: var(--ink-muted);
}

.mail-tab-breadcrumbs[hidden] {
 display: none;
}

.mail-tab-breadcrumbs__path {
 display: inline-flex;
 align-items: center;
 gap: 6px;
 min-width: 0;
 max-width: 100%;
 overflow-x: auto;
 scrollbar-width: thin;
}

.mail-tab-breadcrumbs__segment {
 border: none;
 background: none;
 color: var(--ink-muted);
 font-size: 0.78rem;
 line-height: 1.2;
 padding: 2px 0;
 white-space: nowrap;
 cursor: pointer;
}

.mail-tab-breadcrumbs__segment:hover,
.mail-tab-breadcrumbs__segment:focus-visible {
 color: var(--ink-strong);
 outline: none;
}

.mail-tab-breadcrumbs__segment.is-current {
 color: var(--ink-strong);
 font-weight: 600;
 cursor: default;
}

.mail-tab-breadcrumbs__segment.is-drop {
 border-radius: 6px;
 background: rgba(15, 23, 42, 0.06);
 color: var(--ink-strong);
}

.mail-tab-breadcrumbs__sep {
 color: var(--ink-muted);
 font-size: 0.75rem;
 line-height: 1;
}

.mail-tabs {
 display: flex;
 align-items: center;
 gap: 10px;
 flex-wrap: nowrap;
 overflow-x: hidden;
 overflow-y: hidden;
 min-height: 34px;
 padding-bottom: 0;
 border-bottom: 1px solid var(--stroke);
}

.mail-tab {
 display: inline-flex;
 align-items: center;
 gap: 8px;
 border: none;
 background: none;
 color: var(--ink-muted);
 font-weight: 500;
 font-size: 0.95rem;
 padding: 4px 0 0;
 border-bottom: 2px solid transparent;
 cursor: pointer;
 transition: color 0.2s ease, border-color 0.2s ease;
}

.mail-tab--refresh {
 width: 28px;
 height: 28px;
 padding: 0;
 border: none;
 border-bottom: none;
 border-radius: 8px;
 background: transparent;
 color: var(--ink-muted);
 justify-content: center;
}

.mail-refresh-status {
 font-size: 0.76rem;
 color: var(--ink-muted);
 white-space: nowrap;
 font-variant-numeric: tabular-nums;
 max-width: 220px;
 overflow: hidden;
 text-overflow: ellipsis;
}

.mail-refresh-status:empty {
 display: none;
}

.mail-refresh-status:empty + .mail-tab--inbox {
 margin-left: -14px;
}

.mail-tab--refresh:hover,
.mail-tab--refresh:focus-visible {
 color: var(--ink-strong);
 background: rgba(15, 23, 42, 0.06);
 outline: none;
}

.mail-tab--refresh svg {
 width: 18px;
 height: 18px;
 stroke: currentColor;
 stroke-width: 1.9;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
}

.mail-tab--right {
 margin-left: auto;
}

.mail-tab__icon {
 width: 20px;
 height: 20px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 color: currentColor;
}

.mail-tab--doit .mail-tab__icon {
 width: auto;
}

.mail-tab__icon svg {
 width: 20px;
 height: 20px;
 stroke: currentColor;
 stroke-width: 1.9;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
}

.mail-tab__icon--emoji {
 font-size: 1rem;
 line-height: 1;
}

.mail-tab__icon-text {
 font-size: 0.55rem;
 font-weight: 700;
 letter-spacing: 0.08em;
 text-transform: uppercase;
 line-height: 1;
}

.mail-doit-badge {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 border: 1px solid var(--ink-strong);
 border-radius: 6px;
 padding: 2px 4px;
 color: var(--ink-strong);
 background: transparent;
 white-space: nowrap;
}

.mail-tab.is-active .mail-doit-badge {
 color: rgb(var(--accent));
 border-color: rgb(var(--accent));
}

.mail-tab__label {
 display: inline-flex;
 align-items: center;
}

.mail-tab--aux {
 gap: 0;
 min-width: 26px;
 padding-right: 1px;
 overflow: hidden;
 transition: color 0.2s ease, border-color 0.2s ease, gap 0.2s ease, padding-right 0.2s ease;
}

.mail-tab--aux:hover,
.mail-tab--aux:focus-visible,
.mail-tab--aux:focus-within,
.mail-tab--aux.is-active {
 gap: 6px;
 padding-right: 6px;
}

@media (hover: hover) and (pointer: fine) {
 .mail-tab--aux .mail-tab__label {
  max-width: 0;
  opacity: 0;
  overflow: hidden;
  white-space: nowrap;
  margin-left: 0;
  transition: max-width 0.2s ease, opacity 0.2s ease, margin-left 0.2s ease;
 }

 .mail-tab--aux:hover .mail-tab__label,
 .mail-tab--aux:focus-visible .mail-tab__label,
 .mail-tab--aux:focus-within .mail-tab__label,
 .mail-tab--aux.is-active .mail-tab__label {
  max-width: 170px;
  opacity: 1;
  margin-left: 2px;
 }
}

.mail-tab.is-active {
 color: var(--ink-strong);
 border-bottom-color: rgb(var(--accent));
 font-weight: 600;
}

.mail-tab--add {
 position: relative;
 width: 24px;
 min-width: 24px;
 height: 24px;
 margin-left: 2px;
 margin-right: 2px;
 padding: 0 0 1px;
 border: none;
 border-bottom: none;
 border-radius: 0;
 background: transparent;
 color: #1E5ADC;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 line-height: 1;
 box-shadow: none;
 transform-origin: center;
 transition: color 0.18s ease, transform 0.18s ease;
}

.mail-tab--add .mail-tab--add__icon {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 width: 18px;
 height: 18px;
 transform-origin: center;
 transition: transform 0.22s cubic-bezier(0.2, 0.7, 0.2, 1), color 0.18s ease;
}

.mail-tab--add .mail-tab--add__icon svg {
 width: 18px;
 height: 18px;
 stroke: currentColor;
 stroke-width: 2.2;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
}

.mail-tab--add:hover,
.mail-tab--add:focus-visible {
 color: #0F54E7;
 background: transparent;
 box-shadow: none;
 transform: none;
 outline: none;
}

.mail-tab--add:hover .mail-tab--add__icon,
.mail-tab--add:focus-visible .mail-tab--add__icon {
 transform: rotate(180deg) scale(1.34);
}

@media (hover: hover) and (pointer: fine) {
 .mail-tab--add[data-tooltip]::after {
  content: attr(data-tooltip);
  position: absolute;
  left: 50%;
  top: calc(100% + 8px);
  transform: translate(-50%, -6px);
  opacity: 0;
  pointer-events: none;
  background: #0B1222;
  color: #fff;
  font-size: 0.7rem;
  font-weight: 500;
  line-height: 1.3;
  white-space: nowrap;
  padding: 6px 8px;
  border-radius: 8px;
  transition: opacity 0.14s ease, transform 0.14s ease;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.2);
  z-index: 20;
 }

 .mail-tab--add[data-tooltip]::before {
  content: none;
 }

 .mail-tab--add[data-tooltip]:hover::after,
 .mail-tab--add[data-tooltip]:focus-visible::after {
  opacity: 1;
  transform: translate(-50%, 0);
 }
}

.mail-tab-wrap,
.mail-subtab-wrap {
 display: inline-flex;
 align-items: center;
 gap: 2px;
 min-width: 0;
}

.mail-subtab-wrap {
 max-width: 100%;
}

.mail-tab__menu,
.mail-subtab__menu {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 width: 22px;
 height: 22px;
 border: none;
 border-radius: 999px;
 background: transparent;
 color: var(--ink-muted);
 cursor: pointer;
 padding: 0;
 flex: 0 0 auto;
 overflow: hidden;
 white-space: nowrap;
}

.mail-tab.is-path {
 color: var(--ink-strong);
}

.mail-tab-child-picker[hidden] {
 display: none;
}

.mail-tab-child-picker {
 display: flex;
 align-items: center;
 gap: 8px;
 min-height: 28px;
 padding: 0 0 6px;
 border-bottom: 1px solid var(--stroke);
}

.mail-tab-child-picker__list {
 flex: 1 1 auto;
 min-width: 0;
 display: flex;
 align-items: center;
 gap: 8px;
 overflow: hidden;
 white-space: nowrap;
}

.mail-tab-child-picker__item[hidden] {
 display: none;
}

.mail-tab-child-picker__item {
 border: none;
 border-radius: 0;
 border-bottom: 2px solid transparent;
 background: transparent;
 color: var(--ink-muted);
 display: inline-flex;
 align-items: center;
 gap: 8px;
 max-width: min(280px, 45vw);
 text-align: left;
 font-size: 0.82rem;
 line-height: 1.2;
 padding: 6px 2px;
 cursor: pointer;
 flex: 0 0 auto;
 transition: color 0.18s ease, border-color 0.18s ease;
}

.mail-tab-child-picker__item-content {
 display: inline-flex;
 align-items: center;
 gap: 7px;
 min-width: 0;
}

.mail-tab-child-picker__item-icon {
 width: 16px;
 height: 16px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 color: currentColor;
 flex: 0 0 auto;
}

.mail-tab-child-picker__item-icon svg {
 width: 16px;
 height: 16px;
 stroke: currentColor;
 stroke-width: 1.9;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
}

.mail-tab-child-picker__item-icon--emoji {
 font-size: 0.88rem;
 line-height: 1;
}

.mail-tab-child-picker__item-label {
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
 min-width: 0;
}

.mail-tab-child-picker__item:hover,
.mail-tab-child-picker__item:focus-visible {
 color: var(--ink-strong);
 outline: none;
}

.mail-tab-child-picker__item.is-path {
 color: var(--ink-strong);
}

.mail-tab-child-picker__item.is-active {
 color: rgb(var(--accent));
 font-weight: 600;
 border-bottom-color: rgb(var(--accent));
}

.mail-tab-child-picker__item.is-drop {
 color: var(--ink-strong);
 border-bottom-color: rgba(15, 23, 42, 0.34);
}

.mail-tab-child-picker__item-badge {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 min-width: 18px;
 height: 18px;
 padding: 0 6px;
 border-radius: 999px;
 background: rgba(15, 23, 42, 0.08);
 color: var(--ink-muted);
 font-size: 0.68rem;
 font-weight: 600;
 flex: 0 0 auto;
}

.mail-tab-child-picker__overflow {
 position: relative;
 flex: 0 0 auto;
}

.mail-tab-child-picker__overflow[hidden] {
 display: none;
}

.mail-tab-child-picker__overflow-toggle {
 border: 1px solid rgba(15, 23, 42, 0.14);
 border-radius: 8px;
 background: #fff;
 color: var(--ink-muted);
 display: inline-flex;
 align-items: center;
 justify-content: center;
 height: 28px;
 padding: 0 12px;
 font-size: 0.78rem;
 font-weight: 600;
 cursor: pointer;
}

.mail-tab-child-picker__overflow-toggle:hover,
.mail-tab-child-picker__overflow-toggle:focus-visible {
 border-color: rgba(15, 23, 42, 0.24);
 color: var(--ink-strong);
 outline: none;
}

.mail-tab-child-picker__overflow-menu {
 position: absolute;
 top: calc(100% + 6px);
 right: 0;
 min-width: 220px;
 max-width: min(360px, calc(100vw - 16px));
 max-height: min(52vh, 360px);
 overflow: auto;
 padding: 6px;
 border: 1px solid rgba(15, 23, 42, 0.14);
 border-radius: 12px;
 background: #fff;
 box-shadow: 0 16px 34px rgba(15, 23, 42, 0.18);
 display: grid;
 gap: 4px;
 z-index: 71;
}

.mail-tab-child-picker__overflow-menu[hidden] {
 display: none;
}

.mail-tab-child-picker__overflow-item {
 border: none;
 border-radius: 0;
 border-bottom: 1px solid rgba(15, 23, 42, 0.08);
 background: transparent;
 color: var(--ink-strong);
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 8px;
 text-align: left;
 font-size: 0.82rem;
 line-height: 1.2;
 padding: 8px 6px;
 cursor: pointer;
}

.mail-tab-child-picker__overflow-main {
 display: inline-flex;
 align-items: center;
 gap: 7px;
 min-width: 0;
 flex: 1 1 auto;
}

.mail-tab-child-picker__overflow-item:hover,
.mail-tab-child-picker__overflow-item:focus-visible {
 background: rgba(15, 23, 42, 0.04);
 outline: none;
}

.mail-tab-child-picker__overflow-item.is-path {
 color: var(--ink-strong);
}

.mail-tab-child-picker__overflow-item.is-active {
  color: rgb(var(--accent));
  font-weight: 600;
}

.mail-tab-child-picker__overflow-item.is-drop {
 background: rgba(15, 23, 42, 0.06);
}

.mail-tab-child-picker__overflow-label {
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
 min-width: 0;
}

.mail-tab-child-picker__overflow-main .mail-tab-child-picker__item-icon {
 width: 15px;
 height: 15px;
}

.mail-tab-child-picker__overflow-main .mail-tab-child-picker__item-icon svg {
 width: 15px;
 height: 15px;
}

.mail-tab__menu:hover,
.mail-tab__menu:focus-visible,
.mail-subtab__menu:hover,
.mail-subtab__menu:focus-visible {
 color: var(--ink-strong);
 background: rgba(15, 23, 42, 0.08);
 outline: none;
}

@media (hover: hover) and (pointer: fine) {
 .mail-tab__menu,
 .mail-subtab__menu {
  opacity: 0;
  pointer-events: none;
  width: 0;
  margin-left: 0;
  transform: scale(0.86);
  transition: opacity 0.18s ease, width 0.18s ease, margin-left 0.18s ease, transform 0.18s ease;
 }

 .mail-tab-wrap:hover .mail-tab__menu,
 .mail-tab-wrap:focus-within .mail-tab__menu,
 .mail-subtab-wrap:hover .mail-subtab__menu,
 .mail-subtab-wrap:focus-within .mail-subtab__menu {
  opacity: 1;
  pointer-events: auto;
  width: 22px;
  margin-left: 2px;
  transform: scale(1);
 }
}

.mail-tab.has-custom-color .mail-tab__icon,
.mail-subtab.has-custom-color {
 color: var(--mail-tab-custom-color, var(--ink-muted));
}

.mail-subtab.has-custom-color:hover,
.mail-subtab.has-custom-color:focus-visible {
 color: var(--mail-tab-custom-color, var(--ink-strong));
}

.mail-subtab.has-custom-color.is-active {
 color: var(--mail-tab-custom-color, var(--ink-strong));
 border-bottom-color: var(--mail-tab-custom-color, rgb(var(--accent)));
}

.mail-tab-context-menu[hidden] {
 display: none;
}

.mail-tab-context-menu {
 position: fixed;
 min-width: 220px;
 max-width: min(320px, 88vw);
 padding: 8px;
 border-radius: 12px;
 border: 1px solid rgba(15, 23, 42, 0.12);
 background: #fff;
 box-shadow: 0 18px 40px rgba(15, 23, 42, 0.2);
 z-index: 70;
 display: grid;
 gap: 4px;
}

.mail-tab-context-menu__item {
 border: none;
 border-radius: 8px;
 background: transparent;
 color: var(--ink-strong);
 text-align: left;
 font-size: 0.86rem;
 padding: 8px 10px;
 cursor: pointer;
}

.mail-tab-context-menu__item:hover,
.mail-tab-context-menu__item:focus-visible {
 background: rgba(15, 23, 42, 0.06);
 outline: none;
}

.mail-tab-context-menu__item[disabled] {
 opacity: 0.55;
 cursor: not-allowed;
}

.mail-tab-context-menu__hint {
 margin: 4px 4px 2px;
 font-size: 0.75rem;
 color: var(--ink-muted);
}

.mail-tab.is-drop,
.mail-subtab.is-drop {
 background: rgba(15, 23, 42, 0.06);
 color: var(--ink-strong);
}

.mail-subtabs {
 display: flex;
 align-items: center;
 gap: 16px;
 padding: 6px 0 10px;
 border-bottom: 1px solid var(--stroke);
 flex-wrap: wrap;
}

.mail-subtabs[hidden],
.mail-subtabs:empty {
 display: none;
 padding: 0;
 border-bottom: 0;
}

.mail-subtab {
 border: none;
 background: none;
 color: var(--ink-muted);
 padding: 6px 0;
 padding-left: calc(var(--tab-depth, 0) * 14px);
 display: inline-flex;
 align-items: center;
 gap: 6px;
 text-align: left;
 font-size: 0.85rem;
 cursor: pointer;
 border-bottom: 2px solid transparent;
 transition: color 0.2s ease, border-color 0.2s ease;
}

.mail-subtab .mail-tab__icon {
 width: 16px;
 height: 16px;
}

.mail-subtab .mail-tab__icon--emoji {
 font-size: 0.9rem;
}

.mail-subtab .mail-tab__icon svg {
 width: 16px;
 height: 16px;
 stroke-width: 1.8;
}

.mail-subtab:hover {
 color: var(--ink-strong);
}

.mail-subtab.is-active {
 color: var(--ink-strong);
 border-bottom-color: rgb(var(--accent));
 font-weight: 600;
}

.mail-tab__badge {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 min-width: 18px;
 height: 18px;
 padding: 0 6px;
 border-radius: 999px;
 background: rgba(15, 23, 42, 0.08);
 color: var(--ink-muted);
 font-size: 0.7rem;
 font-weight: 600;
 margin-left: 6px;
}

.mail-tab.is-active .mail-tab__badge {
 color: var(--ink-strong);
 background: rgba(50, 120, 255, 0.18);
}

.mail-tab__badge--spam {
 background: rgba(220, 38, 38, 0.16);
 color: rgb(185, 28, 28);
}

.mail-tab.is-active .mail-tab__badge--spam {
 background: rgba(220, 38, 38, 0.24);
 color: rgb(153, 27, 27);
}

.mail-tab-modal[hidden] {
 display: none;
}

.mail-tab-modal {
 position: fixed;
 inset: 0;
 background: rgba(15, 23, 42, 0.3);
 display: flex;
 align-items: center;
 justify-content: center;
 z-index: 12;
}

.mail-tab-modal[data-mailbox-detail-modal] {
 background: rgba(15, 23, 42, 0.35);
 display: grid;
 place-items: center;
 padding: 24px;
 z-index: 60;
}

.mail-tab-modal[data-mailbox-detail-modal][hidden] {
 display: none;
}

.mail-tab-modal[data-your-inbox-signature-modal] {
 padding: 24px;
 align-items: center;
}

.mail-tab-modal[data-your-inbox-signature-modal] .mail-tab-modal__panel--signature {
 width: min(1120px, calc(100vw - 48px));
 max-height: calc(100vh - 48px);
 padding: 16px 20px 14px;
 overflow: hidden;
 display: flex;
 flex-direction: column;
 gap: 12px;
}

.mail-tab-modal[data-your-inbox-signature-modal] .mail-tab-modal__panel--signature .mail-form {
 display: grid;
 gap: 16px;
 min-height: 0;
 overflow-y: auto;
 overflow-x: hidden;
 padding-right: 4px;
}

.mail-tab-modal[data-your-inbox-signature-modal] .mail-tab-modal__panel--signature .mail-form .mail-signature-modal__meta {
 display: grid;
 grid-template-columns: repeat(2, minmax(0, 1fr));
 gap: 14px 22px;
 align-items: end;
}

.mail-tab-modal[data-your-inbox-signature-modal] .mail-tab-modal__panel--signature .mail-form .mail-signature-modal__meta-field {
 display: grid;
 gap: 10px;
 min-width: 0;
}

.mail-tab-modal[data-your-inbox-signature-modal] .mail-tab-modal__panel--signature .mail-form .mail-signature-modal__footer {
 position: sticky;
 bottom: 0;
 z-index: 4;
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 16px;
 margin-top: 6px;
 padding-top: 12px;
 border-top: 1px solid rgba(15, 23, 42, 0.08);
 background: linear-gradient(to top, rgba(255, 255, 255, 0.98) 72%, rgba(255, 255, 255, 0.88));
}

.mail-tab-modal[data-your-inbox-signature-modal] .mail-tab-modal__panel--signature .mail-form .mail-signature-modal__footer .mail-status {
 flex: 1 1 auto;
 min-width: 0;
}

.mail-tab-modal[data-your-inbox-signature-modal] .mail-tab-modal__panel--signature .mail-form .mail-tab-modal__actions--signature {
 flex: 0 0 auto;
 margin-top: 0;
}

@media (max-width: 900px) {
 .mail-tab-modal[data-your-inbox-signature-modal] {
  padding: 12px;
 }

 .mail-tab-modal[data-your-inbox-signature-modal] .mail-tab-modal__panel--signature {
  width: calc(100vw - 24px);
  max-height: calc(100vh - 24px);
  padding: 14px 14px 12px;
 }

 .mail-tab-modal[data-your-inbox-signature-modal] .mail-tab-modal__panel--signature .mail-form .mail-signature-modal__meta {
  grid-template-columns: 1fr;
  gap: 12px;
 }

 .mail-tab-modal[data-your-inbox-signature-modal] .mail-tab-modal__panel--signature .mail-form .mail-signature-modal__footer {
  align-items: flex-start;
  flex-direction: column;
 }

 .mail-tab-modal[data-your-inbox-signature-modal] .mail-tab-modal__panel--signature .mail-form .mail-tab-modal__actions--signature {
  width: 100%;
  justify-content: flex-end;
 }
}

.mail-tab-modal__panel {
 background: #fff;
 border: 1px solid rgba(15, 23, 42, 0.08);
 border-radius: 14px;
 padding: 14px 20px 12px;
 display: grid;
 gap: 14px;
 width: min(400px, 92vw);
 box-shadow: 0 20px 45px rgba(15, 23, 42, 0.16);
}

.mail-tab-modal__panel--wide {
 width: min(520px, 94vw);
}

.mail-tab-modal[data-mail-tab-settings-modal] .mail-tab-modal__panel {
 max-height: min(84vh, 760px);
 overflow-y: auto;
 overflow-x: hidden;
 overscroll-behavior: contain;
}

.mail-tab-modal__panel--details {
 width: min(720px, 96vw);
 height: min(82vh, 820px);
 min-height: min(520px, 70vh);
 border: none;
 border-radius: 12px;
 padding: 0;
 box-shadow: none;
 gap: 0;
 overflow: hidden;
 background: #fff;
 display: flex;
 flex-direction: column;
 position: relative;
}

.mail-tab-modal__panel h3 {
 margin: 0;
 font-size: 1.05rem;
 letter-spacing: -0.01em;
}

.mail-tab-settings__header {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 10px;
}

.mail-tab-settings__header h3 {
 margin: 0;
}

.mail-tab-settings__header-actions {
 display: inline-flex;
 align-items: center;
 gap: 8px;
}

.mail-tab-settings__edit-toggle {
 display: inline-flex;
 align-items: center;
 gap: 0.35rem;
 background: none;
 border: none;
 padding: 0;
 font: inherit;
 color: var(--ink-muted);
 cursor: pointer;
 white-space: nowrap;
}

.mail-tab-settings__edit-toggle:hover,
.mail-tab-settings__edit-toggle:focus-visible {
 color: #3278FF;
 text-decoration: underline;
 text-underline-offset: 3px;
 outline: none;
}

.mail-tab-settings__close {
 width: 30px;
 height: 30px;
 border: none;
 border-radius: 8px;
 background: transparent;
 color: var(--ink-muted);
 font-size: 1rem;
 line-height: 1;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 cursor: pointer;
}

.mail-tab-settings__close:hover,
.mail-tab-settings__close:focus-visible {
 background: rgba(15, 23, 42, 0.08);
 color: var(--ink-strong);
 outline: none;
}

.mail-tab-modal__panel label {
 display: grid;
 gap: 6px;
 font-size: 0.82rem;
 color: rgba(15, 23, 42, 0.65);
}

.mail-tab-modal__panel .mail-status {
 min-height: 0;
}

.mail-tab-modal__panel input:not([type="checkbox"]):not(.mail-toggle),
.mail-tab-modal__panel select,
.mail-tab-modal__panel textarea {
 border: none;
 border-bottom: 1px solid rgba(15, 23, 42, 0.2);
 border-radius: 0;
 padding: 6px 0;
 font-size: 0.9rem;
 color: var(--ink-strong);
 background: transparent;
 width: 100%;
}

.mail-tab-modal__panel input:not([type="checkbox"]):not(.mail-toggle):focus,
.mail-tab-modal__panel select:focus,
.mail-tab-modal__panel textarea:focus {
 outline: none;
 border-bottom-color: #3278FF;
}

.mail-tab-modal__panel--details h3 {
 margin: 0 0 4px;
}

.mail-tab-modal__panel--details label {
 font-size: 12px;
 letter-spacing: 0.08em;
 text-transform: uppercase;
 color: rgba(15, 23, 42, 0.6);
 font-weight: 600;
}

.mail-field-label__row {
 display: inline-flex;
 align-items: center;
 gap: 8px;
}

.mail-field-help {
 position: relative;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 width: 16px;
 height: 16px;
 padding: 0;
 border-radius: 999px;
 border: 1px solid rgba(15, 23, 42, 0.2);
 background: #fff;
 color: rgba(15, 23, 42, 0.6);
 font-size: 0.7rem;
 font-weight: 700;
 line-height: 1;
 cursor: help;
 text-transform: none;
 letter-spacing: 0;
 box-shadow: none;
 appearance: none;
}

.mail-field-help:hover,
.mail-field-help:focus-visible {
 color: #3278FF;
 border-color: rgba(50, 120, 255, 0.5);
 outline: none;
}

.mail-field-help__tooltip {
 position: absolute;
 left: 50%;
 top: calc(100% + 8px);
 transform: translate(-50%, -6px);
 background: #0B1222;
 color: #fff;
 padding: 6px 8px;
 border-radius: 8px;
 font-size: 0.7rem;
 font-weight: 500;
 line-height: 1.3;
 letter-spacing: 0;
 text-transform: none;
 white-space: normal;
 width: max-content;
 max-width: 220px;
 opacity: 0;
 visibility: hidden;
 pointer-events: none;
 transition: opacity 120ms ease, transform 120ms ease;
 box-shadow: 0 10px 24px rgba(15, 23, 42, 0.2);
 z-index: 6;
}

.mail-field-help:hover .mail-field-help__tooltip,
.mail-field-help:focus-visible .mail-field-help__tooltip {
 opacity: 1;
 visibility: visible;
 transform: translate(-50%, 0);
}

.mail-field-help--right .mail-field-help__tooltip {
 left: 0;
 transform: translate(0, -6px);
}

.mail-field-help--right:hover .mail-field-help__tooltip,
.mail-field-help--right:focus-visible .mail-field-help__tooltip {
 transform: translate(0, 0);
}

.mail-tab-modal__panel--details input,
.mail-tab-modal__panel--details select,
.mail-tab-modal__panel--details textarea {
 border: none;
 border-bottom: 1px solid rgba(15, 23, 42, 0.2);
 border-radius: 0;
 background: none;
 padding: 6px 0;
 font: inherit;
 color: inherit;
}

.mail-tab-modal__hint {
 font-size: 0.75rem;
 color: var(--ink-muted);
 margin: 0;
}

.mail-tab-icon-picker {
 position: relative;
 margin-top: 8px;
}

.mail-tab-icon-picker__trigger {
 width: 100%;
 border: 1px solid rgba(15, 23, 42, 0.16);
 border-radius: 10px;
 background: #fff;
 color: var(--ink-strong);
 display: flex;
 align-items: center;
 gap: 10px;
 padding: 8px 10px;
 font: inherit;
 cursor: pointer;
 transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.mail-tab-icon-picker__trigger:hover,
.mail-tab-icon-picker__trigger:focus-visible {
 border-color: rgba(50, 120, 255, 0.58);
 outline: none;
}

.mail-tab-icon-picker__trigger[aria-expanded="true"] {
 border-color: #3278FF;
 box-shadow: inset 0 0 0 1px rgba(50, 120, 255, 0.35);
}

.mail-tab-icon-picker__trigger:disabled {
 opacity: 0.55;
 cursor: not-allowed;
}

.mail-tab-icon-picker--add-modal .mail-tab-icon-picker__trigger {
 border: none;
 border-bottom: 1px solid rgba(15, 23, 42, 0.2);
 border-radius: 0;
 background: transparent;
 padding: 6px 0;
 box-shadow: none;
}

.mail-tab-icon-picker--add-modal .mail-tab-icon-picker__trigger:hover,
.mail-tab-icon-picker--add-modal .mail-tab-icon-picker__trigger:focus-visible {
 border-bottom-color: rgba(15, 23, 42, 0.2);
 box-shadow: none;
}

.mail-tab-icon-picker--add-modal .mail-tab-icon-picker__trigger[aria-expanded="true"] {
 border-bottom-color: #3278FF;
 box-shadow: none;
}

.mail-tab-icon-picker--add-modal .mail-tab-icon-picker__trigger-label {
 font-size: 0.9rem;
 color: var(--ink-strong);
}

.mail-tab-icon-picker--add-modal .mail-tab-icon-picker__panel {
 border: none;
 box-shadow: 0 16px 34px rgba(15, 23, 42, 0.16);
}

.mail-tab-icon-picker__selected {
 width: 22px;
 height: 22px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 font-size: 1.1rem;
 line-height: 1;
}

.mail-tab-icon-picker__trigger-label {
 flex: 1;
 min-width: 0;
 text-align: left;
 font-size: 0.84rem;
 color: var(--ink-muted);
}

.mail-tab-icon-picker__chevron {
 width: 16px;
 height: 16px;
 color: var(--ink-muted);
}

.mail-tab-icon-picker__chevron svg {
 width: 16px;
 height: 16px;
 stroke: currentColor;
 stroke-width: 1.9;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
}

.mail-tab-icon-picker__panel {
 position: absolute;
 left: 0;
 right: 0;
 top: calc(100% + 8px);
 border: 1px solid rgba(15, 23, 42, 0.14);
 border-radius: 12px;
 background: #fff;
 box-shadow: 0 16px 34px rgba(15, 23, 42, 0.18);
 padding: 10px;
 z-index: 40;
}

.mail-tab-icon-picker__panel[hidden] {
 display: none;
}

.mail-tab-icon-picker__grid {
 display: grid;
 grid-template-columns: repeat(auto-fill, minmax(32px, 1fr));
 gap: 4px;
 max-height: 220px;
 overflow: auto;
}

.mail-tab-icon-picker__option {
 width: 32px;
 height: 32px;
 border: none;
 border-radius: 8px;
 background: transparent;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 font-size: 1.15rem;
 line-height: 1;
 cursor: pointer;
 transition: background 0.16s ease;
}

.mail-tab-icon-picker__option:hover,
.mail-tab-icon-picker__option:focus-visible {
 background: rgba(15, 23, 42, 0.08);
 outline: none;
}

.mail-tab-icon-picker__option.is-selected {
 background: rgba(50, 120, 255, 0.16);
}

.mail-tab-icon-picker__option:disabled {
 opacity: 0.55;
 cursor: not-allowed;
}

.mail-tab-settings__editor {
 display: grid;
 gap: 12px;
}

.mail-tab-settings__editor[hidden] {
 display: none;
}

.mail-tab-settings__mailboxes-field {
 display: grid;
 gap: 6px;
}

.mail-tab-settings__mailboxes-field .mail-mailboxes {
 width: 100%;
}

.mail-tab-settings__mailboxes-field .mail-mailboxes__toggle {
 width: 100%;
 min-width: 0;
 border: none;
 border-bottom: 1px solid rgba(15, 23, 42, 0.2);
 border-radius: 0;
 background: transparent;
 padding: 6px 0;
}

.mail-tab-settings__mailboxes-field .mail-mailboxes__toggle:hover,
.mail-tab-settings__mailboxes-field .mail-mailboxes__toggle:focus-visible,
.mail-tab-settings__mailboxes-field .mail-mailboxes__toggle[aria-expanded="true"] {
 border-bottom-color: #3278FF;
 background: transparent;
}

.mail-tab-settings__mailboxes-hint {
 font-size: 0.75rem;
 color: var(--ink-muted);
}

.mail-mailboxes--tab-settings .mail-mailboxes__menu {
 top: calc(100% + 6px);
 min-width: 100%;
 max-width: 100%;
 max-height: min(42vh, 220px);
 overflow-y: auto;
 padding: 6px;
 gap: 2px;
 z-index: 24;
}

.mail-mailboxes--tab-settings .mail-mailboxes__option {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
 padding: 5px 8px;
 min-height: 30px;
 font-size: 0.78rem;
}

.mail-mailboxes--tab-settings .mail-mailboxes__option-text {
 flex: 1;
 min-width: 0;
 line-height: 1.2;
 font-size: 0.78rem;
}

.mail-mailboxes--tab-settings .mail-mailboxes__option input {
 flex: 0 0 auto;
 width: 16px;
 height: 16px;
 margin: 0 0 0 12px;
}

.mail-tab-settings__overview {
 margin: 0.4rem 0 0;
 padding: 0;
 border-top: 1px solid rgba(15, 23, 42, 0.12);
}

.mail-tab-settings__overview-row {
 margin: 0;
 padding: 0.78rem 0;
 border-bottom: 1px solid rgba(15, 23, 42, 0.12);
 display: grid;
 grid-template-columns: minmax(120px, 180px) minmax(0, 1fr);
 gap: 0.9rem;
 align-items: baseline;
}

.mail-tab-settings__overview-row dt {
 margin: 0;
 font-size: 0.72rem;
 letter-spacing: 0.09em;
 text-transform: uppercase;
 color: var(--ink-muted);
}

.mail-tab-settings__overview-row dd {
 margin: 0;
 color: var(--ink-strong);
 line-height: 1.45;
 overflow-wrap: anywhere;
}

.mail-tab-settings__visibility {
 display: grid;
 gap: 0.16rem;
}

.mail-tab-settings__visibility-list {
 margin: 0;
 padding: 0 0 0 0.85rem;
 display: grid;
 gap: 0.08rem;
 font-size: 0.76rem;
 line-height: 1.2;
}

.mail-tab-settings__visibility-list[hidden] {
 display: none;
}

.mail-tab-settings__visibility-list li {
 margin: 0;
 padding: 0;
}

.mail-tab-settings__icon-value {
 font-size: 1.05rem;
 line-height: 1;
}

.mail-tab-settings__count-value {
 font-variant-numeric: tabular-nums;
 font-weight: 600;
}

.mail-tab-settings__info {
 display: grid;
 gap: 6px;
 margin-top: 2px;
}

.mail-tab-settings__danger-zone {
 margin: 0;
 border: none;
 background: none;
 border-top: 1px solid rgba(15, 23, 42, 0.09);
 padding-top: 8px;
}

.mail-tab-settings__danger-zone summary {
 list-style: none;
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 0.6rem;
 cursor: pointer;
 padding: 0;
 color: #b91c1c;
 font-size: 0.9rem;
 font-weight: 600;
}

.mail-tab-settings__danger-zone summary::-webkit-details-marker {
 display: none;
}

.mail-tab-settings__danger-zone summary:hover,
.mail-tab-settings__danger-zone summary:focus-visible {
 color: #991b1b;
 outline: none;
}

.mail-tab-settings__danger-chevron {
 font-size: 0.92rem;
 transition: transform 0.2s ease;
}

.mail-tab-settings__danger-zone[open] .mail-tab-settings__danger-chevron {
 transform: rotate(90deg);
}

.mail-tab-settings__danger-content {
 display: grid;
 gap: 0.65rem;
 padding-top: 0.6rem;
}

.mail-tab-settings__danger-actions {
 display: flex;
 flex-direction: column;
 align-items: flex-start;
 gap: 0.45rem;
}

.mail-tab-settings__link-action {
 background: none;
 border: none;
 padding: 0;
 font: inherit;
 color: var(--ink-muted);
 cursor: pointer;
}

.mail-tab-settings__link-action--danger {
 color: #d72828;
}

.mail-tab-settings__link-action:hover,
.mail-tab-settings__link-action:focus-visible {
 color: #3278FF;
 text-decoration: underline;
 text-underline-offset: 3px;
 outline: none;
}

.mail-tab-settings__link-action--danger:hover,
.mail-tab-settings__link-action--danger:focus-visible {
 color: #d72828;
}

.mail-tab-settings__link-action[disabled] {
 opacity: 0.45;
 cursor: not-allowed;
 pointer-events: none;
 text-decoration: none;
}

.mail-tab-settings__danger-form {
 display: none;
 gap: 0.65rem;
 padding-top: 0.2rem;
 border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.mail-tab-settings__danger-form.is-visible {
 display: grid;
}

.mail-tab-settings__danger-warning {
 margin: 0;
 font-size: 0.82rem;
 color: #991b1b;
}

.mail-tab-settings__danger-hint {
 margin: 0;
 font-size: 0.78rem;
 color: var(--ink-soft);
}

.mail-tab-settings__danger-hint.is-warning {
 color: #b42318;
}

.mail-tab-settings__delete-readiness {
 margin: 0;
 display: inline-flex;
 align-items: center;
 gap: 0.42rem;
 font-size: 0.78rem;
 font-weight: 600;
}

.mail-tab-settings__delete-readiness.is-pending {
 color: var(--ink-muted);
}

.mail-tab-settings__delete-readiness.is-blocked {
 color: #b42318;
}

.mail-tab-settings__delete-readiness.is-ready {
 color: #10794b;
}

.mail-tab-settings__delete-readiness-icon {
 width: 1rem;
 min-width: 1rem;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 font-size: 0.85rem;
 line-height: 1;
}

.mail-tab-settings__danger-field {
 display: grid;
 gap: 0.3rem;
}

.mail-tab-settings__danger-field label {
 font-size: 0.8rem;
 font-weight: 600;
 color: var(--ink-strong);
}

.mail-tab-settings__password-wrap {
 position: relative;
}

.mail-tab-settings__password-wrap input {
 width: 100%;
 padding-right: 2rem;
 box-sizing: border-box;
}

.mail-tab-settings__password-toggle {
 position: absolute;
 right: 0;
 top: 50%;
 transform: translateY(-50%);
 width: 1.75rem;
 height: 1.75rem;
 border: none;
 background: transparent;
 color: var(--ink-soft);
 padding: 0;
 display: flex;
 align-items: center;
 justify-content: center;
 cursor: pointer;
}

.mail-tab-settings__password-toggle:hover,
.mail-tab-settings__password-toggle:focus-visible,
.mail-tab-settings__password-toggle.is-active {
 color: var(--ink-strong);
 outline: none;
}

.mail-tab-settings__password-toggle svg {
 width: 1.05rem;
 height: 1.05rem;
 fill: currentColor;
}

.mail-tab-modal__panel label.mail-tab-settings__danger-checkbox {
 display: flex;
 align-items: flex-start;
 gap: 0.5rem;
 font-size: 0.82rem;
 color: var(--ink-strong);
}

.mail-tab-settings__danger-checkbox span {
 line-height: 1.35;
}

.mail-tab-modal__panel .mail-tab-settings__danger-checkbox input {
 width: 16px;
 height: 16px;
 margin: 0.15rem 0 0;
 padding: 0;
 border: none;
 border-bottom: none;
 border-radius: 0;
 background: transparent;
 box-shadow: none;
 flex: 0 0 16px;
 accent-color: #3278FF;
}

.mail-tab-settings__danger-form-actions {
 display: flex;
 justify-content: flex-end;
 align-items: center;
 gap: 0.6rem;
}

.mail-tab-settings__danger-form-actions .mail-tab-settings__link-action[disabled] {
 opacity: 0.45;
 cursor: not-allowed;
 pointer-events: none;
 text-decoration: none;
}

.mail-tab-modal__status {
 min-height: 18px;
 font-size: 0.8rem;
 color: var(--ink-muted);
 margin: 0;
}

.mail-tab-modal__status.is-error {
 color: #D72828;
}

.mail-tab-modal__status.is-success {
 color: #10794b;
}

.mail-tab-modal__actions {
 display: flex;
 justify-content: flex-end;
 gap: 18px;
 --action-divider-offset: 9px;
 margin-top: 6px;
 padding-top: 0;
}

.mail-tab-modal__actions[hidden] {
 display: none;
}

.mail-tab-modal[data-mail-tab-settings-modal] .mail-tab-modal__actions {
 position: sticky;
 bottom: 0;
 z-index: 4;
 padding-top: 10px;
 margin-top: 6px;
 background: linear-gradient(to top, rgba(255, 255, 255, 0.98) 72%, rgba(255, 255, 255, 0.88));
}

.mail-tab-modal__actions .btn + .btn {
 position: relative;
 padding-left: 0 !important;
}

.mail-tab-modal__actions .btn + .btn::before {
 content: "";
 position: absolute;
 left: calc(0px - var(--action-divider-offset));
 top: 50%;
 width: 1px;
 height: 24px;
 background: rgba(15, 23, 42, 0.3);
 transform: translateY(-50%);
}

.mail-tab-modal__actions .btn {
 background: none;
 border: none;
 border-radius: 0;
 padding: 0;
 font: inherit;
 font-weight: 600;
 color: var(--ink-strong);
 box-shadow: none;
 cursor: pointer;
 text-decoration: none;
}

.mail-tab-modal__actions .btn:hover,
.mail-tab-modal__actions .btn:focus-visible {
 color: #3278FF;
 box-shadow: none;
 transform: none;
 text-decoration: underline;
 text-underline-offset: 4px;
 text-decoration-thickness: 1px;
}

.mail-tab-modal__panel--details .mail-tab-modal__actions {
 margin-top: 6px;
 gap: 12px;
 --action-divider-offset: 6px;
}

.mail-tab-modal .btn {
 padding: 10px 14px;
 border-radius: 12px;
 font-weight: 600;
}

.mail-tab-modal__actions .btn,
.mail-tab-modal__actions .btn.primary,
.mail-tab-modal__actions .btn.ghost {
 background: none !important;
 border: none !important;
 border-radius: 0 !important;
 padding: 0 !important;
 color: var(--ink-strong) !important;
 box-shadow: none !important;
 transform: none !important;
 text-decoration: none !important;
}

.mail-tab-modal__actions .btn:hover,
.mail-tab-modal__actions .btn:focus-visible,
.mail-tab-modal__actions .btn.primary:hover,
.mail-tab-modal__actions .btn.primary:focus-visible,
.mail-tab-modal__actions .btn.ghost:hover,
.mail-tab-modal__actions .btn.ghost:focus-visible {
 color: #3278FF !important;
 box-shadow: none !important;
 transform: none !important;
 text-decoration: underline !important;
 text-underline-offset: 4px;
 text-decoration-thickness: 1px;
}

.mail-tab-modal .btn[disabled] {
 opacity: 0.6;
 cursor: not-allowed;
}

.mail-tab-modal .btn.primary {
 background: linear-gradient(135deg, rgb(var(--accent)), rgb(80, 140, 255));
 color: #fff;
 border: 1px solid rgba(50, 120, 255, 0.35);
 box-shadow: 0 12px 24px rgba(50, 120, 255, 0.2);
}

.mail-tab-modal .btn.primary:hover,
.mail-tab-modal .btn.primary:focus-visible {
 transform: translateY(-1px);
 box-shadow: 0 16px 30px rgba(50, 120, 255, 0.26);
 border-color: rgba(50, 120, 255, 0.45);
}

.mail-tab-modal .btn.ghost {
 background: rgba(15, 23, 42, 0.04);
 color: #0b1227;
 border: 1px solid rgba(15, 23, 42, 0.08);
}

.mail-tab-modal .btn.ghost:hover,
.mail-tab-modal .btn.ghost:focus-visible {
 background: rgba(15, 23, 42, 0.08);
 border-color: rgba(15, 23, 42, 0.14);
}

.mail-tab-modal .btn.ghost.danger {
 color: #b42318;
 background: rgba(217, 45, 32, 0.08);
 border-color: rgba(217, 45, 32, 0.28);
}

.mail-tab-modal .btn.ghost.danger:hover,
.mail-tab-modal .btn.ghost.danger:focus-visible {
 background: rgba(217, 45, 32, 0.12);
 border-color: rgba(217, 45, 32, 0.4);
}

.mail-tab-modal__panel--details .btn {
 border: none;
 background: none;
 padding: 0;
 border-radius: 0;
 box-shadow: none;
 font: inherit;
 font-size: var(--text-sm);
 font-weight: 600;
 color: rgba(15, 23, 42, 0.7);
 cursor: pointer;
}

.mail-tab-modal__panel--details .btn:hover,
.mail-tab-modal__panel--details .btn:focus-visible {
 color: #0b1227;
 transform: none;
 box-shadow: none;
}

.mail-tab-modal__panel--details .btn.primary,
.mail-tab-modal__panel--details .btn.ghost {
 background: none;
 border: none;
 box-shadow: none;
 transform: none;
}

.mail-tab-modal__panel--details .btn.primary:hover,
.mail-tab-modal__panel--details .btn.primary:focus-visible,
.mail-tab-modal__panel--details .btn.ghost:hover,
.mail-tab-modal__panel--details .btn.ghost:focus-visible,
.mail-tab-modal__panel--details .btn.ghost.danger:hover,
.mail-tab-modal__panel--details .btn.ghost.danger:focus-visible {
 background: none;
 border: none;
 box-shadow: none;
 transform: none;
}

.mail-tab-modal__panel--details .btn.ghost.danger {
 color: #b42318;
}

.mail-tab-modal__panel--details .btn.ghost.danger:hover,
.mail-tab-modal__panel--details .btn.ghost.danger:focus-visible {
 color: #8f1b12;
}

.mail-list {
 background: transparent;
 border: none;
 border-radius: 0;
 min-height: 0;
 flex: 1 1 auto;
 display: flex;
 flex-direction: column;
 overflow: hidden;
 padding: 0;
 box-shadow: none;
}

.mail-list__loading[hidden] {
 display: none;
 margin: 0;
 height: 0;
}

.mail-list__loading {
 height: 3px;
 margin: 6px 0 8px;
 border-radius: 999px;
 background: rgba(50, 120, 255, 0.14);
 overflow: hidden;
}

.mail-list__loading-bar {
 display: block;
 height: 100%;
 width: 45%;
 background: linear-gradient(
 90deg,
 transparent,
 rgba(50, 120, 255, 0.4),
 rgba(50, 120, 255, 0.9),
 transparent
 );
 animation: mail-loading-bar 1.1s ease-in-out infinite;
}

@keyframes mail-loading-bar {
 0% {
  transform: translateX(-120%);
 }
 100% {
  transform: translateX(220%);
 }
}

.mail-list__toolbar {
 display: flex;
 align-items: center;
 justify-content: space-between;
 padding: 8px 4px 6px;
 color: var(--ink-muted);
 font-size: 0.85rem;
}

.mail-list__select {
 display: flex;
 align-items: center;
 gap: 12px;
}

.mail-list__checkbox {
 width: 14px;
 height: 14px;
 margin: 0;
 accent-color: rgb(var(--accent));
 cursor: pointer;
 border-radius: 3px;
}

.mail-list__checkbox:focus-visible {
 outline: 2px solid rgb(var(--accent));
 outline-offset: 2px;
}

.mail-list__bulk {
 display: inline-flex;
 align-items: center;
 gap: 10px;
 opacity: 0;
 transform: translateX(-8px);
 pointer-events: none;
 transition: opacity 0.18s ease, transform 0.18s ease;
}

.mail-list__toolbar.has-selection .mail-list__bulk {
 opacity: 1;
 transform: translateX(0);
 pointer-events: auto;
}

.mail-list__placeholder {
 width: 140px;
 height: 6px;
 border-radius: 999px;
 background: rgba(15, 23, 42, 0.08);
}

.mail-list__actions {
 display: flex;
 align-items: center;
 gap: 10px;
 justify-content: flex-end;
 flex-wrap: nowrap;
}

.mail-list__actions .btn.mail-compose {
 display: inline-flex;
 align-items: center;
 gap: 6px;
 padding: 7px 12px;
 background: linear-gradient(180deg, #2563eb, #1d4ed8);
 color: #fff;
 border: 1px solid #1d4ed8;
 border-radius: 8px;
 box-shadow: 0 8px 16px rgba(15, 23, 42, 0.16);
 font-size: 0.82rem;
 line-height: 1;
}

.mail-list__actions .btn.mail-compose:hover,
.mail-list__actions .btn.mail-compose:focus-visible {
 background: linear-gradient(180deg, #1d4ed8, #1e40af);
 border-color: #1e40af;
 box-shadow: 0 10px 18px rgba(15, 23, 42, 0.2);
 outline: none;
}

.mail-list__actions .mail-compose__icon {
 width: 14px;
 height: 14px;
 stroke: currentColor;
 stroke-width: 1.8;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
 display: inline-block;
}

.mail-list__count {
 font-size: 0.85rem;
 color: var(--ink-muted);
 white-space: nowrap;
 font-variant-numeric: tabular-nums;
}

.mail-list__footer {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
 padding: 8px 4px 4px;
 color: var(--ink-muted);
 font-size: 0.82rem;
 border-top: 1px solid rgba(15, 23, 42, 0.08);
 background: #fff;
 position: relative;
 z-index: 5;
}

.mail-list__footer-count {
 white-space: nowrap;
 font-variant-numeric: tabular-nums;
}

.mail-list__footer-controls {
 display: inline-flex;
 align-items: center;
 gap: 8px;
}

.mail-list__footer-btn {
 border: 1px solid rgba(15, 23, 42, 0.16);
 background: #fff;
 color: var(--ink-strong);
 border-radius: 8px;
 font-size: 0.78rem;
 font-weight: 600;
 line-height: 1;
 padding: 6px 10px;
 cursor: pointer;
}

.mail-list__footer-btn:hover,
.mail-list__footer-btn:focus-visible {
 border-color: rgba(15, 23, 42, 0.3);
 background: rgba(15, 23, 42, 0.04);
 outline: none;
}

.mail-list__footer-btn[disabled] {
 opacity: 0.45;
 cursor: not-allowed;
}

.mail-tab--refresh.is-working svg {
 animation: mail-refresh-spin 0.9s linear infinite;
}

@keyframes mail-refresh-spin {
 0% {
  transform: rotate(0deg);
 }
 100% {
  transform: rotate(360deg);
 }
}

.mail-list__action {
 font-size: 1rem;
 color: var(--ink-muted);
 width: 28px;
 height: 28px;
 border: none;
 border-radius: 8px;
 background: transparent;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 cursor: pointer;
 transition: color 0.2s ease, background 0.2s ease;
}

.mail-list__action svg,
.mail-list__bulk-action svg {
 width: 18px;
 height: 18px;
 stroke: currentColor;
 stroke-width: 1.7;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
}

.mail-list__bulk-action svg {
 stroke-width: 1.8;
}

.mail-list__bulk-action {
 width: 28px;
 height: 28px;
 border: none;
 border-radius: 8px;
 background: transparent;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 color: var(--ink-muted);
 cursor: pointer;
 transition: color 0.2s ease, background 0.2s ease;
}

.mail-list__bulk-action[data-mail-bulk-action="do-it"] {
 width: auto;
 padding: 0 6px;
}

.mail-list__action:hover,
.mail-list__bulk-action:hover {
 color: var(--ink-strong);
 background: rgba(15, 23, 42, 0.06);
}

.mail-list__action:focus-visible,
.mail-list__bulk-action:focus-visible {
 outline: 2px solid rgb(var(--accent));
 outline-offset: 2px;
}

.mail-list__rows {
 min-height: 0;
 flex: 1 1 auto;
 display: flex;
 flex-direction: column;
 align-items: stretch;
 justify-content: flex-start;
 gap: 4px;
 padding: 0 0 8px;
 min-width: 0;
 overflow-y: auto;
 overflow-x: hidden;
}

.mail-list__rows.is-virtual {
 display: block;
 gap: 0;
}

.mail-virtual-rows {
 display: flex;
 flex-direction: column;
 align-items: stretch;
 gap: 4px;
}

.mail-virtual-spacer {
 width: 100%;
 height: 0;
}

.mail-list__empty {
 margin: 40px 0 0;
 color: var(--ink-muted);
 text-align: center;
}

.mail-list__empty.is-error {
 color: #D72828;
}

.mail-toast-stack {
 position: fixed;
 right: 24px;
 bottom: 24px;
 display: flex;
 flex-direction: column;
 gap: 8px;
 z-index: 30;
 pointer-events: none;
}

.mail-toast {
 background: rgba(15, 23, 42, 0.92);
 color: #fff;
 padding: 8px 12px;
 border-radius: 10px;
 font-size: 0.85rem;
 box-shadow: 0 12px 24px rgba(15, 23, 42, 0.2);
 opacity: 0;
 transform: translateY(6px);
 transition: opacity 0.2s ease, transform 0.2s ease;
}

.mail-toast.is-visible {
 opacity: 1;
 transform: translateY(0);
}

.mail-toast.is-error {
 background: #D72828;
}

.mail-toast.is-warning {
 background: #C26B05;
}

.mail-row {
 display: grid;
 grid-template-columns: 72px minmax(120px, 150px) minmax(0, 1fr) minmax(120px, 160px) minmax(110px, 140px);
 gap: 8px;
 padding: 6px 4px;
 border-bottom: 1px solid var(--stroke);
 font-size: 0.88rem;
 align-items: center;
 cursor: pointer;
 min-height: 34px;
 min-width: 0;
 overflow: visible;
 position: relative;
}

.mail-row.is-color-open {
 overflow: visible;
}

.mail-row:hover,
.mail-row:focus-within {
 overflow: visible;
}

.mail-row--skeleton {
 cursor: default;
 pointer-events: none;
 opacity: 0.75;
}

.mail-skeleton {
 display: inline-block;
 height: 10px;
 border-radius: 999px;
 background: linear-gradient(90deg, rgba(15, 23, 42, 0.08), rgba(15, 23, 42, 0.2), rgba(15, 23, 42, 0.08));
 background-size: 220% 100%;
 animation: mail-skeleton-shimmer 1.1s ease-in-out infinite;
}

.mail-skeleton--dot {
 width: 12px;
 height: 12px;
 border-radius: 50%;
}

.mail-skeleton--short {
 width: 70px;
 height: 10px;
}

.mail-skeleton--wide {
 width: 160px;
 height: 12px;
}

.mail-skeleton--thin {
 width: 120px;
 height: 8px;
 margin-top: 6px;
}

@keyframes mail-skeleton-shimmer {
 0% {
  background-position: 0% 50%;
 }
 100% {
  background-position: 200% 50%;
 }
}

.mail-row.is-dragging {
 opacity: 0.6;
}

.mail-row.is-moving {
 opacity: 0.65;
}

.mail-row.is-active {
 background: rgba(50, 120, 255, 0.08);
}

.mail-row.is-selected {
 background: rgba(50, 120, 255, 0.1);
}

.mail-row.is-selected.is-active {
 background: rgba(50, 120, 255, 0.16);
}

.mail-row.is-unread:not(.is-active):not(.is-selected) {
 background: rgba(15, 23, 42, 0.08);
}

.mail-row__select {
 display: flex;
 align-items: center;
 gap: 5px;
 justify-content: flex-start;
 padding-left: 0;
 min-width: 0;
}

.mail-row__checkbox {
 width: 14px;
 height: 14px;
 margin: 0;
 accent-color: rgb(var(--accent));
 cursor: pointer;
}

.mail-row__checkbox:focus-visible {
 outline: 2px solid rgb(var(--accent));
 outline-offset: 2px;
}

.mail-row__from {
 color: var(--mail-row-accent, var(--ink-strong));
 font-weight: 600;
 min-width: 0;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.mail-row__mailbox {
 color: var(--mail-row-accent, var(--ink-muted));
 font-size: 0.82rem;
 padding-right: 10px;
 min-width: 0;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
 justify-self: end;
 text-align: right;
}

.mail-row__content {
 display: grid;
 grid-template-columns: minmax(0, 56%) minmax(0, 1fr);
 align-items: center;
 gap: 4px;
 padding-left: 6px;
 min-width: 0;
 overflow: hidden;
}

.mail-row__subject {
 color: var(--mail-row-accent, var(--ink-strong));
 width: 100%;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
 min-width: 0;
}

.mail-row__preview {
 color: var(--mail-row-accent, var(--ink-muted));
 font-size: 0.82rem;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
 min-width: 0;
}

.mail-row__preview::before {
 content: "—";
 margin-right: 4px;
 color: var(--mail-row-accent, var(--ink-muted));
}

.mail-row__preview:empty {
 display: none;
}

.mail-row__preview:empty::before {
 content: none;
}

.mail-row__meta {
 color: var(--mail-row-accent, var(--ink-muted));
 font-size: 0.8rem;
 text-align: right;
 white-space: nowrap;
 justify-self: end;
 display: flex;
 align-items: center;
 gap: 8px;
 justify-content: flex-end;
 min-width: 0;
}

.mail-row__meta-right {
 position: relative;
 display: flex;
 align-items: center;
 justify-content: flex-end;
 min-width: 0;
 width: 100%;
 max-width: 100%;
 min-height: 24px;
 height: auto;
}

.mail-row__status {
 display: none;
 font-size: 0.75rem;
 color: var(--ink-muted);
 letter-spacing: 0.02em;
 margin-right: 8px;
}

.mail-row.is-moving .mail-row__status {
 display: inline-flex;
}

.mail-row.is-moving .mail-row__date {
 display: none;
}

.mail-row.is-moving .mail-row__actions,
.mail-row.is-moving .mail-row__doit,
.mail-row.is-moving .mail-row__checkbox {
 pointer-events: none;
 opacity: 0.4;
}

.mail-row__actions {
 position: absolute;
 right: 0;
 top: 50%;
 transform: translateY(-50%);
 display: inline-flex;
 align-items: center;
 gap: 6px;
 opacity: 0;
 visibility: hidden;
 pointer-events: none;
 transition: opacity 150ms ease, visibility 150ms ease;
}

.mail-row.is-color-open .mail-row__actions {
 opacity: 1;
 visibility: visible;
 pointer-events: auto;
}

.mail-row__action {
 width: 24px;
 height: 24px;
 border-radius: 6px;
 border: none;
 background: transparent;
 color: var(--ink-strong);
 display: inline-flex;
 align-items: center;
 justify-content: center;
 cursor: pointer;
 padding: 0;
 position: relative;
}

.mail-row__action--color.is-active {
 background: rgba(50, 120, 255, 0.12);
}

.mail-row__action svg {
 width: 16px;
 height: 16px;
 stroke: currentColor;
 stroke-width: 1.8;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
}

.mail-row__action:hover {
 background: rgba(50, 120, 255, 0.12);
 color: #0f4f8a;
}

.mail-row__action::after {
 content: attr(data-tooltip);
 position: absolute;
 left: 50%;
 bottom: calc(100% + 8px);
 transform: translate(-50%, -6px);
 background: #0B1222;
 color: #FFFFFF;
 font-size: 0.7rem;
 font-weight: 500;
 line-height: 1.3;
 padding: 6px 8px;
 border-radius: 8px;
 white-space: nowrap;
 opacity: 0;
 visibility: hidden;
 pointer-events: none;
 box-shadow: 0 10px 24px rgba(15, 23, 42, 0.2);
 z-index: 3;
}

.mail-row__action::before {
 content: none;
}

.mail-row__action:hover::after,
.mail-row__action:focus-visible::after {
 opacity: 1;
 visibility: visible;
 transform: translate(-50%, 0);
}

.mail-row__color-popover {
 position: absolute;
 right: 0;
 top: 50%;
 transform: translateY(-50%);
 display: inline-flex;
 align-items: center;
 gap: 6px;
 padding: 4px 6px;
 border-radius: 999px;
 background: #FFFFFF;
 border: 1px solid var(--stroke);
 box-shadow: 0 8px 18px rgba(15, 23, 42, 0.12);
 z-index: 4;
}

.mail-row__color-popover[hidden] {
 display: none;
}

.mail-row__color-swatch {
 width: 14px;
 height: 14px;
 border-radius: 50%;
 border: 1px solid rgba(15, 23, 42, 0.12);
 background: var(--mail-swatch, transparent);
 cursor: pointer;
 padding: 0;
}

.mail-row__color-swatch.is-clear {
 background: linear-gradient(
  45deg,
  transparent 42%,
  rgba(15, 23, 42, 0.55) 42%,
  rgba(15, 23, 42, 0.55) 58%,
  transparent 58%
 );
}

.mail-row__color-swatch.is-selected {
 outline: 2px solid rgb(var(--accent));
 outline-offset: 1px;
}

.mail-row__color-swatch:focus-visible {
 outline: 2px solid rgb(var(--accent));
 outline-offset: 2px;
}

.mail-row__date {
 color: var(--mail-row-accent, var(--ink-muted));
 display: block;
 min-width: 0;
 max-width: 100%;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
 transition: opacity 150ms ease;
}

.calls-row {
 grid-template-columns: 34px 34px minmax(128px, 186px) minmax(0, 1fr) minmax(90px, 132px) minmax(198px, 260px);
}

.calls-row .mail-row__meta {
 min-width: 0;
 display: grid;
 grid-template-columns: auto minmax(0, 1fr);
 gap: 8px;
}

.calls-row .mail-row__meta-right {
 width: auto;
 min-width: 0;
}

.calls-row.is-active .mail-row__actions {
 opacity: 1;
 visibility: visible;
 pointer-events: auto;
}

.calls-row__select {
 justify-content: center;
}

.calls-row__check-wrap,
.calls-row__direction-wrap {
 display: inline-flex;
 align-items: center;
 justify-content: center;
}

.calls-row__check {
 width: 14px;
 height: 14px;
 margin: 0;
 accent-color: rgb(var(--accent));
 cursor: pointer;
}

.calls-row__check:focus-visible {
 outline: 2px solid rgb(var(--accent));
 outline-offset: 2px;
}

.calls-row__direction {
 width: 22px;
 height: 22px;
 border-radius: 999px;
 color: var(--ink-muted);
 background: transparent;
}

.calls-row__direction:hover {
 background: rgba(50, 120, 255, 0.12);
 color: #0f4f8a;
}

.calls-row__duration {
 font-variant-numeric: tabular-nums;
 color: var(--mail-row-accent, var(--ink-muted));
 font-size: 0.79rem;
 min-width: 46px;
 text-align: right;
 transition: opacity 150ms ease;
}

.calls-row.is-tagged {
 --mail-row-accent: #0f4f8a;
 background: rgba(15, 79, 138, 0.08);
}

.calls-row.is-tagged .mail-row__action[data-call-action="tag"] {
 color: #0f4f8a;
 background: rgba(15, 79, 138, 0.14);
}

@media (max-width: 980px) {
 .pigeon-calls-layout,
 .pigeon-calls-layout.is-details-open {
  grid-template-columns: 1fr;
 }

 .pigeon-calls-details {
  border-left: none;
  border-top: 1px solid var(--stroke);
 }

 .calls-row {
  grid-template-columns: 34px 34px minmax(122px, 170px) minmax(0, 1fr) minmax(82px, 120px) minmax(178px, 220px);
 }
}

@media (max-width: 760px) {
 .calls-row {
  grid-template-columns: 34px 34px minmax(0, 1fr) minmax(0, 1fr) minmax(128px, 164px);
 }

 .calls-row .mail-row__mailbox {
  display: none;
 }
}

.mail-row.is-active .mail-row__actions,
.mail-row:focus-within .mail-row__actions {
 opacity: 1;
 visibility: visible;
 pointer-events: auto;
}

.mail-row.is-color-open .mail-row__date {
 opacity: 0;
}

.mail-row.is-active .mail-row__date,
.mail-row:focus-within .mail-row__date {
 opacity: 0;
}

.calls-row.is-active .mail-row__date {
 opacity: 0;
}

.calls-row:hover .calls-row__duration,
.calls-row:focus-within .calls-row__duration,
.calls-row.is-active .calls-row__duration,
.calls-row.is-color-open .calls-row__duration {
 opacity: 0;
}

.mail-row__doit {
 width: auto;
 min-width: 44px;
 height: 24px;
 border-radius: 6px;
 border: 1px solid var(--ink-strong);
 background: transparent;
 color: var(--ink-strong);
 display: inline-flex;
 align-items: center;
 justify-content: center;
 cursor: pointer;
 padding: 0 6px;
 font-size: 0.55rem;
 font-weight: 700;
 letter-spacing: 0.08em;
 text-transform: uppercase;
 line-height: 1;
 transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease, filter 150ms ease;
}

.mail-row__doit:hover {
 background: rgba(15, 23, 42, 0.06);
 color: var(--ink-strong);
}

.mail-row__doit.is-active,
.mail-row__doit.is-do-it {
 color: #fff;
 border-color: rgb(var(--accent));
 background: rgb(var(--accent));
}

.mail-row__doit.is-done {
 color: #fff;
 border-color: #16a34a;
 background: #16a34a;
}

.mail-row__doit.is-active:hover,
.mail-row__doit.is-do-it:hover,
.mail-row__doit.is-done:hover {
 color: #fff;
 filter: brightness(0.93);
}

.mail-row__doit.is-active:hover,
.mail-row__doit.is-do-it:hover {
 border-color: rgb(var(--accent));
 background: rgb(var(--accent));
}

.mail-row__doit.is-done:hover {
 border-color: #16a34a;
 background: #16a34a;
}

.mail-row.is-unread .mail-row__from,
.mail-row.is-unread .mail-row__subject {
 font-weight: 700;
}

.mail-ham-modal__trust {
 display: inline-flex;
 align-items: center;
 gap: 8px;
 font-size: 0.88rem;
 color: var(--ink-muted);
 margin-top: 2px;
}

.mail-ham-modal__trust input {
 width: 14px;
 height: 14px;
 margin: 0;
 accent-color: rgb(var(--accent));
 cursor: pointer;
}

@container mail-list-pane (max-width: 520px) {
 .mail-list,
 .mail-list__rows,
 .mail-list__rows.is-virtual,
 .mail-virtual-rows {
  overflow-x: clip;
 }

 .mail-row {
  grid-template-columns: 60px minmax(0, 1fr) minmax(0, 1fr) minmax(0, 88px);
  gap: 6px;
 }

 .mail-row.is-color-open {
  overflow: visible;
 }

 .mail-row__content {
  grid-template-columns: minmax(0, 1fr);
  padding-left: 0;
 }

 .mail-row__preview,
 .mail-row__mailbox,
 .mail-row__doit,
 .mail-row__actions,
 .mail-row__color-popover,
 .mail-row__status {
  display: none;
 }

 .mail-row__meta {
  gap: 0;
 }

 .mail-row__meta-right {
  position: static;
  min-width: 0;
  width: 100%;
 }

 .mail-row__meta-right > *:not(.mail-row__date) {
  display: none !important;
 }

 .mail-row__date {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
 }

 .mail-row:hover .mail-row__date,
 .mail-row.is-color-open .mail-row__date {
  opacity: 1;
 }
}

@container mail-list-pane (max-width: 380px) {
 .mail-row {
  grid-template-columns: minmax(0, 1fr) minmax(0, 10ch);
  gap: 5px;
 }

 .mail-row__select {
  display: none;
 }

 .mail-row__content {
  display: none;
 }

 .mail-row__meta {
  gap: 0;
 }

 .mail-row__meta-right {
  position: static;
  width: auto;
  min-width: 0;
 }

 .mail-row__meta-right > *:not(.mail-row__date) {
  display: none !important;
 }

 .mail-row__date {
  max-width: 100%;
 }
}

@container mail-list-pane (max-width: 300px) {
 .mail-row {
  grid-template-columns: minmax(0, 1fr) minmax(0, 78px);
  padding-left: 2px;
  padding-right: 2px;
 }

 .mail-row__select {
  display: none;
 }

 .mail-row__from {
  font-size: 0.84rem;
 }

 .mail-row__date {
  font-size: 0.75rem;
 }
}

.mail-inbox.is-pane-compact-520 .mail-list,
.mail-inbox.is-pane-compact-520 .mail-list__rows,
.mail-inbox.is-pane-compact-520 .mail-list__rows.is-virtual,
.mail-inbox.is-pane-compact-520 .mail-virtual-rows {
 overflow-x: clip;
}

.mail-inbox.is-pane-compact-520 .mail-row {
 grid-template-columns: 60px minmax(0, 1fr) minmax(0, 1fr) minmax(0, 88px);
 gap: 6px;
}

.mail-inbox.is-pane-compact-520 .mail-row.is-color-open {
 overflow: visible;
}

.mail-inbox.is-pane-compact-520 .mail-row__content {
 grid-template-columns: minmax(0, 1fr);
 padding-left: 0;
}

.mail-inbox.is-pane-compact-520 .mail-row__preview,
.mail-inbox.is-pane-compact-520 .mail-row__mailbox,
.mail-inbox.is-pane-compact-520 .mail-row__doit,
.mail-inbox.is-pane-compact-520 .mail-row__actions,
.mail-inbox.is-pane-compact-520 .mail-row__color-popover,
.mail-inbox.is-pane-compact-520 .mail-row__status {
 display: none;
}

.mail-inbox.is-pane-compact-520 .mail-row__meta {
 gap: 0;
}

.mail-inbox.is-pane-compact-520 .mail-row__meta-right {
 position: static;
 min-width: 0;
 width: 100%;
}

.mail-inbox.is-pane-compact-520 .mail-row__meta-right > *:not(.mail-row__date) {
 display: none !important;
}

.mail-inbox.is-pane-compact-520 .mail-row__date {
 max-width: 100%;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.mail-inbox.is-pane-compact-520 .mail-row:hover .mail-row__date,
.mail-inbox.is-pane-compact-520 .mail-row.is-color-open .mail-row__date {
 opacity: 1;
}

.mail-inbox.is-pane-compact-380 .mail-row {
 grid-template-columns: minmax(0, 1fr) minmax(0, 10ch);
 gap: 5px;
}

.mail-inbox.is-pane-compact-380 .mail-row__select {
 display: none;
}

.mail-inbox.is-pane-compact-380 .mail-row__content {
 display: none;
}

.mail-inbox.is-pane-compact-380 .mail-row__meta {
 gap: 0;
}

.mail-inbox.is-pane-compact-380 .mail-row__meta-right {
 position: static;
 width: auto;
 min-width: 0;
}

.mail-inbox.is-pane-compact-380 .mail-row__meta-right > *:not(.mail-row__date) {
 display: none !important;
}

.mail-inbox.is-pane-compact-380 .mail-row__date {
 max-width: 100%;
}

.mail-inbox.is-pane-compact-300 .mail-row {
 grid-template-columns: minmax(0, 1fr) minmax(0, 78px);
 padding-left: 2px;
 padding-right: 2px;
}

.mail-inbox.is-pane-compact-300 .mail-row__select {
 display: none;
}

.mail-inbox.is-pane-compact-300 .mail-row__from {
 font-size: 0.84rem;
}

.mail-inbox.is-pane-compact-300 .mail-row__date {
 font-size: 0.75rem;
}

@media (max-width: 720px) {
 .mail-workspace.is-reading {
  grid-template-columns: 1fr;
 }

 .mail-workspace.is-reading .mail-inbox {
  display: none;
 }

 .mail-reader {
  padding-left: 0;
  border-left: none;
 }

 .mail-reader::before {
  display: none;
 }

 .mail-reader__divider {
  display: none;
 }

 .mail-row {
  grid-template-columns: 1fr;
  gap: 4px;
 }

 .mail-row__meta {
  text-align: left;
  justify-content: flex-start;
 }

 .mail-row__meta-right {
  justify-content: flex-start;
 }
}

.mail-reader {
 display: flex;
 flex-direction: column;
 gap: 16px;
 min-width: 0;
 padding-top: var(--mail-preview-offset, 8px);
 padding-left: 16px;
 position: relative;
 min-height: 100%;
 height: 100%;
 overflow-y: auto;
 opacity: 1;
 transform: translateX(0);
 transition: opacity 200ms ease, transform 240ms ease;
}

.mail-reader::before {
 content: none;
 display: none;
}

.mail-reader.is-entering {
 opacity: 0;
 transform: translateX(16px);
}

.mail-reader__divider {
 position: absolute;
 top: 0;
 bottom: 0;
 left: -6px;
 width: 12px;
 cursor: col-resize;
 z-index: 4;
 background: transparent;
 touch-action: none;
}

.mail-reader__header {
 display: flex;
 flex-direction: column;
 align-items: stretch;
 gap: 10px;
 flex: 0 0 auto;
}

.mail-reader__title-row {
 display: flex;
 align-items: flex-start;
 justify-content: space-between;
 gap: 12px;
 min-width: 0;
}

.mail-reader__subject {
 font-weight: 600;
 color: var(--ink-strong);
 font-size: 1rem;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.mail-reader__meta {
 display: flex;
 flex-direction: column;
 align-items: flex-start;
 gap: 6px;
 color: var(--ink-muted);
 font-size: 0.85rem;
 min-width: 0;
 width: 100%;
}

.mail-reader__from {
 font-weight: 600;
 color: var(--ink-strong);
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.mail-reader__from-line,
.mail-reader__to-line {
 display: flex;
 align-items: center;
 gap: 8px;
 min-width: 0;
 width: 100%;
}

.mail-reader__to-line {
 flex-wrap: wrap;
}

.mail-reader__to-label {
 color: var(--ink-muted);
 text-transform: lowercase;
}

.mail-reader__meta-toggle {
 border: none;
 background: none;
 color: var(--ink-muted);
 font-size: 0.85rem;
 padding: 0;
 line-height: 1;
 cursor: pointer;
 display: inline-flex;
 align-items: center;
 justify-content: center;
}

.mail-reader__meta-toggle:hover {
 color: var(--ink-strong);
}

.mail-reader__toggle-icon {
 width: 16px;
 height: 16px;
 stroke: currentColor;
 stroke-width: 1.8;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
 transition: transform 150ms ease;
}

.mail-reader__meta-toggle[aria-expanded="true"] .mail-reader__toggle-icon,
.mail-reader__footer-action--menu[aria-expanded="true"] .mail-reader__toggle-icon {
 transform: rotate(180deg);
}

.mail-reader__to {
 color: var(--ink-muted);
}

.mail-reader__date {
 color: var(--ink-muted);
 font-size: 0.85rem;
 margin-left: auto;
}

.mail-reader__meta-panel {
 display: grid;
 gap: 6px;
 width: 100%;
 padding: 0 10px;
 border-style: solid;
 border-width: 0;
 border-color: transparent;
 border-radius: 10px;
 background: #fff;
 color: var(--ink-strong);
 font-size: 0.82rem;
 max-height: 0;
 opacity: 0;
 transform: translateY(-4px);
 overflow: hidden;
 pointer-events: none;
 transition: max-height 220ms ease, opacity 160ms ease, transform 160ms ease, padding 220ms ease, border-color 220ms ease;
}

.mail-reader__meta-panel[data-state="open"] {
 padding: 8px 10px;
 border-width: 1px;
 border-color: var(--stroke);
 max-height: 240px;
 opacity: 1;
 transform: translateY(0);
 pointer-events: auto;
}

.mail-reader__meta-row {
 display: grid;
 grid-template-columns: minmax(70px, 90px) minmax(0, 1fr);
 gap: 8px;
}

.mail-reader__meta-label {
 text-transform: lowercase;
 color: var(--ink-muted);
}

.mail-reader__meta-value {
 color: var(--ink-strong);
}

.mail-reader__actions {
 display: flex;
 align-items: center;
 gap: 4px;
}

.mail-reader__action {
 width: 24px;
 height: 24px;
 border-radius: 6px;
 border: none;
 background: transparent;
 color: var(--ink-muted);
 display: inline-flex;
 align-items: center;
 justify-content: center;
 font-size: 0.9rem;
 cursor: pointer;
}

.mail-reader__action:hover {
 color: var(--ink-strong);
 background: rgba(15, 23, 42, 0.06);
}

.mail-reader__prompt {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
 padding: 8px 12px;
 border-top: 1px solid var(--stroke);
 border-bottom: 1px solid var(--stroke);
 background: #faf7f1;
}

.mail-reader__prompt-copy {
 display: grid;
 gap: 3px;
 min-width: 0;
}

.mail-reader__prompt-label {
 display: inline-flex;
 align-items: center;
 width: fit-content;
 padding: 2px 8px;
 border-radius: 999px;
 background: rgba(148, 163, 184, 0.14);
 color: var(--ink-strong);
 font-size: 0.7rem;
 font-weight: 700;
 letter-spacing: 0.04em;
 text-transform: uppercase;
}

.mail-reader__prompt-text {
 margin: 0;
 color: var(--ink-muted);
 font-size: 0.86rem;
 line-height: 1.4;
}

.mail-reader__prompt-actions {
 display: flex;
 align-items: center;
 gap: 8px;
 flex-wrap: wrap;
 justify-content: flex-end;
}

.mail-reader__prompt-action {
 border: 1px solid var(--stroke);
 border-radius: 999px;
 background: #fff;
 color: var(--ink-strong);
 padding: 6px 11px;
 font: inherit;
 font-size: 0.82rem;
 font-weight: 600;
 cursor: pointer;
}

.mail-reader__prompt-action--secondary {
 color: var(--ink-muted);
}

.mail-reader__prompt-action:hover {
 border-color: rgba(15, 23, 42, 0.16);
 background: rgba(15, 23, 42, 0.04);
 color: var(--ink-strong);
}

.mail-reader__prompt[hidden] + .mail-reader__body {
 border-top: 1px solid var(--stroke);
}

.mail-reader__body {
 min-height: 0;
 border-top: 0;
 border-radius: 0;
 padding: 12px 0 0;
 background: transparent;
 white-space: normal;
 color: var(--ink-strong);
 line-height: 1.5;
 overflow-wrap: anywhere;
 word-break: break-word;
 flex: 0 0 auto;
 overflow: visible;
}

.mail-reader__body[data-format="html"] {
 overflow: hidden;
}

.mail-reader__html-frame {
 display: block;
 width: 100%;
 min-height: 320px;
 border: 0;
 background: #fff;
}

.mail-reader__body a {
 color: #1b56b8;
 text-decoration: underline;
 text-underline-offset: 2px;
}

.mail-reader__body a:hover {
 color: #123b7d;
}

.mail-reader__body p {
 margin: 0 0 0.9em;
}

.mail-reader__footer {
 margin-top: 8px;
 padding-top: 8px;
 border-top: 1px solid var(--stroke);
 display: flex;
 align-items: center;
 justify-content: space-between;
 flex-wrap: wrap;
 gap: 12px;
 flex: 0 0 auto;
}

.mail-reader__footer-actions {
 display: flex;
 align-items: center;
 gap: 10px;
 flex-wrap: wrap;
}

.mail-reader__footer-icon {
 width: 14px;
 height: 14px;
 stroke: currentColor;
 stroke-width: 1.6;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
}

.mail-reader__footer-menu {
 margin-left: auto;
 position: relative;
 display: flex;
 align-items: center;
}

.mail-reader__footer-actions--secondary {
 margin-left: auto;
 flex-wrap: wrap;
 justify-content: flex-end;
 gap: 6px;
}

.mail-reader__footer-action {
 border: 1px solid var(--stroke);
 background: #fff;
 color: var(--ink-strong);
 border-radius: 999px;
 padding: 6px 12px;
 font-size: 0.85rem;
 display: inline-flex;
 align-items: center;
 gap: 6px;
 cursor: pointer;
}

.mail-reader__footer-action[aria-busy="true"] {
 opacity: 0.6;
 cursor: progress;
}

.mail-reader__footer-action--menu {
 width: 32px;
 height: 32px;
 padding: 0;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 font-size: 1rem;
 border-radius: 10px;
 color: var(--ink-muted);
}

.mail-reader__footer-action--icon {
 width: 32px;
 height: 32px;
 padding: 0;
 justify-content: center;
 color: var(--ink-muted);
 border-radius: 10px;
}

.mail-reader__footer-icon-wrap {
 display: inline-flex;
 align-items: center;
 justify-content: center;
}

.mail-reader__footer-action:hover {
 background: rgba(15, 23, 42, 0.06);
}

.mail-reader__menu {
 position: absolute;
 right: 0;
 bottom: calc(100% + 8px);
 min-width: 180px;
 background: #fff;
 border: 1px solid var(--stroke);
 border-radius: 12px;
 box-shadow: 0 18px 36px rgba(15, 23, 42, 0.12);
 padding: 6px;
 display: grid;
 gap: 2px;
 z-index: 5;
 opacity: 0;
 transform: translateY(6px);
 pointer-events: none;
 transition: opacity 150ms ease, transform 150ms ease;
}

.mail-reader__menu[data-state="open"] {
 opacity: 1;
 transform: translateY(0);
 pointer-events: auto;
}

.mail-reader__menu-item {
 border: none;
 background: transparent;
 text-align: left;
 padding: 8px 10px;
 border-radius: 8px;
 color: var(--ink-strong);
 font-size: 0.85rem;
 cursor: pointer;
 display: flex;
 align-items: center;
 gap: 8px;
}

.mail-reader__menu-icon {
 width: 14px;
 height: 14px;
 stroke: currentColor;
 stroke-width: 1.6;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
 flex-shrink: 0;
}

.mail-reader__menu-item:hover {
 background: rgba(15, 23, 42, 0.06);
}

.mail-header {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 1rem;
 margin-bottom: 1.5rem;
}

.mail-header__actions,
.mail-settings__actions {
 display: flex;
 align-items: center;
 gap: 10px;
}

.mail-settings {
 display: grid;
 gap: 12px;
 width: 100%;
 max-width: none;
 margin: 0;
}

.pigeon-settings-header__menu {
 position: relative;
}

.pigeon-settings-header__menu .marina-nav__tab {
 white-space: nowrap;
}

.pigeon-settings-header__panel {
 min-width: 220px;
 max-width: min(280px, 88vw);
}

.pigeon-settings-header__menu > .pigeon-settings-header__panel {
 top: calc(100% + 1px);
}

.pigeon-settings-header__panel--flyout {
 top: -8px;
 left: calc(100% + 8px);
 right: auto;
}

.pigeon-settings-header__branch {
 position: relative;
}

.pigeon-settings-header__menu-item {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
}

.pigeon-settings-header__menu-item--branch::after {
 content: "\203A";
 flex: 0 0 auto;
 color: var(--ink-muted);
}

.pigeon-settings-header__menu-item.is-open::after,
.pigeon-settings-header__menu-item--branch:hover::after,
.pigeon-settings-header__menu-item--branch:focus-visible::after {
 color: var(--ink-strong);
}

.pigeon-settings-header__dynamic-list {
 display: grid;
 gap: 4px;
}

.pigeon-settings-header__empty {
 padding: 0.62rem 0.78rem;
 color: var(--ink-soft);
 font-size: 0.8rem;
 line-height: 1.35;
}

.pigeon-settings-header__mailbox-label {
 display: grid;
 gap: 2px;
 min-width: 0;
}

.pigeon-settings-header__mailbox-name {
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.pigeon-settings-header__mailbox-meta {
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
 font-size: 0.74rem;
 font-weight: 500;
 color: var(--ink-muted);
}

.mail-settings__layout {
 display: grid;
 grid-template-columns: minmax(200px, 250px) minmax(0, 1fr);
 column-gap: 1.25rem;
 row-gap: 0.9rem;
 align-items: start;
}

.mail-settings__layout.is-email-channel {
 grid-template-columns: minmax(0, 1fr);
}

.mail-settings__nav {
 display: contents;
}

.mail-settings__sections {
 grid-column: 1;
 grid-row: 1;
 display: grid;
 gap: 0.3rem;
 border-right: 1px solid var(--stroke);
 padding-right: 0.85rem;
}

.mail-settings__channel-sections {
 display: none;
 gap: 0.2rem;
}

.mail-settings__channel-sections.is-active {
 display: grid;
}

.mail-settings__channel-sections[hidden] {
 display: none !important;
}

.mail-settings__nav-item {
 appearance: none;
 width: 100%;
 text-align: left;
 border: 0;
 border-radius: 8px;
 background: transparent;
 color: var(--ink-soft);
 font: inherit;
 font-size: 0.84rem;
 font-weight: 600;
 line-height: 1.25;
 padding: 7px 10px;
 cursor: pointer;
 transition: color 0.2s ease, background 0.2s ease;
}

.mail-settings__nav-item:hover,
.mail-settings__nav-item:focus-visible {
 outline: none;
 color: var(--ink-strong);
 background: rgba(15, 23, 42, 0.07);
}

.mail-settings__nav-item.is-active {
 color: #0d63f3;
 background: rgba(13, 99, 243, 0.1);
}

.mail-settings__nav-item.is-nav-hidden {
 display: none !important;
}

.mail-settings__nav-item.is-branch {
 position: relative;
 padding-right: 1.55rem;
}

.mail-settings__nav-item.is-branch::after {
 content: "\25B8";
 position: absolute;
 right: 0.55rem;
 top: 50%;
 transform: translateY(-50%);
 color: rgba(15, 23, 42, 0.58);
 font-size: 0.72rem;
 pointer-events: none;
 transition: transform 0.2s var(--ease), color 0.2s var(--ease);
}

.mail-settings__nav-item.is-branch.is-expanded::after {
 transform: translateY(-50%) rotate(90deg);
}

.mail-settings__nav-item--depth-0 {
 font-weight: 700;
}

.mail-settings__channel-sections[data-mail-settings-channel-sections="email"] .mail-settings__nav-item--depth-0 {
 position: relative;
 padding-right: 1.55rem;
}

.mail-settings__channel-sections[data-mail-settings-channel-sections="email"] .mail-settings__nav-item--depth-0::after {
 content: "\203A";
 position: absolute;
 right: 0.55rem;
 top: 50%;
 transform: translateY(-50%);
 color: rgba(15, 23, 42, 0.72);
 font-size: 1rem;
 pointer-events: none;
 transition: color 0.2s var(--ease);
}

.mail-settings__channel-sections[data-mail-settings-channel-sections="email"] .mail-settings__nav-item--depth-0:hover::after,
.mail-settings__channel-sections[data-mail-settings-channel-sections="email"] .mail-settings__nav-item--depth-0:focus-visible::after {
 color: rgba(15, 23, 42, 0.9);
}

.mail-settings__channel-sections[data-mail-settings-channel-sections="email"] .mail-settings__nav-item--depth-0.is-active::after {
 color: #0d63f3;
}

.mail-settings__nav-item--depth-1 {
 margin-left: 0.75rem;
}

.mail-settings__nav-item--depth-2 {
 margin-left: 1.5rem;
}

.mail-settings__nav-item--depth-3 {
 margin-left: 2.25rem;
}

.mail-settings__panels {
 grid-column: 2;
 grid-row: 1;
 display: grid;
 gap: 0;
 min-width: 0;
 overflow-x: hidden;
}

.mail-settings__layout.is-email-channel .mail-settings__panels {
 grid-column: 1;
}

.mail-settings__title {
 margin: 0;
 font-size: 1.15rem;
 letter-spacing: -0.01em;
}

.mail-settings__panel {
 display: none;
}

.mail-settings__panel.is-active {
 display: block;
}

.mail-settings__section {
 display: grid;
 gap: 16px;
 min-width: 0;
}

.mail-settings__section--menu-grid {
 --mail-settings-menu-column: clamp(160px, 14vw, 210px);
 grid-template-columns: minmax(0, var(--mail-settings-menu-column)) minmax(0, 1fr);
 align-items: start;
 column-gap: 16px;
}

.mail-settings__section--menu-grid-2 {
 grid-template-columns: repeat(2, minmax(0, var(--mail-settings-menu-column)));
}

.mail-settings__section--menu-grid-3 {
 grid-template-columns: repeat(3, minmax(0, var(--mail-settings-menu-column)));
}

.mail-settings__section--menu-grid-3-detail {
 grid-template-columns: repeat(2, minmax(0, var(--mail-settings-menu-column))) minmax(0, 1fr);
}

.mail-settings__section--menu-grid-4 {
 grid-template-columns: repeat(3, minmax(0, var(--mail-settings-menu-column))) minmax(0, 1fr);
}

.mail-settings__section--menu-grid-4-menus {
 grid-template-columns: repeat(4, minmax(0, var(--mail-settings-menu-column)));
}

.mail-settings__section--menu-grid-5 {
 grid-template-columns: repeat(4, minmax(0, var(--mail-settings-menu-column))) minmax(0, 1fr);
}

.mail-settings__panel[data-mail-settings-panel="email-your-inboxes-identity"].is-identity-nested-collapsed
  .mail-settings__section--menu-grid-4-menus {
 grid-template-columns: repeat(3, minmax(0, var(--mail-settings-menu-column)));
}

.mail-settings__panel[data-mail-settings-panel="email-your-inboxes-identity"].is-identity-nested-collapsed
  [data-mail-settings-menu="email-your-inboxes-identity"] {
 display: none;
}

.mail-settings__section h2 {
 margin: 0;
 font-size: 1.1rem;
}

.mail-settings__shared-members {
 display: grid;
 gap: 0.75rem;
}

.mail-settings__shared-members-search {
 font-size: 0.84rem;
 font-weight: 600;
 color: var(--ink-soft);
}

.mail-settings__shared-members-list {
 display: grid;
 gap: 0.55rem;
}

.mail-settings__create-panel[hidden] {
 display: none !important;
}

.mail-settings__create-form {
 display: grid;
 gap: 1rem;
}

.mail-settings__shared-member-row {
 display: grid;
 grid-template-columns: minmax(0, 1fr) auto;
 align-items: center;
 gap: 0.75rem;
 padding: 0.65rem 0.75rem;
 border: 1px solid var(--stroke);
 border-radius: 10px;
 background: #fff;
}

.mail-settings__shared-member-name {
 font-weight: 600;
 color: var(--ink-strong);
}

.mail-settings__shared-member-meta {
 font-size: 0.8rem;
 color: var(--ink-soft);
}

.mail-settings__shared-member-row--selected {
 grid-template-columns: minmax(0, 1fr) auto auto;
}

.mail-settings__shared-member-row--empty {
 grid-template-columns: minmax(0, 1fr);
}

.mail-settings__shared-member-remove {
 border: none;
 background: none;
 color: var(--ink-soft);
 font-weight: 600;
 padding: 0;
 cursor: pointer;
}

.mail-settings__shared-member-remove:hover,
.mail-settings__shared-member-remove:focus-visible {
 color: rgb(var(--accent));
 text-decoration: underline;
}

.mail-settings__shared-member-row select {
 min-width: 150px;
}

.mail-settings__action {
  background: none;
  color: var(--ink-strong);
  border: none;
  padding: 0;
  font-weight: 600;
  box-shadow: none;
  text-decoration: none;
}

.mail-settings__action:hover,
.mail-settings__action:focus-visible {
  color: rgb(var(--accent));
  text-decoration: underline;
}

.mail-settings__actions .mail-settings__action {
  background: none;
  color: var(--ink-strong);
  border: none;
  padding: 0;
  font-weight: 600;
  box-shadow: none;
  text-decoration: none;
}

.mail-settings__actions .mail-settings__action:hover,
.mail-settings__actions .mail-settings__action:focus-visible {
  color: rgb(var(--accent));
  text-decoration: underline;
}

.mail-settings__alias-list {
 margin: 0;
 padding-left: 0;
 list-style: none;
 display: grid;
 gap: 0;
}

.mail-settings__alias-list--settings {
 border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.mail-settings__aliases-empty {
 margin: 0;
 padding: 0.15rem 0 0;
 font-size: 0.88rem;
 line-height: 1.45;
}

.mail-settings__alias-add-row {
 display: flex;
 justify-content: flex-end;
 padding-top: 8px;
 margin-top: 8px;
 border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.mail-settings__alias-add {
 appearance: none;
 border: 1px solid rgba(13, 99, 243, 0.24);
 border-radius: 8px;
 background: rgba(13, 99, 243, 0.08);
 color: #0d63f3;
 font: inherit;
 font-size: 0.82rem;
 font-weight: 600;
 line-height: 1;
 padding: 8px 12px;
 cursor: pointer;
 transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.mail-settings__alias-add:hover,
.mail-settings__alias-add:focus-visible {
 outline: none;
 background: rgba(13, 99, 243, 0.14);
 border-color: rgba(13, 99, 243, 0.4);
}

.mail-settings__alias-add:disabled {
 opacity: 0.5;
 cursor: not-allowed;
}

.mail-settings__alias-item {
 margin: 0;
 padding: 0.95rem 0;
 border-bottom: 1px solid rgba(15, 23, 42, 0.08);
 display: grid;
 grid-template-columns: minmax(0, 1fr) auto;
 align-items: center;
 gap: 1rem;
}

.mail-settings__alias-item--summary {
 grid-template-columns: minmax(0, 1fr) auto;
}

.mail-settings__alias-item--more {
 display: flex;
 align-items: center;
 justify-content: flex-start;
 padding: 0.85rem 0;
 border-bottom: 0;
 color: var(--ink-soft);
 font-size: 0.82rem;
 font-weight: 600;
}

.mail-settings__alias-address {
 color: var(--ink-strong);
 display: block;
 min-width: 0;
 font-weight: 500;
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
}

.mail-settings__alias-form {
 display: grid;
 gap: 0.6rem;
 padding-top: 0.2rem;
}

.mail-settings__alias-form label {
 font-weight: 600;
}

.mail-settings__subsection--signature {
 display: grid;
 gap: 0.55rem;
 align-content: start;
}

.mail-settings__signature-list {
 margin: 0;
 padding: 0;
 list-style: none;
 display: grid;
 gap: 0.5rem;
}

.mail-settings__signatures-empty {
 margin: 0;
 padding: 8px 10px;
 font-size: 0.82rem;
 line-height: 1.25;
}

.mail-settings__signature-item {
 margin: 0;
 padding: 9px 10px;
 border: 1px solid var(--stroke);
 border-radius: 8px;
 background: #fff;
 display: grid;
 gap: 0.3rem;
}

.mail-settings__signature-item-name {
 margin: 0;
 font-size: 0.82rem;
 font-weight: 700;
 color: var(--ink-strong);
 line-height: 1.25;
}

.mail-settings__signature-item-meta {
 margin: 0;
 font-size: 0.75rem;
 font-weight: 600;
 color: var(--ink-soft);
 line-height: 1.25;
}

.mail-settings__signature-item-preview {
 margin: 0;
 font-size: 0.76rem;
 color: rgba(15, 23, 42, 0.68);
 line-height: 1.3;
 display: -webkit-box;
 -webkit-line-clamp: 2;
 line-clamp: 2;
 -webkit-box-orient: vertical;
 overflow: hidden;
}

.mail-settings__signature-add-row {
 display: flex;
 justify-content: flex-end;
 padding-top: 8px;
 margin-top: 8px;
 border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.mail-settings__signature-add {
 appearance: none;
 border: 1px solid rgba(13, 99, 243, 0.24);
 border-radius: 8px;
 background: rgba(13, 99, 243, 0.08);
 color: #0d63f3;
 font: inherit;
 font-size: 0.82rem;
 font-weight: 600;
 line-height: 1;
 padding: 8px 12px;
 cursor: pointer;
 transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.mail-settings__signature-add:hover,
.mail-settings__signature-add:focus-visible {
 outline: none;
 background: rgba(13, 99, 243, 0.14);
 border-color: rgba(13, 99, 243, 0.4);
}

.mail-settings__signature-add:disabled {
 opacity: 0.5;
 cursor: not-allowed;
}

.mail-settings__signature-editor {
 border: 1px solid var(--stroke);
 border-radius: 10px;
 overflow: hidden;
 background: #fff;
}

.mail-settings__signature-editor .ql-editor {
 min-height: 184px;
}

.mail-signature-wizard {
 display: grid;
 gap: 1rem;
 min-height: 0;
}

.mail-signature-wizard__header {
 display: grid;
 gap: 0.85rem;
}

.mail-signature-wizard__intro {
 display: grid;
 gap: 0.3rem;
}

.mail-signature-wizard__eyebrow {
 margin: 0;
 font-size: 0.72rem;
 font-weight: 700;
 letter-spacing: 0.12em;
 text-transform: uppercase;
 color: #0d63f3;
}

.mail-signature-wizard__layout {
 display: grid;
 grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
 gap: 1.5rem;
 align-items: start;
 min-height: 0;
}

.mail-signature-wizard__main {
 min-width: 0;
 display: grid;
 gap: 1rem;
}

.mail-signature-wizard__preview-pane {
 min-width: 0;
 display: grid;
 gap: 1rem;
 align-content: start;
 align-self: start;
 padding-left: 1.5rem;
 border-left: 1px solid rgba(15, 23, 42, 0.08);
 position: sticky;
 top: 0;
}

.mail-signature-wizard__preview-pane-head {
 display: grid;
 gap: 0.35rem;
}

.mail-signature-wizard__preview-label {
 margin: 0;
 font-size: 0.72rem;
 font-weight: 700;
 letter-spacing: 0.12em;
 text-transform: uppercase;
 color: var(--ink-soft);
}

.mail-signature-wizard__preview-title {
 margin: 0;
 font-size: 1rem;
 line-height: 1.4;
 color: var(--ink-strong);
 word-break: break-word;
}

.mail-signature-wizard__steps {
 list-style: none;
 display: grid;
 grid-template-columns: repeat(5, minmax(0, 1fr));
 gap: 0.65rem;
 margin: 0;
 padding: 0;
}

.mail-signature-wizard__step-marker {
 display: flex;
 align-items: center;
 justify-content: center;
 min-height: 42px;
 padding: 0.55rem 0.7rem;
 border: 1px solid rgba(15, 23, 42, 0.08);
 border-radius: 999px;
 background: #f8fafc;
 font-size: 0.82rem;
 font-weight: 600;
 color: var(--ink-soft);
 text-align: center;
}

.mail-signature-wizard__step-marker.is-active {
 border-color: rgba(13, 99, 243, 0.24);
 background: rgba(13, 99, 243, 0.1);
 color: #0d63f3;
}

.mail-signature-wizard__step-marker.is-complete {
 border-color: rgba(15, 23, 42, 0.12);
 background: #fff;
 color: var(--ink-strong);
}

.mail-signature-wizard__step {
 display: grid;
 gap: 1rem;
}

.mail-signature-wizard__copy {
 display: grid;
 gap: 0.35rem;
}

.mail-signature-wizard__copy h4 {
 margin: 0;
 font-size: 1.02rem;
 color: var(--ink-strong);
}

.mail-signature-wizard__copy p {
 margin: 0;
 max-width: 60ch;
}

.mail-signature-wizard__field {
 display: grid;
 gap: 0.5rem;
 max-width: 540px;
}

.mail-signature-wizard__field--solo {
 max-width: 460px;
}

.mail-signature-wizard__field label {
 font-size: 0.9rem;
 font-weight: 600;
 color: var(--ink-soft);
}

.mail-signature-wizard__preview {
 border: 1px solid rgba(15, 23, 42, 0.08);
 border-radius: 16px;
 background: linear-gradient(180deg, rgba(248, 250, 252, 0.96), rgba(255, 255, 255, 0.98));
 overflow: hidden;
}

.mail-signature-wizard__preview-surface {
 min-height: 220px;
 padding: 1.15rem;
 display: flex;
 align-items: flex-start;
 justify-content: flex-start;
 background: linear-gradient(135deg, rgba(241, 245, 249, 0.72), rgba(255, 255, 255, 0.98));
}

.mail-signature-wizard__preview-empty {
 margin: 0;
 font-size: 0.92rem;
 line-height: 1.45;
 color: var(--ink-soft);
}

.mail-signature-builder {
 border: 1px solid rgba(15, 23, 42, 0.08);
 border-radius: 16px;
 background: linear-gradient(180deg, rgba(248, 250, 252, 0.96), rgba(255, 255, 255, 0.98));
 padding: 1rem;
 display: grid;
 gap: 0.95rem;
}

.mail-signature-builder__head {
 display: flex;
 flex-wrap: wrap;
 align-items: flex-start;
 justify-content: space-between;
 gap: 0.85rem 1rem;
}

.mail-signature-builder__head h4 {
 margin: 0;
 font-size: 0.98rem;
 color: var(--ink-strong);
}

.mail-signature-builder__head p {
 margin: 0.35rem 0 0;
 max-width: 60ch;
}

.mail-signature-builder__head--final {
 margin-top: 0.2rem;
}

.mail-signature-builder__options {
 display: flex;
 flex-wrap: wrap;
 gap: 0.75rem;
}

.mail-signature-builder__choice {
 display: inline-flex;
 align-items: center;
 gap: 0.55rem;
 padding: 0.65rem 0.85rem;
 border: 1px solid rgba(15, 23, 42, 0.08);
 border-radius: 999px;
 background: #fff;
 font-size: 0.92rem;
 color: var(--ink-strong);
}

.mail-signature-builder__choice input[type="radio"] {
 margin: 0;
 accent-color: #0d63f3;
}

.mail-signature-builder__binary {
 display: grid;
 gap: 0;
 max-width: 460px;
 border-top: 1px solid rgba(15, 23, 42, 0.08);
 border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.mail-signature-builder__binary-option {
 display: flex;
 align-items: flex-start;
 gap: 0.7rem;
 padding: 0.85rem 0;
 color: var(--ink-strong);
 font-size: 0.95rem;
}

.mail-signature-builder__binary-option + .mail-signature-builder__binary-option {
 border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.mail-signature-builder__binary-option input[type="radio"] {
 margin: 0.15rem 0 0;
 accent-color: #0d63f3;
}

.mail-signature-builder__asset {
 display: grid;
 gap: 0.75rem;
}

.mail-signature-builder__asset-preview {
 min-height: 124px;
 border: 1px dashed rgba(15, 23, 42, 0.16);
 border-radius: 14px;
 background: linear-gradient(135deg, rgba(241, 245, 249, 0.9), rgba(255, 255, 255, 0.98));
 display: flex;
 align-items: center;
 justify-content: center;
 padding: 0.9rem;
}

.mail-signature-builder__asset-preview img {
 display: block;
 max-width: min(100%, 200px);
 max-height: 74px;
 width: auto;
 height: auto;
 object-fit: contain;
}

.mail-signature-builder__asset-placeholder {
 font-size: 0.9rem;
 line-height: 1.45;
 text-align: center;
 color: var(--ink-soft);
 max-width: 24ch;
}

.mail-signature-builder__asset-actions {
 display: flex;
 flex-wrap: wrap;
 align-items: center;
 gap: 0.75rem;
}

.mail-signature-builder__fields {
 display: grid;
 grid-template-columns: repeat(2, minmax(0, 1fr));
 gap: 0.8rem 1rem;
}

.mail-signature-builder__fields label {
 display: grid;
 gap: 0.45rem;
 min-width: 0;
}

.mail-signature-builder__fields input {
 min-width: 0;
}

.mail-signature-builder__custom {
 display: grid;
 gap: 0.85rem;
 padding: 1rem;
 border: 1px solid rgba(15, 23, 42, 0.08);
 border-radius: 16px;
 background: linear-gradient(180deg, rgba(248, 250, 252, 0.82), rgba(255, 255, 255, 0.98));
}

.mail-signature-builder__custom-head {
 display: flex;
 flex-wrap: wrap;
 align-items: flex-start;
 justify-content: space-between;
 gap: 0.85rem 1rem;
}

.mail-signature-builder__custom-head h5 {
 margin: 0;
 font-size: 0.95rem;
 color: var(--ink-strong);
}

.mail-signature-builder__custom-head p {
 margin: 0.3rem 0 0;
 max-width: 58ch;
}

.mail-signature-builder__custom-fields {
 display: grid;
 gap: 0.8rem;
}

.mail-signature-builder__custom-empty {
 margin: 0;
 font-size: 0.9rem;
 color: var(--ink-soft);
}

.mail-signature-builder__custom-field {
 display: grid;
 grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
 gap: 0.75rem;
 align-items: end;
}

.mail-signature-builder__custom-field input {
 min-width: 0;
}

.mail-signature-builder__custom-remove {
 align-self: end;
 white-space: nowrap;
}

.mail-signature-wizard__extra-summary {
 display: grid;
 gap: 0.75rem;
 max-width: 460px;
 padding-top: 0.2rem;
}

.mail-signature-wizard__extra-summary:empty {
 display: none;
}

.mail-signature-wizard__extra-summary-item {
 display: grid;
 gap: 0.18rem;
 padding: 0.8rem 0;
 border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.mail-signature-wizard__extra-summary-label {
 margin: 0;
 font-size: 0.8rem;
 font-weight: 700;
 letter-spacing: 0.08em;
 text-transform: uppercase;
 color: var(--ink-soft);
}

.mail-signature-wizard__extra-summary-value {
 margin: 0;
 font-size: 0.95rem;
 color: var(--ink-strong);
}

.mail-settings__signature-options {
 display: grid;
 gap: 8px;
 margin-top: 2px;
 padding-top: 8px;
 border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.mail-tab-modal__panel label.mail-settings__signature-option {
 display: flex;
 align-items: center;
 gap: 10px;
 margin: 0;
 font-size: 0.83rem;
 font-weight: 500;
 color: var(--ink-soft);
 cursor: pointer;
}

@media (max-width: 760px) {
 .mail-signature-wizard__layout {
  grid-template-columns: 1fr;
  gap: 1rem;
 }

 .mail-signature-wizard__preview-pane {
  padding-left: 0;
  padding-top: 1rem;
  border-left: 0;
  border-top: 1px solid rgba(15, 23, 42, 0.08);
  position: static;
 }

 .mail-signature-wizard__steps {
  grid-template-columns: repeat(2, minmax(0, 1fr));
 }

 .mail-signature-builder__head {
  flex-direction: column;
  align-items: stretch;
 }

 .mail-signature-builder__custom-head,
 .mail-signature-builder__options,
 .mail-signature-builder__asset-actions {
  flex-direction: column;
  align-items: stretch;
 }

 .mail-signature-builder__custom-field,
 .mail-signature-builder__fields {
  grid-template-columns: 1fr;
 }
}

.mail-settings__signature-option input[type="checkbox"] {
 width: 16px !important;
 height: 16px;
 margin: 0;
 flex: 0 0 auto;
 accent-color: rgb(var(--accent));
 border: none !important;
 border-radius: 4px !important;
 box-shadow: none !important;
 padding: 0 !important;
 background: transparent !important;
}

.mail-settings__signature-option span {
 line-height: 1.3;
}

.mail-checkbox {
 display: inline-flex;
 align-items: center;
 gap: 0.5rem;
}

.mail-checkbox span {
 color: var(--ink-soft);
}

.mail-checkbox a {
 color: var(--ink-strong);
 text-decoration: none;
}

.mail-checkbox a:hover,
.mail-checkbox a:focus-visible {
 color: rgb(var(--accent));
 text-decoration: underline;
}

.mail-settings__domain {
 font-weight: 600;
 color: rgba(15, 23, 42, 0.7);
}

.mail-settings__refresh {
 width: 36px;
 height: 36px;
 padding: 0;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 font-size: 1rem;
}

.mail-settings__section-head {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 16px;
}

.mail-settings__section-head--inline {
 align-items: center;
}

.mail-settings__domain-list {
 display: flex;
 flex-direction: column;
 gap: 10px;
}

.mail-settings__section-head--domain {
 padding: 2px 0;
}

.mail-settings__section-head--actions {
 justify-content: flex-end;
}

.mail-settings__subsection {
 min-width: 0;
 overflow: hidden;
}

.mail-settings__subsection--column {
 border-left: 1px solid rgba(15, 23, 42, 0.08);
 padding-left: 12px;
}

.mail-settings__subsection h3 {
 margin: 0 0 10px;
 font-size: 0.95rem;
}

.mail-settings__menu {
 display: grid;
 gap: 0.3rem;
 min-width: 0;
 overflow: hidden;
}

.mail-settings__panel[data-mail-settings-panel="email-inboxes"] [data-mail-settings-menu],
.mail-settings__panel[data-mail-settings-panel="email-inboxes"] [data-mail-settings-submenu],
.mail-settings__panel[data-mail-settings-panel="email-your-inboxes-identity"] [data-mail-settings-menu],
.mail-settings__panel[data-mail-settings-panel="email-your-inboxes-identity"] [data-mail-settings-your-inboxes-list],
.mail-settings__panel[data-mail-settings-panel="email-your-inboxes-identity-aliases"] [data-mail-settings-menu],
.mail-settings__panel[data-mail-settings-panel="email-your-inboxes-identity-aliases"] [data-mail-settings-your-inboxes-list],
.mail-settings__panel[data-mail-settings-panel="email-your-inboxes-signature"] [data-mail-settings-menu],
.mail-settings__panel[data-mail-settings-panel="email-your-inboxes-signature"] [data-mail-settings-your-inboxes-list],
.mail-settings__panel[data-mail-settings-panel="email-your-inboxes-routing"] [data-mail-settings-menu],
.mail-settings__panel[data-mail-settings-panel="email-your-inboxes-routing"] [data-mail-settings-your-inboxes-list],
.mail-settings__panel[data-mail-settings-panel="email-your-inboxes-notifications"] [data-mail-settings-menu],
.mail-settings__panel[data-mail-settings-panel="email-your-inboxes-notifications"] [data-mail-settings-your-inboxes-list],
.mail-settings__panel[data-mail-settings-panel="email-create-inbox"] [data-mail-settings-menu] {
 display: none !important;
}

.mail-settings__panel[data-mail-settings-panel="email-inboxes"] .mail-settings__section,
.mail-settings__panel[data-mail-settings-panel="email-your-inboxes-identity"] .mail-settings__section,
.mail-settings__panel[data-mail-settings-panel="email-your-inboxes-identity-aliases"] .mail-settings__section,
.mail-settings__panel[data-mail-settings-panel="email-your-inboxes-signature"] .mail-settings__section,
.mail-settings__panel[data-mail-settings-panel="email-your-inboxes-routing"] .mail-settings__section,
.mail-settings__panel[data-mail-settings-panel="email-your-inboxes-notifications"] .mail-settings__section,
.mail-settings__panel[data-mail-settings-panel="email-create-inbox"] .mail-settings__section {
 grid-template-columns: minmax(0, 1fr);
}

.mail-settings__panel[data-mail-settings-panel="email-your-inboxes-identity"].is-identity-nested-collapsed
  .mail-settings__section--menu-grid-4-menus {
 grid-template-columns: minmax(0, 1fr);
}

.mail-settings__panel[data-mail-settings-panel="email-your-inboxes-identity"] .mail-settings__subsection--identity {
 width: 100%;
 max-width: none;
}

.mail-settings__panel[data-mail-settings-panel="email-inboxes"] .mail-settings__section {
 min-height: clamp(320px, 52vh, 560px);
 align-items: center;
 justify-items: center;
}

.mail-settings__subsection--placeholder,
.mail-settings__subsection--identity,
.mail-settings__subsection--routing {
 border-left: 0;
 padding-left: 0;
}

.mail-settings__subsection--placeholder {
 width: 100%;
 display: flex;
 align-items: center;
 justify-content: center;
}

.mail-settings__placeholder {
 padding: 8px 0;
 display: grid;
 gap: 10px;
 max-width: 34rem;
 text-align: center;
 justify-items: center;
}

.mail-settings__placeholder h2 {
 margin: 0;
 font-size: 1.45rem;
}

.mail-settings__placeholder-eyebrow {
 margin: 0;
 font-size: 0.76rem;
 font-weight: 700;
 letter-spacing: 0.08em;
 text-transform: uppercase;
 color: var(--ink-muted);
}

.mail-settings__identity-head {
 display: flex;
 align-items: flex-start;
 justify-content: space-between;
 gap: 16px;
 margin-bottom: 0;
}

.mail-settings__identity-head-copy {
 display: grid;
 gap: 0.45rem;
}

.mail-settings__identity-head-copy h2 {
 margin: 0;
}

.mail-settings__identity-grid {
 display: grid;
 grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
 gap: 1rem;
 align-items: stretch;
}

.mail-settings__menu-empty {
 margin: 0;
 padding: 8px 10px;
 font-size: 0.82rem;
 line-height: 1.25;
}

.mail-settings__menu-caption {
 margin: 0;
 padding: 4px 10px 2px;
 font-size: 0.78rem;
 font-weight: 600;
 line-height: 1.3;
 color: rgba(15, 23, 42, 0.6);
}

.mail-settings__menu--nested {
 border-left: 1px solid rgba(15, 23, 42, 0.08);
 padding-left: 12px;
}

[data-mail-settings-your-inboxes-list] {
 overflow: visible;
}

.mail-settings__menu-item {
 appearance: none;
 width: 100%;
 text-align: left;
 position: relative;
 border: 0;
 border-radius: 8px;
 background: transparent;
 color: var(--ink-soft);
 font: inherit;
 font-size: 0.88rem;
 font-weight: 600;
 line-height: 1.28;
 padding: 9px 1.9rem 9px 11px;
 cursor: pointer;
 transition: color 0.2s ease, background 0.2s ease;
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
}

.mail-settings__menu-item::after {
 content: "\203A";
 position: absolute;
 right: 0.6rem;
 top: 50%;
 transform: translateY(-50%);
 color: rgba(15, 23, 42, 0.72);
 font-size: 1rem;
 pointer-events: none;
 transition: color 0.2s var(--ease);
}

.mail-settings__menu-item:hover,
.mail-settings__menu-item:focus-visible {
 outline: none;
 color: var(--ink-strong);
 background: rgba(15, 23, 42, 0.07);
}

.mail-settings__menu-item:hover::after,
.mail-settings__menu-item:focus-visible::after {
 color: rgba(15, 23, 42, 0.9);
}

.mail-settings__menu-item.is-active {
 color: #0d63f3;
 background: rgba(13, 99, 243, 0.1);
}

.mail-settings__menu-item.is-active::after {
 color: #0d63f3;
}

.mail-settings__menu-item--inbox[data-tooltip]::before {
 content: none;
}

.mail-settings__menu-item--inbox {
 overflow: visible;
}

.mail-settings__create-domain-group {
 display: grid;
 gap: 0.3rem;
}

.mail-settings__create-domain-toggle {
 appearance: none;
 width: 100%;
 text-align: left;
 border: 0;
 border-radius: 8px;
 background: transparent;
 color: var(--ink-soft);
 font: inherit;
 font-size: 0.88rem;
 font-weight: 600;
 line-height: 1.28;
 padding: 9px 11px;
 cursor: pointer;
 transition: color 0.2s ease, background 0.2s ease;
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
}

.mail-settings__create-domain-toggle:hover,
.mail-settings__create-domain-toggle:focus-visible {
 outline: none;
 color: var(--ink-strong);
 background: rgba(15, 23, 42, 0.07);
}

.mail-settings__create-domain-toggle[aria-expanded="true"] {
 color: #0d63f3;
 background: rgba(13, 99, 243, 0.1);
}

.mail-settings__create-domain-toggle-label {
 display: block;
 min-width: 0;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.mail-settings__create-domain-toggle-icon {
 width: 16px;
 height: 16px;
 stroke: currentColor;
 stroke-width: 1.8;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
 flex: 0 0 auto;
 transition: transform 0.2s var(--ease);
}

.mail-settings__create-domain-toggle[aria-expanded="true"] .mail-settings__create-domain-toggle-icon {
 transform: rotate(90deg);
}

.mail-settings__create-domain-actions {
 display: grid;
 gap: 0.3rem;
 margin-left: 1.2rem;
 padding-left: 12px;
 border-left: 1px solid rgba(15, 23, 42, 0.08);
}

.mail-settings__create-domain-actions[hidden] {
 display: none !important;
}

.mail-settings__menu-item--create-action {
 padding-right: 11px;
 white-space: normal;
}

.mail-settings__menu-item--create-action::after {
 content: none;
}

.mail-settings__menu-item-label {
 display: block;
 min-width: 0;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.mail-settings__hover-tooltip {
 position: fixed;
 left: 0;
 top: 0;
 transform: translate(-50%, -100%);
 max-width: 220px;
 padding: 6px 8px;
 border-radius: 8px;
 background: #0B1222;
 color: #fff;
 font-size: 0.7rem;
 font-weight: 500;
 line-height: 1.3;
 letter-spacing: 0;
 box-shadow: 0 10px 24px rgba(15, 23, 42, 0.2);
 pointer-events: none;
 z-index: 2600;
 white-space: normal;
 width: max-content;
}

.mail-settings__hover-tooltip[data-side="bottom"] {
 transform: translate(-50%, 0);
}

.mail-settings__hover-tooltip[hidden] {
 display: none !important;
}

.mail-settings__menu-item[hidden] {
 display: none !important;
}

.mail-settings__menu-item:disabled {
 opacity: 0.42;
 cursor: default;
 pointer-events: none;
}

.mail-settings__field {
 display: grid;
 grid-template-columns: minmax(0, 1fr) auto;
 gap: 16px;
 align-items: center;
 padding: 12px 0;
}

.mail-settings__field label {
 font-weight: 600;
}

.mail-settings__field--stack {
 grid-template-columns: 1fr;
 align-items: flex-start;
}

.mail-settings__field--card {
 height: 100%;
 padding: 1.05rem 1.1rem;
 border: 1px solid rgba(15, 23, 42, 0.08);
 border-radius: 16px;
 background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.94));
 box-shadow: 0 12px 24px rgba(15, 23, 42, 0.04);
}

.mail-settings__field--card > div {
 display: grid;
 gap: 0.35rem;
}

.mail-settings__field--card .btn.ghost {
 align-self: flex-start;
}

.mail-settings__field--card .muted {
 max-width: 56ch;
}

.mail-settings__field-header {
 display: flex;
 align-items: flex-start;
 justify-content: space-between;
 gap: 12px;
 flex-wrap: wrap;
}

.mail-settings__field-header--aliases .btn.ghost {
 padding-inline: 12px;
}

.mail-settings__alias-context {
 margin: 0;
}

.mail-settings__alias-toolbar {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 0.75rem;
 flex-wrap: wrap;
 padding-top: 8px;
 margin-top: 8px;
 border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.mail-settings__alias-count {
 display: inline-flex;
 align-items: center;
 border-radius: 999px;
 background: rgba(15, 23, 42, 0.06);
 color: var(--ink-soft);
 font-size: 0.78rem;
 font-weight: 700;
 line-height: 1;
 padding: 0.42rem 0.7rem;
}

.mail-settings__subsection--alias-detail {
 display: grid;
 gap: 0.8rem;
 align-content: start;
}

.mail-settings__alias-detail-head {
 display: flex;
 align-items: flex-start;
 justify-content: space-between;
 gap: 12px;
 flex-wrap: wrap;
}

.mail-settings__alias-detail-head h2 {
 margin: 0;
}

.mail-settings__subsection--settings-stack {
 display: grid;
 gap: 1.75rem;
 align-content: start;
}

.mail-settings__settings-block {
 display: grid;
 gap: 0.95rem;
 align-content: start;
}

.mail-settings__settings-block + .mail-settings__settings-block {
 padding-top: 1.5rem;
 border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.mail-settings__section-heading {
 display: grid;
 gap: 0.7rem;
}

.mail-settings__section-heading--split {
 grid-template-columns: minmax(0, 1fr) auto;
 align-items: start;
 gap: 1rem 1.5rem;
}

.mail-settings__section-copy {
 display: grid;
 gap: 0.35rem;
 min-width: 0;
}

.mail-settings__section-copy h2,
.mail-settings__section-copy p {
 margin: 0;
}

.mail-settings__section-copy .muted {
 max-width: 56ch;
}

.mail-settings__section-context {
 font-size: 0.9rem;
 line-height: 1.45;
}

.mail-settings__section-actions {
 display: grid;
 justify-items: end;
 gap: 0.55rem;
 align-content: start;
}

.mail-settings__section-meta {
 margin: 0;
 font-size: 0.82rem;
 font-weight: 600;
 line-height: 1.35;
}

.mail-settings__section-button {
 white-space: nowrap;
}

.mail-settings__settings-list {
 display: grid;
}

.mail-settings__settings-row {
 display: grid;
 grid-template-columns: minmax(120px, 160px) minmax(0, 1fr) auto;
 align-items: center;
 gap: 1rem 1.25rem;
 padding: 0.95rem 0;
 border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.mail-settings__settings-row:first-child {
 border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.mail-settings__settings-label {
 color: var(--ink-muted);
 font-size: 0.83rem;
 font-weight: 700;
 line-height: 1.35;
}

.mail-settings__settings-value {
 min-width: 0;
 margin: 0;
 color: var(--ink-strong);
 font-size: 0.98rem;
 line-height: 1.45;
 word-break: break-word;
}

.mail-settings__settings-value.is-placeholder {
 color: var(--ink-soft);
}

.mail-settings__icon-action {
 appearance: none;
 width: 36px;
 height: 36px;
 border: 1px solid rgba(15, 23, 42, 0.1);
 border-radius: 10px;
 background: #fff;
 color: var(--ink-soft);
 display: inline-flex;
 align-items: center;
 justify-content: center;
 padding: 0;
 cursor: pointer;
 transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.mail-settings__icon-action svg {
 width: 16px;
 height: 16px;
 stroke: currentColor;
 stroke-width: 1.8;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
}

.mail-settings__icon-action:hover,
.mail-settings__icon-action:focus-visible {
 outline: none;
 color: rgb(var(--accent));
 border-color: rgba(13, 99, 243, 0.24);
 background: rgba(13, 99, 243, 0.08);
 transform: translateY(-1px);
}

.mail-settings__icon-action:disabled {
 opacity: 0.45;
 cursor: not-allowed;
 background: rgba(15, 23, 42, 0.02);
 transform: none;
}

.mail-settings__icon-action--danger:hover,
.mail-settings__icon-action--danger:focus-visible {
 color: #b42318;
 border-color: rgba(180, 35, 24, 0.22);
 background: rgba(180, 35, 24, 0.08);
}

.mail-settings__control {
 display: flex;
 align-items: center;
 gap: 12px;
 flex-wrap: wrap;
 justify-content: flex-end;
}

.mail-settings__control--domains {
 justify-content: flex-start;
 gap: 10px;
}

.mail-settings__domain-label {
 font-weight: 600;
 color: rgba(15, 23, 42, 0.75);
}

.mail-settings__control--domains select {
 min-width: 0;
 width: auto;
 border: none !important;
 border-radius: 0;
 background-color: transparent !important;
 box-shadow: none !important;
 padding: 0 22px 0 0;
 color: var(--ink-strong);
 font-weight: 600;
 -webkit-appearance: none;
 -moz-appearance: none;
 appearance: none;
 cursor: pointer;
 background-image:
   linear-gradient(45deg, transparent 50%, rgba(15, 23, 42, 0.72) 50%),
   linear-gradient(135deg, rgba(15, 23, 42, 0.72) 50%, transparent 50%);
 background-repeat: no-repeat;
 background-size: 6px 6px, 6px 6px;
 background-position: calc(100% - 8px) 55%, calc(100% - 4px) 55%;
}

.mail-settings__control--domains select:focus,
.mail-settings__control--domains select:focus-visible {
 outline: none;
 border: none;
 box-shadow: none;
}

.mail-settings__control--domains select:hover,
.mail-settings__control--domains select:focus-visible {
 color: #3278FF;
 text-decoration: underline;
 text-underline-offset: 3px;
 text-decoration-thickness: 1px;
 background-image:
   linear-gradient(45deg, transparent 50%, rgba(50, 120, 255, 0.92) 50%),
   linear-gradient(135deg, rgba(50, 120, 255, 0.92) 50%, transparent 50%);
}

.mail-settings__divider {
 height: 1px;
 background: var(--stroke);
}

.mail-settings__editor {
 min-height: 160px;
 border: 1px solid var(--stroke);
 border-radius: 10px;
 padding: 12px;
 background: #fff;
}

.mail-settings__editor:focus {
 outline: none;
 border-color: rgba(50, 120, 255, 0.5);
 box-shadow: 0 0 0 3px rgba(50, 120, 255, 0.2);
}

.mail-settings__textarea {
 width: 100%;
 padding: 0.6rem 0.75rem;
 border-radius: 10px;
 border: 1px solid var(--stroke);
 font: inherit;
 background: #fff;
 resize: vertical;
}

.mail-settings__panel input:not(.mail-toggle):not([type="checkbox"]),
.mail-settings__panel select,
.mail-settings__panel textarea {
 width: 100%;
 padding: 0.6rem 0.75rem;
 border-radius: 10px;
 border: 1px solid var(--stroke);
 font: inherit;
 background: #fff;
}

.mail-settings__control input:not(.mail-toggle):not([type="checkbox"]),
.mail-settings__control select {
 width: auto;
 min-width: 180px;
}

.mail-settings__panel input:not(.mail-toggle):not([type="checkbox"]):focus,
.mail-settings__panel select:focus,
.mail-settings__panel textarea:focus {
 outline: none;
 border-color: rgba(50, 120, 255, 0.5);
 box-shadow: 0 0 0 3px rgba(50, 120, 255, 0.2);
}

/* Keep the inline Domain filter unboxed with a visible dropdown indicator. */
#mailbox-domain-filter {
 width: auto !important;
 min-width: 0 !important;
 padding: 0 22px 0 0 !important;
 border: none !important;
 border-radius: 0 !important;
 background: transparent !important;
 box-shadow: none !important;
 -webkit-appearance: none;
 -moz-appearance: none;
 appearance: none;
 cursor: pointer;
 background-image:
   linear-gradient(45deg, transparent 50%, rgba(15, 23, 42, 0.72) 50%),
   linear-gradient(135deg, rgba(15, 23, 42, 0.72) 50%, transparent 50%) !important;
 background-repeat: no-repeat !important;
 background-size: 6px 6px, 6px 6px !important;
 background-position: calc(100% - 8px) 55%, calc(100% - 4px) 55% !important;
}

#mailbox-domain-filter:hover,
#mailbox-domain-filter:focus-visible {
 color: #3278FF;
 text-decoration: underline;
 text-underline-offset: 3px;
 text-decoration-thickness: 1px;
 background-image:
   linear-gradient(45deg, transparent 50%, rgba(50, 120, 255, 0.92) 50%),
   linear-gradient(135deg, rgba(50, 120, 255, 0.92) 50%, transparent 50%) !important;
}

#mailbox-domain-filter:focus,
#mailbox-domain-filter:focus-visible {
 outline: none;
 border: none !important;
 box-shadow: none !important;
}

/* Mail modal inputs should be underline-only, no boxed style. */
.mail-tab-modal__panel input,
.mail-tab-modal__panel select,
.mail-tab-modal__panel textarea {
 border: none;
 border-bottom: 1px solid rgba(15, 23, 42, 0.2);
 border-radius: 0;
 padding: 6px 0;
 background: transparent;
 box-shadow: none;
}

.mail-tab-modal__panel input:focus,
.mail-tab-modal__panel select:focus,
.mail-tab-modal__panel textarea:focus {
 outline: none;
 border-bottom-color: #3278FF;
 box-shadow: none;
}

.mail-tab-modal__panel .mail-input-group input {
 border: none;
 border-radius: 0;
 box-shadow: none;
 padding-left: 0;
 text-indent: 0;
}

/* Ensure the local-part input aligns with the rest of the modal fields. */
.mail-tab-modal__panel input[data-mailbox-local-part] {
 padding-left: 0 !important;
 padding-inline-start: 0 !important;
 text-indent: 0 !important;
 margin-left: 0 !important;
}

.mail-toggle {
 appearance: none;
 width: 42px;
 height: 22px;
 border-radius: 999px;
 border: 1px solid rgba(15, 23, 42, 0.2);
 background: rgba(15, 23, 42, 0.12);
 position: relative;
 cursor: pointer;
 transition: background 0.2s ease, border-color 0.2s ease;
}

.mail-toggle::after {
 content: "";
 position: absolute;
 width: 18px;
 height: 18px;
 border-radius: 50%;
 background: #fff;
 top: 1px;
 left: 1px;
 box-shadow: 0 2px 6px rgba(15, 23, 42, 0.18);
 transition: transform 0.2s ease;
}

.mail-toggle:checked {
 background: rgba(50, 120, 255, 0.4);
 border-color: rgba(50, 120, 255, 0.7);
}

.mail-toggle:checked::after {
 transform: translateX(20px);
}

.mail-shell {
 display: grid;
 gap: 1.5rem;
}

.mail-card {
 background: #fff;
 border: 1px solid var(--stroke);
 border-radius: 16px;
 padding: 18px;
 box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
}

.mail-card__head {
 display: flex;
 align-items: flex-start;
 justify-content: space-between;
 gap: 1rem;
}

.mail-grid {
 display: grid;
 grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
 gap: 1.5rem;
}

.mailbox-list {
 display: flex;
 flex-direction: column;
 gap: 12px;
 margin-top: 12px;
}

.mailbox-item {
 appearance: none;
 border: none;
 border-top: 1px solid var(--stroke);
 border-radius: 0;
 background: transparent;
 padding: 12px 0;
 display: grid;
 grid-template-columns: minmax(0, 1fr) auto;
 align-items: center;
 gap: 12px;
 width: 100%;
 text-align: left;
 cursor: pointer;
 color: inherit;
 font: inherit;
 transition: background 0.2s ease;
}

.mailbox-list > .mailbox-item:first-child {
 border-top: none;
}

.mailbox-item:hover {
 background: rgba(15, 23, 42, 0.03);
}

.mailbox-item:focus-visible {
 outline: none;
 box-shadow: 0 0 0 2px rgba(50, 120, 255, 0.3);
}

.mailbox-item__main {
 display: flex;
 flex-direction: column;
 gap: 4px;
 min-width: 0;
}

.mailbox-item__title {
 display: flex;
 align-items: center;
 gap: 8px;
 font-size: 1.02rem;
 font-weight: 600;
}

.mailbox-item__address {
 color: var(--ink-muted);
 font-size: 0.85rem;
}

.mailbox-item__badge {
 font-size: 0.7rem;
 border-radius: 999px;
 padding: 2px 8px;
 border: 1px solid rgba(15, 23, 42, 0.16);
 color: var(--ink-muted);
 text-transform: uppercase;
 letter-spacing: 0.06em;
}

.mailbox-item__chevron {
 font-size: 1.2rem;
 color: var(--ink-muted);
}

.mailbox-list-view,
.mailbox-detail-view {
 display: grid;
 gap: 12px;
}

.mailbox-detail-view[hidden] {
 display: none;
}

.mailbox-detail__header {
 position: sticky;
 top: 0;
 z-index: 20;
 background: #fff;
 margin: 0;
 padding: 32px 20px 12px 32px;
 border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.mailbox-detail__header-row {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
}

.mailbox-detail__header h3 {
 margin: 0;
}

.mailbox-detail__scroll {
 flex: 1;
 min-height: 0;
 padding: 12px 0;
 box-sizing: border-box;
}

.mailbox-detail__scroll-inner {
 height: 100%;
 overflow-y: auto;
 padding-right: 12px;
 padding-bottom: 8px;
 box-sizing: border-box;
 scrollbar-width: thin;
 scrollbar-color: rgba(0, 0, 0, 0.25) transparent;
}

.mailbox-detail__scroll-inner::-webkit-scrollbar {
 width: 8px;
}

.mailbox-detail__scroll-inner::-webkit-scrollbar-track {
 background: transparent;
 margin: 12px 0;
}

.mailbox-detail__scroll-inner::-webkit-scrollbar-thumb {
 border-radius: 999px;
 background: rgba(0, 0, 0, 0.2);
 border: 3px solid transparent;
 background-clip: content-box;
}

.mailbox-detail__scroll-inner::-webkit-scrollbar-thumb:hover {
 background: rgba(0, 0, 0, 0.35);
 background-clip: content-box;
}

.mailbox-detail__confirm {
 position: absolute;
 inset: 0;
 background: rgba(15, 23, 42, 0.24);
 display: flex;
 align-items: center;
 justify-content: center;
 padding: 24px;
 z-index: 40;
}

.mailbox-detail__confirm[hidden] {
 display: none;
}

.mailbox-detail__confirm-card {
 background: #fff;
 border-radius: 12px;
 padding: 20px;
 width: min(360px, 90%);
 box-shadow: 0 20px 45px rgba(15, 23, 42, 0.18);
 display: grid;
 gap: 12px;
}

.mailbox-detail__confirm-card h4 {
 margin: 0;
 font-size: 1rem;
}

.mailbox-detail__confirm-card p {
 margin: 0;
 color: var(--ink-muted);
 font-size: 0.92rem;
}

.mailbox-detail__confirm-actions {
 display: flex;
 gap: 10px;
 flex-wrap: wrap;
 justify-content: flex-end;
}

.mailbox-detail__confirm .btn {
 border-radius: 8px;
 padding: 8px 14px;
 border: 1px solid rgba(15, 23, 42, 0.16);
 background: #fff;
 color: #0b1227;
 font-weight: 600;
}

.mailbox-detail__confirm .btn.primary {
 background: rgb(var(--accent));
 color: #fff;
 border-color: rgba(50, 120, 255, 0.4);
}

.mailbox-detail__confirm .btn.ghost {
 background: transparent;
 color: #0b1227;
 border-color: rgba(15, 23, 42, 0.16);
}

.mailbox-detail__confirm .btn.ghost.danger {
 color: #b42318;
 background: rgba(217, 45, 32, 0.08);
 border-color: rgba(217, 45, 32, 0.28);
}

.mailbox-detail__form {
 padding: 12px 20px 32px 32px;
}

.mailbox-detail__address {
 margin: 0 0 6px;
 font-size: 0.85rem;
}

.mail-tab-modal__panel--details .mailbox-detail__address {
 margin: 0 0 4px;
 font-size: 14px;
 color: rgba(15, 23, 42, 0.6);
}

.mail-tab-modal__panel--details .mailbox-detail__name-input {
 border: none;
 border-bottom: 1px solid rgba(15, 23, 42, 0.2);
 border-radius: 0;
 padding: 6px 0;
 background: transparent;
 box-shadow: none;
}

.mail-tab-modal__panel--details .mailbox-detail__name-input:focus {
 outline: none;
 border-bottom-color: #3278FF;
 box-shadow: none;
}

.mailbox-detail__signature {
 display: grid;
 gap: 6px;
 margin-top: 4px;
}

.mailbox-detail__aliases {
 display: grid;
 gap: 12px;
 margin-top: 18px;
}

.mailbox-detail__aliases h4 {
 margin: 0;
 font-size: 12px;
 letter-spacing: 0.08em;
 text-transform: uppercase;
 color: rgba(15, 23, 42, 0.6);
 font-weight: 600;
}

.mailbox-detail__aliases > .muted {
 margin: 0;
}

.mail-tab-modal__panel--details .mailbox-detail__alias-submit.btn.primary {
 background: none;
 border: none;
 border-radius: 0;
 padding: 0;
 font: inherit;
 font-size: 13px;
 font-weight: 600;
 color: var(--ink-strong);
 text-decoration: none;
 box-shadow: none;
 align-self: flex-start;
}

.mail-tab-modal__panel--details .mailbox-detail__alias-submit.btn.primary:hover,
.mail-tab-modal__panel--details .mailbox-detail__alias-submit.btn.primary:focus-visible {
 color: #3278FF;
 background: none;
 border: none;
 box-shadow: none;
 text-decoration: underline;
 text-underline-offset: 4px;
 text-decoration-thickness: 1px;
}

.mailbox-detail__save {
 display: none;
}

.mailbox-detail.is-dirty .mailbox-detail__save {
 display: inline-flex;
}

.mail-tab-modal__panel--details .mailbox-detail__save-top.btn.primary {
 background: none;
 color: var(--ink-strong);
 border: none;
 border-radius: 0;
 padding: 0;
 box-shadow: none;
 text-decoration: none;
}

.mail-tab-modal__panel--details .mailbox-detail__save-top.btn.primary:hover,
.mail-tab-modal__panel--details .mailbox-detail__save-top.btn.primary:focus-visible {
 color: #3278FF;
 background: none;
 border: none;
 box-shadow: none;
 text-decoration: underline;
 text-underline-offset: 4px;
 text-decoration-thickness: 1px;
}

.mailbox-detail__signature-editor {
 display: grid;
 gap: 0;
}

.mailbox-detail__signature .mail-tab-modal__hint {
 margin-top: -2px;
}

.pigeon-quill {
 display: grid;
 gap: 0;
}

.pigeon-quill .ql-toolbar.ql-snow {
 border: none;
 border-bottom: 1px solid var(--stroke);
 background: rgb(var(--surface));
 padding: 8px 12px;
}

.pigeon-quill .ql-container.ql-snow {
 border: none;
 font: inherit;
 background: #fff;
}

.pigeon-quill .ql-editor {
 min-height: 220px;
 padding: 12px 14px;
 color: var(--ink-strong);
 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.pigeon-quill .ql-editor.ql-blank::before {
 color: var(--ink-muted);
 font-style: normal;
}

.pigeon-quill--compose {
 display: flex;
 flex-direction: column;
 flex: 1;
 min-height: 0;
}

.pigeon-quill--compose .pigeon-quill__editor {
 flex: 1;
 min-height: 0;
}

.pigeon-quill--compose .ql-container.ql-snow {
 flex: 1;
 min-height: 0;
}

.pigeon-quill--compose .ql-editor {
 min-height: 100%;
}

.pigeon-quill--compose .ql-toolbar.ql-snow {
 order: 2;
 display: flex;
 flex-wrap: nowrap;
 align-items: center;
 gap: 0;
 padding: 2px 4px;
 margin: 6px 6px 8px;
 background: #ffffff;
 border: 1px solid rgba(15, 23, 42, 0.12);
 border-radius: 999px;
 box-shadow: 0 1px 0 rgba(15, 23, 42, 0.04);
 overflow: visible;
 position: relative;
 z-index: 2;
}

.pigeon-quill--compose .ql-toolbar[data-toolbar-layout="wrap"] {
 flex-wrap: wrap;
 justify-content: flex-start;
 gap: 6px 0;
 padding: 6px 8px;
 border-radius: 18px;
}

.pigeon-quill--compose .ql-toolbar .ql-formats {
 display: inline-flex;
 align-items: center;
 gap: 0;
 padding-right: 2px;
 margin-right: 2px;
 position: relative;
}

.pigeon-quill--compose .ql-toolbar[data-toolbar-layout="wrap"] .ql-formats {
 flex-wrap: nowrap;
}

.pigeon-quill--compose .ql-toolbar .ql-formats:last-child {
 padding-right: 0;
 margin-right: 0;
}

.pigeon-quill--compose .ql-toolbar .ql-formats--toggle {
 margin-left: auto;
 padding-right: 0;
 margin-right: 0;
}

.pigeon-quill--compose .ql-toolbar .ql-formats--advanced {
 padding-right: 0;
 margin-right: 0;
}

.pigeon-quill--compose .ql-toolbar .ql-formats--advanced::after {
 display: none;
}

.pigeon-quill--compose .ql-toolbar .ql-formats::after {
 content: "";
 position: absolute;
 right: 0;
 top: 50%;
 transform: translateY(-50%);
 width: 1px;
 height: 14px;
 background: rgba(15, 23, 42, 0.14);
}

.pigeon-quill--compose .ql-toolbar .ql-formats > * {
 margin-right: 1px;
}

.pigeon-quill--compose .ql-toolbar .ql-formats > *:last-child {
 margin-right: 0;
}

.pigeon-quill--compose .ql-toolbar .ql-formats:last-child::after,
.pigeon-quill--compose .ql-toolbar .ql-formats--toggle::after {
 display: none;
}

.pigeon-quill--compose .ql-toolbar[data-toolbar-visibility="hidden"] {
 display: none;
}

.pigeon-quill--compose .ql-toolbar[data-toolbar-state="collapsed"] .ql-formats--advanced {
 display: none;
}

.pigeon-quill--compose .ql-toolbar[data-toolbar-state="expanded"] .ql-formats--advanced {
 display: inline-flex;
 position: absolute;
 right: 6px;
 bottom: calc(100% + 8px);
 padding: 4px 6px;
 border-radius: 999px;
 background: #ffffff;
 border: 1px solid rgba(15, 23, 42, 0.12);
 box-shadow: 0 10px 24px rgba(15, 23, 42, 0.18);
 z-index: 10;
}

.pigeon-quill--compose .ql-toolbar button {
 width: 22px;
 height: 22px;
 border-radius: 999px;
 border: 1px solid transparent;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 color: var(--ink-strong);
 padding: 0;
}

.pigeon-quill--compose .ql-toolbar button:hover,
.pigeon-quill--compose .ql-toolbar button:focus-visible {
 background: rgba(15, 23, 42, 0.08);
 outline: none;
}

.pigeon-quill--compose .ql-toolbar button.ql-active {
 background: rgba(15, 23, 42, 0.12);
}

.pigeon-quill--compose .ql-toolbar .ql-picker {
 height: 22px;
 border-radius: 999px;
 border: 1px solid rgba(15, 23, 42, 0.2);
 background: #fff;
 color: var(--ink-strong);
 padding: 0 4px;
 display: inline-flex;
 align-items: center;
}

.pigeon-quill--compose .ql-toolbar .ql-picker.ql-font,
.pigeon-quill--compose .ql-toolbar .ql-picker.ql-size {
 border: none;
 background: transparent;
}

.pigeon-quill--compose .ql-toolbar .ql-picker-label {
 padding: 0;
 display: inline-flex;
 align-items: center;
 gap: 6px;
 font-size: 0.7rem;
}

.pigeon-quill--compose .ql-toolbar .ql-picker.ql-font .ql-picker-label,
.pigeon-quill--compose .ql-toolbar .ql-picker.ql-size .ql-picker-label {
 gap: 4px;
}

.pigeon-quill--compose .ql-toolbar .ql-picker-options {
 border-radius: 8px;
 font-size: 0.74rem;
 top: auto !important;
 bottom: calc(100% + 6px) !important;
 box-shadow: 0 10px 24px rgba(15, 23, 42, 0.18);
 max-height: 220px;
 overflow-y: auto;
 overscroll-behavior: contain;
}

.pigeon-quill--compose .ql-toolbar .ql-picker.ql-font {
 min-width: 64px;
 max-width: 78px;
 border: none;
 background: transparent;
 padding: 0;
}

.pigeon-quill--compose .ql-toolbar .ql-picker.ql-size {
 min-width: 42px;
 max-width: 46px;
 border: none;
 background: transparent;
 padding: 0;
}

.pigeon-quill--compose .ql-toolbar .ql-picker.ql-font .ql-picker-label,
.pigeon-quill--compose .ql-toolbar .ql-picker.ql-size .ql-picker-label {
 max-width: 58px;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
 padding: 0 8px 0 2px;
 position: relative;
 color: #3C4043;
}

.pigeon-quill--compose .ql-toolbar .ql-picker.ql-font .ql-picker-label::before,
.pigeon-quill--compose .ql-toolbar .ql-picker.ql-size .ql-picker-label::before {
 display: block;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.pigeon-quill--compose .ql-toolbar .ql-picker.ql-font .ql-picker-label::after,
.pigeon-quill--compose .ql-toolbar .ql-picker.ql-size .ql-picker-label::after {
 content: none;
}

.pigeon-quill--compose .ql-toolbar .ql-picker.ql-font .ql-picker-label svg,
.pigeon-quill--compose .ql-toolbar .ql-picker.ql-size .ql-picker-label svg {
 width: 9px;
 height: 9px;
 margin-left: 2px;
}

.pigeon-quill--compose .ql-toolbar .ql-picker.ql-font .ql-picker-label svg *,
.pigeon-quill--compose .ql-toolbar .ql-picker.ql-size .ql-picker-label svg * {
 stroke: #5F6368;
 stroke-width: 1.6;
 fill: none;
}

.pigeon-quill--compose .ql-toolbar .ql-picker.ql-color {
 min-width: 32px;
 padding: 0 2px;
}

.pigeon-quill--compose .ql-toolbar .ql-stroke {
 stroke: currentColor;
}

.pigeon-quill--compose .ql-toolbar .ql-fill {
 fill: currentColor;
}

.pigeon-quill--compose .ql-toolbar button.ql-undo svg,
.pigeon-quill--compose .ql-toolbar button.ql-redo svg,
.pigeon-quill--compose .pigeon-toolbar__toggle svg {
 width: 14px;
 height: 14px;
 stroke: currentColor;
 stroke-width: 1.5;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
}

.pigeon-quill--compose .ql-toolbar button.ql-undo svg,
.pigeon-quill--compose .ql-toolbar button.ql-redo svg {
 stroke-width: 1.6;
}

.pigeon-quill--compose .pigeon-toolbar__toggle {
 width: 22px;
 height: 22px;
 border-radius: 999px;
 border: 1px solid transparent;
 background: transparent;
 color: var(--ink-strong);
 display: inline-flex;
 align-items: center;
 justify-content: center;
 cursor: pointer;
}

.pigeon-quill--compose .ql-toolbar[data-toolbar-state="expanded"] .pigeon-toolbar__toggle svg {
 transform: rotate(180deg);
}

.pigeon-quill--compose .ql-toolbar [data-tooltip] {
 position: relative;
}

.pigeon-quill--compose .ql-toolbar [data-tooltip]::after {
 content: attr(data-tooltip);
 position: absolute;
 left: 50%;
 bottom: calc(100% + 8px);
 transform: translate(-50%, -6px);
 background: #0B1222;
 color: #FFFFFF;
 font-size: 0.7rem;
 font-weight: 500;
 line-height: 1.3;
 padding: 6px 8px;
 border-radius: 8px;
 white-space: nowrap;
 opacity: 0;
 visibility: hidden;
 pointer-events: none;
 box-shadow: 0 10px 24px rgba(15, 23, 42, 0.2);
 z-index: 4;
}

.pigeon-quill--compose .ql-toolbar [data-tooltip]::before {
 content: none;
}

.pigeon-quill--compose .ql-toolbar [data-tooltip]:hover::after,
 .pigeon-quill--compose .ql-toolbar [data-tooltip]:focus-visible::after {
 opacity: 1;
 visibility: visible;
 transform: translate(-50%, 0);
}

.mail-settings__signature-editor.pigeon-quill--compose {
 min-height: 240px;
}

.mail-settings__signature-editor.pigeon-quill--compose .pigeon-quill__editor,
.mail-settings__signature-editor.pigeon-quill--compose .ql-container.ql-snow,
.mail-settings__signature-editor.pigeon-quill--compose .ql-editor {
 min-height: 192px;
}

.mail-settings__signature-editor.pigeon-quill--compose .pigeon-quill__toolbar.ql-toolbar.ql-snow {
 border-top: 1px solid var(--stroke);
 border-bottom: none;
}

.mailbox-detail__signature-editor .ql-toolbar.ql-snow {
 background: transparent;
 border: none;
 padding: 6px 0;
}

.mailbox-detail__signature-editor .ql-container.ql-snow {
 border: 1px solid rgba(15, 23, 42, 0.18);
 border-radius: 10px;
}

.mailbox-detail__signature-editor .ql-editor {
 min-height: 140px;
 padding: 10px 12px;
}

.ql-snow .ql-picker.ql-font .ql-picker-label::before,
.ql-snow .ql-picker.ql-font .ql-picker-item::before,
.ql-snow .ql-picker.ql-size .ql-picker-label::before,
.ql-snow .ql-picker.ql-size .ql-picker-item::before {
 content: attr(data-label);
}

.ql-snow .ql-picker.ql-font .ql-picker-label,
.ql-snow .ql-picker.ql-font .ql-picker-item,
.ql-snow .ql-picker.ql-size .ql-picker-label,
.ql-snow .ql-picker.ql-size .ql-picker-item {
 font-family: inherit;
}

.mail-danger-zone {
 border-top: 1px solid rgba(15, 23, 42, 0.08);
 padding-top: 12px;
 margin-top: 8px;
}

.mail-danger-zone summary {
 display: flex;
 align-items: center;
 justify-content: space-between;
 cursor: pointer;
 font-weight: 600;
 font-size: 0.9rem;
 color: rgba(15, 23, 42, 0.8);
 list-style: none;
 padding-bottom: 12px;
 border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.mail-danger-zone summary::-webkit-details-marker {
 display: none;
}

.mail-danger-zone__chevron {
 transition: transform 0.2s ease;
 color: var(--ink-muted);
}

.mail-danger-zone[open] .mail-danger-zone__chevron {
 transform: rotate(90deg);
}

.mail-danger-zone__content {
 display: grid;
 gap: 14px;
 margin-top: 16px;
}

.mail-danger-zone__field label {
 display: block;
 font-size: 0.8rem;
 color: var(--ink-muted);
 margin-bottom: 6px;
}

.mail-danger-zone__field input {
 border: none;
 border-bottom: 1px solid rgba(15, 23, 42, 0.2);
 border-radius: 0;
 padding: 6px 0;
 background: transparent;
 box-shadow: none;
 font: inherit;
 width: 100%;
}

.mail-danger-zone__field input:focus {
 outline: none;
 border-bottom-color: #3278FF;
 box-shadow: none;
}

.mail-danger-zone__checkbox {
 display: flex;
 gap: 12px;
 align-items: center;
 justify-content: space-between;
 width: 100%;
 font-size: 0.85rem;
 color: var(--ink-strong);
}

.mail-danger-zone__checkbox input {
 order: 2;
 margin: 0;
}

.mail-danger-zone__checkbox span {
 order: 1;
 flex: 1;
}

.mail-danger-zone__actions {
 display: flex;
 justify-content: flex-end;
}

.mail-tab-modal__panel--details .mail-danger-zone {
 border-top: 1px solid rgba(15, 23, 42, 0.12);
 padding-top: 16px;
 margin: 6px 20px 0 32px;
}

.mail-tab-modal__panel--details .mail-danger-zone summary {
 padding-bottom: 8px;
 border-bottom: none;
}

.mail-tab-modal__panel--details .mail-danger-zone__content {
 gap: 12px;
 margin-top: 12px;
}

.mail-tab-modal__panel--details .mail-danger-zone__field label {
 font-size: 12px;
 letter-spacing: 0.08em;
 text-transform: uppercase;
 color: rgba(15, 23, 42, 0.6);
}

.mail-tab-modal__panel--details .mail-danger-zone__field input {
 border: none !important;
 border-bottom: 1px solid rgba(15, 23, 42, 0.2) !important;
 border-radius: 0 !important;
 padding: 6px 0 !important;
 background: transparent !important;
 box-shadow: none !important;
 font: inherit;
 width: 100%;
}

.mail-tab-modal__panel--details .mail-danger-zone__field input:focus {
 outline: none;
 border-bottom-color: #3278FF !important;
 box-shadow: none !important;
}

.mail-tab-modal__panel--details .mail-danger-zone__checkbox {
 display: flex;
 align-items: center;
 font-size: 14px;
 color: rgba(15, 23, 42, 0.8);
 justify-content: space-between;
 gap: 12px;
 width: 100%;
}

.mail-tab-modal__panel--details .mail-danger-zone__checkbox input {
 order: 2;
 width: 16px;
 height: 16px;
 margin: 0;
}

.mail-tab-modal__panel--details .mail-danger-zone__checkbox span {
 order: 1;
 flex: 1;
}

.mail-tab-modal__panel--details .mail-danger-zone__actions {
 margin-top: 4px;
}

.mailbox-delete-plan {
 border-top: 1px solid rgba(15, 23, 42, 0.08);
 margin-top: 8px;
 padding-top: 14px;
 display: grid;
 gap: 12px;
}

.mailbox-delete-plan h4 {
 margin: 0;
 font-size: 0.95rem;
}

.mailbox-delete-plan__step {
 display: grid;
 gap: 10px;
 padding-top: 10px;
 border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.mailbox-delete-plan__step h5 {
 margin: 0;
 font-size: 0.85rem;
 text-transform: uppercase;
 letter-spacing: 0.08em;
 color: rgba(15, 23, 42, 0.6);
}

.mailbox-delete-plan__option {
 display: flex;
 gap: 10px;
 align-items: flex-start;
 font-size: 0.9rem;
 color: rgba(15, 23, 42, 0.9);
}

.mailbox-delete-plan__option input {
 margin-top: 3px;
}

.mailbox-delete-plan__detail {
 display: grid;
 gap: 8px;
 padding: 10px 12px;
 border-radius: 12px;
 background: rgba(15, 23, 42, 0.04);
 border: 1px solid rgba(15, 23, 42, 0.08);
}

.mailbox-delete-plan__detail label {
 font-size: 0.8rem;
 color: rgba(15, 23, 42, 0.7);
}

.mailbox-delete-plan__detail select,
.mailbox-delete-plan__detail textarea {
 border: 1px solid rgba(15, 23, 42, 0.18);
 border-radius: 10px;
 padding: 8px 10px;
 font: inherit;
 background: #fff;
}

.mailbox-delete-plan__detail textarea {
 min-height: 110px;
 resize: vertical;
}

.mailbox-delete-plan__toggle {
 display: flex;
 gap: 10px;
 align-items: flex-start;
 font-size: 0.85rem;
 color: rgba(15, 23, 42, 0.8);
}

.mailbox-delete-final {
 display: grid;
 gap: 12px;
 padding-top: 10px;
 border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.mailbox-delete-final__toggle {
 font-size: 0.9rem;
}

.mailbox-delete-summary {
 list-style: none;
 padding: 0;
 margin: 12px 0 0;
 display: grid;
 gap: 8px;
 font-size: 0.9rem;
}

.mailbox-delete-summary li {
 padding: 8px 10px;
 border-radius: 10px;
 background: rgba(15, 23, 42, 0.06);
}

.mailbox-detail__confirm-card--delete {
 max-width: 460px;
}

.mailbox-detail__danger {
 border-top: 1px solid var(--stroke);
 padding-top: 14px;
 display: grid;
 gap: 8px;
}

.mailbox-detail__danger h4 {
 margin: 0;
 font-size: 0.95rem;
}

.mail-settings__footer {
 display: flex;
 justify-content: flex-end;
 padding-top: 8px;
}

.mail-input-group {
 display: flex;
 align-items: stretch;
 border-bottom: 1px solid rgba(15, 23, 42, 0.2);
 width: 100%;
 min-width: 0;
}

.mail-input-group input {
 flex: 1;
 min-width: 0;
 border: none;
 border-radius: 0;
 padding: 6px 0;
}

.mail-input-suffix {
 display: inline-flex;
 align-items: center;
 padding: 0 0 0 8px;
 border: none;
 background: transparent;
 color: var(--ink-muted);
 font-size: 0.85rem;
 white-space: nowrap;
}

.mail-input-suffix--select {
 appearance: none;
 -webkit-appearance: none;
 -moz-appearance: none;
 cursor: pointer;
 padding-right: 18px;
 background-image:
   linear-gradient(45deg, transparent 50%, rgba(15, 23, 42, 0.72) 50%),
   linear-gradient(135deg, rgba(15, 23, 42, 0.72) 50%, transparent 50%);
 background-repeat: no-repeat;
 background-size: 6px 6px, 6px 6px;
 background-position: calc(100% - 8px) 55%, calc(100% - 4px) 55%;
}

.mail-input-suffix--select:focus,
.mail-input-suffix--select:focus-visible {
 outline: none;
}

.mail-input-suffix--select:hover,
.mail-input-suffix--select:focus-visible {
 color: #3278FF;
 text-decoration: underline;
 text-underline-offset: 3px;
 text-decoration-thickness: 1px;
 background-image:
   linear-gradient(45deg, transparent 50%, rgba(50, 120, 255, 0.92) 50%),
   linear-gradient(135deg, rgba(50, 120, 255, 0.92) 50%, transparent 50%);
}

.mail-input-group:focus-within {
 border-bottom-color: #3278FF;
}

.mail-form__toggle {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
 margin-top: 6px;
}

.mail-alias-list {
 list-style: none;
 padding: 0;
 margin: 0;
 display: grid;
 gap: 4px;
}

.mail-alias-item {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 10px;
 padding: 2px 0;
}

.mail-alias-item__address {
 font-weight: 600;
 color: var(--ink-strong);
 font-size: 0.85rem;
 line-height: 1.25;
}

.mail-alias-item__remove {
 border: none;
 background: none;
 padding: 0;
 margin: 0;
 width: 20px;
 height: 20px;
 border-radius: 6px;
 color: #D72828;
 font-size: 1rem;
 line-height: 1;
 font-weight: 700;
 cursor: pointer;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 flex-shrink: 0;
 text-decoration: none;
 box-shadow: none;
}

.mail-alias-item__remove:hover,
.mail-alias-item__remove:focus-visible {
 color: #b42318;
 background: rgba(217, 45, 32, 0.1);
 outline: none;
}


.mailbox-address__type {
 font-size: 0.7rem;
 text-transform: uppercase;
 letter-spacing: 0.08em;
 color: var(--ink-muted);
 font-weight: 700;
}

.mailbox-address__value {
 font-family: var(--font-mono);
 font-size: 0.85rem;
 color: var(--ink-strong);
}

.mail-form {
 display: grid;
 gap: 10px;
}

.mail-form label {
 font-weight: 600;
}

.mail-form input:not([type="checkbox"]):not(.mail-toggle),
.mail-form select:not(.mail-input-suffix--select) {
 width: 100%;
 padding: 0.6rem 0.75rem;
 border-radius: 10px;
 border: 1px solid var(--stroke);
 font: inherit;
 background: #fff;
}

.mail-form input:not([type="checkbox"]):not(.mail-toggle):focus,
.mail-form select:not(.mail-input-suffix--select):focus {
 outline: none;
 border-color: rgba(50, 120, 255, 0.5);
 box-shadow: 0 0 0 3px rgba(50, 120, 255, 0.2);
}

/* Ensure mail modals use underline-only inputs, overriding mail-form defaults. */
.mail-settings__panel .mail-tab-modal__panel .mail-form input:not([type="checkbox"]):not(.mail-toggle),
.mail-settings__panel .mail-tab-modal__panel .mail-form select:not(.mail-input-suffix--select),
.mail-settings__panel .mail-tab-modal__panel .mail-form textarea,
.mail-tab-modal__panel .mail-form input:not([type="checkbox"]):not(.mail-toggle),
.mail-tab-modal__panel .mail-form select:not(.mail-input-suffix--select),
.mail-tab-modal__panel .mail-form textarea {
 border: none;
 border-bottom: 1px solid rgba(15, 23, 42, 0.2);
 border-radius: 0;
 padding: 6px 0;
 background: transparent;
 box-shadow: none;
}

.mail-settings__panel .mail-tab-modal__panel .mail-form input:not([type="checkbox"]):not(.mail-toggle):focus,
.mail-settings__panel .mail-tab-modal__panel .mail-form select:not(.mail-input-suffix--select):focus,
.mail-settings__panel .mail-tab-modal__panel .mail-form textarea:focus,
.mail-tab-modal__panel .mail-form input:not([type="checkbox"]):not(.mail-toggle):focus,
.mail-tab-modal__panel .mail-form select:not(.mail-input-suffix--select):focus,
.mail-tab-modal__panel .mail-form textarea:focus {
 outline: none;
 border-bottom-color: #3278FF;
 box-shadow: none;
}

.mail-settings__panel .mail-tab-modal__panel .mail-form input:not([type="checkbox"]):not(.mail-toggle):focus-visible,
.mail-settings__panel .mail-tab-modal__panel .mail-form select:not(.mail-input-suffix--select):focus-visible,
.mail-settings__panel .mail-tab-modal__panel .mail-form textarea:focus-visible,
.mail-tab-modal__panel .mail-form input:not([type="checkbox"]):not(.mail-toggle):focus-visible,
.mail-tab-modal__panel .mail-form select:not(.mail-input-suffix--select):focus-visible,
.mail-tab-modal__panel .mail-form textarea:focus-visible {
 outline: none;
 box-shadow: none;
}

.mail-tab-modal__panel .mail-form .mail-input-group {
 width: 100%;
 min-width: 0;
}

.mail-tab-modal__panel .mail-form .mail-input-group input {
 border: none;
 border-radius: 0;
 box-shadow: none;
}

.mail-tab-modal__panel .mail-form .mail-input-group input[data-mailbox-local-part] {
 flex: 1 1 180px;
 width: auto !important;
 min-width: 96px;
}

.mail-tab-modal__panel .mail-form .mail-input-group .mail-input-suffix--select {
 flex: 0 0 auto;
 width: auto !important;
 min-width: 0;
 border: none !important;
 border-radius: 0 !important;
 background-color: transparent !important;
 box-shadow: none !important;
 padding: 6px 20px 6px 8px;
 cursor: pointer;
 background-image:
   linear-gradient(45deg, transparent 50%, rgba(15, 23, 42, 0.72) 50%),
   linear-gradient(135deg, rgba(15, 23, 42, 0.72) 50%, transparent 50%);
 background-repeat: no-repeat;
 background-size: 6px 6px, 6px 6px;
 background-position: calc(100% - 8px) 55%, calc(100% - 4px) 55%;
}

.mail-tab-modal__panel .mail-form .mail-input-group .mail-input-suffix--select:hover,
.mail-tab-modal__panel .mail-form .mail-input-group .mail-input-suffix--select:focus-visible {
 color: #3278FF;
 text-decoration: underline;
 text-underline-offset: 3px;
 text-decoration-thickness: 1px;
 background-image:
   linear-gradient(45deg, transparent 50%, rgba(50, 120, 255, 0.92) 50%),
   linear-gradient(135deg, rgba(50, 120, 255, 0.92) 50%, transparent 50%);
}

.mail-tab-modal__panel .mail-form .mail-input-group input:focus-visible {
 outline: none;
 box-shadow: none;
}

/* Force underline-only styling for the display name field. */
.mail-tab-modal__panel input[data-mailbox-nickname] {
 border: none !important;
 border-bottom: 1px solid rgba(15, 23, 42, 0.2) !important;
 border-radius: 0 !important;
 background: transparent !important;
 box-shadow: none !important;
 outline: none !important;
 padding: 6px 0 !important;
}

.mail-tab-modal__panel input[data-mailbox-nickname]:focus,
.mail-tab-modal__panel input[data-mailbox-nickname]:focus-visible {
 border-bottom-color: #3278FF !important;
 box-shadow: none !important;
 outline: none !important;
}

.mail-form__hint {
 font-size: 0.85rem;
 color: var(--ink-muted);
 margin: 0;
}

.mail-status {
 min-height: 18px;
 font-weight: 600;
 color: var(--ink-muted);
 margin: 0;
}

.mail-status.is-error {
 color: #d72828;
}

.mail-status.is-success {
 color: #0f8a2f;
}

.mail-shell .btn,
.mail-workspace .btn,
.main__actions[data-panel-actions="mail"] .btn {
 border-radius: 8px;
 padding: 8px 14px;
}

.mail-shell .btn.primary,
.mail-workspace .btn.primary,
.main__actions[data-panel-actions="mail"] .btn.primary {
 background: rgb(var(--accent));
 color: #fff;
 border: 1px solid rgba(50, 120, 255, 0.4);
 box-shadow: none;
}

.mail-shell .btn.primary:hover,
.mail-workspace .btn.primary:hover,
.main__actions[data-panel-actions="mail"] .btn.primary:hover {
 transform: none;
 box-shadow: none;
}

.mail-shell .btn.ghost,
.mail-workspace .btn.ghost,
.main__actions[data-panel-actions="mail"] .btn.ghost {
 background: transparent;
 color: #0b1227;
 border: 1px solid rgba(15, 23, 42, 0.16);
}

.mail-shell .btn.ghost:hover,
.mail-workspace .btn.ghost:hover,
.main__actions[data-panel-actions="mail"] .btn.ghost:hover {
 background: rgba(15, 23, 42, 0.06);
 border-color: rgba(15, 23, 42, 0.2);
}

.mail-shell .btn.ghost.danger,
.mail-workspace .btn.ghost.danger {
 color: #b42318;
 border-color: rgba(180, 35, 24, 0.4);
}

.mail-shell .btn.ghost.danger:hover,
.mail-workspace .btn.ghost.danger:hover {
 background: rgba(180, 35, 24, 0.08);
 border-color: rgba(180, 35, 24, 0.6);
}

.main__actions[data-panel-actions="mail"] .btn.mail-compose {
 display: inline-flex;
 align-items: center;
 gap: 6px;
 padding: 6px 10px;
 background: transparent;
 color: var(--ink-strong);
 border: 1px solid var(--stroke);
 box-shadow: none;
}

.main__actions[data-panel-actions="mail"] .btn.mail-compose:hover,
.main__actions[data-panel-actions="mail"] .btn.mail-compose:focus-visible {
 background: rgba(15, 23, 42, 0.06);
 border-color: rgba(15, 23, 42, 0.2);
 transform: none;
 box-shadow: none;
}

.main__actions[data-panel-actions="mail"] .mail-compose__icon {
 width: 14px;
 height: 14px;
 stroke: currentColor;
 stroke-width: 1.6;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
 display: inline-block;
}

.main__actions[data-panel-actions="mail"] .btn.mail-call-new,
.main__actions.main__actions--mail .btn.mail-call-new {
 padding: 7px 12px;
 border-color: #1d4ed8;
 background: linear-gradient(180deg, #2563eb, #1d4ed8);
 color: #fff;
 box-shadow: 0 8px 16px rgba(15, 23, 42, 0.16);
}

.main__actions[data-panel-actions="mail"] .btn.mail-call-new:hover,
.main__actions[data-panel-actions="mail"] .btn.mail-call-new:focus-visible,
.main__actions.main__actions--mail .btn.mail-call-new:hover,
.main__actions.main__actions--mail .btn.mail-call-new:focus-visible {
 background: linear-gradient(180deg, #1d4ed8, #1e40af);
 border-color: #1e40af;
 color: #fff;
 box-shadow: 0 10px 18px rgba(15, 23, 42, 0.2);
}

.main__actions[data-panel-actions="mail"] .btn.mail-call-new .mail-compose__icon {
 width: 15px;
 height: 15px;
 stroke-width: 1.85;
}

.pigeon-compose {
 position: fixed;
 right: 24px;
 bottom: 24px;
 width: min(560px, calc(100vw - 48px));
 height: min(640px, calc(100vh - 120px));
 min-height: 520px;
 display: flex;
 flex-direction: column;
 background: #fff;
 border: 1px solid var(--stroke);
 border-radius: 14px;
 box-shadow: 0 22px 60px rgba(15, 23, 42, 0.18), 0 6px 18px rgba(15, 23, 42, 0.08);
 z-index: 40;
 overflow: hidden;
}

.pigeon-compose__header {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
 padding: 10px 14px;
 background: #f8fafc;
 border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.pigeon-compose__title {
 font-weight: 600;
 font-size: 0.9rem;
 color: var(--ink-strong);
}

.pigeon-compose__actions {
 display: inline-flex;
 align-items: center;
 gap: 8px;
}

.pigeon-compose__action {
 width: 30px;
 height: 30px;
 border-radius: 8px;
 border: 1px solid transparent;
 background: transparent;
 color: var(--ink-strong);
 display: inline-flex;
 align-items: center;
 justify-content: center;
 cursor: pointer;
}

.pigeon-compose__action svg {
 width: 18px;
 height: 18px;
 stroke: currentColor;
 stroke-width: 1.6;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
}

.pigeon-compose__action:hover,
.pigeon-compose__action:focus-visible {
 background: rgba(15, 23, 42, 0.06);
 outline: none;
}

.pigeon-compose__action[aria-pressed="true"] {
 background: rgba(15, 23, 42, 0.08);
}

.pigeon-compose__action--close:hover,
.pigeon-compose__action--close:focus-visible {
 color: #D72828;
}

.pigeon-compose__body {
 display: flex;
 flex-direction: column;
 flex: 1;
 min-height: 0;
}

.pigeon-compose__field {
 display: flex;
 align-items: center;
 gap: 12px;
 padding: 8px 14px;
 border-bottom: 1px solid rgba(15, 23, 42, 0.08);
 font-size: 0.9rem;
}

.pigeon-compose__field--from {
 align-items: center;
}

.pigeon-compose__label {
 font-weight: 600;
 font-size: 0.8rem;
 color: var(--ink-muted);
}

.pigeon-compose__label--sr {
 position: absolute;
 width: 1px;
 height: 1px;
 padding: 0;
 margin: -1px;
 overflow: hidden;
 clip: rect(0, 0, 0, 0);
 white-space: nowrap;
 border: 0;
}

.pigeon-compose__input {
 width: auto;
 min-width: 0;
 border: none;
 background: transparent;
 font: inherit;
 color: var(--ink-strong);
 padding: 6px 0;
 flex: 1;
}

.pigeon-compose__input:focus {
 outline: none;
}

.pigeon-compose__input::placeholder {
 color: var(--ink-muted);
}

.pigeon-compose__from-shell {
 flex: 1;
 min-width: 0;
 display: flex;
 align-items: center;
 position: relative;
}

.pigeon-compose__from-shell[data-tooltip]::after,
.pigeon-compose__from-trigger[data-tooltip]::after {
 content: attr(data-tooltip);
 position: absolute;
 left: 0;
 top: calc(100% + 8px);
 transform: translateY(-4px);
 background: #0B1222;
 color: #FFFFFF;
 font-size: 0.7rem;
 font-weight: 500;
 line-height: 1.3;
 padding: 6px 8px;
 border-radius: 8px;
 max-width: 260px;
 width: max-content;
 white-space: normal;
 opacity: 0;
 visibility: hidden;
 pointer-events: none;
 box-shadow: 0 10px 24px rgba(15, 23, 42, 0.2);
 z-index: 32;
}

.pigeon-compose__from-shell[data-tooltip]:hover::after,
.pigeon-compose__from-shell[data-tooltip]:focus-within::after,
.pigeon-compose__from-trigger[data-tooltip]:hover::after,
.pigeon-compose__from-trigger[data-tooltip]:focus-visible::after {
 opacity: 1;
 visibility: visible;
 transform: translateY(0);
}

.pigeon-compose__from-select {
 max-width: min(100%, 320px);
 width: max-content;
 min-width: 110px;
 padding: 2px 18px 2px 0;
 border: none;
 border-radius: 0;
 background-color: transparent;
 color: var(--ink-strong);
 font-size: 0.78rem;
 line-height: 1.2;
 appearance: none;
 -webkit-appearance: none;
 -moz-appearance: none;
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
 cursor: pointer;
 background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%236b7280' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 8 10 12 14 8'/></svg>");
 background-repeat: no-repeat;
 background-position: right 0 center;
 background-size: 12px 12px;
}

.pigeon-compose__from-select:hover,
.pigeon-compose__from-select:focus-visible {
 outline: none;
 color: var(--ink-strong);
}

.pigeon-compose__from-select.is-error {
 color: #D72828;
}

.pigeon-compose__from-select:disabled {
 color: var(--ink-muted);
 cursor: not-allowed;
}

.pigeon-compose__from-select.is-locked,
.pigeon-compose__from-select[data-locked="true"] {
 color: var(--ink-muted);
 cursor: not-allowed;
}

.pigeon-compose__from-trigger {
 width: 100%;
 display: inline-flex;
 align-items: center;
 gap: 10px;
 border: 1px solid rgba(15, 23, 42, 0.16);
 border-radius: 10px;
 background: #fff;
 color: var(--ink-strong);
 padding: 6px 10px;
 cursor: pointer;
 text-align: left;
 min-height: 36px;
}

.pigeon-compose__from-trigger:hover,
.pigeon-compose__from-trigger:focus-visible {
 border-color: rgba(50, 120, 255, 0.6);
 box-shadow: 0 0 0 2px rgba(50, 120, 255, 0.18);
 outline: none;
}

.pigeon-compose__from-trigger.is-placeholder {
 color: var(--ink-muted);
}

.pigeon-compose__from-trigger.is-error {
 border-color: #D72828;
 box-shadow: 0 0 0 3px rgba(215, 40, 40, 0.18);
}

.pigeon-compose__from-avatar {
 width: 22px;
 height: 22px;
 border-radius: 999px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 background: #1E5ADC;
 color: #fff;
 font-size: 0.68rem;
 font-weight: 700;
 flex: 0 0 22px;
 text-transform: uppercase;
}

.pigeon-compose__from-value {
 min-width: 0;
 flex: 1;
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
 font-size: 0.78rem;
}

.pigeon-compose__from-caret {
 width: 14px;
 height: 14px;
 stroke: currentColor;
 stroke-width: 1.7;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
 flex: 0 0 14px;
 opacity: 0.72;
}

.pigeon-compose__from-menu {
 position: absolute;
 top: calc(100% + 6px);
 left: 0;
 right: 0;
 border: 1px solid rgba(15, 23, 42, 0.12);
 border-radius: 12px;
 background: #fff;
 box-shadow: 0 12px 30px rgba(15, 23, 42, 0.16);
 z-index: 12;
 padding: 6px;
 display: grid;
 gap: 4px;
}

.pigeon-compose__from-menu[hidden] {
 display: none;
}

.pigeon-compose__from-option {
 width: 100%;
 border: none;
 border-radius: 8px;
 background: transparent;
 padding: 8px 10px;
 display: inline-flex;
 align-items: center;
 gap: 10px;
 cursor: pointer;
 text-align: left;
 color: var(--ink-strong);
}

.pigeon-compose__from-option:hover,
.pigeon-compose__from-option:focus-visible {
 background: rgba(50, 120, 255, 0.1);
 outline: none;
}

.pigeon-compose__from-option.is-selected {
 background: rgba(50, 120, 255, 0.12);
}

.pigeon-compose__from-option-body {
 min-width: 0;
 display: grid;
 gap: 2px;
}

.pigeon-compose__from-option-name {
 font-size: 0.74rem;
 font-weight: 600;
 color: var(--ink-strong);
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
}

.pigeon-compose__from-option-address {
 font-size: 0.7rem;
 color: var(--ink-muted);
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
}

.pigeon-compose__recipient {
 display: flex;
 align-items: center;
 gap: 6px;
 flex: 1;
 min-width: 0;
 flex-wrap: wrap;
 cursor: text;
}

.pigeon-compose__chips {
 display: inline-flex;
 align-items: center;
 gap: 6px;
 flex-wrap: wrap;
 max-width: 100%;
}

.pigeon-compose__chip {
 display: inline-flex;
 align-items: center;
 gap: 4px;
 max-width: 100%;
 padding: 3px 6px 3px 8px;
 border-radius: 999px;
 border: 1px solid rgba(50, 120, 255, 0.35);
 background: rgba(50, 120, 255, 0.08);
 color: #1E5ADC;
 font-size: 0.74rem;
 line-height: 1;
}

.pigeon-compose__chip-text {
 max-width: 220px;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.pigeon-compose__chip-remove {
 width: 16px;
 height: 16px;
 border: none;
 border-radius: 999px;
 background: transparent;
 color: inherit;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 cursor: pointer;
 padding: 0;
}

.pigeon-compose__chip-remove:hover,
.pigeon-compose__chip-remove:focus-visible {
 background: rgba(30, 90, 220, 0.14);
 outline: none;
}

.pigeon-compose__chip-remove svg {
 width: 10px;
 height: 10px;
 stroke: currentColor;
 stroke-width: 1.8;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
}

.pigeon-compose__input--recipient {
 min-width: 140px;
 flex: 1 1 140px;
 padding: 4px 0;
}

.pigeon-compose__field-actions {
 display: inline-flex;
 align-items: center;
 gap: 10px;
 margin-left: auto;
}

.pigeon-compose__toggle {
 border: none;
 background: transparent;
 color: var(--ink-muted);
 font-size: 0.78rem;
 font-weight: 600;
 padding: 2px 0;
 cursor: pointer;
}

.pigeon-compose__toggle:hover,
.pigeon-compose__toggle:focus-visible {
 color: var(--ink-strong);
 outline: none;
}

.pigeon-compose__toggle[aria-expanded="true"] {
 color: var(--ink-strong);
}

.pigeon-compose__field.is-hidden {
 display: none;
}

.pigeon-compose__editor {
 flex: 1;
 display: block;
 min-height: 240px;
}

.pigeon-compose__attachments {
 display: flex;
 flex-wrap: wrap;
 gap: 6px;
 padding: 4px 10px 2px;
 border-top: 1px solid rgba(15, 23, 42, 0.06);
 background: #fff;
}

.pigeon-compose__attachments[hidden] {
 display: none;
}

.pigeon-compose__attachment {
 display: inline-flex;
 align-items: center;
 gap: 6px;
 padding: 4px 8px;
 border-radius: 999px;
 background: #f1f3f4;
 color: var(--ink-strong);
 font-size: 0.72rem;
 border: 1px solid rgba(15, 23, 42, 0.1);
}

.pigeon-compose__attachment.is-loading {
 opacity: 0.7;
}

.pigeon-compose__attachment.is-ready {
 border-color: rgba(50, 120, 255, 0.35);
 background: rgba(50, 120, 255, 0.08);
}

.pigeon-compose__attachment.is-ready .pigeon-compose__attachment-name {
 color: #1E5ADC;
}

.pigeon-compose__attachment.is-ready .pigeon-compose__attachment-size {
 color: #1E5ADC;
}

.pigeon-compose__attachment.is-error {
 border-color: rgba(215, 40, 40, 0.35);
 background: rgba(215, 40, 40, 0.08);
}

.pigeon-compose__attachment.is-error .pigeon-compose__attachment-name {
 color: #D72828;
}

.pigeon-compose__attachment.is-error .pigeon-compose__attachment-size {
 color: #D72828;
}

.pigeon-compose__attachment-name {
 max-width: 160px;
 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
}

.pigeon-compose__attachment-size {
 font-size: 0.66rem;
 color: var(--ink-muted);
}

.pigeon-compose__attachment-remove {
 width: 16px;
 height: 16px;
 border: none;
 border-radius: 999px;
 background: transparent;
 color: var(--ink-muted);
 display: inline-flex;
 align-items: center;
 justify-content: center;
 cursor: pointer;
 padding: 0;
}

.pigeon-compose__attachment-remove:hover,
.pigeon-compose__attachment-remove:focus-visible {
 color: var(--ink-strong);
 outline: none;
}

.pigeon-compose__attachment-remove svg {
 width: 10px;
 height: 10px;
 stroke: currentColor;
 stroke-width: 1.6;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
}

.pigeon-compose__textarea {
 display: none;
}

.pigeon-compose__footer {
 display: flex;
 align-items: center;
 gap: 12px;
 padding: 10px 14px 12px;
 border-top: 1px solid rgba(15, 23, 42, 0.08);
 background: #fff;
 flex-wrap: wrap;
}

.pigeon-compose__send {
 display: inline-flex;
 align-items: center;
 gap: 6px;
 padding: 6px 10px;
 border-radius: 8px;
 border: 1px solid var(--stroke);
 background: transparent;
 color: var(--ink-strong);
 font-weight: 600;
 cursor: pointer;
 position: relative;
}

.pigeon-compose__send svg {
 width: 14px;
 height: 14px;
 stroke: currentColor;
 stroke-width: 1.6;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
}

.pigeon-compose__send:hover,
.pigeon-compose__send:focus-visible {
 background: rgba(15, 23, 42, 0.06);
 border-color: rgba(15, 23, 42, 0.2);
 outline: none;
}

.pigeon-compose__send:disabled {
 color: #9aa3af;
 border-color: rgba(15, 23, 42, 0.12);
 background: transparent;
 cursor: not-allowed;
}

.pigeon-compose__send:disabled svg {
 stroke: #9aa3af;
}

.pigeon-compose__send-as {
 display: flex;
 align-items: center;
 gap: 8px;
}

.pigeon-compose__send-label {
 font-size: 0.75rem;
 font-weight: 600;
 color: var(--ink-muted);
 white-space: nowrap;
}

.pigeon-compose__select {
 min-width: 78px;
 max-width: 120px;
 width: auto;
 padding: 2px 18px 2px 8px;
 border-radius: 999px;
 border: 1px solid rgba(15, 23, 42, 0.16);
 background-color: #f1f3f4;
 font-size: 0.72rem;
 line-height: 1.2;
 color: var(--ink-strong);
 appearance: none;
 -webkit-appearance: none;
 -moz-appearance: none;
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
 background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%236b7280' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 8 10 12 14 8'/></svg>");
 background-repeat: no-repeat;
 background-position: right 6px center;
 background-size: 12px 12px;
}

.pigeon-compose__select:focus {
 outline: none;
 border-color: rgba(50, 120, 255, 0.6);
 box-shadow: 0 0 0 2px rgba(50, 120, 255, 0.18);
}

.pigeon-compose__select.is-error {
 border-color: #D72828;
 box-shadow: 0 0 0 3px rgba(215, 40, 40, 0.18);
}

.pigeon-compose__select--hidden {
 display: none;
}


.pigeon-compose__footer .btn[disabled] {
 opacity: 0.6;
 cursor: not-allowed;
}

.pigeon-compose__hint {
 font-size: 0.8rem;
 color: var(--ink-muted);
}

.pigeon-compose__hint:empty {
 display: none;
}

.pigeon-compose__footer-actions {
 display: inline-flex;
 align-items: center;
 gap: 6px;
 margin-left: auto;
}

.pigeon-compose__icon {
 width: 26px;
 height: 26px;
 border-radius: 999px;
 border: 1px solid transparent;
 background: transparent;
 color: var(--ink-muted);
 display: inline-flex;
 align-items: center;
 justify-content: center;
 cursor: pointer;
 position: relative;
 padding: 0;
}

.pigeon-compose__icon svg {
 width: 16px;
 height: 16px;
 stroke: currentColor;
 stroke-width: 1.5;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
}

.pigeon-compose__icon:hover,
.pigeon-compose__icon:focus-visible {
 color: var(--ink-strong);
 background: rgba(15, 23, 42, 0.08);
 outline: none;
}

.pigeon-compose__icon--format {
 color: var(--ink-strong);
}

.pigeon-compose__icon--format[aria-pressed="false"] {
 color: var(--ink-muted);
}

.pigeon-compose__format-icon {
 display: inline-flex;
 align-items: flex-end;
 gap: 2px;
 font-weight: 700;
 line-height: 1;
 font-family: var(--font-sans);
}

.pigeon-compose__format-icon--lg {
 font-size: 0.8rem;
}

.pigeon-compose__format-icon--sm {
 font-size: 0.6rem;
 opacity: 0.8;
 transform: translateY(1px);
}

.pigeon-compose__footer [data-tooltip]::after {
 content: attr(data-tooltip);
 position: absolute;
 left: 50%;
 bottom: calc(100% + 8px);
 transform: translate(-50%, -6px);
 background: #0B1222;
 color: #FFFFFF;
 font-size: 0.7rem;
 font-weight: 500;
 line-height: 1.3;
 padding: 6px 8px;
 border-radius: 8px;
 white-space: nowrap;
 opacity: 0;
 visibility: hidden;
 pointer-events: none;
 box-shadow: 0 10px 24px rgba(15, 23, 42, 0.2);
 z-index: 4;
}

.pigeon-compose__footer [data-tooltip]::before {
 content: none;
}

.pigeon-compose__footer [data-tooltip]:hover::after,
 .pigeon-compose__footer [data-tooltip]:focus-visible::after {
 opacity: 1;
 visibility: visible;
 transform: translate(-50%, 0);
}

.pigeon-compose__emoji-panel {
 position: fixed;
 background: #fff;
 border: 1px solid rgba(15, 23, 42, 0.12);
 border-radius: 12px;
 padding: 8px;
 box-shadow: 0 12px 30px rgba(15, 23, 42, 0.18);
 display: grid;
 grid-template-columns: repeat(8, 1fr);
 gap: 6px;
 z-index: 50;
}

.pigeon-compose__emoji-panel[hidden] {
 display: none;
}

.pigeon-compose__emoji-btn {
 width: 28px;
 height: 28px;
 border: none;
 border-radius: 8px;
 background: transparent;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 cursor: pointer;
 font-size: 18px;
 line-height: 1;
}

.pigeon-compose__emoji-btn:hover,
.pigeon-compose__emoji-btn:focus-visible {
 background: rgba(15, 23, 42, 0.08);
 outline: none;
}

.pigeon-compose__discard {
 width: 26px;
 height: 26px;
 border-radius: 999px;
 border: 1px solid transparent;
 background: transparent;
 color: var(--ink-muted);
 display: inline-flex;
 align-items: center;
 justify-content: center;
 cursor: pointer;
}

.pigeon-compose__discard svg {
 width: 18px;
 height: 18px;
 stroke: currentColor;
 stroke-width: 1.6;
 fill: none;
 stroke-linecap: round;
 stroke-linejoin: round;
}

.pigeon-compose__discard:hover,
.pigeon-compose__discard:focus-visible {
 color: var(--ink-strong);
 background: rgba(15, 23, 42, 0.06);
 outline: none;
}

.pigeon-compose__hint.is-error {
 color: #D72828;
}

.pigeon-compose__hint.is-success {
 color: #16A34A;
}

.pigeon-compose--minimized {
 height: 48px;
 width: min(280px, calc(100vw - 48px));
}

.pigeon-compose--expanded {
 width: min(900px, calc(100vw - 48px));
 height: min(800px, calc(100vh - 48px));
}

.pigeon-compose--minimized .pigeon-compose__body,
.pigeon-compose--minimized .pigeon-compose__footer {
 display: none;
}

.pigeon-compose--minimized .pigeon-compose__header {
 border-bottom: none;
 cursor: pointer;
}

.pigeon-compose--minimized .pigeon-compose__action[data-pigeon-compose-minimize] {
 display: none;
}

.pigeon-compose--closed {
 display: none;
}

.mail-tab-modal__panel--medium {
 width: min(540px, 94vw);
}

.mail-email-modal__panel {
 padding: 16px 20px 14px;
 gap: 10px;
}

.mail-email-modal__header {
 padding-bottom: 8px;
 border-bottom: 1px solid rgba(15, 23, 42, 0.12);
}

.mail-email-modal__hint {
 margin: 0;
}

.mail-email-modal__form {
 display: grid;
 gap: 12px;
}

.mail-email-modal__field {
 display: grid;
 gap: 6px;
}

.mail-email-modal__form label {
 display: grid;
 gap: 6px;
 font-size: 0.75rem;
 letter-spacing: 0.08em;
 text-transform: uppercase;
 color: rgba(15, 23, 42, 0.62);
 font-weight: 600;
}

.mail-email-modal__form input,
.mail-email-modal__form select,
.mail-email-modal__form textarea {
 border: none;
 border-bottom: 1px solid rgba(15, 23, 42, 0.2);
 border-radius: 0;
 padding: 6px 0;
 background: transparent;
 box-shadow: none;
}

.mail-email-modal__form input:focus,
.mail-email-modal__form select:focus,
.mail-email-modal__form textarea:focus,
.mail-email-modal__form input:focus-visible,
.mail-email-modal__form select:focus-visible,
.mail-email-modal__form textarea:focus-visible {
 outline: none;
 border-bottom-color: #3278FF;
 box-shadow: none;
}

.mail-email-modal__input-group {
 width: 100%;
 min-width: 0;
}

.mail-email-modal__input-group input {
 flex: 1 1 180px;
 min-width: 96px;
 border: none;
 border-bottom: none;
 padding-left: 0;
}

.mail-email-modal__input-group .mail-input-suffix--select {
 border: none;
 border-radius: 0;
 background-color: transparent;
 box-shadow: none;
 padding: 6px 20px 6px 8px;
}

.mail-email-modal__form .mail-form__hint {
 margin: 0;
 font-size: 0.74rem;
 color: var(--ink-muted);
}

.mail-email-modal__status {
 min-height: 18px;
 margin: 0;
}

.mail-email-modal__actions {
 align-items: center;
 justify-content: space-between;
 gap: 16px;
 margin-top: 2px;
 padding-top: 10px;
 border-top: 1px solid rgba(15, 23, 42, 0.12);
}

.mail-email-modal__actions .btn + .btn {
 padding-left: 0 !important;
}

.mail-email-modal__actions .btn + .btn::before {
 display: none;
}

@media (max-height: 700px) {
 .pigeon-compose {
  min-height: 0;
 }
}

@media (max-width: 640px) {
 .mail-email-modal__panel {
  width: min(540px, 96vw);
  padding: 14px 16px 12px;
 }

 .mail-email-modal__actions {
  gap: 12px;
 }

 .pigeon-compose {
  right: 12px;
  left: 12px;
  bottom: 12px;
  width: auto;
  height: calc(100vh - 140px);
  min-height: 0;
 }

 .pigeon-compose--minimized {
  width: auto;
 }
}

@media (max-width: 720px) {
 .mail-list__actions .btn.mail-compose {
   padding: 6px 8px;
 }

 .mail-list__actions .mail-compose__label {
   display: none;
 }

 .mail-tabs {
   flex-wrap: nowrap;
 }

 .mail-settings__layout {
   grid-template-columns: 1fr;
   grid-template-rows: auto auto;
   row-gap: 0.8rem;
 }

 .pigeon-settings-header__panel,
 .pigeon-settings-header__panel--flyout {
   max-width: min(84vw, 260px);
 }

 .pigeon-settings-header__panel--flyout {
   left: calc(100% + 6px);
 }

 .mail-settings__sections {
   grid-column: 1;
   grid-row: 1;
   gap: 0.42rem;
   border-right: 0;
   border-bottom: 1px solid var(--stroke);
   padding: 0 0 0.6rem;
 }

 .mail-settings__panels {
   grid-column: 1;
   grid-row: 2;
 }

 .mail-settings__nav-item {
   width: 100%;
   padding: 7px 9px;
 }

 .mail-settings__nav-item--depth-1 {
   margin-left: 0.55rem;
 }

 .mail-settings__nav-item--depth-2 {
   margin-left: 1.1rem;
 }

 .mail-settings__nav-item--depth-3 {
   margin-left: 1.65rem;
 }

 .mail-settings__nav-item--depth-0 {
   margin-left: 0;
 }

 .mail-settings__section {
   gap: 14px;
 }

 .mail-settings__section--menu-grid {
   grid-template-columns: 1fr;
   row-gap: 0.55rem;
 }

 .mail-settings__section--menu-grid-3,
 .mail-settings__section--menu-grid-2,
 .mail-settings__section--menu-grid-3-detail,
 .mail-settings__section--menu-grid-4,
 .mail-settings__section--menu-grid-4-menus,
 .mail-settings__section--menu-grid-5 {
   grid-template-columns: 1fr;
 }

 .mail-settings__menu--nested {
   border-left: 0;
   padding-left: 0;
 }

 .mail-settings__subsection--column {
   border-left: 0;
   padding-left: 0;
 }

 .mail-settings__alias-add-row {
   justify-content: flex-start;
 }

 .mail-settings__signature-add-row {
   justify-content: flex-start;
 }

 .mail-settings__section h2 {
   font-size: 1.05rem;
 }

 .mail-settings__field {
   gap: 0.7rem;
 }

 .mail-settings__identity-grid {
   grid-template-columns: 1fr;
 }

 .mail-settings__field-header,
 .mail-settings__alias-detail-head,
 .mail-settings__alias-toolbar,
 .mail-settings__section-actions {
  align-items: flex-start;
  justify-content: flex-start;
 }

 .mail-settings__section-heading--split {
   grid-template-columns: 1fr;
 }

 .mail-settings__section-button {
   width: 100%;
 }

 .mail-settings__settings-row {
   grid-template-columns: minmax(0, 1fr) auto;
   grid-template-areas:
     "label action"
     "value action";
   align-items: start;
 }

 .mail-settings__settings-label {
   grid-area: label;
 }

 .mail-settings__settings-value {
   grid-area: value;
 }

 .mail-settings__icon-action {
   grid-area: action;
   margin-top: 0.1rem;
 }

 .mail-settings__field input,
 .mail-settings__field select,
 .mail-settings__field textarea {
   width: 100%;
 }

 .mail-settings__shared-members {
   gap: 0.6rem;
 }

 .mail-settings__shared-members-list {
   gap: 0.45rem;
 }

 .mail-settings__shared-members-search {
   margin-top: 0.2rem;
   line-height: 1.2;
 }

 .mail-settings__shared-member-row {
   grid-template-columns: 1fr;
   align-items: stretch;
   padding: 0.55rem 0.65rem;
 }

 .mail-settings__shared-member-row select {
   min-width: 0;
   width: 100%;
   margin-top: 0.15rem;
 }

 .mail-settings__shared-member-row[hidden] {
   display: none;
 }

 .mail-settings__shared-member-name {
   font-size: 0.9rem;
 }

 .mail-settings__divider {
   margin: 0;
 }

 .mail-settings__sections[hidden] {
   display: none !important;
 }

 .mail-tab-settings__overview-row {
   grid-template-columns: 1fr;
   gap: 0.35rem;
 }

 .mail-header {
   flex-direction: column;
   align-items: flex-start;
 }

 .mail-grid {
   grid-template-columns: 1fr;
 }

 .mail-settings__field {
   grid-template-columns: 1fr;
   align-items: flex-start;
 }

 .mail-settings__control {
   justify-content: flex-start;
 }

 .mail-settings__control--domains select {
   min-width: 0;
   width: auto;
   max-width: 100%;
 }
}
