:root{--text:#4f5663;--muted:#737b8a;--text-h:#141821;--bg:#f8fafc;--panel:#fff;--border:#d9dee7;--accent:#0f766e;--accent-bg:#e7f6f3;--button:#1f4f46;--danger:#b42318;--danger-border:#f1b5af;--danger-bg:#fff1ef;--success:#176b4d;--success-border:#a8dbc7;--success-bg:#effaf5;--sans:system-ui, "Segoe UI", Roboto, sans-serif;color:var(--text);background:var(--bg);font:16px/1.45 var(--sans);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0}#root{min-height:100svh}h1,h2,p{margin:0}h1{color:var(--text-h);font-size:28px;line-height:1.15}h2{color:var(--text-h);font-size:20px;line-height:1.2}.auth-screen{place-items:center;min-height:100svh;padding:24px;display:grid}.auth-panel{gap:18px;width:min(420px,100%);display:grid}.app-shell{grid-template-columns:minmax(320px,390px) 1fr;min-height:100svh;display:grid}.sidebar{border-right:1px solid var(--border);background:var(--panel);align-content:start;gap:28px;padding:24px;display:grid}.brand-row,.content-header,.actions{justify-content:space-between;align-items:center;gap:12px;display:flex}.content{align-content:start;gap:20px;padding:24px 32px;display:grid}.eyebrow{color:var(--accent);letter-spacing:0;text-transform:uppercase;font-size:12px;font-weight:700}.muted,.empty,small{color:var(--muted)}.account-error{color:var(--danger);margin-top:4px}form,section{gap:14px;display:grid}label{color:var(--text-h);text-align:left;gap:6px;font-size:14px;font-weight:600;display:grid}input{box-sizing:border-box;border:1px solid var(--border);background:var(--bg);width:100%;color:var(--text-h);font:inherit;border-radius:6px;padding:10px 12px}input:focus{outline:2px solid var(--accent);outline-offset:2px}button{border:1px solid var(--button);background:var(--button);color:#fff;font:inherit;cursor:pointer;border-radius:6px;padding:10px 14px;font-weight:700}button:disabled{cursor:wait;opacity:.65}.ghost{color:var(--text-h);border-color:var(--border);background:0 0}.danger{color:var(--danger);border-color:var(--danger-border);background:0 0}.form-grid{grid-template-columns:1fr auto;align-items:end;gap:12px;display:grid}.checkbox{flex-direction:row;align-items:center;gap:8px;height:42px;display:flex}.checkbox input{width:auto}.account-list{gap:8px;display:grid}.account{border-color:var(--border);color:var(--text-h);text-align:left;background:0 0;gap:2px;display:grid}.account.active{border-color:var(--accent);background:var(--accent-bg)}.feedback{border:1px solid var(--success-border);background:var(--success-bg);color:var(--success);text-align:left;border-radius:6px;padding:10px 12px}.feedback.error{border-color:var(--danger-border);background:var(--danger-bg);color:var(--danger)}.message-list{border-top:1px solid var(--border);max-height:48svh;display:grid;overflow:auto}.message{border-bottom:1px solid var(--border);color:inherit;font-weight:inherit;text-align:left;background:0 0;border-top:0;border-left:0;border-right:0;border-radius:0;grid-template-columns:1fr auto;gap:16px;width:100%;padding:16px 0;display:grid}.message h3{color:var(--text-h);margin:0 0 4px;font-size:16px}.message p{color:var(--muted);font-size:14px}.message time{color:var(--muted);white-space:nowrap;font-size:13px}.message.read h3{color:var(--muted);font-weight:500}.message.selected{background:var(--accent-bg);box-shadow:inset 3px 0 0 var(--accent);padding-left:12px}.message-preview{border-top:1px solid var(--border);gap:14px;min-height:220px;padding-top:18px;display:grid}.preview-header{justify-content:space-between;gap:16px;display:flex}.preview-header h2{margin:0 0 4px;font-size:20px}.preview-header time{color:var(--muted);white-space:nowrap;font-size:13px}.preview-body{background:var(--panel);border:1px solid var(--border);color:var(--text);font:inherit;white-space:pre-wrap;border-radius:6px;max-height:42svh;margin:0;padding:16px;line-height:1.5;overflow:auto}.preview-controls{justify-content:flex-start;gap:10px;display:flex}.preview-frame{border:1px solid var(--border);background:#fff;border-radius:6px;width:100%;min-height:320px}@media (width<=860px){.app-shell{grid-template-columns:1fr}.sidebar{border-right:none;border-bottom:1px solid var(--border)}.content{padding:20px}.content-header{flex-direction:column;align-items:flex-start}.preview-header{flex-direction:column}}