:root {
    --font-size: 14px;
    --font-family: -apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Helvetica Neue","Apple Color Emoji",sans-serif;
    --top-bar-height: 48px;
    --traffic-light-width: 66px;
    --border-radius: 6px;
    --border-radius-small: 4px;
    --border-radius-large: 12px;
    --padding: 10px;
    --padding-medium: 14px;
    --padding-large: 20px;
    --padding-xlarge: 30px;
    --padding-small: 5px;
    --padding-xsmall: 2px;
    --safe-area-inset-top: 0px;
    --safe-area-inset-right: 0px;
    --safe-area-inset-bottom: 0px;
    --safe-area-inset-left: 0px;
    --missive-font-size: 14px;
    --missive-border-radius: 6px;
    --missive-text-color-a: #34363a;
    --missive-text-color-b: #525457;
    --missive-text-color-c: #7b7c7f;
    --missive-text-color-d: #999a9c;
    --missive-text-color-e: #cccdce;
    --missive-blue-color: rgb(34,102,237);
    --missive-light-blue-color: #e3f0fe;
    --missive-orange-color: #ff8400;
    --missive-light-orange-color: #fdf2e7;
    --missive-green-color: #00b351;
    --missive-red-color: rgb(242,49,49);
    --missive-yellow-color: #fdd157;
    --missive-border-color: #dcdcdc;
    --missive-light-border-color: #e5e6e7;
    --missive-token-background-color: #e6e7e8;
    --missive-conversation-list-border-color: #dcdcdc;
    --missive-conversation-list-background-color: rgb(255,255,255);
    --missive-conversations-separator-opacity: 0.08;
    --missive-background-color: rgb(245,246,247);
    --missive-light-active-color: #fafafa;
    --missive-section-shadow-width: 2px;
    --missive-section-shadow-color: rgba(0,0,0,0.05);
}

@supports(top: env(safe-area-inset-top)) {
    :root {
        --safe-area-inset-top:env(safe-area-inset-top);
        --safe-area-inset-right: env(safe-area-inset-right);
        --safe-area-inset-bottom: env(safe-area-inset-bottom);
        --safe-area-inset-left: env(safe-area-inset-left)
    }
}

@supports(top: constant(safe-area-inset-top)) {
    :root {
        --safe-area-inset-top:constant(safe-area-inset-top);
        --safe-area-inset-right: constant(safe-area-inset-right);
        --safe-area-inset-bottom: constant(safe-area-inset-bottom);
        --safe-area-inset-left: constant(safe-area-inset-left)
    }
}

[data-size=x-small] {
    --font-size: 12px
}

[data-size=small] {
    --font-size: 13px
}

[data-size=default] {
    --font-size: 14px
}

[data-size=large] {
    --font-size: 15px
}

[data-size=x-large] {
    --font-size: 16px
}

[data-size="2x-large"] {
    --font-size: 17px
}

:root,[data-theme] [data-theme=light] {
    --text-color-a-rgb: 52,54,58;
    --text-color-a: #34363a;
    --text-color-b: #525457;
    --text-color-c: #7b7c7f;
    --text-color-d: #999a9c;
    --text-color-e: #cccdce;
    --blue-color-rgb: 34,102,237;
    --blue-color: rgb(var(--blue-color-rgb));
    --green-color: #00b351;
    --medium-blue-color: #97b3e9;
    --light-blue-color: #e3f0fe;
    --light-orange-color: #fdf2e7;
    --orange-color: #ff8400;
    --red-color-rgb: 242,49,49;
    --red-link-color-rgb: 163,41,41;
    --red-color: rgb(var(--red-color-rgb));
    --red-link-color: rgb(var(--red-link-color-rgb));
    --yellow-color: #fdd157;
    --light-yellow-color: #fdf2d9;
    --starred-yellow-color: #fb0;
    --comment-background-color: #dfe1e2;
    --comment-background-color-quote-rgb: 236,237,238;
    --comment-background-color-quote: rgb(var(--comment-background-color-quote-rgb));
    --comment-mentions-background-color: var(--blue-color);
    --comment-mentions-background-color-quote: #104fcb;
    --comment-user-background-color: #d2e5f9;
    --comment-user-background-color-quote: #e4effb;
    --reaction-background-color: #fff;
    --reaction-selected-color: var(--blue-color);
    --reaction-selected-background-color: #f6fafe;
    --changelog-new-color: #13cf93;
    --changelog-improved-color: #50a8ff;
    --changelog-fixed-color: #ffa667;
    --checkbox-color: #7b7c7d;
    --checkbox-hover-color: #0057b6;
    --checkbox-checked-color: #0574ff;
    --filter-color: #00813b;
    --filter-background-color: #edf7ee;
    --filter-border-color: #00803914;
    --filter-dark-background-color: #00813a1b;
    --border-color: #dcdcdc;
    --conversations-separator-opacity: .08;
    --heading-color: #222427;
    --light-border-color: #e5e6e7;
    --shadow-color: rgba(0,0,0,.2);
    --section-shadow-width: 2px;
    --section-shadow-color: rgba(0,0,0,.05);
    --token-background-color: #e6e7e8;
    --tooltip-background-color: #f7f7f7;
    --tooltip-header-background-color: var(--tooltip-background-color);
    --tooltip-content-background-color: var(--conversation-list-background-color);
    --tooltip-hint-background-color: var(--dark-background-color);
    --tooltip-hint-size: 3px;
    --veil-opacity: .2;
    --messenger-color: #0084ff;
    --twilio-color: #00cc46;
    --custom-text-color: #00cc46;
    --twilio-chat-color: #2866d1;
    --twitter-color: #1da1f2;
    --generic-message-color: #f0f0f0;
    --whatsapp-color: #dcf8c6;
    --background-color-rgb: 245,246,247;
    --background-color: rgb(var(--background-color-rgb));
    --conversation-selected-color: var(--blue-color);
    --conversation-list-border-color: var(--border-color);
    --conversation-list-background-color-rgb: 255,255,255;
    --conversation-list-background-color: rgb(var(--conversation-list-background-color-rgb));
    --dark-background-color: #444;
    --date-checkpoint-background: linear-gradient(180deg,#fff,#fbfbfb);
    --input-background-color: #fff;
    --light-active-color: #fafafa;
    --light-background-color: #fafafa;
    --popup-background-color-rgb: 255,255,255;
    --popup-background-color: rgb(var(--popup-background-color-rgb));
    --sidebar-icons-color: var(--text-color-c);
    --sidebar-toggle-color: var(--text-color-c);
    --sidebar-toggle-hover-color: var(--text-color-b);
    --toolbar-background-color: #fff;
    --top-bar-background-color: #fff;
    --scrollbar-thumb-color: #c6c7c8;
    --scrollbar-thumb-hover-color: #a2a3a4;
    --scrollbar-light-thumb-color: #fcfeff;
    --scrollbar-track-color: #e8e9ea;
    --osx-button-active-background-color: #f4f4f4;
    --osx-button-active-color: var(--text-color-a);
    --osx-button-background-color: #fdfdfd;
    --osx-button-background: linear-gradient(180deg,#fefefe,#fdfdfd);
    --osx-button-color: var(--text-color-b);
    --button-black-background-color: #2f3946;
    --button-black-hover-background-color: #374252;
    --duration: 125ms;
    --easing: ease-out;
    --material-duration: 225ms;
    --material-easing: cubic-bezier(.4,.0,.2,1);
    --shortcut-custom-color: #00a83b;
    --shortcut-custom-modifier-color: #00cc46;
    --shortcut-custom-modifier-border-color: #00b83f
}

:root .option.focus .open_ai-integration-icon,:root .preferences-selectable-item[data-state=selected] .open_ai-integration-icon,[data-theme] [data-theme=light] .option.focus .open_ai-integration-icon,[data-theme] [data-theme=light] .preferences-selectable-item[data-state=selected] .open_ai-integration-icon {
    filter: invert(1)
}

.missive-view-account[data-theme=light] .sidebar-sections .list-item[data-state~=selected] {
    --token-background-color: #ededee;
    --light-blue-color: #e6f2fe
}

[data-theme=dark],[data-theme] [data-theme=dark] {
    --text-color-a-rgb: 222,222,221;
    --text-color-a: #dededd;
    --text-color-b: #c4c4c3;
    --text-color-c: #a0a1a0;
    --text-color-d: #868685;
    --text-color-e: #595a59;
    --blue-color-rgb: 58,130,247;
    --red-link-color-rgb: 249,134,134;
    --heading-color: #fff;
    --medium-blue-color: #415d8b;
    --light-blue-color: #263240;
    --light-yellow-color: #544c37;
    --light-orange-color: #443424;
    --generic-message-color: var(--border-color);
    --background-color-rgb: 29,30,31;
    --background-color: rgb(var(--background-color-rgb));
    --dark-background-color: #18191a;
    --input-background-color: var(--dark-background-color);
    --light-active-color: var(--light-background-color);
    --light-background-color: #232425;
    --popup-background-color-rgb: var(--background-color-rgb);
    --popup-background-color: rgb(var(--popup-background-color-rgb));
    --sidebar-icons-color: var(--text-color-d);
    --sidebar-toggle-color: var(--text-color-d);
    --sidebar-toggle-hover-color: var(--text-color-c);
    --token-background-color: var(--conversation-list-background-color);
    --toolbar-background-color: var(--conversation-list-background-color);
    --tooltip-background-color: #272828;
    --tooltip-header-background-color: var(--background-color);
    --tooltip-content-background-color: var(--tooltip-background-color);
    --tooltip-hint-background-color: #333;
    --tooltip-hint-size: 3px;
    --scrollbar-thumb-color: #5f605f;
    --scrollbar-thumb-hover-color: #7d7e7d;
    --scrollbar-light-thumb-color: #b4b8b4;
    --scrollbar-track-color: #383938;
    --comment-background-color: var(--light-border-color);
    --comment-background-color-quote-rgb: 59,58,57;
    --comment-mentions-background-color: #3e588f;
    --comment-mentions-background-color-quote: #364c79;
    --comment-user-background-color: var(--light-blue-color);
    --comment-user-background-color-quote: #343a41;
    --reaction-background-color: #363635;
    --reaction-selected-color: #fff;
    --reaction-selected-background-color: #364c79;
    --checkbox-color: #303132;
    --checkbox-hover-color: #000;
    --checkbox-checked-color: #0574ff;
    --filter-color: #00b351;
    --filter-background-color: #1b261e;
    --border-color: #484848;
    --conversations-separator-opacity: .2;
    --light-border-color: #2d2d2d;
    --section-shadow-width: 1px;
    --section-shadow-color: rgba(0,0,0,.45);
    --veil-opacity: .7;
    --conversation-selected-color: #27549c;
    --conversation-list-border-color: #000;
    --conversation-list-background-color-rgb: 21,22,23;
    --conversation-list-background-color: rgb(var(--conversation-list-background-color-rgb));
    --date-checkpoint-background: var(--dark-background-color);
    --top-bar-background-color: #151617;
    --osx-button-active-background-color: #c7c6c5;
    --osx-button-active-color: #3c3b3a;
    --osx-button-background-color: #686766;
    --osx-button-background: none;
    --osx-button-color: var(--text-color-a);
    --button-black-background-color: #555453;
    --button-black-hover-background-color: #61605f
}

[data-theme=dark] ::-moz-selection,[data-theme] [data-theme=dark] ::-moz-selection {
    background: rgba(var(--text-color-a-rgb),.2)
}

[data-theme=dark] ::selection,[data-theme] [data-theme=dark] ::selection {
    background: rgba(var(--text-color-a-rgb),.2)
}

[data-theme=dark] .missive-view-inbox .token-input .token,[data-theme] [data-theme=dark] .missive-view-inbox .token-input .token {
    background-color: var(--light-border-color)
}

[data-theme=dark] .missive-white-box,[data-theme] [data-theme=dark] .missive-white-box {
    box-shadow: none
}

[data-theme=dark] .mobile-keyboard-anchor-bottom .tooltip,[data-theme] [data-theme=dark] .mobile-keyboard-anchor-bottom .tooltip {
    background-color: var(--top-bar-background-color)!important
}

[data-theme=dark] .unseen-count,[data-theme] [data-theme=dark] .unseen-count {
    --blue-color: #7faef9
}

[data-theme=dark] .preferences-container.detached-border-left:after,[data-theme=dark] .preferences-content.detached-border-left:after,[data-theme] [data-theme=dark] .preferences-container.detached-border-left:after,[data-theme] [data-theme=dark] .preferences-content.detached-border-left:after {
    bottom: 0;
    top: 0
}

[data-theme=dark] .conversation-header.detached-border-bottom:after,[data-theme] [data-theme=dark] .conversation-header.detached-border-bottom:after {
    left: 0;
    right: 0
}

[data-theme=dark] .sudo-popup,[data-theme] [data-theme=dark] .sudo-popup {
    background-color: var(--popup-background-color)!important;
    border: 1px solid var(--light-border-color)!important;
    border-radius: 6px!important;
    box-shadow: 0 0 20px 20px rgba(0,0,0,.2)!important;
    padding: 2em!important
}

[data-theme=dark] .conversation-entry[data-theme=light][data-state~=selected],[data-theme] [data-theme=dark] .conversation-entry[data-theme=light][data-state~=selected] {
    box-shadow: 0 0 0 3px var(--blue-color)
}

[data-theme=dark] [data-light-quote] .ProseMirror>.missive_quote,[data-theme] [data-theme=dark] [data-light-quote] .ProseMirror>.missive_quote {
    color: #111;
    filter: invert(1) hue-rotate(180deg)
}

[data-theme=dark] [data-light-quote] .ProseMirror>.missive_quote img,[data-theme=dark] [data-light-quote] .ProseMirror>.missive_quote missive-emoji,[data-theme] [data-theme=dark] [data-light-quote] .ProseMirror>.missive_quote img,[data-theme] [data-theme=dark] [data-light-quote] .ProseMirror>.missive_quote missive-emoji {
    filter: invert(1) hue-rotate(180deg)
}

[data-theme=dark] [data-light-quote] .ProseMirror>.missive_quote blockquote,[data-theme] [data-theme=dark] [data-light-quote] .ProseMirror>.missive_quote blockquote {
    border-color: #111
}

[data-theme=dark] [data-light-quote] .ProseMirror>.missive_quote ::-moz-selection,[data-theme] [data-theme=dark] [data-light-quote] .ProseMirror>.missive_quote ::-moz-selection {
    background: #c1c1c1
}

[data-theme=dark] [data-light-quote] .ProseMirror>.missive_quote ::selection,[data-theme] [data-theme=dark] [data-light-quote] .ProseMirror>.missive_quote ::selection {
    background: #c1c1c1
}

[data-theme=dark] .compose-bar .sticky-compose-bar-border,[data-theme] [data-theme=dark] .compose-bar .sticky-compose-bar-border {
    background-color: #1d1e1f
}

[data-theme=dark] .compose-bar .sticky-compose-bar-border:before,[data-theme] [data-theme=dark] .compose-bar .sticky-compose-bar-border:before {
    box-shadow: none
}

[data-theme=dark] .command-bar-configuration .button-macos-group,[data-theme=dark] .command-bar-configuration .preferences-shortcuts-token,[data-theme=dark] .command-bar .button-macos-group,[data-theme=dark] .command-bar .preferences-shortcuts-token,[data-theme] [data-theme=dark] .command-bar-configuration .button-macos-group,[data-theme] [data-theme=dark] .command-bar-configuration .preferences-shortcuts-token,[data-theme] [data-theme=dark] .command-bar .button-macos-group,[data-theme] [data-theme=dark] .command-bar .preferences-shortcuts-token {
    background-color: var(--top-bar-background-color)!important
}

[data-theme=dark] .command-bar-configuration tr,[data-theme=dark] .command-bar tr,[data-theme] [data-theme=dark] .command-bar-configuration tr,[data-theme] [data-theme=dark] .command-bar tr {
    border-color: var(--dark-background-color)!important
}

[data-theme=dark] .command-bar-configuration th:before,[data-theme=dark] .command-bar th:before,[data-theme] [data-theme=dark] .command-bar-configuration th:before,[data-theme] [data-theme=dark] .command-bar th:before {
    background-color: var(--dark-background-color)!important
}

[data-theme=dark] .open_ai-integration-icon,[data-theme] [data-theme=dark] .open_ai-integration-icon {
    filter: invert(1)
}

[data-theme=inverted] {
    filter: invert(1) hue-rotate(180deg)
}

[data-theme] [data-theme=light] ::-moz-selection {
    background: #bbd6fb
}

[data-theme] [data-theme=light] ::selection {
    background: #bbd6fb
}

.detached-border-bottom:after,.detached-border-top:after {
    --left-right: .5em
}

[data-theme^=dark] .detached-border-bottom:after,[data-theme^=dark] .detached-border-top:after {
    --left-right: 0
}

[data-wrapper=electron][data-os=osx] .missive-popup-mobile .command-bar,[data-wrapper=electron][data-os=osx] .missive-popup-mobile .missive-popup-calendar {
    --safe-area-inset-top: calc(var(--top-bar-height) - var(--padding))
}

@-webkit-keyframes pulse {
    0% {
        fill: var(--text-color-d)
    }

    50% {
        fill: var(--blue-color);
        transform: scale(1.1)
    }

    to {
        fill: var(--text-color-d)
    }
}

@keyframes pulse {
    0% {
        fill: var(--text-color-d)
    }

    50% {
        fill: var(--blue-color);
        transform: scale(1.1)
    }

    to {
        fill: var(--text-color-d)
    }
}

@-webkit-keyframes slideRight {
    0% {
        transform: translateX(-100%)
    }

    to {
        transform: translateX(100%)
    }
}

@keyframes slideRight {
    0% {
        transform: translateX(-100%)
    }

    to {
        transform: translateX(100%)
    }
}

@-webkit-keyframes slideUp {
    0% {
        transform: translateY(100%)
    }

    to {
        transform: translateY(0)
    }
}

@keyframes slideUp {
    0% {
        transform: translateY(100%)
    }

    to {
        transform: translateY(0)
    }
}

@-webkit-keyframes slideAwayDown {
    0% {
        transform: translateY(0)
    }

    to {
        transform: translateY(100%)
    }
}

@keyframes slideAwayDown {
    0% {
        transform: translateY(0)
    }

    to {
        transform: translateY(100%)
    }
}

@-webkit-keyframes slideDown {
    0% {
        transform: translateY(-100%)
    }

    to {
        transform: translateY(0)
    }
}

@keyframes slideDown {
    0% {
        transform: translateY(-100%)
    }

    to {
        transform: translateY(0)
    }
}

@-webkit-keyframes spin {
    0% {
        transform: rotate(0deg)
    }

    to {
        transform: rotate(1turn)
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg)
    }

    to {
        transform: rotate(1turn)
    }
}

@-webkit-keyframes rotate-in {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(auto)
    }
}

@keyframes rotate-in {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(auto)
    }
}

@-webkit-keyframes fade-in {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes fade-in {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@-webkit-keyframes scale-in {
    0% {
        opacity: 0;
        transform: scale(.9)
    }

    to {
        opacity: 1;
        transform: scale(auto)
    }
}

@keyframes scale-in {
    0% {
        opacity: 0;
        transform: scale(.9)
    }

    to {
        opacity: 1;
        transform: scale(auto)
    }
}

@-webkit-keyframes scale-big-in {
    0% {
        opacity: 0;
        transform: scale(.3)
    }

    75% {
        transform: scale(1.05)
    }

    to {
        opacity: 1;
        transform: scale(auto)
    }
}

@keyframes scale-big-in {
    0% {
        opacity: 0;
        transform: scale(.3)
    }

    75% {
        transform: scale(1.05)
    }

    to {
        opacity: 1;
        transform: scale(auto)
    }
}

@-webkit-keyframes progress-complete {
    0% {
        box-shadow: 0 0 0 0 rgba(var(--blue-color-rgb),.1),0 0 0 0 rgba(var(--blue-color-rgb),.2)
    }

    to {
        box-shadow: 0 0 0 6px rgba(var(--blue-color-rgb),.1),0 0 0 3px rgba(var(--blue-color-rgb),.2)
    }
}

@keyframes progress-complete {
    0% {
        box-shadow: 0 0 0 0 rgba(var(--blue-color-rgb),.1),0 0 0 0 rgba(var(--blue-color-rgb),.2)
    }

    to {
        box-shadow: 0 0 0 6px rgba(var(--blue-color-rgb),.1),0 0 0 3px rgba(var(--blue-color-rgb),.2)
    }
}

@-webkit-keyframes spinner {
    0% {
        transform: rotate(0deg)
    }

    50% {
        stroke-dasharray: 58
    }

    to {
        transform: rotate(1turn)
    }
}

@keyframes spinner {
    0% {
        transform: rotate(0deg)
    }

    50% {
        stroke-dasharray: 58
    }

    to {
        transform: rotate(1turn)
    }
}

@-webkit-keyframes draw-icon {
    0% {
        stroke-dashoffset: -50px;
        stroke: var(--text-color-c);
        opacity: 0
    }

    75% {
        opacity: 1
    }

    90% {
        stroke: var(--text-color-c)
    }

    to {
        stroke-dashoffset: 0
    }
}

@keyframes draw-icon {
    0% {
        stroke-dashoffset: -50px;
        stroke: var(--text-color-c);
        opacity: 0
    }

    75% {
        opacity: 1
    }

    90% {
        stroke: var(--text-color-c)
    }

    to {
        stroke-dashoffset: 0
    }
}

@-webkit-keyframes pop {
    0% {
        transform: scale(1)
    }

    33% {
        transform: scale(1.1)
    }

    66% {
        transform: scale(.925)
    }

    to {
        transform: scale(1)
    }
}

@keyframes pop {
    0% {
        transform: scale(1)
    }

    33% {
        transform: scale(1.1)
    }

    66% {
        transform: scale(.925)
    }

    to {
        transform: scale(1)
    }
}

.missive-align-left {
    text-align: left
}

.missive-align-center {
    text-align: center
}

.missive-align-right {
    text-align: right
}

.missive-position-relative {
    position: relative
}

.missive-position-sticky {
    position: sticky;
    top: 0
}

.missive-columns,.missive-columns-vertical {
    display: flex!important
}

.missive-columns,.missive-columns-vertical,.missive-columns-vertical>*,.missive-columns>* {
    flex: 1 1 0px;
    min-height: 0;
    min-width: 0
}

.missive-columns-vertical-auto {
    display: flex!important;
    flex-direction: column
}

.missive-columns-vertical-auto,.missive-columns-vertical-auto>* {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0
}

.missive-columns-vertical {
    flex-direction: column
}

.missive-scroll {
    -webkit-overflow-scrolling: touch;
    overflow: auto!important
}

.missive-scroll-horizontal {
    -webkit-overflow-scrolling: touch;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap
}

.missive-no-overflow {
    overflow: hidden
}

.missive-scroll-shadow-top {
    position: relative
}

.missive-scroll-shadow-top:after {
    background: linear-gradient(to bottom,var(--section-shadow-color),transparent);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.missive-scroll-shadow-bottom {
    position: relative
}

.missive-scroll-shadow-bottom:after {
    background: linear-gradient(to top,var(--section-shadow-color),transparent);
    bottom: 0;
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0
}

.missive-scroll-shadow-bottom,.missive-scroll-shadow-top {
    z-index: 99
}

html.missive-has-scrollbar .missive-scroll-horizontal::-webkit-scrollbar,html.missive-has-scrollbar .missive-scroll::-webkit-scrollbar {
    height: 12px;
    width: 12px
}

html.missive-has-scrollbar .missive-scroll-horizontal::-webkit-scrollbar-track,html.missive-has-scrollbar .missive-scroll::-webkit-scrollbar-track {
    background-color: var(--scrollbar-track-color);
    border: 0
}

html.missive-has-scrollbar .missive-scroll-horizontal::-webkit-scrollbar-button,html.missive-has-scrollbar .missive-scroll::-webkit-scrollbar-button {
    display: none;
    height: 0;
    width: 0
}

html.missive-has-scrollbar .missive-scroll-horizontal::-webkit-scrollbar-corner,html.missive-has-scrollbar .missive-scroll::-webkit-scrollbar-corner {
    background-color: transparent
}

html.missive-has-scrollbar .missive-scroll-horizontal::-webkit-scrollbar-thumb,html.missive-has-scrollbar .missive-scroll::-webkit-scrollbar-thumb {
    background-color: var(--scrollbar-thumb-color);
    border: 2px solid var(--scrollbar-track-color);
    border-radius: 10em
}

html.missive-has-scrollbar .missive-scroll-horizontal::-webkit-scrollbar-thumb:hover,html.missive-has-scrollbar .missive-scroll::-webkit-scrollbar-thumb:hover {
    background-color: var(--scrollbar-thumb-hover-color)
}

.missive-flex-basis-auto {
    flex-basis: auto
}

.missive-grid {
    display: grid;
    grid-template-columns: 1fr 1fr
}

.missive-grid-square-item {
    align-items: center;
    display: flex;
    justify-content: center;
    position: relative;
    width: 100%
}

.missive-grid-square-item:after {
    content: "";
    display: block;
    padding-bottom: 100%
}

.missive-grid-square-item img {
    background-color: var(--light-border-color);
    border-radius: 5px;
    bottom: 0;
    height: 100%;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%
}

.missive-flex,.missive-flex-column,.missive .missive-flex,.missive .missive-flex-column {
    display: flex
}

.missive-flex-column>*,.missive-flex>*,.missive .missive-flex-column>*,.missive .missive-flex>* {
    min-height: 0;
    min-width: 0
}

.missive-flex-column {
    flex-direction: column
}

.missive-flex-grow {
    flex-grow: 1
}

.missive-flex-row-wrap {
    flex-flow: row wrap
}

.missive-column-auto {
    flex-grow: 0
}

.missive-column-auto,.missive-column-no-shrink {
    flex-basis: auto;
    flex-shrink: 0
}

.missive-column-no-grow {
    flex-grow: 0
}

.missive-column-shrink {
    flex-shrink: 1
}

.missive-columns-justify {
    display: flex!important;
    justify-content: space-between
}

.missive-columns-even {
    display: flex!important;
    justify-content: space-evenly
}

.missive-columns-middle {
    align-items: center;
    display: flex!important
}

.missive-columns-top {
    align-items: flex-start;
    display: flex!important
}

.missive-columns-bottom {
    align-items: flex-end;
    display: flex!important
}

.missive-columns-baseline {
    align-items: baseline;
    display: flex!important
}

.missive-columns-stretch {
    align-items: stretch;
    display: flex!important
}

.missive-columns-center {
    display: flex!important;
    justify-content: center
}

.missive-columns-left {
    display: flex!important;
    justify-content: flex-start
}

.missive-columns-right {
    display: flex!important;
    justify-content: flex-end
}

.missive-columns-reverse {
    display: flex!important;
    flex-direction: row-reverse
}

.missive-columns-vertical-reverse {
    display: flex!important;
    flex-direction: column-reverse
}

.missive-columns-wrap {
    display: flex!important;
    flex-wrap: wrap
}

.missive-columns-wrap-reverse {
    display: flex!important;
    flex-wrap: wrap-reverse
}

.missive-inline-columns-middle>* {
    display: inline-block;
    vertical-align: middle
}

.missive-inline-columns-baseline>* {
    display: inline-block;
    vertical-align: baseline
}

.missive-inline-columns-top>* {
    display: inline-block;
    vertical-align: top
}

* .padding-block,.missive .padding-block {
    display: block;
    padding: 1em
}

* .padding-block-xsmall,.missive .padding-block-xsmall {
    display: block;
    padding: 4px 5px
}

* .padding-block-small,.missive .padding-block-small {
    display: block;
    padding: 8px 10px
}

* .padding-block-medium,.missive .padding-block-medium {
    padding: 14px 7px
}

* .padding-block-big,.missive .padding-block-big {
    display: block;
    padding: 24px
}

* .padding-block-horizontal,.missive .padding-block-horizontal {
    padding-bottom: 0;
    padding-top: 0
}

* .padding-bar,.missive .padding-bar {
    height: var(--top-bar-height);
    padding: 0 7px
}

* .padding-vertical,.missive .padding-vertical {
    padding: 17px 0
}

* .padding-vertical-small,.missive .padding-vertical-small {
    padding: 7px 0
}

* .padding-top,.missive .padding-top {
    padding-top: 17px
}

* .padding-top-small,.missive .padding-top-small {
    padding-top: 7px
}

* .padding-top-xsmall,.missive .padding-top-xsmall {
    padding-top: 2px
}

* .padding-top-0,.missive .padding-top-0 {
    padding-top: 0
}

* .padding-bottom,.missive .padding-bottom {
    padding-bottom: 14px
}

* .padding-bottom-small,.missive .padding-bottom-small {
    padding-bottom: 7px
}

* .padding-bottom-xsmall,.missive .padding-bottom-xsmall {
    padding-bottom: 2px
}

* .padding-bottom-0,.missive .padding-bottom-0 {
    padding-bottom: 0
}

* .padding-left,.missive .padding-left {
    padding-left: 14px
}

* .padding-left-small,.missive .padding-left-small {
    padding-left: 7px
}

* .padding-left-xsmall,.missive .padding-left-xsmall {
    padding-left: 2px
}

* .padding-left-0,.missive .padding-left-0 {
    padding-left: 0
}

* .padding-right,.missive .padding-right {
    padding-right: 14px
}

* .padding-right-small,.missive .padding-right-small {
    padding-right: 7px
}

* .padding-right-xsmall,.missive .padding-right-xsmall {
    padding-right: 2px
}

* .margin-top,.missive .margin-top {
    margin-top: 14px
}

* .margin-top-small,.missive .margin-top-small {
    margin-top: 7px
}

* .margin-top-xsmall,.missive .margin-top-xsmall {
    margin-top: 2px
}

* .margin-top-big,.missive .margin-top-big {
    margin-top: 24px
}

* .margin-bottom,.missive .margin-bottom {
    margin-bottom: 14px
}

* .margin-bottom-small,.missive .margin-bottom-small {
    margin-bottom: 7px
}

* .margin-bottom-xsmall,.missive .margin-bottom-xsmall {
    margin-bottom: 2px
}

* .margin-bottom-big,.missive .margin-bottom-big {
    margin-bottom: 24px
}

* .margin-right,.missive .margin-right {
    margin-right: 14px
}

* .margin-right-small,.missive .margin-right-small {
    margin-right: 7px
}

* .margin-right-xsmall,.missive .margin-right-xsmall {
    margin-right: 2px
}

* .margin-left,.missive .margin-left {
    margin-left: 14px
}

* .margin-left-small,.missive .margin-left-small {
    margin-left: 7px
}

* .margin-left-xsmall,.missive .margin-left-xsmall {
    margin-left: 2px
}

* .margin-auto,.missive .margin-auto {
    margin: 0 auto
}

.safe-area-inset-top {
    padding-top: var(--safe-area-inset-top)
}

.safe-area-inset-right {
    padding-right: var(--safe-area-inset-right)
}

.safe-area-inset-bottom {
    padding-bottom: var(--safe-area-inset-bottom)
}

.safe-area-inset-left {
    padding-left: var(--safe-area-inset-left)
}

.traffic-light-spacer {
    transition: width var(--material-duration) var(--material-easing);
    width: 0
}

.missive-white-box {
    background-color: var(--conversation-list-background-color);
    border-radius: var(--border-radius);
    box-shadow: 0 0 var(--section-shadow-width) 1px var(--section-shadow-color);
    display: block
}

.missive-white-box .list-item {
    padding: var(--padding)!important
}

.missive-white-box .list-item:first-child {
    border-top-left-radius: var(--border-radius);
    border-top-right-radius: var(--border-radius)
}

.missive-white-box .list-item:last-child {
    border-bottom-left-radius: var(--border-radius);
    border-bottom-right-radius: var(--border-radius)
}

.missive-white-box .list-item+.list-item {
    border-top: 0;
    box-shadow: 0 -1px 0 var(--background-color)
}

.missive-no-touch .missive-white-box .list-item:not([data-disabled]):hover {
    background-color: var(--light-background-color)
}

.missive-white-box .list-item .missive-user-stack-item {
    color: var(--conversation-list-background-color)
}

.missive-white-box-tip:after {
    background-color: var(--conversation-list-background-color);
    border: solid var(--border-color);
    border-bottom-right-radius: 3px;
    border-width: 0 1px 1px 0;
    content: "";
    height: 12px;
    left: 50%;
    margin-top: 1px;
    position: absolute;
    top: 100%;
    transform: translate(-50%,-50%) rotate(45deg);
    width: 12px;
    z-index: -1
}

.background-box {
    background: var(--background-color)
}

.background-box .missive-user-stack-item {
    color: var(--background-color)!important
}

.border-top {
    border-top: 1px solid var(--light-border-color)
}

.border-bottom {
    border-bottom: 1px solid var(--light-border-color)
}

grammarly-button,grammarly-editor-plugin {
    --grammarly-default-font-family: var(--font-family);
    --grammarly-interactive-color: var(--blue-color);
    color-scheme: light dark
}

.grammarly-button-placeholder {
    -webkit-user-drag: none;
    cursor: pointer;
    display: block;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.grammarly-button-placeholder:active {
    transform: scale(.95)
}

.missive {
    /*! normalize.css v2.1.3 | MIT License | git.io/normalize */
}

.missive article,.missive aside,.missive details,.missive figcaption,.missive figure,.missive footer,.missive header,.missive hgroup,.missive main,.missive nav,.missive section,.missive summary {
    display: block
}

.missive audio,.missive canvas,.missive video {
    display: inline-block
}

.missive audio:not([controls]) {
    display: none;
    height: 0
}

.missive [hidden],.missive template {
    display: none
}

.missive html {
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    font-family: sans-serif
}

.missive body {
    margin: 0
}

.missive a:focus {
    outline: thin dotted
}

.missive a:active,.missive a:hover {
    outline: 0
}

.missive h1 {
    font-size: 2em;
    margin: .67em 0
}

.missive abbr[title] {
    border-bottom: 1px dotted
}

.missive b,.missive strong {
    font-weight: 700
}

.missive dfn {
    font-style: italic
}

.missive hr {
    box-sizing: content-box;
    height: 0
}

.missive mark {
    background: #ff0;
    color: #000
}

.missive pre {
    white-space: pre-wrap
}

.missive q {
    quotes: "“" "”" "‘" "’"
}

.missive small {
    font-size: 80%
}

.missive sub,.missive sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

.missive sup {
    top: -.5em
}

.missive sub {
    bottom: -.25em
}

.missive img {
    border: 0;
    max-width: 100%
}

.missive svg:not(:root) {
    overflow: hidden
}

.missive figure {
    margin: 0
}

.missive fieldset {
    border: 1px solid silver;
    margin: 0 2px;
    padding: .35em .625em .75em
}

.missive legend {
    border: 0;
    padding: 0
}

.missive button,.missive input,.missive select,.missive textarea {
    font-family: inherit;
    font-size: 100%;
    margin: 0
}

.missive button,.missive input {
    line-height: normal
}

.missive button,.missive select {
    text-transform: none
}

.missive button,.missive html input[type=button],.missive input[type=reset],.missive input[type=submit] {
    -webkit-appearance: button;
    cursor: pointer
}

.missive button[disabled],.missive html input[disabled] {
    cursor: default
}

.missive input[type=checkbox],.missive input[type=radio] {
    box-sizing: border-box;
    padding: 0
}

.missive input[type=search] {
    -webkit-appearance: textfield;
    box-sizing: border-box
}

.missive input[type=search]::-webkit-search-cancel-button,.missive input[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

.missive button::-moz-focus-inner,.missive input::-moz-focus-inner {
    border: 0;
    padding: 0
}

.missive textarea {
    overflow: auto;
    vertical-align: top
}

.missive table {
    border-collapse: collapse;
    border-spacing: 0
}

.missive .missive-icon {
    display: inline-block;
    position: relative
}

.missive .missive-icon,.missive .missive-icon svg {
    height: 17px;
    width: 17px
}

.missive .missive-icon svg {
    fill: currentColor;
    display: block;
    pointer-events: none
}

.missive .missive-icon-medium,.missive .missive-icon-medium svg {
    height: 24px;
    width: 24px
}

.missive .missive-icon-large,.missive .missive-icon-large svg {
    height: 34px;
    width: 34px
}

.missive .missive-icon-xlarge,.missive .missive-icon-xlarge svg {
    height: 60px;
    width: 60px
}

.missive i.missive-icon-superior {
    color: var(--text-color-a)
}

.missive .missive-icon-primary {
    color: var(--text-color-b)
}

.missive .missive-icon-secondary {
    color: var(--text-color-c)
}

.missive .missive-icon-tertiary {
    color: var(--text-color-d)
}

.missive .missive-icon-warning {
    color: var(--orange-color)
}

.missive .missive-icon-circled {
    border: 1px solid var(--text-color-d);
    border-radius: 50%;
    line-height: 0;
    margin-right: .7em;
    padding: .5em .55em .6em
}

.missive .missive-icon-stroke svg {
    fill: none!important;
    stroke: currentColor;
    stroke-width: 1
}

.missive .missive-icon-state-validated svg {
    fill: var(--green-color)
}

.missive .missive-icon-state-validated.missive-icon-stroke svg {
    fill: none;
    stroke: var(--green-color);
    stroke-width: 1
}

.missive .missive-icon-state-error svg {
    fill: var(--red-color)
}

.missive .missive-icon-state-error.missive-icon-stroke svg {
    fill: none;
    stroke: var(--red-color);
    stroke-width: 1
}

.missive .missive-interactive-icon {
    cursor: pointer
}

.missive-no-touch .missive .missive-interactive-icon:focus:not([data-state~=disabled]) svg,[data-wrapper=browser] .missive-no-touch .missive .missive-interactive-icon:hover:not([data-state~=disabled]) svg {
    fill: var(--text-color-a)
}

.missive .missive-button-icon,.missive .missive-button-icon-interactive {
    position: relative
}

.missive .missive-button-icon-interactive:after,.missive .missive-button-icon:after {
    content: "";
    height: 200%;
    left: -50%;
    position: absolute;
    top: -50%;
    width: 200%
}

.missive .missive-button-icon-interactive {
    color: var(--text-color-b);
    line-height: 0;
    position: relative
}

[data-wrapper=browser] .missive .missive-button-icon-interactive {
    cursor: pointer
}

.missive .missive-button-icon-interactive svg {
    transition: none
}

.missive-no-touch .missive .missive-button-icon-interactive:after {
    border-radius: 4px;
    content: "";
    height: 164%;
    left: -60%;
    position: absolute;
    top: -32%;
    width: 220%
}

.missive-no-touch .missive .missive-button-icon-interactive:focus:not([data-state~=disabled]),.missive-no-touch .missive .missive-button-icon-interactive:hover:not([data-state~=disabled]) {
    color: var(--text-color-a)
}

.missive-no-touch .missive .missive-button-icon-interactive:focus:not([data-state~=disabled]):after,.missive-no-touch .missive .missive-button-icon-interactive:hover:not([data-state~=disabled]):after {
    box-shadow: inset 0 1px 0 rgba(255,255,255,.5),0 0 0 1px rgba(0,0,0,.15),0 1px 1px rgba(0,0,0,.1)
}

.missive .missive-button-icon-interactive.missive-icon-reply-all:after {
    height: 141%;
    left: -50%;
    top: -20.5%;
    width: 200%
}

.missive .missive-icon-snooze[data-state~=active]:focus svg,.missive .missive-icon-snooze[data-state~=active]:hover svg,.missive .missive-icon-snooze[data-state~=active] svg,.missive .missive-icon-snoozed[data-state~=active]:focus svg,.missive .missive-icon-snoozed[data-state~=active]:hover svg,.missive .missive-icon-snoozed[data-state~=active] svg {
    fill: var(--orange-color)
}

.missive .icon-member-status,.missive .icon-seen,.missive .icon-snoozed,.missive .icon-unseen {
    border-radius: 100%;
    display: inline-block;
    height: 8px;
    margin-bottom: 1px;
    position: relative;
    width: 8px
}

.missive .icon-member-status:before,.missive .icon-seen:before,.missive .icon-snoozed:before,.missive .icon-unseen:before {
    content: "";
    height: 200%;
    left: -50%;
    position: absolute;
    top: -50%;
    width: 200%
}

.missive .icon-unseen {
    background-color: var(--blue-color)
}

.missive .icon-seen {
    background-color: transparent
}

.missive .icon-snoozed {
    background-color: var(--orange-color)
}

.missive .icon-member-status {
    height: 7px;
    transition: background-color .5s var(--easing);
    width: 7px
}

.missive .icon-member-status.member-online {
    background-color: var(--green-color)
}

.missive .icon-member-status.member-offline {
    background-color: #999
}

.missive .missive-icon-arrow {
    border-width: 5px;
    border-bottom: 0;
    border-bottom-width: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 6px solid transparent;
    border-top-color: var(--sidebar-toggle-color);
    display: inline-block;
    height: 0;
    width: 0
}

.missive .missive-icon-arrow.arrow-right {
    transform: rotate(-90deg)
}

.missive .missive-icon-arrow-down.arrow-up {
    transform: rotate(180deg)
}

.missive .missive-icon-reply-all svg {
    transform: scale(1.1764705882)
}

.missive .missive-icon-dropdown {
    position: relative
}

.missive .missive-icon-dropdown svg+svg {
    left: 80%;
    position: absolute;
    top: 5%
}

.missive .missive-icon-starring {
    height: 17px;
    position: relative;
    width: 17px
}

.missive .missive-icon-starring .star,.missive .missive-icon-starring .starred {
    left: 0;
    position: absolute;
    top: 0;
    transition: opacity var(--duration) var(--easing)
}

.missive .missive-icon-starring .starred {
    opacity: 0;
    transform: scale(1.5);
    transition: transform .25s var(--easing)
}

.missive .missive-icon-starring .starred:hover svg,.missive .missive-icon-starring .starred svg {
    fill: var(--starred-yellow-color)!important
}

.missive .missive-icon-starring[data-state~=starred] .star {
    opacity: 0
}

.missive .missive-icon-starring[data-state~=starred] .starred {
    opacity: 1;
    transform: none;
    transition-property: opacity,transform
}

.missive .missive-avatar-conversation.missive-icon {
    border: 1px solid;
    border-radius: 100%;
    height: 26px;
    width: 26px
}

.missive .missive-avatar-conversation.missive-icon svg {
    left: -1px;
    position: relative
}

.missive .missive-icon-rtl {
    font-size: 9px;
    font-weight: 700
}

.missive .oauth-apple-login-icon {
    color: #000
}

.missive .oauth-apple-login-icon .missive-icon-apple-logo {
    position: relative;
    top: -1px
}

.missive .button-dark-black .oauth-apple-login-icon,.missive [data-theme^=dark] .oauth-apple-login-icon {
    color: #fff
}

.missive .missive-icon-account-cancel svg {
    left: 2px;
    position: relative
}

.missive .missive-icon-login svg {
    left: -1px;
    position: relative
}

.missive .missive-icon-incognito-off svg,.missive .missive-icon-incognito svg {
    position: relative;
    top: 1px
}

.missive .missive-icon-spam {
    color: #fff;
    font-weight: 700;
    height: 14px;
    overflow: hidden;
    position: relative;
    transform: rotate(45deg);
    width: 14px
}

.missive .missive-icon-spam span {
    background-color: #fff;
    bottom: 2px;
    left: 50%;
    margin: 0 0 0 -1px;
    position: absolute;
    top: 2px;
    width: 2px;
    z-index: 1
}

.missive .missive-icon-spam span:after {
    background-color: #d0021b;
    bottom: 2px;
    content: "";
    height: 2px;
    left: 0;
    position: absolute;
    width: 2px
}

.missive .missive-icon-spam:before,.missive .missive-icon-spam span {
    transform: rotate(-45deg)
}

.missive .missive-icon-spam:before {
    background-color: #d0021b;
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.missive .missive-icon-in-junk {
    color: var(--red-color)
}

.missive .missive-icon-in-trash {
    color: #444
}

.missive .missive-icon-is-snoozed {
    color: var(--orange-color)
}

.missive .missive-icon-in-junk,.missive .missive-icon-in-junk svg,.missive .missive-icon-in-trash,.missive .missive-icon-in-trash svg,.missive .missive-icon-is-snoozed,.missive .missive-icon-is-snoozed svg {
    height: 13px!important;
    width: 13px!important
}

.missive .missive-icon-in-junk,.missive .missive-icon-in-junk svg,.missive .missive-icon-in-trash,.missive .missive-icon-in-trash svg,.missive .missive-icon-is-snoozed,.missive .missive-icon-is-snoozed svg,.missive .missive-icon-is-starred,.missive .missive-icon-is-starred svg {
    position: relative;
    vertical-align: top
}

.missive .missive-icon-in-junk:before,.missive .missive-icon-in-trash:before,.missive .missive-icon-is-snoozed:before,.missive .missive-icon-is-starred:before {
    background-color: #fff;
    border-radius: 100px;
    bottom: 1px;
    content: "";
    left: 1px;
    position: absolute;
    right: 1px;
    top: 1px
}

.missive .header-icon-logo i,.missive .header-icon-logo svg {
    height: 34px;
    width: 34px
}

.missive .header-icon-circle {
    border: 1px solid var(--light-border-color);
    border-radius: 64px;
    display: inline-block;
    height: 64px;
    position: relative;
    width: 64px
}

.missive .header-icon-circle i:first-child,.missive .header-icon-circle svg {
    fill: var(--text-color-c);
    height: 42px;
    width: 42px
}

.missive .header-icon-medium {
    border-radius: 48px;
    height: 48px;
    width: 48px
}

.missive .header-icon-medium i:first-child,.missive .header-icon-medium svg {
    fill: var(--text-color-c);
    height: 34px;
    width: 34px
}

.missive .progress-circle {
    border-radius: 64px;
    height: 64px;
    left: -1px;
    position: absolute;
    top: -1px;
    width: 64px
}

.missive .progress-circle svg {
    fill: none;
    stroke: var(--blue-color);
    stroke-width: 1;
    stroke-dasharray: 201px;
    stroke-dashoffset: 201px;
    height: 64px;
    transform: rotate(-90deg);
    transition: stroke-dashoffset .25s .25s var(--easing);
    width: 64px
}

.missive .progress-circle.complete {
    -webkit-animation: progress-complete .1s linear .5s both;
    animation: progress-complete .1s linear .5s both
}

.missive .spinner,.missive .spinner-medium {
    border-radius: 24px;
    height: 24px;
    left: -3px;
    position: absolute;
    top: -3px;
    width: 24px
}

.missive .spinner-medium[data-state~=paused] svg,.missive .spinner[data-state~=paused] svg {
    -webkit-animation-play-state: paused;
    animation-play-state: paused
}

.missive .spinner-medium svg,.missive .spinner svg {
    fill: none!important;
    stroke: currentColor;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-dasharray: 48;
    stroke-dashoffset: 64;
    -webkit-animation: spinner 1s linear infinite both;
    animation: spinner 1s linear infinite both;
    height: 24px;
    width: 24px
}

.missive .spinner-medium.spinner-static,.missive .spinner.spinner-static {
    position: static
}

.missive .spinner-medium {
    border-radius: 40px;
    height: 40px;
    width: 40px
}

.missive .spinner-medium svg {
    stroke-width: 1;
    height: 40px;
    width: 40px
}

.missive.dragging-placeholder-container {
    position: absolute;
    top: 0;
    z-index: -1
}

.missive.dragging-placeholder-container .dragging-placeholder {
    padding-left: var(--padding)
}

.missive .dragging-placeholder-multiple {
    position: relative
}

.missive .dragging-placeholder-multiple:after {
    color: var(--text-color-b);
    content: attr("data-after");
    font-size: 9px;
    font-weight: 600;
    line-height: 1;
    position: absolute;
    right: 7px;
    text-align: center;
    top: 9px;
    width: 12px
}

.missive .button {
    background-color: var(--blue-color);
    background-image: linear-gradient(180deg,hsla(0,0%,100%,.075),transparent);
    border: 0 solid transparent;
    border-radius: 5px;
    color: #fff;
    cursor: default;
    font-weight: 600;
    line-height: 1;
    padding: .725em 1.65em .775em;
    text-decoration: none;
    transition: background-color var(--duration);
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.missive .button svg {
    fill: currentColor
}

.missive .button:focus {
    box-shadow: 0 0 0 2px #fff,0 0 0 4px var(--light-border-color);
    outline: none
}

.missive-no-touch .missive .button:not(.disabled):not([data-state~=disabled]):hover {
    background-image: none
}

.missive .button:active:not([data-state~=disabled]) {
    background-image: linear-gradient(0deg,hsla(0,0%,100%,.05),transparent)!important
}

.missive .button.button-small {
    font-size: calc(var(--font-size) - 1px)
}

.missive .button.button-text-medium {
    font-size: calc(var(--font-size) + 3px)
}

.missive .button.button-large {
    padding-left: 2.5em;
    padding-right: 2.5em
}

.missive .button.button-medium {
    padding-left: 2em;
    padding-right: 2em
}

.missive .button.button-big {
    padding: .9em 1.65em 1em
}

.missive .button.button-jumbo {
    border-radius: 4px;
    padding: 1.25em 1.5em
}

.missive .button.button-full {
    text-align: center;
    width: 100%
}

.missive .button.button-pill {
    border-radius: 10em
}

.missive .button.button-slim {
    padding-bottom: .65em;
    padding-top: .65em
}

.missive .button.button-xslim {
    padding-bottom: .5em;
    padding-top: .5em
}

.missive .button.button-tight {
    padding-left: 1.15em;
    padding-right: 1.15em
}

.missive .button.button-square {
    padding: .5em .55em
}

.missive .button.button-square i {
    display: block;
    margin: 0
}

.missive .button.button-green {
    background-color: #25be7c
}

.missive .button.button-green.disabled,.missive .button.button-green[disabled] {
    background-color: rgba(37,190,124,.6);
    color: rgba(255,255,255,.65)
}

.missive-no-touch .missive .button.button-green:not(.disabled):not([data-state~=disabled]):focus,.missive-no-touch .missive .button.button-green:not(.disabled):not([data-state~=disabled]):hover {
    background-color: #23b174
}

.missive .button.button-black {
    background-color: var(--button-black-background-color)
}

.missive-no-touch .missive .button.button-black:focus,.missive-no-touch .missive .button.button-black:hover {
    background-color: var(--button-black-hover-background-color)
}

.missive .button.button-dark-black {
    background-color: #000
}

.missive .button.button-dark-black-outline {
    background-color: transparent;
    border: 1px solid #000;
    color: #000
}

.missive .button.button-white {
    background: var(--input-background-color);
    border: 1px solid var(--light-border-color);
    border-bottom-color: var(--border-color);
    border-radius: var(--border-radius);
    color: var(--text-color-a);
    font-weight: 400;
    transition: border-color;
    transition-duration: var(--duration)
}

.missive .button.button-white .missive-icon,.missive .button.button-white img {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.missive .button.button-white.button-full {
    line-height: 1.3
}

.missive .button.button-white.button-pill {
    border-radius: 10em
}

.missive .button.button-white.button-big {
    font-weight: 600;
    padding: .85em 1.65em .95em
}

.missive .button.button-white:active {
    background-color: var(--light-active-color);
    transition: none
}

.missive .button.button-white.disabled,.missive .button.button-white[disabled] {
    background: var(--input-background-color);
    border-color: rgba(var(--text-color-a-rgb),.1);
    color: rgba(var(--text-color-a-rgb),.4)
}

.missive .button.button-white.disabled img,.missive .button.button-white[disabled] img {
    mix-blend-mode: luminosity
}

.missive-no-touch .missive .button.button-white:focus:not(.disabled):not([data-state~=disabled]),.missive-no-touch .missive .button.button-white:hover:not(.disabled):not([data-state~=disabled]) {
    border-color: var(--border-color)
}

[data-wrapper=browser] .missive .button:not([data-state~=disabled]),[data-wrapper=browser] .missive .button:not([data-state~=disabled]) * {
    cursor: pointer
}

.missive .button>i {
    fill: #fff;
    margin-right: .5em
}

.missive .button>i:only-child {
    margin-right: 0
}

.missive .button.disabled,.missive .button[disabled] {
    background-color: #6a94da;
    color: rgba(255,255,255,.65);
    cursor: default
}

.missive .button[data-state] {
    position: relative!important
}

.missive .button[data-state] .button-label,.missive .button[data-state] .spinner {
    transition: opacity .15s
}

.missive .button[data-state] .spinner {
    left: 50%;
    margin: -12px 0 0 -12px;
    opacity: 0;
    position: absolute;
    top: 50%;
    visibility: hidden
}

.missive .button[data-state] .spinner svg {
    stroke: #fff;
    -webkit-animation-play-state: paused;
    animation-play-state: paused
}

.missive .button[data-state=processing] .spinner {
    opacity: 1;
    visibility: visible
}

.missive .button[data-state=processing] .spinner svg {
    -webkit-animation-play-state: running;
    animation-play-state: running
}

.missive .button[data-state=processing] .button-label {
    opacity: 0
}

.missive .button-group .button+.button {
    margin-left: 1em
}

.missive .button-group .button-text+.button {
    margin-left: .65em
}

.missive a.button {
    display: inline-block
}

.missive .button-multiple {
    border-radius: 5px;
    overflow: hidden;
    position: relative
}

.missive .button-multiple .button {
    border-radius: 0;
    position: static
}

.missive .button-multiple .button+.button {
    border-left: 1px solid rgba(0,0,0,.18);
    box-shadow: inset 1px 0 0 rgba(255,255,255,.04)
}

.missive .button-white-multiple .button-white {
    border-radius: 0
}

.missive .button-white-multiple .button-white+.button-white {
    border-left: 0;
    padding: 0 1em
}

.missive .button-white-multiple .button-white:first-child {
    border-radius: 4px 0 0 4px
}

.missive .button-white-multiple .button-white:last-child {
    border-radius: 0 4px 4px 0
}

.missive .button-dropdown {
    padding-left: 4px;
    padding-right: 5px!important
}

.missive .button-dropdown i {
    margin: 0
}

.missive .button-outline {
    border: 1px solid var(--light-border-color);
    border-radius: 4px;
    color: var(--text-color-b);
    cursor: default;
    display: inline-block;
    line-height: 1;
    padding: .725em 1.65em .775em;
    text-decoration: none;
    transition: border-color var(--duration)
}

.missive .button-outline span {
    display: inline-block;
    padding: .1em .5em .125em
}

[data-wrapper=browser] .missive .button-outline {
    cursor: pointer
}

.missive-no-touch .missive .button-outline:focus,.missive-no-touch .missive .button-outline:hover {
    border-color: var(--border-color)
}

.missive .button-outline .missive-icon {
    display: block
}

.missive .button-outline .missive-icon svg {
    fill: var(--text-color-c);
    transition: fill var(--duration) var(--easing)
}

.missive .button-outline.button-pill {
    border-radius: 10em;
    padding: .625em 1.75em
}

.missive .button-outline.button-small {
    font-size: calc(var(--font-size) - 1px)
}

.missive .button-outline.disabled,.missive .button-outline[disabled] {
    color: rgba(var(--text-color-a-rgb),.4);
    cursor: default
}

.missive-no-touch .missive .button-outline.disabled:hover,.missive-no-touch .missive .button-outline[disabled]:hover {
    border-color: var(--light-border-color)
}

.missive .button-text {
    cursor: default;
    padding: .35em 1em
}

[data-wrapper=browser] .missive .button-text {
    cursor: pointer
}

.missive .button-text.button-text-small {
    font-size: calc(var(--font-size) - 1px)
}

.missive .details-button {
    margin-left: .5em
}

[data-wrapper=browser] .missive .details-button {
    cursor: pointer
}

.missive .details-button .missive-icon {
    vertical-align: bottom
}

.missive .details-button .missive-icon svg {
    transform: rotate(1turn)
}

.missive .details-button[data-state~=opened] .missive-icon svg {
    transform: rotate(180deg)
}

.missive .button-google {
    font-weight: 600
}

.missive .button-osx,.missive .button-osx-multiple .button-part {
    background-color: var(--osx-button-background-color);
    background-image: var(--osx-button-background);
    border-radius: 4px;
    box-shadow: 0 0 0 1px var(--border-color),0 1px 1px var(--text-color-e);
    color: var(--osx-button-color);
    cursor: default;
    display: inline-block;
    line-height: 1;
    padding: 5px 10px 4px
}

[data-wrapper=browser] .missive .button-osx,[data-wrapper=browser] .missive .button-osx-multiple .button-part {
    cursor: pointer
}

.missive .button-osx-multiple .button-part:active:not([data-state~=disabled]),.missive .button-osx-multiple .button-part[data-state~=active],.missive .button-osx:active:not([data-state~=disabled]),.missive .button-osx[data-state~=active] {
    background-color: var(--osx-button-active-background-color);
    background-image: none;
    color: var(--osx-button-active-color)
}

.missive .button-osx-multiple .button-part[data-state~=disabled],.missive .button-osx[data-state~=disabled],html[data-state~=unfocused] .missive .button-osx,html[data-state~=unfocused] .missive .button-osx-multiple .button-part {
    box-shadow: 0 0 0 1px var(--light-border-color);
    color: var(--text-color-d);
    cursor: default
}

.missive .button-osx-multiple .button-part {
    border-radius: 0
}

.missive .button-osx-multiple .button-part:first-child {
    border-bottom-left-radius: 4px;
    border-top-left-radius: 4px
}

.missive .button-osx-multiple .button-part:last-child {
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px
}

.missive .button-osx-multiple .button-more {
    padding: 6px 0 3px
}

.missive .button-stealth {
    border: 1px solid transparent;
    border-radius: 5px;
    cursor: default;
    padding: .2em .6em .33em;
    transition: border-color var(--duration)
}

[data-wrapper=browser] .missive .button-stealth,[data-wrapper=browser] .missive .button-stealth * {
    cursor: pointer
}

.missive .button-stealth:hover {
    border-top-color: var(--light-border-color);
    border-color: var(--border-color) var(--light-border-color) var(--light-border-color)
}

.missive .button-stealth:focus {
    border-color: var(--border-color)
}

.missive .button-macos {
    border-radius: var(--border-radius);
    color: var(--text-color-b);
    cursor: default;
    font-weight: 500;
    height: auto!important;
    line-height: 17px;
    padding: 6px;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    width: auto!important
}

.missive .button-macos.button-macos-cancel {
    color: var(--red-color)!important
}

.missive .button-macos.button-macos-submit {
    color: var(--blue-color)!important
}

.missive-no-touch .missive .button-macos:hover,.missive .button-macos.button-macos-solid,.missive .button-macos[data-contextmenu-opened],.missive .button-macos[data-state~=focused] {
    background-color: rgba(var(--text-color-a-rgb),.05)
}

.missive-no-touch .missive .button-macos:hover.button-macos-cancel,.missive .button-macos.button-macos-solid.button-macos-cancel,.missive .button-macos[data-contextmenu-opened].button-macos-cancel,.missive .button-macos[data-state~=focused].button-macos-cancel {
    background-color: rgba(var(--red-color-rgb),.05)
}

.missive-no-touch .missive .button-macos:hover.button-macos-submit,.missive .button-macos.button-macos-solid.button-macos-submit,.missive .button-macos[data-contextmenu-opened].button-macos-submit,.missive .button-macos[data-state~=focused].button-macos-submit {
    background-color: rgba(var(--blue-color-rgb),.05)
}

.missive-no-touch .missive .button-macos:hover .missive-user-stack-item,.missive .button-macos.button-macos-solid .missive-user-stack-item,.missive .button-macos[data-contextmenu-opened] .missive-user-stack-item,.missive .button-macos[data-state~=focused] .missive-user-stack-item {
    color: rgba(var(--text-color-a-rgb),.05)!important
}

.missive-no-touch .missive .button-macos:hover .missive-user-stack-item .missive-avatar,.missive .button-macos.button-macos-solid .missive-user-stack-item .missive-avatar,.missive .button-macos[data-contextmenu-opened] .missive-user-stack-item .missive-avatar,.missive .button-macos[data-state~=focused] .missive-user-stack-item .missive-avatar {
    box-shadow: 0 0 0 2px currentColor,0 0 0 2px var(--top-bar-background-color)
}

.missive-no-touch .missive .button-macos:hover[data-color=orange],.missive .button-macos.button-macos-solid[data-color=orange],.missive .button-macos[data-contextmenu-opened][data-color=orange],.missive .button-macos[data-state~=focused][data-color=orange] {
    background-color: var(--light-orange-color)!important;
    color: var(--orange-color)!important
}

.missive-no-touch .missive .button-macos:hover[data-color=blue],.missive .button-macos.button-macos-solid[data-color=blue],.missive .button-macos[data-contextmenu-opened][data-color=blue],.missive .button-macos[data-state~=focused][data-color=blue] {
    background-color: var(--light-blue-color)!important;
    color: var(--blue-color)!important
}

.missive .button-macos:active {
    background-color: rgba(var(--text-color-a-rgb),.1)!important;
    color: var(--text-color-a)
}

.missive .button-macos:active .missive-user-stack-item {
    color: rgba(var(--text-color-a-rgb),.1)!important
}

.missive .button-macos:active .missive-user-stack-item .missive-avatar {
    box-shadow: 0 0 0 2px currentColor,0 0 0 2px var(--top-bar-background-color)
}

.missive .button-macos:active.button-macos-cancel {
    background-color: rgba(var(--red-color-rgb),.1)!important
}

.missive .button-macos:active.button-macos-submit {
    background-color: rgba(var(--blue-color-rgb),.1)!important
}

.missive .button-macos:focus {
    outline: 0
}

.missive .button-macos[data-selected]:not([data-color]),.missive .button-macos[data-state~=selected]:not([data-color]) {
    background-color: rgba(var(--text-color-a-rgb),.05)!important;
    color: var(--text-color-a)
}

.missive .button-macos[data-selected].button-macos-solid,.missive .button-macos[data-state~=selected].button-macos-solid {
    background-color: var(--blue-color)!important;
    color: #fff!important
}

.missive .button-macos[data-selected].button-macos-solid .spinner svg,.missive .button-macos[data-state~=selected].button-macos-solid .spinner svg {
    stroke: #fff
}

.missive .button-macos[data-selected][data-color=orange],.missive .button-macos[data-state~=selected][data-color=orange] {
    color: var(--orange-color)
}

.missive .button-macos[data-selected][data-color=blue],.missive .button-macos[data-state~=selected][data-color=blue] {
    color: var(--blue-color)
}

.missive .button-macos[data-disabled] {
    background-color: transparent!important;
    color: var(--text-color-d)!important
}

.missive-no-touch .missive .button-macos:focus,.missive .button-macos[data-focused] {
    box-shadow: 0 0 0 3px rgba(var(--blue-color-rgb),.2),inset 0 0 0 1px rgba(var(--blue-color-rgb),.6)
}

.missive-no-touch .missive .button-macos:focus.button-macos-cancel,.missive .button-macos[data-focused].button-macos-cancel {
    box-shadow: 0 0 0 3px rgba(var(--red-color-rgb),.1),inset 0 0 0 1px rgba(var(--red-color-rgb),.6)
}

.missive-no-touch .missive .button-macos:focus[data-selected],.missive .button-macos[data-focused][data-selected] {
    box-shadow: 0 0 0 3px rgba(var(--blue-color-rgb),.2),inset 0 0 0 1px rgba(0,0,0,.3)
}

.missive .button-macos[data-contextmenu-opened] {
    box-shadow: none!important
}

.missive .button-macos[data-twitter-retweeted] {
    color: var(--twitter-color)!important
}

.missive .button-macos[data-twitter-favorited] {
    color: var(--red-color)!important
}

.missive .button-macos .missive-icon+span {
    margin-left: var(--padding-small)
}

.missive .button-macos .checkbox {
    margin: 0!important
}

.missive .button-macos .spinner {
    stroke: var(--blue-color);
    left: 0;
    position: relative;
    top: 0
}

.missive .button-macos+.separator,.missive .button-separator {
    background-color: rgba(var(--text-color-a-rgb),.05);
    height: 21px;
    margin: 0 2px;
    width: 1px
}

.missive .button-separator-hr {
    height: 1px;
    margin: 2px 5px;
    width: auto
}

.missive .button-macos+.spacer {
    width: 14px
}

.missive .button-macos+.button-macos,.missive .button-macos+.button-macos-group,.missive .button-macos-group+.button-macos,.missive .button-macos-group+.button-macos-group {
    margin-left: 5px
}

.missive-has-touch .missive .button-macos+.button-macos,.missive-has-touch .missive .button-macos+.button-macos-group,.missive-has-touch .missive .button-macos-group+.button-macos,.missive-has-touch .missive .button-macos-group+.button-macos-group {
    margin-left: 10px
}

.missive .button-macos-full {
    border-top: 1px solid var(--background-color);
    position: relative;
    text-align: center
}

.missive .button-macos-full .button-macos {
    border-radius: 0;
    display: block;
    padding: var(--padding)
}

.missive .button-macos-full .button-macos+.button-macos {
    border-left: 1px solid var(--background-color);
    margin-left: 0
}

.missive .button-macos-full .button-macos-small {
    padding: 7px
}

.missive .button-macos-thin {
    font-weight: 400
}

.missive .button-macos-large {
    padding: 6px 10px
}

.missive .button-macos-small {
    padding: 3px 10px
}

.missive .button-macos-small.missive-icon {
    padding: 3px
}

.missive .button-macos-small.button-macos-icon {
    padding-left: 3px;
    padding-right: 6px
}

.missive .button-macos-xsmall {
    padding: 2px 5px 3px
}

.missive .button-macos-more {
    padding-left: 3px;
    padding-right: 3px
}

.missive .button-macos-spinner {
    position: relative
}

.missive .button-macos-spinner .missive-icon {
    transition: transform var(--material-duration) var(--material-easing)
}

.missive .button-macos-spinner .main-label {
    transition: opacity var(--material-duration) var(--material-easing)
}

.missive .button-macos-spinner .spinner {
    left: 50%!important;
    position: absolute!important;
    top: 50%!important;
    transform: translate(-50%,-50%) scale(0)
}

.missive .button-macos-spinner .spinner svg {
    -webkit-animation-play-state: paused;
    animation-play-state: paused
}

.missive .button-macos-spinner[data-spinning] .main-icon {
    transform: scale(0)
}

.missive .button-macos-spinner[data-spinning] .main-label {
    opacity: 0
}

.missive .button-macos-spinner[data-spinning] .spinner {
    transform: translate(-50%,-50%) scale(1)
}

.missive .button-macos-spinner[data-spinning] .spinner svg {
    -webkit-animation-play-state: running;
    animation-play-state: running
}

.missive .button-macos-group {
    border-radius: calc(2px + var(--border-radius));
    box-shadow: 0 0 0 1px rgba(var(--text-color-a-rgb),.05);
    padding: 2px
}

.missive .button-macos-group .button-macos+.button-macos {
    margin-left: 1px
}

.missive .button-macos-group-no-padding {
    border-radius: var(--border-radius);
    padding: 0
}

.missive .button-macos-group-large .button-macos {
    padding-bottom: 8px;
    padding-top: 8px
}

.missive .button-macos-group-xlarge .button-macos {
    padding-bottom: 14px;
    padding-top: 14px
}

.missive .button-macos-group-light {
    background-color: rgba(var(--conversation-list-background-color-rgb),.85)
}

.missive .button-macos-group-submit {
    background-color: var(--blue-color);
    box-shadow: none
}

.missive .button-macos-group-submit .separator {
    background-color: #fff;
    opacity: .1
}

.missive .button-macos-group-submit .button-macos {
    color: #fff!important
}

.missive .button-macos-group-submit .spinner {
    stroke: #fff
}

.missive .button-windows {
    height: auto!important;
    padding: 10px 18px;
    width: auto!important
}

.missive .button-windows:hover {
    background-color: rgba(var(--text-color-a-rgb),.05)
}

.missive .button-windows.missive-icon-window-close:hover {
    background-color: var(--red-color);
    color: #fff
}

.missive .button-windows:active {
    background-color: rgba(var(--text-color-a-rgb),.1)
}

.missive .button-token {
    background-color: currentColor;
    border-radius: 12px;
    box-shadow: 0 2px 4px rgba(0,0,0,.1);
    color: var(--reaction-background-color);
    margin-bottom: 3px;
    margin-right: 3px;
    padding: 4px 8px 5px 7px
}

.missive .button-token:hover {
    box-shadow: 0 0 0 1px currentColor,0 2px 4px rgba(0,0,0,.1)
}

.missive .button-token-large {
    padding: 20px 5px 22px
}

.missive .button-token-large[data-state~=selected] {
    position: relative
}

.missive .button-token-large[data-state~=selected]:after {
    background-color: var(--reaction-selected-color);
    bottom: -1px;
    content: "";
    height: 2px;
    left: 5%;
    position: absolute;
    right: 5%
}

.missive .button-token,.missive .button-token-large {
    font-size: 11px;
    font-weight: 600
}

.missive .button-token-large .missive-emoji,.missive .button-token .missive-emoji {
    margin-right: 4px
}

.missive .button-token-large .missive-emoji+span,.missive .button-token .missive-emoji+span {
    color: var(--text-color-a);
    min-width: 8px;
    text-align: center
}

.missive .button-token-large[data-state~=active],.missive .button-token[data-state~=active] {
    color: var(--reaction-selected-background-color)
}

.missive .button-token-large[data-state~=active] .missive-emoji+span,.missive .button-token[data-state~=active] .missive-emoji+span {
    color: var(--reaction-selected-color);
    font-weight: 800
}

.missive .team-archive-button {
    position: relative
}

.missive .team-archive-button .missive-team-inbox-avatar {
    bottom: -2px;
    color: var(--top-bar-background-color);
    pointer-events: none;
    position: absolute;
    right: 4px
}

.missive .team-archive-button .missive-team-inbox-avatar .missive-emoji {
    filter: drop-shadow(0 -1px 0 currentColor) drop-shadow(-1px 0 0 currentColor)
}

.missive .team-archive-button .missive-team-inbox-avatar .missive-icon-unassigned {
    background-color: var(--top-bar-background-color);
    border-radius: 3px;
    opacity: .9
}

.missive [contenteditable][data-state~=editable] {
    display: inline;
    position: relative
}

.missive [contenteditable][data-state~=editable]:before {
    border-radius: var(--border-radius);
    bottom: 0;
    content: "";
    left: -6px;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0
}

.missive [contenteditable][data-state~=editable].new-conversation:before,.missive [contenteditable][data-state~=editable]:focus:before,.missive [contenteditable][data-state~=editable]:hover:before {
    background-color: rgba(52,54,58,.05)
}

.missive [contenteditable][data-state~=editable].conversation-title-full-contenteditable,.missive [contenteditable][data-state~=editable]:focus {
    display: block;
    outline: none
}

.missive .title-bar {
    -webkit-app-region: drag;
    background-color: var(--top-bar-background-color);
    border-bottom: 1px solid var(--section-shadow-color);
    color: var(--text-color-a);
    position: relative
}

.missive .title-bar .button-windows {
    -webkit-app-region: no-drag
}

.missive .title-bar-label {
    border-left: 1px solid var(--section-shadow-color);
    margin-left: -1px
}

.missive .bar,.missive .bottom-bar,.missive .top-bar {
    background: var(--top-bar-background-color);
    height: var(--top-bar-height);
    padding: 0 var(--padding);
    position: relative;
    z-index: 2
}

.missive .bar.bar-transparent,.missive .bottom-bar.bar-transparent,.missive .top-bar.bar-transparent {
    background-color: transparent
}

.missive .bar.bar-transparent:after,.missive .bottom-bar.bar-transparent:after,.missive .top-bar.bar-transparent:after {
    content: none
}

.missive .bar.bar-no-padding,.missive .bottom-bar.bar-no-padding,.missive .top-bar.bar-no-padding {
    padding: 0
}

.missive .bar.bar-auto,.missive .bottom-bar.bar-auto,.missive .top-bar.bar-auto {
    height: auto!important;
    padding: var(--padding)
}

.missive .bar:not(.bar-transparent) .missive-user-stack-item,.missive .bottom-bar:not(.bar-transparent) .missive-user-stack-item,.missive .top-bar:not(.bar-transparent) .missive-user-stack-item {
    color: var(--top-bar-background-color)
}

.missive .top-bar {
    height: calc(var(--top-bar-height) + var(--safe-area-inset-top));
    padding-top: var(--safe-area-inset-top);
    position: relative
}

.missive .top-bar:after {
    background: linear-gradient(to bottom,var(--section-shadow-color),transparent);
    bottom: calc(var(--section-shadow-width)*-1);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0
}

.missive .bottom-bar {
    height: calc(var(--top-bar-height) + var(--safe-area-inset-bottom));
    padding-bottom: var(--safe-area-inset-bottom);
    position: relative
}

.missive .bottom-bar:after {
    background: linear-gradient(to top,var(--section-shadow-color),transparent);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0;
    top: calc(var(--section-shadow-width)*-1)
}

.missive .missive-app-banner {
    background-color: #2266ed;
    background-color: var(--blue-color);
    background-image: linear-gradient(180deg,hsla(0,0%,100%,.1),hsla(0,0%,100%,0));
    color: #fff;
    padding: .6em .4em
}

.missive .missive-app-banner a {
    color: #fff
}

.missive .missive-app-banner>div {
    padding: 0 2em 0 .4em
}

.missive .missive-app-banner .missive-icon {
    position: relative;
    top: 2px
}

.missive .search {
    padding: 0 var(--padding-small);
    position: relative;
    z-index: 10
}

.missive .search .input {
    -webkit-appearance: none;
    background-color: transparent;
    border: 0;
    border-radius: 0;
    padding: 12px 0;
    transition: border-color var(--duration) var(--easing)
}

.missive .search .input:focus {
    box-shadow: none
}

.missive .search .icon-immersive {
    left: .7em
}

.missive .search .spinner {
    stroke: var(--blue-color)
}

.missive .search[data-state~=empty] .icon-close {
    transform: scale(0)
}

.missive .search .icon-close {
    transition: transform var(--duration) var(--easing)
}

.missive .search.detached-border-bottom {
    margin-bottom: 1px
}

.missive .missive-mobile-back {
    margin-right: .6em
}

.missive .missive-mobile-back .missive-icon {
    margin-left: -.5em;
    margin-right: .2em
}

.missive .missive-mobile-back .missive-icon svg {
    width: 20px
}

.missive .conversation-list-banner {
    padding: var(--padding);
    position: relative;
    text-align: center;
    z-index: 2
}

.missive .conversation-list-top-banner {
    position: relative
}

.missive .conversation-list-top-banner:after {
    background: linear-gradient(to bottom,var(--section-shadow-color),transparent);
    bottom: calc(var(--section-shadow-width)*-1);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0
}

.missive .conversation-list-bottom-banner {
    position: relative
}

.missive .conversation-list-bottom-banner:after {
    background: linear-gradient(to top,var(--section-shadow-color),transparent);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0;
    top: calc(var(--section-shadow-width)*-1)
}

.missive .conversation-list-bottom-banner .missive-align-center {
    margin: auto
}

.missive .conversation-list-bottom-banner svg.graphic-rings {
    bottom: 0;
    height: 100%;
    left: 0;
    pointer-events: none;
    position: absolute;
    width: 100%;
    z-index: 0
}

.missive .syncing-box {
    background-color: var(--light-background-color);
    height: 50px;
    margin: 0 1px;
    overflow: hidden;
    position: relative
}

.missive .missive-tabs-tab {
    background-color: var(--input-background-color);
    border-bottom-color: var(--light-border-color);
    border-width: 1px;
    border-bottom: 1px solid var(--border-color);
    border-left: 1px solid var(--light-border-color);
    border-radius: 5px 0 0 5px;
    border-right: 0 solid var(--light-border-color);
    border-top: 1px solid var(--light-border-color);
    color: var(--text-color-a);
    cursor: default;
    font-size: calc(var(--font-size) - 1px);
    font-weight: 400;
    line-height: 1.2;
    padding: .33em 1em;
    position: relative;
    text-align: center
}

.missive .missive-tabs-tab+.missive-tabs-tab {
    border-radius: 0;
    border-width: 1px 0
}

.missive .missive-tabs-tab:last-child {
    border-radius: 0 5px 5px 0;
    border-width: 1px 1px 1px 0
}

.missive .missive-tabs-tab+.missive-tabs-tab[data-state=selected]:after {
    content: none
}

.missive .missive-tabs-tab+.missive-tabs-tab:after {
    background-color: var(--light-border-color);
    bottom: 1px;
    content: "";
    left: -1px;
    position: absolute;
    top: 1px;
    width: 1px
}

.missive .missive-tabs-tab:active {
    background-color: var(--light-active-color);
    transition: none
}

.missive .missive-tabs-tab[data-state=selected] {
    background-color: var(--blue-color);
    background-image: linear-gradient(0deg,hsla(0,0%,100%,.05),transparent);
    border-color: var(--blue-color);
    color: #fff;
    z-index: 1
}

.missive .list-item {
    display: block;
    padding: .5em 0
}

.missive .list-item.list-item-padding {
    padding: .5em
}

.missive .list-item .list-item-image {
    margin-right: .5em
}

.missive .list-item .text-detail.no-wrap {
    max-width: 40%;
    width: auto
}

.missive-no-touch .missive .list-item:hover .list-item-action,.missive-no-touch .missive .list-item[data-contextmenu-opened] .list-item-action,.missive-no-touch .missive .list-item[data-dragging] .list-item-action {
    display: block
}

.missive .list-item[data-state~=selected] .missive-user-stack-item {
    color: var(--light-border-color)!important
}

.missive .list-item .list-item-action,.missive .list-subtitle .list-subtitle-action {
    display: none;
    margin-left: var(--padding-small)
}

.missive .list-item .list-item-action[data-contextmenu-opened],.missive .list-subtitle .list-subtitle-action[data-contextmenu-opened] {
    box-shadow: none!important;
    display: block
}

.missive .draggable-list-item:not([data-dragging]),.missive .list-group:not([data-dragging]) {
    transition: transform var(--material-duration) var(--material-easing)
}

.missive .list-subtitle {
    color: var(--text-color-c);
    display: block;
    font-size: calc(var(--font-size) - 3px);
    font-weight: 600;
    padding: .5em 9px .6em 1em;
    position: relative
}

[data-notch=left] .missive .list-subtitle {
    padding-left: calc(var(--safe-area-inset-left)/1.5 + 1em)!important
}

.missive .list-subtitle .count-types {
    margin-left: .2em;
    position: relative;
    top: 1px;
    transform: scale(.75)
}

.missive .list-subtitle .count-types .unseen-count {
    padding: 1px 6px 2px
}

.missive .list-subtitle .button-macos {
    color: var(--text-color-c);
    padding: 0 5px
}

html[data-size=small] .missive .list-subtitle .button-macos,html[data-size=x-small] .missive .list-subtitle .button-macos {
    height: 12px!important
}

.missive .list-subtitle-action {
    opacity: .6
}

.missive .list-subtitle-action:hover {
    opacity: 1!important
}

.missive-has-touch .missive .list-group .collapsable-box-toggle .list-subtitle-action,.missive-no-touch .missive .list-group:hover .list-subtitle-action,.missive-no-touch .missive .list-group[data-contextmenu-opened] .list-subtitle-action {
    display: block
}

.missive .list-group-title {
    color: var(--text-color-d);
    font-size: calc(var(--font-size) - 1px);
    font-weight: 600;
    margin-top: var(--padding);
    padding-bottom: var(--padding-small);
    padding-left: var(--padding)
}

.missive .list-group-items {
    padding: var(--padding-small);
    position: relative;
    z-index: 0
}

.missive .list-group-items+.list-group-items {
    border-top: 1px solid var(--background-color)
}

.missive .missive-checkpoint+.list-group-items .option {
    scroll-margin-top: 30px
}

.missive .list-item-hidden-action {
    visibility: hidden
}

.missive .list-item-actions {
    margin: 0 1em
}

.missive .list-item-actions a+a {
    margin-left: 1em
}

.missive .list-item,.missive .list-item-group {
    border: solid transparent;
    border-width: 1px 0 0
}

.missive .list-item .detached-border-left {
    display: block
}

.missive .list-item .detached-border-left:after {
    bottom: 0;
    top: 0
}

.missive .list-item+.list-item,.missive .list-item+.list-item-group,.missive .list-item-group+.list-item {
    border-top-color: var(--light-border-color)
}

.missive .list-item-editable {
    cursor: text;
    position: relative
}

.missive .list-item-editable input {
    margin-left: -1px
}

.missive .list-item-editable[data-state=editing]:after,.missive .list-item-editable[data-state=editing]:before {
    background-color: var(--light-border-color);
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    right: 0;
    top: -1px
}

.missive .list-item-editable[data-state=editing]:after {
    bottom: -1px;
    top: auto
}

.missive .list-item .list-item-editable {
    padding: 0
}

.missive .list-item-invite-coworkers[data-state~=invited]>* {
    opacity: .4
}

.missive .list-item-invite-coworkers input[type=text] {
    border: 0;
    outline: 0
}

.missive .list-item-data {
    -webkit-user-select: text;
    -moz-user-select: text;
    user-select: text
}

.missive .detached-border-bottom,.missive .detached-border-left,.missive .detached-border-right,.missive .detached-border-top {
    position: relative
}

.missive .detached-border-bottom:after,.missive .detached-border-top:after {
    background-color: var(--light-border-color);
    content: "";
    display: block;
    height: 1px;
    left: var(--left-right);
    position: absolute;
    right: var(--left-right);
    z-index: 9
}

.missive .detached-border-left:after,.missive .detached-border-right:after {
    background-color: var(--light-border-color);
    bottom: 8px;
    content: "";
    display: block;
    position: absolute;
    top: 8px;
    width: 1px;
    z-index: 9
}

.missive .detached-border-top:after {
    top: -1px
}

.missive .detached-border-bottom:after {
    bottom: -1px
}

.missive .detached-border-left:after {
    left: -1px
}

.missive .detached-border-right:after {
    right: -1px
}

.missive.missive-audio-container,.missive.missive-document-container,.missive.missive-image-container,.missive.missive-video-container {
    border-radius: var(--border-radius)
}

.missive.missive-audio-container[data-state~=loading]>iframe,.missive.missive-audio-container[data-state~=loading]>img,.missive.missive-audio-container[data-state~=loading]>video,.missive.missive-document-container[data-state~=loading]>iframe,.missive.missive-document-container[data-state~=loading]>img,.missive.missive-document-container[data-state~=loading]>video,.missive.missive-image-container[data-state~=loading]>iframe,.missive.missive-image-container[data-state~=loading]>img,.missive.missive-image-container[data-state~=loading]>video,.missive.missive-video-container[data-state~=loading]>iframe,.missive.missive-video-container[data-state~=loading]>img,.missive.missive-video-container[data-state~=loading]>video {
    background-color: rgba(204,204,204,.1)
}

.missive.missive-audio-container[data-state~=loading]>audio,.missive.missive-audio-container[data-state~=loading]>iframe,.missive.missive-audio-container[data-state~=loading]>img,.missive.missive-audio-container[data-state~=loading]>video,.missive.missive-document-container[data-state~=loading]>audio,.missive.missive-document-container[data-state~=loading]>iframe,.missive.missive-document-container[data-state~=loading]>img,.missive.missive-document-container[data-state~=loading]>video,.missive.missive-image-container[data-state~=loading]>audio,.missive.missive-image-container[data-state~=loading]>iframe,.missive.missive-image-container[data-state~=loading]>img,.missive.missive-image-container[data-state~=loading]>video,.missive.missive-video-container[data-state~=loading]>audio,.missive.missive-video-container[data-state~=loading]>iframe,.missive.missive-video-container[data-state~=loading]>img,.missive.missive-video-container[data-state~=loading]>video {
    opacity: 0;
    transform: scale(1.02)
}

.missive.missive-audio-container[data-state~=loading] .spinner,.missive.missive-document-container[data-state~=loading] .spinner,.missive.missive-image-container[data-state~=loading] .spinner,.missive.missive-video-container[data-state~=loading] .spinner {
    opacity: 1
}

.missive.missive-audio-container .spinner,.missive.missive-document-container .spinner,.missive.missive-image-container .spinner,.missive.missive-video-container .spinner {
    left: 50%;
    opacity: 0;
    position: absolute;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    transition: opacity .2s var(--easing)
}

.missive.missive-audio-container>audio,.missive.missive-audio-container>iframe,.missive.missive-audio-container>img,.missive.missive-audio-container>video,.missive.missive-document-container>audio,.missive.missive-document-container>iframe,.missive.missive-document-container>img,.missive.missive-document-container>video,.missive.missive-image-container>audio,.missive.missive-image-container>iframe,.missive.missive-image-container>img,.missive.missive-image-container>video,.missive.missive-video-container>audio,.missive.missive-video-container>iframe,.missive.missive-video-container>img,.missive.missive-video-container>video {
    transition-duration: .2s;
    transition-property: opacity,transform;
    transition-timing-function: var(--easing)
}

.token[data-state~=selected] .missive.missive-audio-container,.token[data-state~=selected] .missive.missive-document-container,.token[data-state~=selected] .missive.missive-image-container,.token[data-state~=selected] .missive.missive-video-container {
    box-shadow: 0 0 0 2px var(--blue-color)
}

html[data-state~=unfocused] .token[data-state~=selected] .missive.missive-audio-container,html[data-state~=unfocused] .token[data-state~=selected] .missive.missive-document-container,html[data-state~=unfocused] .token[data-state~=selected] .missive.missive-image-container,html[data-state~=unfocused] .token[data-state~=selected] .missive.missive-video-container {
    box-shadow: 0 0 0 2px var(--border-color)
}

.missive.missive-image-container {
    background-color: transparent;
    display: block;
    font-size: 0;
    position: relative;
    transition: background-color .2s var(--easing)
}

.missive.missive-image-container>img {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.missive.missive-audio-container {
    position: relative;
    width: 100%
}

.missive.missive-audio-container>audio {
    max-width: 500px;
    width: 100%
}

.missive.missive-video-container {
    background-color: var(--background-color);
    border-radius: var(--border-radius);
    display: block;
    overflow: hidden;
    position: relative
}

.missive.missive-video-container>video {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.missive.missive-video-container>.missive-unsupported-media-container {
    padding: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%)
}

.missive.missive-document-container {
    overflow: hidden
}

.missive.missive-unsupported-media-container {
    align-items: center;
    background-color: var(--background-color);
    border-radius: var(--border-radius);
    display: flex;
    padding: 30px 40px;
    width: 100%
}

.missive .comment-meta .missive-unsupported-media-container {
    padding-left: var(--padding-small)
}

.missive .missive-avatar {
    position: relative
}

.missive .missive-avatar,.missive .missive-avatar:after {
    display: block
}

.missive .missive-avatar,.missive .missive-avatar:after,.missive .missive-avatar img {
    border-radius: 3px
}

.missive .missive-avatar+.missive-avatar {
    margin-left: .25em
}

.missive .missive-avatar .missive-avatar-img-container,.missive .missive-avatar img {
    display: block
}

.missive .missive-avatar .missive-avatar-img-container {
    padding-top: 100%;
    position: relative
}

.missive .missive-avatar img {
    left: 50%;
    max-height: 100%;
    max-width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

[data-theme=light-dark-sidebar] .missive-view-account .missive .missive-avatar.default-organization-avatar,[data-theme^=dark] .missive .missive-avatar.default-organization-avatar {
    filter: invert(1)
}

.missive .missive-avatar .icon-member-status {
    bottom: -2px;
    box-shadow: 0 0 0 2px var(--background-color);
    left: -1px;
    position: absolute;
    z-index: 1
}

.missive .missive-avatar.avatar-rounded,.missive .missive-avatar.avatar-rounded:after,.missive .missive-avatar.avatar-rounded img {
    border-radius: 10em
}

.missive .missive-avatar .missive-avatar-provider {
    color: var(--background-color)
}

.missive .missive-avatar .missive-avatar-provider img {
    border-radius: 0;
    filter: drop-shadow(0 -1px 0 currentColor) drop-shadow(-1px 0 0 currentColor)
}

.missive .missive-avatar .missive-avatar-tag {
    bottom: -3px;
    font-size: 7px;
    font-weight: 700;
    position: absolute;
    right: -1px;
    text-shadow: -1px -1px 0 var(--background-color),0 -1px 0 var(--background-color),1px -1px 0 var(--background-color),-1px 1px 0 var(--background-color),1px 1px 0 var(--background-color)
}

.missive .missive-avatar-sidebar-generic-account {
    bottom: -2px;
    color: var(--background-color);
    height: 13px;
    line-height: 0;
    padding: 1px;
    position: absolute;
    right: -5px;
    width: 13px
}

.missive .missive-avatar-sidebar-generic-account img {
    filter: drop-shadow(0 -1px 0 currentColor) drop-shadow(-1px 0 0 currentColor)
}

.missive .missive-avatar-emoji {
    text-align: center;
    width: 17px
}

.missive .task-assignees {
    margin-left: 7px
}

.missive .organization-avatar {
    position: relative
}

.missive .organization-avatar,.missive .organization-avatar>* {
    border-radius: 10em
}

.missive .organization-avatar .organization-avatar-placeholder svg {
    fill: rgba(52,54,58,.65)
}

.missive .organization-avatar img {
    box-shadow: inset 0 0 0 1px var(--text-color-d);
    line-height: 0
}

.missive .avatar-disabled img {
    opacity: .5
}

.missive .avatar-uploadable {
    cursor: pointer;
    transition: border-color var(--duration) var(--easing)
}

.missive .avatar-uploadable:hover {
    border-color: var(--border-color)
}

.missive .avatar-border,.missive .avatar-uploadable {
    border: 1px solid var(--light-border-color);
    color: var(--text-color-c)
}

.missive .missive-user-stack {
    position: relative;
    z-index: 1
}

.missive .missive-user-stack-item {
    color: var(--background-color);
    position: relative
}

.missive .missive-user-stack-item .missive-avatar {
    background-color: currentColor;
    box-shadow: 0 0 0 2.5px currentColor
}

.missive .missive-user-stack-item .missive-emoji,.missive .missive-user-stack-item .missive-icon {
    bottom: 0;
    position: absolute;
    right: -2px
}

.missive .missive-user-stack-item .missive-emoji {
    right: -5px
}

.missive .missive-user-stack-item .missive-emoji .emoji-mart-emoji {
    filter: drop-shadow(-1.5px -1.5px 0 var(--background-color)) drop-shadow(2px 0 0 var(--background-color)) drop-shadow(0 2px 0 var(--background-color))
}

.missive .missive-user-stack-item .missive-emoji .emoji-mart-emoji-native {
    filter: none;
    text-shadow: -1.5px -1.5px 0 var(--background-color),0 -1.5px 0 var(--background-color),1.5px -1.5px 0 var(--background-color),1.5px 0 0 var(--background-color),1.5px 1.5px 0 var(--background-color),0 1.5px 0 var(--background-color),-1.5px 1.5px 0 var(--background-color),-1.5px 0 0 var(--background-color)
}

.missive .missive-user-stack-item .icon-unseen {
    bottom: auto;
    right: 0;
    top: 0
}

.missive .missive-user-stack-item+.missive-user-stack-item {
    margin-left: -.45em
}

.missive .missive-user-stack-item[data-state~=present] {
    color: var(--blue-color)
}

.missive .missive-user-stack-item[data-state~=present] .missive-avatar {
    box-shadow: 0 0 0 1px var(--blue-color),0 0 3px 2px rgba(95,153,255,.5),0 0 0 3px var(--background-color)
}

.missive .missive-user-stack-item[data-state~=present] .missive-avatar:before {
    background-color: var(--background-color);
    border-radius: 100%;
    bottom: 1px;
    content: "";
    left: 1px;
    position: absolute;
    right: 1px;
    top: 1px
}

.missive .missive-user-stack-item[data-state~=archived] .missive-avatar,.missive .missive-user-stack-item[data-state~=closed] .missive-avatar {
    background-color: var(--background-color)
}

.missive .missive-user-stack-item[data-state~=archived] .missive-avatar:after,.missive .missive-user-stack-item[data-state~=closed] .missive-avatar:after {
    -webkit-backdrop-filter: grayscale(100%);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.missive .missive-user-stack-item[data-state~=archived] .missive-avatar img,.missive .missive-user-stack-item[data-state~=closed] .missive-avatar img {
    mix-blend-mode: luminosity;
    opacity: .6
}

.missive .missive-team-inbox-avatar {
    display: inline-block
}

.missive .missive-team-inbox-avatar[data-state~=closed] .missive-emoji,.missive .missive-team-inbox-avatar[data-state~=closed] .missive-icon {
    mix-blend-mode: luminosity;
    opacity: .6
}

.missive .missive-team-inbox-avatar .missive-icon {
    vertical-align: text-top
}

.missive .missive-user-stack-small .missive-avatar {
    box-shadow: 0 0 0 2px currentColor
}

.missive .missive-user-stack-small .missive-user-stack-item+.missive-user-stack-item {
    margin-left: -.2em
}

.missive .missive-user-stack-small .missive-user-stack-item.missive-user-stack-unseen .missive-avatar {
    box-shadow: 0 0 0 2px var(--blue-color)
}

.missive .missive-user-stack-small .missive-user-stack-extra-count {
    font-size: 9px;
    line-height: 1.05
}

.missive .missive-user-stack-extra-count {
    border-radius: 100%
}

.missive .missive-user-stack-extra-count span {
    left: 50%;
    margin-left: .1em;
    position: absolute;
    top: 50%;
    transform: translateX(-50%) translateY(-50%)
}

.missive .missive-user-stack-extra-count,.missive .total-count,.missive .unseen-count {
    background-color: var(--token-background-color);
    color: var(--text-color-b);
    font-size: calc(var(--font-size) - 1px);
    font-weight: 500
}

.missive .missive-user-stack-extra-count-smaller {
    font-size: calc(var(--font-size) - 4px)
}

.missive .missive-user-stack-extra-count-smaller span {
    transform: translateX(-40%) translateY(-50%)
}

.missive .total-count,.missive .unseen-count {
    border-radius: var(--border-radius-small);
    line-height: 1;
    padding: 3px 8px;
    text-align: center
}

.missive .unseen-count {
    background-color: var(--light-blue-color);
    color: var(--blue-color)
}

.missive .count-types .total-count,.missive .count-types .unseen-count {
    border-radius: 0
}

.missive .count-types .total-count:first-child,.missive .count-types .unseen-count:first-child {
    border-bottom-left-radius: var(--border-radius-small);
    border-top-left-radius: var(--border-radius-small)
}

.missive .count-types .total-count:last-child,.missive .count-types .unseen-count:last-child {
    border-bottom-right-radius: var(--border-radius-small);
    border-top-right-radius: var(--border-radius-small)
}

.missive .menu-unseen-count {
    font-size: 9px!important;
    padding: 2px 4px!important;
    position: absolute;
    right: -1px;
    top: -1px
}

.missive .message-count {
    border: 1px solid var(--light-border-color);
    border-radius: 3px;
    color: var(--text-color-c);
    font-size: 9px;
    height: 13px;
    line-height: 1;
    min-width: 13px;
    text-align: center
}

.missive .message-count span {
    display: inline-block;
    padding: 1px .2em 0
}

[data-os=android] .missive .message-count span {
    padding-top: 2px
}

.missive .tasks-count {
    font-size: calc(var(--font-size) - 3px)
}

.missive .tasks-count .missive-icon {
    margin-left: 5px
}

.missive .tasks-count .missive-icon,.missive .tasks-count svg {
    height: 13px;
    width: 13px
}

.missive .conversation-comments-icon {
    line-height: 1;
    position: relative
}

.missive .conversation-comments-icon i {
    margin-right: -1px
}

.missive .conversation-comments-icon i,.missive .conversation-comments-icon svg {
    width: 16px
}

.missive .conversation-comments-icon[data-state~=unseen] svg {
    fill: var(--blue-color)
}

.missive .conversation-comments-icon .unread-comments-count {
    color: #fff;
    font-size: 9px;
    font-weight: 600;
    left: 1px;
    margin: 0;
    position: absolute;
    right: 0;
    text-align: center;
    top: 3px
}

.missive .conversation-comments-icon .icon-unseen {
    background-color: #fff;
    height: 4px!important;
    width: 4px!important
}

.missive .announcement {
    margin: 2em 0 1em;
    padding: 0 .75em
}

.missive .announcement .heading-b+.subheading-a {
    margin-top: .3em
}

.missive .announcement-header {
    margin: 1.25em 0;
    padding: 0 1em
}

.missive .announcement-header p {
    margin-top: .5em
}

.missive .announcement-note {
    margin: 1em 0 0
}

.missive .announcement-start-collaborating {
    margin-top: 1em;
    max-width: 220px;
    padding-bottom: var(--safe-area-inset-bottom)
}

.missive .announcement-start-collaborating.announcement-start-collaborating-popup {
    margin-bottom: 1.5em;
    margin-top: 2em
}

.missive .announcement-start-collaborating .form-header-icon {
    margin: 0 0 .85em;
    padding: .5em 0
}

.missive .announcement-start-collaborating .form-header {
    margin-bottom: 1em
}

.missive .announcement-start-collaborating .announcement-note {
    margin-top: .4em
}

.missive .color-flag {
    border-radius: 0 2px 2px 0;
    bottom: 2px;
    left: 0;
    position: absolute;
    top: 2px;
    width: 2px
}

.missive .media-block .media-element {
    display: inline-block;
    margin-right: .75em
}

.missive .media-block .media-text {
    display: inline-block
}

.missive .media-block .media-text small {
    color: var(--text-color-c);
    display: block;
    font-size: calc(var(--font-size) - 3px);
    font-weight: 400
}

.missive .media-block .media-text *+.text-detail {
    margin-top: .25em
}

.missive .media-block.button {
    padding: .75em .75em .75em 1em;
    text-align: left
}

.missive .media-block+.media-block.button,.missive .media-block.button+.media-block {
    margin-top: .65em
}

.missive .media-block.button-large {
    padding: 1.15em 1em 1.15em 1.25em
}

.missive .media-block.button-xlarge {
    padding: 2em 1em 2em 1.25em
}

.missive .media-block .missive-icon-notification {
    opacity: .65
}

.missive .progress-bar {
    background: var(--border-color);
    border-radius: 4px;
    height: 4px;
    margin: 7px 0;
    overflow: hidden;
    position: relative
}

.missive .progress-bar .progress-bar-done {
    background: var(--blue-color);
    background: linear-gradient(to right,var(--blue-color) 0,#40a9ff 100%);
    border-radius: 4px;
    height: 100%;
    transition: width var(--duration) var(--easing)
}

.missive .progress-bar.progress-bar-reversed .progress-bar-done {
    background: linear-gradient(to left,var(--blue-color),#40a9ff);
    left: auto;
    right: 0
}

.missive .progress-bar-container {
    height: 18px;
    overflow: hidden;
    transition: height var(--duration) var(--easing)
}

.missive .progress-bar-container[data-state=done] {
    height: 0
}

.missive .label-token {
    background-color: var(--light-border-color);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    color: var(--text-color-c);
    cursor: default;
    display: inline-block;
    font-size: calc(var(--font-size) - 3px);
    line-height: 1.1;
    margin-right: 5px;
    padding: 2px 5px;
    transition: background-color var(--duration) var(--easing);
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.missive .label-token:last-child {
    margin-right: 0
}

.missive .label-token.label-transparent {
    background-color: transparent
}

.missive .label-token img+span {
    margin-left: 4px
}

.missive .label-token-parent {
    background-color: var(--conversation-list-background-color);
    border-radius: var(--border-radius);
    display: inline-block;
    margin-right: 5px
}

.missive .label-token-parent.label-transparent {
    background-color: transparent
}

.missive .label-token-parent:last-child {
    margin-right: 0
}

[data-wrapper=browser] .missive .label-token-interactive {
    cursor: pointer
}

.missive .label-token-interactive:focus,.missive .label-token-interactive:hover {
    background-color: var(--border-color)
}

.missive .label-token-error,.missive .label-token-error.label-transparent {
    border-color: rgba(var(--red-color-rgb),.5);
    color: var(--red-color)
}

.missive .label-token-info,.missive .label-token-info.label-transparent {
    border-color: rgba(var(--blue-color-rgb),.5);
    color: var(--blue-color)
}

.missive .label-token-close {
    padding-right: 3px;
    position: relative
}

.missive .label-token-close:focus i,.missive .label-token-close:focus svg,.missive .label-token-close:hover i,.missive .label-token-close:hover svg,.missive .label-token-close[data-state~=current] i,.missive .label-token-close[data-state~=current] svg {
    width: 14px
}

.missive .label-token-close:before {
    bottom: -1px;
    content: "";
    left: -1px;
    position: absolute;
    right: -6px;
    top: -1px
}

.missive .label-token-close>span {
    margin-right: 2px
}

.missive .label-token-close i {
    border-radius: 4px
}

.missive .label-token-close i,.missive .label-token-close svg {
    height: 14px;
    transition: width var(--material-duration) var(--material-easing);
    width: 0
}

.missive .search-token {
    background-color: var(--tooltip-hint-background-color);
    border-radius: 3px;
    color: #fff;
    font-size: calc(var(--font-size) - 3px);
    line-height: 1.1;
    padding: .2em .5em
}

.missive .search-token .missive-icon {
    opacity: .65
}

.missive .search-token .missive-icon+span {
    margin-left: .4em
}

.missive.missive-overlay {
    align-items: center;
    bottom: 0;
    display: none;
    justify-content: center;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 100
}

.missive.missive-overlay[data-state~=opened] {
    display: flex
}

.missive.missive-overlay+.missive-popup-overlay .missive-popup,.missive.missive-overlay+.missive-popup-overlay .missive-popup-container {
    max-height: 95vh
}

.missive .missive-modal,.missive .missive-popup,.missive .missive-popup-container {
    max-height: 90vh
}

.missive .missive-popup-container {
    align-items: flex-start;
    display: flex;
    justify-content: center;
    max-width: 600px;
    min-height: 50vh;
    width: 98vw
}

.missive .missive-popup-container-fluid {
    height: 100%;
    max-width: 1100px
}

.missive .missive-popup-container-fluid .missive-popup {
    height: 100%;
    width: 100%
}

.missive .missive-popup-container-full {
    max-height: 100vh;
    max-width: 100vw
}

.missive .missive-popup-container-full .missive-popup {
    max-width: calc(100% - 150px)
}

.missive .missive-popup-container-dynamic {
    min-height: 70vh
}

.missive .missive-popup-container-dynamic,.missive .missive-popup-container-dynamic .missive-popup {
    max-height: 70vh
}

.missive .missive-modal,.missive .missive-popup {
    background-color: var(--popup-background-color);
    border-radius: var(--border-radius);
    box-shadow: 0 15px 35px var(--shadow-color);
    position: relative;
    z-index: 100
}

.missive .missive-modal .preferences-menu,.missive .missive-popup .preferences-menu {
    border-radius: 6px 0 0 6px
}

.missive .missive-modal .conversation-preview,.missive .missive-popup .conversation-preview {
    background-color: var(--conversation-list-background-color);
    border: 1px solid var(--light-border-color);
    border-bottom-color: var(--border-color);
    border-radius: 5px;
    box-shadow: none;
    text-align: left
}

.missive .missive-modal .conversation-preview:after,.missive .missive-popup .conversation-preview:after {
    display: none
}

.missive .missive-modal .conversation-preview .color-flag,.missive .missive-popup .conversation-preview .color-flag {
    border-radius: 3px 0 0 3px;
    bottom: 1px;
    top: 1px
}

.missive .missive-modal .missive-user-stack-item,.missive .missive-popup .missive-user-stack-item {
    color: var(--popup-background-color)
}

.missive .missive-popup {
    display: flex;
    flex-direction: column
}

.missive .missive-popup-transparent {
    background-color: transparent;
    border-radius: 0;
    box-shadow: none
}

.missive-has-touch .missive.missive-popup-mobile .missive-popup {
    border-radius: 0;
    transform: translateY(100%);
    transition: transform .3s var(--material-easing);
    vertical-align: bottom
}

.missive-has-touch .missive.missive-popup-mobile .missive-popup[data-state~=visible] {
    transform: none
}

.missive-has-touch .missive.missive-popup-mobile .missive-popup .missive-mobile-menu {
    width: auto
}

.missive .missive-veil {
    background-color: #000;
    opacity: var(--veil-opacity);
    -webkit-user-select: text;
    -moz-user-select: text;
    user-select: text
}

.missive.missive-loading-veil,.missive .missive-veil {
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 100
}

.missive.missive-loading-veil {
    background-color: var(--popup-background-color);
    opacity: .6
}

.missive .missive-light-veil {
    background-color: rgba(var(--popup-background-color-rgb),.75);
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.missive .popup-wrapper {
    padding: 0 36px 36px
}

.missive .popup-wrapper .form-content {
    margin: auto;
    max-width: 260px
}

.missive .popup-wrapper .missive-scroll {
    max-height: 207px
}

.missive .popup-wrapper .missive-scroll i {
    overflow: hidden
}

.missive .form-content-columns>div {
    padding-right: 1em;
    width: 50%
}

.missive .form-content-columns>div+div {
    padding-left: 1em;
    padding-right: 0
}

.missive .popup-controls {
    margin-bottom: 1.5em;
    margin-top: 1.5em;
    text-align: center
}

.missive .missive-location-form {
    padding: .5em .8em
}

.missive .missive-undo-redo-popup .link-a {
    min-width: 240px
}

.missive .missive-undo-redo-popup .link-a+.link-a {
    border-top: 1px solid var(--light-border-color)
}

.missive .missive-popup-form .missive-mobile-menu {
    display: none!important
}

.missive .missive-popup-form .missive-select {
    align-items: center;
    display: flex;
    height: 100%;
    min-height: 26px
}

.missive .missive-popup-form .missive-select[data-state~=disabled] {
    opacity: .6
}

.missive .missive-popup-form .missive-select[data-state~=disabled] .missive-select-arrow {
    opacity: 0
}

.missive .missive-popup-form .popup-form-title .label {
    margin-bottom: 0;
    margin-top: .5em
}

.missive .missive-popup-form .popup-form-title .label+.label-small {
    margin-top: .2em
}

.missive .missive-popup-form .missive-columns>label+label,.missive .missive-popup-form label+div {
    margin-left: .5em
}

.missive .missive-popup-form label[data-state=error]:after {
    display: none
}

.missive .missive-popup-form label[data-state=error] .input {
    position: relative;
    z-index: 1
}

.missive .missive-popup-form .merged .input {
    border-radius: 0
}

.missive .missive-popup-form .merged .input.focus,.missive .missive-popup-form .merged .input:focus {
    position: relative;
    z-index: 1
}

.missive .missive-popup-form .merged+.merged {
    margin-left: -1px
}

.missive .missive-popup-form .merged+.merged .input {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0
}

.missive .missive-popup-form .merged:first-of-type .input {
    border-bottom-left-radius: 5px;
    border-top-left-radius: 5px
}

.missive .missive-popup-form .merged:last-of-type .input {
    border-bottom-right-radius: 5px;
    border-top-right-radius: 5px
}

.missive .missive-popup-form .toolbar {
    border: 1px solid var(--border-color);
    border-bottom: 0;
    border-radius: 5px 5px 0 0
}

.missive .missive-popup-form .collab-container {
    border-radius: 0 0 5px 5px;
    display: block!important;
    max-height: 200px;
    min-height: 90px;
    overflow: auto
}

.missive .missive-popup-form .missive-white-box {
    max-width: 414px;
    min-width: 100%
}

.missive .missive-popup-form .comment-content {
    white-space: pre-wrap
}

.missive .missive-popup-form .missive-custom-color-picker {
    border-radius: var(--border-radius);
    box-shadow: inset 0 0 0 1px rgba(0,0,0,.2);
    height: 21px;
    margin-right: .65em;
    width: 42px
}

.missive.missive-popup-mobile .command-bar,.missive.missive-popup-mobile .command-bar-configuration {
    border-radius: 0!important;
    padding-top: var(--safe-area-inset-top)
}

.missive.missive-popup-mobile .command-bar-footer {
    padding-bottom: var(--safe-area-inset-bottom)
}

.missive .command-bar,.missive .command-bar-configuration {
    background-color: var(--popup-background-color);
    border-radius: calc(8px + var(--border-radius))!important;
    box-shadow: 0 15px 35px var(--shadow-color);
    display: flex;
    flex-direction: column;
    overflow: hidden
}

.missive .command-bar-configuration .preferences-shortcuts-shortcut,.missive .command-bar .preferences-shortcuts-shortcut {
    padding: 0
}

.missive .command-bar-configuration .preferences-shortcuts-shortcut+.preferences-shortcuts-shortcut,.missive .command-bar .preferences-shortcuts-shortcut+.preferences-shortcuts-shortcut {
    margin-left: 2px
}

.missive .command-bar-configuration .preferences-shortcuts-token,.missive .command-bar .preferences-shortcuts-token {
    border: 0;
    margin: 0;
    padding: 3px 8px
}

.missive .command-bar {
    -webkit-animation: scale-in var(--material-duration) var(--material-easing);
    animation: scale-in var(--material-duration) var(--material-easing);
    background-color: var(--popup-background-color);
    box-shadow: 0 15px 35px var(--shadow-color)
}

.missive .command-bar .missive-position-sticky {
    background-color: var(--popup-background-color);
    padding-bottom: 0;
    z-index: 10
}

.missive .command-bar .button-macos-group {
    background-color: var(--background-color);
    box-shadow: none
}

.missive .command-bar .button-macos-group .missive-icon-cog {
    margin-right: 3px;
    opacity: .6;
    padding: 10px
}

.missive .command-bar .button-macos-group .missive-icon-cog:focus,.missive .command-bar .button-macos-group .missive-icon-cog:hover {
    opacity: 1
}

.missive .command-bar .input {
    background-color: transparent;
    border: 0;
    box-shadow: none!important;
    font-size: 1.4em
}

.missive .command-bar .checkbox {
    margin-right: 0
}

.missive .command-bar .missive-user-stack-item {
    color: var(--popup-background-color)
}

.missive .command-bar .list-item {
    border: 0;
    border-radius: var(--border-radius);
    padding: 8px 8px 8px 10px;
    position: relative
}

.missive .command-bar .list-item .text-blue {
    font-weight: 500;
    white-space: nowrap
}

.missive .command-bar .list-item .color-flag {
    left: calc(var(--padding)*-1)
}

.missive .command-bar .list-item .icon-member-status {
    --background-color: var(--popup-background-color)
}

.missive .command-bar .list-item[data-state~=submit] {
    background-color: var(--light-blue-color);
    color: var(--blue-color);
    margin-top: var(--padding);
    padding: 12px 8px 12px 14px
}

.missive .command-bar .list-item[data-state~=submit] .missive-icon,.missive .command-bar .list-item[data-state~=submit] .text-blue {
    color: var(--blue-color)
}

.missive .command-bar .list-item[data-state~=submit] .text-medium+.text-c {
    color: rgba(var(--blue-color-rgb),.85)
}

.missive .command-bar .list-item[data-state~=selected] {
    background-color: var(--blue-color)
}

.missive .command-bar .list-item[data-state~=selected],.missive .command-bar .list-item[data-state~=selected] .missive-icon,.missive .command-bar .list-item[data-state~=selected] .text-blue,.missive .command-bar .list-item[data-state~=selected] .text-c {
    color: #fff!important
}

.missive .command-bar .list-item[data-state~=selected] svg {
    fill: #fff!important
}

.missive .command-bar .list-item[data-state~=selected] .text-blue {
    text-align: center
}

.missive .command-bar .list-item[data-state~=selected] .icon-member-status {
    --background-color: var(--blue-color)
}

.missive .command-bar .list-item[data-state~=selected] .missive-user-stack-item {
    color: var(--blue-color)
}

.missive .command-bar-tokens {
    -webkit-animation: scale-big-in var(--material-duration) var(--material-easing);
    animation: scale-big-in var(--material-duration) var(--material-easing);
    bottom: 100%;
    left: var(--padding);
    margin-bottom: 4px;
    position: absolute
}

.missive .command-bar-token {
    background-color: #222;
    color: #fff;
    font-weight: 500;
    padding: 4px 4px 4px 8px
}

.missive .command-bar-token:first-child {
    border-bottom-left-radius: 1em;
    border-top-left-radius: 1em
}

.missive .command-bar-token:last-child {
    border-bottom-right-radius: 1em;
    border-top-right-radius: 1em
}

.missive .command-bar-token+.command-bar-token {
    border-left: 1px solid rgba(255,255,255,.1)
}

.missive .command-bar-token .missive-icon {
    color: #fff;
    opacity: .6
}

.missive .command-bar-token .missive-icon-close {
    background-color: rgba(255,255,255,.2);
    border-radius: 100%;
    height: 18px!important;
    margin-left: 4px;
    position: relative;
    width: 18px!important
}

.missive .command-bar-content,.missive .command-bar-footer {
    flex: 1 1 auto
}

.missive .command-bar-section {
    padding: var(--padding)
}

.missive .command-bar-footer {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    background-color: var(--light-background-color);
    flex-grow: 0;
    flex-shrink: 0;
    position: relative
}

.missive .command-bar-footer:after {
    background: linear-gradient(to bottom,var(--section-shadow-color),transparent);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.missive .command-bar-configuration table {
    table-layout: fixed
}

.missive .command-bar-configuration table.sticky {
    background-color: var(--popup-background-color);
    position: sticky;
    text-align: left;
    top: 0;
    z-index: 2
}

.missive .command-bar-configuration table.sticky tr {
    border-width: 1px;
    border-bottom: 1px solid var(--background-color);
    border-left: 0 solid var(--background-color);
    border-right: 0 solid var(--background-color);
    border-top: 1px solid var(--background-color)
}

.missive .command-bar-configuration table+table thead tr {
    border: 0
}

.missive .command-bar-configuration table+table th {
    padding: 0!important
}

.missive .command-bar-configuration table+table th:before {
    display: none
}

.missive .command-bar-configuration table+table tr:hover {
    background-color: var(--light-background-color)
}

.missive .command-bar-configuration tr+tr {
    border-top: 1px solid var(--background-color)
}

.missive .command-bar-configuration td,.missive .command-bar-configuration th {
    padding: var(--padding-small) var(--padding)
}

.missive .command-bar-configuration td:first-child,.missive .command-bar-configuration th:first-child {
    padding: var(--padding-small)
}

.missive .command-bar-configuration th+th {
    position: relative
}

.missive .command-bar-configuration th+th:before {
    background-color: var(--background-color);
    bottom: 4px;
    content: "";
    left: 0;
    position: absolute;
    top: 4px;
    width: 1px
}

.missive .command-bar-configuration .checkbox {
    margin: 0
}

.missive .command-bar-configuration input {
    border-color: transparent
}

.missive .command-bar-configuration input:not([disabled]):not(:focus):hover {
    border-color: var(--light-border-color)
}

.missive .command-bar-configuration input[disabled] {
    opacity: .6
}

.missive .toolbar {
    background-color: var(--toolbar-background-color)
}

[data-notch=right] .missive .toolbar {
    padding-right: calc(var(--safe-area-inset-right)/1.5)!important
}

[data-notch=left] .missive .toolbar {
    padding-left: calc(var(--safe-area-inset-left)/1.5)!important
}

.missive .toolbar .missive-select-label {
    font-weight: 400
}

.missive .missive-color-swatch {
    width: 10%
}

.missive .missive-color-swatch>div {
    border-radius: 3px;
    box-shadow: inset 0 0 0 1px rgba(0,0,0,.1),0 0 0 0 transparent;
    min-height: 17px;
    padding-top: 85%;
    position: relative;
    width: 100%
}

.missive .missive-color-swatch>div span {
    font-size: 12px;
    font-weight: 500;
    left: 0;
    line-height: 0;
    position: absolute;
    text-align: center;
    top: 50%;
    width: 100%
}

.missive .missive-color-swatch:hover {
    transform: scale(1.1)
}

.missive .missive-color-swatch[data-state~=selected]>div {
    box-shadow: inset 0 0 0 1px transparent,0 0 0 2px var(--text-color-b)
}

.missive .missive-color-swatch[data-state~=selected]:hover {
    transform: scale(1)
}

.missive .missive-select .missive-color-swatch {
    width: 20px
}

.missive .missive-select .missive-color-swatch:hover {
    transform: none
}

.missive .missive-color-swatches {
    margin: .3em .5em .5em;
    min-width: 242px;
    white-space: normal
}

.missive .missive-color-swatches .missive-color-picker,.missive .missive-color-swatches .missive-color-swatch {
    padding: 2px
}

.missive .missive-color-swatches .missive-color-picker {
    margin-top: .3em
}

.missive .missive-rotation,.missive [data-missive-rotation] {
    -webkit-animation: spin 1s linear infinite both;
    animation: spin 1s linear infinite both
}

.missive .comment-box-meta-bar {
    bottom: 100%;
    left: 0;
    overflow: hidden;
    padding: 0 var(--padding);
    padding-top: var(--section-shadow-width);
    pointer-events: none;
    position: absolute;
    width: 100%
}

.missive .comment-box-meta-bar span {
    color: var(--text-color-d)
}

.missive .comment-box-meta-bar strong {
    color: var(--text-color-a);
    font-weight: 400
}

.missive .comment-box-meta-bar .missive-icon {
    color: var(--text-color-d);
    margin-right: 5px
}

.missive .comment-box-meta-bar .comment-box-meta-bar-content {
    background-color: var(--background-color);
    padding: 4px var(--padding);
    position: relative;
    transform: translateY(100%);
    transition: transform var(--material-duration) var(--material-easing)
}

.missive .comment-box-meta-bar .comment-box-meta-bar-content:after {
    background: linear-gradient(to top,var(--section-shadow-color),transparent);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: calc(var(--section-shadow-width)*-1);
    transition: opacity var(--material-duration) var(--material-easing)
}

.missive .comment-box-meta-bar[data-state~=visible] {
    pointer-events: auto
}

.missive .comment-box-meta-bar[data-state~=visible] .comment-box-meta-bar-content {
    transform: translateY(0)
}

.missive .comment-box-meta-bar[data-state~=visible] .comment-box-meta-bar-content:after {
    opacity: 1
}

.missive [data-quotable] {
    position: relative
}

.missive .floating-menu {
    -webkit-animation: floating-menu 175ms var(--material-easing);
    animation: floating-menu 175ms var(--material-easing);
    margin-top: -4px;
    padding: 4px 5px;
    position: absolute;
    transform: translate(-50%,-100%);
    z-index: 10
}

.missive .floating-menu .button-macos {
    background-color: transparent!important
}

@-webkit-keyframes floating-menu {
    0% {
        opacity: 0;
        transform: translate(-50%,-90%)
    }

    to {
        opacity: 1;
        transform: translate(-50%,-100%)
    }
}

@keyframes floating-menu {
    0% {
        opacity: 0;
        transform: translate(-50%,-90%)
    }

    to {
        opacity: 1;
        transform: translate(-50%,-100%)
    }
}

.missive .attachment-preview .attachment-preview-header {
    background-color: var(--light-background-color);
    padding: var(--padding);
    position: relative
}

.missive .attachment-preview .attachment-preview-header:after {
    background: linear-gradient(to top,var(--section-shadow-color),transparent);
    bottom: 0;
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0
}

.missive .attachment-preview .attachment-preview-footer {
    background-color: var(--light-background-color);
    max-height: -webkit-fit-content;
    max-height: -moz-fit-content;
    max-height: fit-content;
    padding: var(--padding);
    position: relative
}

.missive .attachment-preview .attachment-preview-footer:after {
    background: linear-gradient(to bottom,var(--section-shadow-color),transparent);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.missive .attachment-preview .attachment-preview-body {
    padding: var(--padding)
}

.missive .attachment-preview .attachment-preview-body audio,.missive .attachment-preview .attachment-preview-body img,.missive .attachment-preview .attachment-preview-body video {
    display: block
}

.missive .attachment-preview .attachment-preview-body .missive-audio-container {
    align-items: center;
    display: flex;
    justify-content: center
}

.missive .attachment-preview .missive-image-container {
    border-radius: var(--border-radius);
    overflow: hidden
}

.missive .attachment-preview .missive-image-container img {
    -o-object-fit: contain;
    object-fit: contain
}

.missive .bundlable-event-presenter[data-state~=expanded] .missive-icon-arrow-details {
    transform: rotate(180deg)
}

.missive .rule-form-filter-list {
    background-color: var(--filter-background-color);
    border: 1px solid var(--filter-border-color);
    border-radius: 4px;
    color: var(--filter-color);
    margin-top: var(--padding);
    padding: var(--padding-xsmall) var(--padding-small);
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

.missive .rule-form-filter-list .rule-form-filter-list-item {
    padding-left: var(--padding-small)
}

.missive .missive-emoji {
    display: inline-block;
    line-height: 0;
    position: relative;
    vertical-align: text-top
}

.missive .missive-emoji .emoji-mart-emoji-native {
    position: static
}

.missive .missive-emoji .emoji-mart-emoji-native span {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translateX(-50%) translateY(-50%)
}

.missive .emoji-mart-emoji,.missive .missive-avatar-emoji {
    white-space: nowrap
}

.missive .emoji-mart {
    background-color: transparent;
    border: 0;
    color: var(--text-color-a);
    font-family: inherit
}

.missive .emoji-mart,.missive .emoji-mart * {
    line-height: 1
}

.missive .emoji-mart input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: var(--input-background-color);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    border-top-color: var(--light-border-color);
    color: var(--text-color-a)
}

.missive .emoji-mart input:focus {
    border-color: rgba(var(--blue-color-rgb),.75);
    box-shadow: 0 0 1px rgba(var(--blue-color-rgb),.35);
    outline: none;
    transition-property: border-color,box-shadow;
    transition: .125s var(--easing)
}

.missive .emoji-mart .emoji-mart-bar {
    border: 0;
    position: relative
}

.missive .emoji-mart .emoji-mart-bar:after {
    background: linear-gradient(to bottom,var(--section-shadow-color),transparent);
    bottom: calc(var(--section-shadow-width)*-1);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0
}

.missive .emoji-mart .emoji-mart-scroll+.emoji-mart-bar {
    position: relative
}

.missive .emoji-mart .emoji-mart-scroll+.emoji-mart-bar:after {
    background: linear-gradient(to top,var(--section-shadow-color),transparent);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0;
    top: calc(var(--section-shadow-width)*-1)
}

.missive .emoji-mart .emoji-mart-anchors {
    display: flex
}

.missive .emoji-mart .emoji-mart-anchors .emoji-mart-anchor {
    color: var(--sidebar-icons-color);
    padding: 12px 4px
}

.missive .emoji-mart .emoji-mart-anchors .emoji-mart-anchor:hover {
    color: var(--text-color-b)
}

.missive .emoji-mart .emoji-mart-category-label span {
    background: linear-gradient(to bottom,var(--popup-background-color),rgba(var(--popup-background-color-rgb),.95));
    font-size: var(--font-size)
}

.missive .emoji-mart .emoji-mart-category .emoji-mart-emoji:hover:before {
    background-color: var(--light-border-color)
}

.missive .emoji-mart .emoji-mart-search {
    margin-bottom: 1px
}

.missive .emoji-mart .emoji-mart-search-icon {
    color: var(--text-color-a);
    padding: inherit;
    top: 50%;
    transform: translateY(-50%)
}

.missive .emoji-mart .emoji-mart-search-icon svg {
    fill: currentColor
}

.missive .emoji-mart .emoji-mart-title-label {
    font-size: 21px
}

.missive .emoji-mart .emoji-mart-preview-name {
    color: var(--text-color-a)
}

.missive .emoji-mart .emoji-mart-preview-shortname {
    color: var(--text-color-c)
}

.missive .emoji-mart .emoji-mart-preview-emoticon {
    color: var(--text-color-d)
}

.missive .emoji-mart .emoji-mart-skin-swatches {
    background-color: var(--popup-background-color);
    border-color: var(--border-color)
}

.missive .emoji-mart .emoji-mart-skin-swatch>span:focus {
    outline: none
}

.missive ::-webkit-input-placeholder {
    -webkit-font-smoothing: antialiased
}

.missive label {
    display: block;
    position: relative
}

.missive .label {
    display: block;
    font-weight: 600;
    margin-bottom: .5em
}

.missive .label small {
    font-weight: 400
}

.missive .label-small {
    color: var(--text-color-c);
    margin-bottom: .35em
}

.missive .label-small,.missive .label-small time {
    font-size: calc(var(--font-size) - 1px)
}

.missive .label-detail {
    margin-bottom: .65em
}

.missive .label-align-right {
    display: inline-block;
    text-align: right
}

.missive .input {
    -webkit-appearance: initial!important;
    background-color: var(--input-background-color);
    border: 1px solid var(--border-color);
    border-radius: 5px;
    border-top-color: var(--light-border-color);
    box-shadow: none;
    color: var(--text-color-a);
    padding: 7px 9px;
    width: 100%
}

.missive .input+.input {
    margin-left: .25em
}

.missive .input.input-no-border {
    border: 0
}

.missive .input.input-auto {
    width: auto
}

.missive .input.input-small {
    padding: .2em .3em
}

.missive .input.input-big {
    padding: .875em 1em
}

.missive .input.input-centered {
    padding-left: .1em;
    padding-right: .1em;
    text-align: center
}

.missive .input:disabled {
    color: var(--text-color-d)
}

.missive .input.focus,.missive .input:focus {
    border-color: rgba(var(--blue-color-rgb),.75);
    box-shadow: 0 0 1px rgba(var(--blue-color-rgb),.35);
    outline: none;
    transition-duration: .125s;
    transition-property: border-color,box-shadow;
    transition-timing-function: var(--easing)
}

.missive .input-thin {
    padding: .2em .05em .2em .5em
}

.missive .input-group+.input,.missive .input-group+.input-group,.missive .row+.row {
    margin-top: .5em
}

.missive .row+.row-spaced {
    margin-top: 1em
}

.missive .row+.row-spaced-big {
    margin-top: 1.75em
}

.missive .input-group label+label {
    margin-left: .25em
}

.missive .textarea,.missive textarea {
    background-color: var(--input-background-color);
    border: 1px solid var(--border-color);
    border-radius: 5px;
    color: var(--text-color-a);
    resize: none;
    transition: border-color var(--duration) var(--easing);
    width: 100%
}

.missive .textarea:focus,.missive textarea:focus {
    outline: none
}

.missive .textarea.textarea-medium,.missive textarea.textarea-medium {
    height: 6em
}

.missive .delegated-signature-preview,.missive textarea {
    padding: .65em 2.5em .65em .65em
}

.missive .delegated-signature-preview {
    overflow: hidden
}

.missive .password-placeholder::-moz-placeholder {
    color: var(--text-color-a)
}

.missive .password-placeholder::placeholder {
    color: var(--text-color-a)
}

.missive .switch {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: var(--light-border-color);
    border: 0;
    border-radius: 10em;
    cursor: pointer;
    height: 21px;
    outline: none;
    position: relative;
    width: 42px
}

.missive .switch:after {
    background-color: var(--conversation-list-background-color);
    border-radius: 16px;
    content: "";
    height: 19px;
    left: 1px;
    position: absolute;
    top: 1px;
    transition: var(--material-duration) var(--material-easing);
    transition-property: all;
    width: 19px
}

.missive .switch:focus {
    box-shadow: 0 0 0 1px var(--blue-color)
}

.missive .switch:active:after {
    width: 24px
}

.missive .switch:checked {
    background-color: var(--blue-color)
}

.missive .switch:checked:after {
    left: calc(100% - 1px);
    transform: translateX(-100%)
}

.missive .switch:disabled {
    cursor: not-allowed;
    opacity: .5
}

.missive .switch.switch-medium {
    height: 19px;
    width: 38px
}

.missive .switch.switch-medium:after {
    height: 17px;
    width: 17px
}

.missive .switch.switch-medium:active:after {
    width: 22px
}

.missive .switch.switch-large {
    height: 23px
}

.missive .switch.switch-large:after {
    left: 2px;
    top: 2px
}

.missive .switch.switch-large:checked:after {
    left: calc(100% - 2px)
}

.missive-has-touch .missive .switch.switch-large {
    height: 33px;
    width: 54px
}

.missive-has-touch .missive .switch.switch-large:after {
    height: 29px;
    width: 29px
}

.missive .color-picker {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.missive .checkbox {
    background-color: #fff;
    border: 2px solid;
    border-radius: 4px;
    color: var(--checkbox-color);
    display: inline-block;
    height: 16px;
    margin-right: .5em;
    position: relative;
    width: 16px
}

.missive .checkbox.checkbox-small {
    height: 14px;
    width: 14px
}

.missive .checkbox.checkbox-thin {
    border-width: 1px
}

.missive .checkbox.checkbox-rounded {
    border-radius: 100%
}

.missive .checkbox.checkbox-transparent {
    background-color: transparent
}

.missive-no-touch .missive .checkbox:hover {
    color: var(--checkbox-hover-color)
}

.missive-has-touch .missive .checkbox {
    margin-right: .8em;
    transform: scale(1.3)
}

.missive .checkbox .missive-icon {
    color: #fff;
    display: none;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translateX(-50%) translateY(-50%)
}

.missive .checkbox .missive-icon,.missive .checkbox .missive-icon svg {
    height: 12px!important;
    width: 12px!important
}

.missive .checkbox .missive-icon-window-minimize {
    overflow: hidden;
    width: 7px!important
}

.missive .checkbox+span {
    line-height: 1
}

.missive .checkbox[data-checked],.missive .shadow-checkbox:checked+.checkbox {
    background-color: currentColor!important
}

.missive .checkbox[data-checked]:not(.checkbox-transparent),.missive .shadow-checkbox:checked+.checkbox:not(.checkbox-transparent) {
    color: var(--checkbox-checked-color)!important
}

.missive .checkbox[data-checked] .missive-icon,.missive .shadow-checkbox:checked+.checkbox .missive-icon {
    display: block
}

.missive .checkbox[data-disabled],.missive .shadow-checkbox:disabled+.checkbox {
    cursor: not-allowed;
    opacity: .5
}

.missive .checkbox[data-focused],.missive .shadow-checkbox:focus+.checkbox {
    box-shadow: 0 0 0 1px var(--blue-color)
}

.missive .shadow-checkbox {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    opacity: 0;
    pointer-events: none;
    position: absolute
}

.missive .textarea .collab-placeholder,.missive .textarea .collab-preview,.missive .textarea .ProseMirror {
    padding: .65em 2.5em .65em .65em
}

.missive input[type=checkbox],.missive input[type=radio] {
    line-height: 1.2;
    margin-left: .1em;
    margin-right: .65em
}

.missive-no-touch .missive input[type=checkbox].checkbox-large,.missive-no-touch .missive input[type=radio].checkbox-large {
    font-size: calc(var(--font-size) + 2px)
}

.missive .missive-columns-top>input[type=checkbox],.missive .missive-columns-top>input[type=radio] {
    margin-top: .2em
}

.missive-has-touch .missive input[type=checkbox]:not(.switch),.missive-has-touch .missive input[type=radio] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: #fff;
    border: 1px solid #d3d3d3;
    border-radius: 50%;
    height: 23px;
    outline: 0;
    width: 23px
}

.missive-has-touch .missive input[type=checkbox]:not(.switch):checked,.missive-has-touch .missive input[type=radio]:checked {
    background: var(--blue-color);
    border-color: var(--blue-color)
}

.missive-has-touch .missive input[type=checkbox]:not(.switch):checked:after,.missive-has-touch .missive input[type=radio]:checked:after {
    content: "";
    position: absolute
}

.missive-has-touch .missive input[type=checkbox]:not(.switch):checked:after {
    border: solid #fff;
    border-width: 0 2px 2px 0;
    height: 12px;
    transform: translateX(6.5px) translateY(2px) rotate(45deg);
    width: 5px
}

.missive-has-touch .missive input[type=radio]:checked:after {
    background: #fff;
    border-radius: 50%;
    height: 10px;
    transform: translateX(5.5px) translateY(5.5px);
    width: 10px
}

.missive .input-line {
    background-color: transparent;
    border-width: 0;
    border-bottom: 1px solid var(--light-border-color);
    border-radius: 5px 5px 0 0;
    color: var(--text-color-a);
    display: block;
    margin: 0 auto;
    padding: .75em .5em .5em;
    transition: border-color var(--duration) var(--easing);
    width: 100%
}

.missive .input-line:hover {
    border-color: var(--border-color)
}

.missive .input-line:focus {
    border-color: var(--blue-color)!important;
    outline: 0
}

.missive .input-line.input-line-medium {
    font-size: calc(var(--font-size) + 3px);
    padding: .65em .65em .5em
}

.missive .input-line.input-line-big {
    font-size: calc(var(--font-size) + 8px);
    padding: .25em .5em
}

.missive .input-line.input-icon {
    padding-left: 2em
}

.missive .input-line.input-icon-right {
    padding-right: 2em
}

.missive .input-line.input-line-ventilated {
    padding-bottom: .875em;
    padding-top: 1em
}

.missive .input-line.missive-select {
    border-bottom-color: var(--light-border-color)
}

.missive .input-line:-webkit-autofill,.missive .input-line:-webkit-autofill:active,.missive .input-line:-webkit-autofill:focus,.missive .input-line:-webkit-autofill:hover {
    border: inherit;
    -webkit-box-shadow: inherit;
    caret-color: var(--text-color-a);
    -webkit-transition: background-color 5000s ease-in-out 0s;
    transition: background-color 5000s ease-in-out 0s
}

.missive .input-line:-webkit-autofill:first-line {
    -webkit-text-fill-color: inherit;
    color: var(--text-color-a);
    font-size: var(--font-size);
    letter-spacing: normal;
    line-height: normal
}

.missive .input-line:-webkit-autofill+.input-line-placeholder {
    transform: scale(.8) translateY(-100%)
}

.missive .input-line-placeholder-label {
    position: relative
}

.missive .input-line-placeholder-label .input-line {
    height: 100%
}

.missive .input-line-placeholder-label .input-line:focus+.input-line-placeholder {
    color: var(--blue-color)
}

.missive .input-line-placeholder-label .input-line:focus+.input-line-placeholder,.missive .input-line-placeholder-label .input-line[data-state~=filled]+.input-line-placeholder {
    transform: scale(.8) translateY(-100%)
}

.missive .input-line-placeholder-label .input-line:disabled {
    border-bottom: 0
}

.missive .input-line-placeholder-label .input-line-placeholder {
    color: var(--text-color-d);
    left: .5em;
    pointer-events: none;
    position: absolute;
    top: .75em;
    transform-origin: top left;
    transition: var(--material-duration) var(--material-easing);
    transition-property: transform,color
}

.missive .input-line-placeholder-label-auto input.input-line {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.missive .input-line-placeholder-label-auto .input-line-autowidth {
    border: 0;
    pointer-events: none;
    visibility: hidden;
    white-space: nowrap
}

.missive .input-line-placeholder-label-auto .input-line-autowidth+.input-line {
    margin-top: 0
}

.missive .shadow-input {
    -webkit-appearance: none;
    bottom: 0;
    filter: none;
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 1
}

.missive .input-icon {
    padding-left: 2em
}

.missive .icon-immersive {
    color: var(--text-color-c);
    left: .35em;
    margin-top: -8px;
    position: absolute;
    top: 50%;
    transition: color var(--material-duration) var(--material-easing)
}

.missive input:focus~.icon-immersive {
    color: var(--text-color-a)
}

.missive .input-hidden {
    left: -9999px;
    position: absolute;
    visibility: hidden
}

.missive label[data-state=error] .input {
    border-color: rgba(var(--red-color-rgb),.5)
}

.missive label[data-state=error] .input:focus {
    border-color: rgba(var(--red-color-rgb),.75);
    box-shadow: 0 0 1px rgba(var(--red-color-rgb),.65)
}

.missive label[data-state=error] .button-macos {
    box-shadow: 0 0 0 1px rgba(var(--red-color-rgb),.5)
}

.missive label[data-state=error]:after {
    color: var(--red-color);
    content: attr(data-error);
    display: block;
    font-size: calc(var(--font-size) - 1px);
    margin-top: .5em
}

.missive .input-feedback {
    bottom: 0;
    display: block;
    position: absolute;
    right: .5em;
    top: 0
}

.missive .input[data-state]+.input-feedback .missive-icon-anim svg {
    stroke-dashoffset: -50px;
    stroke-dasharray: 50px;
    visibility: hidden
}

.missive .input[data-state=error]+.input-feedback .missive-icon-anim svg,.missive .input[data-state=valid]+.input-feedback .missive-icon-anim svg {
    -webkit-animation: draw-icon .25s var(--easing) both;
    animation: draw-icon .25s var(--easing) both;
    visibility: visible
}

.missive .input[data-state=error]+.input-feedback svg {
    stroke: var(--red-color)
}

.missive .input[data-state=valid]+.input-feedback svg {
    stroke: var(--green-color)
}

.missive .missive-form .input-line {
    border-color: rgba(var(--text-color-a-rgb),.08);
    padding: .75em .5em .5em
}

.missive .missive-form .input-line+.input-line {
    margin-left: 0
}

.missive .missive-form .missive-select {
    box-shadow: none;
    padding-right: 0
}

.missive .missive-form .missive-select strong {
    font-weight: 500
}

.missive .missive-form .form-groups {
    padding-left: 0
}

.missive .missive-form .form-groups-sidebar {
    flex-grow: .6
}

.missive .missive-form .form-box {
    background-color: var(--light-background-color);
    border-radius: 5px;
    min-height: 3.7em;
    padding: .7em .5em .5em
}

.missive .missive-form .form-box .toolbar {
    background-color: transparent;
    margin-top: -7px
}

.missive .missive-form .form-box .collab-container {
    background-color: transparent;
    border: none;
    border-radius: 0;
    border-top: 1px solid var(--light-border-color);
    margin-bottom: -5px
}

.missive .missive-form .form-emoji-picker {
    font-size: 0;
    position: relative
}

.missive .missive-form .form-emoji-picker .missive-icon-arrow-down {
    left: 100%;
    position: absolute;
    top: 50%;
    transform: translateY(-50%) translateX(-2px)
}

.missive .missive-form .form-fields+.form-fields,.missive .missive-form .row+.row {
    margin-top: 1em
}

.missive .missive-form .form-field+.form-field {
    margin-left: 1em
}

.missive .missive-form .form-row+.form-row {
    margin-top: .35em
}

.missive .missive-form .alert-errors+.alert-errors {
    margin-top: .2em
}

.missive .missive-form .form-field[data-state~=disabled] {
    opacity: .6
}

.missive .missive-select {
    border-bottom-color: var(--light-border-color);
    border-color: var(--light-border-color) var(--light-border-color) var(--border-color);
    cursor: default;
    max-width: 100%;
    padding-left: .5em;
    padding-right: .05em;
    position: relative;
    width: auto
}

.missive .missive-select.select-small {
    padding-bottom: .2em;
    padding-top: .2em
}

.missive .missive-select[data-state~=focused] {
    border-color: var(--blue-color)
}

.missive .missive-select[data-state~=focused] .missive-select-arrow {
    color: var(--text-color-a)
}

.missive .missive-select .missive-select-arrow,.missive .missive-select[data-state~=disabled] {
    color: var(--text-color-c)
}

.missive .missive-select select {
    -webkit-appearance: none;
    bottom: 0;
    filter: none;
    font-size: calc(var(--font-size) - 1px);
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 1
}

.missive .missive-select.missive-select-invisible {
    background-color: transparent;
    border: none;
    padding: 0
}

.missive .missive-select.missive-select-invisible strong {
    font-weight: 400
}

.missive .missive-select.missive-select-invisible[data-state~=focused] {
    color: var(--text-color-a)
}

.missive .missive-select-color {
    height: 8px;
    width: 8px
}

.missive .missive-table {
    background-color: var(--input-background-color);
    border-radius: var(--border-radius);
    box-shadow: 0 0 0 1px rgba(0,0,0,.05);
    position: relative;
    text-align: left
}

.missive .missive-table tbody td.hover,.missive .missive-table tbody tr.hover td,.missive .missive-table tbody tr:hover td {
    background-color: var(--light-background-color)
}

.missive .missive-table tr+tr {
    border-top: 1px solid var(--background-color)
}

.missive .missive-table tr[data-disabled] {
    opacity: .5
}

.missive .missive-table td,.missive .missive-table th {
    padding: var(--padding-small) var(--padding);
    position: relative
}

.missive .missive-table th {
    background-color: var(--light-background-color);
    box-shadow: inset 0 -1px 0 rgba(0,0,0,.02);
    font-weight: 500;
    position: sticky;
    top: 0;
    z-index: 1
}

.missive .missive-table th:first-child {
    border-top-left-radius: var(--border-radius)
}

.missive .missive-table th:last-child {
    border-top-right-radius: var(--border-radius)
}

.missive .missive-table th .missive-icon-arrow-down {
    opacity: 0
}

.missive .missive-table th .missive-icon-arrow-down.active,.missive .missive-table th:hover .missive-icon-arrow-down {
    opacity: 1
}

.missive .missive-table tbody tr:last-child td:first-child {
    border-bottom-left-radius: var(--border-radius)
}

.missive .missive-table tbody tr:last-child td:last-child {
    border-bottom-right-radius: var(--border-radius)
}

.missive .missive-table th+th:before {
    background-color: rgba(0,0,0,.04);
    bottom: 4px;
    content: "";
    left: -1px;
    position: absolute;
    top: 4px;
    width: 1px
}

.missive .missive-table td[rowspan] {
    position: relative;
    vertical-align: top
}

.missive .missive-table td[rowspan]:before {
    background-color: var(--background-color);
    bottom: 0;
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    width: 1px
}

.missive .missive-table .feature-yes {
    color: var(--blue-color)
}

.missive .missive-table .feature-no {
    color: var(--text-color-e)
}

.missive .missive-table-center {
    text-align: center
}

.missive .missive-table-large td,.missive .missive-table-large th {
    padding: var(--padding)
}

.missive .missive-table-no-sticky th {
    position: relative
}

.missive .missive-table-scroll tbody {
    display: block;
    overflow-y: auto
}

.missive .missive-table-scroll tbody td,.missive .missive-table-scroll tbody tr {
    display: block
}

.missive .missive-progress {
    border-color: transparent;
    border-radius: 6px;
    overflow: hidden;
    padding: 0
}

.missive .missive-progress .missive-progress-steps {
    overflow: hidden
}

.missive .missive-progress .missive-progress-step,.missive .missive-progress .missive-progress-steps {
    border-radius: 5px
}

.missive .missive-progress .missive-progress-step {
    background-color: var(--light-border-color);
    height: 32px;
    position: relative
}

.missive .missive-progress .missive-progress-step:after {
    background-color: var(--light-border-color);
    border: solid var(--popup-background-color);
    border-radius: 4px;
    border-width: 2px 2px 0 0;
    content: "";
    height: 26px;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateX(50%) translateY(-50%) rotate(45deg);
    width: 26px;
    z-index: 1
}

.missive .missive-progress .missive-progress-step[data-state~=hovered],.missive .missive-progress .missive-progress-step[data-state~=hovered]:after {
    background-color: var(--light-blue-color)
}

.missive .missive-progress .missive-progress-step[data-state~=selected],.missive .missive-progress .missive-progress-step[data-state~=selected]:after {
    background-color: var(--blue-color)
}

.missive .missive-progress .missive-progress-step[data-state~=selected-inactive],.missive .missive-progress .missive-progress-step[data-state~=selected-inactive]:after {
    background-color: var(--medium-blue-color)
}

.missive .input-immersive-container+.input-immersive-container {
    border-top: 1px solid var(--background-color)
}

.missive .input-immersive {
    background: transparent;
    border: 0;
    border-radius: 0;
    color: var(--text-color-a);
    margin: 0;
    outline: 0;
    position: relative;
    width: 100%
}

.missive .input-immersive:focus {
    box-shadow: none
}

.missive .form-header {
    margin-bottom: 1.5em
}

.missive .form-header h1+.subheading-a {
    margin-top: .25em
}

.missive .form-header p+p {
    margin-top: .5em
}

.missive .form-header-icon {
    padding: 1.5em 0
}

.missive .form-submit {
    margin-top: 2em
}

.missive .form-submit-button {
    display: inline-block;
    min-width: 250px
}

.missive .alert-errors {
    background-color: rgba(238,68,68,.1);
    border-radius: 4px;
    color: #e44;
    padding: .5em 1.5em;
    text-align: center;
    width: 100%
}

.missive .alert-errors.animated {
    -webkit-animation: scale-in var(--easing) var(--duration) both;
    animation: scale-in var(--easing) var(--duration) both;
    opacity: 0
}

.missive .alert-errors a {
    color: #a71616
}

.missive .link-a,.missive .link-b,.missive .link-c,.missive .link-delete,.missive .link-icon,.missive .link-icon-b,.missive .link-icon-c,.missive .link-tab {
    color: var(--text-color-b);
    cursor: default;
    text-decoration: none;
    transition: color var(--duration)
}

.missive .link-a svg,.missive .link-b svg,.missive .link-c svg,.missive .link-delete svg,.missive .link-icon-b svg,.missive .link-icon-c svg,.missive .link-icon svg,.missive .link-tab svg {
    transition: fill var(--duration)
}

.missive .link-a i+span,.missive .link-b i+span,.missive .link-c i+span,.missive .link-delete i+span,.missive .link-icon-b i+span,.missive .link-icon-c i+span,.missive .link-icon i+span,.missive .link-tab i+span {
    margin-left: .5em
}

.missive .link-a i.missive-icon-nomargin+span,.missive .link-b i.missive-icon-nomargin+span,.missive .link-c i.missive-icon-nomargin+span,.missive .link-delete i.missive-icon-nomargin+span,.missive .link-icon-b i.missive-icon-nomargin+span,.missive .link-icon-c i.missive-icon-nomargin+span,.missive .link-icon i.missive-icon-nomargin+span,.missive .link-tab i.missive-icon-nomargin+span {
    margin-left: 0
}

[data-wrapper=browser] .missive .link-a,[data-wrapper=browser] .missive .link-a *,[data-wrapper=browser] .missive .link-b,[data-wrapper=browser] .missive .link-b *,[data-wrapper=browser] .missive .link-c,[data-wrapper=browser] .missive .link-c *,[data-wrapper=browser] .missive .link-delete,[data-wrapper=browser] .missive .link-delete *,[data-wrapper=browser] .missive .link-icon,[data-wrapper=browser] .missive .link-icon *,[data-wrapper=browser] .missive .link-icon-b,[data-wrapper=browser] .missive .link-icon-b *,[data-wrapper=browser] .missive .link-icon-c,[data-wrapper=browser] .missive .link-icon-c *,[data-wrapper=browser] .missive .link-tab,[data-wrapper=browser] .missive .link-tab * {
    cursor: pointer
}

[data-wrapper=browser] .missive .link-a[data-state~=disabled],[data-wrapper=browser] .missive .link-a [data-state~=disabled],[data-wrapper=browser] .missive .link-b[data-state~=disabled],[data-wrapper=browser] .missive .link-b [data-state~=disabled],[data-wrapper=browser] .missive .link-c[data-state~=disabled],[data-wrapper=browser] .missive .link-c [data-state~=disabled],[data-wrapper=browser] .missive .link-delete[data-state~=disabled],[data-wrapper=browser] .missive .link-delete [data-state~=disabled],[data-wrapper=browser] .missive .link-icon-b[data-state~=disabled],[data-wrapper=browser] .missive .link-icon-b [data-state~=disabled],[data-wrapper=browser] .missive .link-icon-c[data-state~=disabled],[data-wrapper=browser] .missive .link-icon-c [data-state~=disabled],[data-wrapper=browser] .missive .link-icon[data-state~=disabled],[data-wrapper=browser] .missive .link-icon [data-state~=disabled],[data-wrapper=browser] .missive .link-tab[data-state~=disabled],[data-wrapper=browser] .missive .link-tab [data-state~=disabled] {
    cursor: default
}

[data-wrapper=electron] .missive .link-a:active,[data-wrapper=electron] .missive .link-b:active,[data-wrapper=electron] .missive .link-c:active,[data-wrapper=electron] .missive .link-delete:active,[data-wrapper=electron] .missive .link-icon-b:active,[data-wrapper=electron] .missive .link-icon-c:active,[data-wrapper=electron] .missive .link-icon:active,[data-wrapper=electron] .missive .link-tab:active {
    color: var(--text-color-b)
}

.missive .link-a[data-state~=disabled],.missive .link-b[data-state~=disabled],.missive .link-c[data-state~=disabled],.missive .link-delete[data-state~=disabled],.missive .link-icon-b[data-state~=disabled],.missive .link-icon-c[data-state~=disabled],.missive .link-icon[data-state~=disabled],.missive .link-tab[data-state~=disabled] {
    color: rgba(var(--text-color-a-rgb),.4)
}

.missive .link-a {
    color: var(--blue-color)
}

.missive-no-touch .missive .link-a:focus,[data-wrapper=browser] .missive-no-touch .missive .link-a:hover {
    color: var(--text-color-a)
}

.missive .link-b {
    color: var(--text-color-b)
}

.missive-no-touch .missive .link-b:focus,[data-wrapper=browser] .missive-no-touch .missive .link-b:hover {
    color: var(--text-color-a)
}

.missive .link-c {
    color: var(--text-color-c)
}

.missive-no-touch .missive .link-c:focus,[data-wrapper=browser] .missive-no-touch .missive .link-c:hover {
    color: var(--text-color-b)
}

.missive .link-underline {
    cursor: pointer;
    position: relative;
    text-decoration: underline;
    -webkit-text-decoration-color: rgba(var(--text-color-a-rgb),.2);
    text-decoration-color: rgba(var(--text-color-a-rgb),.2)
}

.missive-no-touch .missive .link-underline:hover {
    -webkit-text-decoration-color: rgba(var(--text-color-a-rgb),.4);
    text-decoration-color: rgba(var(--text-color-a-rgb),.4)
}

.missive .link-tab {
    color: var(--text-color-d);
    font-weight: 600
}

.missive-no-touch .missive .link-tab.selected,.missive-no-touch .missive .link-tab:focus,[data-wrapper=browser] .missive-no-touch .missive .link-tab:hover {
    color: var(--text-color-a)
}

.missive-no-touch .missive .link-icon-b:focus:not([data-state~=disabled]),.missive-no-touch .missive .link-icon-b:hover:not([data-state~=disabled]),.missive-no-touch .missive .link-icon-c:focus:not([data-state~=disabled]),.missive-no-touch .missive .link-icon-c:hover:not([data-state~=disabled]),.missive-no-touch .missive .link-icon:focus:not([data-state~=disabled]),.missive-no-touch .missive .link-icon:hover:not([data-state~=disabled]),.missive .link-icon-b[data-state~=selected],.missive .link-icon-c[data-state~=selected],.missive .link-icon[data-state~=selected] {
    color: var(--blue-color)
}

.missive .link-icon-b {
    color: var(--text-color-b)
}

.missive .link-icon-c {
    color: var(--text-color-c)
}

.missive .link-button {
    position: relative
}

.missive .link-button:after {
    content: "";
    height: calc(100% + 2em);
    left: -1em;
    position: absolute;
    top: -1em;
    width: calc(100% + 2em)
}

.missive .link-delete {
    color: var(--red-color)
}

.missive-no-touch .missive .link-delete:focus,[data-wrapper=browser] .missive-no-touch .missive .link-delete:hover {
    color: var(--text-color-a)
}

.missive .link-disabled {
    cursor: not-allowed!important;
    opacity: .5
}

.missive .pointer {
    cursor: default
}

.missive .pointer[data-wrapper=browser] {
    cursor: pointer
}

.missive .missive-modal {
    -webkit-animation: scale-big-in var(--material-duration) var(--material-easing);
    animation: scale-big-in var(--material-duration) var(--material-easing);
    text-align: center
}

.missive .missive-modal .missive-modal-message,.missive .missive-modal .missive-modal-title {
    margin: var(--padding)
}

.missive .missive-modal .missive-modal-title {
    line-height: 1.4;
    margin-top: var(--padding-large)
}

.missive .missive-modal .missive-modal-title+.missive-modal-message {
    margin-top: .5em
}

.missive .missive-modal.missive-modal-compact .missive-modal-message,.missive .missive-modal.missive-modal-compact div.missive-modal-title {
    margin: 0
}

.missive .missive-modal-content {
    margin: auto;
    max-width: 100%;
    width: 350px!important
}

.missive .missive-modal-content p+p {
    margin-top: 1em
}

.missive .missive-modal-content img {
    max-height: 100%
}

.missive .missive-modal-content .missive-scroll-horizontal img {
    max-width: 80%
}

.missive .missive-modal-content .missive-scroll-horizontal img+img {
    margin-left: 1em
}

.missive .missive-modal-auto .missive-modal-content {
    width: auto!important
}

.missive .missive-modal-auto .button-macos {
    flex: 0 0 auto
}

.missive .missive-modal-actions,.missive .missive-modal-content {
    padding: var(--padding)
}

.missive .missive-modal-note {
    background-color: var(--light-background-color);
    border-radius: 5px;
    padding: var(--padding);
    text-align: left
}

.missive .missive-modal-inputs {
    margin-top: 1em;
    text-align: left
}

.missive .missive-modal-inputs:first-child {
    margin-top: 0
}

.missive .missive-modal-radios {
    padding-left: var(--padding);
    padding-right: var(--padding)
}

.missive .missive-modal-actions .button-macos {
    padding: 8px 15px
}

.missive-has-touch .missive .missive-modal-actions .button-macos {
    padding: 12px 18px
}

.missive .missive-modal-actions .button-macos+.button-macos {
    margin-left: 10px
}

.missive .missive-modal-actions.missive-columns-vertical .button-macos+.button-macos {
    margin: 6px 0 0
}

.missive .missive-modal-actions .missive-modal-icon {
    padding: 1em 1.5em
}

.missive .missive-modal-actions .missive-modal-icon i {
    display: block
}

.missive.missive-contextmenu {
    bottom: 0;
    display: none;
    left: 0;
    overflow: hidden;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 100
}

.missive.missive-contextmenu[data-state~=visible] {
    display: block
}

.missive.missive-contextmenu .hitzone {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.missive.missive-contextmenu .tooltip {
    left: 100%;
    max-height: 94%;
    max-width: 40%;
    min-width: 180px
}

.missive.missive-contextmenu.missive-contextmenu-popup .hitzone {
    background-color: #000;
    opacity: var(--veil-opacity)
}

.missive.missive-contextmenu.missive-contextmenu-popup .tooltip {
    left: 50%!important;
    transform: translateX(-50%)
}

.missive-no-touch .missive.missive-contextmenu,.missive-no-touch .missive.missive-contextmenu-wrapper {
    bottom: 0!important;
    top: 0!important
}

.missive.missive-tooltip {
    height: 100%;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 100
}

.missive.missive-tooltip time {
    color: currentColor
}

.missive .tooltip {
    -webkit-overflow-scrolling: touch;
    background-color: var(--tooltip-background-color);
    border-radius: var(--border-radius);
    box-shadow: 0 0 0 1px rgba(0,0,0,.05),0 4px 8px rgba(0,0,0,.15);
    overflow-y: auto;
    position: absolute;
    text-align: left;
    z-index: 10
}

.missive .tooltip:not(.tooltip-no-padding) {
    padding: var(--padding-small)
}

.missive .tooltip.tooltip-no-scroll {
    overflow: hidden
}

.missive .tooltip.tooltip-with-checkmark .option:not(.option-no-checkmark) {
    padding-left: 1.6em
}

.missive .tooltip .missive-avatar-provider img {
    color: var(--tooltip-background-color)
}

.missive .tooltip .option {
    border-radius: var(--border-radius-small);
    color: var(--text-color-a);
    cursor: default;
    display: block;
    line-height: 1.3;
    padding: 4px 8px;
    position: relative;
    scroll-margin-top: var(--padding-small)
}

.missive .tooltip .option:not(.option-wrap) {
    white-space: nowrap
}

.missive-has-touch .missive .tooltip .option {
    padding: 8px 12px
}

.missive .tooltip .option[data-state~=cancel] {
    color: var(--red-color)
}

.missive .tooltip .option[data-state~=disabled] {
    color: var(--text-color-d);
    cursor: default
}

.missive .tooltip .option.option-no-padding {
    padding: 0
}

.missive .tooltip .option.option-no-padding-force {
    padding: 0!important
}

.missive .tooltip .option.optgroup-label {
    cursor: default
}

.missive .tooltip .option[data-state~=mixed] .missive-icon-minus,.missive .tooltip .option[data-state~=on] .missive-icon-checkmark {
    left: 4px;
    margin-top: -7px;
    position: absolute;
    top: 50%
}

.missive .tooltip .option[data-state~=mixed] .missive-icon-minus,.missive .tooltip .option[data-state~=mixed] .missive-icon-minus svg,.missive .tooltip .option[data-state~=on] .missive-icon-checkmark,.missive .tooltip .option[data-state~=on] .missive-icon-checkmark svg {
    height: 15px!important;
    width: 15px!important
}

.missive .tooltip .option.focus:not([data-state~=disabled]),.missive .tooltip .option[data-state~=enabled]:hover:not([data-state~=disabled]),.missive .tooltip .option[data-state~=focused]:not([data-state~=disabled]) {
    background-color: var(--blue-color);
    color: #fff
}

.missive .tooltip .option.focus:not([data-state~=disabled]) svg,.missive .tooltip .option[data-state~=enabled]:hover:not([data-state~=disabled]) svg,.missive .tooltip .option[data-state~=focused]:not([data-state~=disabled]) svg {
    fill: #fff!important
}

.missive .tooltip .option.focus:not([data-state~=disabled]) .checkbox:not([data-checked]),.missive .tooltip .option[data-state~=enabled]:hover:not([data-state~=disabled]) .checkbox:not([data-checked]),.missive .tooltip .option[data-state~=focused]:not([data-state~=disabled]) .checkbox:not([data-checked]) {
    color: var(--checkbox-hover-color)
}

.missive .tooltip .option.focus:not([data-state~=disabled]) .text-c,.missive .tooltip .option[data-state~=enabled]:hover:not([data-state~=disabled]) .text-c,.missive .tooltip .option[data-state~=focused]:not([data-state~=disabled]) .text-c {
    color: rgba(255,255,255,.65)
}

.missive .tooltip .option.focus:not([data-state~=disabled]) .note,.missive .tooltip .option[data-state~=enabled]:hover:not([data-state~=disabled]) .note,.missive .tooltip .option[data-state~=focused]:not([data-state~=disabled]) .note {
    color: inherit
}

.missive .tooltip .option.focus:not([data-state~=disabled]) .icon-member-status,.missive .tooltip .option[data-state~=enabled]:hover:not([data-state~=disabled]) .icon-member-status,.missive .tooltip .option[data-state~=focused]:not([data-state~=disabled]) .icon-member-status {
    box-shadow: 0 0 0 2px var(--blue-color)
}

.missive .tooltip .option.focus:not([data-state~=disabled]) .missive-avatar-provider img,.missive .tooltip .option.focus:not([data-state~=disabled]) .missive-user-stack-item,.missive .tooltip .option[data-state~=enabled]:hover:not([data-state~=disabled]) .missive-avatar-provider img,.missive .tooltip .option[data-state~=enabled]:hover:not([data-state~=disabled]) .missive-user-stack-item,.missive .tooltip .option[data-state~=focused]:not([data-state~=disabled]) .missive-avatar-provider img,.missive .tooltip .option[data-state~=focused]:not([data-state~=disabled]) .missive-user-stack-item {
    color: var(--blue-color)
}

.missive .tooltip .option .option-color,.missive .tooltip .option .option-icon {
    margin-right: 6px
}

.missive .tooltip .option.icon-download-small .missive-icon {
    margin-left: -2px
}

.missive .tooltip .option>span {
    display: inline-block
}

.missive .tooltip .option svg {
    transition: none
}

.missive .tooltip .option time {
    color: currentColor
}

.missive .tooltip .option .option-tip {
    float: right;
    padding-left: 8px
}

.missive .tooltip .option .option-tip i {
    margin-right: -6px
}

.missive .tooltip .option .option-nowrap {
    max-width: 300px
}

.missive .tooltip .option .option-color {
    height: 8px;
    width: 8px
}

.missive .tooltip .option .option-shortcut {
    font-size: calc(var(--font-size) - 3px);
    margin-left: 2em;
    margin-right: -.5em;
    min-width: 2em;
    opacity: .5;
    text-align: center
}

.missive .tooltip .option .search {
    padding: 0!important
}

.missive .tooltip .option .search .input {
    padding-bottom: .25em;
    padding-left: 1.45em;
    padding-top: .25em
}

.missive .tooltip .option .search .icon-immersive {
    left: 0;
    position: absolute
}

.missive .tooltip .option .color-flag {
    left: calc(var(--padding-small)*-1)
}

.missive .tooltip .note {
    color: var(--text-color-c);
    font-size: calc(var(--font-size) - 1px)
}

.missive .tooltip .divider {
    display: block;
    line-height: 0;
    padding: 4px var(--padding-small)
}

.missive .tooltip .divider:after {
    background-color: var(--light-border-color);
    content: "";
    display: block;
    height: 1px
}

.missive .tooltip .divider+.divider {
    display: none
}

.missive .tooltip .divider+.optgroup-label,.missive .tooltip>.optgroup-label:first-child {
    padding-top: 0
}

.missive .tooltip .link-a+.link-a:not(.detached-border-top) {
    border-top: 1px solid var(--light-border-color)
}

.missive .tooltip .spinner {
    stroke: var(--blue-color);
    position: static
}

.missive .tooltip-header {
    position: relative
}

.missive .tooltip-header:after {
    background: linear-gradient(to top,var(--section-shadow-color),transparent);
    bottom: 0;
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0
}

.missive .tooltip-header.tooltip-header-padding {
    padding: var(--padding-small)
}

.missive .tooltip-footer {
    position: relative
}

.missive .tooltip-footer:after {
    background: linear-gradient(to bottom,var(--section-shadow-color),transparent);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.missive .tooltip-footer.tooltip-footer-padding {
    padding: var(--padding)
}

.missive .tooltip-footer p+p {
    margin-top: var(--padding-small)
}

.missive .tooltip-footer .list-group-items+.list-group-items {
    border-top-color: rgba(var(--text-color-a-rgb),.05)
}

.missive .tooltip-footer,.missive .tooltip-header {
    background-color: var(--tooltip-header-background-color)
}

.missive .tooltip-content.tooltip-content-padding {
    padding: var(--padding)
}

.missive .tooltip-content .search {
    position: relative
}

.missive .tooltip-content .search:after {
    background: linear-gradient(to bottom,var(--section-shadow-color),transparent);
    bottom: calc(var(--section-shadow-width)*-1);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0
}

.missive-has-touch .missive .tooltip-content .search .input {
    padding: 15px 0
}

.missive .tooltip-buttons,.missive .tooltip-content {
    background-color: var(--tooltip-content-background-color)
}

.missive .tooltip-buttons .icon-member-status,.missive .tooltip-content .icon-member-status {
    box-shadow: 0 0 0 2px var(--tooltip-content-background-color)
}

.missive .tooltip-buttons .missive-user-stack-item,.missive .tooltip-content .missive-user-stack-item {
    color: var(--tooltip-content-background-color)
}

.missive .tooltip-buttons .button-macos {
    padding: var(--padding-medium)
}

.missive .tooltip-footer+.tooltip-buttons {
    position: relative
}

.missive .tooltip-footer+.tooltip-buttons:after {
    background: linear-gradient(to top,var(--section-shadow-color),transparent);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0;
    top: calc(var(--section-shadow-width)*-1)
}

.missive .tooltip-footer+.tooltip-buttons .button-macos-full:first-child {
    border-top: 0
}

.missive-has-touch .missive .tooltip-buttons .button-macos-full .button-macos,.missive-has-touch .missive .tooltip-content .button-macos-full .button-macos {
    padding: var(--padding-medium)
}

.missive-has-touch .missive .tooltip-buttons .button-macos-full .button-macos-small,.missive-has-touch .missive .tooltip-content .button-macos-full .button-macos-small {
    padding: var(--padding)
}

.missive .tooltip-bottom {
    transform: translateY(-100%)
}

.missive .tooltip-hint {
    background-color: var(--tooltip-hint-background-color);
    border-radius: 3px;
    color: #fff;
    font-size: calc(var(--font-size) - 3px);
    font-style: normal;
    font-weight: 600;
    max-width: 250px;
    opacity: 0;
    padding: .25em .7em .45em;
    pointer-events: none;
    position: absolute;
    text-align: center;
    transition: opacity .15s ease-out;
    z-index: 100
}

.missive .tooltip-hint:before {
    border-bottom-color: transparent;
    border: var(--tooltip-hint-size) solid transparent;
    border-bottom: var(--tooltip-hint-size) solid;
    color: var(--tooltip-hint-background-color);
    content: "";
    height: 0;
    left: 50%;
    margin-left: calc(var(--tooltip-hint-size)*-1);
    pointer-events: none;
    position: absolute;
    top: calc(var(--tooltip-hint-size)*-2);
    width: 0
}

.missive .tooltip-hint:after {
    bottom: -5px;
    content: "";
    left: -5px;
    pointer-events: none;
    position: absolute;
    right: -5px;
    top: -5px;
    z-index: -1
}

.missive .tooltip-hint.tooltip-hint-top {
    margin-bottom: var(--tooltip-hint-size)
}

.missive .tooltip-hint.tooltip-hint-top:before {
    border-bottom-color: transparent;
    border-top-color: currentColor;
    top: 100%
}

.missive .tooltip-hint.tooltip-hint-bottom {
    margin-top: var(--tooltip-hint-size)
}

.missive .tooltip-hint.tooltip-hint-bottom.tooltip-hint-left,.missive .tooltip-hint.tooltip-hint-top.tooltip-hint-left {
    transform: translateX(calc(var(--tooltip-hint-size)*-3))
}

.missive .tooltip-hint.tooltip-hint-bottom.tooltip-hint-left:before,.missive .tooltip-hint.tooltip-hint-top.tooltip-hint-left:before {
    left: calc(var(--tooltip-hint-size)*2);
    margin-left: 0
}

.missive .tooltip-hint.tooltip-hint-bottom.tooltip-hint-center,.missive .tooltip-hint.tooltip-hint-top.tooltip-hint-center {
    transform: translateX(-50%)
}

.missive .tooltip-hint.tooltip-hint-bottom.tooltip-hint-right,.missive .tooltip-hint.tooltip-hint-top.tooltip-hint-right {
    transform: translateX(calc(var(--tooltip-hint-size)*3))
}

.missive .tooltip-hint.tooltip-hint-bottom.tooltip-hint-right:before,.missive .tooltip-hint.tooltip-hint-top.tooltip-hint-right:before {
    left: auto;
    margin-left: 0;
    right: calc(var(--tooltip-hint-size)*2)
}

.missive .tooltip-hint.tooltip-hint-middle {
    transform: translateY(-50%)
}

.missive .tooltip-hint.tooltip-hint-middle:before {
    border-bottom-color: transparent;
    border-right-color: currentColor;
    left: auto;
    margin-top: calc(var(--tooltip-hint-size)*-1);
    right: 100%;
    top: 50%
}

.missive .tooltip-hint.tooltip-hint-middle.tooltip-hint-left {
    margin-left: var(--tooltip-hint-size)
}

.missive .tooltip-hint.tooltip-hint-middle.tooltip-hint-right {
    margin-right: var(--tooltip-hint-size)
}

.missive .tooltip-hint.tooltip-hint-middle.tooltip-hint-right:before {
    border-left-color: currentColor;
    border-right-color: transparent;
    left: 100%;
    margin-left: 0;
    right: auto
}

.missive .tooltip-hint .link-a {
    color: #8db4ff
}

.missive-no-touch .missive .tooltip-hint .link-a:hover {
    color: #a6c5ff
}

.missive .tooltip-hint .missive-tooltip-button {
    margin: .5em 0 .2em
}

.missive .tooltip-hint .detached-border-bottom:after,.missive .tooltip-hint .detached-border-top:after {
    left: 0;
    opacity: .55;
    right: 0
}

.missive .tooltip-hint .border-top {
    margin-top: 1em;
    padding-top: .7em
}

.missive .tooltip-hint p+p {
    margin-top: .6em
}

.missive .tooltip-hint .text-b {
    color: #aaa;
    font-size: calc(var(--font-size) - 4px)
}

.missive .tooltip-hint .text-c {
    color: inherit;
    font-weight: 500;
    opacity: .65
}

.missive .tooltip-hint .missive-user-stack-item {
    color: var(--tooltip-hint-background-color)
}

.missive .tooltip-hint .reaction-emoji {
    background-color: #fff;
    border-radius: 6px;
    padding: 4px
}

.missive .tooltip-hint[data-state=visible],.missive .tooltip-trigger:hover+.tooltip-hint {
    opacity: 1;
    pointer-events: auto
}

.missive .missive-tooltip-button {
    background-color: rgba(255,255,255,.33);
    border-radius: 3px;
    cursor: default;
    display: block;
    padding: .3em .6em .4em
}

.missive .heading-a,.missive .heading-b,.missive .heading-c {
    margin: 0
}

.missive .heading-a {
    color: var(--heading-color);
    font-size: 44px;
    font-weight: 300;
    line-height: 1
}

.missive .heading-b {
    color: var(--heading-color);
    font-size: 21px;
    font-weight: 400;
    line-height: 1.25
}

.missive .heading-c {
    font-size: 17px;
    font-weight: 400;
    line-height: 1.15
}

.missive .heading-d {
    color: var(--text-color-b);
    font-weight: 500
}

.missive .subheading-a {
    color: var(--text-color-c);
    line-height: 1.35
}

.missive .text-a {
    color: var(--text-color-a)
}

.missive .text-b {
    color: var(--text-color-b)
}

.missive .text-c {
    color: var(--text-color-c)
}

.missive .text-d {
    color: var(--text-color-d)
}

.missive .text-e {
    color: var(--text-color-e)
}

.missive .text-c.text-dotted {
    -webkit-text-decoration-color: var(--text-color-e);
    text-decoration-color: var(--text-color-e)
}

.missive .text-dotted {
    cursor: help;
    -webkit-text-decoration-line: underline;
    text-decoration-line: underline;
    -webkit-text-decoration-style: dotted;
    text-decoration-style: dotted;
    text-underline-offset: 2px
}

.missive .text-error {
    color: var(--red-color)
}

.missive .text-error a {
    color: var(--red-link-color)
}

.missive .text-error b,.missive .text-error strong {
    font-weight: 600
}

.missive .text-error ol,.missive .text-error p,.missive .text-error ul {
    margin-bottom: calc(var(--font-size) - 4px);
    margin-top: calc(var(--font-size) - 4px)
}

.missive .text-error ol:first-child,.missive .text-error p:first-child,.missive .text-error ul:first-child {
    margin-top: 0
}

.missive .text-error ol:last-child,.missive .text-error p:last-child,.missive .text-error ul:last-child {
    margin-bottom: 0
}

.missive .text-error ol,.missive .text-error ul {
    padding-left: calc(var(--font-size) + 12px)
}

.missive .text-blue {
    color: var(--blue-color)
}

.missive .strong {
    font-weight: 600
}

.missive .italic {
    font-style: italic
}

.missive .hyphens {
    -webkit-hyphens: auto;
    hyphens: auto
}

.missive .text-detail {
    color: var(--text-color-c);
    font-size: calc(var(--font-size) - 2px);
    line-height: 1.25
}

p+.missive .text-detail {
    margin-top: 0
}

.missive .text-detail strong {
    color: var(--text-color-a);
    font-weight: 400
}

.missive sup {
    top: -.35em
}

.missive .text-xsmall {
    font-size: calc(var(--font-size) - 3px);
    line-height: 1.5
}

.missive .text-small {
    font-size: calc(var(--font-size) - 1px)
}

.missive .text-medium {
    font-size: calc(var(--font-size) + 3px)
}

.missive .text-large {
    font-size: calc(var(--font-size) + 6px);
    line-height: 1.35
}

.missive time {
    color: var(--text-color-c);
    font-size: calc(var(--font-size) - 3px)
}

.missive time.snoozed {
    color: var(--orange-color)
}

.missive.missive-view-account {
    background-color: var(--background-color);
    color: var(--text-color-a);
    position: relative
}

.missive.missive-view-account:after {
    background: linear-gradient(to left,var(--section-shadow-color),transparent);
    bottom: 0;
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    width: var(--section-shadow-width)
}

.missive.missive-view-account .mailbox-label-icon {
    color: var(--text-color-b)
}

.missive.missive-view-account .missive-scroll {
    margin-bottom: 1px;
    padding-bottom: var(--safe-area-inset-bottom)
}

.missive.missive-view-account .missive-scroll-shadow-bottom {
    opacity: 1
}

.missive .sidebar-sections {
    overflow: hidden;
    padding: var(--padding);
    padding-top: 0;
    position: relative
}

[data-notch=left] .missive .sidebar-sections .list-item {
    padding-left: calc(var(--safe-area-inset-left)/1.5 + 30px)!important
}

[data-notch=left] .missive .sidebar-sections .list-item .collapsable-box-toggle {
    margin-left: calc(var(--safe-area-inset-left)/1.5)!important
}

[data-size=x-small] .missive .sidebar-sections .list-subtitle .collapsable-box-toggle {
    top: -1px
}

.missive .sidebar-sections .list-group {
    border-radius: var(--border-radius);
    margin-bottom: 8px
}

.missive .sidebar-sections .dropzone,.missive .sidebar-sections .list-item {
    border-radius: var(--border-radius)
}

.missive .sidebar-sections .list-subtitle {
    padding: 4px 8px
}

.missive .sidebar-sections .list-item {
    border: 0;
    padding: 8px;
    position: relative
}

.missive-has-touch .missive .sidebar-sections .list-item {
    padding: var(--padding)
}

.missive .sidebar-sections .list-item[data-state~=selected]:not([data-conversation-id]),html[data-state~=unfocused] .missive .sidebar-sections .list-item[data-state~=selected][data-conversation-id] {
    background-color: var(--light-border-color);
    position: relative
}

.missive .sidebar-sections .list-item[data-state~=selected]:not([data-conversation-id]) .missive-avatar-sidebar-generic-account,html[data-state~=unfocused] .missive .sidebar-sections .list-item[data-state~=selected][data-conversation-id] .missive-avatar-sidebar-generic-account {
    color: var(--light-border-color)
}

.missive .sidebar-sections .list-item[data-state~=selected]:not([data-conversation-id]) .icon-member-status,html[data-state~=unfocused] .missive .sidebar-sections .list-item[data-state~=selected][data-conversation-id] .icon-member-status {
    box-shadow: 0 0 0 2px var(--light-border-color)
}

.missive .sidebar-sections .list-item .button-macos {
    color: var(--text-color-c);
    padding: 2px 5px
}

html[data-size=small] .missive .sidebar-sections .list-item .button-macos,html[data-size=x-small] .missive .sidebar-sections .list-item .button-macos {
    padding: 1px 5px
}

.missive .sidebar-sections .draggable-list-item[data-droppable] {
    padding-bottom: 2px;
    padding-top: 2px
}

.missive .sidebar-sections .draggable-list-item[data-droppable] .list-item {
    background-color: var(--light-border-color);
    border-radius: 5px;
    padding-bottom: 6px;
    padding-top: 5px
}

.missive .sidebar-sections .draggable-list-item[data-dropping] .list-item {
    background-color: var(--blue-color)
}

.missive .sidebar-sections .draggable-list-item[data-dropping] .list-item,.missive .sidebar-sections .draggable-list-item[data-dropping] .list-item .list-item-icon {
    color: #fff
}

.missive .sidebar-sections .show-on-item-drag,.missive .sidebar-sections[data-dragging-item] .hide-on-item-drag {
    display: none
}

.missive .sidebar-sections[data-dragging-item] .show-on-item-drag {
    display: block
}

.missive .sidebar-sections div[data-dragging] {
    background-color: var(--light-border-color);
    opacity: .85;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1000
}

.missive .sidebar-sections .list-item-icon {
    color: var(--sidebar-icons-color);
    height: 17px;
    margin-right: 8px;
    position: relative;
    width: 17px
}

.missive .sidebar-sections .missive-icon-collapsable-arrow {
    color: var(--sidebar-toggle-color);
    margin-left: 0
}

.missive .sidebar-sections .count-types {
    margin-left: .5em
}

.missive .sidebar-sections .color-flag {
    display: none
}

.missive .sidebar-sections img {
    pointer-events: none
}

.missive .collapsable-box-toggle {
    height: 100%;
    position: absolute;
    top: 0
}

.missive .collapsable-box-toggle .missive-icon-collapsable-arrow {
    color: var(--sidebar-toggle-color);
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%)
}

.missive-no-touch .missive .collapsable-box-toggle:hover .missive-icon-collapsable-arrow {
    color: var(--sidebar-toggle-hover-color)
}

html[data-state~=focused][data-scope=mailboxes] .missive .sidebar-sections .list-item[data-state~=selected]:not([data-conversation-id]),html[data-state~=focused][data-scope=pins] .missive .sidebar-sections .list-item[data-state~=selected][data-conversation-id] {
    background-color: var(--blue-color);
    color: #fff
}

html[data-state~=focused][data-scope=mailboxes] .missive .sidebar-sections .list-item[data-state~=selected]:not([data-conversation-id]) svg,html[data-state~=focused][data-scope=pins] .missive .sidebar-sections .list-item[data-state~=selected][data-conversation-id] svg {
    fill: #fff!important
}

html[data-state~=focused][data-scope=mailboxes] .missive .sidebar-sections .list-item[data-state~=selected]:not([data-conversation-id]) .text-detail,html[data-state~=focused][data-scope=pins] .missive .sidebar-sections .list-item[data-state~=selected][data-conversation-id] .text-detail {
    color: rgba(255,255,255,.75)
}

html[data-state~=focused][data-scope=mailboxes] .missive .sidebar-sections .list-item[data-state~=selected]:not([data-conversation-id]) .missive-avatar-sidebar-generic-account,html[data-state~=focused][data-scope=pins] .missive .sidebar-sections .list-item[data-state~=selected][data-conversation-id] .missive-avatar-sidebar-generic-account {
    color: var(--blue-color)
}

html[data-state~=focused][data-scope=mailboxes] .missive .sidebar-sections .list-item[data-state~=selected]:not([data-conversation-id]) .icon-member-status,html[data-state~=focused][data-scope=pins] .missive .sidebar-sections .list-item[data-state~=selected][data-conversation-id] .icon-member-status {
    box-shadow: 0 0 0 2px var(--blue-color)
}

html[data-state~=focused][data-scope=mailboxes] .missive .sidebar-sections .list-item[data-state~=selected]:not([data-conversation-id]) .missive-user-stack-item,html[data-state~=focused][data-scope=pins] .missive .sidebar-sections .list-item[data-state~=selected][data-conversation-id] .missive-user-stack-item {
    color: var(--blue-color)!important
}

.missive .progress-import {
    overflow: hidden;
    padding: .5em 10px .5em .75em;
    transition: height .2s var(--easing)
}

.missive .progress-import.importing-enter {
    height: 0
}

.missive .progress-import.importing-enter.importing-enter-active,.missive .progress-import.importing-leave {
    height: 51px
}

.missive .progress-import.importing-leave.importing-leave-active {
    height: 0
}

.missive .progress-import .missive-icon-close {
    margin-left: .5em
}

.missive .progress-import-dots {
    display: inline-block;
    white-space: nowrap;
    width: 0
}

.missive .account-menu {
    padding: 8px var(--padding)
}

.missive .offline-notifier {
    line-height: 1
}

.missive.missive-view-calendar {
    background-color: var(--conversation-list-background-color);
    overflow: hidden
}

.missive .missive-calendar {
    cursor: default
}

.missive .missive-calendar .top-bar .spinner {
    stroke: var(--blue-color)
}

.missive .missive-calendar .top-bar .row+.row {
    margin-top: .2em
}

.missive .missive-calendar .top-bar .missive-select {
    border: none;
    border-radius: var(--border-radius)
}

.missive .missive-calendar .missive-calendar-invite-header {
    background-color: var(--light-background-color)
}

.missive .missive-calendar[data-dragging] .missive-calendar-event {
    pointer-events: none
}

.missive .missive-calendar[data-generic] [data-layout=month] {
    border: 1px solid rgba(var(--text-color-a-rgb),.08);
    border-radius: var(--border-radius);
    margin-top: var(--padding);
    overflow: hidden
}

.missive .missive-calendar[data-generic] .missive-calendar-day {
    box-shadow: 1px 0 rgba(var(--text-color-a-rgb),.05),0 -1px rgba(var(--text-color-a-rgb),.05);
    padding: 0
}

.missive .missive-calendar[data-generic] .missive-calendar-date {
    margin: 5px
}

.missive .missive-calendar[data-generic] .missive-calendar-weekdays {
    background-color: var(--background-color);
    border-bottom: 1px solid rgba(var(--text-color-a-rgb),.05);
    padding: 3px 0
}

.missive .missive-calendar[data-events] .missive-calendar-day[data-state~=today] .missive-calendar-date {
    background-color: var(--red-color);
    color: #fff
}

.missive .missive-calendar[data-events] [data-layout=month],.missive .missive-calendar[data-events] [data-layout=month] .missive-calendar-day {
    position: relative
}

.missive .missive-calendar[data-events] [data-layout=month] .missive-calendar-weekdays {
    position: absolute;
    top: 4px;
    width: 100%
}

.missive .missive-calendar[data-events] [data-layout=month] .missive-calendar-week-1 .missive-calendar-day {
    padding-top: 1.5em
}

.missive .missive-calendar[data-events] [data-layout=month] .missive-calendar-events {
    padding-top: 4px
}

.missive .missive-calendar[data-events] [data-layout=month] .icon-unseen {
    background-color: var(--text-color-d);
    height: 5px;
    margin: 4px 0;
    width: 5px
}

.missive .missive-calendar[data-events] [data-layout=month] .icon-unseen:before {
    display: none
}

.missive .missive-calendar[data-events] [data-layout=month] .icon-unseen+.icon-unseen {
    margin-left: 1px
}

.missive .missive-calendar[data-events] [data-layout=month] [data-layout=agenda] .bar {
    background-color: transparent;
    border-top: 1px solid var(--background-color)
}

.missive .missive-calendar[data-events] [data-layout=month] [data-layout=agenda] .missive-calendar-events {
    padding: var(--padding-small)
}

.missive .missive-calendar[data-events] [data-layout=day] .missive-scroll,.missive .missive-calendar[data-events] [data-layout=week] .missive-scroll {
    border-top: 1px solid var(--light-border-color);
    overflow-x: hidden!important
}

.missive-has-scrollbar .missive .missive-calendar[data-events] [data-layout=day] .missive-scroll,.missive-has-scrollbar .missive .missive-calendar[data-events] [data-layout=week] .missive-scroll {
    overflow-y: scroll!important
}

.missive .missive-calendar[data-events] [data-layout=day] .missive-calendar-hour,.missive .missive-calendar[data-events] [data-layout=week] .missive-calendar-hour {
    box-shadow: 1px 0 var(--light-border-color)
}

.missive .missive-calendar[data-events] [data-layout=day] .missive-calendar-day,.missive .missive-calendar[data-events] [data-layout=week] .missive-calendar-day {
    position: relative
}

.missive .missive-calendar[data-events] [data-layout=day] .missive-calendar-weekdays .missive-calendar-day {
    padding-left: .8em
}

.missive .missive-calendar[data-events] [data-layout=agenda] .missive-calendar-event {
    padding-bottom: 5px;
    padding-left: 2.2em;
    padding-top: 5px
}

.missive .missive-calendar[data-events] [data-layout=agenda] .missive-calendar-event .missive-calendar-event-background {
    border-radius: 14px
}

.missive .missive-calendar[data-events] [data-layout=agenda] .missive-calendar-event-title {
    font-size: 1.2em
}

.missive .missive-calendar[data-events] [data-layout=agenda] .missive-calendar-event-color {
    bottom: 8px;
    height: auto!important;
    left: 9px;
    margin: 0;
    top: 8px
}

.missive .missive-calendar[data-events] [data-layout=agenda] .missive-calendar-event-icon {
    left: 0;
    margin: 0 .4em 0 0;
    position: relative;
    top: 0
}

.missive .missive-calendar[data-events] [data-layout=agenda] .missive-calendar-event-icon,.missive .missive-calendar[data-events] [data-layout=agenda] .missive-calendar-event-icon svg {
    height: 11px!important;
    width: 11px!important
}

.missive .missive-calendar[data-events] [data-layout=agenda] .missive-calendar-day {
    box-shadow: none;
    padding: 6px 0
}

.missive .missive-calendar[data-events] .missive-calendar-day {
    box-shadow: 1px 0 rgba(var(--text-color-a-rgb),.05),0 -1px rgba(var(--text-color-a-rgb),.05);
    padding: 4px 0
}

.missive .missive-calendar-layouts {
    position: relative;
    z-index: 0
}

.missive .missive-calendar-layouts .missive-calendar-layout {
    height: 100%;
    left: 0;
    overflow: hidden;
    position: absolute;
    top: 0;
    width: 100%
}

.missive .missive-calendar-layouts .missive-calendar-layout+.missive-calendar-layout {
    box-shadow: -1px 0 0 var(--light-border-color)
}

.missive .missive-calendar-layouts .missive-calendar-layout-before {
    transform: translateX(-100%)
}

.missive .missive-calendar-layouts .missive-calendar-layout-after {
    transform: translateX(100%)
}

.missive .missive-calendar-hour {
    padding-right: 9px;
    text-align: right
}

.missive .missive-calendar-hour hr {
    border: solid var(--light-border-color);
    border-width: 1px 0 0;
    margin: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    z-index: 1
}

.missive .missive-calendar-hour span {
    display: block;
    transform: translateY(-50%)
}

.missive .missive-calendar-today {
    background-color: var(--red-color);
    height: 2px;
    left: 0;
    position: absolute;
    right: 0;
    z-index: 10
}

.missive .missive-calendar-today:before {
    background-color: var(--red-color);
    border-radius: 100%;
    content: "";
    height: 12px;
    left: 0;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 12px
}

.missive .missive-calendar-header {
    padding: .75em .5em
}

.missive .missive-calendar-weekdays {
    font-size: calc(1em - 2px);
    text-align: center
}

.missive .missive-calendar-day {
    padding: 1px
}

.missive .missive-calendar-day[data-state~=today] .missive-calendar-date {
    background-color: rgba(var(--text-color-a-rgb),.1)
}

.missive .missive-calendar-day[data-state~=timestamp] .missive-calendar-date {
    background-color: var(--orange-color)!important;
    color: #fff
}

.missive .missive-calendar-day[data-state~=selected] .missive-calendar-date {
    background-color: var(--blue-color)!important;
    color: #fff
}

.missive .missive-calendar-day[data-state~=disabled] .missive-calendar-date {
    background-color: transparent!important;
    color: var(--text-color-e)
}

.missive .missive-calendar-date {
    border-radius: 100%;
    display: inline-block;
    height: 29px;
    width: 29px
}

.missive-no-touch .missive .missive-calendar-date:hover {
    background-color: rgba(var(--text-color-a-rgb),.1)
}

.missive .missive-calendar-weekend-day {
    background-color: rgba(var(--background-color-rgb),.75)
}

.missive .missive-calendar-agenda {
    background-color: var(--background-color);
    box-shadow: 0 -1px var(--light-border-color);
    padding: 0 .5em
}

.missive .missive-calendar-agenda .group {
    padding: 1.25em .75em;
    width: 33.33%
}

.missive .missive-calendar-agenda .group-days,.missive .missive-calendar-agenda .group-title {
    background-color: var(--conversation-list-background-color)
}

.missive .missive-calendar-agenda .group-title {
    border-radius: 10px 10px 0 0;
    position: relative
}

.missive .missive-calendar-agenda .group-title .heading-c {
    font-weight: 500
}

.missive .missive-calendar-agenda .group-title .missive-scroll-shadow-top {
    bottom: 0;
    left: 0;
    position: absolute;
    width: 100%
}

.missive .missive-calendar-agenda .group-days,.missive .missive-calendar-agenda .missive-scroll {
    border-radius: 0 0 10px 10px
}

.missive .missive-calendar-agenda .group-days {
    padding-top: 0
}

.missive .missive-calendar-event {
    padding: 0 8px 1px 15px;
    position: relative;
    z-index: 1
}

.missive .missive-calendar-event[data-full-day] {
    color: var(--conversation-list-background-color)
}

.missive .missive-calendar-event[data-full-day] .missive-calendar-event-time {
    color: inherit;
    opacity: .8
}

.missive .missive-calendar-event[data-full-day][data-start] .missive-calendar-event-background {
    border-bottom-left-radius: 4px;
    border-top-left-radius: 4px;
    left: 3px
}

.missive .missive-calendar-event[data-full-day][data-end] .missive-calendar-event-background {
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px;
    right: 2px
}

.missive .missive-calendar-event[data-full-day][data-status=declined] .missive-calendar-event-time,.missive .missive-calendar-event[data-full-day][data-status=needs_action] .missive-calendar-event-time,.missive .missive-calendar-event[data-full-day][data-status=tentative] .missive-calendar-event-time {
    color: unset
}

.missive .missive-calendar-event[data-full-day][data-status=declined] .missive-calendar-event-background,.missive .missive-calendar-event[data-full-day][data-status=needs_action] .missive-calendar-event-background,.missive .missive-calendar-event[data-full-day][data-status=tentative] .missive-calendar-event-background {
    background-color: var(--conversation-list-background-color);
    border: 1px dashed transparent;
    border-width: 1px 0
}

.missive .missive-calendar-event[data-full-day][data-status=declined][data-start] .missive-calendar-event-background,.missive .missive-calendar-event[data-full-day][data-status=needs_action][data-start] .missive-calendar-event-background,.missive .missive-calendar-event[data-full-day][data-status=tentative][data-start] .missive-calendar-event-background {
    border-left-width: 1px
}

.missive .missive-calendar-event[data-full-day][data-status=declined][data-end] .missive-calendar-event-background,.missive .missive-calendar-event[data-full-day][data-status=needs_action][data-end] .missive-calendar-event-background,.missive .missive-calendar-event[data-full-day][data-status=tentative][data-end] .missive-calendar-event-background {
    border-right-width: 1px
}

.missive .missive-calendar-event[data-full-day][data-status=tentative] .missive-calendar-event-background {
    border-color: var(--shadow-color)
}

.missive .missive-calendar-event[data-same-day][data-status=tentative] .missive-calendar-event-color {
    background-image: repeating-linear-gradient(45deg,var(--conversation-list-background-color) 0,var(--conversation-list-background-color) 1px,transparent 0,transparent 50%);
    background-size: 3px 3px
}

.missive .missive-calendar-event[data-dimmed] {
    filter: saturate(0)
}

.missive .missive-calendar-event[data-status=declined] {
    color: var(--text-color-c);
    opacity: .7;
    text-decoration: line-through
}

.missive .missive-calendar-event[data-status=declined] .missive-calendar-event-time,.missive .missive-calendar-event[data-status=declined] .missive-calendar-event-title {
    opacity: .6
}

.missive .missive-calendar-event+.missive-calendar-event {
    margin-top: 2px
}

.missive .missive-calendar-event .missive-calendar-event-content {
    position: relative;
    z-index: 1
}

.missive .missive-calendar-event .missive-calendar-event-background {
    bottom: 0;
    left: 0;
    overflow: hidden;
    position: absolute;
    right: 0;
    top: 0
}

.missive .missive-calendar-event .missive-calendar-event-background:before {
    background-color: rgba(var(--text-color-a-rgb),.1);
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.missive .missive-calendar-event.hover .missive-calendar-event-background:before {
    content: ""
}

.missive .missive-calendar-event-more {
    margin-top: 0!important
}

.missive-no-touch .missive .missive-calendar-event-more:hover {
    color: var(--text-color-b)
}

.missive .missive-calendar-event-placeholder {
    pointer-events: none
}

.missive .missive-calendar-event-absolute {
    left: 0;
    margin-top: 0!important;
    padding: 4px 8px 0 10px;
    position: absolute;
    right: 0;
    z-index: 2
}

.missive .missive-calendar-event-absolute[data-depth] {
    margin-top: 0;
    right: 1px
}

.missive .missive-calendar-event-absolute[data-depth] .missive-calendar-event-background {
    box-shadow: 0 0 0 1px var(--conversation-list-background-color),1px 1px 0 1px var(--light-border-color)
}

.missive .missive-calendar-event-absolute .missive-calendar-event-background {
    bottom: 1px;
    top: 2px
}

.missive .missive-calendar-event-small {
    padding-top: 0
}

.missive .missive-calendar-event-small .missive-calendar-event-content {
    height: 100%
}

.missive .missive-calendar-event-small .missive-calendar-event-background {
    bottom: 0
}

.missive .missive-calendar-event-color,.missive .missive-calendar-event-icon {
    left: 4px;
    margin-top: -4px;
    position: absolute;
    top: 50%
}

.missive .missive-calendar-event-color,.missive .missive-calendar-event-color svg,.missive .missive-calendar-event-icon,.missive .missive-calendar-event-icon svg {
    height: 8px!important;
    width: 8px!important
}

.missive .missive-calendar-event-color {
    border: 1px solid transparent;
    border-radius: 10em;
    display: block
}

.missive .missive-calendar-event-title {
    font-weight: 500
}

.missive .missive-calendar-event-title .missive-icon {
    color: inherit;
    margin-right: 5px;
    opacity: .8;
    top: 1px;
    vertical-align: baseline
}

.missive .missive-calendar-event-title .missive-icon:before {
    display: none
}

.missive .missive-calendar-event-title .missive-icon,.missive .missive-calendar-event-title .missive-icon svg {
    height: 11px!important;
    width: 11px!important
}

.missive .missive-calendar+.missive-datetime-picker {
    margin-top: var(--padding)
}

.missive .missive-datetime-picker input {
    background-color: transparent;
    border: 0;
    border-radius: 2px;
    color: var(--text-color-a);
    font-family: Helvetica Neue,Helvetica,Arial,sans-serif;
    padding: 0 1px
}

.missive-no-touch .missive .missive-datetime-picker input[data-state~=enabled]:hover {
    background-color: rgba(var(--text-color-a-rgb),.1)
}

.missive .missive-datetime-picker input[data-state~=disabled] {
    color: var(--text-color-c)
}

.missive .missive-datetime-picker input[size="2"] {
    width: 1.3em
}

.missive .missive-datetime-picker input[size="4"] {
    width: 2.4em
}

.missive .missive-datetime-picker [data-state~=error] .text-c,.missive .missive-datetime-picker [data-state~=error] input,.missive .missive-datetime-picker [data-state~=error] span {
    color: var(--red-color)
}

.missive .missive-datetime-picker-ampm {
    border-radius: 2px;
    cursor: default;
    margin-left: .1em;
    padding: 0 .125em
}

.missive-no-touch .missive .missive-datetime-picker-ampm[data-state~=enabled]:hover {
    background-color: rgba(var(--text-color-a-rgb),.1)
}

.missive .missive-datetime-picker-ampm[data-state~=disabled] {
    color: #545454
}

.missive .missive-datetime-picker-input-parent {
    position: relative
}

.missive .missive-datetime-picker-mobile-input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.missive .calendar-event .spinner,.missive .missive-calendar .spinner {
    stroke: var(--text-color-e);
    left: 0;
    position: static;
    top: 0
}

.missive .calendar-event strong {
    font-weight: 500
}

.missive .calendar-event .calendar-event-details,.missive .calendar-event .calendar-event-header {
    padding-left: 0
}

.missive .calendar-event .calendar-event-details {
    padding-top: 0
}

.missive .calendar-event .preferences-box .preferences-box {
    background-color: var(--light-border-color);
    border: 0;
    padding: .3em .6em;
    position: relative
}

.missive .calendar-event .preferences-box p+p {
    margin-top: 0
}

.missive .calendar-event .preferences-box ol,.missive .calendar-event .preferences-box ul {
    padding-left: 30px
}

.missive .calendar-event .preferences-box .missive-max-height-gradient {
    background-image: linear-gradient(to bottom,rgba(var(--background-color-rgb),0) 0,var(--light-background-color) 72%)
}

.missive .calendar-event .button-white[data-selected],.missive .calendar-invite .button-white[data-selected] {
    border-color: rgba(0,0,0,.2)!important
}

.missive .calendar-event .button-white[data-selected][data-status=accepted],.missive .calendar-event .button-white[data-selected][data-status=declined],.missive .calendar-invite .button-white[data-selected][data-status=accepted],.missive .calendar-invite .button-white[data-selected][data-status=declined] {
    color: #fff
}

.missive .calendar-event .button-white[data-selected][data-status=accepted],.missive .calendar-invite .button-white[data-selected][data-status=accepted] {
    background-color: var(--green-color)
}

.missive .calendar-event .button-white[data-selected][data-status=declined],.missive .calendar-invite .button-white[data-selected][data-status=declined] {
    background-color: var(--red-color)
}

.missive .calendar-event .button-white[data-selected][data-status=tentative],.missive .calendar-invite .button-white[data-selected][data-status=tentative] {
    background-color: var(--yellow-color);
    color: #2d2e2d
}

@media(max-width: 390px) {
    .missive .calendar-event .button-group,.missive .calendar-event .button-group .button,.missive .calendar-invite .button-group,.missive .calendar-invite .button-group .button {
        flex:1 1 0px
    }

    .missive .calendar-event .button-group .button,.missive .calendar-invite .button-group .button {
        padding-left: 0;
        padding-right: 0;
        text-align: center
    }

    .missive .calendar-event .button-group .button+.button,.missive .calendar-invite .button-group .button+.button {
        margin-left: .4em
    }
}

.missive .calendar-event-form .missive-emoji-input .input {
    padding: .6em 3.1em
}

.missive .calendar-event-form .missive-emoji-input .missive-popup-status-icon {
    padding: 0 .7em 0 .8em
}

.missive .calendar-event-guests strong {
    font-weight: 500
}

.missive .calendar-event-guests .icon-status {
    border-radius: 100%;
    bottom: 0;
    box-shadow: 0 0 0 2px var(--light-background-color);
    color: #fff;
    position: absolute;
    right: -2px
}

.missive .calendar-event-guests .icon-status[data-status=accepted] {
    background-color: var(--green-color)
}

.missive .calendar-event-guests .icon-status[data-status=declined] {
    background-color: var(--red-color)
}

.missive .calendar-event-guests .icon-status[data-status=tentative] {
    background-color: var(--yellow-color)
}

.missive .calendar-event-guest-actions {
    margin: 0 .6em 0 1em
}

.missive .calendar-event-custom-recurrence .day,.missive .calendar-event-custom-recurrence .month,.missive .calendar-event-custom-recurrence .weekday {
    background-color: var(--light-background-color);
    font-weight: 600
}

.missive .calendar-event-custom-recurrence .day[data-selected],.missive .calendar-event-custom-recurrence .month[data-selected],.missive .calendar-event-custom-recurrence .weekday[data-selected] {
    background-color: var(--blue-color);
    color: #fff
}

.missive .calendar-event-custom-recurrence .day,.missive .calendar-event-custom-recurrence .month {
    border-radius: 4px;
    height: 32px;
    margin-bottom: 4px;
    margin-right: 4px
}

.missive .calendar-event-custom-recurrence .weekday {
    border-radius: 100%;
    height: 28px;
    width: 28px
}

.missive .calendar-event-custom-recurrence .weekday+.weekday {
    margin-left: 8px
}

.missive .calendar-event-custom-recurrence .days {
    max-width: 252px
}

.missive .calendar-event-custom-recurrence .day {
    width: 32px
}

.missive .calendar-event-custom-recurrence .months {
    max-width: 272px
}

.missive .calendar-event-custom-recurrence .month {
    width: 64px
}

.missive .calendar-event-custom-recurrence .ends label {
    height: 33px
}

.missive .calendar-event-custom-recurrence .ends label input[type=radio] {
    height: 16px;
    width: 16px
}

.missive .calendar-event-custom-recurrence .ends label input[type=radio]+span {
    width: 60px
}

.missive .calendar-event-custom-recurrence .text-small input[type=radio] {
    margin-right: .4em
}

.missive .calendar-invite .missive-white-box {
    overflow: hidden;
    position: relative
}

.missive .calendar-invite .agenda+.invite-card {
    margin-left: .75em;
    min-width: 19em;
    width: 35%
}

.missive .calendar-invite .account-cta {
    background-color: rgba(var(--conversation-list-background-color-rgb),.85);
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 100
}

.missive .calendar-invite .calendar-event-guests .icon-status {
    box-shadow: 0 0 0 2px var(--conversation-list-background-color)
}

.missive .calendar-invite.missive-columns-vertical-reverse .invite-card {
    margin-left: 0;
    width: 100%
}

.missive .calendar-invite.missive-columns-vertical-reverse .agenda {
    margin-top: 1em
}

.missive .calendar-picker .list-subtitle {
    margin-bottom: 2px;
    padding: 0
}

.missive .calendar-picker .list-subtitle .link-a {
    font-weight: 400;
    text-align: right;
    width: 6em
}

.missive .calendar-picker .list-item {
    border-top: 0;
    padding: .25em 0
}

.missive .calendar-picker>.link-a {
    border-top: 1px solid var(--light-border-color);
    padding: .7em;
    text-align: center
}

.missive .missive-popup-calendar {
    padding-bottom: var(--safe-area-inset-bottom)
}

.missive .missive-popup-calendar .top-bar {
    border-radius: var(--border-radius) var(--border-radius) 0 0
}

.missive .calendar-accounts .strong {
    margin: .6em 0 .2em
}

.missive .calendar-token {
    border-radius: var(--border-radius-small);
    display: inline-block;
    font-weight: 500;
    padding: 2px 20px 3px 6px;
    position: relative
}

.missive .calendar-token .missive-icon {
    opacity: .65;
    position: absolute;
    right: 3px;
    top: 50%;
    transform: translateY(-50%)
}

.missive.missive-view-inbox {
    background-color: var(--conversation-list-background-color);
    position: relative;
    z-index: 2
}

.missive.missive-view-inbox .conversation-list-container {
    position: relative
}

.missive.missive-view-inbox .conversation-list-container:after {
    background: linear-gradient(to right,var(--section-shadow-color),transparent);
    bottom: 0;
    content: "";
    position: absolute;
    right: calc(var(--section-shadow-width)*-1);
    top: 0;
    width: var(--section-shadow-width)
}

.missive.missive-view-inbox .token {
    margin: 0;
    padding: 2px 7px 3px
}

[data-scope=search] .missive.missive-view-inbox .token {
    background: var(--blue-color);
    color: #fff
}

.missive .search-box .input-container {
    height: 33px;
    margin-right: 5px;
    position: relative;
    transition: margin var(--material-duration) var(--material-easing)
}

.missive .search-box .input-container .button-macos {
    color: var(--text-color-b)
}

.missive .search-box .button-macos+.input-container {
    margin-left: 5px
}

.missive .search-box .button-macos-group {
    background-color: var(--background-color);
    bottom: 0;
    box-shadow: none;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    transition-duration: var(--material-duration);
    transition-property: background-color,box-shadow;
    transition-timing-function: var(--material-easing);
    z-index: 3
}

.missive .search-box .missive-icon-filter.button-macos-solid {
    background-color: var(--filter-background-color)!important;
    color: var(--filter-color)
}

.missive .search-box .token-input {
    height: 100%;
    padding: 1px 0 0
}

.missive .search-box .input {
    background-color: transparent;
    border: 0;
    box-shadow: none
}

.missive .search-box .input,.missive .search-box .token-input {
    padding-left: 3px
}

.missive .search-box .strong {
    margin-top: -1px
}

.missive .search-box .unseen-count {
    font-size: 12px;
    font-weight: 600
}

.missive .search-box:not([data-state~=filled]) .input~.search-action {
    display: none!important
}

.missive .search-box[data-state~=focused] .input-container {
    margin-right: -29px
}

.missive .search-box[data-state~=focused] .button-macos+.input-container {
    margin-left: -29px
}

.missive .search-box[data-state~=focused] .button-macos-group {
    background-color: var(--input-background-color);
    box-shadow: 0 0 0 1px var(--blue-color),0 1px 3px 1px rgba(65,69,73,.2)
}

.missive .conversation-list {
    position: relative
}

.missive .conversation-list .complete-search {
    padding: 1em 1em 1.25em 2.3em
}

.missive .conversation-list .complete-search .heading-c {
    margin-bottom: .4em
}

.missive .conversation-list .spinner {
    position: static
}

.missive .missive-checkpoint {
    color: var(--text-color-c);
    position: sticky;
    top: 0;
    transform-origin: 0 0;
    z-index: 1
}

[data-notch=left] .missive .missive-checkpoint {
    padding-left: calc(var(--safe-area-inset-left)/1.5 + .65em)
}

.missive .missive-checkpoint,.missive .missive-filters-bar,.missive .missive-search-errors {
    background-color: var(--background-color);
    font-size: calc(var(--font-size) - 3px);
    font-weight: 600;
    line-height: var(--font-size);
    padding: 5px var(--padding)
}

.missive .missive-search-errors {
    background: var(--yellow-color);
    color: #2d2e2d;
    padding-bottom: .5em;
    padding-top: .4em
}

.missive .missive-filters-bar {
    color: var(--text-color-c);
    font-size: calc(var(--font-size) - 3px);
    font-weight: 500;
    position: relative
}

.missive .missive-filters-bar:not(.missive-filters-bar-absolute):before {
    background-color: var(--filter-color);
    bottom: 0;
    content: "";
    height: 1px;
    left: 0;
    opacity: .08;
    position: absolute;
    width: 100%
}

.missive .missive-filters-bar[data-filtering] {
    background-color: var(--filter-background-color);
    color: var(--filter-color)
}

.missive .missive-filters-bar[data-filtering] .button-macos:hover {
    background-color: var(--filter-dark-background-color)
}

.missive .missive-filters-bar .button-macos {
    color: currentColor;
    padding: 0 4px
}

.missive .missive-filters-bar .button-macos:first-of-type {
    right: 44px
}

.missive .missive-filters-bar .missive-avatar-provider img,.missive .missive-filters-bar .missive-user-stack-item {
    color: var(--filter-background-color)
}

.missive .missive-filters-bar-with-buttons {
    padding-bottom: 3px;
    padding-right: 6px;
    padding-top: 3px
}

.missive .missive-filters-bar-absolute {
    left: 0;
    position: relative;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 2
}

.missive .missive-filters-bar-absolute:after {
    background: linear-gradient(to bottom,var(--section-shadow-color),transparent);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.missive .missive-action-banners-container {
    bottom: 0;
    left: 0;
    padding-bottom: max(var(--safe-area-inset-bottom),var(--padding-small));
    position: absolute;
    width: 100%;
    z-index: 2
}

.missive .missive-action-banners {
    padding: var(--padding-small);
    padding-bottom: 0;
    padding-top: var(--padding)
}

.missive .missive-action-banners-hidden {
    opacity: 0;
    pointer-events: none;
    visibility: hidden
}

.missive .missive-home-bar-safe-zone {
    bottom: 0;
    height: calc(var(--safe-area-inset-bottom) + 10px);
    left: 0;
    position: absolute;
    width: 100%
}

.missive .missive-action-banner-animation-container {
    transition-duration: var(--material-duration);
    transition-property: transform,height;
    transition-timing-function: var(--material-easing)
}

.missive .missive-action-banner-animation-container+.missive-action-banner-animation-container {
    margin-top: .5em
}

.missive .missive-action-banner {
    background-color: var(--text-color-a);
    border-radius: var(--border-radius);
    color: var(--background-color);
    padding: 8px 8px 8px 12px
}

.missive .missive-action-banner .missive-avatar-provider img,.missive .missive-action-banner .missive-user-stack-item {
    color: var(--text-color-a)
}

.missive .missive-action-banner[data-state=error] {
    background-color: var(--red-color)
}

.missive .missive-action-banner[data-state=error] .missive-avatar-provider {
    color: var(--red-color)
}

.missive .missive-action-banner[data-state=info] {
    background-color: var(--blue-color)
}

.missive .missive-action-banner[data-state=info] .missive-avatar-provider {
    color: var(--blue-color)
}

.missive .missive-action-banner[data-state=error] *,.missive .missive-action-banner[data-state=info] * {
    color: #f5f6f7
}

.missive-no-touch .missive .missive-action-banner[data-state=error] .missive-action-banner-button:hover,.missive-no-touch .missive .missive-action-banner[data-state=info] .missive-action-banner-button:hover {
    background-color: rgba(245,246,247,.15)
}

.missive .missive-action-banner[data-state=warning] {
    background-color: var(--yellow-color)
}

.missive .missive-action-banner[data-state=warning] * {
    color: #2d2e2d
}

.missive .missive-action-banner[data-state=warning] .missive-avatar-provider {
    color: var(--yellow-color)
}

.missive-no-touch .missive .missive-action-banner[data-state=warning] .missive-action-banner-button:hover {
    background-color: rgba(45,46,45,.15)
}

.missive .missive-action-banner strong {
    font-weight: 600
}

.missive .missive-action-banner-button {
    border-radius: var(--border-radius-small);
    margin-left: .25em;
    padding: 3px 7px
}

.missive-no-touch .missive .missive-action-banner-button:hover {
    background-color: rgba(var(--background-color-rgb),.2)
}

.missive .missive-action-banner-button-icon {
    padding: .2em
}

.missive .missive-action-banner-button-icon .missive-icon,.missive .missive-action-banner-button-icon .missive-icon svg {
    height: 19px!important;
    width: 19px!important
}

.missive .missive-plus-button {
    bottom: 100%;
    position: absolute;
    right: var(--padding);
    transition: transform var(--material-duration) var(--material-easing)
}

.missive .missive-plus-button>div {
    background-color: var(--blue-color);
    border-radius: 100%;
    box-shadow: 0 2px 6px var(--shadow-color);
    color: #fff;
    height: 51px;
    width: 51px
}

.missive .missive-plus-button>div .missive-icon,.missive .missive-plus-button>div .missive-icon svg {
    height: 25px!important;
    width: 25px!important
}

.missive-no-touch .missive .missive-plus-button:hover {
    transform: scale(1.03)
}

.missive .missive-plus-button:active {
    transform: scale(.97)!important
}

.missive .conversation-preview-group .missive-checkpoint+.conversation-preview {
    padding-top: 3px
}

.missive .conversation-preview-group .missive-checkpoint+.conversation-preview .conversation-preview-inner {
    padding-top: calc(var(--padding) - 2px)
}

.missive .conversation-preview-group .missive-checkpoint+.conversation-preview:before {
    display: none
}

.missive .conversation-preview-group .conversation-preview:last-child {
    padding-bottom: 3px
}

.missive .conversation-preview-group .conversation-preview:last-child .conversation-preview-inner {
    padding-bottom: calc(var(--padding) - 2px)
}

.missive .conversation-preview.dropping .conversation-preview-inner {
    box-shadow: inset 0 0 0 3px rgba(var(--blue-color-rgb),.3),inset 0 0 0 1px rgba(var(--blue-color-rgb),.8)
}

.missive .conversation-preview {
    background-color: var(--conversation-list-background-color);
    padding: 1px 3px 1px 5px;
    position: relative
}

.missive .conversation-preview .conversation-preview-inner {
    border-radius: var(--border-radius);
    padding: var(--padding);
    transition: box-shadow var(--duration) var(--easing)
}

[data-notch=left] .missive .conversation-preview {
    padding-left: calc(var(--safe-area-inset-left)/1.5 + 11px)
}

[data-notch=left] .missive .conversation-preview .color-flag {
    border-radius: 3px;
    left: calc(var(--safe-area-inset-left)/1.5 + 2px);
    width: 3px
}

.missive .conversation-preview .missive-avatar-provider img,.missive .conversation-preview .missive-user-stack-item {
    color: var(--conversation-list-background-color)
}

.missive .conversation-preview.conversation-unsnoozed>div {
    background-color: var(--light-orange-color)
}

.missive .conversation-preview.conversation-unsnoozed .missive-avatar-provider img,.missive .conversation-preview.conversation-unsnoozed .missive-user-stack-item {
    color: var(--light-orange-color)
}

.missive .conversation-preview.conversation-unseen>div {
    background-color: var(--light-blue-color)
}

.missive .conversation-preview.conversation-unseen .missive-avatar-provider img,.missive .conversation-preview.conversation-unseen .missive-user-stack-item {
    color: var(--light-blue-color)
}

.missive .conversation-preview.conversation-starred>div {
    background-color: var(--light-yellow-color)
}

.missive .conversation-preview.conversation-starred .missive-avatar-provider img,.missive .conversation-preview.conversation-starred .missive-user-stack-item {
    color: var(--light-yellow-color)
}

.missive .conversation-preview.conversation-starred .missive-icon-starred-small {
    color: var(--starred-yellow-color)
}

.missive .conversation-preview .meta-column {
    line-height: 1;
    text-align: center
}

.missive .conversation-preview .meta-column:first-child {
    margin-right: 6px;
    min-width: 16px
}

.missive .conversation-preview .meta-column .icon-seen {
    transition: background-color var(--duration) var(--easing)
}

.missive .conversation-preview .meta-column .icon-seen:hover {
    background-color: var(--border-color)
}

[data-size=small] .missive .conversation-preview .meta-column .icon-seen,[data-size=small] .missive .conversation-preview .meta-column .icon-unseen {
    height: 6px;
    width: 6px
}

.missive .conversation-preview .meta-column-margin-left {
    margin-left: 4px
}

.missive .conversation-preview .meta-column-margin-left-large {
    margin-left: 7px
}

.missive .conversation-preview .conversation-comments-icon svg {
    transition: none
}

.missive .conversation-preview .missive-icon-attachments,.missive .conversation-preview .missive-icon-attachments svg {
    height: 12px!important;
    width: 12px!important
}

.missive .conversation-preview .missive-icon-attachments,.missive .conversation-preview .missive-icon-email-read,.missive .conversation-preview .missive-icon-email-unread {
    color: var(--text-color-c)
}

.missive .conversation-preview .missive-icon-is-snoozed,.missive .conversation-preview .missive-icon-is-snoozed svg {
    height: 11px!important;
    width: 11px!important
}

.missive .conversation-preview .missive-icon-is-snoozed:before {
    display: none
}

.missive .conversation-preview.conversation-preview-loading,[data-wrapper=electron] .missive .conversation-preview.conversation-preview-loading {
    box-shadow: none
}

.missive .conversation-preview .button-macos {
    font-weight: 400;
    margin-right: -4px;
    padding: 1px 4px
}

.missive .conversation-preview .tasks-count {
    color: var(--text-color-c)
}

.missive .conversation-preview .tasks-count .missive-icon {
    margin-left: 4px
}

.missive .conversation-preview .tasks-count .missive-icon,.missive .conversation-preview .tasks-count svg {
    height: 12px!important;
    width: 11px!important
}

.missive .conversation-preview .tasks-count.unseen {
    color: var(--blue-color);
    font-weight: 700
}

.missive .conversation-preview .missive-avatar-emoji {
    font-size: calc(var(--font-size) - 1px);
    width: 16px
}

.missive .conversation-preview .label-token {
    transition: none
}

.missive .conversation-preview-placeholder>div>div {
    position: relative
}

.missive .conversation-preview-placeholder>div>div .line {
    margin-left: 22px;
    position: relative
}

.missive .conversation-preview-placeholder>div>div .line:after {
    background-color: var(--text-color-a);
    border-radius: 4px;
    bottom: 2px;
    content: "";
    display: block;
    left: 0;
    opacity: .05;
    position: absolute;
    right: 0;
    top: 2px
}

.missive .conversation-preview-placeholder>div>div:first-child .line {
    width: 100%
}

.missive .conversation-preview-placeholder>div>div:nth-child(2) .line {
    opacity: .8;
    width: 60%
}

.missive .conversation-preview-placeholder>div>div:nth-child(3) .line {
    opacity: .4;
    width: 40%
}

.missive .conversation-preview-loading {
    padding: 1.9em
}

.missive .conversation-list .conversation-preview:before,.missive .conversation-preview-group:last-child .conversation-preview:after {
    background-color: var(--background-color);
    bottom: -1px;
    content: "";
    height: 1px;
    left: var(--padding);
    position: absolute;
    right: var(--padding)
}

.missive .conversation-list .conversation-preview:before {
    bottom: auto;
    top: 0
}

.missive .conversation-list .conversation-preview.conversation-starred+.conversation-preview:before,.missive .conversation-list .conversation-preview.conversation-starred:before,.missive .conversation-list .conversation-preview.conversation-unseen+.conversation-preview:before,.missive .conversation-list .conversation-preview.conversation-unseen:before,.missive .conversation-list .conversation-preview.conversation-unsnoozed+.conversation-preview:before,.missive .conversation-list .conversation-preview.conversation-unsnoozed:before,.missive .conversation-list .conversation-preview[data-state~=selected]+.conversation-preview:before,.missive .conversation-list .conversation-preview[data-state~=selected]:before {
    display: none
}

.missive .conversation-list .conversation-preview[data-contextmenu-opened] {
    box-shadow: none!important
}

.missive .conversation-list .conversation-preview .conversation-preview-inner[data-drag-id],.missive .conversation-list .conversation-preview[data-contextmenu-opened] .conversation-preview-inner {
    box-shadow: inset 0 0 0 2px var(--blue-color)!important
}

.missive .conversation-list .conversation-preview[data-state~=selected] .conversation-preview-inner {
    background: var(--light-border-color);
    transition: none
}

.missive .conversation-list .conversation-preview[data-state~=selected] .missive-avatar-provider img,.missive .conversation-list .conversation-preview[data-state~=selected] .missive-user-stack-item {
    color: var(--light-border-color)
}

.missive .conversation-list .missive-scroll {
    height: 100%;
    overflow-x: hidden!important;
    padding-bottom: var(--safe-area-inset-bottom);
    position: relative;
    z-index: 1
}

.missive-has-touch .missive .conversation-list .missive-scroll:after {
    content: "";
    display: block;
    height: 1px;
    margin-bottom: -1px
}

@media(min-width: 812px) {
    html[data-state~=focused][data-scope=inbox] .missive .conversation-preview[data-state~=selected] .conversation-preview-inner {
        background:var(--conversation-selected-color);
        color: #fff;
        transition: none
    }

    html[data-state~=focused][data-scope=inbox] .missive .conversation-preview[data-state~=selected] .conversation-preview-subtitle,html[data-state~=focused][data-scope=inbox] .missive .conversation-preview[data-state~=selected] .conversation-preview-title {
        color: inherit
    }

    html[data-state~=focused][data-scope=inbox] .missive .conversation-preview[data-state~=selected] .conversation-preview-content,html[data-state~=focused][data-scope=inbox] .missive .conversation-preview[data-state~=selected] time {
        color: #b2caf9;
        transition: none
    }

    html[data-state~=focused][data-scope=inbox] .missive .conversation-preview[data-state~=selected] .missive-icon-tertiary {
        color: rgba(255,255,255,.5)
    }

    html[data-state~=focused][data-scope=inbox] .missive .conversation-preview[data-state~=selected] .missive-icon {
        color: rgba(255,255,255,.65);
        transition: none
    }

    html[data-state~=focused][data-scope=inbox] .missive .conversation-preview[data-state~=selected] .message-count {
        border-color: rgba(255,255,255,.25);
        color: rgba(255,255,255,.7);
        transition: none
    }

    html[data-state~=focused][data-scope=inbox] .missive .conversation-preview[data-state~=selected] .tasks-count .missive-icon,html[data-state~=focused][data-scope=inbox] .missive .conversation-preview[data-state~=selected] .tasks-count span {
        color: #fff;
        transition: none
    }

    html[data-state~=focused][data-scope=inbox] .missive .conversation-preview[data-state~=selected] .tasks-count.unseen.dont-mark-as-read-upon-opening {
        background-color: rgba(255,255,255,.15)
    }

    html[data-state~=focused][data-scope=inbox] .missive .conversation-preview[data-state~=selected] .missive-avatar-provider img,html[data-state~=focused][data-scope=inbox] .missive .conversation-preview[data-state~=selected] .missive-user-stack-item {
        color: var(--conversation-selected-color)
    }

    html[data-state~=focused][data-scope=inbox] .missive .conversation-preview[data-state~=selected] .missive-user-stack-item.missive-user-stack-unseen .missive-avatar {
        box-shadow: 0 0 0 2px rgba(255,255,255,.65)
    }

    html[data-state~=focused][data-scope=inbox] .missive .conversation-preview[data-state~=selected] .icon-snoozed,html[data-state~=focused][data-scope=inbox] .missive .conversation-preview[data-state~=selected] .icon-unseen {
        background-color: rgba(255,255,255,.65)
    }

    html[data-state~=focused][data-scope=inbox] .missive .conversation-preview[data-state~=selected] .icon-seen {
        transition: none
    }

    html[data-state~=focused][data-scope=inbox] .missive .conversation-preview[data-state~=selected] .icon-seen:hover {
        background-color: rgba(255,255,255,.25);
        transition: background-color var(--duration) var(--easing)
    }

    html[data-state~=focused][data-scope=inbox] .missive .conversation-preview[data-state~=selected] .conversation-comments-icon[data-state~=unseen] .unread-comments-count {
        color: var(--conversation-selected-color)
    }

    html[data-state~=focused][data-scope=inbox] .missive .conversation-preview[data-state~=selected] .conversation-comments-icon[data-state~=unseen] svg {
        fill: rgba(255,255,255,.65)
    }

    html[data-state~=focused][data-scope=inbox] .missive .conversation-preview[data-state~=selected] .label-token-parent {
        background-color: transparent;
        transition: none
    }

    html[data-state~=focused][data-scope=inbox] .missive .conversation-preview[data-state~=selected] .label-token {
        background-color: transparent!important;
        border-color: rgba(255,255,255,.2)!important;
        color: rgba(255,255,255,.65)!important
    }
}

.missive .conversation-preview-title-bold {
    font-weight: 700
}

.missive .conversation-preview-content {
    color: var(--text-color-c)
}

.missive .conversation-preview-content .missive-avatar {
    margin-right: .33em
}

.missive .conversation-preview-content code {
    line-height: 1
}

.missive .conversations-limit {
    padding: .65em 1em .7em
}

.missive .swipe-action-container {
    height: 0;
    left: 0;
    position: absolute;
    top: 0;
    transform: translate(0);
    transform-origin: 0 0;
    transition-duration: var(--duration);
    transition-property: color,background-color;
    transition-timing-function: var(--easing);
    width: 100%
}

.missive .swipe-action-container .swipe-action-icon-container {
    left: 0;
    position: absolute;
    top: 0;
    transform-origin: center center
}

.missive .empty-mailbox .missive-icon {
    color: var(--text-color-e);
    left: 50%;
    margin-top: -96px;
    position: absolute;
    top: 50%;
    transform: translateX(-50%) translateY(-50%)
}

.missive .empty-mailbox .missive-icon,.missive .empty-mailbox .missive-icon svg {
    height: 100px!important;
    width: 100px!important
}

.missive .empty-mailbox p {
    margin-top: 1em
}

.missive .async-search {
    padding-bottom: calc(var(--safe-area-inset-bottom) + .6em);
    position: relative;
    z-index: 1
}

.missive .async-search:after {
    background: linear-gradient(to top,var(--section-shadow-color),transparent);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0;
    top: calc(var(--section-shadow-width)*-1)
}

.missive .async-search strong {
    font-weight: 500
}

.missive .async-search .preferences-box {
    margin-top: .6em
}

.missive .async-search .preferences-box+.progress-bar-container {
    margin-top: .2em
}

.missive.missive-view-integrations {
    position: relative;
    z-index: 2
}

.missive.missive-view-integrations .heading-b {
    font-size: 16px
}

.missive.missive-view-integrations .missive-iframe {
    display: none
}

.missive.missive-view-integrations .missive-iframe,.missive.missive-view-integrations iframe {
    border: 0;
    height: 100%;
    width: 100%
}

.missive .integration-action,.missive .integration-container,.missive .integration-list {
    background-color: var(--background-color)
}

.missive .integration-container {
    position: relative
}

.missive .integration-container:after {
    background: linear-gradient(to left,var(--section-shadow-color),transparent);
    bottom: 0;
    content: "";
    left: calc(var(--section-shadow-width)*-1);
    position: absolute;
    top: 0;
    top: var(--top-bar-height);
    width: var(--section-shadow-width)
}

.missive .integration-container[data-floating] {
    border-radius: 18px 0 0 18px;
    box-shadow: 0 0 12px rgba(0,0,0,.15),0 0 2px rgba(0,0,0,.1);
    height: 100%;
    position: absolute;
    right: 100%;
    transform: translateX(105%);
    transition: transform var(--material-duration) var(--material-easing)
}

.missive .integration-container[data-floating]:after {
    display: none
}

.missive .integration-container[data-floating] .integration-content {
    border-bottom-left-radius: 18px;
    overflow: hidden
}

.missive .integration-container[data-visible],.missive .integration-container[data-visible] .integration-actions {
    transform: translateX(0)
}

.missive .integration-container[data-visible]+.integration-list:after {
    width: 1px
}

.missive .integration-container .missive-calendar [data-layout] {
    background-color: var(--conversation-list-background-color)
}

.missive .integration-container .missive-calendar [data-layout=week] .missive-calendar-event-title {
    text-overflow: clip
}

.missive .integration-container .missive-calendar [data-layout=week] .missive-calendar-event,.missive .integration-container .missive-calendar [data-layout=week] .missive-calendar-event .text-small {
    font-size: calc(var(--font-size) - 2px)!important
}

.missive .integration-container .missive-calendar [data-layout=agenda] .group {
    width: 100%
}

.missive .integration-container .missive-calendar [data-layout=agenda] .group+.group {
    padding-top: 0
}

.missive .integration-container .missive-calendar [data-layout=agenda] .group-title {
    position: sticky;
    top: 0;
    z-index: 2
}

.missive .integration-actions {
    overflow: hidden;
    padding: 15px 0 15px 15px;
    position: absolute;
    right: 100%;
    top: 3px;
    transform: translateX(100%);
    transition: transform var(--material-duration) var(--material-easing);
    z-index: 2
}

.missive .integration-actions .integration-action {
    -webkit-app-region: no-drag;
    border-radius: var(--border-radius-large) 0 0 var(--border-radius-large);
    box-shadow: 0 0 12px rgba(0,0,0,.15),0 0 2px rgba(0,0,0,.1);
    padding: 2px 0 2px 2px
}

.missive .integration-actions .integration-action .button-macos {
    border-radius: 10px 0 0 10px;
    height: 40px!important
}

.missive .integration-list {
    padding: 0 var(--padding);
    padding-right: max(var(--safe-area-inset-right),var(--padding));
    padding-top: var(--safe-area-inset-top);
    position: relative
}

.missive .integration-list:after {
    background: linear-gradient(to right,var(--section-shadow-color),transparent);
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    top: 0;
    width: var(--section-shadow-width)
}

.missive .integration-list .integration-group {
    padding: var(--padding) 0
}

.missive .integration-list .integration-group:last-child {
    padding-bottom: max(var(--safe-area-inset-bottom),var(--padding))
}

.missive .integration-list .integration-group+.integration-group {
    position: relative
}

.missive .integration-list .integration-group+.integration-group:after {
    background: linear-gradient(to bottom,var(--section-shadow-color),transparent);
    content: "";
    height: var(--section-shadow-width);
    height: 1px;
    left: 0;
    left: 5px;
    position: absolute;
    right: 0;
    right: 5px;
    top: 0
}

.missive .integration-list .button-macos {
    border-radius: 100%;
    mix-blend-mode: luminosity;
    padding: 8px
}

.missive .integration-list .button-macos:hover,.missive .integration-list .button-macos[data-selected] {
    mix-blend-mode: normal
}

.missive .integration-list .button-macos[data-selected] {
    background-color: var(--top-bar-background-color)!important;
    box-shadow: 0 2px var(--section-shadow-width) var(--section-shadow-color)
}

.missive .missive-integration-container,.missive .missive-integration-container .bar {
    position: relative
}

.missive .missive-integration-container .bar:after {
    background: linear-gradient(to bottom,var(--section-shadow-color),transparent);
    bottom: calc(var(--section-shadow-width)*-1);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0
}

.missive .missive-integration-container .missive-integration-resizer {
    cursor: ns-resize;
    position: relative
}

.missive .missive-integration-container .missive-integration-resizer:after {
    background: linear-gradient(to top,var(--section-shadow-color),transparent);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0;
    top: calc(var(--section-shadow-width)*-1)
}

.missive .missive-integration-container .missive-integration-resizer:before {
    content: "";
    height: 6px;
    left: 0;
    position: absolute;
    top: -3px;
    width: 100%;
    z-index: 3
}

.missive .missive-integration-container.border-top .top-bar {
    height: auto;
    padding-top: .5em
}

.missive .option.focus .dropbox-integration-icon,.missive .option.focus .iframe-integration-icon,.missive .option.focus .skype-meeting-icon,.missive .preferences-selectable-item[data-state=selected] .dropbox-integration-icon,.missive .preferences-selectable-item[data-state=selected] .iframe-integration-icon,.missive .preferences-selectable-item[data-state=selected] .skype-meeting-icon {
    filter: brightness(10)
}

.missive .missive-view-contacts .contact-tabs {
    border-radius: calc(2px + var(--border-radius));
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    margin: 0 10px;
    padding: 2px 2px 3px;
    white-space: nowrap
}

.missive .missive-view-contacts .contact-tabs:after {
    background-color: rgba(var(--conversation-list-background-color-rgb),.6);
    bottom: 0;
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    width: 100%;
    z-index: 1
}

.missive .missive-view-contacts .contact-tabs .button-macos {
    color: var(--text-color-c);
    display: inline-block;
    min-width: 35px;
    padding: 6px 10px;
    text-align: center;
    white-space: nowrap
}

.missive-has-touch .missive .missive-view-contacts .contact-tabs .button-macos {
    min-width: 45px;
    padding: 8px 12px
}

.missive .missive-view-contacts .contact-tabs .button-macos[data-selected] {
    color: var(--text-color-b)
}

.missive .missive-view-contacts .contact-tabs .button-macos+.button-macos {
    flex-basis: auto;
    flex-grow: 0;
    margin-left: 2px
}

.missive .missive-view-contacts .missive-scroll.padding-top-0 {
    padding-top: var(--section-shadow-width)
}

.missive .missive-view-contacts .missive-white-box {
    overflow: hidden;
    position: relative
}

.missive .missive-view-contacts .contact-actions-row .contact-actions {
    display: none!important
}

.missive .missive-view-contacts .contact-actions-row:hover .contact-actions {
    display: flex!important
}

.missive .missive-view-contacts .missive-recent-conversations .label {
    margin-bottom: 0;
    padding: 2px 0 0 6px
}

.missive .missive-view-contacts .missive-recent-conversations .contact-tabs .button-macos {
    min-width: 75px
}

.missive .missive-view-contacts .missive-recent-conversation .button-macos {
    font-weight: 400
}

.missive-no-touch .missive .missive-view-contacts .missive-recent-conversation .button-macos:hover {
    background-color: rgba(var(--text-color-a-rgb),.03);
    color: var(--text-color-a)
}

.missive .missive-view-contacts .missive-recent-conversation+.missive-recent-conversation {
    margin-top: 1px
}

.missive .missive-view-tasks .heading-d {
    padding: 2px var(--padding-small)
}

.missive .missive-view-tasks .heading-d .text-c {
    font-weight: 400
}

.missive .missive-view-tasks .button-macos-group-submit .button-macos {
    padding: 10px 14px
}

.missive .missive-view-tasks .tasks-scroll-container {
    display: flex;
    flex-direction: column
}

.missive .missive-view-tasks .list-item {
    min-height: 44px
}

.missive .missive-view-tasks .list-item .task-assignees {
    display: flex
}

.missive .preferences-menu {
    background-color: var(--background-color);
    max-width: 210px;
    min-width: 180px;
    position: relative
}

.missive .preferences-menu:after {
    background: linear-gradient(to left,var(--section-shadow-color),transparent);
    bottom: 0;
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    width: var(--section-shadow-width)
}

.missive .preferences-menu .missive-scroll,.missive .preferences-menu .preferences-menu-title {
    padding: var(--padding)
}

.missive .preferences-menu .missive-scroll {
    padding-top: 0
}

.missive .preferences-menu .list-subtitle {
    margin: var(--padding) 0 var(--padding-small);
    padding: 0
}

.missive .preferences-menu .preferences-selectable-item {
    font-size: 1.1em;
    padding: var(--padding-small) var(--padding)
}

.missive-has-touch .missive .preferences-menu .preferences-selectable-item {
    padding: 8px var(--padding)
}

.missive-no-touch .missive .preferences-menu .preferences-selectable-item:hover {
    background-color: rgba(var(--text-color-a-rgb),.05)
}

[data-notch=left] .missive .preferences-menu {
    padding-left: calc(var(--safe-area-inset-left)/1.5 + 1.4em)!important
}

.missive .preferences-menu-title {
    font-size: 1.4em;
    font-weight: 500
}

.missive .preferences-menu-title>span {
    margin: 0 var(--padding-small);
    margin-right: var(--padding-large)
}

.missive .preferences-close-icon {
    background-color: var(--light-border-color);
    border-radius: 100%;
    color: var(--text-color-b);
    height: 22px;
    width: 22px
}

.missive .preferences-close-icon svg {
    height: 18px;
    width: 18px
}

.missive .preferences-content>.missive-scroll {
    height: 100%;
    padding: 1em
}

@supports(-moz-appearance: none) {
    .missive .preferences-content>.missive-scroll>:last-child {
        padding-bottom:1em
    }
}

.missive .preferences-content .preferences-section {
    padding: 1.15em 0 2em
}

.missive .preferences-content .preferences-section:first-child {
    padding-top: 0
}

.missive .preferences-content .preferences-section:last-child {
    padding-bottom: 0
}

.missive .preferences-content .preferences-section+.preferences-section {
    border-top: 1px solid var(--light-border-color)
}

.missive .preferences-content .preferences-section.media-block {
    padding: .15em 0 1.65em
}

.missive .preferences-content .preferences-section.preferences-section-tight {
    padding: 1.15em 0
}

.missive .preferences-content .preferences-section.no-bottom-padding {
    padding-bottom: 0
}

.missive .preferences-content .preferences-subnav {
    border-top: 1px solid var(--light-border-color);
    margin: 0 0 1em;
    position: relative
}

.missive .preferences-content .preferences-subnav>div {
    margin-top: -1em
}

.missive .preferences-content .button+.text-detail {
    margin-top: .5em
}

.missive-has-touch .missive .preferences-content .checkbox-setting+.checkbox-setting,.missive-has-touch .missive .preferences-content .checkboxes-setting .missive-flex+.missive-flex,.missive-has-touch .missive .preferences-content .radio-setting .missive-flex+.missive-flex {
    margin-top: .4em
}

.missive .preferences-content .button-macos-group {
    background-color: var(--input-background-color)
}

.missive .preferences-selectable-list {
    background-color: var(--conversation-list-background-color);
    max-width: 260px;
    position: relative;
    z-index: 3
}

.missive .preferences-selectable-list:after {
    background: linear-gradient(to right,var(--section-shadow-color),transparent);
    bottom: 0;
    content: "";
    position: absolute;
    right: calc(var(--section-shadow-width)*-1);
    top: 0;
    width: var(--section-shadow-width)
}

.missive .preferences-selectable-list .search {
    position: relative
}

.missive .preferences-selectable-list .search:after {
    background: linear-gradient(to bottom,var(--section-shadow-color),transparent);
    bottom: calc(var(--section-shadow-width)*-1);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0
}

.missive .preferences-selectable-list .search .input {
    padding-bottom: 1.1em;
    padding-top: 1.1em
}

.missive .preferences-selectable-list .button-macos-full .button-macos {
    padding: var(--padding-medium);
    padding-bottom: max(var(--safe-area-inset-bottom),var(--padding-medium))
}

.missive .preferences-selectable-list-with-search .search .input {
    padding-bottom: 1.1em;
    padding-top: 1.1em
}

.missive .preferences-selectable-list-with-search .token-input {
    padding: 0
}

.missive .preferences-selectable-items {
    padding: var(--padding-small)
}

.missive .preferences-selectable-item {
    border-radius: var(--border-radius);
    cursor: default;
    padding: var(--padding);
    position: relative
}

.missive .preferences-selectable-item[data-state~=starred] {
    background-color: var(--light-yellow-color)
}

.missive .preferences-selectable-item[data-state~=starred] .missive-icon-starred-small {
    color: var(--starred-yellow-color)
}

.missive .preferences-selectable-item[data-state~=warning] {
    background-color: var(--yellow-color);
    color: #2d2e2d
}

.missive .preferences-selectable-item[data-state~=warning] .media-text small {
    color: currentColor;
    opacity: .75
}

.missive .preferences-selectable-item[data-state~=disabled] {
    opacity: .3
}

.missive .preferences-selectable-item[data-state~=selected] {
    background-color: var(--blue-color)!important;
    color: #fff
}

.missive .preferences-selectable-item[data-state~=selected] .missive-avatar-provider img {
    color: var(--blue-color)
}

.missive .preferences-selectable-item[data-state~=selected] .missive-icon svg {
    fill: #fff!important
}

.missive .preferences-selectable-item[data-state~=selected] .media-text {
    color: #fff
}

.missive .preferences-selectable-item[data-state~=selected] .media-text small {
    color: #fff;
    opacity: .65
}

.missive .preferences-selectable-item .color-flag {
    left: calc(var(--padding-small)*-1)
}

.missive .preferences-box {
    background-color: var(--light-background-color);
    border: 1px solid var(--border-color);
    border-radius: 5px;
    margin-top: 1.4em;
    padding: .85em
}

.missive .preferences-box.has-icon .preferences-box-content {
    margin-left: .5em
}

.missive .preferences-box.has-icon>.missive-icon {
    position: relative;
    top: 1px
}

.missive .preferences-box p+p {
    margin-top: .5em
}

.missive .preferences-box-warning {
    background-color: var(--yellow-color);
    border: none;
    color: #2d2e2d
}

.missive .preferences-box-help {
    border: none
}

.missive .preferences-section>.preferences-box:first-child {
    margin-top: 0
}

.missive .preferences-link-back {
    left: -2px;
    position: relative
}

.missive .preferences-link-back i+span {
    margin-left: .1em
}

.missive .missive-popup-account-sharing .missive-user-stack,.missive .missive-popup-contact-book .missive-user-stack,.missive .missive-popup-new-member .missive-user-stack,.missive .missive-popup-preferences .missive-user-stack,.missive .missive-popup-rules .missive-user-stack,.missive .missive-popup-shared-address .missive-user-stack {
    margin-left: .3em
}

.missive .missive-popup-account-sharing .missive-user-stack-item,.missive .missive-popup-contact-book .missive-user-stack-item,.missive .missive-popup-new-member .missive-user-stack-item,.missive .missive-popup-preferences .missive-user-stack-item,.missive .missive-popup-rules .missive-user-stack-item,.missive .missive-popup-shared-address .missive-user-stack-item {
    color: var(--popup-background-color)
}

.missive .missive-popup-new-member {
    padding-bottom: 0
}

.missive .missive-popup-status {
    padding-bottom: 1em
}

.missive .missive-popup-status .missive-select {
    background-color: transparent;
    border-color: transparent;
    border-radius: 0;
    border-width: 0 0 1px;
    box-shadow: none;
    padding: .2em 0 .2em .2em
}

.missive .missive-popup-status .missive-select:focus {
    border-color: rgba(var(--blue-color-rgb),.75)
}

.missive .missive-popup-status .missive-select .missive-select-arrow {
    color: var(--text-color-c)
}

.missive .missive-popup-status .preferences-box {
    margin-top: 0
}

.missive .missive-popup-status .preferences-box .missive-select {
    position: relative;
    top: 1px
}

.missive .missive-emoji-input {
    position: relative
}

.missive .missive-emoji-input .missive-popup-status-icon {
    border: 1px solid transparent;
    border-radius: 5px 0 0 5px;
    height: 100%;
    left: 0;
    padding: 0 .9em 0 1em;
    position: absolute;
    top: 0
}

.missive .missive-emoji-input .missive-popup-status-icon:focus {
    border-color: var(--blue-color);
    color: var(--blue-color);
    outline: none
}

.missive .missive-emoji-input .missive-popup-status-icon:focus:after {
    z-index: -1
}

.missive .missive-emoji-input .missive-popup-status-icon .missive-emoji {
    margin: 0
}

.missive .missive-emoji-input .input {
    padding: .8em 3.4em
}

.missive .missive-emoji-input .missive-popup-status-allowed-chars {
    position: absolute;
    right: 2.4em;
    top: 50%;
    transform: translateY(-50%)
}

.missive .missive-emoji-input .missive-popup-status-allowed-chars[data-state=error] {
    color: var(--red-color)
}

.missive .missive-emoji-input .missive-icon-close-filled-small {
    position: absolute;
    right: .8em;
    top: 50%;
    transform: translateY(-50%)
}

.missive .missive-popup-status-date {
    border-bottom: 1px solid var(--border-color);
    padding: .2em
}

.missive .missive-popup-changelog {
    display: flex;
    flex-direction: column
}

.missive .missive-popup-changelog .changelog-header {
    padding: var(--padding-large) var(--padding-xlarge)
}

.missive .missive-popup-changelog .changelog-version {
    padding: 0 3px
}

.missive .missive-popup-changelog .changelog-description {
    background-color: var(--background-color);
    border-radius: var(--border-radius);
    padding: var(--padding)
}

.missive .missive-popup-changelog .changelog-description p+p {
    margin-top: var(--padding)
}

.missive .missive-popup-changelog .changelog-footer {
    background-color: var(--light-background-color);
    border-bottom-left-radius: var(--border-radius);
    border-bottom-right-radius: var(--border-radius);
    flex-grow: 0;
    flex-shrink: 0;
    position: relative
}

.missive .missive-popup-changelog .changelog-footer:after {
    background: linear-gradient(to top,var(--section-shadow-color),transparent);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0;
    top: calc(var(--section-shadow-width)*-1)
}

.missive .missive-popup-changelog .changelog-footer .changelog-footer-content {
    padding: var(--padding)
}

.missive.missive-popup-mobile .missive-popup-changelog .changelog-header {
    padding-top: var(--safe-area-inset-top)
}

.missive.missive-popup-mobile .missive-popup-changelog .changelog-footer {
    padding-bottom: var(--safe-area-inset-bottom)
}

.missive .preferences-accounts-settings .button-outline {
    margin-top: .5em
}

.missive .preferences-account-item+.preferences-account-item {
    margin-top: .25em
}

.missive .preferences-accounts-alias-delete {
    margin-left: .65em;
    margin-top: .6em
}

.missive .preferences-accounts-alias-delete-first {
    margin: 2em 0 0 .65em
}

.missive .missive-popup-signature .toolbar+.textarea,.missive .preferences-accounts .toolbar+.textarea {
    border-radius: 0 0 5px 5px
}

.missive .missive-popup-signature .toolbar:after,.missive .preferences-accounts .toolbar:after {
    display: none
}

.missive .missive-popup-signature .toolbar,.missive .preferences-accounts .toolbar {
    border: 1px solid var(--border-color);
    border-bottom: 0;
    border-radius: 5px 5px 0 0
}

.missive .missive-popup-signature .rich-text-modes,.missive .preferences-accounts .rich-text-modes {
    color: var(--text-color-c);
    font-size: calc(var(--font-size) - 2px);
    line-height: 1.25;
    margin-left: .5em;
    text-transform: uppercase
}

.missive .missive-popup-signature .rich-text-modes span,.missive .preferences-accounts .rich-text-modes span {
    display: inline-block;
    margin-right: 1em;
    margin-top: .5em
}

.missive .signature-veil-container {
    z-index: 10
}

.missive .signature-veil-container,.missive .signature-veil-container .signature-veil {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.missive .signature-veil-container .signature-veil {
    background-color: var(--popup-background-color);
    opacity: .6;
    z-index: -1
}

.missive .missive-popup-member-profile {
    padding-top: var(--safe-area-inset-top)
}

.missive .missive-popup-member-profile .preferences-box {
    margin-top: 0
}

.missive .preferences-organization-user-list .list-item {
    padding: .5em 0
}

.missive .preferences-organization-plan {
    padding: 14px 11px 9px;
    text-align: center
}

.missive .preferences-organization-plan.current {
    background-color: var(--light-background-color);
    border-radius: 5px
}

.missive .preferences-organization-plan.current .button-outline {
    border: 0
}

.missive .preferences-organization-plan.highlight .heading-b {
    font-weight: 700
}

.missive .preferences-organization-plan.highlight .plan-price sup {
    top: -.6em
}

.missive .preferences-organization-plan.highlight .plan-price .text-large {
    font-size: 26px
}

.missive .preferences-organization-plan.highlight .plan-price .heading-c {
    font-weight: 500
}

.missive .preferences-organization-plan .plan-grandfathered,.missive .preferences-organization-plan .plan-price,.missive .preferences-organization-plan .plan-title {
    flex: 1 auto
}

.missive .preferences-organization-plan .plan-title .heading-b {
    margin-bottom: .4em
}

.missive .preferences-organization-plan .plan-title strong {
    display: block;
    margin-bottom: .3em
}

.missive .preferences-organization-plan .plan-price {
    margin: 1em 0
}

.missive .preferences-organization-plan .plan-price.missive-align-right {
    margin-left: 1em
}

.missive .preferences-organization-plan .button-pill {
    margin: auto;
    padding-left: 3em;
    padding-right: 3em
}

.missive .plan-price .text-large {
    line-height: 1.15
}

.missive .plan-price .heading-c {
    margin-bottom: -.1em
}

.missive .preferences-organization-shared-addresses input[type=radio] {
    margin: 0 .4em 0 .6em
}

.missive .preferences-organization-shared-addresses .preferences-organizations-sharing {
    margin: 0 1em 0 .5em;
    width: 70px
}

.missive .preferences-organization-shared-addresses .preferences-organizations-flow {
    margin: 0 0 0 1em;
    width: 155px
}

.missive .preferences-member-item .list-item-data {
    flex-shrink: 0
}

.missive .preferences-member-item-status {
    flex-shrink: 5
}

.missive .preferences-member-item-status-starts {
    flex-shrink: 1;
    overflow: hidden;
    text-overflow: ellipsis
}

.missive .preferences-member-item-status-starts:after {
    left: 0!important
}

.missive .preferences-settings .checkbox,.missive .preferences-settings input {
    margin: 0
}

.missive .preferences-settings strong {
    font-weight: 600
}

.missive .preferences-settings .missive-scroll {
    padding-top: 0
}

.missive .preferences-settings .missive-select {
    background-color: transparent;
    border: 0;
    box-shadow: none;
    padding: 0
}

.missive .preferences-settings .missive-select>div {
    position: relative
}

.missive .preferences-settings .missive-select:before {
    border-radius: var(--border-radius-small);
    bottom: -5px;
    content: "";
    left: -8px;
    position: absolute;
    right: -3px;
    top: -5px;
    z-index: 0
}

.missive .preferences-settings .missive-select:hover:before {
    background-color: var(--input-background-color);
    box-shadow: 0 0 0 1px var(--light-border-color)
}

.missive .preferences-settings .missive-select:focus:before,.missive .preferences-settings .missive-select[data-state~=focused]:before {
    box-shadow: 0 0 0 1px var(--blue-color)
}

.missive .preferences-settings .missive-select.select-small {
    background-color: rgba(var(--text-color-a-rgb),.08);
    height: 1.7em
}

.missive .preferences-settings .missive-select.select-small:before {
    display: none
}

.missive .preferences-settings .missive-datetime-picker+.missive-select {
    margin-left: var(--padding-small)
}

.missive .preferences-settings .preferences-settings-alias-select .missive-columns-baseline.no-wrap {
    align-items: flex-end;
    flex-direction: column
}

.missive .preferences-settings .preferences-settings-alias-select .missive-columns-baseline.no-wrap .text-c {
    margin-left: 0!important
}

.missive .preferences-settings .preferences-settings-selects {
    align-items: flex-end
}

.missive .preferences-settings .missive-white-box .missive-white-box {
    border-radius: var(--border-radius-small);
    box-shadow: 0 0 0 1px var(--background-color)
}

.missive .preferences-settings .missive-white-box .missive-white-box .preferences-settings-option {
    padding: 6px var(--padding)
}

.missive .preferences-settings .missive-white-box .missive-white-box .preferences-settings-option:first-child {
    border-radius: var(--border-radius-small) var(--border-radius-small) 0 0
}

.missive .preferences-settings .missive-white-box .missive-white-box .preferences-settings-option:last-child {
    border-radius: 0 0 var(--border-radius-small) var(--border-radius-small)
}

.missive .preferences-settings .missive-white-box .padding-block-small {
    padding: var(--padding)
}

.missive .preferences-settings .missive-white-box .button-macos-group {
    background-color: var(--conversation-list-background-color)
}

.missive .preferences-settings .missive-white-box .missive-datetime-picker-input-parent,.missive .preferences-settings .missive-white-box .select-small {
    background-color: rgba(var(--text-color-a-rgb),.08);
    border-radius: var(--border-radius);
    padding: 2px 6px
}

.missive .preferences-settings .preferences-settings-subgroup {
    padding: var(--padding);
    padding-top: var(--padding-small)
}

.missive .preferences-settings .preferences-settings-subgroup .label {
    margin-top: 0!important
}

.missive .preferences-settings .preferences-content {
    background-color: var(--background-color)!important;
    border-radius: 0 var(--border-radius) var(--border-radius) 0
}

.missive .preferences-settings .preferences-settings-group .label {
    margin-top: var(--padding-large);
    padding-left: var(--padding-small)
}

.missive .preferences-settings .preferences-settings-group .label .input {
    border: 1px solid var(--light-border-color);
    border-radius: 10em;
    padding: 5px 1.5em 5px 2em
}

.missive .preferences-settings .preferences-settings-group .label .input:focus {
    border-color: var(--blue-color)
}

.missive .preferences-settings .preferences-settings-group .label .icon-immersive {
    left: 13px
}

.missive .preferences-settings .preferences-settings-group .label .icon-immersive.icon-close {
    left: auto;
    right: 10px
}

.missive .preferences-settings .preferences-settings-group .border-top {
    border-color: var(--background-color)
}

.missive .preferences-settings .preferences-settings-group .missive-white-box+.missive-white-box {
    margin-top: var(--padding-large)
}

.missive .preferences-settings .preferences-settings-option {
    overflow: hidden;
    padding: var(--padding)
}

.missive .preferences-settings .preferences-settings-option:first-child {
    border-top-left-radius: var(--border-radius);
    border-top-right-radius: var(--border-radius)
}

.missive .preferences-settings .preferences-settings-option:last-child {
    border-bottom-left-radius: var(--border-radius);
    border-bottom-right-radius: var(--border-radius)
}

.missive .preferences-settings .preferences-settings-option+.preferences-settings-option {
    box-shadow: 0 -1px 0 var(--background-color)
}

.missive-no-touch .missive .preferences-settings .preferences-settings-option:hover {
    background-color: var(--light-background-color)
}

.missive .preferences-settings .preferences-settings-option[data-disabled] {
    opacity: .7
}

.missive .preferences-settings .preferences-settings-option .missive-select+.missive-select {
    margin-top: 12px
}

.missive .preferences-settings .missive-table {
    box-shadow: none
}

.missive .preferences-settings .missive-table tbody tr:last-child td:first-child {
    border-bottom-left-radius: var(--border-radius)
}

.missive .preferences-settings .missive-table tbody tr:last-child td:last-child {
    border-bottom-right-radius: var(--border-radius)
}

.missive .preferences-settings .missive-table tr td[data-column=Edit] .missive-icon-edit {
    cursor: pointer;
    opacity: 0
}

.missive .preferences-settings .missive-table tr:hover td[data-column=Edit] .missive-icon-edit {
    opacity: 1
}

.missive.preferences-settings-option {
    background-color: var(--light-background-color);
    padding: var(--padding);
    z-index: 1000
}

.missive.preferences-settings-option .button-macos.missive-icon-menu {
    background-color: rgba(var(--text-color-a-rgb),.05)
}

.missive .missive-popup-integrations .preferences-content {
    background-color: var(--background-color);
    border-radius: 0 var(--border-radius) var(--border-radius) 0
}

.missive .missive-popup-integrations .preferences-content .missive-iframe {
    overflow: hidden
}

.missive .missive-popup-integrations .preferences-content .button-macos {
    padding: 10px
}

.missive .preferences-shortcuts table {
    width: auto
}

.missive .preferences-shortcuts table+table {
    margin-left: 1em
}

.missive .preferences-shortcuts-disabled {
    opacity: .5
}

.missive .preferences-shortcuts-shortcut {
    padding-right: .4em;
    text-align: right;
    white-space: nowrap
}

.missive .preferences-shortcut-token-group {
    display: flex;
    flex-wrap: wrap
}

.missive .preferences-shortcut-token-group .shortcut-token {
    font-size: calc(var(--font-size) - 3px)
}

@media(-webkit-max-device-pixel-ratio: 1),(max-resolution:1dppx) {
    .missive .preferences-shortcut-token-group .shortcut-token {
        -webkit-font-smoothing:subpixel-antialiased
    }
}

.missive .preferences-shortcut-token-group+.preferences-shortcut-token-group {
    margin-top: 2px
}

.missive .preferences-shortcuts-token {
    background-color: #222;
    color: #fff;
    display: inline-block;
    min-width: 2em;
    padding: 3px 8px;
    text-align: center
}

.missive .preferences-shortcuts-token:first-child {
    border-bottom-left-radius: 5px;
    border-top-left-radius: 5px
}

.missive .preferences-shortcuts-token:last-child {
    border-bottom-right-radius: 5px;
    border-top-right-radius: 5px
}

.missive .preferences-shortcuts-token-unbound {
    background-color: #f7f7f7;
    color: var(--text-color-b)
}

.missive .preferences-shortcuts-modifier {
    background-color: #717171;
    padding: 3px 5px
}

.missive .preferences-shortcuts-modifier+.preferences-shortcuts-modifier {
    border-left: 1px solid #555
}

.missive .preferences-shortcuts-custom {
    background-color: var(--shortcut-custom-color)
}

.missive .preferences-shortcuts-modifier.preferences-shortcuts-custom {
    background-color: var(--shortcut-custom-modifier-color)
}

.missive .preferences-shortcuts-modifier.preferences-shortcuts-custom+.preferences-shortcuts-modifier {
    border-left: 1px solid var(--shortcut-custom-modifier-border-color)
}

.missive .preferences-shortcuts-none {
    padding: 2px
}

.missive .preferences-settings .preferences-settings-shortcuts-group .label,.missive .preferences-settings .preferences-settings-shortcuts-group .search {
    padding-left: 0
}

.missive .preferences-settings .preferences-settings-shortcuts-group .icon-immersive:first-of-type {
    left: 10px
}

.missive .preferences-about .nav-logotype {
    position: static
}

.missive .preferences-help .preferences-help-sidebar {
    max-width: 260px;
    position: relative
}

.missive .preferences-help .preferences-help-sidebar:after {
    background: linear-gradient(to right,var(--section-shadow-color),transparent);
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    top: 0;
    width: var(--section-shadow-width)
}

.missive .preferences-help .missive-iframe {
    margin-bottom: 1em;
    padding-top: 1em
}

.missive .preferences-help .missive-iframe,.missive .preferences-help .missive-iframe iframe {
    background-color: #fff;
    border: 0;
    border-radius: 5px
}

.missive .preferences-help .missive-iframe iframe {
    padding-left: .5em;
    padding-right: .5em
}

.missive .preferences-help-section {
    padding: 1.65em 1.65em 0
}

.missive .preferences-labels .preferences-box,.missive .preferences-rules .preferences-box {
    margin-bottom: 1em;
    margin-top: 0
}

.missive .rules-buttons {
    margin-left: 8px
}

.missive .rules-buttons .button-macos[data-disabled] {
    opacity: .5
}

.missive .rules-buttons .button-macos+.button-macos {
    margin-left: 0
}

.missive .rule-time-range[disabled] {
    opacity: .6
}

.missive .rule-time-range-tz .missive-select {
    border: 0
}

.missive .rule-time-range-tz .missive-select strong {
    font-weight: 600
}

.missive .rule-time-range-tz .missive-select>div {
    padding-top: 1px
}

.missive .rule-time-range-table input[type=checkbox] {
    margin: 0
}

.missive .rule-time-range-table>div {
    border: 1px solid var(--border-color)
}

.missive .rule-time-range-table>div+div {
    border-left-width: 0
}

.missive .rule-time-range-table>div:first-child {
    border-radius: 6px 0 0 6px
}

.missive .rule-time-range-table>div:last-child {
    border-radius: 0 6px 6px 0
}

.missive .rule-time-range-table>div[data-state~=disabled],.missive .rule-time-range-table>div[data-state~=disabled] .missive-datetime-picker input {
    background-color: var(--light-background-color)
}

.missive .rule-time-range-table>div[data-state~=enabled] input[type=checkbox]+.text-c {
    color: var(--text-color-a)
}

.missive .rule-time-range-table .border-bottom {
    padding-bottom: 7px;
    padding-left: 2px;
    padding-top: 4px
}

.missive .rule-time-range-table .missive-datetime-picker {
    white-space: nowrap
}

.missive .preferences-rewards>.missive-scroll {
    padding-top: 0
}

.missive .preferences-rewards .billing-table td {
    padding: 0
}

.missive .preferences-api .preferences-box,.missive .preferences-rewards .preferences-box {
    margin-bottom: 2.3em;
    margin-top: 1em
}

.missive .preferences-api-tokens time,.missive .preferences-profile-sessions time,.missive .preferences-rewards time {
    color: var(--text-color-a)
}

.missive .preferences-api-tokens .missive-icon-refresh,.missive .preferences-profile-sessions .missive-icon-refresh,.missive .preferences-rewards .missive-icon-refresh {
    margin-left: .4em;
    transform-origin: 50% 55%
}

.missive .preferences-api-tokens .missive-icon-refresh,.missive .preferences-api-tokens .missive-icon-refresh svg,.missive .preferences-profile-sessions .missive-icon-refresh,.missive .preferences-profile-sessions .missive-icon-refresh svg,.missive .preferences-rewards .missive-icon-refresh,.missive .preferences-rewards .missive-icon-refresh svg {
    height: 13px;
    width: 13px
}

.missive-no-touch .missive .preferences-api-tokens .missive-icon-refresh:hover,.missive-no-touch .missive .preferences-profile-sessions .missive-icon-refresh:hover,.missive-no-touch .missive .preferences-rewards .missive-icon-refresh:hover,.missive .preferences-api-tokens .missive-icon-refresh.missive-rotation,.missive .preferences-profile-sessions .missive-icon-refresh.missive-rotation,.missive .preferences-rewards .missive-icon-refresh.missive-rotation {
    color: var(--blue-color)
}

.missive .preferences-api-tokens+.preferences-api-webhooks,.missive .preferences-profile-sessions+.preferences-api-webhooks,.missive .preferences-rewards+.preferences-api-webhooks {
    margin-top: 1em
}

.missive .preferences-api-webhooks label {
    padding: .2em
}

.missive .preferences-api-webhooks .preferences-api-webhooks-providers label+label {
    margin-left: 1em
}

.missive .preferences-api-webhooks .input {
    color: var(--text-color-b)
}

.missive .preferences-api-webhooks .missive-avatar {
    margin-right: .3em
}

.missive .preferences-api-webhooks-options .row+.row {
    margin-top: .2em
}

.missive .preferences-api-webhooks-url {
    padding-top: .8em
}

.missive .preferences-api-webhooks-url .label {
    margin-bottom: .2em
}

.missive .preferences-api-webhooks-url .input {
    border: 0;
    box-shadow: none;
    padding: 0
}

.missive .preferences-api-webhooks-checkboxes input {
    position: relative;
    top: 1px
}

.missive .preferences-api-webhooks-checkboxes label {
    margin: 0!important;
    width: 25%
}

.missive .preferences-api-webhooks-checkboxes .no-wrap {
    padding-right: 1em
}

.missive .preferences-api-resources code {
    background-color: var(--light-border-color);
    border-radius: 3px;
    display: block;
    margin: 1px 0;
    padding: .2em .4em
}

.missive .preferences-swipes-actions {
    background-color: var(--background-color);
    border-radius: 6px;
    height: 60px;
    padding: 2px
}

.missive .preferences-swipes-actions .missive-icon {
    color: #fff
}

.missive .preferences-swipes-actions .preferences-swipes-action:last-child {
    border-radius: 0 4px 4px 0
}

.missive .preferences-swipes-actions.missive-columns-reverse .preferences-swipes-action:last-child {
    border-radius: 4px 0 0 4px
}

.missive .preferences-swipes-list-action-icon {
    border-radius: 100%;
    color: #fff;
    height: 26px;
    margin: 0 .5em 0 .7em;
    width: 26px
}

.missive .preferences-swipes-list-action-icon .missive-avatar,.missive .preferences-swipes-list-action-icon .missive-icon {
    margin-right: 0!important
}

.missive .preferences-swipes-list-action-icon .missive-avatar,.missive .preferences-swipes-list-action-icon .missive-avatar svg,.missive .preferences-swipes-list-action-icon .missive-icon,.missive .preferences-swipes-list-action-icon .missive-icon svg {
    height: 12px!important;
    width: 12px!important
}

.missive .preferences-swipes-handles {
    height: 17px;
    margin-left: 2px;
    margin-right: 2px;
    position: relative
}

.missive .preferences-swipes-handle {
    background-color: currentColor;
    bottom: -58px;
    height: 73px;
    position: absolute;
    width: 2px
}

.missive .preferences-swipes-handle:before {
    background-color: var(--popup-background-color);
    border: 2px solid;
    border-radius: 100%;
    content: "";
    height: 12px;
    left: 50%;
    position: absolute;
    top: 0;
    transform: translate(-50%,-50%);
    width: 12px
}

.missive .preferences-swipes-handle:after {
    content: "";
    height: 110%;
    left: 50%;
    position: absolute;
    top: -10%;
    transform: translate(-50%);
    width: 40px
}

.missive .billing-table {
    text-align: center
}

.missive .billing-table td {
    height: 5em;
    padding: 16px 4px 18px
}

.missive .billing-table tr+tr {
    border-top: 1px solid var(--light-border-color)
}

.missive .billing-table td+td {
    border-left: 1px solid var(--light-border-color)
}

.missive .billing-table a {
    cursor: pointer
}

.missive .billing-table .plan-name {
    font-size: 1.5em
}

.missive .billing-table .button {
    display: inline-block
}

.missive .billing-table .current-plan .button-outline {
    border: 0
}

.missive .billing-table .currency {
    font-size: 1em;
    vertical-align: .3em
}

.missive .billing-table .digits {
    font-size: 2em;
    margin: 0 .1em
}

.missive .billing-table .preferences-box {
    margin: 1.2em 1em 0
}

.missive .twilio-chat-setup img,.missive .twilio-chat-setup pre {
    border: 1px solid var(--border-color);
    border-radius: 5px
}

.missive .twilio-chat-setup pre {
    background-color: var(--background-color);
    color: var(--text-color-a);
    padding: .65em 2.5em .65em .65em
}

.missive .twilio-chat-setup .missive-icon-help {
    top: 2px
}

.missive .twilio-chat-setup .missive-popup-form ::-moz-placeholder {
    color: var(--text-color-d)
}

.missive .twilio-chat-setup .missive-popup-form ::placeholder {
    color: var(--text-color-d)
}

.missive .twilio-chat-setup .missive-icon-arrow-down,.missive .twilio-chat-setup .missive-icon-arrow-right {
    top: 1px
}

.missive .twilio-chat-setup-code {
    position: relative
}

.missive .twilio-chat-setup-code .twilio-chat-setup-copy-code {
    border-bottom-right-radius: 0;
    border-right: 0;
    border-top: 0;
    border-top-left-radius: 0;
    padding: .6em .6em .6em .7em;
    position: absolute;
    right: 1px;
    top: 1px
}

.missive .missive-windows-default-handler-guide {
    padding: 1.5em 4em 0
}

.missive .missive-windows-default-handler-guide ol {
    padding: 0
}

.missive .missive-windows-default-handler-guide li {
    list-style-position: inside
}

.missive .missive-windows-default-handler-guide li+li {
    margin-top: .6em
}

.missive .missive-windows-default-handler-guide img {
    border-radius: 6px;
    margin-top: .3em
}

.missive .preferences-contact .preferences-selectable-item {
    padding: 4px 6px
}

.missive .importing-contacts-container {
    bottom: 100%;
    overflow: hidden;
    padding-top: var(--section-shadow-width);
    pointer-events: none;
    position: absolute;
    transition: margin-bottom var(--material-duration) var(--material-easing);
    width: 100%;
    z-index: 1
}

.missive .importing-contacts-container .importing-contacts {
    background-color: var(--conversation-list-background-color);
    pointer-events: auto;
    position: relative;
    text-align: center;
    transform: translateY(125%);
    transition: transform var(--material-duration) var(--material-easing)
}

.missive .importing-contacts-container .importing-contacts:after {
    background: linear-gradient(to top,var(--section-shadow-color),transparent);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0;
    top: calc(var(--section-shadow-width)*-1)
}

.missive .importing-contacts-container[data-state~=importing] .importing-contacts {
    transform: translateY(0)
}

.missive .contact-form .contact-avatar {
    left: 50%;
    position: absolute;
    top: 0;
    transform: translateX(-50%)
}

.missive .contact-form .contact-avatar:hover .contact-avatar-edit {
    opacity: 1
}

.missive .contact-form .contact-avatar-edit {
    background: linear-gradient(180deg,transparent 0,rgba(0,0,0,.8) 90%);
    border-radius: 100%;
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 2
}

.missive .contact-form .contact-avatar-edit span {
    bottom: 0;
    color: #fff;
    font-size: 12px;
    font-variant: all-small-caps;
    font-weight: 600;
    left: 0;
    opacity: .95;
    padding-bottom: 5px;
    position: absolute;
    text-align: center;
    width: 100%
}

.missive .contact-form .input-line {
    border-color: rgba(var(--text-color-a-rgb),.08);
    padding: .75em .5em .5em
}

.missive .contact-form .input-line+.input-line {
    margin-left: 0
}

.missive .contact-form .contact-field[data-state~=error] .input-line {
    border-color: rgba(var(--red-color-rgb),.5)
}

.missive .contact-form .contact-field-content {
    padding-bottom: .25em;
    padding-left: .5em
}

.missive .contact-form .contact-field-content strong {
    font-weight: 500
}

.missive .contact-form .missive-select {
    box-shadow: none;
    padding-right: 0
}

.missive .contact-form .missive-select strong {
    font-weight: 500
}

.missive .contact-form .preferences-box {
    margin-top: 0;
    padding: .7em .5em .5em
}

.missive .contact-form .contact-fields+.contact-fields,.missive .contact-form .row+.row {
    margin-top: 1em
}

.missive .contact-form .contact-field+.contact-field {
    margin-left: 1em
}

.missive .contact-form .contact-row+.contact-row {
    margin-top: .35em
}

.missive .contact-form .alert-errors+.alert-errors {
    margin-top: .2em
}

.missive .contact-form button:focus .missive-icon {
    color: var(--blue-color)
}

.missive .profile-form .input-line:disabled {
    padding-bottom: 0
}

.missive .calendar-event .missive-button-icon+.missive-button-icon,.missive .contact-card-preview .missive-button-icon+.missive-button-icon,.missive .contact-card .missive-button-icon+.missive-button-icon {
    margin-left: 1em
}

.missive .calendar-event .missive-scroll,.missive .contact-card-preview .missive-scroll,.missive .contact-card .missive-scroll {
    padding-top: 0
}

.missive .calendar-event .preferences-box,.missive .contact-card-preview .preferences-box,.missive .contact-card .preferences-box {
    border: 0;
    margin: 0
}

.missive .calendar-event .label-small,.missive .contact-card-preview .label-small,.missive .contact-card .label-small {
    margin-bottom: 0
}

.missive .contact-header {
    min-height: 2.65em
}

.missive .contact-header .label-tokens {
    margin-left: -.4em
}

.missive .contact-header .label-token {
    color: var(--text-color-b);
    margin: .3em 0 0 .4em
}

.missive .contact-header .label-token .missive-icon-office-building {
    margin-right: .2em
}

.missive .contact-phonetic {
    border-bottom: 2px dashed var(--light-border-color);
    cursor: help;
    display: inline-block;
    padding-bottom: 1px
}

.missive .contact-markdown h1 {
    font-size: 2em
}

.missive .contact-markdown h2 {
    font-size: 1.5em
}

.missive .contact-markdown h3 {
    font-size: 1.25em
}

.missive .contact-markdown h4 {
    font-size: 1em
}

.missive .contact-markdown h5 {
    font-size: .875em
}

.missive .contact-markdown h6 {
    color: var(--text-color-c);
    font-size: .875em
}

.missive .contact-markdown h1,.missive .contact-markdown h2 {
    border-bottom: 1px solid var(--light-border-color)
}

.missive .contact-markdown ol,.missive .contact-markdown ul {
    list-style-position: inside;
    margin: 1em 0;
    padding-left: .5em
}

.missive .contact-markdown ol:first-child,.missive .contact-markdown ul:first-child {
    margin-top: 0
}

.missive .contact-markdown ol:last-child,.missive .contact-markdown ul:last-child {
    margin-bottom: 0
}

.missive .contact-markdown .heading {
    font-weight: 600;
    margin-bottom: .5em;
    margin-top: calc(var(--font-size)*1.5)
}

.missive .contact-markdown .heading:first-child {
    margin-top: 0
}

.missive .contact-card-preview .contact-actions-row .contact-actions {
    margin-left: .2em;
    visibility: hidden
}

.missive .contact-card-preview .contact-actions-row .contact-actions .missive-icon {
    margin-left: .5em
}

.missive .contact-card-preview .contact-actions-row:hover .contact-actions {
    visibility: visible
}

.missive .contact-card-preview+.contact-card-preview,.missive .contact-card-preview .contact-header+.contact-infos {
    margin-top: .5em
}

.missive .contact-card-options {
    background-color: var(--light-background-color);
    padding: var(--padding-small);
    position: relative
}

.missive .contact-card-options:after {
    background: linear-gradient(to top,var(--section-shadow-color),transparent);
    bottom: 0;
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0
}

.missive .styleguide-menu {
    border-right: 1px solid var(--border-color);
    min-width: 200px
}

.missive .styleguide-menu .nav-logo {
    margin: 0;
    padding: 2.1em 0 2.25em
}

.missive .styleguide-menu .list-item {
    border-color: transparent;
    padding: .75em 1em .75em 1.5em;
    transition: all .15s var(--easing)
}

.missive .styleguide-menu .list-item:hover,.missive .styleguide-menu .list-item[data-state~=selected] {
    background-color: var(--light-background-color)
}

.missive .styleguide-menu footer .list-item {
    border-top: 1px solid var(--light-background-color);
    padding: 1em 1.5em
}

.missive .styleguide-content {
    padding: 5%
}

.missive .styleguide-heading {
    color: var(--text-color-d)
}

.missive .styleguide-title {
    border-bottom: 1px solid var(--light-border-color);
    margin-bottom: 5%;
    padding-bottom: 1em
}

.missive .styleguide-block {
    border-radius: 5px;
    margin-bottom: 3.5em
}

.missive .styleguide-block.padding-block {
    padding: 2em
}

.missive .styleguide-block>.missive-columns>.styleguide-example:first-child {
    padding-right: 1em
}

.missive .styleguide-block>.missive-columns>.styleguide-example:last-child {
    padding-right: 0
}

.missive .styleguide-grouped-example {
    margin-top: .4em
}

.missive .styleguide-example {
    margin-top: 1em;
    padding: .5em 0
}

.missive .styleguide-example code {
    background-color: var(--light-background-color);
    border: 1px solid var(--border-color);
    border-radius: 4px;
    color: var(--text-color-a);
    font-size: 13px;
    margin-left: 1em;
    padding: .25em .65em .15em
}

.missive .styleguide-color {
    border-radius: 4px;
    box-shadow: inset 0 0 0 1px rgba(0,0,0,.1);
    padding: 1em 1.25em
}

.missive .styleguide-color-blue {
    background-color: var(--blue-color);
    color: #fff
}

.missive .styleguide-color-white {
    background-color: #fff
}

.missive .styleguide-color-background {
    background-color: var(--background-color)
}

.missive .styleguide-color-text {
    background-color: var(--text-color-a);
    color: #fff
}

.missive .styleguide-color-orange {
    background-color: var(--orange-color);
    color: #fff
}

.missive .styleguide-color-red {
    background-color: var(--red-color);
    color: #fff
}

.missive .styleguide-presence-avatar {
    margin: .4em auto 0!important
}

.missive .styleguide-presence-content {
    position: relative
}

.missive .styleguide-presence-cursors {
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%
}

.missive .styleguide-presence-cursors span {
    display: inline-block;
    height: 17px;
    position: relative;
    top: 2px;
    width: 2px
}

.missive .styleguide-icons .styleguide-example {
    flex: 1 0 25%;
    padding: .25em 0!important
}

.missive .styleguide-tooltip-container {
    position: relative
}

.missive .styleguide-example-calendar {
    width: 220px
}

.missive.missive-landing-page header {
    margin-top: var(--safe-area-inset-bottom);
    max-height: 350px;
    min-height: 160px;
    position: relative
}

.missive.missive-landing-page form {
    background-color: var(--conversation-list-background-color);
    border-radius: 10px;
    box-shadow: 0 2px 5px rgba(0,0,0,.05);
    padding: .5em .4em
}

.missive .landing-page-footer {
    padding-bottom: var(--safe-area-inset-bottom)
}

.missive .missive-login-form {
    max-width: 460px;
    width: 90%
}

.missive .oauth-providers {
    margin-left: auto;
    margin-right: auto;
    max-width: 440px
}

.missive .oauth-providers .button+.button {
    margin-left: .5em
}

.missive .oauth-providers .button {
    border: 0;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0,0,0,.05)
}

.missive .oauth-providers .button[data-state~=processing] .button-label {
    opacity: .4
}

.missive .oauth-providers-mobile {
    background-color: var(--comment-background-color);
    border-radius: 10px;
    display: inline-block;
    padding: .75em .9em
}

.missive .oauth-providers-mobile .button+.button {
    margin-left: .75em
}

.missive .oauth-providers-mobile .button {
    padding: 6px
}

.missive .nav-logo {
    display: inline-block;
    line-height: 1;
    text-align: center
}

.missive .nav-logomark .missive-icon,.missive .nav-logomark .missive-icon svg {
    height: 38px!important;
    width: 38px!important
}

.missive .nav-logotype .missive-icon,.missive .nav-logotype .missive-icon svg {
    height: 19px!important;
    width: 99px!important
}

.missive .login-notice-banner {
    background-color: rgba(0,0,0,.04);
    border-radius: 8px;
    margin-bottom: 1em;
    padding: 1.5em 2.25em 1.75em;
    position: relative
}

.missive .login-notice-banner .header-icon {
    margin-bottom: 1em
}

.missive .login-notice-banner h1+.subheading-a {
    margin-top: .25em
}

.missive .login-notice-banner .login-notice-close {
    border-radius: 100%;
    display: block;
    margin: .3em;
    padding: .2em;
    position: absolute;
    right: 0;
    top: 0
}

.missive .login-notice-banner .login-notice-close:hover {
    background-color: var(--border-color)
}

.missive .missive-app-launcher-form {
    max-width: 535px;
    width: 90%
}

.missive .missive-popup-responses .preferences-selectable-list .ReactVirtualized__Grid__innerScrollContainer {
    overflow: visible!important
}

.missive .missive-popup-responses .preferences-content {
    background-color: var(--background-color)!important;
    border-radius: 0 var(--border-radius) var(--border-radius) 0
}

.missive .missive-popup-responses .bar {
    position: relative
}

.missive .missive-popup-responses .bar:after {
    background: linear-gradient(to bottom,var(--section-shadow-color),transparent);
    bottom: calc(var(--section-shadow-width)*-1);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0
}

.missive .missive-popup-responses .missive-white-box {
    overflow: hidden
}

.missive .missive-popup-responses .reply-info .input-immersive {
    font-weight: 500;
    padding: 0
}

.missive .missive-popup-responses .compose-bar {
    padding: 0
}

.missive .missive-popup-responses .bottom-bar {
    border-bottom-right-radius: var(--border-radius)
}

.missive .response-preview {
    padding: 4px 6px
}

.missive .response-preview.response-preview-with-summary {
    padding: 5px 8px
}

.missive .response-preview:first-child:before {
    display: none
}

.missive .response-preview[data-state~=selected] {
    color: #fff
}

.missive .response-preview[data-state~=selected] .missive-icon-attachments,.missive .response-preview[data-state~=selected] .text-c {
    color: rgba(255,255,255,.65)
}

.missive .response-preview[data-state~=selected]+.response-preview:before,.missive .response-preview[data-state~=selected]:before {
    display: none
}

.missive .response-preview .response-preview-content-no-subject {
    height: 2.7em;
    overflow: hidden
}

.missive .response-preview .missive-icon-attachments {
    color: var(--text-color-c);
    margin-left: .5em
}

.missive .response-preview .missive-icon-attachments,.missive .response-preview .missive-icon-attachments svg {
    height: 12px;
    width: 12px
}

.missive .response-attachments {
    padding: .5em 0 .575em
}

.missive .response-attachments .missive-attachment {
    margin-top: 0
}

.missive .response-attachments .missive-scroll-horizontal .missive-attachment:first-child {
    margin-left: .65em
}

.missive .response-attachments .selectable-item-list {
    padding: 1px
}

.missive .dev-bar,.missive .dev-bar-dropdown {
    background-color: #222;
    color: #999;
    font-family: Helvetica Neue,Helvetica,Arial,sans-serif;
    font-size: 12px;
    font-weight: 600;
    position: relative;
    text-shadow: 0 1px 1px rgba(0,0,0,.75);
    white-space: nowrap;
    z-index: 1337
}

.missive .dev-bar-dropdown strong,.missive .dev-bar strong {
    color: #fff;
    font-size: 13px
}

.missive .dev-bar-dropdown select,.missive .dev-bar select {
    margin-left: .4em
}

.missive .dev-bar-dropdown a,.missive .dev-bar a {
    color: #fff;
    cursor: pointer
}

.missive .dev-bar-dropdown a:hover,.missive .dev-bar a:hover {
    color: var(--text-color-d)
}

.missive .dev-bar-dropdown .pending,.missive .dev-bar .pending {
    color: gold
}

.missive .dev-bar-dropdown .error,.missive .dev-bar .error {
    color: var(--red-color)
}

[data-wrapper=electron] .missive .dev-bar {
    padding-left: 72px
}

.missive .dev-bar-plugin {
    display: inline-block;
    height: 100%
}

.missive .dev-bar-plugin[data-state~=done] .dev-bar-title,.missive .dev-bar-plugin[data-state~=done] .dev-bar-title strong {
    color: lime
}

.missive .dev-bar-plugin[data-state~=pending] .dev-bar-title,.missive .dev-bar-plugin[data-state~=pending] .dev-bar-title strong {
    color: gold
}

.missive .dev-bar-plugin[data-state~=error] .dev-bar-title,.missive .dev-bar-plugin[data-state~=error] .dev-bar-title strong {
    color: var(--red-color)
}

.missive .dev-bar-plugin[data-state~=selected] .dev-bar-title {
    background-color: var(--dark-background-color)
}

.missive .dev-bar-title {
    line-height: var(--top-bar-height);
    padding: 0 .6em
}

[data-wrapper=electron][data-context=composer] .missive .dev-bar-title {
    line-height: 22px
}

.missive .dev-bar-dropdown {
    left: 0;
    line-height: 26px;
    position: absolute;
    top: 100%;
    width: 100%
}

.missive .dev-bar-dropdown table {
    width: 100%
}

.missive .dev-bar-dropdown tr:hover {
    background-color: rgba(255,255,255,.05)
}

.missive .dev-bar-dropdown tr {
    cursor: pointer
}

.missive .dev-bar-dropdown td.gap {
    width: 100%
}

.missive .dev-bar-dropdown td.time {
    font-size: 11px
}

.missive .dev-bar-dropdown td.data {
    font-family: Monaco;
    font-style: italic
}

.missive .dev-bar-dropdown td {
    padding: 0 .4em;
    white-space: nowrap;
    width: 1px
}

.missive .dev-bar-dropdown tr+tr td {
    border-top: 1px solid var(--dark-background-color)
}

.missive .dev-bar-dropdown-title {
    background-color: var(--dark-background-color);
    padding: 0 .6em
}

.missive .dev-bar-dropdown-title+.dev-bar-dropdown-title {
    background-color: #111
}

.missive .dev-bar-ellipsis-cell {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis
}

.missive .dev-bar-location {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    color: #fff;
    font-family: monospace
}

.missive ol,.missive p,.missive ul {
    margin: 0
}

.missive table {
    width: 100%
}

.missive th {
    font-weight: 400
}

.missive button {
    background: none;
    border: 0;
    color: var(--text-color-a);
    outline: 0;
    padding: 0
}

.missive-view-conversation {
    background: var(--background-color);
    position: relative;
    z-index: 1
}

.missive-view-conversation .conversation-title-actions {
    max-width: 100%
}

.missive-view-conversation .missive-title-container {
    min-width: 55%
}

.missive-view-conversation .missive-title {
    font-size: calc(var(--font-size) + 12px);
    font-weight: 400;
    margin: 0 12px 0 6px
}

[data-notch=left] .missive-view-conversation .missive-scroll .conversation-title {
    padding-left: calc(var(--safe-area-inset-left)/1.5)!important
}

.missive-view-conversation .missive-icon-starred svg {
    transition: fill var(--duration) var(--easing)
}

.conversation-dropzone.dropping .comment-textarea {
    box-shadow: 0 0 0 3px rgba(var(--blue-color-rgb),.3),0 0 0 1px rgba(var(--blue-color-rgb),.8)!important
}

.conversation-scroll {
    position: relative;
    z-index: 0
}

.missive-has-touch .conversation-scroll:after {
    bottom: 0;
    content: "";
    display: block;
    height: 1px;
    margin-bottom: -1px;
    position: absolute;
    width: 100%
}

.conversation-actions-container .conversation-actions {
    max-width: 100%
}

.conversation-title .missive-avatar-conversation {
    margin-right: 8px
}

.conversation-title .conversation-title-content.conversation-entry {
    margin-bottom: var(--padding-medium)
}

.conversation-title .conversation-title-content.conversation-entry .missive-avatar-conversation {
    margin-top: 5px
}

.conversation-title-content {
    background-color: var(--background-color)
}

.conversation-title[data-state~=absolute] {
    height: 0;
    z-index: 1
}

.conversation-title[data-state~=absolute][data-state~=animated] .conversation-title-content {
    transition: transform var(--duration) var(--easing)
}

.conversation-title[data-state~=absolute][data-state~=visible] .conversation-title-content {
    transform: translateY(-1px)
}

.conversation-title[data-state~=absolute] .conversation-title-content {
    pointer-events: auto;
    position: relative;
    transform: translateY(calc(-100% + var(--section-shadow-width)*-1))
}

.conversation-title[data-state~=absolute] .conversation-title-content:after {
    background: linear-gradient(to bottom,var(--section-shadow-color),transparent);
    bottom: calc(var(--section-shadow-width)*-1);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0
}

.conversation-title[data-state~=absolute] .conversation-title-content .missive-user-stack-item {
    color: var(--background-color)
}

.conversation-title[data-state~=absolute] .conversation-title-actions {
    max-width: 60%;
    padding: 0
}

.conversation-title[data-state~=absolute] .missive-title-container {
    min-width: 40%
}

.conversation-title[data-state~=absolute] .missive-title {
    font-size: calc(var(--font-size) + 2px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.conversation-assignment-compact[data-contextmenu-opened] {
    box-shadow: none!important
}

.conversation-title-actions {
    padding-top: 3px
}

.conversation-title-actions .conversation-labels {
    overflow: hidden;
    transition-duration: var(--material-duration);
    transition-property: padding,margin;
    transition-timing-function: var(--material-easing);
    vertical-align: top
}

.conversation-title-actions .conversation-labels:hover {
    margin-left: -14px
}

.conversation-title-actions .conversation-labels+.button-macos {
    margin-left: 5px
}

.conversation-title-actions .conversation-labels .label-token {
    padding: 1px 1px 1px 4px
}

.conversation-title-actions .token {
    margin-right: 0;
    top: -2px
}

.conversation-title-actions .missive-icon-not-watching svg {
    opacity: .5
}

.conversation-title-actions .missive-icon-star-filled {
    color: var(--starred-yellow-color)
}

.missive-contextmenu .white-menu {
    background: var(--popup-background-color);
    cursor: default
}

.missive-contextmenu .white-menu .missive-user-stack-item {
    color: var(--popup-background-color)
}

.tasks-menu {
    display: flex;
    max-width: 320px!important;
    min-width: 200px
}

.tasks-menu>div {
    display: flex;
    flex-direction: column;
    width: 100%
}

.tasks-menu .missive-scroll {
    padding: var(--padding-small)
}

.tasks-menu-option {
    padding: var(--padding)
}

.tasks-menu-option .comment-checkbox,.tasks-menu-option .missive-user-stack {
    margin-right: 3px
}

.tasks-menu-option .comment-text {
    white-space: pre-wrap
}

.tasks-menu-option blockquote {
    margin: 0
}

.tasks-menu-option .task-assignees .button-macos {
    top: 2px
}

.tasks-menu-actions {
    padding: var(--padding);
    padding-bottom: calc(var(--padding) - var(--padding-small))
}

.tasks-menu-loading {
    padding: .5em 0 .4em
}

.accesses-menu .tooltip-header .missive-checkpoint {
    font-weight: 400
}

.accesses-menu .tooltip-header .list-group-items {
    padding-top: 0
}

.label-form,.label-menu {
    padding-bottom: var(--safe-area-inset-bottom)
}

.label-menu-item .missive-avatar .icon-member-status {
    box-shadow: 0 0 0 2px var(--popup-background-color)
}

.label-menu-item[data-state~=focused] {
    background: var(--blue-color);
    color: #fff
}

.label-menu-item[data-state~=focused] svg {
    fill: #fff
}

.label-menu-item[data-state~=focused] .missive-avatar .icon-member-status {
    box-shadow: 0 0 0 2px var(--blue-color)
}

.label-menu-item .no-wrap {
    padding-right: .4em
}

.label-form .search .input {
    padding-left: 0;
    padding-right: 0;
    width: auto
}

.missive-contextmenu .emojis-menu {
    padding: 0
}

.trackers-menu {
    width: 340px
}

.trackers-menu .missive-icon-incognito {
    margin-right: .75em
}

.trackers-menu .blocked-tracker:nth-child(odd) {
    background-color: var(--background-color)
}

[data-theme^=dark] .trackers-menu .blocked-tracker:nth-child(odd) {
    background-color: var(--conversation-list-background-color)
}

.missive-no-touch .trackers-menu .blocked-tracker .missive-icon-copy {
    display: none
}

.missive-no-touch .trackers-menu .blocked-tracker:hover .missive-icon-copy {
    display: block
}

.conversation-accesses+.button-macos {
    margin-left: -2px
}

.missive-composer .conversation-add-user:first-child {
    padding-bottom: 3px;
    padding-top: 4px
}

.missive-composer .conversation-accesses+.conversation-add-user {
    margin-left: .45em
}

.conversation-entries-pagination-loading {
    margin-top: 42px
}

.conversation-entries {
    padding-bottom: 22px
}

.missive-has-touch .conversation-entries {
    padding-bottom: 42px
}

.conversation-entry {
    margin: var(--padding) var(--padding-medium) 0
}

[data-notch=right] .conversation-entry {
    padding-right: calc(var(--safe-area-inset-right)/1.5)
}

[data-notch=left] .conversation-entry {
    padding-left: calc(var(--safe-area-inset-left)/1.5)
}

.conversation-entry,.conversation-entry .missive-white-box {
    color: var(--text-color-a)
}

.conversation-entry[data-state~=selected] .generic-account-message-body {
    position: relative;
    z-index: 2!important
}

.conversation-entry[data-state~=selected] .missive-message-text:first-child {
    box-shadow: 0 0 0 2px var(--light-background-color),0 0 0 4px var(--blue-color)!important;
    position: relative
}

.conversation-entry[data-state~=selected]:not(:has(.generic-account-message-body)) {
    box-shadow: 0 0 0 2px var(--blue-color)
}

.entry-timestamp,.entry-timestamp+.conversation-entry {
    margin-top: 5px
}

.entry-timestamp+.comment-with-author-name {
    margin-top: -4px
}

.entry-timestamp+.missive-post {
    margin-top: 0
}

.generic-account-message,.message {
    border-radius: var(--border-radius-large);
    color: var(--text-color-a);
    position: relative;
    transition: padding var(--material-duration) var(--material-easing)
}

.generic-account-message .collapsable-box-content,.generic-account-message .missive-message-preview,.message .collapsable-box-content,.message .missive-message-preview {
    height: 3.114em
}

.generic-account-message[data-type=twitter_tweet] .message-from .button-macos .text-c,.message[data-type=twitter_tweet] .message-from .button-macos .text-c {
    color: var(--twitter-color)
}

.generic-account-message .missive-message-header,.message .missive-message-header {
    position: relative;
    transition: padding var(--material-duration) var(--material-easing)
}

.generic-account-message .missive-message-header:after,.message .missive-message-header:after {
    background-color: var(--section-shadow-color);
    content: "";
    height: 1px;
    left: 12px;
    opacity: .7;
    position: absolute;
    right: 12px;
    top: 100%;
    transition: opacity var(--material-duration) var(--material-easing)
}

.generic-account-message .missive-message-header .button-macos,.message .missive-message-header .button-macos {
    padding: 4px 6px;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.generic-account-message .draft-preview-controls,.message .draft-preview-controls {
    margin: 0 var(--padding-small)
}

.generic-account-message .draft-preview-controls .button-macos,.message .draft-preview-controls .button-macos {
    padding: 10px 14px
}

.generic-account-message[data-opened] .message-details .missive-icon-arrow-right,.message[data-opened] .message-details .missive-icon-arrow-right {
    width: 17px
}

.generic-account-message[data-actions],.message[data-actions] {
    padding-bottom: 20px
}

.generic-account-message[data-info] .message-info,.message[data-info] .message-info {
    height: auto
}

.generic-account-message[data-info] .message-details .missive-icon-arrow-right svg,.message[data-info] .message-details .missive-icon-arrow-right svg {
    transform: rotate(90deg)
}

.generic-account-message[data-collapsed] .missive-message-header,.message[data-collapsed] .missive-message-header {
    padding-bottom: 0
}

.generic-account-message[data-collapsed] .missive-message-header:after,.message[data-collapsed] .missive-message-header:after {
    opacity: 0
}

.generic-account-message .missive-message-body,.generic-account-message .missive-message-header,.generic-account-message .missive-message-preview,.message .missive-message-body,.message .missive-message-header,.message .missive-message-preview {
    padding: 12px
}

.generic-account-message .missive-message-body,.generic-account-message .missive-message-preview,.message .missive-message-body,.message .missive-message-preview {
    -webkit-font-smoothing: subpixel-antialiased;
    transition: opacity 125ms var(--material-easing)
}

.generic-account-message.collapsable-box .collapsable-box-content,.message.collapsable-box .collapsable-box-content {
    display: block;
    overflow: hidden;
    position: relative;
    transition: padding var(--material-duration) var(--material-easing)
}

.generic-account-message.collapsable-box .collapsable-box-content .missive-message-body,.message.collapsable-box .collapsable-box-content .missive-message-body {
    opacity: 0
}

.generic-account-message.collapsable-box[data-opened] .collapsable-box-content,.message.collapsable-box[data-opened] .collapsable-box-content {
    height: auto
}

.generic-account-message.collapsable-box[data-opened] .missive-message-preview,.message.collapsable-box[data-opened] .missive-message-preview {
    opacity: 0
}

.generic-account-message.collapsable-box[data-opened] .missive-message-body,.message.collapsable-box[data-opened] .missive-message-body {
    opacity: 1;
    z-index: 1
}

.generic-account-message.collapsable-box[data-opened]+.missive-message-actions-container,.message.collapsable-box[data-opened]+.missive-message-actions-container {
    height: auto;
    opacity: 1
}

.generic-account-message.collapsable-box[data-opened]+.missive-message-actions-container .missive-message-actions,.message.collapsable-box[data-opened]+.missive-message-actions-container .missive-message-actions {
    margin-top: -20px
}

.generic-account-message.collapsable-box[data-opened]+.missive-message-actions-container .missive-message-actions .button-macos-group,.message.collapsable-box[data-opened]+.missive-message-actions-container .missive-message-actions .button-macos-group {
    pointer-events: auto
}

.generic-account-message .missive-message-preview,.message .missive-message-preview {
    color: var(--text-color-d);
    left: 0;
    position: absolute;
    top: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    width: 100%;
    z-index: 1
}

.message-from .missive-avatar {
    margin-right: 6px
}

.message-from .button-macos-thin {
    line-height: 1
}

.message-from .button-macos.missive-icon-arrow-down {
    color: var(--text-color-d)!important;
    margin-left: 0;
    padding: 4px
}

.message-details,.message-details-mobile {
    position: relative
}

.message-details-mobile .missive-icon-attachments,.message-details .missive-icon-attachments {
    font-size: 0
}

.message-details-mobile .missive-icon-attachments svg,.message-details .missive-icon-attachments svg {
    fill: var(--text-color-c)
}

.message-details-mobile .missive-icon-attachments,.message-details-mobile .missive-icon-attachments svg,.message-details .missive-icon-attachments,.message-details .missive-icon-attachments svg {
    height: 12px;
    width: 12px
}

.message-details .button-macos+.button-macos {
    margin-left: 2px
}

.missive-has-touch .message-details .button-macos+.button-macos {
    margin-left: 5px
}

.message-details .missive-icon-arrow-right {
    overflow: hidden;
    transition: width var(--material-duration) var(--material-easing);
    width: 0
}

.message-details .missive-icon-arrow-right svg {
    transition: transform var(--material-duration) var(--material-easing)
}

.message-info {
    height: 0;
    position: relative
}

.message-info:after {
    background: linear-gradient(to bottom,var(--section-shadow-color),transparent);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    opacity: .7;
    position: absolute;
    right: 0;
    top: 0
}

.message-info .message-info-content {
    background-color: var(--light-background-color);
    position: relative
}

.message-info .message-info-content:after {
    background: linear-gradient(to top,var(--section-shadow-color),transparent);
    bottom: 0;
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    opacity: .7;
    position: absolute;
    right: 0
}

.message-info .message-info-content .message-info-key {
    padding: 4px 0
}

.message-info .message-info-content .button-macos,.message-info .message-info-content .message-info-key,.message-info .message-info-content .message-info-value {
    line-height: 17px;
    padding-bottom: 4px;
    padding-top: 4px
}

.message-info .message-info-content .button-macos,.message-info .message-info-content .message-info-value {
    color: var(--text-color-a);
    margin-left: -2px;
    padding-left: 6px;
    padding-right: 6px
}

.message-info .message-info-content .button-macos {
    -webkit-user-select: all;
    -moz-user-select: all;
    user-select: all
}

.message-info td {
    padding: 0;
    vertical-align: top
}

.missive-message-body {
    position: relative
}

.missive-message-body[data-theme=light] {
    background-color: var(--conversation-list-background-color);
    border-radius: 0 0 var(--border-radius) var(--border-radius);
    color: var(--text-color-a);
    overflow: hidden;
    padding-top: var(--padding)!important
}

.missive-message-body[data-theme=inverted] .missive-message-content {
    --text-color-a: #111;
    --message-filter: invert(1) hue-rotate(180deg);
    color: var(--text-color-a)
}

.missive-message-content-container {
    position: relative
}

.missive-message-content-container.missive-scroll {
    overflow-y: hidden!important
}

.missive-message-content {
    border-radius: var(--border-radius);
    overflow: hidden;
    transform-origin: top left
}

.missive-message-content table {
    -webkit-text-size-adjust: none!important
}

.missive-message-attachments * {
    box-sizing: border-box
}

.padding-block>.missive-message-attachments {
    padding: 0
}

.message-loading-text {
    color: var(--text-color-c)
}

.missive-attachment {
    display: inline-block;
    margin: var(--padding) var(--padding) 0 0
}

.missive-message-actions-container {
    height: 0;
    opacity: 0;
    pointer-events: none;
    position: relative;
    transition: opacity var(--material-duration) var(--material-easing);
    z-index: 3
}

.missive-message-actions {
    margin: 0 12px;
    padding: 0 12px;
    transition: margin-top var(--material-duration) var(--material-easing)
}

.missive-message-actions .button-macos-group {
    background-color: var(--tooltip-background-color);
    box-shadow: 0 0 0 1px rgba(0,0,0,.05),0 2px 4px rgba(0,0,0,.1);
    margin: 0 6px 6px 0!important;
    position: relative;
    z-index: 1
}

.missive-message-actions .button-macos .main-icon+span {
    margin-left: var(--padding)
}

.missive-rotation {
    -webkit-animation: spin 1s linear infinite both;
    animation: spin 1s linear infinite both
}

.draft [data-state~=clickable],.draft [data-state~=clickable] * {
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.missive-has-touch .draft .missive-message-body {
    pointer-events: none
}

.draft .missive-white-box {
    margin-left: var(--padding);
    position: relative
}

.draft>.missive-avatar {
    margin-top: .5em
}

.draft .conversation-presences {
    right: 13px;
    top: 6px
}

.draft-info-messages {
    background-color: var(--light-background-color);
    border-radius: 0 0 var(--border-radius-large) var(--border-radius-large);
    position: relative
}

.draft-info-messages:after {
    background: linear-gradient(to bottom,var(--section-shadow-color),transparent);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.composer-message table,.composer-message table img:not([width]),.draft table,.draft table img:not([width]) {
    max-width: none;
    width: auto
}

.generic-account-message {
    position: relative
}

.generic-account-message:not([data-type=custom_html]) .missive-message-text {
    border-radius: 1.3em;
    color: #fff;
    display: inline-block;
    font-weight: 500;
    max-width: 85%;
    padding: 5px 11px 6px
}

.generic-account-message:not([data-type=custom_html]) .missive-message-text a {
    color: currentColor
}

.generic-account-message .missive-attachment-document {
    border-radius: 10px
}

.generic-account-message.generic-account-message-by-other[data-type=messenger_message] .missive-message-text {
    background-color: var(--messenger-color)
}

.generic-account-message.generic-account-message-by-other[data-type=instagram_message] .missive-message-text {
    background: linear-gradient(180deg,#8b2fb8,#6758cd 51%,#5974db 92%);
    background-attachment: fixed;
    color: #fff
}

.generic-account-message.generic-account-message-by-other[data-type=custom_text] .missive-message-text {
    background-color: var(--custom-text-color)
}

.generic-account-message.generic-account-message-by-other[data-type=twilio_message] .missive-message-text {
    background-color: var(--twilio-color)
}

.generic-account-message.generic-account-message-by-other[data-type=twilio_whatsapp_message] .missive-message-text {
    background-color: var(--whatsapp-color);
    border-radius: 7.5px;
    box-shadow: 0 1px .5px rgba(0,0,0,.13);
    color: #34363a;
    margin-bottom: 1px
}

.generic-account-message.generic-account-message-by-other[data-type=twilio_chat_message] .missive-message-text {
    background-color: var(--twilio-chat-color)
}

.generic-account-message.generic-account-message-by-other[data-type=twitter_direct_message] .missive-message-text {
    background-color: var(--twitter-color)
}

.generic-account-quote .missive-message-text {
    background: var(--generic-message-color)!important;
    color: var(--text-color-b)!important;
    font-weight: 400!important;
    margin-bottom: -1em!important;
    max-width: 89%!important;
    padding-bottom: 1.5em!important
}

.generic-account-message-by-user:not([data-type=custom_html]) .missive-message-text {
    background: none!important;
    background-color: var(--generic-message-color)!important;
    color: var(--text-color-a)!important
}

.generic-account-message-only-emojis .missive-message-text:not([data-quote]) {
    background-color: transparent!important;
    background: none!important;
    box-shadow: none!important;
    font-size: 64px;
    margin: 0 0 -12px -3px;
    padding: 0
}

.generic-account-message-only-emojis:not([data-quote])+.generic-account-message:not([data-quote]) .missive-message-text:not([data-quote]) {
    margin-top: 12px
}

.generic-account-message-only-emojis+.generic-account-message-only-emojis .missive-message-text:not([data-quote]) {
    margin-top: -6px
}

.generic-account-message-to {
    margin-left: .3em
}

.generic-account-message-body .missive-icon-more {
    opacity: 0
}

.generic-account-message-body .missive-icon-more[data-contextmenu-opened],.missive-no-touch .generic-account-message-body:hover .missive-icon-more {
    opacity: 1
}

.generic-account-message-attachments .token-attachment-document,.generic-account-message-attachments .token-attachment-image {
    margin-top: 0
}

.generic-account-message-attachments .token-attachment-image~.token-attachment-document {
    margin-top: 8px
}

.conversation-entry.generic-account-message-merged-with-next {
    border-bottom: 0;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    margin-bottom: 0
}

.conversation-entry.generic-account-message-merged-with-next .missive-message-body {
    padding-bottom: 0
}

.conversation-entry.generic-account-message-merged-with-prev {
    border-top: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    margin-top: 0
}

.conversation-entry.generic-account-message-merged-with-prev .missive-message-body {
    padding-top: 0
}

.conversation-entry.generic-account-message-merged-with-prev .generic-account-message-avatar:not([data-quote]) .missive-avatar {
    height: 0!important
}

.conversation-entry.generic-account-message-merged-with-prev .generic-account-message-avatar:not([data-quote]) .missive-avatar img {
    display: none
}

.conversation-entry.generic-account-message-merged-with-prev.missive-white-box {
    margin-top: var(--section-shadow-width)!important
}

.conversation-entry.generic-account-message-merged-with-prev.missive-white-box:before {
    background-color: var(--conversation-list-background-color);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    top: calc(var(--section-shadow-width)*-1);
    width: 100%
}

.missive-cloud-attachment {
    background: var(--conversation-list-background-color);
    border-radius: 4px;
    box-shadow: 0 .5px 0 var(--border-color),0 0 0 1px var(--light-border-color);
    color: var(--text-color-c);
    cursor: pointer!important;
    cursor: default;
    display: inline-block;
    font-size: calc(var(--font-size) - 1px);
    margin: 1px;
    max-width: 260px;
    min-width: 180px;
    outline: none!important;
    overflow: hidden;
    padding: 14px 9px;
    position: relative;
    text-decoration: none
}

.missive-cloud-attachment .missive-cloud-attachment-filename {
    color: var(--text-color-a);
    display: inline-block
}

.missive-cloud-attachment .missive-cloud-attachment-details {
    color: var(--text-color-c);
    display: block;
    font-size: calc(var(--font-size) - 3px)
}

.missive-cloud-attachment .missive-cloud-attachment-preview {
    margin-right: .15em;
    position: relative
}

.missive-attachment-document,.missive-attachment-document-container {
    border-radius: 8px
}

.missive-attachment-document {
    background-color: var(--popup-background-color);
    box-shadow: 0 0 0 1px rgba(var(--text-color-a-rgb),.1);
    cursor: default;
    display: inline-block;
    font-size: calc(var(--font-size) - 1px);
    line-height: 1.4;
    max-width: 260px;
    min-width: 180px;
    outline: none!important;
    overflow: hidden;
    padding: 5px 7px;
    position: relative;
    text-decoration: none
}

.missive-attachment-document .attachment-filename {
    color: var(--text-color-a);
    display: block
}

.missive-attachment-document .attachment-filename span {
    vertical-align: bottom
}

.missive-attachment-document .attachment-filename .no-wrap {
    display: inline-block
}

.missive-attachment-document .missive-attachment-document-details {
    color: var(--text-color-c);
    display: block;
    font-size: calc(var(--font-size) - 3px);
    line-height: 1.2
}

.missive-attachment-document .missive-attachment-document-preview {
    margin-right: 7px;
    position: relative
}

.missive-attachment-document .missive-attachment-document-preview .spinner {
    left: 50%;
    opacity: 0;
    position: absolute;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    visibility: hidden
}

.missive-attachment-document .missive-attachment-document-preview .spinner svg {
    -webkit-animation-play-state: paused;
    animation-play-state: paused
}

.missive-attachment-document .missive-attachment-document-actions {
    margin-left: 10px
}

.missive-attachment-document .button-macos {
    margin-left: 0!important
}

.missive-attachment-document .missive-attachment-upload-progress {
    background-color: var(--light-blue-color);
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transition-duration: 1s;
    transition-property: width,opacity;
    transition-timing-function: var(--material-easing);
    width: 0;
    z-index: 0
}

.missive-attachment-document>div {
    z-index: 1
}

[data-wrapper=browser] .missive-attachment-document {
    cursor: pointer
}

.missive-scroll-horizontal .missive-attachment-document {
    margin: 1px 0
}

html[data-scope=token][data-state~=focused] .token[data-state~=selected] .missive-attachment-document {
    background-color: var(--blue-color)!important;
    box-shadow: 0 0 0 1px var(--blue-color)!important
}

html[data-scope=token][data-state~=focused] .token[data-state~=selected] .missive-attachment-document .attachment-filename {
    color: #fff
}

html[data-scope=token][data-state~=focused] .token[data-state~=selected] .missive-attachment-document .missive-attachment-document-details {
    color: rgba(255,255,255,.75)
}

html[data-scope=token][data-state~=focused] .token[data-state~=selected] .missive-attachment-document .missive-attachment-upload-progress {
    background-color: rgba(255,255,255,.3)
}

html[data-scope=token][data-state~=focused] .token[data-state~=selected] .missive-attachment-document .missive-attachment-document-preview .missive-icon-document {
    transition: opacity var(--duration) var(--easing)
}

html[data-scope=token][data-state~=focused] .token[data-state~=selected] .missive-attachment-document .missive-attachment-document-preview .spinner svg {
    stroke: #fff
}

html[data-scope=token][data-state~=focused] .token[data-state~=selected] .missive-attachment-document .missive-attachment-document-actions i {
    color: #fff
}

html[data-scope=token][data-state~=focused] .token[data-state~=selected] .missive-attachment-document .missive-attachment-document-actions i:hover {
    color: rgba(255,255,255,.55)
}

html[data-state~=unfocused] .token[data-state~=selected] .missive-attachment-document {
    background-color: var(--light-border-color)!important;
    box-shadow: 0 0 0 1px var(--light-border-color)!important
}

.missive-attachment-document[data-state=loading]:hover * {
    cursor: progress
}

.missive-attachment-document[data-state~=loading]>div {
    opacity: .6
}

.missive-icon-document {
    height: 32px;
    position: relative;
    width: 26px
}

.missive-icon-document:before {
    background-color: #787a80;
    border-radius: 4px;
    -webkit-clip-path: polygon(0 0,18px 0,100% 8px,100% 100%,0 100%);
    clip-path: polygon(0 0,18px 0,100% 8px,100% 100%,0 100%);
    content: "";
    inset: 0;
    position: absolute
}

.missive-icon-document:after {
    background-color: var(--input-background-color);
    border-radius: 0 0 0 2px;
    -webkit-clip-path: polygon(0 0,100% 100%,0 100%);
    clip-path: polygon(0 0,100% 100%,0 100%);
    content: "";
    height: 8px;
    position: absolute;
    right: 1px;
    top: 1px;
    width: 8px
}

.missive-icon-document span {
    bottom: 0;
    color: #fff;
    font-size: 9px;
    font-weight: 700;
    left: 0;
    margin: 1px 2px;
    overflow-x: hidden;
    position: absolute;
    right: 0;
    text-align: center;
    text-transform: uppercase;
    white-space: nowrap;
    z-index: 1
}

.missive-icon-document[data-ext=pdf]:before {
    background-color: #d0021b
}

.missive-icon-document[data-ext=doc]:before {
    background-color: #006fbc
}

.missive-icon-document[data-ext=docx]:before {
    background-color: #275497
}

.missive-icon-document[data-ext=csv]:before,.missive-icon-document[data-ext=xls]:before,.missive-icon-document[data-ext=xlsx]:before {
    background-color: #207148
}

.missive-icon-document[data-ext=ppt]:before {
    background-color: #e76416;
    background-color: #d04626
}

.missive-icon-document[data-ext=psd]:before {
    background-color: #2a4675
}

.missive-icon-document[data-ext=ai]:before {
    background-color: #ff7e19
}

.missive-icon-document[data-ext=pages]:before {
    background-color: #f6931d
}

.missive-icon-document[data-ext=numbers]:before {
    background-color: #12d320
}

.missive-icon-document[data-ext=keynote]:before {
    background-color: #1e8ff8
}

.missive-attachment-document-condensed {
    padding: 0 .2em
}

.missive-attachment-document-condensed a,.missive-attachment-document-condensed span {
    display: inline-block;
    padding-left: .4em
}

.missive-attachment-document-condensed .missive-icon-arrow-details {
    margin-left: .2em;
    transform: rotate(180deg)
}

.missive-attachment-document-condensed[data-state~=collapsed] .missive-icon-arrow-details {
    transform: rotate(0)
}

.missive-attachment-document-download-all {
    color: var(--text-color-a);
    height: 38px;
    min-width: 0;
    padding: 0;
    width: 38px
}

.missive-attachment-document-download-all.token-attachment-document {
    margin-bottom: -3px
}

.missive-attachment-document-download-all .missive-attachment-document-preview {
    left: -1px;
    margin: 10px auto;
    position: relative;
    width: 17px
}

.missive-attachment-document-download-all .missive-attachment-document-preview:after {
    background-color: var(--text-color-a);
    bottom: -2px;
    content: "";
    height: 3px;
    left: 0;
    position: absolute;
    width: 100%
}

.token-attachment-image {
    margin: 2px 0
}

.token-attachment-image+.token-attachment-image {
    margin-top: 10px
}

.token-attachment-document {
    margin: 8px 10px 0 0
}

.comment {
    position: relative
}

.comment[data-contextmenu-opened] .comment-actions,.comment[data-state~=editing] .comment-actions,.missive-no-touch .comment:hover .comment-actions {
    opacity: 1;
    pointer-events: auto
}

.comment[data-state~=editing] .comment-body:not(.comment-with-quote) .comment-bubble {
    padding: 0!important
}

.comment[data-contextmenu-opened] {
    box-shadow: none!important
}

.comment .missive-icon-arrow-details[data-state~=expanded] {
    transform: rotate(180deg)
}

.comment .missive-icon-arrow-details[data-state~=collapsed] {
    transform: rotate(0)
}

.comment-actions,.message-actions,.post-actions {
    opacity: 0;
    pointer-events: none
}

.missive-has-touch .comment-actions,.missive-has-touch .message-actions,.missive-has-touch .post-actions {
    overflow: hidden;
    visibility: hidden;
    width: 0
}

.comment-actions .comment-action+.comment-action,.message-actions .comment-action+.comment-action,.post-actions .comment-action+.comment-action {
    margin-left: .5em
}

.comment-actions time,.message-actions time,.post-actions time {
    border-left: 1px solid var(--light-border-color);
    margin-left: 8px;
    padding-left: 6px
}

.comment-box {
    padding: var(--padding);
    padding-bottom: max(var(--safe-area-inset-bottom),var(--padding));
    padding-top: 0;
    position: relative
}

.comment-box .missive-action-banners-container {
    bottom: 100%;
    padding-bottom: var(--padding)
}

.comment-box .comment-textarea textarea {
    background: none;
    border: 0;
    margin: 0;
    position: relative;
    transition-property: border-color
}

.comment-box .comment-highlighter,.comment-box .comment-textarea textarea {
    border-radius: var(--border-radius);
    line-height: 1.4;
    padding: 7px var(--padding)
}

.comment-box .comment-highlighter,.comment-box .comment-textarea {
    background-color: var(--input-background-color);
    border-radius: var(--border-radius)
}

.comment-box .comment-highlighter>.missive-columns,.comment-box .comment-textarea>.missive-columns {
    padding: 2px 3px 2px 2px
}

.comment-box .comment-highlighter {
    color: transparent;
    left: 0;
    overflow: hidden;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    white-space: pre-wrap
}

.comment-box .comment-highlighter b {
    font-weight: 400;
    position: relative
}

.comment-box .comment-highlighter b:before {
    background: var(--light-blue-color);
    border: 1px solid rgba(var(--text-color-a-rgb),.1);
    border-radius: var(--border-radius-small);
    bottom: -1px;
    content: "";
    left: -2px;
    position: absolute;
    right: -2px;
    top: 0
}

.comment-box .comment-task-checkbox {
    margin: 7px 5px 0
}

.missive-has-touch .comment-box .comment-task-checkbox {
    margin: 12px 8px 0
}

.comment-box .compose-attachments-container {
    border-radius: 0 0 var(--border-radius) var(--border-radius);
    height: 0;
    overflow: hidden;
    transition: height var(--material-duration) var(--material-easing)
}

.comment-box .compose-attachments {
    background-color: var(--light-background-color);
    border: 0;
    border-radius: 0 0 var(--border-radius) var(--border-radius);
    position: relative
}

.comment-box .compose-attachments:after {
    background: linear-gradient(to bottom,var(--section-shadow-color),transparent);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.comment-box .compose-attachments .missive-attachment-document {
    background-color: var(--input-background-color)
}

.comment-box .compose-attachments-placeholder {
    padding-left: 12px;
    padding-right: 12px
}

.comment-box .compose-attachments-placeholder .preferences-shortcuts-shortcut {
    padding: 0;
    position: relative;
    top: -1px
}

.comment-box .compose-attachments-placeholder .preferences-shortcuts-token {
    border: 0;
    line-height: 1;
    margin: 0;
    padding: 4px 6px
}

.missive-user-changed-task {
    cursor: default;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.comment-quote {
    background-color: var(--comment-background-color);
    border-radius: 14px;
    line-height: 18px;
    margin-left: .3em;
    min-width: 0;
    padding: 6px 9px;
    position: relative;
    white-space: pre-wrap
}

.comment-quote cite {
    font-weight: 500
}

.comment-quote .comment-text {
    color: var(--text-color-a)
}

.comment-textarea {
    transition: box-shadow var(--material-duration) var(--material-easing)
}

.comment-textarea[data-state~=focused] {
    box-shadow: 0 0 0 1px var(--blue-color)
}

.comment-textarea.button-macos-group {
    padding: 0
}

.comment-textarea-body {
    position: relative
}

.comment-box-task-bar {
    padding: var(--padding-small) 0;
    position: relative
}

.comment-box-task-bar:after {
    background: linear-gradient(to top,var(--section-shadow-color),transparent);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0;
    top: calc(var(--section-shadow-width)*-1);
    transition: opacity var(--material-duration) var(--material-easing)
}

.comment-box-task-bar+.comment-box-task-bar:after {
    display: none
}

.comment-box-meta-bar[data-state~=visible]+.conversation-footer .comment-box-task-bar:after {
    opacity: 0
}

.assignment-task-bar {
    padding: var(--padding-small)
}

.assignment-task-bar .comment-task-assign {
    padding: 4px 4px 4px 10px
}

.comment-tools {
    padding: 2px
}

.comment-tools .text-xsmall {
    line-height: 17px
}

.missive-has-touch .comment-tools .button-macos+.button-macos {
    margin-left: 5px
}

.comment-tools+.comment-textarea-body .comment-highlighter,.comment-tools+.comment-textarea-body textarea {
    padding-left: 2px!important
}

.comment-task {
    margin-right: .35em;
    position: relative
}

.conversation-footer .comment-textarea[data-state~=empty] .comment-send-button,.conversation-footer .comment-textarea[data-state~=empty] .comment-send-button .button-macos {
    margin-left: 0;
    opacity: 0;
    padding-left: 0;
    padding-right: 0;
    width: 0
}

.conversation-footer .comment-send-button {
    margin-left: 10px
}

.conversation-footer .comment-send-button .button-macos {
    padding: 10px 14px
}

.conversation-footer .conversation-actions,.conversation-footer .conversation-actions-container {
    width: 100%
}

.comment-body,.comment-meta {
    margin-left: .3em
}

.comment-author {
    padding: 0 1em 1px
}

.comment-body .comment-bubble {
    flex-shrink: 1;
    padding: 4px 8px
}

.comment-body .comment-bubble,.comment-body .comment-highlighter,.comment-body .comment-textarea,.comment-body .comment-textarea textarea {
    border-radius: 12px;
    line-height: 20px
}

.comment-body .comment-highlighter,.comment-body .comment-textarea textarea {
    padding: 2px 6px
}

.comment-body .comment-box {
    padding: 0
}

.comment-body .comment-box .comment-task-checkbox {
    margin: 2px 1px 2px 4px
}

.comment-body .comment-bubble,.comment-body .comment-reactions {
    max-width: 85%
}

.comment-body .comment-bubble {
    background-color: var(--comment-background-color);
    white-space: pre-wrap
}

.comment-body .comment-bubble .comment-task {
    margin-right: .35em
}

.comment-body .comment-bubble .missive-user-stack-item {
    color: var(--comment-background-color)
}

.comment-body .comment-edit-actions {
    background-color: var(--light-background-color);
    border-radius: 0 0 12px 12px;
    padding: var(--padding-small);
    position: relative
}

.comment-body .comment-edit-actions:after {
    background: linear-gradient(to bottom,var(--section-shadow-color),transparent);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.comment-body b {
    line-height: 1
}

.comment-body.comment-attachment-document .comment-bubble {
    padding: 4px
}

.comment-body.comment-attachment-document .missive-attachment-document {
    box-shadow: none
}

.comment-body .comment-edited,.comment-body .link-b {
    margin-left: .4em
}

.comment-body .task-assignees {
    display: inline-block
}

.comment-body .task-assignees .missive-user-stack {
    position: relative;
    top: 3px
}

.comment-body .comment-quote-container {
    margin: 2px -2px 4px
}

.comment-body .comment-quote {
    background-color: currentColor;
    border-radius: 8px;
    color: var(--comment-background-color-quote);
    margin: 0
}

.comment-body .comment-quote .missive-max-height-gradient {
    background-image: linear-gradient(to bottom,rgba(var(--comment-background-color-quote-rgb),0) 0,currentColor 70%)!important;
    bottom: 0;
    height: 70%;
    top: auto
}

.comment-checkbox {
    position: relative;
    top: 2px
}

.comment-checkbox .checkbox {
    margin-right: 5px
}

.missive-has-touch .comment-checkbox .checkbox {
    margin-right: 7px
}

.comment-body a,.comment-quote a,.post-content a,.tasks-menu-option a {
    text-decoration: none
}

.comment-body a:focus,.comment-body a:hover,.comment-quote a:focus,.comment-quote a:hover,.post-content a:focus,.post-content a:hover,.tasks-menu-option a:focus,.tasks-menu-option a:hover {
    text-decoration: underline
}

.comment-body ol,.comment-body ul,.comment-quote ol,.comment-quote ul,.post-content ol,.post-content ul,.tasks-menu-option ol,.tasks-menu-option ul {
    padding-left: 1.2em
}

.comment-body blockquote,.comment-quote blockquote,.post-content blockquote,.tasks-menu-option blockquote {
    margin: 0;
    padding: 0 0 0 .7em;
    position: relative
}

.comment-body blockquote:before,.comment-quote blockquote:before,.post-content blockquote:before,.tasks-menu-option blockquote:before {
    background-color: #8a8c8e;
    border-radius: 2px;
    bottom: 3px;
    content: "";
    left: 1px;
    position: absolute;
    top: 3px;
    width: 2px
}

.comment-body code,.comment-body pre,.comment-quote code,.comment-quote pre,.post-content code,.post-content pre,.tasks-menu-option code,.tasks-menu-option pre {
    background-color: var(--light-border-color);
    border-radius: var(--border-radius-small);
    padding: 2px 5px;
    white-space: break-spaces
}

.comment-body pre,.comment-quote pre,.post-content pre,.tasks-menu-option pre {
    border-radius: var(--border-radius);
    margin: 4px 0;
    overflow: auto;
    padding: 8px 11px;
    white-space: pre
}

.comment-body code,.comment-body pre,.comment-quote code,.comment-quote pre {
    background-color: rgba(0,0,0,.1)
}

.comment-from-user .comment-bubble {
    background-color: var(--comment-user-background-color)
}

.comment-from-user .comment-bubble blockquote:before {
    background-color: #6194c7
}

.comment-from-user .comment-bubble .missive-user-stack-item {
    color: var(--comment-user-background-color)
}

.comment-from-user .comment-quote {
    color: var(--comment-user-background-color-quote)
}

.comment-mentions-user .comment-bubble {
    background-color: var(--comment-mentions-background-color);
    color: #fff
}

.comment-mentions-user .comment-bubble a {
    color: #a9dbff
}

.comment-mentions-user .comment-bubble a:focus,.comment-mentions-user .comment-bubble a:hover {
    color: #fff
}

.comment-mentions-user .comment-bubble blockquote:before {
    background-color: #71aaff
}

.comment-mentions-user .comment-bubble .missive-user-stack-item {
    color: var(--comment-mentions-background-color)
}

.comment-mentions-user .comment-quote {
    color: var(--comment-mentions-background-color-quote)
}

.comment-mentions-user .comment-quote .comment-text {
    color: #fff
}

.comment-only-emojis .comment-content .missive-emoji {
    height: 47px!important;
    width: 47px!important
}

.comment-only-emojis .comment-content .missive-emoji .emoji-mart-emoji-native>span {
    font-size: 47px!important
}

.comment-only-emojis:not(.comment-with-quote) .comment-bubble {
    background-color: transparent;
    padding-left: 0
}

.comment:not(.comment-merged-with-prev) .comment-only-emojis:not(.comment-with-quote) .comment-bubble {
    padding-top: 0
}

.comment-with-quote .comment-bubble {
    padding-bottom: 5px
}

.missive-no-touch .comment-with-reactions .comment-bubble {
    padding-bottom: 12px!important
}

.missive-no-touch .comment-with-reactions .comment-actions {
    transform: translateY(-4px)
}

.missive-no-touch .comment-reactions {
    margin-left: 2px;
    margin-top: -11px
}

.missive-has-touch .comment-reactions {
    margin-bottom: 3px;
    margin-top: 4px
}

.missive-has-touch .comment-reactions .button-token {
    margin-bottom: 4px;
    margin-right: 5px;
    min-width: 47px;
    padding: 4px 9px 4px 7px
}

.missive-has-touch .comment-reactions .button-token .missive-emoji {
    margin-right: 7px
}

.comment-merged-with-prev {
    margin-top: 1px!important
}

.comment-merged-with-prev .author-avatar {
    visibility: hidden
}

.comment-merged-with-prev .comment-author {
    display: none
}

.comment-meta-spacer {
    width: 25px
}

.comment-meta {
    margin-bottom: 4px;
    margin-top: 4px
}

.comment-meta .missive-image-container img {
    border-radius: 5px
}

.comment-meta .missive-image-container,.comment-meta .missive-video-container {
    background-color: var(--light-background-color)!important
}

.comment-meta .conversation-preview,.comment-meta .conversation-preview-dropzone {
    max-width: 320px
}

.comment-meta .conversation-preview {
    background-color: var(--conversation-list-background-color);
    border: 1px solid var(--light-border-color);
    border-radius: 8px;
    padding: 0
}

.comment-meta .conversation-preview[data-contextmenu-opened] {
    box-shadow: 0 0 0 2px var(--blue-color)!important
}

.comment-meta .conversation-preview .color-flag {
    bottom: 5px;
    top: 5px
}

.comment-meta .missive-max-height-container {
    padding: var(--section-shadow-width)
}

.comment-meta .missive-max-height-container[data-state~=needsToggle] {
    margin-bottom: .5em
}

.comment-meta .conversation-entry {
    margin-left: 0!important;
    margin-right: 0!important;
    margin-top: 0!important;
    max-width: max(700px,80%)
}

.integration-meta {
    border: 2px solid var(--border-color);
    border-radius: 6px;
    padding: 1em 1.2em
}

.event-entry-content .event-entry-user-icon {
    display: inline-block;
    margin-right: .4em
}

.event-entry-content .event-entry-user-icon .missive-avatar {
    display: inline-block;
    height: 24px!important;
    vertical-align: middle
}

.event-entry-content .missive-user-stack,.event-entry-content .missive-user-stack+* {
    margin-left: .4em
}

.event-entry .user-started-conversation-intro p {
    max-width: 85%
}

.event-entry .user-started-conversation-intro p+p {
    margin-top: 8px
}

.event-entry .user-started-conversation-intro-actions {
    margin-top: 1em
}

.missive-post {
    margin-top: 10px
}

.missive-no-touch .missive-post:hover .post-actions,.missive-post[data-contextmenu-opened] .post-actions {
    opacity: 1!important;
    pointer-events: auto
}

.missive-post[data-contextmenu-opened] {
    box-shadow: none!important
}

.missive-post .post-tagged-icon {
    position: relative
}

.missive-post .post-tagged-icon .post-icon-tag {
    bottom: -4px;
    font-size: 8px;
    font-weight: 700;
    position: absolute;
    right: 1px;
    text-shadow: -1px -1px 0 var(--background-color),0 -1px 0 var(--background-color),1px -1px 0 var(--background-color),-1px 1px 0 var(--background-color),1px 1px 0 var(--background-color)
}

.missive-post .post-content {
    line-height: 1.5;
    margin-left: .3em;
    padding-left: .5em
}

.missive-post .post-body {
    max-width: 94%
}

.missive-post .post-attachment+.post-attachment {
    margin-top: 4px
}

.missive-post .post-attachment-markdown>*,.missive-post .post-attachment-markdown p,.missive-post .post-markdown>*,.missive-post .post-markdown p {
    margin-bottom: 1em
}

.missive-post .post-attachment-markdown>:last-child,.missive-post .post-markdown>:last-child {
    margin-bottom: 0
}

.missive-post .post-attachment-markdown hr,.missive-post .post-markdown hr {
    background-color: var(--light-border-color);
    border: 0;
    height: 1px
}

.missive-post .post-attachment-markdown .heading,.missive-post .post-markdown .heading {
    display: block;
    margin-top: 8px
}

.missive-post .post-attachment-markdown .heading:first-child,.missive-post .post-markdown .heading:first-child {
    margin-top: 0
}

.missive-post .post-attachment-pretext {
    margin-bottom: 1px
}

.missive-post .post-attachment-pretext .post-actions {
    display: inline-block;
    height: 1.1em;
    position: relative
}

.missive-post .post-attachment-pretext .post-actions>div {
    position: absolute;
    top: 0
}

.missive-post .post-attachment-color {
    background-color: var(--border-color);
    border-radius: 4px;
    bottom: 0;
    position: absolute;
    top: 0;
    width: 4px
}

.missive-post .post-attachment-content {
    padding: 3px 0 3px 11px;
    white-space: pre-wrap
}

.missive-post .post-attachment-author {
    margin-bottom: 3px
}

.missive-post .post-attachment-author-icon,.missive-post .post-attachment-footer-icon {
    margin-right: .3em
}

.missive-post .post-attachment-author-icon i,.missive-post .post-attachment-footer-icon i {
    display: block
}

.missive-post .post-attachment-title {
    font-weight: 600
}

.missive-post .post-fields {
    margin-top: 3px
}

.missive-post .post-field {
    margin-right: 2em
}

.missive-post .post-field:last-child {
    margin-right: 0
}

.missive-post .post-attachment-image {
    margin: 3px 0
}

.missive-post .post-attachment-image img {
    display: block;
    max-height: 400px
}

.missive-post .post-attachment-footer {
    margin-top: 3px
}

.missive-post .post-attachment-footer-content+.post-attachment-footer-timestamp {
    margin-left: .5em;
    padding-left: .5em;
    position: relative
}

.missive-post .post-attachment-footer-content+.post-attachment-footer-timestamp:before {
    background-color: var(--border-color);
    content: "";
    height: 80%;
    left: 0;
    position: absolute;
    top: 10%;
    width: 1px
}

.missive-post .post-attachment-footer-timestamp time {
    font-size: calc(var(--font-size) - 1px)
}

.post-reactions {
    margin-top: 3px
}

.post-reactions .button-token:first-child {
    margin-left: 0
}

.missive-post-merged-with-prev {
    margin-top: 4px
}

.missive-post-merged-with-prev .post-attachment-pretext {
    margin-top: 3px
}

.missive-post-merged-with-prev .post-icon-tag,.missive-post-merged-with-prev .post-icon .missive-avatar .missive-avatar-img-container,.missive-post-merged-with-prev .post-icon .missive-avatar .missive-avatar-provider,.missive-post-merged-with-prev .post-icon .missive-icon svg,.missive-post-merged-with-prev .post-icon .post-icon-url .missive-image-container,.missive-post-merged-with-prev .post-meta {
    display: none!important
}

.missive-max-height-container {
    overflow: hidden;
    position: relative
}

.missive-max-height-container[data-state~=needsToggle] {
    padding-bottom: 30px
}

.missive-max-height-container[data-state~=collapsed] .missive-max-height-gradient {
    opacity: 1
}

.missive-max-height-toggle {
    bottom: 0;
    height: 100px;
    left: 0;
    pointer-events: none;
    position: absolute;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    width: 100%;
    z-index: 10
}

.missive-max-height-toggle .link-a {
    cursor: pointer;
    padding: .5em 1em 0 0;
    pointer-events: auto;
    position: relative
}

.missive-max-height-toggle .missive-max-height-gradient {
    background-image: linear-gradient(to bottom,rgba(var(--background-color-rgb),0) 0,var(--background-color) 72%);
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transition: opacity var(--material-duration) var(--material-easing);
    width: 100%
}

.missive-composer-comments-root {
    max-width: 320px;
    min-width: 220px;
    position: relative
}

.missive-composer-comments-root:after {
    background: linear-gradient(to right,var(--section-shadow-color),transparent);
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    top: 0;
    width: var(--section-shadow-width)
}

.composer-comments {
    position: relative
}

.composer-comments .missive-scroll {
    -webkit-user-select: text;
    -moz-user-select: text;
    user-select: text
}

.composer-comments .padding-block {
    padding: .4em .5em
}

.composer-comments .conversation-entry {
    margin-left: var(--padding);
    margin-right: var(--padding)
}

.composer-comments .event-entry {
    margin-left: .7em
}

.composer-comments .event-entry .text-small {
    font-size: calc(var(--font-size) - 3px)
}

.composer-comments .event-entry+.event-entry {
    margin-top: .5em
}

.composer-comments .event-entry-content {
    display: block!important
}

.composer-comments .event-entry-user-icon,.composer-comments .event-entry .missive-user-stack {
    display: none!important
}

.composer-comments .missive-attachment-document {
    min-width: 0
}

.composer-comments .comment-task-assign-label {
    display: none
}

.composer-comments .comment-bubble {
    max-width: 94%
}

.composer-comments .comment-box-meta-bar,.composer-comments .comment-box-meta-bar .comment-box-meta-bar-content {
    padding-left: var(--padding-small);
    padding-right: var(--padding-small)
}

.composer-comments .conversation-footer .comment-box {
    padding: var(--padding-small);
    padding-top: 0
}

.composer-comments-toggle {
    position: absolute;
    right: 6px;
    top: 6px;
    z-index: 2
}

.composer-overlay {
    background-color: rgba(var(--conversation-list-background-color-rgb),.95);
    border-radius: var(--border-radius);
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 13
}

.composer-overlay .heading-b {
    margin: .5em 0 .25em
}

.composer-overlay .button {
    display: inline-block;
    margin-top: 1em
}

.composer-overlay .button+.button {
    margin-left: .65em
}

.missive-popup .composer-overlay {
    top: 35px
}

.missive-compose-box {
    position: relative
}

.missive-compose-box .bar {
    border-radius: var(--border-radius);
    position: relative
}

.missive-compose-box .bar:after {
    background: linear-gradient(to bottom,var(--section-shadow-color),transparent);
    bottom: calc(var(--section-shadow-width)*-1);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0
}

[data-wrapper=electron][data-os=osx] .missive-compose-box .traffic-light-spacer {
    width: var(--traffic-light-width)
}

.missive-compose-box .message-details {
    top: .1em!important
}

.missive-compose-box .detached-border-right:after {
    bottom: 0;
    right: 0;
    top: 0
}

.missive-compose-box-inline .compose-bar {
    bottom: var(--padding);
    position: sticky;
    z-index: 12
}

.missive-compose-box-hitzone {
    display: none;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 10%;
    z-index: 3
}

[data-wrapper=electron] .missive-compose-box-hitzone {
    width: 24%
}

.missive-composer-editor-root {
    border-radius: var(--border-radius)
}

.missive-composer-editor-root.dropping,.missive-composer-editor-root.dropping .sticky-compose-bar-border:before {
    box-shadow: 0 0 0 3px rgba(var(--blue-color-rgb),.3),0 0 0 1px rgba(var(--blue-color-rgb),.8)
}

.missive-popup .missive-compose-box {
    border-radius: var(--border-radius)!important
}

[data-right-sidebar=composer] .missive-popup .missive-compose-box .missive-compose-box-hitzone {
    display: block
}

[data-right-sidebar=composer] .missive-popup .missive-compose-box>.missive-composer-editor-root {
    transform: translateX(-90%)
}

[data-right-sidebar=composer][data-wrapper=electron] .missive-popup .missive-compose-box>.missive-composer-editor-root {
    transform: translateX(-76%)
}

[data-sidebar-closing] .missive-popup .missive-compose-box>.missive-composer-editor-root {
    transform: translateX(0)!important
}

.missive-popup .missive-compose-box>.missive-composer-editor-root {
    box-shadow: 0 5px 10px rgba(0,0,0,.2);
    transition: transform var(--material-duration) var(--material-easing)
}

.missive-popup .missive-compose-box>.missive-composer-comments-root,.missive-popup .missive-compose-box>.missive-composer-editor-root {
    position: relative
}

.missive-popup .missive-compose-box>.missive-composer-comments-root {
    background-color: var(--background-color)
}

.missive-popup .missive-compose-box .comment-textarea-body {
    padding-bottom: var(--safe-area-inset-bottom)
}

.missive-popup .missive-compose-box .comment-textarea {
    padding-left: 0!important
}

.missive-popup .missive-compose-box .compose-bar {
    padding-bottom: var(--safe-area-inset-bottom)
}

.reply-infos .reply-info {
    background-color: var(--light-background-color)
}

.reply-info .label-small {
    font-size: var(--font-size);
    margin-bottom: 0
}

.reply-info .label-small span {
    white-space: pre
}

.reply-info .missive-select {
    flex-shrink: 1
}

.generic-account-reply-infos {
    background-color: var(--input-background-color);
    border-radius: var(--border-radius)
}

.generic-account-reply-infos .token-input {
    padding: 5px .5em 1px 0
}

.generic-account-reply-infos .reply-info {
    margin-left: .4em;
    min-height: 0
}

.generic-account-reply-infos .reply-info-label {
    min-width: 4.5em;
    padding-bottom: .3em;
    padding-top: .3em
}

.generic-account-reply-infos .missive-select {
    margin-top: .3em
}

[data-notch=right] .reply-info {
    padding-right: calc(var(--safe-area-inset-right)/1.5)
}

[data-notch=left] .reply-info {
    padding-left: calc(var(--safe-area-inset-left)/1.5)
}

.reply-info .reply-info-input,.reply-info .token-input[data-state~=empty] {
    align-self: stretch
}

.reply-info .reply-info-input {
    font-weight: 500;
    padding-bottom: 8px;
    padding-top: 8px
}

.reply-info-from {
    padding: var(--padding);
    position: relative
}

.reply-info-from:after {
    background: linear-gradient(to bottom,var(--section-shadow-color),transparent);
    bottom: calc(var(--section-shadow-width)*-1);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0
}

.reply-info-label {
    line-height: 1;
    margin-right: 4px;
    padding: 10px 0;
    text-align: right
}

.reply-info-label-large {
    min-width: 2.7em
}

.reply-info-label-with-icon {
    margin-right: 12px;
    position: relative
}

.reply-info-label-with-icon .missive-icon {
    left: 100%;
    margin-left: 1px;
    position: absolute
}

.reply-info-label,.reply-info .input-immersive {
    padding-left: 14px
}

.reply-body {
    -webkit-overflow-scrolling: touch;
    overflow: auto
}

.collab-preview {
    opacity: .4
}

.compose-details svg {
    fill: var(--text-color-d);
    margin-right: .5em
}

.cc-bcc-toggle {
    padding: 7px 6px 0 0
}

.compose-attachments {
    padding: var(--padding-small) 0
}

.compose-attachments .missive-attachment {
    margin-top: 0;
    position: relative;
    z-index: 0
}

.compose-attachments .missive-scroll-horizontal .missive-attachment:first-child {
    margin-left: .65em
}

.compose-attachments .selectable-item-list {
    padding: 1px
}

.compose-actions,.compose-attachments,.compose-bar .toolbar {
    border-top: 1px solid var(--background-color)
}

.compose-bar {
    background-color: var(--top-bar-background-color);
    border-radius: 0 0 var(--border-radius) var(--border-radius);
    z-index: 0
}

.compose-bar .missive-message-actions {
    margin-bottom: 6px;
    padding: 0
}

.compose-bar .sticky-compose-bar-border {
    background-color: var(--background-color);
    bottom: calc(var(--padding)*-1);
    height: 14px;
    left: -5px;
    overflow: hidden;
    pointer-events: none;
    position: absolute;
    right: -5px
}

.compose-bar .sticky-compose-bar-border:before {
    background-color: var(--conversation-list-background-color);
    border-radius: 0 0 var(--border-radius) var(--border-radius);
    box-shadow: 0 0 var(--section-shadow-width) 1px var(--section-shadow-color);
    content: "";
    height: 4px;
    left: 5px;
    position: absolute;
    right: 5px;
    top: 0;
    transition: box-shadow var(--duration) var(--easing)
}

.compose-bar .toolbar {
    position: relative
}

.compose-bar .toolbar:before {
    background-color: var(--toolbar-background-color);
    border-bottom: 1px solid transparent;
    border-bottom-color: var(--background-color);
    border-left: 1px solid transparent;
    border-right: 1px solid transparent;
    border-right-color: var(--background-color);
    border-top: 1px solid transparent;
    content: "";
    height: 10px;
    left: 44px;
    margin-left: 6px;
    margin-top: -6px;
    position: absolute;
    top: 100%;
    transform: rotate(45deg);
    width: 10px
}

.missive-has-touch .compose-bar .toolbar:before {
    margin-left: 12px
}

.compose-bar .compose-actions .missive-columns-right {
    flex-grow: 1.1
}

.compose-bar .send-later-notice {
    background-color: var(--conversation-list-background-color);
    border: 1px solid rgba(var(--blue-color-rgb),.5);
    border-radius: var(--border-radius);
    margin: var(--padding);
    margin-left: auto;
    padding: .25em .5em;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

.compose-bar .send-later-notice:hover {
    border-color: rgba(var(--blue-color-rgb),.85)
}

.upcoming-users {
    margin: 0 8px 8px
}

.upcoming-users>div {
    background: var(--background-color);
    border-radius: var(--border-radius)
}

.upcoming-users.text-error>div {
    background-color: transparent;
    box-shadow: inset 0 0 0 1px
}

[data-notch=right] .upcoming-users {
    padding-right: calc(var(--safe-area-inset-right)/1.5)!important
}

[data-notch=left] .upcoming-users {
    padding-left: calc(var(--safe-area-inset-left)/1.5)!important
}

.upcoming-users+.upcoming-users {
    margin-top: 0
}

.composer-max-chars {
    padding: .5em 1.2em
}

.composer-max-chars[data-state~=error] {
    color: var(--red-color)
}

.collab-container,.composer-message,.plain-text-editor {
    background-color: var(--conversation-list-background-color);
    color: var(--text-color-a)
}

.composer-message {
    padding-bottom: 0;
    position: relative
}

.composer-message:after {
    background: linear-gradient(to top,var(--section-shadow-color),transparent);
    content: "";
    height: var(--section-shadow-width);
    left: 0;
    position: absolute;
    right: 0;
    top: calc(var(--section-shadow-width)*-1)
}

[data-notch=right] .composer-message {
    padding-right: calc(var(--safe-area-inset-right)/1.5)!important
}

[data-notch=left] .composer-message {
    padding-left: calc(var(--safe-area-inset-left)/1.5)!important
}

.composer-message[data-type=generic_account_message]:not([data-subtype=custom_html]) .collab-container {
    display: block!important;
    padding: 1em
}

html:not([data-wrapper=browser]) .composer-message[data-type=generic_account_message]:not([data-subtype=custom_html]) .collab-preview,html:not([data-wrapper=browser]) .composer-message[data-type=generic_account_message]:not([data-subtype=custom_html]) .ProseMirror {
    display: inline-block!important;
    max-width: 85%;
    padding: 5px 11px 6px
}

html:not([data-wrapper=browser]) .composer-message[data-type=generic_account_message]:not([data-subtype=custom_html]) .collab-preview+.ProseMirror {
    display: none!important
}

.composer-message[data-type=generic_account_message]:not([data-subtype=custom_html]) .collab-preview,.composer-message[data-type=generic_account_message]:not([data-subtype=custom_html]) .ProseMirror {
    background-color: var(--generic-message-color);
    border-radius: 1.3em;
    font-weight: 500;
    min-width: 50px
}

.composer-message[data-type=generic_account_message]:not([data-subtype=custom_html]) .collab-preview+.ProseMirror {
    display: none!important
}

.conversation-presences {
    position: absolute;
    right: 3px;
    top: -28px;
    z-index: 1
}

.token-input {
    padding: 5px .5em 0
}

.token-input.missive-scroll {
    max-height: 88px
}

.token-input:hover {
    cursor: text
}

.token-input .input-width-dummy {
    display: inline-block;
    left: 0;
    max-width: 100%;
    position: absolute;
    visibility: hidden;
    white-space: pre
}

.token-input .text-selection {
    opacity: 0;
    pointer-events: none!important;
    position: absolute
}

.token-input .resizable-input {
    background-color: transparent;
    border: 0;
    color: var(--text-color-a);
    margin-right: .2em;
    max-width: 100%;
    min-width: 4px;
    outline: 0;
    padding: 0;
    width: 4px
}

.token-input .resizable-input.resizable-input-editing-token {
    margin-left: .4em;
    margin-right: .6em
}

.token-input .token {
    background-color: var(--token-background-color);
    border-radius: var(--border-radius);
    cursor: default;
    height: 24px;
    margin: 0 .25em 0 0;
    padding: 2px 2px 3px 7px;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.token-input .token svg {
    fill: var(--text-color-d);
    transition: none
}

.token-input .token.selected {
    background: var(--blue-color);
    color: #fff
}

.token-input .token.selected .text-b {
    color: rgba(255,255,255,.85)
}

.token-input .token.selected svg {
    fill: #fff!important
}

.token-input .token.invalid {
    background: var(--red-color);
    color: #fff
}

.token-input .token.invalid .missive-icon-arrow-down svg {
    fill: #fff
}

.token-input .token .missive-icon-arrow-down {
    position: relative;
    top: 1px
}

.token-input .resizable-input,.token-input .token {
    margin-bottom: 3px
}

.generic-account-reply-infos .token-input:hover {
    cursor: default
}

.ProseMirror {
    -webkit-text-size-adjust: inherit
}

.ProseMirror blockquote {
    border-left: 2px solid #ebebeb;
    padding-left: 10px
}

.ProseMirror table {
    white-space: normal
}

.ProseMirror-options #option-remove {
    color: var(--red-color)
}

.ProseMirror-options .ProseMirror-tab {
    background-color: var(--conversation-list-background-color);
    border: 0;
    box-shadow: 1px 1px var(--shadow-color);
    color: var(--text-color-d)
}

.ProseMirror-options .ProseMirror-option {
    color: var(--text-color-b);
    font-weight: 500!important
}

.ProseMirror-options strong.ProseMirror-option {
    color: var(--blue-color)
}

.ProseMirror-slider:after,.ProseMirror-slider:before {
    background-color: var(--light-border-color);
    border-radius: 10em;
    content: "";
    height: 150%;
    left: 50%;
    opacity: .6;
    position: absolute;
    transform: translateX(-100%);
    width: 2px
}

.ProseMirror-slider:before {
    bottom: 100%;
    margin-bottom: 2px
}

.ProseMirror-slider:after {
    margin-top: 2px;
    top: 100%
}

.ProseMirror-slider input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    min-width: 200px
}

.ProseMirror-slider input:focus {
    outline: none
}

.ProseMirror-slider input::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    background-color: var(--scrollbar-light-thumb-color);
    border: 1px solid rgba(0,0,0,.25);
    border-bottom-color: rgba(0,0,0,.3);
    border-radius: 100%;
    height: 18px;
    width: 18px
}

.ProseMirror-slider input::-moz-range-thumb {
    -moz-appearance: none;
    appearance: none;
    background-color: var(--scrollbar-light-thumb-color);
    border: 1px solid rgba(0,0,0,.25);
    border-bottom-color: rgba(0,0,0,.3);
    border-radius: 100%;
    height: 18px;
    width: 18px
}

.ProseMirror-slider .ProseMirror-slider-track {
    background-color: var(--scrollbar-track-color);
    border-radius: 10em;
    overflow: hidden
}

.ProseMirror-slider .ProseMirror-slider-track:after {
    box-shadow: inset 0 1px 1px var(--shadow-color);
    content: "";
    height: 100%;
    left: 0;
    opacity: .75;
    position: absolute;
    top: 0;
    width: 100%
}

.ProseMirror-slider .ProseMirror-slider-max-zone,.ProseMirror-slider .ProseMirror-slider-min-zone {
    background-color: var(--text-color-a);
    position: absolute
}

.ProseMirror-slider .ProseMirror-slider-max-zone:after,.ProseMirror-slider .ProseMirror-slider-min-zone:after {
    background-color: var(--scrollbar-track-color);
    border-radius: 100%;
    content: "";
    display: block;
    height: 15px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 15px
}

.ProseMirror-slider .ProseMirror-slider-min-zone {
    opacity: .3
}

.ProseMirror-slider .ProseMirror-slider-min-zone:after {
    left: 100%;
    margin-left: -2px
}

.ProseMirror-slider .ProseMirror-slider-max-zone {
    opacity: .1
}

.ProseMirror-slider .ProseMirror-slider-max-zone:after {
    left: 0;
    margin-left: -5px
}

.collab-container {
    position: relative
}

.collab-container .collab-placeholder {
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0
}

.collab-preview blockquote {
    border-left: 2px solid var(--border-color);
    margin: 0;
    padding: 0 .5em
}

.collab-preview+.ProseMirror {
    display: none
}

.collab-preview,.ProseMirror {
    -webkit-overflow-scrolling: touch;
    height: 100%;
    max-height: 100%;
    outline: 0;
    overflow: auto;
    padding: 14px
}

.missive-compose-box-inline .collab-preview,.missive-compose-box-inline .ProseMirror {
    max-height: 55vh
}

.ProseMirror-report {
    display: none
}

.multiple-selected,.nothing-selected {
    background-color: var(--background-color)
}

.multiple-selected .multiple-selected-container {
    max-height: 900px;
    max-width: 480px;
    text-align: center
}

.multiple-selected .conversations-preview {
    min-height: 250px;
    position: relative
}

.multiple-selected .missive-white-box {
    position: relative;
    width: 100%
}

.multiple-selected .floating-white-box {
    -webkit-animation: rotate-in .15s;
    animation: rotate-in .15s;
    border-color: var(--light-border-color);
    height: 100%;
    left: 0;
    position: absolute;
    top: 0
}

.multiple-selected .floating-white-box:nth-child(1n) {
    transform: rotate(1deg)
}

.multiple-selected .floating-white-box:nth-child(2n) {
    transform: rotate(-1deg)
}

.multiple-selected .floating-white-box:nth-child(3n) {
    transform: rotate(2deg)
}

.multiple-selected .floating-white-box:nth-child(4n) {
    transform: rotate(-2deg)
}

.multiple-selected .conversations-count {
    color: var(--text-color-c);
    font-size: 24px;
    margin-top: 0
}

.multiple-selected .conversations-count .text-jumbo {
    display: block;
    font-size: 110px;
    font-weight: 100;
    line-height: 1.2
}

.multiple-selected .conversations-count-max {
    bottom: 1em;
    left: 0;
    position: absolute;
    width: 100%
}

.conversations-secondary-actions .missive-icon-arrow-down {
    margin: 0 -1em 0 .5em;
    padding: 0
}

.missive-paywall {
    text-align: center
}

.missive-paywall .missive-paywall-icon {
    position: relative;
    top: 2px
}

.missive-paywall .missive-paywall-title {
    margin: 0 .4em
}

.missive-paywall .text-medium {
    margin: .3em 0 .6em
}

.missive-paywall .button {
    display: inline-block
}

.missive-paywall .button+.button {
    margin-left: .4em
}

@media(max-width: 320px) {
    .compose-actions .missive-icon-trash-line {
        display:none!important
    }
}

body,html {
    height: 100%;
    margin: 0;
    overflow: hidden;
    padding: 0;
    width: 100%
}

body {
    word-wrap: break-word;
    background: var(--background-color);
    color: var(--text-color-a);
    font-family: var(--font-family);
    font-weight: 400;
    line-height: 1.4;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

body * {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    box-sizing: border-box
}

body,button,input,legend,textarea {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: var(--font-size)
}

input::-ms-clear {
    display: none
}

a {
    color: var(--blue-color)
}

code,kbd,pre,samp,tt {
    font-family: Courier,monospace
}

[data-wrapper=browser] a:link {
    cursor: pointer
}

[data-wrapper=browser] [contenteditable=true] a:link {
    cursor: text
}

[data-yield=view] {
    position: relative
}

[data-href] {
    cursor: pointer
}

[data-selectable] {
    -webkit-user-select: text;
    -moz-user-select: text;
    user-select: text
}

[data-not-selectable] {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

[data-before]:before {
    content: attr(data-before)
}

[data-after]:after {
    content: attr(data-after)
}

[data-always-clickable] {
    pointer-events: auto!important
}

[dir=rtl] {
    text-align: right
}

.missive-app-container {
    height: 100%
}

.no-wrap {
    flex-basis: auto;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: auto
}

.no-wrap-2,.no-wrap-3 {
    -webkit-box-orient: vertical;
    display: -webkit-box;
    white-space: normal
}

.no-wrap-2 {
    -webkit-line-clamp: 2
}

.no-wrap-3 {
    -webkit-line-clamp: 3
}

iframe {
    width: 100%
}

[data-wrapper=browser] .cursor-pointer {
    cursor: pointer
}

[data-wrapper=electron] .cursor-pointer {
    cursor: default
}

.cursor-wait * {
    cursor: wait
}

.missive-view-main-hitzone {
    background-color: rgba(0,0,0,.4);
    height: 100%;
    left: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    transition: opacity var(--material-duration) var(--material-easing);
    width: 100%;
    z-index: 3
}

[data-left-sidebar=main] .missive-view-main-hitzone,[data-right-sidebar=main] .missive-view-main-hitzone {
    opacity: 1;
    pointer-events: all
}

.dropzone {
    transition: box-shadow var(--duration) var(--easing)
}

.dropzone:not(.no-drag-hover).dropping {
    box-shadow: inset 0 0 0 3px rgba(var(--blue-color-rgb),.3),inset 0 0 0 1px rgba(var(--blue-color-rgb),.8)
}

[data-contextmenu-opened] {
    box-shadow: inset 0 0 0 2px var(--blue-color)!important
}

[data-drag-id] {
    box-shadow: 0 0 0 2px var(--blue-color)!important
}

.missive-view-account {
    z-index: 4
}

.missive-resizable-column {
    position: relative
}

.missive-resizable-column * {
    cursor: default
}

.missive-resizable-column[data-resizing] {
    pointer-events: none
}

.missive-resizable-column:hover .missive-resizable-column-button>span,.missive-resizable-column[data-button] .missive-resizable-column-button>span {
    transform: translateX(0)!important
}

.missive-resizable-column[data-hidden] {
    display: none!important
}

.missive-resizable-column[data-side=left] .missive-resizable-column-drag {
    left: -1px
}

.missive-resizable-column[data-side=left] .missive-resizable-column-button {
    right: 100%
}

.missive-resizable-column[data-side=left] .missive-resizable-column-button .missive-icon {
    margin-left: -8px
}

.missive-resizable-column[data-side=left] .missive-resizable-column-button>span {
    transform: translateX(60%)
}

.missive-resizable-column[data-side=right] .missive-resizable-column-drag {
    right: -1px
}

.missive-resizable-column[data-side=right] .missive-resizable-column-button {
    left: 100%;
    margin-left: calc(var(--section-shadow-width)*-1)
}

.missive-resizable-column[data-side=right] .missive-resizable-column-button .missive-icon {
    margin-left: 8px
}

.missive-resizable-column[data-side=right] .missive-resizable-column-button>span {
    transform: translateX(-60%)
}

.missive-resizable-column-drag {
    -webkit-app-region: no-drag;
    bottom: 0;
    cursor: ew-resize;
    position: absolute;
    top: var(--top-bar-height);
    width: 4px;
    z-index: 1
}

.missive-resizable-column-button {
    margin-top: -27px;
    overflow: hidden;
    padding: 2px;
    pointer-events: none;
    position: absolute;
    top: 50%;
    width: 29px;
    z-index: 2
}

.missive-resizable-column-button>span {
    background-color: var(--background-color);
    border-radius: 100%;
    box-shadow: 0 0 calc(var(--section-shadow-width) - 1px) 1px var(--section-shadow-color);
    display: block;
    height: 50px;
    pointer-events: auto;
    position: relative;
    transition: transform var(--material-duration) var(--material-easing);
    width: 50px
}

.missive-resizable-column-button>span .missive-icon {
    color: var(--text-color-c);
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translateX(-50%) translateY(-50%)
}

.missive-resizable-column-button>span .missive-icon svg {
    transform: rotate(180deg)
}

html:not([data-os=windows]) .dev-bar,html:not([data-os=windows]) .empty-item,html:not([data-os=windows]) .empty-mailbox,html:not([data-os=windows]) .empty-space,html:not([data-os=windows]) .missive-landing-page header,html:not([data-os=windows]) .top-bar {
    -webkit-app-region: drag
}

html:not([data-os=windows]) .dev-bar .button-macos,html:not([data-os=windows]) .dev-bar [data-selectable],html:not([data-os=windows]) .dev-bar input,html:not([data-os=windows]) .empty-item .button-macos,html:not([data-os=windows]) .empty-item [data-selectable],html:not([data-os=windows]) .empty-item input,html:not([data-os=windows]) .empty-mailbox .button-macos,html:not([data-os=windows]) .empty-mailbox [data-selectable],html:not([data-os=windows]) .empty-mailbox input,html:not([data-os=windows]) .empty-space .button-macos,html:not([data-os=windows]) .empty-space [data-selectable],html:not([data-os=windows]) .empty-space input,html:not([data-os=windows]) .missive-landing-page header .button-macos,html:not([data-os=windows]) .missive-landing-page header [data-selectable],html:not([data-os=windows]) .missive-landing-page header input,html:not([data-os=windows]) .top-bar .button-macos,html:not([data-os=windows]) .top-bar [data-selectable],html:not([data-os=windows]) .top-bar input {
    -webkit-app-region: no-drag
}

html:not([data-os=windows])[data-scope=composer] .generic-account-reply-infos {
    -webkit-app-region: drag
}

.missive-contextmenu,.missive-veil,html:not([data-os=windows])[data-scope=composer] .generic-account-reply-infos .button-macos,html:not([data-os=windows])[data-scope=composer] .generic-account-reply-infos [data-selectable],html:not([data-os=windows])[data-scope=composer] .generic-account-reply-infos input {
    -webkit-app-region: no-drag
}

@media(max-width: 1120px) {
    .missive-has-touch body,.missive-has-touch button,.missive-has-touch input,.missive-has-touch legend,.missive-has-touch textarea {
        -webkit-text-size-adjust:none;
        font-size: calc(var(--font-size) + 2px)
    }

    [data-context=bootstrap][data-wrapper=electron][data-os=osx] .missive-view-account .traffic-light-spacer,[data-context=bootstrap][data-wrapper=electron][data-os=osx] .traffic-light-spacer,[data-context=inbox][data-wrapper=electron][data-os=osx] .missive-view-account .traffic-light-spacer,[data-context=inbox][data-wrapper=electron][data-os=osx] .traffic-light-spacer {
        width: var(--traffic-light-width)
    }

    [data-context=bootstrap] .missive-resizable-column-button,[data-context=inbox] .missive-resizable-column-button {
        display: none!important
    }

    [data-context=bootstrap] .missive-resizable-column,[data-context=inbox] .missive-resizable-column {
        cursor: default
    }

    [data-context=bootstrap] .missive-view-inbox,[data-context=inbox] .missive-view-inbox {
        max-width: 320px!important;
        min-width: 320px!important
    }

    [data-context=bootstrap] .missive-view-account,[data-context=bootstrap] .missive-view-conversation,[data-context=inbox] .missive-view-account,[data-context=inbox] .missive-view-conversation {
        transition: transform var(--material-duration) var(--material-easing)
    }

    [data-context=bootstrap] .missive-view-account,[data-context=inbox] .missive-view-account {
        border-radius: 0 18px 18px 0;
        height: 100%;
        left: 0;
        max-width: 320px!important;
        position: absolute;
        top: 0;
        transform: translateX(-100%);
        width: 85%!important
    }

    [data-context=bootstrap][data-left-sidebar=main] .missive-view-account,[data-context=inbox][data-left-sidebar=main] .missive-view-account {
        transform: translateX(0)
    }

    [data-scope^=comment] .conversation-footer .missive-mobile-conversation-actions,[data-scope^=conversation-title] .conversation-footer .missive-mobile-conversation-actions {
        display: none!important
    }

    .missive-has-touch .missive .text-xsmall {
        font-size: calc(var(--font-size) - 1px);
        line-height: 1.5
    }

    .missive-has-touch .missive .text-small {
        font-size: calc(var(--font-size) + 1px)
    }

    .missive-has-touch .missive .text-medium {
        font-size: calc(var(--font-size) + 5px)
    }

    .missive-has-touch .missive .text-large {
        font-size: calc(var(--font-size) + 8px);
        line-height: 1.35
    }

    .missive-has-touch .missive .missive-checkpoint,.missive-has-touch .missive .missive-filters-bar {
        padding-bottom: var(--padding-small);
        padding-top: var(--padding-small)
    }

    .missive-has-touch .missive .top-bar .icon-unseen {
        height: 8px!important;
        width: 8px!important
    }

    .missive-has-touch .missive .missive-icon-incognito-off svg,.missive-has-touch .missive .missive-icon-incognito svg {
        position: relative;
        top: -1px
    }

    .missive .missive-mobile-menu .missive-button-icon,.missive .missive-mobile-menu .missive-plus-button>div {
        transition-duration: var(--material-duration);
        transition-property: opacity,box-shadow
    }

    [data-context=bootstrap] .missive .missive-mobile-menu .missive-button-icon {
        opacity: .5
    }

    [data-context=bootstrap] .missive .missive-mobile-menu .missive-plus-button>div {
        box-shadow: none!important;
        opacity: .7
    }

    .missive .search-box .input-container {
        margin: 0!important;
        opacity: 0;
        pointer-events: none;
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%) scale(.95);
        transition: opacity var(--material-duration) var(--material-easing);
        transition-property: opacity,transform;
        width: 100%
    }

    html:not([data-os=windows]) .missive .search-box .input-container input {
        -webkit-app-region: drag
    }

    .missive-has-touch .missive .search-box .input-container {
        height: 40px;
        margin-top: -4px!important
    }

    .missive .search-box[data-state~=focused] .input-container {
        opacity: 1;
        pointer-events: auto;
        transform: translateY(-50%) scale(1)
    }

    .missive .search-box[data-state~=focused] .input-container input {
        -webkit-app-region: no-drag
    }

    .missive.missive-view-account[data-theme=dark]:after {
        display: none
    }

    .missive .missive-popup .missive-compose-box {
        border-radius: 0
    }

    .missive .missive-popup .missive-compose-box .missive-composer-comments-root,.missive .missive-popup .missive-compose-box .missive-composer-editor-root {
        z-index: 1
    }

    .missive .missive-popup .missive-compose-box .missive-composer-comments-root {
        height: 100%;
        max-width: none;
        position: absolute;
        right: 0;
        top: 0;
        width: 90%;
        z-index: 0
    }

    [data-wrapper=electron] .missive .missive-popup .missive-compose-box .missive-composer-comments-root {
        width: 76%
    }

    .missive .missive-popup .missive-compose-box .composer-comments {
        width: 100%
    }

    .missive .conversation-comments-icon i,.missive .conversation-comments-icon svg {
        height: 19px;
        width: 19px
    }

    .missive .conversation-comments-icon .unread-comments-count {
        font-size: 10px;
        line-height: 17px;
        top: 0
    }

    [data-os=android] .missive .conversation-comments-icon .unread-comments-count {
        line-height: 19px
    }

    .missive .message-count {
        font-size: 10px;
        height: 14px;
        min-width: 14px
    }

    .missive .tasks-menu-option .comment-task {
        top: .5em
    }

    .missive .tasks-menu-option .missive-icon-plus {
        left: 1.15em
    }

    .missive.missive-view-calendar .missive-calendar .missive-calendar-event .missive-calendar-event-title {
        text-overflow: clip
    }

    .missive.missive-view-calendar .missive-calendar [data-layout=month] .missive-calendar-event,.missive.missive-view-calendar .missive-calendar [data-layout=month] .missive-calendar-event .text-small,.missive.missive-view-calendar .missive-calendar [data-layout=month] .missive-calendar-event .text-xsmall,.missive.missive-view-calendar .missive-calendar [data-layout=week] .missive-calendar-event,.missive.missive-view-calendar .missive-calendar [data-layout=week] .missive-calendar-event .text-small,.missive.missive-view-calendar .missive-calendar [data-layout=week] .missive-calendar-event .text-xsmall {
        font-size: calc(var(--font-size) - 3px)!important
    }

    .missive.missive-view-calendar .missive-calendar [data-layout=month] .missive-calendar-events {
        pointer-events: none
    }

    .missive.missive-view-calendar .missive-calendar [data-layout=month] .missive-calendar-event {
        line-height: 1;
        padding: 2px 1px 2px 5px
    }

    .missive.missive-view-calendar .missive-calendar [data-layout=month] .missive-calendar-event[data-full-day][data-start] .missive-calendar-event-background {
        border-bottom-left-radius: 2px;
        border-top-left-radius: 2px;
        left: 2px
    }

    .missive.missive-view-calendar .missive-calendar [data-layout=month] .missive-calendar-event[data-full-day][data-end] .missive-calendar-event-background {
        border-bottom-right-radius: 2px;
        border-top-right-radius: 2px;
        right: 1px
    }

    .missive .missive-calendar [data-layout=agenda] .missive-calendar-event .missive-calendar-event-title {
        font-size: 1em!important
    }

    .missive .missive-calendar [data-layout=agenda] .missive-calendar-event .text-b {
        font-size: .85em
    }

    .missive .missive-calendar [data-layout=agenda] .missive-calendar-event .missive-calendar-event-color {
        bottom: 6px;
        top: 6px
    }

    .missive .missive-calendar-agenda {
        flex-direction: column;
        padding-bottom: .5em;
        padding-top: 7px
    }

    .missive .missive-calendar-agenda .group {
        padding: 0;
        width: 100%
    }

    .missive .missive-calendar-agenda .group+.group {
        margin-top: 8px
    }

    .missive .missive-calendar-agenda .group-content {
        display: block!important
    }

    .missive .missive-calendar-agenda .group-title {
        border-radius: 10px;
        position: sticky;
        top: 0;
        z-index: 2
    }

    .missive .missive-calendar-agenda .group-title .heading-c {
        position: relative;
        z-index: 2
    }

    .missive .missive-calendar-agenda .group-title:after,.missive .missive-calendar-agenda .group-title:before {
        content: "";
        height: 50%;
        left: 0;
        position: absolute;
        top: 0;
        width: 100%
    }

    .missive .missive-calendar-agenda .group-title:before {
        background-color: var(--background-color);
        top: -8px;
        z-index: 0
    }

    .missive .missive-calendar-agenda .group-title:after {
        background-color: var(--conversation-list-background-color);
        border-radius: 10px;
        height: 100%;
        z-index: 1
    }

    .missive .missive-calendar-agenda .group-days {
        position: relative
    }

    .missive .missive-calendar-agenda .group-days:before {
        background-color: var(--conversation-list-background-color);
        content: "";
        height: 13px;
        left: 0;
        position: absolute;
        top: -12px;
        width: 100%
    }

    .missive .missive-calendar-agenda .group-days .no-events {
        padding-top: 1em
    }

    .missive .missive-calendar-agenda .missive-position-sticky {
        top: 58px
    }
}

@media(max-width: 812px) {
    [data-yield=dev] {
        margin-bottom:-22px;
        padding-top: 22px
    }

    [data-context=bootstrap] .missive-mobile-menu,[data-context=bootstrap] .missive-view-main .missive-mobile-menu,[data-context=inbox] .missive-mobile-menu,[data-context=inbox] .missive-view-main .missive-mobile-menu {
        width: auto
    }

    [data-context=bootstrap] .missive-view-inbox:after,[data-context=inbox] .missive-view-inbox:after {
        display: none
    }

    [data-context=bootstrap] .missive-view-conversation,[data-context=bootstrap] .missive-view-inbox,[data-context=bootstrap] .missive-view-main,[data-context=inbox] .missive-view-conversation,[data-context=inbox] .missive-view-inbox,[data-context=inbox] .missive-view-main {
        height: 100%;
        left: 0;
        max-width: none!important;
        min-width: none;
        position: absolute;
        top: 0;
        width: 100%
    }

    [data-context=bootstrap] .missive-view-conversation,[data-context=inbox] .missive-view-conversation {
        margin-top: 0!important;
        transform: translateX(100%);
        z-index: 2
    }

    [data-context=bootstrap] .missive-view-conversation .conversation-entry,[data-context=bootstrap] .missive-view-conversation .missive-message-actions,[data-context=inbox] .missive-view-conversation .conversation-entry,[data-context=inbox] .missive-view-conversation .missive-message-actions {
        margin-left: var(--padding);
        margin-right: var(--padding)
    }

    [data-context=bootstrap] .missive-view-conversation .conversation-entry.message:not(.draft),[data-context=bootstrap] .missive-view-conversation .missive-message-actions.message:not(.draft),[data-context=inbox] .missive-view-conversation .conversation-entry.message:not(.draft),[data-context=inbox] .missive-view-conversation .missive-message-actions.message:not(.draft) {
        border-radius: 0;
        margin-left: 0;
        margin-right: 0
    }

    [data-context=bootstrap] .missive-view-conversation .missive-message-actions .button-macos-large,[data-context=inbox] .missive-view-conversation .missive-message-actions .button-macos-large {
        padding: 8px 12px
    }

    [data-context=bootstrap] .missive-view-conversation .message+.missive-message-actions-container .missive-message-actions,[data-context=inbox] .missive-view-conversation .message+.missive-message-actions-container .missive-message-actions {
        padding: 0
    }

    [data-context=bootstrap][data-previous-view~=inbox] .missive-view-inbox,[data-context=bootstrap][data-view~=inbox] .missive-view-inbox,[data-context=inbox][data-previous-view~=inbox] .missive-view-inbox,[data-context=inbox][data-view~=inbox] .missive-view-inbox {
        visibility: visible!important
    }

    [data-context=bootstrap][data-view~=conversation] .missive-view-inbox,[data-context=inbox][data-view~=conversation] .missive-view-inbox {
        visibility: hidden
    }

    [data-context=bootstrap][data-view~=conversation] .missive-view-conversation,[data-context=inbox][data-view~=conversation] .missive-view-conversation {
        transform: translateX(0)
    }

    [data-context=bootstrap] .missive-view-account,[data-context=inbox] .missive-view-account {
        max-width: none!important
    }

    [data-context=bootstrap] .missive-view-integrations,[data-context=inbox] .missive-view-integrations {
        left: 100%;
        width: 85%;
        z-index: 3
    }

    [data-context=bootstrap] .missive-view-integrations .integration-container,[data-context=inbox] .missive-view-integrations .integration-container {
        max-width: none!important;
        width: 100%
    }

    [data-context=bootstrap][data-right-sidebar=main] .missive-view-integrations .integration-container,[data-context=inbox][data-right-sidebar=main] .missive-view-integrations .integration-container {
        transform: translateX(0)
    }

    .missive .mobile-no-padding {
        padding: 0
    }

    .missive .mobile-padding-block {
        padding: .8em
    }

    .missive .mobile-padding-block-important {
        padding: .8em!important
    }

    .missive .mobile-padding-block-small {
        padding: .5em
    }

    .missive .mobile-padding-top-small {
        padding-top: .5em
    }

    .missive .mobile-padding-bottom-small {
        padding-bottom: .5em
    }

    .missive .missive-popup .composer-overlay {
        top: 0
    }

    .missive .missive-popup .compose-bar .compose-actions .missive-columns-right {
        flex-grow: 0
    }

    .missive .missive-plus-button {
        right: var(--padding-large)
    }

    .missive .conversation-footer .comment-box {
        background-color: var(--top-bar-background-color);
        padding: var(--padding)
    }

    .missive .conversation-footer .comment-box .comment-box-task-bar {
        padding-bottom: var(--padding);
        padding-top: 0
    }

    .missive .conversation-footer .comment-box .comment-box-task-bar:after {
        display: none
    }

    .missive .conversation-footer .comment-box .comment-highlighter,.missive .conversation-footer .comment-box .comment-textarea {
        transition-duration: var(--material-duration);
        transition-property: background-color,box-shadow;
        transition-timing-function: var(--material-easing)
    }

    .missive .conversation-footer .comment-box .comment-textarea:not([data-state~=focused]),.missive .conversation-footer .comment-box .comment-textarea:not([data-state~=focused]) .comment-highlighter {
        background-color: var(--background-color)
    }

    .missive .conversation-footer .comment-box+.bottom-bar:after {
        display: none
    }

    .missive .comment-box-meta-bar {
        padding-left: 0;
        padding-right: 0
    }

    .missive .comment-box-meta-bar .comment-box-meta-bar-content {
        background-color: var(--top-bar-background-color);
        padding-bottom: 0;
        padding-top: 7px
    }

    .missive .comment-box-meta-bar .comment-box-meta-bar-content:after {
        opacity: 1
    }

    .missive .assignment-task-bar {
        padding: 0;
        padding-bottom: var(--padding)
    }

    .missive .assignment-task-bar:after,.missive.missive-popup-mobile .missive-veil {
        display: none
    }

    .missive.missive-popup-mobile .missive-popup {
        border-radius: 0;
        height: 100%!important;
        max-height: 100%!important;
        max-width: 100%!important;
        top: 0!important;
        width: 100%!important
    }

    .missive.missive-popup-mobile .missive-popup>.padding-block-big {
        padding-top: calc(var(--safe-area-inset-top) + 1.65em)
    }

    .missive.missive-popup-mobile .missive-popup.missive-scroll:before {
        background-color: var(--popup-background-color);
        content: "";
        display: block;
        height: var(--safe-area-inset-top);
        position: fixed;
        width: 100%;
        z-index: 5
    }

    .missive.missive-popup-mobile .top-bar {
        background-color: var(--light-background-color);
        border-radius: 0
    }

    [data-wrapper=electron][data-os=osx] .missive.missive-popup-mobile .top-bar .traffic-light-spacer {
        width: var(--traffic-light-width)
    }

    .missive.missive-popup-mobile .composer-top-bar {
        background-color: var(--top-bar-background-color)
    }

    .missive.missive-popup-mobile .composer-top-bar:after {
        display: none
    }

    .missive .popup-wrapper {
        padding: 16px
    }

    .missive .popup-wrapper .missive-scroll {
        max-height: 160px
    }

    .missive .form-content-columns {
        flex-direction: column
    }

    .missive .form-content-columns>div {
        padding-right: 0;
        width: 100%
    }

    .missive .form-content-columns>div+div {
        padding-left: 0;
        padding-top: 30px
    }

    .missive .form-content-columns>div+div:after {
        width: 0
    }

    .missive .missive-popup-preferences {
        overflow: hidden
    }

    .missive .missive-popup-preferences>.missive-columns>div {
        max-width: 100%;
        min-width: 100%;
        position: relative
    }

    .missive .missive-popup-preferences .preferences-selectable-list {
        box-shadow: none
    }

    .missive .missive-popup-preferences .preferences-container,.missive .missive-popup-preferences .preferences-content,.missive .missive-popup-preferences .preferences-selectable-list,.missive .missive-popup-preferences .preferences-sub-content,.missive .missive-popup-preferences .preferences-tab-content {
        min-width: 100%;
        overflow: hidden;
        transition: transform var(--material-duration) var(--material-easing);
        z-index: 1
    }

    .missive .missive-popup-preferences .preferences-container .missive-scroll,.missive .missive-popup-preferences .preferences-content .missive-scroll,.missive .missive-popup-preferences .preferences-selectable-list .missive-scroll,.missive .missive-popup-preferences .preferences-sub-content .missive-scroll,.missive .missive-popup-preferences .preferences-tab-content .missive-scroll {
        width: 100%
    }

    .missive .missive-popup-preferences .preferences-content,.missive .missive-popup-preferences .preferences-help,.missive .missive-popup-preferences .preferences-menu,.missive .missive-popup-preferences .preferences-selectable-list,.missive .missive-popup-preferences .preferences-sub-content,.missive .missive-popup-preferences .preferences-tab-content {
        background: var(--popup-background-color)
    }

    .missive .missive-popup-preferences .preferences-sub-content,.missive .missive-popup-preferences .preferences-tab-content {
        -webkit-overflow-scrolling: touch;
        overflow: auto;
        padding: var(--padding);
        padding-bottom: var(--safe-area-inset-bottom)
    }

    .missive .missive-popup-preferences .preferences-section {
        padding-right: 0
    }

    .missive .missive-popup-preferences .missive-mobile-menu {
        display: flex!important;
        left: 0;
        position: absolute;
        top: 0;
        width: 100%!important
    }

    .missive .missive-popup-preferences[data-state~=menu-selected] .missive-veil {
        opacity: 1;
        pointer-events: auto
    }

    .missive .missive-popup-preferences[data-state~=menu-selected] .preferences-menu-hidden {
        transform: translateX(0)
    }

    .missive .missive-popup-preferences[data-state~=item-selected] .preferences-content,.missive .missive-popup-preferences[data-state~=page-selected] .preferences-container {
        transform: translateX(-100%)
    }

    .missive .missive-popup-preferences .preferences-tab-content {
        transform: translateX(1em)
    }

    .missive .missive-popup-preferences[data-state~=tab-selected] .preferences-tab-content {
        transform: translateX(-100%)
    }

    .missive .preferences-close-icon {
        display: none!important
    }

    .missive .preferences-content .preferences-subnav {
        border: 0;
        margin: 0
    }

    .missive .preferences-content .preferences-subnav .missive-tabs {
        align-items: flex-start;
        flex-direction: column;
        margin: 0
    }

    .missive .preferences-content .text-small {
        font-size: 13px
    }

    .missive .preferences-accounts .preferences-content>.missive-scroll,.missive .preferences-integrations .preferences-content>.missive-scroll,.missive .preferences-organizations .preferences-content>.missive-scroll {
        display: flex;
        overflow: hidden!important;
        padding: 0
    }

    .missive .preferences-accounts .preferences-organizations-sharing,.missive .preferences-integrations .preferences-organizations-sharing,.missive .preferences-organizations .preferences-organizations-sharing {
        justify-content: flex-start;
        margin: .3em 0 0
    }

    .missive .preferences-accounts .preferences-organizations-sharing .missive-user-stack,.missive .preferences-integrations .preferences-organizations-sharing .missive-user-stack,.missive .preferences-organizations .preferences-organizations-sharing .missive-user-stack {
        margin-left: 0
    }

    .missive .preferences-accounts .preferences-organizations-flow,.missive .preferences-integrations .preferences-organizations-flow,.missive .preferences-organizations .preferences-organizations-flow {
        margin: .3em 0 0;
        width: auto
    }

    .missive .preferences-accounts .preferences-organization-shared-addresses .list-item-group .list-item-actions,.missive .preferences-integrations .preferences-organization-shared-addresses .list-item-group .list-item-actions,.missive .preferences-organizations .preferences-organization-shared-addresses .list-item-group .list-item-actions {
        margin: 0
    }

    .missive .preferences-accounts .preferences-organization-shared-addresses .list-item-group .list-item,.missive .preferences-integrations .preferences-organization-shared-addresses .list-item-group .list-item,.missive .preferences-organizations .preferences-organization-shared-addresses .list-item-group .list-item {
        display: block!important
    }

    .missive .preferences-accounts .preferences-organization-user-list .list-item-actions a,.missive .preferences-integrations .preferences-organization-user-list .list-item-actions a,.missive .preferences-organizations .preferences-organization-user-list .list-item-actions a {
        display: block
    }

    .missive .preferences-accounts .preferences-organization-user-list .list-item-actions a+a,.missive .preferences-integrations .preferences-organization-user-list .list-item-actions a+a,.missive .preferences-organizations .preferences-organization-user-list .list-item-actions a+a {
        margin-top: .3em
    }

    .missive .preferences-accounts .preferences-organization-user-list .list-item-actions .list-item-hidden-action,.missive .preferences-integrations .preferences-organization-user-list .list-item-actions .list-item-hidden-action,.missive .preferences-organizations .preferences-organization-user-list .list-item-actions .list-item-hidden-action,.missive .preferences-settings [data-column=Category] {
        display: none
    }

    .missive .preferences-settings [data-column=Keybinding] {
        text-align: right
    }

    .missive .preferences-settings [data-column=Keybinding] .missive-columns-justify {
        justify-content: flex-end
    }

    .missive .preferences-help {
        -webkit-overflow-scrolling: touch;
        flex-direction: column;
        overflow: auto
    }

    .missive .preferences-help>div {
        flex: auto 0 0
    }

    .missive .preferences-help .preferences-help-sidebar {
        order: 1;
        padding: 0 1em
    }

    .missive .preferences-help .preferences-help-sidebar:after {
        display: none
    }

    [data-notch=left] .missive .preferences-help .preferences-help-sidebar {
        padding-left: calc(var(--safe-area-inset-left)/1.5 + 1em)!important
    }

    .missive .preferences-help .preferences-help-sidebar .preferences-help-section {
        padding-left: 0;
        padding-right: 0
    }

    .missive .preferences-help .preferences-content {
        order: 2;
        padding-top: .7em
    }

    .missive .preferences-help .preferences-content .missive-scroll {
        flex: none;
        overflow: visible!important
    }

    .missive .missive-popup-rules {
        padding: .8em
    }

    .missive .missive-popup-rules .condition-row+.condition-row {
        margin-top: 1.2em
    }

    .missive .missive-popup-rules .action-row+.action-row {
        margin-top: .8em
    }

    .missive .missive-popup-rules .condition-matches+.condition-matches,.missive .missive-popup-rules .condition-row+.condition-matches {
        margin-bottom: 1.2em;
        margin-top: 1.2em
    }

    .missive .missive-popup-rules .action-form,.missive .missive-popup-rules .condition-form>.missive-columns {
        flex-direction: column
    }

    .missive .missive-popup-rules .action-form .missive-select.input,.missive .missive-popup-rules .action-form input.input,.missive .missive-popup-rules .condition-form>.missive-columns .missive-select.input,.missive .missive-popup-rules .condition-form>.missive-columns input.input {
        margin-right: 0
    }

    .missive .missive-popup-rules .action-selects>.missive-column-auto,.missive .missive-popup-rules .condition-selects>.missive-column-auto {
        flex-grow: 1;
        flex-shrink: 1;
        min-width: 0!important
    }

    .missive .missive-popup-rules .action-selects+.missive-select.input,.missive .missive-popup-rules .action-selects+input.input,.missive .missive-popup-rules .condition-selects+.condition-selects,.missive .missive-popup-rules .condition-selects+.missive-select.input,.missive .missive-popup-rules .condition-selects+input.input {
        margin-top: .5em
    }

    .missive .missive-popup-rules .action-selects {
        margin-bottom: .5em
    }

    .missive .missive-popup-rules .rule-condition-value-select {
        flex-basis: auto
    }

    .missive .missive-popup-rules .rules-buttons .margin-right-small {
        margin-right: .8em
    }

    .missive .missive-popup-rules .duration-picker {
        align-items: flex-start;
        flex-direction: column
    }

    .missive .missive-popup-rules .duration-picker-row {
        margin-top: .5em
    }

    .missive .missive-popup-rules .duration-picker-label {
        min-width: 4.5em
    }

    .missive .missive-popup-rules .duration-picker-input input {
        min-width: 4em
    }

    .missive .rule-time-range-table {
        flex-direction: column
    }

    .missive .rule-time-range-table>div {
        display: flex;
        flex-basis: auto
    }

    .missive .rule-time-range-table>div+div {
        border-left-width: 1px;
        border-top-width: 0
    }

    .missive .rule-time-range-table>div:first-child {
        border-radius: 6px 6px 0 0
    }

    .missive .rule-time-range-table>div:last-child {
        border-radius: 0 0 6px 6px
    }

    .missive .rule-time-range-table>div .border-bottom {
        border-bottom: 0;
        border-right: 1px solid var(--border-color);
        min-width: 5em;
        padding: 0
    }

    .missive .rule-time-range-table>div .row+.row {
        margin-left: 1.2em;
        margin-top: 0
    }

    .missive .missive-popup-form .missive-mobile-menu {
        display: flex!important
    }

    .missive .preferences-menu-hidden {
        height: 100%;
        left: 0;
        pointer-events: none;
        position: relative;
        position: absolute!important;
        top: 0;
        transform: translateX(-100%);
        transition: transform var(--material-duration) var(--material-easing);
        width: 100%;
        z-index: 2
    }

    .missive .preferences-menu-hidden:after {
        background: linear-gradient(to bottom,var(--section-shadow-color),transparent);
        content: "";
        height: var(--section-shadow-width);
        left: 0;
        position: absolute;
        right: 0;
        top: 0
    }

    .missive .preferences-menu-hidden .preferences-menu {
        border-radius: 0;
        max-width: none;
        pointer-events: auto;
        width: 75%
    }

    .missive .preferences-menu-hidden~.missive-veil {
        display: block;
        opacity: 0;
        pointer-events: none;
        position: fixed!important;
        transition: opacity var(--material-duration) var(--material-easing);
        z-index: 1
    }

    .missive .missive-popup-contacts .contact-card>.missive-scroll,.missive .missive-popup-member-profile .contact-card>.missive-scroll {
        display: flex;
        flex-direction: column
    }

    .missive .missive-popup-contacts .contact-card>.missive-scroll:after,.missive .missive-popup-member-profile .contact-card>.missive-scroll:after {
        content: "";
        flex-grow: 1;
        margin-bottom: -1.1em;
        pointer-events: none
    }

    .missive .missive-popup-contacts .contact-form>.missive-scroll>.padding-block,.missive .missive-popup-member-profile .contact-form>.missive-scroll>.padding-block {
        padding-left: .7em;
        padding-right: .2em
    }

    .missive .missive-popup-contacts .contact-form>.missive-scroll>.padding-block.label,.missive .missive-popup-member-profile .contact-form>.missive-scroll>.padding-block.label {
        padding-top: .6em
    }

    .missive .missive-popup-contacts .contact-form>.missive-scroll>.padding-block.label+.padding-block,.missive .missive-popup-member-profile .contact-form>.missive-scroll>.padding-block.label+.padding-block {
        padding-top: .1em
    }

    .missive .missive-popup-contacts .contact-form .contact-avatar,.missive .missive-popup-member-profile .contact-form .contact-avatar {
        top: .6em
    }

    .missive .missive-popup-contacts .contact-form .contact-field+.contact-field,.missive .missive-popup-contacts .contact-form .contact-fields .margin-left,.missive .missive-popup-member-profile .contact-form .contact-field+.contact-field,.missive .missive-popup-member-profile .contact-form .contact-fields .margin-left {
        margin-left: .5em
    }

    .missive-has-touch .missive.missive-contextmenu {
        transition: opacity var(--material-duration) var(--material-easing)!important
    }

    .missive-has-touch .missive.missive-contextmenu:not(.missive-contextmenu-no-background) {
        background: rgba(0,0,0,.4)!important
    }

    .missive-has-touch .missive.missive-contextmenu .current-menu:first-child {
        -webkit-animation: slideUp var(--material-duration) var(--material-easing);
        animation: slideUp var(--material-duration) var(--material-easing)
    }

    .missive-has-touch .missive.missive-contextmenu.missive-contextmenu-hidding .current-menu {
        transform: translateY(100%)!important;
        transition: transform var(--material-duration) var(--material-easing)
    }

    .missive-has-touch .missive.missive-contextmenu.mobile-keyboard-anchor-top .tooltip {
        border-radius: 0 0 12px 12px!important;
        bottom: auto!important;
        top: 0!important
    }

    .missive-has-touch .missive.missive-contextmenu.mobile-keyboard-anchor-top .current-menu:first-child {
        -webkit-animation: slideDown var(--material-duration) var(--material-easing);
        animation: slideDown var(--material-duration) var(--material-easing)
    }

    .missive-has-touch .missive.missive-contextmenu.mobile-keyboard-anchor-bottom .tooltip,.missive-has-touch .missive.missive-contextmenu.mobile-keyboard-anchor-top .tooltip {
        padding-bottom: var(--padding-small)!important
    }

    .missive-has-touch .missive .tooltip {
        background-color: var(--popup-background-color);
        border-radius: 12px 12px 0 0!important;
        bottom: 0!important;
        left: 0!important;
        max-height: calc(100% - 65px - var(--safe-area-inset-top))!important;
        max-width: none!important;
        right: 0!important;
        top: auto!important;
        width: 100%!important
    }

    .missive-has-touch .missive .tooltip:not(.current-menu) {
        display: none!important
    }

    .missive-has-touch .missive .tooltip:not(.tooltip-no-scroll) {
        padding-bottom: var(--safe-area-inset-bottom)!important
    }

    .missive-has-touch .missive .tooltip>.option:not(.option-no-padding) {
        padding: 14px!important
    }

    .missive-has-touch .missive .tooltip.tooltip-with-checkmark .option:not(.option-no-padding-force) {
        padding-left: 2em!important
    }

    .missive-has-touch .missive .tooltip .missive-icon-checkmark {
        left: 10px!important
    }

    .missive-has-touch .missive .tooltip .option:active:not([data-state~=disabled]):not(.optgroup-label):not(.option-not-clickable) {
        background: var(--light-border-color);
        color: var(--text-color-a)
    }

    .missive-has-touch .missive .tooltip .option {
        border-radius: 9px
    }

    .missive-has-touch .missive .tasks-menu .missive-white-box {
        box-shadow: none
    }

    .missive-has-touch .missive .missive-veil {
        background-color: rgba(0,0,0,.5)
    }

    .missive-has-touch[data-theme^=dark] .missive.missive-contextmenu {
        background-color: rgba(0,0,0,.65)!important
    }

    .missive-has-touch[data-notch=right] .missive .tooltip .option:not(.option-no-padding) {
        padding-right: calc(var(--safe-area-inset-right)/1.5 + 1.4em)!important
    }

    .missive-has-touch[data-notch=left] .missive .tooltip .option:not(.option-no-padding) {
        padding-left: calc(var(--safe-area-inset-left)/1.5 + 1.4em)!important
    }

    .missive .emoji-mart {
        min-width: 100%
    }

    .missive .emojis-menu {
        background-color: transparent!important;
        box-shadow: none!important
    }

    .missive .missive-popup-status .preferences-box .missive-select {
        margin-left: 0;
        padding-left: 0
    }

    .missive .missive-popup-status .preferences-box .organizations-selector {
        align-items: start;
        flex-direction: column
    }
}

@media(max-height: 479px),(max-width:812px) {
    .missive-composer .composer-container,.missive-popup .composer-container {
        -webkit-overflow-scrolling:touch;
        overflow: scroll;
        padding-bottom: 0;
        position: relative
    }

    .missive-composer .composer-container .composer-message .collab-preview,.missive-composer .composer-container .composer-message .ProseMirror,.missive-popup .composer-container .composer-message .collab-preview,.missive-popup .composer-container .composer-message .ProseMirror {
        overflow-x: auto;
        overflow-y: visible
    }

    .missive-composer .composer-container .collab-container,.missive-composer .composer-container .composer-message,.missive-popup .composer-container .collab-container,.missive-popup .composer-container .composer-message {
        flex: 1 0 auto!important;
        flex-direction: row;
        width: 100%
    }

    .missive-composer .composer-message[data-type=twitter_tweet],.missive-popup .composer-message[data-type=twitter_tweet] {
        flex-direction: column-reverse
    }

    .missive-composer .composer-message[data-type=twitter_tweet] .ProseMirror,.missive-popup .composer-message[data-type=twitter_tweet] .ProseMirror {
        padding-top: 20px
    }

    .missive-composer .composer-message[data-type=twitter_tweet] .composer-max-chars,.missive-popup .composer-message[data-type=twitter_tweet] .composer-max-chars {
        padding: 3px 16px;
        pointer-events: none;
        position: absolute;
        right: 0;
        top: 0
    }
}

.message-print {
    height: 100%;
    left: 0;
    position: absolute;
    text-align: center;
    top: 0;
    width: 100%;
    z-index: 100
}

.message-print,.message-print .missive-message-body {
    font-family: Helvetica,Arial,sans-serif!important
}

.message-print:before {
    content: "";
    height: 100%
}

.message-print h1 {
    font-size: 1.6em;
    margin: 0
}

.message-print .button,.message-print .link-c {
    margin-left: 1em
}

.message-print .link-c+.link-c:before {
    content: "•";
    margin-right: .9em
}

.message-print .message {
    -webkit-overflow-scrolling: touch;
    -webkit-print-color-adjust: exact;
    height: 100%;
    margin-top: 0;
    overflow: auto!important;
    padding-top: 50px
}

.message-print .message-attachments {
    margin-top: 1em
}

.message-print .message-attachments img {
    display: inline-block;
    max-width: 100%
}

.message-print .missive-veil {
    background-color: #000;
    bottom: 0;
    left: 0;
    opacity: var(--veil-opacity);
    position: fixed;
    right: 0;
    top: 0
}

.message-print-content,.message-print:before {
    display: inline-block;
    text-align: left;
    vertical-align: middle
}

.missive-print-top-bar {
    background-color: #fff;
    background-color: var(--background-color);
    border-bottom: 1px solid var(--light-border-color);
    border-radius: 6px 6px 0 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 10
}

.missive-print-top-bar .missive-icon-close,.missive-print-top-bar .missive-icon-close svg {
    height: 24px;
    width: 24px
}

.missive-print-top-bar .missive-icon-more,.missive-print-top-bar .missive-icon-more svg {
    height: 21px;
    width: 21px
}

.message-print-content {
    background-color: #fff;
    border-radius: 6px;
    box-shadow: 0 15px 50px var(--shadow-color);
    height: 95%;
    position: relative;
    width: 82%;
    z-index: 1
}

@media(max-width: 812px) {
    .message-print-content {
        border-radius:0;
        box-shadow: none;
        height: 100%;
        width: 100%
    }

    .missive-print-top-bar {
        border-radius: 0;
        padding-top: var(--safe-area-inset-top)
    }

    .missive-print-top-bar .detached-border-bottom:after {
        left: 0;
        right: 0
    }

    .message-print .message {
        padding-top: calc(var(--safe-area-inset-top) + 52px)
    }
}

@media print {
    body,html {
        background: #fff!important;
        height: auto;
        overflow: auto;
        -webkit-user-select: text;
        -moz-user-select: text;
        user-select: text;
        width: auto
    }

    .missive-columns,.missive-columns-vertical {
        display: block!important
    }

    [data-reactroot]>* {
        display: none!important
    }

    .message-print {
        display: block!important;
        position: static
    }

    .message-print .missive-print-top-bar,.message-print .missive-veil {
        display: none
    }

    .message-print .message {
        height: auto;
        overflow: visible!important;
        padding-top: 0
    }

    .message-print-content {
        border-radius: 0;
        box-shadow: none;
        display: block;
        height: auto;
        width: auto
    }
}

/*# sourceMappingURL=application-cb1179bef627d44f8b67.css.map*/
