body { margin: 0; font-family: Verdana, Arial, sans-serif; font-size: 13px; background: #e8e8e8; color: #222; }
a { color: #003399; }

.login-wrap { max-width: 350px; margin: 60px auto; background: #fff; border: 1px solid #ccc; padding: 20px 30px; }
.login-wrap h1 { font-size: 20px; color: #003366; }
.error { color: #cc0000; }

.topbar { background: #003366; color: #fff; padding: 10px 20px; display: flex; justify-content: space-between; }
.logo { font-weight: bold; font-size: 16px; }
.userinfo a { color: #fff; }

.layout { display: flex; max-width: 900px; margin: 0 auto; background: #fff; border: 1px solid #ccc; border-top: none; }
.folders { width: 160px; background: #f0f0f0; border-right: 1px solid #ddd; padding: 10px 0; }
.folders a { display: block; padding: 8px 15px; text-decoration: none; color: #333; }
.folders a.active { background: #003366; color: #fff; }
.unread { color: #cc0000; font-weight: bold; }

.messages { flex: 1; padding: 15px 20px; }
table.message-list { border-collapse: collapse; width: 100%; }
table.message-list th { background: #dde5ee; text-align: left; padding: 6px; font-size: 12px; }
table.message-list td { padding: 6px; border-bottom: 1px solid #eee; }
tr.unread-row td { font-weight: bold; }

.message-view { max-width: 900px; margin: 0 auto; background: #fff; border: 1px solid #ccc; border-top: none; padding: 20px; }
.message-meta { color: #888; font-size: 12px; margin-bottom: 15px; }
.message-body { line-height: 1.6; }
.message-body a { font-weight: bold; }

.pagination { margin-top: 15px; }