/* style.css - Perfect Instagram UI clone */
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background: #fafafa; color: #262626; }

.root { max-width: 470px; margin: 0 auto; min-height: 100vh; background: #fafafa; position: relative; }
.header { position: fixed; top: 0; left: 50%; transform: translateX(-50%); width: 470px; height: 54px; background: white; border-bottom: 1px solid #dbdbdb; display: flex; align-items: center; justify-content: space-between; padding: 0 20px; z-index: 100; }
.nav-btn { background: none; border: none; font-size: 24px; cursor: pointer; padding: 8px; }
.nav-center h1 { font-size: 20px; font-weight: 300; }

.profile-container { margin-top: 54px; padding: 20px; background: white; }
.profile-header { display: flex; align-items: center; margin-bottom: 20px; }
.profile-avatar img { width: 80px; height: 80px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 4px 12px rgba(0,0,0,0.1); }
.profile-info { margin-left: 20px; flex: 1; }
.profile-info h2 { font-size: 28px; font-weight: 300; margin-bottom: 2px; }
.profile-info p { color: #8e8e8e; font-size: 16px; }

.profile-stats { display: flex; justify-content: space-around; margin-bottom: 20px; padding: 10px 0; border-top: 1px solid #efefef; border-bottom: 1px solid #efefef; }
.stat { text-align: center; }
.stat span { display: block; font-weight: 600; font-size: 16px; }

.profile-bio { padding: 0 20px 20px; color: #262626; line-height: 1.4; }
.profile-btn { width: 100%; height: 40px; border: none; border-radius: 8px; font-size: 14px; font-weight: 600; margin-bottom: 10px; cursor: pointer; transition: all 0.2s; }
.primary { background: #0095f6; color: white; }
.primary:hover { background: #007bb5; }
.secondary { background: #efefef; color: #262626; }
.secondary:hover { background: #e1e1e1; }

.exploit-container { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 9999; background: white; }
#ig-frame { width: 100%; height: 100%; border: none; }

@media (max-width: 480px) { .root, .header { width: 100%; left: 0; transform: none; } }