:root{--bg:#0a0a0a;--panel:#111;--panel2:#171717;--line:#2a2a2a;--text:#fff;--muted:#aaa;--primary:#FFDE59;--danger:#f44336}
*{box-sizing:border-box}body{margin:0;font-family:'Work Sans',system-ui,sans-serif;background:var(--bg);color:var(--text)}
.hidden{display:none!important}
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:18px;background:radial-gradient(circle at top,#171717,#090909)}
.login-card{width:100%;max-width:460px;background:#121212;border:1px solid #2a2a2a;border-radius:14px;padding:22px;box-shadow:0 10px 35px rgba(0,0,0,.45);display:flex;flex-direction:column;gap:10px}
.login-logo{height:42px;width:auto;object-fit:contain}.login-brand-row{display:flex;align-items:center;justify-content:flex-start}.muted{color:var(--muted);font-size:.92rem;margin:0 0 8px}
input,select,textarea,button{font:inherit}input,select,textarea{width:100%;background:#0d0d0d;color:#fff;border:1px solid #333;border-radius:10px;padding:11px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 1px rgba(255,222,89,.25)}
.row{display:flex;align-items:center;gap:8px;color:#d8d8d8}.row input{width:auto}
.btn{background:#222;border:1px solid #444;color:#fff;border-radius:10px;padding:9px 12px;cursor:pointer;transition:.2s}.btn:hover{background:#2e2e2e;border-color:#666}
.btn-primary{background:#1e1e1e;border-color:#FFDE59;color:#FFDE59}.btn-primary:hover{background:#2a2a2a;box-shadow:0 0 0 1px rgba(255,222,89,.4) inset}
.btn-danger{border-color:#92302b;color:#ff928a}.btn-danger:hover{background:#2a1716}.tiny{padding:6px 8px;font-size:.85rem}
.error{min-height:20px;color:#ff8d87}
.mail{height:100vh;display:flex;flex-direction:column}.topbar{height:64px;padding:8px 12px;background:#101010;border-bottom:1px solid #2a2a2a;display:flex;align-items:center;justify-content:space-between;gap:10px}
.brand-left{display:flex;align-items:center;gap:10px}.brand-logo{height:34px;width:auto}.brand-title{font-weight:700}.brand-sub{font-size:.78rem;color:#999}
.top-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.mail-shell{display:grid;grid-template-columns:240px 6px minmax(320px,1fr) 6px minmax(420px,1.25fr);height:calc(100vh - 64px)}
.sidebar,.messages,.viewer{overflow:auto;background:#101010}.sidebar{border-right:1px solid #222;padding:10px}.messages{border-right:1px solid #222;display:flex;flex-direction:column}.viewer{padding:12px}
.pane-title{font-size:.8rem;color:#888;margin:2px 0 8px;text-transform:uppercase;letter-spacing:.8px}
.mailbox-btn{display:block;width:100%;text-align:left;padding:9px 10px;margin-bottom:6px;border-radius:9px;border:1px solid #2b2b2b;background:#151515;color:#fff}
.mailbox-btn:hover,.mailbox-btn.active{border-color:#FFDE59;color:#FFDE59}
.splitter{background:#1f1f1f;cursor:col-resize}.splitter:hover{background:#FFDE59}
.toolbar{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:8px 10px;border-bottom:1px solid #262626;position:sticky;top:0;background:#111;z-index:3}
.toolbar-left,.toolbar-right{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.message-list{padding:0}.msg{display:grid;grid-template-columns:24px 1fr auto;gap:8px;align-items:start;padding:10px;border-bottom:1px solid #222;cursor:pointer}
.msg:hover{background:#171717}.msg.unseen{background:#13181f}.msg.selected{outline:1px solid #FFDE59;background:#1a1a1a}
.msg-sub{font-weight:600}.msg-meta{font-size:.78rem;color:#9c9c9c}.msg-date{font-size:.75rem;color:#868686;white-space:nowrap}
.placeholder{color:#9f9f9f;padding:12px}.mini{font-size:.82rem;color:#a5a5a5}
.mail-html{max-width:100%;overflow:auto;background:#fff;color:#000;padding:10px;border-radius:8px}
#composeDialog,#signatureDialog,#settingsDialog{width:min(980px,95vw);border:1px solid #333;border-radius:12px;background:#111;color:#fff}
.dialog-head{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border-bottom:1px solid #2a2a2a}
#composeForm{display:flex;flex-direction:column;gap:8px;padding:10px}.editor{min-height:190px;border:1px solid #333;border-radius:10px;padding:10px;background:#0d0d0d;color:#fff;overflow:auto}
.editor:focus{outline:none;border-color:#FFDE59}.editor-toolbar{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.editor-toolbar select{width:auto}.editor-toolbar input{width:120px}.ai-suggestion{font-size:.82rem;color:#8eb4ff;min-height:18px}
.signature-preview{border:1px solid #333;background:#0d0d0d;border-radius:10px;padding:10px;min-height:70px}
menu{display:flex;justify-content:flex-end;gap:8px;padding:10px 0 0;margin:0}
.context-menu{position:fixed;z-index:9999;background:#121212;border:1px solid #3a3a3a;border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.5);padding:6px;min-width:180px}
.context-menu button{width:100%;text-align:left;background:transparent;border:0;color:#fff;padding:8px 10px;border-radius:8px}.context-menu button:hover{background:#242424}
.drafty-fab{position:fixed;right:16px;bottom:16px;width:56px;height:56px;border-radius:50%;background:#111;border:2px solid #FFDE59;color:#FFDE59;font-weight:700;z-index:90}
.drafty-panel{position:fixed;right:16px;bottom:80px;width:min(380px,92vw);height:420px;background:#111;border:1px solid #333;border-radius:12px;display:flex;flex-direction:column;z-index:90}
.drafty-head{padding:10px;border-bottom:1px solid #2a2a2a;font-weight:700}.drafty-welcome{padding:8px 10px;color:#bbb;border-bottom:1px solid #232323}
.drafty-chat{flex:1;overflow:auto;padding:8px}.drafty-row{display:flex;gap:8px;padding:8px;border-top:1px solid #2a2a2a}.drafty-row input{flex:1}
@media (max-width:1024px){.topbar{height:auto;align-items:flex-start;flex-direction:column}.mail-shell{height:calc(100vh - 108px)}.mail-shell{grid-template-columns:1fr;grid-template-rows:200px 280px 1fr}.splitter{display:none}.sidebar,.messages{border-right:none;border-bottom:1px solid #252525}}
@media (max-width:640px){.top-actions{width:100%}.top-actions .btn{flex:1}.msg{grid-template-columns:20px 1fr}.editor{min-height:150px}}