.mail-address{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;border-bottom:1px solid var(--line)}
.mail-address b{font-size:16px;font-weight:700;min-width:0;user-select:all;overflow-wrap:anywhere}
.mail-address p{flex-basis:100%;margin:0}
.mail-compose textarea{width:100%;box-sizing:border-box;resize:vertical;min-height:100px;padding:12px;font:inherit;color:inherit;background:var(--paper,#e9e5d7);border:1px solid var(--border,#b9b8a9);border-radius:3px}
.mail-compose h3{margin:20px 0 12px}
.mail-compose .field{margin-top:16px}
.mail-attachment{display:flex;align-items:center;gap:12px;margin:12px 0;min-width:0}
.mail-attachment .item-icon{width:58px;height:58px;flex-shrink:0;overflow:hidden}
.mail-attachment p{margin:4px 0 0}
.mail-attachment b{overflow-wrap:anywhere}
.mail-quantity{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.mail-quantity input{width:80px;padding:8px;font:inherit}
.mail-letter{border-top:1px solid var(--border,#b9b8a9)}
.mail-letter.unread{border-left:3px solid #937244}
.mail-letter-heading{display:flex;justify-content:space-between;gap:12px;width:100%;padding:16px;text-align:left;font:inherit;color:inherit;background:transparent;border:0;cursor:pointer}
.mail-letter-heading>span{min-width:0;overflow-wrap:anywhere}
.mail-letter-heading small{display:block;margin-top:6px;font-size:12px;font-weight:400}
.mail-letter-body{padding:0 16px 20px}
.mail-text{white-space:pre-wrap;overflow-wrap:anywhere}
.mail-warning{color:#795026;overflow-wrap:anywhere}
.mail-compose details{margin:16px 0}
.mail-compose summary{cursor:pointer}
.mail-compose>.wide{margin-top:18px}
.mail-counter[hidden]{display:none}
.mail-header{position:relative;color:var(--ink)}.mail-header .counter{position:absolute;right:-6px;top:-6px;background:#963f33;color:#f9edd7;font:10px system-ui;padding:2px 4px;min-width:14px;text-align:center}
.mail-mobile-icon{position:relative}.mail-mobile-icon .counter{position:absolute;right:-9px;top:-4px;background:#963f33;color:#f9edd7;font:10px system-ui;padding:1px 4px;border-radius:8px}
@media(max-width:600px){.mail-letter-heading{padding:14px;flex-direction:column;gap:4px}.mail-letter-heading .small small{display:inline;margin-left:12px}.mail-address b{font-size:15px}.mail-compose select{max-width:100%}.top-right .mail-header{display:inline-flex;position:relative}.mail-header .counter{position:absolute;right:-6px;top:-6px}}
