/* Mada Home Modern v2 — polished mobile-first home */
:root{--home-bg:#f5f7fb;--home-card:#fff;--home-text:#172033;--home-muted:#7c8798;--home-line:#e8ecf3;--home-blue:#1877f2;--home-shadow:0 7px 24px rgba(25,45,80,.07)}
html,body{width:100%;max-width:100%;overflow-x:hidden}body{margin:0;background:var(--home-bg);color:var(--home-text);padding-top:76px;padding-bottom:92px}#app{width:100%;min-height:100vh;overflow-x:hidden}
.topbar{position:fixed!important;top:0!important;left:0!important;right:0!important;width:100%!important;height:68px!important;padding:0 12px!important;display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.97)!important;border-bottom:1px solid var(--home-line)!important;box-shadow:0 2px 16px rgba(30,45,70,.07);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);z-index:500!important}.topbar .brand{font-size:30px!important;line-height:1;white-space:nowrap}.top-actions{display:flex;align-items:center;gap:6px;min-width:0}.top-actions button{width:40px!important;height:40px!important;flex:0 0 40px!important;border-radius:50%!important}
.container{width:100%!important;max-width:720px!important;margin:0 auto!important;padding:8px 12px 24px!important}.stories{width:100%;display:flex;gap:9px;overflow-x:auto;overflow-y:hidden;padding:3px 2px 9px;margin:0 0 12px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}.story{min-width:96px!important;width:96px!important;height:138px!important;border-radius:18px!important;scroll-snap-align:start;box-shadow:0 5px 16px rgba(30,55,100,.12)!important}.add-story{min-width:96px!important}
.premium-banner{margin:0 0 12px!important}.card.composer{width:100%;padding:14px!important;border-radius:22px!important;box-shadow:var(--home-shadow)!important}.composer-row{width:100%;min-width:0}.composer-row .avatar{width:46px;height:46px;flex:0 0 46px}.composer input{min-width:0;width:100%;height:46px;font-size:15px}.composer-actions{width:100%;display:flex;gap:4px;overflow:hidden}.composer-actions button{min-width:0;flex:1;padding:9px 3px!important;white-space:nowrap;font-size:12px}
.feed{width:100%;margin-top:12px!important;gap:12px!important}.post{width:100%;min-width:0;overflow:hidden;padding:14px 14px 10px!important;border-radius:22px!important;box-shadow:var(--home-shadow)!important}.post-head{min-width:0}.post-head>div{min-width:0}.post-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.post-text{overflow-wrap:anywhere;word-break:break-word}.post-image{width:calc(100% + 28px)!important;margin-left:-14px!important;margin-right:-14px!important;max-height:560px!important;object-fit:cover}.post-actions{width:100%;display:flex;gap:2px}.post-actions button{min-width:0!important;flex:1!important;white-space:nowrap;padding:10px 3px!important;font-size:12px}
.reels-section{width:100%;max-width:100%;overflow:hidden}.reels-row{max-width:100%;overflow-x:auto}.modal{padding:14px}.modal-card{width:min(520px,100%);max-width:100%;max-height:82vh}
.bottom-nav{position:fixed!important;top:auto!important;bottom:max(8px,env(safe-area-inset-bottom))!important;left:8px!important;right:8px!important;width:auto!important;height:68px!important;max-width:720px!important;margin:0 auto!important;padding:3px!important;border-radius:21px!important;background:rgba(255,255,255,.98)!important;border:1px solid #e9edf3!important;box-shadow:0 9px 30px rgba(20,35,65,.16)!important;z-index:1000!important}.bottom-nav button{height:60px;min-width:0;max-width:none;flex:1;font-size:26px!important;margin:2px;padding:5px 2px;border-radius:15px}.bottom-nav span{font-size:10px!important;margin-top:4px!important}
@media(max-width:390px){.topbar{padding:0 8px!important}.brand{font-size:26px!important}.top-actions{gap:3px}.top-actions button{width:36px!important;height:36px!important;flex-basis:36px!important;font-size:17px!important}.container{padding-left:8px!important;padding-right:8px!important}.story,.add-story{min-width:88px!important;width:88px!important;height:128px!important}.composer{padding:11px!important}.composer-actions button{font-size:11px!important}.bottom-nav{left:5px!important;right:5px!important;height:64px!important}.bottom-nav button{height:57px;font-size:23px!important}.bottom-nav span{font-size:9px!important}}
@media(min-width:721px){.container{padding-top:14px!important}.topbar{padding-left:max(15px,calc((100vw - 720px)/2))!important;padding-right:max(15px,calc((100vw - 720px)/2))!important}.bottom-nav{left:50%!important;right:auto!important;width:min(700px,calc(100vw - 24px))!important;transform:translateX(-50%)!important}}
/* v3 — modern post cards */
.feed{display:flex!important;flex-direction:column!important;gap:14px!important}.feed .post{position:relative!important;background:#fff!important;border:1px solid rgba(20,35,65,.06)!important;border-radius:24px!important;box-shadow:0 5px 22px rgba(20,35,65,.07)!important;overflow:hidden!important;padding:0!important}.feed .post-head{display:flex!important;align-items:center!important;gap:10px!important;padding:14px 15px 10px!important;min-height:62px}.feed .post-head .avatar,.feed .post-head img{flex:0 0 46px!important;width:46px!important;height:46px!important;border-radius:50%!important;object-fit:cover!important}.feed .post-head .post-name{font-size:16px!important;font-weight:800!important;color:#172033!important;line-height:1.3}.feed .post-head small,.feed .post-head .post-time{display:block!important;color:#8a93a3!important;font-size:11px!important;margin-top:3px}.feed .post-text{padding:4px 16px 14px!important;font-size:16px!important;line-height:1.75!important;color:#202838!important;white-space:pre-wrap}.feed .post-image,.feed .post video{display:block!important;width:100%!important;max-width:100%!important;height:auto!important;max-height:620px!important;object-fit:cover!important;margin:0!important;border-radius:0!important}.feed .post-actions{display:flex!important;align-items:center!important;border-top:1px solid #edf0f5!important;padding:4px 8px!important;margin:0!important;min-height:50px}.feed .post-actions button{background:transparent!important;border:0!important;border-radius:12px!important;color:#687386!important;font-size:13px!important;font-weight:700!important;padding:10px 5px!important;min-height:42px!important;min-width:0!important;flex:1!important;white-space:nowrap}.feed .post-actions button:active{transform:scale(.96);background:#f1f4f8!important}.feed .post-actions button.liked,.feed .post-actions button.active{color:#1877f2!important}.feed .post-options-btn,.feed .more-btn{position:absolute!important;top:13px!important;left:12px!important;z-index:5!important;width:38px!important;height:38px!important;border-radius:50%!important;background:#f3f5f8!important;display:grid!important;place-items:center!important;font-size:20px!important}.feed .post-stats{display:flex!important;justify-content:space-between!important;align-items:center!important;padding:5px 15px!important;color:#8992a1!important;font-size:12px!important;border-bottom:1px solid #edf0f5!important}.feed .post-comments{padding:8px 12px!important}@media(max-width:480px){.feed{gap:12px!important}.feed .post-head{padding:13px 13px 9px!important}.feed .post-head .avatar,.feed .post-head img{width:44px!important;height:44px!important;flex-basis:44px!important}.feed .post-text{padding:3px 14px 13px!important;font-size:15px!important}.feed .post-actions button{font-size:12px!important;padding:9px 2px!important}.feed .post-image,.feed .post video{max-height:520px!important}}