/* v1.38: optional message thumbnails and native touchscreen scrolling. */
.inbox-list,.inbox-detail{overflow-y:auto;overflow-x:hidden;scrollbar-width:none;-ms-overflow-style:none;touch-action:pan-y;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch}
.inbox-list::-webkit-scrollbar,.inbox-detail::-webkit-scrollbar{display:none;width:0;height:0}
.inbox-list-header,.message-item,.inbox-detail>*{flex-shrink:0}
.message-item{display:flex;align-items:center;gap:clamp(8px,.7cqw,13px);min-width:0}
.message-list-copy{min-width:0;flex:1}
.message-list-thumb{width:clamp(44px,3.5cqw,62px);height:clamp(44px,3.5cqw,62px);object-fit:cover;object-position:center;border:1px solid #8e7644;border-radius:8px;flex:none;background:#080e16;user-select:none;-webkit-user-drag:none}
.message-item .message-subject{overflow-wrap:anywhere}
/* Unread dot sits left of the type label, away from the delete button. */
.message-item .message-top{justify-content:flex-start;gap:8px}
.message-heading{display:flex;gap:clamp(12px,1.1cqw,20px);align-items:center;margin-bottom:clamp(10px,.9cqw,16px)}
.message-heading-copy{flex:1;min-width:0}
.message-heading .sender{margin-bottom:0}
.message-heading h2{overflow-wrap:anywhere}
.message-thumbnail{display:block;width:clamp(72px,7cqw,124px);height:clamp(72px,7cqw,124px);object-fit:cover;object-position:center;flex:none;border:1px solid #9e8145;border-radius:11px;background:#080e16;user-select:none;-webkit-user-drag:none}
.message-thumbnail[hidden],.message-list-thumb[hidden]{display:none}
.inbox-list:focus-visible,.inbox-detail:focus-visible{outline:2px solid #ffe19a;outline-offset:-3px}
.message-item .message-preview{color:#cbd9e5;font-size:var(--type-xs);line-height:1.3;margin:0 0 4px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.inbox-pager{position:sticky;bottom:-14px;display:flex;justify-content:center;margin:auto -14px -14px;padding:8px 14px;background:linear-gradient(transparent,#070c13 30%);z-index:1}.inbox-pager:empty{display:none}
.inbox-pager .menu-page{min-height:44px;min-width:44px}
/* Profile mail badge: unread count only, pill sized to its text (up to "99+") */
.nav button .profile-mail-count{box-sizing:border-box;top:-9px;right:-9px;min-width:1.6em;height:1.6em;padding:0 .35em;border:1.5px solid #0b1119;font-size:clamp(12px,.6cqw,15px);line-height:1;white-space:nowrap;letter-spacing:-.02em;box-shadow:0 1px 4px rgba(0,0,0,.5)}
/* Delete a Message Box message: red X on the list item, in-screen confirm dialog */
.message-item.deletable{position:relative;padding-right:clamp(40px,3cqw,54px)}
.message-delete{position:absolute;top:50%;right:clamp(7px,.6cqw,11px);transform:translateY(-50%);display:grid;place-items:center;width:clamp(30px,2.3cqw,40px);height:clamp(30px,2.3cqw,40px);border:1px solid #e0474c;border-radius:8px;background:#2a0d10;color:#ff5a5f;cursor:pointer;touch-action:manipulation}
.message-delete:hover,.message-delete:focus-visible{background:#4a1418;outline:2px solid #ff7a7e;outline-offset:1px}
.message-delete svg,.message-delete-icon svg{width:58%;height:58%;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round}
.modalbg.message-delete-overlay{position:absolute;inset:0;z-index:8;display:grid;place-items:center;padding:16px;background:#05080dcc;border-radius:13px}
.message-delete-modal{width:min(440px,100%);display:flex;flex-direction:column;align-items:center;gap:10px;padding:clamp(18px,1.6cqw,28px);text-align:center;background:linear-gradient(145deg,#141c28,#080d14);border:1px solid #e0474c;border-radius:14px;box-shadow:0 18px 50px #000a}
.message-delete-icon{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:#3a1014;border:2px solid #e0474c;color:#ff5a5f}
.message-delete-modal h2{margin:0;font-size:clamp(19px,1.5cqw,26px);color:#fff}
.message-delete-modal p{margin:0;color:#d6e0ea;font-size:clamp(13px,1cqw,17px);line-height:1.4;overflow-wrap:anywhere}
.message-delete-modal p b{color:#ffdf7b}
.message-delete-modal small{color:#9fb0c1;font-size:clamp(11px,.85cqw,14px)}
.message-delete-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%;margin-top:6px}
.message-delete-actions button{min-height:48px;border-radius:9px;font-weight:800;font-size:clamp(14px,1.1cqw,18px);cursor:pointer;touch-action:manipulation}
.message-delete-cancel{border:1px solid #52606f;background:#131c27;color:#e6ecf2}
.message-delete-confirm{border:1px solid #ff6b70;background:linear-gradient(120deg,#e0474c,#b4262c);color:#fff}
