:root{
  --app-bg:#f4f8ff;
  --panel:#ffffff;
  --panel-soft:rgba(255,255,255,.78);
  --text:#101828;
  --muted:#667085;
  --muted-2:#8793a7;
  --line:#e4eaf4;
  --line-strong:#d4ddea;
  --blue:#2468f2;
  --blue-2:#e9f2ff;
  --blue-3:#dbeafe;
  --green:#22c55e;
  --red:#ef4444;
  --orange:#f59e0b;
  --shadow:0 24px 70px rgba(24,39,75,.13);
  --shadow-soft:0 16px 38px rgba(24,39,75,.08);
  --radius:24px;
  --sidebar-w:310px;
  --topbar-h:100px;
  --actionbar-h:68px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--text);background:radial-gradient(circle at 8% 4%,#eff7ff 0 28%,transparent 42%),linear-gradient(135deg,#f6fbff 0%,#f1f5fb 50%,#edf4ff 100%);-webkit-font-smoothing:antialiased;text-rendering:geometricPrecision}
a{color:var(--blue);text-decoration:none}button,input,select,textarea{font:inherit}button{color:inherit}.muted{color:var(--muted)}.center{text-align:center}.mobile-only{display:none!important}
.btn,.icon-btn,.compose-main{border:1px solid var(--line);border-radius:14px;background:#fff;color:#172033;padding:.72rem 1rem;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,background .18s ease,border-color .18s ease}.btn:hover,.icon-btn:hover{background:#f8fbff;border-color:#cbd8ec;transform:translateY(-1px);box-shadow:0 10px 24px rgba(24,39,75,.08)}.btn.primary,.compose-main{background:linear-gradient(135deg,#2e74ff,#125eea);color:#fff;border-color:transparent;box-shadow:0 12px 24px rgba(36,104,242,.24)}.btn.primary:hover,.compose-main:hover{background:linear-gradient(135deg,#1f67f4,#0758df);box-shadow:0 16px 28px rgba(36,104,242,.3)}.btn.danger{background:var(--red);border-color:var(--red);color:#fff}.icon-btn{display:inline-grid;place-items:center;min-width:42px;min-height:42px;padding:0;border-radius:14px}.top-toast-stack{position:fixed;right:22px;top:22px;z-index:1000;display:grid;gap:10px}.toast{background:rgba(255,255,255,.95);border:1px solid var(--line);border-radius:18px;padding:12px 15px;box-shadow:var(--shadow-soft);backdrop-filter:blur(14px);transition:.22s ease}.toast-error{border-color:#fecaca;background:#fff7f7;color:#9f1239}.toast-success{border-color:#bbf7d0;background:#f0fdf4;color:#166534}

/* Auth */
.auth-body{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 20% 15%,#dfeeff 0 30%,transparent 44%),radial-gradient(circle at 82% 78%,#e7eaff 0 24%,transparent 42%),#f5f9ff}.auth-shell{width:min(1080px,calc(100vw - 32px));display:grid;grid-template-columns:1.05fr .95fr;gap:28px;align-items:stretch}.auth-brand{position:relative;overflow:hidden;padding:48px;border:1px solid rgba(255,255,255,.72);border-radius:34px;background:linear-gradient(135deg,rgba(29,78,216,.92),rgba(15,23,42,.94));color:#fff;box-shadow:var(--shadow);display:flex;flex-direction:column;justify-content:flex-end;min-height:560px}.auth-brand::before{content:"";position:absolute;inset:auto -18% -18% -18%;height:54%;background:linear-gradient(160deg,transparent 16%,rgba(255,255,255,.18) 16.3% 25%,transparent 25.3%),linear-gradient(20deg,transparent 22%,rgba(255,255,255,.12) 22.3% 34%,transparent 34.3%);opacity:.8}.brand-mark{width:72px;height:72px;border-radius:22px;background:rgba(255,255,255,.18);display:grid;place-items:center;font-size:34px;backdrop-filter:blur(12px)}.auth-brand h1{font-size:56px;line-height:1;margin:22px 0 10px}.auth-brand p{font-size:18px;color:#eaf2ff;max-width:460px}.auth-card{align-self:center;padding:34px;border:1px solid rgba(255,255,255,.78);border-radius:34px;background:rgba(255,255,255,.83);box-shadow:var(--shadow);backdrop-filter:blur(18px)}.stack-form{display:grid;gap:16px}.stack-form label,.form-grid label,.account-form label{display:grid;gap:7px;font-weight:720;color:#344054}.stack-form input,.form-grid input,.form-grid select,.account-form textarea,.compose-grid input,.compose-grid select,.searchbox input{width:100%;border:1px solid var(--line-strong);border-radius:13px;background:#fff;color:var(--text);outline:none;padding:.84rem .95rem;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}.stack-form input:focus,.form-grid input:focus,.form-grid select:focus,.compose-grid input:focus,.compose-grid select:focus,.searchbox input:focus{border-color:#9bc3ff;box-shadow:0 0 0 4px rgba(36,104,242,.11)}

/* Mail App */
.app-body{height:100vh;overflow:hidden}.mail-app{height:100vh;display:flex;overflow:hidden;background:linear-gradient(135deg,#f8fbff,#eef5ff);border:1px solid #d9e3f2;border-radius:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.55)}.app-sidebar{position:relative;width:var(--sidebar-w);min-width:var(--sidebar-w);display:flex;flex-direction:column;gap:14px;padding:28px 18px 18px;background:linear-gradient(180deg,rgba(245,250,255,.94),rgba(226,240,255,.84));border-right:1px solid rgba(211,222,238,.86);box-shadow:16px 0 44px rgba(29,78,216,.05);overflow:auto;scrollbar-width:thin}.app-sidebar::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 10% 8%,rgba(37,99,235,.18),transparent 24%),radial-gradient(circle at 92% 44%,rgba(186,210,255,.28),transparent 32%);pointer-events:none}.app-sidebar>*{position:relative;z-index:1}.sidebar-brand{display:flex;align-items:center;gap:14px;padding:0 10px}.brand-icon{width:49px;height:49px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(135deg,#dceaff,#85b6ff);box-shadow:0 13px 24px rgba(36,104,242,.22)}.brand-icon svg,.compose-main svg,.searchbox svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.85;stroke-linecap:round;stroke-linejoin:round}.brand-icon svg{color:#0b60e5}.sidebar-brand strong{display:block;font-size:17px;letter-spacing:-.02em}.sidebar-brand span{display:block;margin-top:3px;color:#475467;font-size:13px}.sidebar-close{margin-left:auto;background:rgba(255,255,255,.62)}
.sidebar-hero{height:124px;margin:20px -18px 14px;position:relative;overflow:hidden;background:linear-gradient(#b7dcff 0%,#eef7ff 46%,#9fc9ef 48%,#e7f3ff 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 18px 42px rgba(24,39,75,.08)}.hero-sky{position:absolute;inset:0;background:radial-gradient(circle at 22% 20%,rgba(255,255,255,.96) 0 12%,transparent 14%),linear-gradient(180deg,rgba(112,169,231,.28),transparent 50%)}.hero-mountains{position:absolute;left:-10%;right:-10%;bottom:40px;height:58px;clip-path:polygon(0 100%,13% 54%,23% 82%,37% 18%,48% 72%,61% 31%,73% 81%,86% 40%,100% 100%)}.hero-mountains-back{background:linear-gradient(180deg,#8aa8c6,#516c8e);opacity:.88}.hero-mountains-front{bottom:33px;height:46px;background:linear-gradient(180deg,#e9edf3 0 16%,#48657d 17% 100%);opacity:.92;transform:translateX(14px)}.hero-lake{position:absolute;left:0;right:0;bottom:0;height:46px;background:linear-gradient(180deg,rgba(127,174,211,.58),rgba(247,251,255,.95));backdrop-filter:blur(1px)}
.compose-main{width:100%;height:44px;border-radius:9px;font-weight:800;display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:11px}.compose-main svg{width:20px;height:20px}.folder-nav,.account-block{display:grid;gap:6px}.folder-link,.account-filter{appearance:none;border:0;background:transparent;color:#243149;text-align:left;border-radius:9px;padding:10px 14px;min-height:42px;cursor:pointer;width:100%;display:grid;align-items:center;transition:background .18s ease,color .18s ease,box-shadow .18s ease,transform .18s ease}.folder-link{grid-template-columns:26px 1fr auto;gap:10px;font-weight:650}.folder-link:hover,.account-filter:hover{background:rgba(255,255,255,.65);box-shadow:0 8px 20px rgba(24,39,75,.05)}.folder-link.active{background:rgba(209,229,255,.84);color:#075fe7;box-shadow:inset 0 0 0 1px rgba(36,104,242,.06)}.folder-icon{width:20px;height:20px;display:grid;place-items:center;color:#344054}.folder-icon::before{font-size:19px;line-height:1}.folder-icon-inbox::before{content:"▱"}.folder-icon-send::before{content:"↗"}.folder-icon-draft::before{content:"◴"}.folder-icon-shield::before{content:"♙"}.folder-icon-trash::before{content:"♜"}.folder-icon-archive::before{content:"▤"}.folder-icon-star::before{content:"☆"}.folder-link small{min-width:20px;min-height:20px;display:grid;place-items:center;border-radius:999px;color:#075fe7;background:rgba(219,234,254,.95);font-size:12px;font-weight:800}.folder-link small:empty{display:none}.folder-link-static{opacity:.98}.section-title{margin:12px 14px 6px;display:flex;justify-content:space-between;align-items:center;color:#475467;font-weight:740;font-size:14px}.section-title a{font-size:22px;color:#475467;line-height:1}.account-filter{position:relative;grid-template-columns:18px 1fr;gap:8px;padding:10px 12px}.account-filter strong{font-size:14px}.account-filter span,.account-filter em{grid-column:2}.account-filter span{font-size:12px;color:#667085;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.account-filter em{justify-self:start;font-style:normal;margin-top:4px;font-size:11px;border-radius:999px;padding:3px 7px;background:#eef4ff;color:#175cd3}.account-filter.active{background:rgba(255,255,255,.72);box-shadow:0 10px 24px rgba(24,39,75,.07)}.account-led{width:9px;height:9px;border-radius:50%;background:#94a3b8;box-shadow:0 0 0 4px rgba(148,163,184,.13);margin-top:5px}.account-led.online,.account-filter.active .account-led{background:var(--green);box-shadow:0 0 0 4px rgba(34,197,94,.14)}.sidebar-user-card{margin-top:auto;display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:10px;padding:14px;border:1px solid rgba(208,224,246,.75);border-radius:11px;background:linear-gradient(135deg,rgba(203,226,255,.92),rgba(232,243,255,.82));box-shadow:0 18px 36px rgba(36,104,242,.09)}.user-avatar,.top-avatar span,.sender-avatar{display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,#e2e7ff,#bfc9ff);color:#101828;font-weight:800}.user-avatar{width:41px;height:41px}.user-meta{min-width:0}.user-meta strong,.user-meta span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-meta strong{font-size:14px}.user-meta span{font-size:12px;color:#344054}.sidebar-user-card .icon-btn{width:34px;height:34px;min-width:34px;min-height:34px;background:transparent;border:0}.connection-state{grid-column:1/-1;display:flex;align-items:center;gap:8px;font-size:13px;color:#155724}.connection-state span{width:11px;height:11px;border-radius:50%;background:var(--green)}.sidebar-bottom{display:flex;align-items:center;justify-content:space-between;padding:2px 6px 0}.sidebar-bottom form{margin:0}.sidebar-tool{width:42px;height:42px;border:0;background:transparent;border-radius:14px;color:#344054;display:grid;place-items:center;font-size:22px;cursor:pointer}.sidebar-tool:hover{background:rgba(255,255,255,.6)}
.mail-main{flex:1;min-width:0;display:flex;flex-direction:column;background:rgba(255,255,255,.58)}.mail-toolbar{height:var(--topbar-h);display:flex;align-items:center;gap:10px;padding:24px 24px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.72);backdrop-filter:blur(18px)}.searchbox{width:min(410px,48vw);height:44px;display:flex;align-items:center;gap:12px;border:1px solid var(--line-strong);border-radius:8px;background:rgba(255,255,255,.94);padding:0 14px;box-shadow:0 6px 16px rgba(24,39,75,.04)}.searchbox svg{width:20px;height:20px;color:#667085}.searchbox input{border:0!important;box-shadow:none!important;background:transparent!important;border-radius:0;padding:0;height:100%;font-size:14px}.toolbar-square,.toolbar-icon,.top-avatar{height:44px;min-width:44px;border:1px solid var(--line);border-radius:8px;background:rgba(255,255,255,.82);display:grid;place-items:center;cursor:pointer;color:#344054;transition:.18s ease}.toolbar-square:hover,.toolbar-icon:hover,.top-avatar:hover{background:#fff;border-color:#cbd8ec;box-shadow:0 8px 18px rgba(24,39,75,.08);transform:translateY(-1px)}.toolbar-square span{width:18px;height:18px;position:relative;display:block}.toolbar-square span::before,.toolbar-square span::after{content:"";position:absolute;left:3px;right:3px;height:2px;border-radius:999px;background:#344054}.toolbar-square span::before{top:5px}.toolbar-square span::after{top:11px;width:8px;left:7px}.toolbar-spacer{flex:1}.toolbar-icon{border:0;background:transparent;border-radius:14px;font-size:22px;text-decoration:none}.toolbar-icon.is-loading{animation:mymailsSpin .9s linear infinite;color:var(--blue)}@keyframes mymailsSpin{to{transform:rotate(360deg)}}.top-avatar{border:0;background:transparent;position:relative;padding:0}.top-avatar span{width:45px;height:45px}.top-avatar i{position:absolute;right:3px;bottom:2px;width:11px;height:11px;border-radius:50%;background:var(--green);border:2px solid #fff}
.mail-actionbar{height:var(--actionbar-h);display:grid;grid-template-columns:414px auto 1fr;align-items:center;border-bottom:1px solid var(--line);background:rgba(255,255,255,.62)}.actionbar-title{display:flex;align-items:center;gap:18px;padding:0 28px;border-right:1px solid var(--line);height:100%}.actionbar-title h2{margin:0;font-size:18px;letter-spacing:-.03em}.actionbar-title span{color:#075fe7;font-weight:650;font-size:14px}.sort-button{height:100%;padding:0 18px;border:0;background:transparent;border-right:1px solid var(--line);font-weight:650;color:#344054;cursor:pointer}.actionbar-actions{display:flex;align-items:center;gap:22px;padding:0 28px}.actionbar-actions button{border:0;background:transparent;border-radius:12px;width:40px;height:40px;display:grid;place-items:center;color:#344054;font-size:21px;cursor:pointer}.actionbar-actions button:hover{background:#f3f7ff;color:var(--blue)}
.mail-workspace{flex:1;min-height:0;display:grid;grid-template-columns:414px minmax(0,1fr)}.message-list-panel{min-width:0;overflow:hidden;border-right:1px solid var(--line);background:rgba(255,255,255,.42)}.message-list{height:100%;overflow:auto;scrollbar-width:thin}.message-row{position:relative;display:grid;grid-template-columns:1fr auto;gap:14px;padding:19px 25px 19px 26px;border-bottom:1px solid var(--line);cursor:pointer;background:rgba(255,255,255,.45);transition:background .16s ease,transform .18s ease,opacity .18s ease,box-shadow .18s ease}.message-row:hover{background:rgba(249,252,255,.96)}.message-row.active{background:linear-gradient(90deg,rgba(232,244,255,.94),rgba(255,255,255,.68));box-shadow:inset -2px 0 0 var(--blue)}.message-row.unread::before{content:"";position:absolute;left:23px;top:28px;width:11px;height:11px;border-radius:50%;background:#2f7cf6}.message-row.unread{padding-left:47px}.message-row .sender{font-weight:820;font-size:15px;color:#101828;margin-bottom:7px}.message-row .subject{font-weight:760;font-size:14px;color:#101828;margin-bottom:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.message-row .preview{color:#4b5565;line-height:1.45;font-size:14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.message-row .date{font-size:13px;color:#475467;white-space:nowrap}.message-row.active .date{color:var(--blue)}.message-row .badges{text-align:right;margin-top:24px;color:#344054}.reader-panel{position:relative;min-width:0;overflow:hidden;background:rgba(255,255,255,.5)}.reader{height:100%;display:flex;flex-direction:column;overflow:auto;padding:34px 24px 24px 44px}.reader-card{width:min(920px,100%);min-height:0;margin:0;display:flex;flex-direction:column}.reader-title-row{display:flex;align-items:center;gap:16px;margin-bottom:36px}.reader-title-row h1{margin:0;flex:1;font-size:25px;line-height:1.25;letter-spacing:-.035em}.reader-folder-pill{padding:7px 16px;border-radius:9px;background:#dbeafe;color:#075fe7;font-weight:750}.reader-star{width:44px;height:44px;border:0;background:transparent;border-radius:50%;font-size:26px;color:#344054;cursor:pointer}.reader-star:hover{background:#f4f7ff;color:var(--blue)}.reader-head{display:grid;grid-template-columns:48px minmax(0,1fr) auto auto;gap:16px;align-items:start;margin-bottom:28px}.sender-avatar{width:48px;height:48px}.mail-meta{min-width:0;color:#475467;line-height:1.45}.mail-meta .sender-line{color:#101828;font-size:15px}.mail-meta .sender-line strong{font-weight:820}.mail-meta .sender-line span,.mail-meta div span{color:#667085}.reader-date{color:#475467;font-size:14px;white-space:nowrap;margin-top:9px}.reader-actions{display:flex;align-items:center;gap:6px}.reader-icon-btn{width:38px;height:38px;border:0;background:transparent;border-radius:50%;display:grid;place-items:center;font-size:20px;color:#344054;cursor:pointer;text-decoration:none}.reader-icon-btn:hover{background:#f3f7ff;color:var(--blue)}.reader-body{font-size:17px;line-height:1.7;color:#1d2939;max-width:760px}.reader-body p{margin:0 0 18px}.reader-body a{color:var(--blue)}.reader-body img{max-width:100%;height:auto;border-radius:12px}.attachment-list{display:flex;flex-wrap:wrap;gap:12px;margin:8px 0 26px}.attachment-pill{display:grid;grid-template-columns:auto 1fr;gap:8px 11px;align-items:center;width:min(360px,100%);padding:14px 16px;border:1px solid var(--line-strong);border-radius:9px;background:rgba(255,255,255,.88);color:#172033;box-shadow:0 8px 18px rgba(24,39,75,.05)}.attachment-pill small{grid-column:2;color:#475467}.empty-reader{height:100%;display:grid;place-items:center;align-content:center;text-align:center;color:#667085;padding:32px}.empty-icon{width:72px;height:72px;border-radius:22px;background:#eaf2ff;display:grid;place-items:center;margin:auto;font-size:34px}.empty-reader h2{color:#101828;margin-bottom:4px}.quick-reply{margin-top:auto;width:min(100%,700px);display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:10px;border:1px solid var(--line-strong);border-radius:9px;background:#fff;padding:10px 12px;box-shadow:0 10px 26px rgba(24,39,75,.05)}.quick-reply-input{color:#667085}.quick-reply-tools{display:flex;gap:13px;color:#667085}.quick-reply button{border:0;background:transparent;color:var(--blue);font-size:28px;cursor:pointer}
.context-menu{position:fixed;z-index:9999;display:none;min-width:235px;padding:8px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.95);box-shadow:var(--shadow);backdrop-filter:blur(16px)}.context-menu.open{display:grid}.context-menu button{border:0;background:transparent;border-radius:12px;padding:11px 12px;text-align:left;cursor:pointer}.context-menu button:hover{background:#f3f7ff;color:var(--blue)}
.compose-dialog{width:min(980px,calc(100vw - 24px));border:0;border-radius:24px;padding:0;box-shadow:var(--shadow);background:#fff}.compose-dialog::backdrop{background:rgba(15,23,42,.42);backdrop-filter:blur(4px)}.compose-head,.compose-foot{display:flex;align-items:center;gap:12px;justify-content:space-between;padding:15px 18px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#fff,#fbfdff)}.compose-head{border-radius:24px 24px 0 0}.compose-foot{border-top:1px solid var(--line);border-bottom:0;border-radius:0 0 24px 24px}.compose-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:16px 18px}.compose-grid label{font-size:13px;font-weight:760;color:#344054}.compose-dialog textarea{min-height:360px}.file-pill{border:1px dashed var(--line-strong);border-radius:999px;padding:9px 14px;cursor:pointer;background:#fbfdff}.file-pill input{display:none}#composeStatus{margin-right:auto;color:#667085}

/* Settings */
.settings-shell{min-height:100vh;display:grid;grid-template-columns:300px 1fr;background:#f4f8ff}.settings-sidebar{position:sticky;top:0;height:100vh;padding:30px;background:linear-gradient(180deg,rgba(245,250,255,.94),rgba(226,240,255,.85));border-right:1px solid var(--line);color:#101828}.settings-sidebar h1{font-size:30px;letter-spacing:-.04em}.settings-sidebar p{color:#667085;line-height:1.55}.back-link{display:inline-flex;align-items:center;gap:6px;margin-bottom:20px;color:#075fe7;font-weight:740}.settings-main{padding:28px;display:grid;gap:22px;align-content:start;overflow:auto}.settings-card{background:rgba(255,255,255,.82);border:1px solid rgba(217,227,242,.92);border-radius:28px;padding:24px;box-shadow:var(--shadow-soft);backdrop-filter:blur(14px)}.settings-card h2{margin:0 0 8px;font-size:22px;letter-spacing:-.03em}.form-grid.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:16px 0}.switch-row{display:grid;gap:10px;margin:16px 0;padding:14px;border:1px solid var(--line);border-radius:18px;background:#fbfdff}.switch-row label{display:flex;align-items:center;gap:9px;font-weight:650;color:#344054}.switch-row input[type=checkbox]{width:18px;height:18px;accent-color:var(--blue)}.switch-row input[type=number]{max-width:100px;margin-left:8px}.signature-field{min-height:140px}.form-actions{display:flex;gap:10px;align-items:center;justify-content:flex-end;margin-top:14px}.test-status{margin-right:auto;color:#667085}.account-details{border:1px solid var(--line);border-radius:20px;padding:15px;margin:13px 0;background:#fff}.account-details summary{cursor:pointer;display:flex;gap:10px;align-items:center;flex-wrap:wrap}.account-details summary span{color:#667085}.status-chip,.danger-chip{font-style:normal;font-size:12px;border-radius:999px;padding:4px 9px;background:#e2e8f0;color:#344054}.status-chip.success{background:#dcfce7;color:#166534}.status-chip.error,.danger-chip{background:#fee2e2;color:#991b1b}.status-chip.warning{background:#fef3c7;color:#92400e}.delete-form{margin-top:12px}

@media(max-width:1100px){:root{--sidebar-w:286px}.mail-actionbar{grid-template-columns:360px auto 1fr}.mail-workspace{grid-template-columns:360px minmax(0,1fr)}.actionbar-actions{gap:10px;padding:0 16px}.reader{padding-left:28px}.searchbox{width:min(380px,45vw)}}
@media(max-width:900px){body.app-body{overflow:hidden}.mobile-only{display:inline-grid!important}.mail-app{border-radius:0;border:0}.app-sidebar{position:fixed;inset:0 auto 0 0;z-index:60;transform:translateX(-102%);transition:transform .24s cubic-bezier(.22,.61,.36,1);width:min(88vw,330px);min-width:0}.app-sidebar.open{transform:translateX(0)}.mail-toolbar{height:70px;padding:12px 14px}.searchbox{width:auto;flex:1;height:42px}.toolbar-square,.toolbar-icon:not(#syncBtn){display:none}.top-avatar span{width:40px;height:40px}.mail-actionbar{height:58px;grid-template-columns:1fr auto}.actionbar-title{padding:0 16px;border-right:0}.actionbar-title h2{font-size:18px}.sort-button{display:none}.actionbar-actions{display:none}.mail-workspace{grid-template-columns:1fr}.message-list-panel{border-right:0}.message-row{padding:17px 16px}.message-row.unread{padding-left:38px}.message-row.unread::before{left:16px}.reader-panel{position:fixed;inset:70px 0 0 0;z-index:25;transform:translateX(102%);transition:transform .24s cubic-bezier(.22,.61,.36,1);background:#fff}.reader-panel.open{transform:translateX(0)}.reader{padding:18px 16px}.reader-title-row{gap:10px;margin-bottom:20px}.reader-title-row h1{font-size:22px}.reader-folder-pill,.reader-star{display:none}.reader-head{grid-template-columns:42px 1fr;gap:12px}.sender-avatar{width:42px;height:42px}.reader-date,.reader-actions{grid-column:2}.reader-date{margin-top:0}.reader-body{font-size:16px}.quick-reply{width:100%}.compose-dialog{height:96vh;width:calc(100vw - 14px);border-radius:20px}.compose-grid,.form-grid.two{grid-template-columns:1fr}.settings-shell{grid-template-columns:1fr}.settings-sidebar{position:relative;height:auto}.settings-main{padding:16px}.auth-shell{grid-template-columns:1fr}.auth-brand{display:none}.auth-card{border-radius:26px}.sidebar-hero{height:108px}}


/* Lokaler TinyMCE-kompatibler Editor ohne Cloud/API-Key */
.mce-local{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;margin-top:7px;box-shadow:0 8px 24px rgba(15,23,42,.04)}
.compose-dialog .mce-local{border-left:0;border-right:0;border-radius:0;margin-top:0;box-shadow:none}
.mce-local-toolbar{display:flex;align-items:center;gap:5px;flex-wrap:wrap;padding:8px;background:#f8fafc;border-bottom:1px solid var(--line)}
.mce-local-btn,.mce-local-select{border:1px solid #dbe4ef;background:#fff;color:#172033;border-radius:9px;min-height:34px;padding:6px 8px;font-size:13px;cursor:pointer}
.mce-local-btn:hover,.mce-local-select:hover{background:#eef6ff;border-color:#bfdbfe}
.mce-local-sep{display:inline-block;width:1px;height:26px;background:#dbe4ef;margin:0 3px}
.mce-local-color{display:inline-flex;align-items:center;gap:5px;border:1px solid #dbe4ef;background:#fff;border-radius:9px;padding:4px 7px;font-size:12px;color:#475569;min-height:34px;cursor:pointer}
.mce-local-color input{width:24px;height:22px;border:0;background:transparent;padding:0;cursor:pointer}
.mce-local-editable{padding:18px;line-height:1.6;overflow:auto;outline:none;background:#fff;color:#172033;font-family:Arial,Helvetica,sans-serif;font-size:15px}
.mce-local-editable:focus{box-shadow:inset 0 0 0 3px rgba(37,99,235,.12)}
.mce-local-editable img{max-width:100%;height:auto}
.mce-local-editable blockquote{border-left:3px solid #d7dee9;margin:18px 0;padding:8px 0 8px 14px;color:#56657a;background:#f8fafc}
.mce-local-editable table{border-collapse:collapse;width:100%}.mce-local-editable td,.mce-local-editable th{border:1px solid #d7dee9;padding:8px}
.mce-local-editable.is-code-mode{white-space:pre-wrap;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;font-size:13px;background:#0f172a;color:#dbeafe}
.mce-local-status{display:flex;justify-content:space-between;gap:10px;border-top:1px solid var(--line);background:#f8fafc;color:#64748b;font-size:12px;padding:7px 10px}
.mce-local.is-fullscreen{position:fixed!important;inset:12px!important;z-index:2147483647!important;border-radius:16px;display:flex;flex-direction:column;box-shadow:0 24px 80px rgba(15,23,42,.28)}
.mce-local.is-fullscreen .mce-local-editable{flex:1;max-height:none!important;min-height:0!important}
body.mce-local-fullscreen-open{overflow:hidden}
.mce-local-preview{width:min(860px,calc(100vw - 24px));border:0;border-radius:20px;padding:0;box-shadow:var(--shadow)}
.mce-local-preview::backdrop{background:rgba(15,23,42,.45)}
.mce-local-preview-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid var(--line);background:#fff}
.mce-local-preview-head button{border:1px solid var(--line);background:#fff;border-radius:10px;padding:6px 10px;cursor:pointer}
.mce-local-preview-body{padding:22px;line-height:1.6;background:#fff;max-height:72vh;overflow:auto}
.mce-local-preview-body img{max-width:100%;height:auto}
@media(max-width:900px){.mce-local-toolbar{gap:4px;padding:7px}.mce-local-btn,.mce-local-select{font-size:12px;min-height:32px;padding:5px 7px}.mce-local-color span{display:none}.mce-local-editable{padding:14px}.mce-local-status{font-size:11px}}

/* MyMails Editor UI polish + Bild-Upload */
.mce-local{border-radius:18px;border-color:#d6e0ee;background:#fff;box-shadow:0 14px 34px rgba(15,23,42,.08);position:relative}
.compose-dialog .mce-local{box-shadow:none;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.mce-local-toolbar{gap:8px;padding:10px;background:linear-gradient(180deg,#ffffff,#f6f9fd);align-items:stretch}
.mce-local-group{display:inline-flex;align-items:center;gap:4px;padding:3px;border:1px solid #e6edf6;border-radius:13px;background:rgba(255,255,255,.82);box-shadow:0 2px 8px rgba(15,23,42,.035)}
.mce-local-btn,.mce-local-select{border-color:transparent;background:transparent;border-radius:10px;min-height:34px;color:#1e293b;transition:background .16s ease, color .16s ease, transform .16s ease, box-shadow .16s ease}
.mce-local-btn:hover,.mce-local-select:hover{background:#eaf2ff;border-color:transparent;color:#1d4ed8;transform:translateY(-1px)}
.mce-local-btn:active{transform:translateY(0)}
.mce-local-primary{background:#2563eb!important;color:#fff!important;box-shadow:0 8px 18px rgba(37,99,235,.22)}
.mce-local-primary:hover{background:#1d4ed8!important;color:#fff!important}
.mce-local-select{background:#fff;border:1px solid #e1e9f5;min-width:108px}
.mce-local-color{border-color:transparent;background:transparent;border-radius:10px;min-height:34px;padding:5px 8px;color:#475569;transition:.16s ease}
.mce-local-color:hover{background:#eaf2ff;color:#1d4ed8}
.mce-local-color input{border-radius:8px;overflow:hidden}
.mce-local-editable{padding:22px;background:linear-gradient(180deg,#fff,#fbfdff);font-size:15px;line-height:1.65;scrollbar-width:thin}
.mce-local-editable:focus{box-shadow:inset 0 0 0 3px rgba(37,99,235,.10)}
.mce-local-editable figure.mymails-image{margin:14px 0;padding:10px;border:1px solid #e2e8f0;border-radius:16px;background:#f8fafc;display:inline-block;max-width:100%}
.mce-local-editable figure.mymails-image img{display:block;border-radius:12px;box-shadow:0 8px 18px rgba(15,23,42,.08)}
.mce-local-editable figure.mymails-image figcaption{font-size:12px;color:#64748b;margin-top:7px;text-align:center}
.mce-local-status{background:#fbfdff;color:#64748b;padding:8px 12px}
.mce-local-status .is-error{color:#dc2626;font-weight:700}
.mce-local-hidden-file{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px}
.mce-local.is-dragover::after,.mce-local.is-uploading::after{content:'Bild hier ablegen oder Upload läuft …';position:absolute;inset:54px 14px 38px;display:grid;place-items:center;border:2px dashed #93c5fd;border-radius:18px;background:rgba(239,246,255,.88);color:#1d4ed8;font-weight:800;z-index:5;pointer-events:none;backdrop-filter:blur(2px)}
.mce-local.is-uploading::after{content:'Bild wird geprüft und eingefügt …'}
.mce-local-preview{border-radius:24px;overflow:hidden}
.mce-local-preview-head{background:linear-gradient(180deg,#fff,#f8fafc)}
.mce-local-preview-body{background:#fff}
@media(max-width:900px){.mce-local-toolbar{gap:6px}.mce-local-group{max-width:100%;overflow:auto}.mce-local-select{min-width:92px}.mce-local-btn,.mce-local-select{white-space:nowrap}.mce-local-editable{padding:16px}.mce-local.is-dragover::after,.mce-local.is-uploading::after{inset:48px 10px 34px}}

/* MyMails v1.1 - kompakter Outlook-Mockup-Style
   Ziel: mehr echte WebMail-Dichte, weniger große Flächen, näher am gelieferten Mockup. */
:root{
  --sidebar-w:278px;
  --topbar-h:72px;
  --actionbar-h:54px;
  --radius:18px;
  --shadow:0 18px 48px rgba(24,39,75,.11);
  --shadow-soft:0 10px 24px rgba(24,39,75,.07);
}
body.app-body{background:linear-gradient(135deg,#f7fbff 0%,#eef5ff 100%)}
.mail-app{background:#fff;border-color:#dfe7f3;box-shadow:inset 0 0 0 1px rgba(255,255,255,.7)}
.app-sidebar{gap:8px;padding:18px 14px 12px;background:linear-gradient(180deg,rgba(247,251,255,.96),rgba(230,242,255,.88));box-shadow:10px 0 30px rgba(29,78,216,.045)}
.sidebar-brand{gap:11px;padding:0 4px}.brand-icon{width:42px;height:42px;border-radius:13px}.brand-icon svg{width:21px;height:21px}.sidebar-brand strong{font-size:16px}.sidebar-brand span{font-size:12px;margin-top:1px}
.sidebar-hero{height:86px;margin:10px -14px 8px}.hero-mountains{bottom:28px;height:42px}.hero-mountains-front{bottom:23px;height:35px}.hero-lake{height:31px}
.compose-main{height:40px;margin:4px 0 8px;border-radius:9px;font-size:14px;gap:8px}.compose-main svg{width:18px;height:18px}
.folder-nav,.account-block{gap:3px}.folder-link{min-height:35px;padding:7px 11px;grid-template-columns:23px 1fr auto;gap:8px;border-radius:8px;font-size:14px}.folder-icon{width:18px;height:18px}.folder-icon::before{font-size:17px}.folder-link small{min-width:18px;min-height:18px;font-size:11px}.section-title{margin:9px 11px 5px;font-size:12px;letter-spacing:.02em;text-transform:uppercase}.section-title a{font-size:18px}
.account-filter{min-height:36px;padding:8px 10px;border-radius:8px;grid-template-columns:15px 1fr}.account-filter strong{font-size:13px}.account-filter span{font-size:11px}.account-filter em{font-size:10px;padding:2px 6px;margin-top:3px}.account-led{width:8px;height:8px;margin-top:4px}
.sidebar-user-card{grid-template-columns:38px 1fr auto;gap:8px;padding:10px;border-radius:10px;margin-top:auto}.user-avatar{width:36px;height:36px;font-size:13px}.user-meta strong{font-size:13px}.user-meta span{font-size:11px}.sidebar-user-card .icon-btn{width:30px;height:30px;min-width:30px;min-height:30px}.connection-state{font-size:12px}.connection-state span{width:9px;height:9px}.sidebar-bottom{padding-top:0}.sidebar-tool{width:36px;height:36px;border-radius:11px;font-size:18px}
.mail-main{background:rgba(255,255,255,.78)}.mail-toolbar{height:var(--topbar-h);gap:8px;padding:16px 22px;background:rgba(255,255,255,.86)}.searchbox{height:40px;width:min(430px,46vw);border-radius:8px;padding:0 12px;gap:10px}.searchbox svg{width:18px;height:18px}.searchbox input{font-size:14px}.toolbar-square,.toolbar-icon,.top-avatar{height:38px;min-width:38px;border-radius:9px}.toolbar-icon{font-size:18px}.top-avatar span{width:38px;height:38px;font-size:13px}.top-avatar i{right:1px;bottom:1px;width:10px;height:10px}
.mail-actionbar{height:var(--actionbar-h);grid-template-columns:384px auto 1fr;background:rgba(255,255,255,.82)}.actionbar-title{gap:12px;padding:0 20px}.actionbar-title h2{font-size:17px}.actionbar-title span{font-size:13px}.sort-button{padding:0 14px;font-size:13px}.actionbar-actions{gap:12px;padding:0 20px}.actionbar-actions button{width:34px;height:34px;border-radius:10px;font-size:18px}
.mail-workspace{grid-template-columns:384px minmax(0,1fr)}.message-list-panel{background:rgba(255,255,255,.6)}.message-row{gap:10px;padding:12px 18px 12px 18px;min-height:78px;background:rgba(255,255,255,.72)}.message-row.active{background:linear-gradient(90deg,rgba(231,243,255,.96),rgba(255,255,255,.76));box-shadow:inset -2px 0 0 var(--blue)}.message-row.unread{padding-left:38px}.message-row.unread::before{left:17px;top:22px;width:9px;height:9px}.message-row .sender{font-size:14px;margin-bottom:4px;line-height:1.2}.message-row .subject{font-size:13.5px;margin-bottom:3px;line-height:1.25}.message-row .preview{font-size:13px;line-height:1.34;-webkit-line-clamp:2}.message-row .date{font-size:12px}.message-row .badges{margin-top:16px;font-size:14px}
.reader-panel{background:#fff}.reader{padding:26px 22px 16px 34px}.reader-card{width:min(860px,100%)}.reader-title-row{gap:12px;margin-bottom:22px}.reader-title-row h1{font-size:22px;line-height:1.25}.reader-folder-pill{padding:6px 13px;border-radius:8px;font-size:13px}.reader-star{width:36px;height:36px;font-size:22px}.reader-head{grid-template-columns:42px minmax(0,1fr) auto auto;gap:13px;margin-bottom:20px}.sender-avatar{width:42px;height:42px;font-size:14px}.mail-meta{font-size:13.5px;line-height:1.42}.mail-meta .sender-line{font-size:14px}.reader-date{font-size:13px;margin-top:6px}.reader-actions{gap:4px}.reader-icon-btn{width:34px;height:34px;font-size:18px}.reader-body{font-size:15.5px;line-height:1.62;max-width:760px}.reader-body p{margin:0 0 14px}.attachment-list{gap:9px;margin:4px 0 20px}.attachment-pill{width:min(330px,100%);padding:10px 12px;border-radius:8px;font-size:13px;box-shadow:0 6px 14px rgba(24,39,75,.04)}.attachment-pill small{font-size:12px}.quick-reply{width:min(100%,690px);padding:8px 10px;border-radius:8px;gap:8px;box-shadow:0 6px 16px rgba(24,39,75,.04)}.quick-reply-input{font-size:13.5px}.quick-reply-tools{gap:10px;font-size:15px}.quick-reply button{font-size:24px}.empty-icon{width:58px;height:58px;border-radius:18px;font-size:28px}.empty-reader h2{font-size:20px}
.context-menu{min-width:220px;border-radius:14px;padding:6px}.context-menu button{border-radius:10px;padding:9px 10px;font-size:13px}
.compose-dialog{width:min(920px,calc(100vw - 24px));border-radius:18px}.compose-head,.compose-foot{padding:12px 15px}.compose-head{border-radius:18px 18px 0 0}.compose-foot{border-radius:0 0 18px 18px}.compose-grid{gap:10px;padding:12px 15px}.compose-grid label{font-size:12.5px}.compose-dialog textarea{min-height:320px}.file-pill{padding:7px 12px;font-size:13px}

@media(max-width:1280px){
  :root{--sidebar-w:260px}.mail-actionbar{grid-template-columns:356px auto 1fr}.mail-workspace{grid-template-columns:356px minmax(0,1fr)}.reader{padding-left:26px}.actionbar-actions{gap:8px;padding:0 14px}.actionbar-actions button{width:32px}.searchbox{width:min(360px,42vw)}
}
@media(max-width:1100px){
  :root{--sidebar-w:248px}.mail-actionbar{grid-template-columns:330px auto 1fr}.mail-workspace{grid-template-columns:330px minmax(0,1fr)}.sidebar-hero{height:72px}.actionbar-actions button:nth-child(n+5){display:none}.reader-title-row h1{font-size:20px}.reader-body{font-size:15px}
}
@media(max-width:900px){
  :root{--topbar-h:62px;--actionbar-h:50px}.app-sidebar{padding:16px 14px 12px;width:min(86vw,300px)}.mail-toolbar{height:62px;padding:10px 12px}.searchbox{height:38px}.top-avatar span{width:36px;height:36px}.mail-actionbar{height:50px}.actionbar-title{padding:0 14px}.actionbar-title h2{font-size:16px}.message-row{min-height:72px;padding:11px 14px}.message-row.unread{padding-left:34px}.message-row.unread::before{left:14px;top:20px}.reader-panel{inset:62px 0 0 0}.reader{padding:14px 14px 12px}.reader-title-row{margin-bottom:15px}.reader-title-row h1{font-size:19px}.reader-head{grid-template-columns:38px 1fr;gap:10px;margin-bottom:16px}.sender-avatar{width:38px;height:38px}.reader-date,.reader-actions{grid-column:2}.reader-body{font-size:15px}.sidebar-hero{height:72px}.compose-dialog{height:96vh;width:calc(100vw - 12px);border-radius:16px}
}

/* MyMails v1.2 - kompaktere Settings/POP3-Formulare + Scroll-Fix
   Fix: app-body nutzt overflow:hidden; deshalb bekommt die Settings-Seite einen eigenen 100vh-Scrollbereich. */
.settings-shell{
  height:100vh;
  min-height:0;
  overflow:hidden;
  grid-template-columns:230px minmax(0,1fr);
  background:linear-gradient(135deg,#f7fbff,#eef5ff);
}
.settings-sidebar{
  position:relative;
  height:100vh;
  min-height:0;
  overflow:auto;
  padding:18px 16px;
  background:linear-gradient(180deg,rgba(247,251,255,.96),rgba(230,242,255,.88));
  scrollbar-width:thin;
}
.settings-sidebar h1{
  margin:8px 0 6px;
  font-size:23px;
  letter-spacing:-.035em;
}
.settings-sidebar p{
  margin:0;
  font-size:13px;
  line-height:1.42;
}
.settings-sidebar .back-link{
  margin-bottom:10px;
  font-size:13px;
  font-weight:760;
}
.settings-main{
  height:100vh;
  min-height:0;
  overflow:auto;
  padding:14px;
  gap:12px;
  align-content:start;
  scrollbar-width:thin;
}
.settings-card{
  padding:14px;
  border-radius:18px;
  box-shadow:0 8px 20px rgba(24,39,75,.055);
}
.settings-card h2{
  margin:0 0 4px;
  font-size:18px;
  letter-spacing:-.025em;
}
.settings-card > .muted{
  margin:0 0 8px;
  font-size:12.5px;
  line-height:1.35;
}
.account-form{
  display:grid;
  gap:8px;
}
.settings-card .account-form label,
.settings-card .form-grid label{
  gap:4px;
  font-size:12.5px;
  line-height:1.18;
  font-weight:720;
}
.settings-card .form-grid.two{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:9px;
  margin:8px 0;
}
.settings-card .smtp-area{
  padding-top:8px;
  border-top:1px solid rgba(212,221,234,.7);
}
.settings-card .form-grid input,
.settings-card .form-grid select,
.settings-card .account-form textarea{
  min-height:35px;
  border-radius:9px;
  padding:.52rem .68rem;
  font-size:13px;
}
.settings-card .form-grid input[type=number]{
  padding-right:.35rem;
}
.settings-card .switch-row{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:7px 10px;
  margin:8px 0;
  padding:9px;
  border-radius:12px;
  background:rgba(248,251,255,.92);
}
.settings-card .switch-row label{
  gap:7px;
  min-height:28px;
  font-size:12.5px;
  font-weight:650;
  line-height:1.25;
}
.settings-card .switch-row input[type=checkbox]{
  width:15px;
  height:15px;
  flex:0 0 auto;
}
.settings-card .switch-row input[type=number]{
  width:72px;
  min-height:30px;
  margin-left:4px;
  border-radius:8px;
  padding:.35rem .45rem;
  font-size:12.5px;
}
.settings-card .signature-field{
  min-height:92px;
}
.settings-card .mce-local{
  border-radius:13px;
  box-shadow:0 6px 16px rgba(24,39,75,.045);
}
.settings-card .mce-local-toolbar{
  gap:4px;
  padding:7px;
  max-height:92px;
  overflow:auto;
}
.settings-card .mce-local-group{
  gap:2px;
  padding:2px;
  border-radius:10px;
}
.settings-card .mce-local-btn,
.settings-card .mce-local-select,
.settings-card .mce-local-color{
  min-height:29px;
  border-radius:8px;
  font-size:12px;
}
.settings-card .mce-local-select{
  min-width:86px;
}
.settings-card .mce-local-editable{
  min-height:112px!important;
  max-height:210px!important;
  padding:11px 12px;
  font-size:13.5px;
  line-height:1.5;
  overflow:auto;
}
.settings-card .mce-local-status{
  padding:5px 9px;
  font-size:11px;
}
.settings-card .form-actions{
  position:sticky;
  bottom:-14px;
  z-index:4;
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin:2px -4px -4px;
  padding:9px 4px 4px;
  border-top:1px solid rgba(212,221,234,.72);
  background:linear-gradient(180deg,rgba(255,255,255,.78),rgba(255,255,255,.96) 35%);
  backdrop-filter:blur(10px);
}
.settings-card .form-actions .btn{
  border-radius:9px;
  padding:.52rem .75rem;
  font-size:13px;
}
.settings-card .test-status{
  min-width:150px;
  margin-right:auto;
  font-size:12.5px;
  line-height:1.25;
}
.account-details{
  margin:9px 0;
  padding:10px;
  border-radius:14px;
}
.account-details summary{
  gap:7px;
  min-height:30px;
  font-size:13px;
}
.account-details summary strong{
  font-size:13.5px;
}
.account-details summary span{
  font-size:12.5px;
}
.status-chip,.danger-chip{
  font-size:10.5px;
  padding:3px 7px;
}
.delete-form{
  margin-top:8px;
}
.delete-form .btn{
  padding:.5rem .72rem;
  border-radius:9px;
  font-size:13px;
}

@media(max-width:1180px){
  .settings-shell{grid-template-columns:210px minmax(0,1fr)}
  .settings-card .form-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
  .settings-card .switch-row{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){
  .settings-shell{
    display:flex;
    flex-direction:column;
    height:100vh;
    overflow:hidden;
  }
  .settings-sidebar{
    height:auto;
    max-height:118px;
    flex:0 0 auto;
    padding:12px 14px;
    border-right:0;
    border-bottom:1px solid var(--line);
  }
  .settings-sidebar h1{font-size:20px;margin:4px 0}
  .settings-sidebar p{font-size:12px}
  .settings-main{
    flex:1 1 auto;
    height:auto;
    min-height:0;
    padding:10px;
  }
  .settings-card{padding:12px;border-radius:15px}
  .settings-card .form-grid.two,
  .settings-card .switch-row{grid-template-columns:1fr}
  .settings-card .mce-local-toolbar{max-height:112px}
  .settings-card .form-actions{bottom:-10px}
}

/* v1 global context + eigene Ordner + Konto-Badges */
.custom-folder-block{display:grid;gap:4px;margin-top:6px}.custom-folder-title{margin-top:9px}.section-add-btn{border:0;background:rgba(255,255,255,.55);color:#344054;width:25px;height:25px;border-radius:8px;display:grid;place-items:center;cursor:pointer;font-size:16px;line-height:1}.section-add-btn:hover{background:#fff;color:var(--blue)}.folder-icon-custom::before{content:"▣"}.custom-folder-link{position:relative}.custom-folder-link.active{background:rgba(235,244,255,.92);color:#075fe7;box-shadow:inset 0 0 0 1px rgba(36,104,242,.08)}.folder-mini-action{margin:2px 11px 4px;border:1px dashed rgba(102,112,133,.28);background:rgba(255,255,255,.44);color:#475467;border-radius:8px;padding:7px 9px;font-size:12.5px;font-weight:700;text-align:left;cursor:pointer}.folder-mini-action:hover{background:#fff;color:var(--blue);border-color:rgba(47,124,246,.25)}.message-main{min-width:0}.message-side{display:grid;justify-items:end;align-content:start;gap:7px}.sender-row{display:flex;align-items:center;gap:8px;min-width:0;margin-bottom:4px}.sender-row .sender{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-bottom:0}.mail-account-badge{max-width:120px;display:inline-flex;align-items:center;border-radius:999px;background:#edf4ff;color:#075fe7;border:1px solid rgba(47,124,246,.13);padding:2px 7px;font-size:10.5px;font-weight:800;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:0 0 auto}.message-row.active .mail-account-badge{background:#fff;color:#075fe7}.reader-account-line{display:flex;align-items:center;gap:4px;flex-wrap:wrap;margin-top:2px}.reader-account-line b{font-weight:780;color:#344054}.reader-account-line em{font-style:normal;color:#667085}.global-context-menu{gap:5px;max-height:min(76vh,520px);overflow:auto}.context-section{display:grid;gap:2px;padding:4px 0}.context-section+.context-section{border-top:1px solid rgba(208,224,246,.8);padding-top:7px}.context-caption{padding:3px 10px 4px;color:#667085;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}.context-menu button[disabled]{opacity:.38;cursor:not-allowed}.context-menu button[disabled]:hover{background:transparent;color:inherit}.context-folder-targets{display:grid;gap:2px}.context-empty{padding:7px 10px;color:#98a2b3;font-size:12px}.folder-dialog{width:min(420px,calc(100vw - 24px));border:0;border-radius:18px;padding:0;background:#fff;box-shadow:0 24px 70px rgba(16,24,40,.24)}.folder-dialog::backdrop{background:rgba(15,23,42,.26);backdrop-filter:blur(3px)}.folder-dialog form{display:grid;gap:14px;padding:16px}.folder-dialog .compose-head{margin:-16px -16px 0;padding:13px 16px;border-bottom:1px solid var(--line);background:#f8fbff}.folder-dialog-field{display:grid;gap:7px;font-size:13px;font-weight:750;color:#344054}.folder-dialog-field input{height:40px;border:1px solid var(--line-strong);border-radius:10px;padding:0 12px;font:inherit}.folder-dialog .compose-foot{margin-top:0;border-top:1px solid var(--line);padding-top:12px}#folderStatus{font-size:12.5px;color:#667085}.mail-actionbar .actionbar-title h2{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.context-menu{overscroll-behavior:contain}
@media(max-width:900px){.mail-account-badge{max-width:92px;font-size:10px;padding:2px 6px}.sender-row{gap:6px}.folder-mini-action{font-size:12px}.global-context-menu{min-width:min(280px,calc(100vw - 16px));border-radius:16px}.folder-dialog{border-radius:16px}.context-caption{font-size:10.5px}}

/* MyMails v1.5 - Drag & Drop + sichtbare UI-Fixes aus Live-Screenshot */
.mail-app{
  --sidebar-w:260px;
  --topbar-h:62px;
  --actionbar-h:50px;
}
.app-sidebar{
  gap:7px;
  padding:12px 12px 10px;
}
.sidebar-brand{
  padding:0 4px;
}
.sidebar-hero{
  height:58px!important;
  margin:6px -12px 8px!important;
}
.compose-main{
  height:38px;
  margin:4px 0 7px;
}
.folder-link{
  min-height:32px;
  padding:6px 10px;
  font-size:13px;
}
.custom-folder-block,
.account-block{
  flex:0 0 auto;
}
.custom-folder-list{
  max-height:122px;
  overflow:auto;
  scrollbar-width:thin;
}
.folder-mini-action{
  min-height:30px;
  padding:6px 10px;
  font-size:12px;
}
.section-title{
  margin:7px 9px 4px;
}
.account-block{
  gap:5px;
  overflow:visible;
}
.account-filter{
  min-height:48px!important;
  align-items:start;
  grid-template-columns:14px minmax(0,1fr)!important;
  gap:6px;
  padding:7px 9px!important;
  line-height:1.15;
}
.account-filter strong,
.account-filter span,
.account-filter em{
  min-width:0;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.account-filter strong{
  display:block;
  font-size:12.5px!important;
}
.account-filter span{
  font-size:10.5px!important;
}
.account-filter em{
  margin-top:2px!important;
  padding:2px 5px!important;
  font-size:9.5px!important;
}
.account-led{
  margin-top:3px!important;
}
.sidebar-user-card{
  margin-top:8px!important;
  padding:8px!important;
  grid-template-columns:34px minmax(0,1fr) 28px!important;
}
.user-avatar{
  width:32px!important;
  height:32px!important;
}
.connection-state{
  font-size:11.5px!important;
}
.sidebar-bottom{
  padding-top:2px;
}
.sidebar-tool{
  width:30px!important;
  height:30px!important;
  font-size:16px!important;
}
.mail-toolbar{
  padding:11px 22px!important;
}
.mail-actionbar{
  grid-template-columns:360px auto 1fr!important;
}
.mail-workspace{
  grid-template-columns:360px minmax(0,1fr)!important;
}
.actionbar-title{
  padding:0 18px!important;
}
.actionbar-title h2{
  font-size:16px!important;
}
.actionbar-title span{
  font-size:12px!important;
  white-space:nowrap;
}
.actionbar-actions{
  gap:8px!important;
  padding:0 15px!important;
}
.actionbar-actions button{
  width:31px!important;
  height:31px!important;
  font-size:16px!important;
}
.message-row{
  min-height:72px!important;
  padding:10px 14px 10px 16px!important;
}
.message-row.unread{
  padding-left:34px!important;
}
.message-row.unread::before{
  left:14px!important;
  top:21px!important;
  width:8px!important;
  height:8px!important;
}
.sender-row{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}
.sender-row .sender{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.mail-account-badge{
  flex:0 0 auto;
  max-width:118px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.message-side{
  max-width:92px;
  text-align:right;
}
.reader{
  padding:20px 22px 14px 28px!important;
}
.reader-card{
  width:min(920px,100%)!important;
}
.reader-title-row{
  margin-bottom:16px!important;
}
.reader-title-row h1{
  font-size:20px!important;
}
.reader-head{
  margin-bottom:18px!important;
}
.reader-body{
  width:min(920px,100%);
  max-width:920px!important;
  overflow:hidden;
}
.mail-html-frame{
  display:block;
  width:100%;
  min-height:260px;
  border:0;
  background:#fff;
}
.reader-account-line{
  display:flex;
  gap:5px;
  align-items:baseline;
  flex-wrap:wrap;
}
.quick-reply{
  width:min(100%,760px)!important;
}
.message-row[draggable="true"]{
  user-select:none;
}
.message-row.is-dragging{
  opacity:.5;
  transform:scale(.985);
  box-shadow:0 10px 20px rgba(24,39,75,.08);
}
.folder-link.drag-over{
  background:#dbeafe!important;
  color:#075fe7!important;
  box-shadow:inset 0 0 0 2px rgba(36,104,242,.28),0 10px 22px rgba(36,104,242,.12)!important;
  transform:translateX(2px);
}
.custom-folder-link.is-folder-dragging{
  opacity:.55;
  transform:scale(.985);
}
.custom-folder-link[draggable="true"]{
  cursor:grab;
}
.custom-folder-link[draggable="true"]:active{
  cursor:grabbing;
}
.folder-link.drag-over::after{
  content:'Hier ablegen';
  justify-self:end;
  grid-column:3;
  font-size:10px;
  font-weight:800;
  color:#075fe7;
  background:#fff;
  border-radius:999px;
  padding:2px 6px;
}
.context-empty{
  display:block;
  padding:7px 10px;
  font-size:12px;
  color:#667085;
}

@media(max-width:1280px){
  .mail-app{--sidebar-w:248px;}
  .mail-actionbar{grid-template-columns:330px auto 1fr!important;}
  .mail-workspace{grid-template-columns:330px minmax(0,1fr)!important;}
  .mail-account-badge{max-width:92px;}
}
@media(max-width:900px){
  .mail-actionbar,
  .mail-workspace{grid-template-columns:1fr!important;}
  .app-sidebar{padding:14px 12px 10px;}
  .custom-folder-list{max-height:160px;}
  .account-filter{min-height:48px!important;}
  .mail-toolbar{padding:10px 12px!important;}
  .reader{padding:14px!important;}
  .mail-html-frame{min-height:220px;}
}

/* MyMails v1.6 - Reader-Scroll, saubere Konto-Sidebar, User-Dropdown, App-Einstellungen */
.app-sidebar{
  overflow-x:hidden!important;
}
.account-block{
  min-height:0;
  display:flex!important;
  flex-direction:column;
  gap:5px!important;
  overflow:hidden!important;
}
.account-list{
  display:grid;
  gap:6px;
  max-height:205px;
  overflow:auto;
  padding:1px 2px 3px 0;
  scrollbar-width:thin;
}
.account-filter{
  position:relative!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 26px!important;
  align-items:center!important;
  min-height:42px!important;
  padding:0!important;
  border:1px solid rgba(206,219,238,.55)!important;
  border-radius:10px!important;
  background:rgba(255,255,255,.42)!important;
  box-shadow:none!important;
  overflow:hidden!important;
}
.account-filter:hover{
  background:rgba(255,255,255,.82)!important;
  border-color:rgba(47,124,246,.14)!important;
  box-shadow:0 7px 18px rgba(24,39,75,.045)!important;
}
.account-filter.active{
  background:linear-gradient(135deg,rgba(232,244,255,.96),rgba(255,255,255,.72))!important;
  border-color:rgba(47,124,246,.22)!important;
  box-shadow:inset 3px 0 0 #2f7cf6,0 7px 18px rgba(36,104,242,.06)!important;
}
.account-filter-main{
  appearance:none;
  border:0;
  background:transparent;
  width:100%;
  min-width:0;
  min-height:40px;
  display:grid;
  grid-template-columns:14px minmax(0,1fr);
  gap:7px;
  align-items:start;
  padding:7px 4px 7px 9px;
  text-align:left;
  cursor:pointer;
}
.account-filter-main .account-led{
  grid-column:1;
  margin:4px 0 0 0!important;
}
.account-text{
  grid-column:2;
  display:grid!important;
  gap:2px;
  min-width:0;
}
.account-text strong,
.account-text span,
.account-text em{
  display:block!important;
  min-width:0;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  grid-column:auto!important;
}
.account-text strong{font-size:12.6px!important;line-height:1.15;color:#172033!important;font-weight:800!important}
.account-text span{font-size:10.8px!important;line-height:1.15;color:#667085!important}
.account-text em{justify-self:start!important;margin-top:1px!important;padding:2px 5px!important;font-size:9.5px!important;line-height:1.1;border-radius:999px;background:#eef4ff;color:#175cd3;font-style:normal!important}
.account-settings-link{
  width:25px;
  height:25px;
  margin-right:5px;
  border-radius:8px;
  display:grid;
  place-items:center;
  color:#667085;
  font-size:13px;
  text-decoration:none;
  opacity:.72;
}
.account-settings-link:hover{
  opacity:1;
  background:#fff;
  color:#075fe7;
  box-shadow:0 5px 12px rgba(24,39,75,.08);
}
.sidebar-user-card,.sidebar-bottom{display:none!important}
.mail-toolbar{overflow:visible!important;position:relative;z-index:30}
.top-user-menu{position:relative;display:grid;place-items:center}
.top-avatar{position:relative!important}
.user-avatar.small{width:34px!important;height:34px!important;font-size:12px!important;flex:0 0 auto}
.user-dropdown{
  position:absolute;
  top:calc(100% + 9px);
  right:0;
  width:244px;
  display:none;
  padding:7px;
  border:1px solid rgba(206,219,238,.82);
  border-radius:14px;
  background:rgba(255,255,255,.98);
  box-shadow:0 22px 58px rgba(16,24,40,.18);
  z-index:999;
}
.top-user-menu.open .user-dropdown{display:grid;gap:4px}
.user-dropdown::before{content:"";position:absolute;right:15px;top:-6px;width:12px;height:12px;transform:rotate(45deg);background:#fff;border-left:1px solid rgba(206,219,238,.82);border-top:1px solid rgba(206,219,238,.82)}
.user-dropdown-head{display:flex;align-items:center;gap:9px;min-width:0;padding:8px 8px 10px;border-bottom:1px solid var(--line);margin-bottom:4px}
.user-dropdown a,.user-dropdown button{width:100%;border:0;background:transparent;text-align:left;border-radius:10px;padding:9px 10px;color:#243149;font-weight:700;font-size:13px;cursor:pointer;text-decoration:none;display:block}
.user-dropdown a:hover,.user-dropdown button:hover{background:#f1f6ff;color:#075fe7}.user-dropdown form{margin:0}
.reader-panel{
  display:flex!important;
  min-height:0!important;
  overflow:hidden!important;
}
.reader{
  flex:1 1 auto!important;
  min-height:0!important;
  height:100%!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain;
  padding-bottom:22px!important;
}
.reader-card{flex:0 0 auto!important;min-height:auto!important;max-width:100%}
.reader-body{overflow:visible!important;min-height:0!important;max-width:min(920px,100%)!important}
.mail-html-frame{display:block;width:100%;border:0;background:#fff;overflow:hidden;min-height:260px}
.quick-reply{flex:0 0 auto!important;margin-top:16px!important;margin-bottom:4px!important}
.app-settings-dialog{width:min(430px,calc(100vw - 24px));border:0;border-radius:18px;padding:0;background:#fff;box-shadow:0 24px 70px rgba(16,24,40,.24)}
.app-settings-dialog::backdrop{background:rgba(15,23,42,.26);backdrop-filter:blur(3px)}
.app-settings-dialog form{display:grid;gap:14px;padding:16px}.app-settings-dialog .compose-head{margin:-16px -16px 0;padding:13px 16px;border-bottom:1px solid var(--line);background:#f8fbff}.app-settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.app-settings-grid label{display:grid;gap:7px;font-size:13px;font-weight:750;color:#344054}.app-settings-grid select{height:40px;border:1px solid var(--line-strong);border-radius:10px;background:#fff;padding:0 10px}.settings-note{margin:0;color:#667085;font-size:12.5px;line-height:1.45}.app-settings-dialog .compose-foot{margin-top:0;border-top:1px solid var(--line);padding-top:12px}#appSettingsStatus{font-size:12.5px;color:#667085}
.mail-app.density-comfortable .message-row{min-height:90px!important;padding-top:16px!important;padding-bottom:16px!important}.mail-app.density-comfortable .folder-link{min-height:39px!important}.mail-app.density-comfortable .account-filter{min-height:56px!important}.mail-app.density-comfortable .account-filter-main{min-height:54px!important;padding-top:9px!important;padding-bottom:9px!important}.mail-app.theme-dark{--app-bg:#101828;--panel:#172033;--panel-soft:rgba(23,32,51,.88);--text:#eef4ff;--muted:#aab7ca;--muted-2:#8793a7;--line:#27364f;--line-strong:#34445f;background:#101828}.mail-app.theme-dark,.mail-app.theme-dark .mail-main,.mail-app.theme-dark .message-list-panel,.mail-app.theme-dark .reader-panel{background:#101828!important;color:#eef4ff}.mail-app.theme-dark .mail-toolbar,.mail-app.theme-dark .app-sidebar{background:#172033!important;border-color:#27364f}.mail-app.theme-dark .message-row,.mail-app.theme-dark .account-filter,.mail-app.theme-dark .folder-link{background:rgba(255,255,255,.04)!important;color:#eef4ff!important}.mail-app.theme-dark .message-row .subject,.mail-app.theme-dark .message-row .sender,.mail-app.theme-dark .reader-title-row h1{color:#fff!important}.mail-app.theme-dark .mail-html-frame{background:#fff!important}
@media(max-width:900px){.account-list{max-height:180px}.user-dropdown{right:-4px;width:min(260px,calc(100vw - 24px))}.app-settings-grid{grid-template-columns:1fr}.reader{padding-bottom:18px!important}.mail-html-frame{min-height:220px}}
.mail-app.theme-dark .account-text strong{color:#fff!important}.mail-app.theme-dark .account-text span,.mail-app.theme-dark .user-meta span{color:#b7c4d7!important}.mail-app.theme-dark .user-dropdown,.mail-app.theme-dark .app-settings-dialog{background:#172033;color:#eef4ff;border-color:#34445f}.mail-app.theme-dark .user-dropdown::before{background:#172033;border-color:#34445f}.mail-app.theme-dark .user-dropdown a,.mail-app.theme-dark .user-dropdown button{color:#eef4ff}.mail-app.theme-dark .user-dropdown a:hover,.mail-app.theme-dark .user-dropdown button:hover{background:#22314a;color:#fff}
@media (prefers-color-scheme: dark){.mail-app.theme-system{--app-bg:#101828;--panel:#172033;--panel-soft:rgba(23,32,51,.88);--text:#eef4ff;--muted:#aab7ca;--muted-2:#8793a7;--line:#27364f;--line-strong:#34445f;background:#101828}.mail-app.theme-system,.mail-app.theme-system .mail-main,.mail-app.theme-system .message-list-panel,.mail-app.theme-system .reader-panel{background:#101828!important;color:#eef4ff}.mail-app.theme-system .mail-toolbar,.mail-app.theme-system .app-sidebar{background:#172033!important;border-color:#27364f}.mail-app.theme-system .message-row,.mail-app.theme-system .account-filter,.mail-app.theme-system .folder-link{background:rgba(255,255,255,.04)!important;color:#eef4ff!important}.mail-app.theme-system .message-row .subject,.mail-app.theme-system .message-row .sender,.mail-app.theme-system .reader-title-row h1,.mail-app.theme-system .account-text strong{color:#fff!important}.mail-app.theme-system .mail-html-frame{background:#fff!important}.mail-app.theme-system .account-text span,.mail-app.theme-system .user-meta span{color:#b7c4d7!important}.mail-app.theme-system .user-dropdown,.mail-app.theme-system .app-settings-dialog{background:#172033;color:#eef4ff;border-color:#34445f}.mail-app.theme-system .user-dropdown::before{background:#172033;border-color:#34445f}.mail-app.theme-system .user-dropdown a,.mail-app.theme-system .user-dropdown button{color:#eef4ff}.mail-app.theme-system .user-dropdown a:hover,.mail-app.theme-system .user-dropdown button:hover{background:#22314a;color:#fff}}

/* v1: skipped-mail diagnostics + blocked remote image controls */
.skipped-mail-link{
  border:0;
  background:rgba(37,99,235,.08);
  color:#075fe7;
  border-radius:999px;
  padding:2px 8px;
  font:inherit;
  font-weight:800;
  cursor:pointer;
}
.skipped-mail-link:hover{background:rgba(37,99,235,.16)}
.folder-icon-warning::before{content:'!';font-weight:900;font-size:13px;color:#9a3412}
.message-row.unreadable{
  background:linear-gradient(90deg,rgba(255,247,237,.92),rgba(255,255,255,.72));
}
.message-row.unreadable .subject{color:#9a3412!important}
.blocked-images-bar{
  width:min(920px,100%);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:-4px 0 16px;
  padding:9px 11px;
  border:1px solid #bfdbfe;
  border-radius:12px;
  background:#eff6ff;
  color:#1e3a8a;
  font-size:13px;
  font-weight:750;
}
.blocked-images-bar button{
  flex:0 0 auto;
  border:0;
  border-radius:10px;
  padding:7px 10px;
  background:#2563eb;
  color:#fff;
  font-weight:850;
  cursor:pointer;
}
.blocked-images-bar button:hover{background:#1d4ed8}
.reader .mail-html-frame{pointer-events:auto}
.mail-app.theme-dark .blocked-images-bar{background:#172554;border-color:#1d4ed8;color:#dbeafe}
.mail-app.theme-dark .skipped-mail-link{background:#1e3a8a;color:#dbeafe}
@media(max-width:900px){.blocked-images-bar{align-items:flex-start;flex-direction:column}.blocked-images-bar button{width:100%}}