* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Hiragino Sans GB',sans-serif; background:#f5f5f5; color:#333; font-size:14px; }
.page { display:none; min-height:100vh; }
.page.active { display:flex; flex-direction:column; }

/* Login */
.login-box { width:100%; max-width:400px; margin:60px auto; padding:30px; background:#fff; border-radius:12px; box-shadow:0 2px 12px rgba(0,0,0,0.08); }
.login-box h1 { text-align:center; font-size:28px; margin-bottom:4px; }
.subtitle { text-align:center; color:#999; margin-bottom:20px; font-size:14px; }
.tab-bar { display:flex; margin-bottom:20px; border-bottom:2px solid #f0f0f0; }
.tab-bar .tab { flex:1; text-align:center; padding:10px; cursor:pointer; font-size:15px; color:#999; }
.tab-bar .tab.active { color:#1890ff; border-bottom:2px solid #1890ff; margin-bottom:-2px; }
input[type="tel"],input[type="password"],input[type="text"],select,textarea { width:100%; padding:12px; margin:8px 0; border:1px solid #d9d9d9; border-radius:8px; font-size:15px; outline:none; }
input:focus,textarea:focus { border-color:#1890ff; }
button { width:100%; padding:12px; background:#1890ff; color:#fff; border:none; border-radius:8px; font-size:16px; cursor:pointer; margin-top:8px; }
button:active { background:#096dd9; }
.btn-sm { width:auto; padding:4px 12px; font-size:12px; background:#f0f0f0; color:#666; }
.btn-back { width:auto; padding:4px 12px; background:#f0f0f0; color:#333; font-size:18px; border-radius:4px; }
.btn-send { width:auto; padding:8px 16px; background:#1890ff; }
.btn-menu { width:auto; padding:8px 12px; background:#f0f0f0; color:#333; font-size:18px; border-radius:4px; }
.role-select { display:flex; gap:20px; margin:10px 0; padding:10px 0; }
.role-select label { font-size:15px; cursor:pointer; }
.agreement { font-size:11px; color:#999; margin:8px 0; line-height:1.5; background:#f9f9f9; padding:8px; border-radius:4px; }

/* Main */
.main-header { display:flex; justify-content:space-between; align-items:center; padding:12px 16px; background:#fff; border-bottom:1px solid #f0f0f0; }
.main-header h2 { font-size:18px; }
.header-actions { display:flex; align-items:center; gap:8px; font-size:13px; }
.bottom-nav { display:flex; position:fixed; bottom:0; left:0; right:0; background:#fff; border-top:1px solid #eee; z-index:100; }
.nav-item { flex:1; display:flex; flex-direction:column; align-items:center; padding:8px 0; cursor:pointer; position:relative; }
.nav-item.active { color:#1890ff; }
.nav-icon { font-size:20px; }
.nav-label { font-size:11px; margin-top:2px; }
.badge { position:absolute; top:2px; right:50%; margin-right:-18px; background:#ff4d4f; color:#fff; font-size:10px; padding:1px 5px; border-radius:10px; min-width:16px; text-align:center; }
.tab-content { flex:1; padding-bottom:60px; overflow-y:auto; }

/* Sessions list */
.session-item { display:flex; align-items:center; padding:14px 16px; background:#fff; border-bottom:1px solid #f5f5f5; cursor:pointer; }
.session-item:active { background:#f9f9f9; }
.session-avatar { width:44px; height:44px; border-radius:50%; background:#1890ff; color:#fff; display:flex; align-items:center; justify-content:center; font-size:18px; margin-right:12px; flex-shrink:0; }
.session-info { flex:1; overflow:hidden; }
.session-name { font-size:15px; font-weight:500; }
.session-last { font-size:12px; color:#999; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:2px; }
.session-meta { text-align:right; flex-shrink:0; margin-left:8px; }
.session-time { font-size:11px; color:#999; }
.session-unread { background:#ff4d4f; color:#fff; font-size:10px; padding:1px 6px; border-radius:10px; margin-top:4px; display:inline-block; }

/* Chat page */
.chat-header { display:flex; align-items:center; padding:10px 16px; background:#fff; border-bottom:1px solid #f0f0f0; }
.chat-header span { margin-left:8px; font-size:16px; font-weight:500; }
.compliance-hint { font-size:10px; color:#faad14; margin-left:auto; background:#fffbe6; padding:2px 8px; border-radius:4px; }
.chat-messages { flex:1; overflow-y:auto; padding:12px 16px; background:#f5f5f5; }
.msg { margin-bottom:12px; display:flex; }
.msg.sent { flex-direction:row; }
.msg-bubble { max-width:70%; padding:10px 14px; border-radius:12px; font-size:14px; line-height:1.6; word-break:break-all; position:relative; }
.msg.received .msg-bubble { background:#fff; border-top-left-radius:4px; }
.msg.sent .msg-bubble { margin-left: 0; background:#1890ff; color:#fff; border-top-right-radius:4px; }
.msg-time { font-size:10px; color:#999; margin-top:2px; }
.msg.sent .msg-time { text-align:left; }
.msg-risk { font-size:10px; color:#faad14; background:#fffbe6; padding:1px 6px; border-radius:3px; margin-top:2px; display:inline-block; }
.chat-input { display:flex; align-items:center; padding:8px 12px; background:#fff; border-top:1px solid #f0f0f0; gap:8px; }
.chat-input input { flex:1; margin:0; }
.chat-menu { position:fixed; bottom:56px; left:0; right:0; background:#fff; border-top:1px solid #eee; padding:8px 0; z-index:99; }
.chat-menu button { width:100%; text-align:left; padding:12px 24px; background:#fff; color:#333; border-radius:0; border-bottom:1px solid #f5f5f5; font-size:14px; }
.chat-menu button:active { background:#f9f9f9; }

/* Materials */
.material-item { padding:14px 16px; background:#fff; border-bottom:1px solid #f5f5f5; cursor:pointer; }
.material-item:active { background:#f9f9f9; }
.material-title { font-size:15px; font-weight:500; }
.material-meta { font-size:12px; color:#999; margin-top:4px; }
.material-tag { display:inline-block; font-size:11px; padding:2px 8px; border-radius:4px; margin-right:4px; margin-top:4px; }
.tag-academic { background:#e6f7ff; color:#1890ff; }
.tag-product { background:#fff7e6; color:#fa8c16; }

/* Meetings */
.meeting-item { padding:14px 16px; background:#fff; border-bottom:1px solid #f5f5f5; }
.meeting-title { font-size:15px; font-weight:500; }
.meeting-time-loc { font-size:12px; color:#666; margin-top:4px; }
.meeting-actions { margin-top:8px; }
.meeting-actions button { width:auto; padding:6px 16px; font-size:12px; margin-right:8px; }

/* More tab */
.more-section { padding:16px; background:#fff; margin-bottom:8px; }
.more-section h3 { font-size:15px; margin-bottom:12px; }
.more-item { display:flex; justify-content:space-between; align-items:center; padding:12px 0; border-bottom:1px solid #f5f5f5; cursor:pointer; }
.more-item:last-child { border-bottom:none; }
.more-item:active { background:#f9f9f9; }
.more-arrow { color:#ccc; }

/* Modal */
.modal-overlay { position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.5); z-index:200; display:flex; align-items:flex-end; }
.modal-box { width:100%; background:#fff; border-radius:16px 16px 0 0; padding:20px; max-height:80vh; overflow-y:auto; }
.modal-title { font-size:17px; font-weight:600; margin-bottom:16px; text-align:center; }
.modal-close { text-align:center; margin-top:12px; }
.modal-close button { background:#f0f0f0; color:#666; }
textarea { width:100%; padding:10px; border:1px solid #d9d9d9; border-radius:8px; font-size:14px; resize:vertical; min-height:80px; outline:none; }
select { width:100%; padding:10px; border:1px solid #d9d9d9; border-radius:8px; font-size:14px; background:#fff; }

/* Sensitive warning */
.sensitive-warning { background:#fff2f0; border:1px solid #ffccc7; border-radius:8px; padding:12px; margin:8px 0; }
.sensitive-warning p { color:#cf1322; font-size:13px; }

/* Friend search */
.search-box { padding:12px 16px; background:#fff; border-bottom:1px solid #f0f0f0; }
.search-box input { margin:0; }
.friend-item { display:flex; align-items:center; padding:12px 16px; background:#fff; border-bottom:1px solid #f5f5f5; }
.friend-avatar { width:40px; height:40px; border-radius:50%; background:#1890ff; color:#fff; display:flex; align-items:center; justify-content:center; margin-right:12px; flex-shrink:0; }
.friend-info { flex:1; }
.friend-name { font-size:15px; font-weight:500; }
.friend-dept { font-size:12px; color:#999; }

/* Responsive */
@media(min-width:768px) {
  .login-box { margin-top:100px; }
  .msg-bubble { max-width:50%; }
}
