img{border-radius:60px;width:150px}body{color:#222;background-color:#494949;margin:0;font-family:system-ui,-apple-system,Malgun Gothic,sans-serif}h2{margin:0 0 16px;font-size:22px}button{font:inherit;cursor:pointer;background-color:#fff;border:1px solid #d5d8de;border-radius:6px;padding:8px 14px}.button-primary{color:#fff;background-color:#2f6fed;border-color:#2f6fed}.header{background-color:#fff;border-bottom:1px solid #e3e5ea;flex-wrap:wrap;align-items:center;gap:12px 24px;padding:12px 24px;display:flex}.logo{margin:0;font-size:20px}.nav{flex:1;gap:4px;display:flex}.nav-button{background-color:#0000;border-color:#0000}.nav-button.active{color:#2f6fed;background-color:#e8effd;font-weight:600}.user{align-items:center;gap:10px;display:flex}.main{max-width:760px;margin:0 auto;padding:32px 16px}.post-list{background-color:#fff;border:1px solid #e3e5ea;border-radius:8px;margin:0;padding:0;list-style:none}.post-item{flex-wrap:wrap;justify-content:space-between;gap:4px 16px;padding:14px 16px;display:flex}.post-item+.post-item{border-top:1px solid #e3e5ea}.post-meta{color:#777;font-size:14px}.login{background-color:#fff;border:1px solid #e3e5ea;border-radius:8px;max-width:340px;margin:0 auto;padding:24px}.login form{flex-direction:column;gap:14px;display:flex}.login label{flex-direction:column;gap:6px;font-size:14px;display:flex}.login input{font:inherit;border:1px solid #d5d8de;border-radius:6px;padding:9px 10px}
