*{box-sizing:border-box}
body{margin:0;background:#08090e;color:white;font-family:Arial,sans-serif}
.app{max-width:520px;margin:auto;height:100dvh;position:relative;overflow:hidden;background:#10111b}
.topbar{position:absolute;top:0;width:100%;z-index:5;text-align:center;padding:20px;background:#09091099}
.brand{font-weight:900;letter-spacing:2px;color:#fff}
.tabs{display:flex;justify-content:center;gap:25px;margin-top:18px}
.selected{border-bottom:3px solid #f12743;padding-bottom:8px}
.feed{height:100%;background:radial-gradient(circle,#421626,#08090e 75%)}
.video-placeholder{position:absolute;top:35%;width:100%;text-align:center}
.eagle{font-size:75px}
.video-placeholder h1{font-size:27px}
.video-placeholder p{color:#ff5268}
.actions{position:absolute;right:12px;bottom:145px;display:flex;flex-direction:column;gap:18px}
.actions button{border:0;background:#ffffff22;color:white;border-radius:50%;width:48px;height:48px;font-size:23px}
.video-info{position:absolute;left:17px;right:75px;bottom:105px;text-shadow:0 2px 5px black}
.video-info p{font-size:13px}
.bottom-nav{position:absolute;bottom:0;width:100%;display:flex;justify-content:space-around;align-items:center;background:#090a10;border-top:1px solid #333;padding:12px 5px}
.bottom-nav button{border:0;background:none;color:white;font-size:24px;display:flex;flex-direction:column;align-items:center}
.bottom-nav small{font-size:10px;margin-top:4px}
.bottom-nav .create{background:white;color:black;border-radius:8px;width:46px;height:35px;font-size:28px}
@media(min-width:600px){.app{box-shadow:0 0 70px #000}}
