*{box-sizing:border-box}html,body,#app{margin:0;height:100%;font-family:-apple-system,BlinkMacSystemFont,PingFang SC,Helvetica Neue,sans-serif;background:#ededed;color:#111}button,input{font:inherit}.page{height:100%;display:flex;flex-direction:column}.nav{height:48px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;background:#ededed;border-bottom:1px solid #ddd;flex-shrink:0}.nav h1{font-size:16px;margin:0;font-weight:600}.nav button,.link{border:0;background:none;color:#07c160;padding:0}.login{max-width:360px;margin:48px auto;padding:0 20px}.login h2{margin:0 0 8px;font-size:22px}.login p{margin:0 0 20px;color:#888;font-size:13px}.login label{display:block;font-size:13px;margin:12px 0 6px}.login input{width:100%;height:40px;border:1px solid #ddd;border-radius:8px;padding:0 12px;background:#fff}.primary{width:100%;height:42px;margin-top:18px;border:0;border-radius:8px;background:#07c160;color:#fff}.shortcuts{display:flex;gap:8px;margin-top:14px}.shortcuts button{flex:1;height:36px;border:1px solid #07c160;border-radius:8px;background:#fff;color:#07c160}.error{color:#fa5151;font-size:13px;margin-top:10px}.conv-item,.msg-row{display:flex}.conv-item{padding:12px 14px;background:#fff;border-bottom:1px solid #f0f0f0;gap:10px}.avatar{width:42px;height:42px;border-radius:6px;background:#07c160;color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0}.conv-main{flex:1;min-width:0}.conv-top{display:flex;justify-content:space-between;gap:8px}.conv-name{font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.conv-time{color:#999;font-size:12px}.conv-sub{margin-top:4px;color:#888;font-size:13px;display:flex;justify-content:space-between}.badge{min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:#fa5151;color:#fff;font-size:11px;line-height:18px;text-align:center}.messages{flex:1;overflow:auto;padding:12px}.msg-row{margin-bottom:10px}.msg-row.mine{justify-content:flex-end}.bubble{max-width:72%;padding:8px 10px;border-radius:6px;background:#fff;line-height:1.45;font-size:15px;word-break:break-word}.msg-row.mine .bubble{background:#95ec69}.composer{display:flex;gap:8px;padding:8px 10px 16px;background:#f7f7f7;border-top:1px solid #ddd}.composer input{flex:1;height:36px;border:0;border-radius:6px;padding:0 10px;background:#fff}.composer button{width:64px;border:0;border-radius:6px;background:#07c160;color:#fff}.empty{padding:48px 16px;text-align:center;color:#999}.start{padding:12px 14px;background:#fff;border-bottom:1px solid #f0f0f0;display:flex;gap:8px}.start input{flex:1;height:34px;border:1px solid #ddd;border-radius:6px;padding:0 8px}.start button{border:0;border-radius:6px;background:#07c160;color:#fff;padding:0 10px}.ws-status{display:flex;align-items:center;gap:6px;font-size:12px;color:#666;min-width:48px;justify-content:flex-end}.ws-dot{width:8px;height:8px;border-radius:50%;background:#fa5151}.ws-dot.on{background:#07c160}.ws-dot.retry{background:#fa9d3b}.avatar-wrap{position:relative;flex-shrink:0}.presence-dot{position:absolute;right:-2px;bottom:-2px;width:10px;height:10px;border-radius:50%;background:#07c160;border:2px solid #fff}.auth-switch{display:block;width:100%;margin-top:16px;border:0;background:none;color:#07c160}.tabbar{display:flex;height:52px;border-top:1px solid #ddd;background:#f7f7f7;flex-shrink:0}.tabbar button{flex:1;border:0;background:none;color:#888;position:relative}.tabbar button.active{color:#07c160;font-weight:600}.tab-badge{position:absolute;top:4px;left:calc(50% + 12px);min-width:16px;height:16px;padding:0 4px;border-radius:8px;background:#fa5151;color:#fff;font-size:10px;line-height:16px;text-align:center}.cell{display:flex;align-items:center;gap:10px;padding:12px 14px;background:#fff;border-bottom:1px solid #f0f0f0}.cell-name{font-size:15px}.cell-sub{margin-top:4px;color:#888;font-size:13px}.cell-actions{margin-left:auto;display:flex;gap:8px}.cell-actions button,.mini{border:0;border-radius:6px;background:#07c160;color:#fff;padding:4px 10px}.cell-actions .ghost{background:#fff;color:#07c160;border:1px solid #07c160}.form-card{padding:16px 14px;background:#fff}.form-card label{display:block;font-size:13px;margin:12px 0 6px}.form-card input{width:100%;height:40px;border:1px solid #ddd;border-radius:8px;padding:0 12px}.hint{color:#07c160;font-size:13px;padding:10px 14px}.scroll{flex:1;overflow:auto}.chat{flex:1;min-height:0;display:flex;flex-direction:column}.section-title{padding:10px 14px 6px;color:#888;font-size:12px}.empty.thin{padding:16px}.pad{padding:0 14px 10px}.check{width:18px;height:18px;border:1px solid #ccc;border-radius:50%;flex-shrink:0}.check.on{background:#07c160;border-color:#07c160}.sender{font-size:11px;color:#888;margin:0 0 4px 4px}.sys{margin:8px auto;color:#999;font-size:12px}.bubble.media{padding:4px;background:transparent}.msg-row.mine .bubble.media{background:transparent}.media-img,.media-video{display:block;max-width:200px;max-height:220px;border-radius:6px}.emoji-panel,.plus-panel{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;padding:8px 10px;background:#f7f7f7;border-top:1px solid #eee}.plus-panel{grid-template-columns:repeat(4,1fr)}.emoji-panel button,.plus-panel button{height:40px;border:0;background:#fff;border-radius:8px}.icon-btn{width:36px;border:0;background:none;font-size:20px;color:#333}.sheet-mask{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000059;display:flex;align-items:flex-end;z-index:20}.sheet{width:100%;background:#fff;border-radius:12px 12px 0 0;padding:8px 0 16px}.sheet button{width:100%;height:48px;border:0;background:#fff;border-bottom:1px solid #f3f3f3}.sheet .cancel{margin-top:8px;color:#888}
