:root{font-family:system-ui,sans-serif;color:#172337;background:#f3f6fb;font-size:16px;--accent:#1769d2}*{box-sizing:border-box}body{margin:0}header{height:76px;padding:20px 28px;background:#fff;border-bottom:1px solid #dbe3ee;display:flex;align-items:center;gap:20px}header strong{font-size:1.3rem}header button{margin-left:auto}#mode{font-size:.875rem;color:#66758b}button,input,select,textarea{font:inherit}button{border:1px solid #d6e0ef;background:#fff;border-radius:9px;padding:10px 14px;cursor:pointer;color:#172337}button:hover{background:#edf3fc}button:focus-visible{outline:3px solid #7eaff4}button:disabled{opacity:.5;cursor:wait}main{display:grid;grid-template-columns:230px minmax(280px,380px) minmax(300px,1fr);min-height:calc(100vh - 76px)}aside{padding:24px 16px}aside label{font-size:.875rem;color:#59677a}select{width:100%;padding:10px;border:1px solid #cad6e5;border-radius:8px;margin:10px 0 22px;background:white}nav{display:grid;gap:6px}nav button{text-align:left;background:transparent;border-color:transparent}nav button.active{background:#deebff;color:#1054ae;font-weight:600}#disconnect{margin-top:24px;font-size:.875rem}.inbox{background:#fff;border-left:1px solid #e0e6f0;border-right:1px solid #e0e6f0}.toolbar{padding:20px 16px;border-bottom:1px solid #e0e6f0;display:flex;align-items:center;gap:8px;flex-wrap:wrap}h1{font-size:1.15rem;margin:0 auto 0 0}.toolbar button{font-size:.875rem}.message{display:block;width:100%;border:0;border-bottom:1px solid #e4eaf3;border-radius:0;padding:20px;text-align:left}.message strong,.message span{display:block}.message strong{font-weight:500;margin:8px 0}.message.unread strong{font-weight:750}.meta{font-size:.875rem;color:#5b6b82}.message.selected{background:#e9f1ff}.reader{background:#fafcff;padding:36px}.reader h2{font-size:1.5rem;line-height:1.35;margin-top:0}.reader pre{font-family:inherit;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.7;margin-top:30px}.reader .meta{overflow-wrap:anywhere}.empty{padding:40px 16px;color:#66758b;text-align:center}#notice{margin:0;padding:14px 28px;background:#fff1ce;color:#523f11}dialog{border:0;border-radius:16px;width:min(560px,94vw);padding:28px;box-shadow:0 20px 80px #14284b33}dialog::backdrop{background:#15274766}form label{display:grid;gap:8px;margin:18px 0}input,textarea{width:100%;padding:12px;border:1px solid #bac9dd;border-radius:8px}form p{font-size:.875rem;line-height:1.55;color:#586980}.actions{display:flex;justify-content:flex-end;gap:10px}.actions button[type=submit],#compose{background:var(--accent);color:white;border-color:var(--accent)}#more{margin:16px}#reader-back{margin-bottom:20px}@media(max-width:1000px){main{grid-template-columns:190px minmax(260px,1fr)}.reader{grid-column:1/-1;border-top:1px solid #dde5f0}}@media(max-width:600px){header{padding:16px;gap:10px;height:auto;flex-wrap:wrap}header strong{font-size:1.1rem}main{display:block}aside{padding:16px}aside select{margin-bottom:12px}nav{display:flex;overflow-x:auto}nav button{white-space:nowrap}#disconnect{margin-top:12px}body.reading aside,body.reading .inbox{display:none}.reader{padding:24px 20px}.reader:has(.empty){display:none}.toolbar{padding:16px}dialog{padding:20px}}

nav ul{list-style:none;padding:0;margin:0;display:grid;gap:4px}nav ul ul{padding-left:16px}nav button{width:100%}.folder-group{display:block;padding:10px 14px;color:#59677a}nav summary{font-size:.75rem;color:#59677a;padding:4px 14px;cursor:pointer}#menu,#menu-backdrop{display:none}
@media(max-width:600px){#menu{display:block;margin-left:0}aside{display:none}body.menu-open aside{display:block!important;position:fixed;inset:0 auto 0 0;width:min(310px,85vw);overflow:auto;background:#f3f6fb;z-index:20;padding-top:24px}body.menu-open #menu-backdrop{display:block;position:fixed;inset:0;width:100%;height:100%;background:#15274766;border:0;border-radius:0;z-index:19}nav{display:block;overflow:visible}body.menu-open{overflow:hidden}}

.reader-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:24px}

.editor-toolbar{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}.email-editor{min-height:180px;border:1px solid #bac9dd;border-radius:8px;padding:12px;outline:none;overflow-wrap:anywhere}.email-editor:focus{outline:2px solid #7eaff4}.email-editor p{color:inherit;font-size:1rem;margin:8px 0}.email-editor blockquote{border-left:3px solid #cad6e5;padding-left:12px;margin-left:0}.email-editor a{color:var(--accent)}dialog{max-height:92vh;overflow:auto}

.attachment-list a{color:var(--accent);overflow-wrap:anywhere}#compose-files{padding-left:20px}#compose-files li{margin:8px 0;overflow-wrap:anywhere}#compose-files button{padding:4px 8px;font-size:.8rem}

@media(max-width:600px){body:not(.reading) .reader{display:none}}

[hidden]{display:none!important}.welcome{max-width:540px;margin:10vh auto;padding:28px;text-align:center}.welcome h1{margin:0;font-size:1.65rem;line-height:1.3}.welcome p{color:#586980;line-height:1.6}.welcome button{background:var(--accent);color:white;border-color:var(--accent)}#connect-error{padding:12px;border-radius:8px;background:#fff1ce;color:#523f11}body[data-state]:not([data-state="mail"]) #mode{display:none}dialog[open]{max-height:calc(100dvh - 32px)}