.mailbox-header{height:137px;position:relative;text-align:center;padding:25px 62px 0}.mailbox-header h1{font-size:23px;font-weight:600;letter-spacing:1px;margin:0 0 23px}.mailbox-header p{font-size:14px;letter-spacing:1px;color:#987b6d;margin:0;white-space:nowrap}.mailbox-header .back-button{background:transparent;left:13px;top:22px}.mailbox-header .back-button img{width:25px;height:25px}.mailbox-header .music-button{right:67px;top:24px;width:29px;height:29px}.add-letter{position:absolute;right:18px;top:25px;width:29px;height:29px;display:grid;place-items:center;border-radius:50%;background:#ce706a;box-shadow:0 2px 5px #ba7d6a20}.add-letter img{width:21px;height:21px}
.mailbox-main{padding:0 16px 111px;gap:23px;min-height:687px;display:flex;flex-direction:column}.mailbox-filters{display:flex;gap:14px;padding:0 15px}.mailbox-filter{flex:1;padding:8px 9px;white-space:nowrap;font-size:15px;letter-spacing:1px;border:1px solid #ecd5c7;border-radius:24px;background:#fff7f055;color:#a18071}.mailbox-filter.active{background:linear-gradient(120deg,#d67f76,#c96b65);color:#fff9f3;border-color:#d07c72;box-shadow:0 3px 9px #cf7c6c18}.letter-list{list-style:none;display:grid;gap:14px;padding:0;margin:0}.letter-card{width:100%;display:flex;align-items:center;text-align:left;min-height:128px;padding:16px 13px 16px 5px;border:1px solid #fffcf8;background:linear-gradient(120deg,#fff9f2b0,#fcf2e9aa);border-radius:17px;box-shadow:0 4px 9px #ad7b6410,inset 0 0 0 1px #f0d8ca40;gap:6px}.letter-card:hover{background:#fff9f2}.letter-art{width:120px;height:89px;object-fit:contain;flex-shrink:0;filter:drop-shadow(0 3px 3px #b6886b12)}.letter-card-copy{flex:1;min-width:0}.letter-card h2{font-size:19px;font-weight:600;letter-spacing:.8px;margin:0 0 10px;overflow-wrap:anywhere}.letter-date{display:flex;align-items:center;gap:5px;color:#a38476;font-size:13px;margin:0;line-height:1.5}.letter-date img{width:15px;height:15px}.letter-status{display:inline-block;border-radius:15px;padding:3px 11px;margin-top:8px;font-size:11px;color:#b7907b;background:#f5e6d9;letter-spacing:1px}.letter-status.ready{color:#b57865;background:#f7dfd1}.letter-status.opened{color:#9c8b77;background:#ede8dc}.letter-arrow{width:18px;height:18px;flex-shrink:0;opacity:.8}.compose-letter{display:flex;align-items:center;justify-content:center;gap:11px;width:calc(100% - 20px);margin:46px auto 0;min-height:51px;padding:12px 16px;border-radius:29px;background:linear-gradient(110deg,#d47d73,#c86762);box-shadow:0 4px 10px #c87d6a18;color:#fff8ee;font-size:19px;letter-spacing:2px}.compose-letter img{width:25px;height:25px}.mailbox-empty{text-align:center;border:1px dashed #e8cbbb;border-radius:20px;padding:30px 18px;color:#a48777;font-size:14px;line-height:1.9}.mailbox-empty img{width:108px;height:83px;object-fit:contain;margin:auto}.mailbox-empty p{margin-bottom:0}.mailbox-note{text-align:center;color:#b79685;font-size:11px;letter-spacing:.5px;margin:0}
.letter-editor{max-width:400px;text-align:left;max-height:calc(100svh - 36px);overflow-y:auto;padding:25px}.letter-editor h2{text-align:center;letter-spacing:2px}.editor-subtitle{text-align:center;font-size:13px!important;margin:0 0 16px}.letter-editor textarea{min-height:175px}.letter-editor .field-label{margin-top:16px}.anytime-label{display:flex;gap:8px;align-items:center;font-size:13px;color:#967462;margin:13px 0}.anytime-label input{width:16px;height:16px;accent-color:#ce706a}.draft-status{font-size:11px!important;text-align:right;margin:7px 0!important;min-height:17px}.letter-editor .primary-button{width:100%;letter-spacing:1px}.letter-reader-meta{font-size:12px!important;color:#ad8b78!important}.letter-paper{text-align:left;white-space:pre-wrap;overflow-wrap:anywhere;line-height:2;font-size:15px;background:repeating-linear-gradient(transparent,transparent 31px,#e9cdb950 31px,#e9cdb950 32px);padding:0 8px;max-height:45svh;overflow-y:auto;margin-top:18px}.locked-letter{padding:4px 0}.locked-letter strong{display:block;color:#b37b67;font-size:22px;margin:17px 0 10px}.letter-reader-signoff{font-size:12px!important;text-align:right;margin-top:20px}.letter-editor input:disabled{opacity:.45}.letter-editor input,.letter-editor textarea{font-size:16px}
@media(min-width:500px){.mailbox-main{min-height:717px}.mailbox-header{height:137px}}
@media(max-width:360px){.mailbox-header{height:125px;padding-left:47px;padding-right:47px}.mailbox-header h1{font-size:21px}.mailbox-header p{font-size:12px}.mailbox-header .music-button{right:52px}.add-letter{right:13px}.mailbox-main{padding-left:12px;padding-right:12px;gap:20px;min-height:650px}.mailbox-filters{padding:0 10px;gap:10px}.mailbox-filter{font-size:14px}.letter-card{min-height:116px;padding-left:3px;padding-right:9px}.letter-art{width:97px;height:80px}.letter-card h2{font-size:17px}.letter-date{font-size:11px}.letter-status{font-size:10px;padding-left:8px;padding-right:8px}.compose-letter{font-size:17px;margin-top:39px}}