/* Mesazhi Social Suite v3 styles */
.mesazhi-activity-page { max-width:1100px; margin:0 auto; padding:16px; font-family: Arial, sans-serif; }
.mas-container { display:flex; gap:20px; align-items:flex-start; }
.mas-left { width: 360px; }
.mas-stories { margin-bottom:12px; }
.mas-stories-placeholder { background:#f1f1f1; padding:12px; border-radius:8px; text-align:center; color:#666; }

.mas-postbox { background:#fff; border:1px solid #eee; padding:10px; border-radius:8px; margin-bottom:12px; display:flex; gap:10px; align-items:flex-start; }
.mp-avatar img { width:48px; height:48px; border-radius:50%; object-fit:cover; }
.mp-input textarea { width:100%; min-height:54px; border:1px solid #e6e6e6; border-radius:8px; padding:8px; resize:none; }

.mas-stream { flex:1; }
.mpc-body { background:#fff; padding:10px; border-radius:8px; box-shadow: 0 4px 12px rgba(0,0,0,0.04); margin-bottom:12px; }
.mpc-left img { width:56px; height:56px; border-radius:50%; object-fit:cover; }
.mpc-actions { margin-top:8px; display:flex; gap:10px; align-items:center; }

/* Reels */
.mesazhi-reels-outer { font-family: Arial, sans-serif; }
.mesazhi-reels-only { display:block; }
.mesazhi-reels-wrap { height:100vh; overflow-y:auto; scroll-snap-type:y mandatory; -webkit-overflow-scrolling:touch; padding-top:100px; padding-bottom:100px; }
.mesazhi-reel { height: calc(100vh - 200px); position:relative; scroll-snap-align:center; display:flex; align-items:center; justify-content:center; background:#e8e2da; color:#fff; }
.mr-media img, .mr-media video, .mr-iframe-wrap iframe { width:100%; height:100%; object-fit:contain; background:#e8e2da; display:block; position:relative; z-index:1; }
.mr-media::before { content: ""; position:absolute; top:0; left:0; right:0; bottom:0; background: linear-gradient(to bottom, #e8e2da 0%, #f5f3f0 50%, #e8e2da 100%); z-index:0; }
.mr-overlay { position:absolute; top:0; left:0; right:0; bottom:0; pointer-events:none; }
.mr-top { position:absolute; top:14px; left:12px; z-index:30; display:flex; align-items:center; gap:8px; pointer-events:auto; }
.mr-avatar { width:40px; height:40px; border-radius:50%; object-fit:cover; }
.mr-author-name { color:#000; font-weight:600; margin-left:6px; }
.mr-bottom-actions { position:absolute; bottom:22px; left:12px; right:12px; display:flex; justify-content:flex-end; gap:12px; z-index:40; pointer-events:auto; }
.action-button { background: rgba(0,0,0,0.4); border:none; color:#fff; font-size:18px; padding:10px; border-radius:50%; cursor:pointer; }
.action-button.liked i { color:#e74c3c; }
.mr-no-media { width:100%; height:100%; background: linear-gradient(to bottom, #e8e2da 0%, #f5f3f0 50%, #e8e2da 100%); color:#fff; display:flex; align-items:center; justify-content:center; font-size:18px; }

/* Responsive */
@media (max-width: 760px) {
    .mas-container { flex-direction: column; }
    .mas-left { width: 100%; }
    .mesazhi-reels-wrap { padding-top:100px; padding-bottom:100px; }
}