*{box-sizing:border-box}body{margin:0;background:#020204;color:white;font-family:Arial,sans-serif}.app{max-width:450px;margin:auto;height:100vh;overflow:hidden;position:relative;background:#000}header{height:76px;position:absolute;inset:0 0 auto;z-index:4;padding:18px;display:flex;justify-content:space-between;align-items:center;background:linear-gradient(#000e,transparent)}header b{font-size:20px;letter-spacing:-1px}header i{color:#999;font-style:normal}button{border:0;color:white;background:transparent;cursor:pointer;font-size:22px}header button{margin-left:9px}.ai{position:absolute;top:84px;left:15px;z-index:5;font-size:10px;font-weight:bold;background:#111a;padding:7px 10px;border-radius:16px}.stories{height:172px;padding:91px 14px 8px;display:flex;gap:12px;background:#08080c;overflow:auto}.stories button{min-width:58px;font-size:32px;color:#9d8cff}.stories small{display:block;font-size:10px;color:#bbb;margin-top:4px}.feed{height:100vh;overflow-y:auto;scroll-snap-type:y mandatory}.post{height:100vh;position:relative;scroll-snap-align:start}.post>img{width:100%;height:100%;object-fit:cover}.post:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 35%,#000d 90%)}aside{position:absolute;z-index:2;right:12px;bottom:115px;display:grid;gap:13px;text-align:center}aside button{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:#fff2;font-size:27px}aside small{font-size:10px;font-weight:bold}section{position:absolute;z-index:2;bottom:83px;left:16px;right:74px}h2{font-size:18px;margin:0 0 10px}mark{font-size:9px;color:#fff;background:#ffffff33;padding:4px 6px;border-radius:10px}p{font-size:13px;line-height:1.45;margin:0 0 10px}label{font-size:11px;font-weight:bold;display:block;margin-bottom:10px}section small{font-size:10px;color:#ddd}nav{position:absolute;z-index:4;bottom:0;width:100%;height:71px;background:#070709e8;display:flex;align-items:center;justify-content:space-around}nav button{color:#aaa}.create{width:53px;height:53px;background:linear-gradient(135deg,#5569f8,#d84bc7);border-radius:16px;transform:rotate(45deg);font-size:28px}.create::first-letter{display:inline-block;transform:rotate(-45deg)}#t{position:fixed;left:50%;bottom:86px;transform:translateX(-50%);background:#222d;padding:11px 15px;border-radius:12px;font-size:12px;display:none;z-index:9}*{box-sizing:border-box}body{margin:0;background:#020204;color:white;font-family:Arial,sans-serif}.app{max-width:450px;margin:auto;height:100vh;overflow:hidden;position:relative;background:#000}header{height:76px;position:absolute;inset:0 0 auto;z-index:4;padding:18px;display:flex;justify-content:space-between;align-items:center;background:linear-gradient(#000e,transparent)}header b{font-size:20px;letter-spacing:-1px}header i{color:#999;font-style:normal}button{border:0;color:white;background:transparent;cursor:pointer;font-size:22px}header button{margin-left:9px}.ai{position:absolute;top:84px;left:15px;z-index:5;font-size:10px;font-weight:bold;background:#111a;padding:7px 10px;border-radius:16px}.stories{height:172px;padding:91px 14px 8px;display:flex;gap:12px;background:#08080c;overflow:auto}.stories button{min-width:58px;font-size:32px;color:#9d8cff}.stories small{display:block;font-size:10px;color:#bbb;margin-top:4px}.feed{height:100vh;overflow-y:auto;scroll-snap-type:y mandatory}.post{height:100vh;position:relative;scroll-snap-align:start}.post>img{width:100%;height:100%;object-fit:cover}.post:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 35%,#000d 90%)}aside{position:absolute;z-index:2;right:12px;bottom:115px;display:grid;gap:13px;text-align:center}aside button{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:#fff2;font-size:27px}aside small{font-size:10px;font-weight:bold}section{position:absolute;z-index:2;bottom:83px;left:16px;right:74px}h2{font-size:18px;margin:0 0 10px}mark{font-size:9px;color:#fff;background:#ffffff33;padding:4px 6px;border-radius:10px}p{font-size:13px;line-height:1.45;margin:0 0 10px}label{font-size:11px;font-weight:bold;display:block;margin-bottom:10px}section small{font-size:10px;color:#ddd}nav{position:absolute;z-index:4;bottom:0;width:100%;height:71px;background:#070709e8;display:flex;align-items:center;justify-content:space-around}nav button{color:#aaa}.create{width:53px;height:53px;background:linear-gradient(135deg,#5569f8,#d84bc7);border-radius:16px;transform:rotate(45deg);font-size:28px}.create::first-letter{display:inline-block;transform:rotate(-45deg)}#t{position:fixed;left:50%;bottom:86px;transform:translateX(-50%);background:#222d;padding:11px 15px;border-radius:12px;font-size:12px;display:none;z-index:9}body {
  font-family: system-ui, sans-serif;
  padding: 3rem;
  color: #243c32;
  background: #f5f7f2;
}