#task-bell{position:relative;flex-shrink:0;min-width:44px;min-height:44px;margin-left:auto;color:#164b73;border:1px solid #d3e0e6;background:#fff;border-radius:12px}
#task-bell svg{width:24px;height:24px;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:1.8}
#task-count{position:absolute;right:-5px;top:-7px;border-radius:20px;min-width:23px;padding:2px 5px;background:#164b73;color:white;font-size:12px;font-weight:700}
#task-bell[data-priority=urgent] #task-count{background:#b42318}
#task-bell[data-priority=important] #task-count{background:#9c5200}
#mail-center{width:min(790px,calc(100vw - 24px));max-width:790px;max-height:90dvh;overflow:auto;padding:24px;border:1px solid #d3e0e6;border-radius:18px}
#mail-center::backdrop{background:#102f3b77}
#mail-center .dialog-heading{position:sticky;top:-24px;background:white;z-index:1;padding:12px 0}
#mail-center h3{margin:22px 0 12px}
#mail-center details{margin:14px 0;padding:12px;border:1px solid #d3e0e6;border-radius:10px}
#mail-center summary{cursor:pointer;font-weight:650}
#mail-center p,#mail-center small{overflow-wrap:anywhere}
.mail-legend,.mail-provider-buttons{display:flex;flex-wrap:wrap;gap:12px;margin:14px 0}
.mail-legend{font-size:12px}
.mail-legend [data-priority=urgent]{color:#b42318}.mail-legend [data-priority=important]{color:#9c5200}.mail-legend [data-priority=normal]{color:#164b73}
.mail-task{border:1px solid #d3e0e6;border-left:5px solid #164b73;border-radius:10px;margin:14px 0;padding:16px;background:white}
.mail-task[data-priority=urgent]{border-left-color:#b42318}.mail-task[data-priority=important]{border-left-color:#9c5200}
.mail-task-heading{display:flex;gap:12px;justify-content:space-between;align-items:flex-start;overflow-wrap:anywhere}
.mail-priority{font-size:12px;font-weight:700;min-width:100px;color:#164b73}
.mail-task[data-priority=urgent] .mail-priority{color:#b42318}.mail-task[data-priority=important] .mail-priority{color:#9c5200}
.mail-task blockquote{margin:12px 0;padding:12px;background:#f1f6f8;color:#304f5b;font-size:13px;overflow-wrap:anywhere}
.mail-notification{padding:8px 0;border-bottom:1px solid #d3e0e6}
#mail-center button{margin-top:8px}#mail-center button:disabled{opacity:.5;cursor:not-allowed}
@media(max-width:600px){#mail-center{padding:16px}.mail-task-heading{display:block}.mail-priority{display:block;margin-top:8px}.topbar .topbar-user{max-width:100px}.mail-task{padding:12px}}
